open-index/open-npm huggingface dataset:
npm package: @lwce/eslint-config-experience-cloud
Description: An ESLint plugin for LWC developers in Experience Cloud.
Author: Manan Jhaveri
Latest version: 0.6.22

# `@lwce/eslint-config-experience-cloud`

This config will export the following - 
- `recommended` rules in [eslint-config-lwc](https://github.com/salesforce/eslint-config-lwc) 
- `base` rules in [eslint-config-locker](https://www.npmjs.com/package/@locker/eslint-config-locker)

On top of these default rules, we also add some custom rules from [eslint-plugin-lwc-experience-cloud](../eslint-plugin-lwc-experience-cloud/README.md).

## Usage

While consuming we can create a .eslintrc.js file in the consumer package and add following lines.

```js
module.exports = {
    extends: [
        '@lwce/eslint-config-experience-cloud',
    ],
};
```

For more information please check the official [ESLint documentation](https://eslint.org/)
npm package: @lwce/eslint-plugin-lwc-experience-cloud
Description: An ESLint plugin with custom rules for LWC developers in Experience Cloud.
Author: Manan Jhaveri
Latest version: 0.6.22

# `@lwce/eslint-plugin-experience-cloud`

Collection of ESLint rules for LWC Experience Cloud developers.

## Installation

```sh
$ npm install eslint @lwce/eslint-plugin-lwc-experience-cloud --save-dev
```

## Usage

Add this plugin to your ESLint configuration and extend your desired configuration. See [ESLint documentation](http://eslint.org/docs/user-guide/configuring#configuring-plugins) for details.

```js
module.exports = {
  plugins: ['@lwce/eslint-plugin-lwc-experience-cloud'],
  rules: {
    '@lwce/lwc-experience-cloud/no-static-color-values': 'warn',
  }
};
```

## Rules

| Rule ID                                                                                | Description                                                             | Fixable |
| -------------------------------------------------------------------------------------- | ----------------------------------------------------------------------- | ------- |
| [lwc-experience-cloud/no-static-color-values](./docs/rules/colors-no-static-values.md) | Disallow static color values in literals.                               |         |
npm package: @lwce/lwc-storybook-cli
Description: Create a storybook for your application
Latest version: 0.6.22

# LWC Storybook CLI
A CLI tool for quickly getting started with storybook in LWC projects

## Getting started
1. Add lwc-storybook-cli as a dependency to your project:

```bash
npm install --save-dev @lwce/lwc-storybook-cli

# OR

yarn add --dev @lwce/lwc-storybook-cli
```

2. Add to your package.json:

```json
"scripts": {
  "storybook:build": "lwc-storybook build",
  "storybook:start": "lwc-storybook start",
}
```

3. Make sure your lwc.config.json has the following module entry:

```json
"modules": [
    ...
    {
        "npm": "lwc-components-lightning"
    }
],
```

4. Optionally, add a `mocked-core-modules-data.js` file to the root of
   your project. The file should export a single `getData` function:

```js
export function getData() {
    return {
        // Any data defined will be provided to the mocked core modules
    }
}
```

5. Add `.storybook` to your .gitignore

## Commands

### start

Start storybook in development mode

Command: `lwc-storybook start`

### build

Build storybook with an output that can be hosted on a static web
server. Defaults the output to `.storybook/build/public`

Command: `lwc-storybook build`

### story

Follow the prompts to generate a story

Command: `lwc-storybook story`
npm package: @lwce/router
Description: A LWC router that supports server-side rendering
Author: Bret Little
Latest version: 1.0.0

# `@lwce/router`

A lightning web component for building declarative routing within
single-page applications.

## Usage

1. Install: `npm install --save @lwce/router`
2. Add `{"npm": "@lwce/router"}` to your `lwc.config.json` for module resolution. [See example](https://github.com/LWC-Essentials/router/blob/master/packages/sample-app/lwc.config.json)


Note: it is highly recommended that the `synthetic-shadow` be used.
Currently declarative routing is impossible with the native shadow dom,
because slotted elements are always rendered (whether active or not).

## API

### lwce-router
The primary component which must wrap all other components that have routing applied.

**Props:**

`base`: The base URL for all locations. If your app is served
from a sub-directory on your server, you’ll want to set this to the
sub-directory. A properly formatted basename should have a leading
slash, but no trailing slash.

Example:

```html
<lwce-router base="/my-app">
  ...
</lwce-router>
```

### lwce-route
Defines a route who's content will be rendered when the URL is active

**Props:**

`children`: Whatever HTML is passed within the slot will only be rendered if the URL is active.

`path`: Any valid URL path or array of paths that path-to-regexp@^1.7.0 understands.

`strict`: When true, a path that has a trailing slash will only match a
location.pathname with a trailing slash

`exact`: When true, will only match if the path matches the
location.pathname exactly

`sensitive`: When true, will match if the path is case sensitive.

`default`: When true, will match if no other paths are matched. Use for 404 pages.

Example:

```html
<lwce-route path="/products/:productId">
  <my-product></my-product>
</lwce-route>
```

### lwce-link
Define a link to navigate between your routes

**Props:**

`title`: The accessible text representing your link

`href`: A string representation of your destination. This can be a relative path.

`class-name`:  Set a class to style your link

Example:

```html
<lwce-link class-name="styled-link" path="/products/1234" title="Product details">
  Product details
</lwce-link>
```

### routeParams
Use the `routeParams` wire adapter to access URL parameters

Example:

```js
import { LightningElement, api, wire } from 'lwc';
import { routeParams } from '@lwce/router';

export default class Link extends LightningElement {
  @wire(routeParams) params;
}
```

And usage within the template:

```html
<template>
  <h1>Product: {params.productId}</h1>
</template>
```

### history
Use the `history` wire adapter to imperatively change routes.

Example:

```js
import { LightningElement, api, wire } from 'lwc';
import { history } from '@lwce/router';

export default class Link extends LightningElement {
  @wire(history) history;

  onClickHandler(e) {
    this.history.push('/settings');
  }
}
```
npm package: @lwce/stylelint-config-experience-cloud
Description: Style Linting Tool
Author: bhavesh.kumar
Latest version: 0.6.22

# `@lwce/stylelint-config-experience-cloud`

This package will export Default Recommended Rules suggested by [stylelint](https://github.com/stylelint/stylelint-config-recommended) & also Custom Rules / Plugins.

Currently we only have a single Plugin which is Linting Colors [lwce/color-no-static-values](lib/rules/README.md). i.e. Our CSS files should not have any Fixed Colors, all the colors should be used via variables. 

## Usage

While consuming we can create a .stylelintrc.json file in the consumer package and add following lines.

```
{
    "extends":"@lwce/stylelint-config-experience-cloud",
    "defaultSeverity": "warning"
}
```

For more information please check [Stylelint documenation](https://stylelint.io/)