open-index/open-npm huggingface dataset:
npm package: @firstcoders/loader-element
Description: Webcomponent soundws-loader following open-wc recommendations
Author: The First Coders Team
Latest version: 1.0.1-beta.1

# \<soundws-loader>

Renders a loader spinner

This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.

## Installation

```bash
npm i @firstcoders/loader-element
```

## Usage

```html
<script type="module">
  import '@firstcoders/loader-element/soundws-loader.js';
</script>

<soundws-loader></soundws-loader>
```

## Linting and formatting

To scan the project for linting and formatting errors, run

```bash
npm run lint
```

To automatically fix linting and formatting errors, run

```bash
npm run format
```

## Testing with Web Test Runner

To execute a single test run:

```bash
npm run test
```

To run the tests in interactive watch mode run:

```bash
npm run test:watch
```

## Tooling configs

For most of the tools, the configuration is in the `package.json` to minimize the amount of files in your project.

If you customize the configuration a lot, you can consider moving them to individual files.

## Local Demo with `web-dev-server`

```bash
npm start
```

To run a local development server that serves the basic demo located in `demo/index.html`
npm package: @firstcoders/mask-element
Description: Webcomponent soundws-mask following open-wc recommendations
Author: The First Coders Team
Latest version: 1.0.1-beta.1

# \<soundws-mask>

This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.

## Installation

```bash
npm i @firstcoders/mask-element
```

## Usage

```html
<script type="module">
  import '@firstcoders/mask-element/soundws-mask.js';
</script>

<soundws-mask></soundws-mask>
```

## Linting and formatting

To scan the project for linting and formatting errors, run

```bash
npm run lint
```

To automatically fix linting and formatting errors, run

```bash
npm run format
```

## Testing with Web Test Runner

To execute a single test run:

```bash
npm run test
```

To run the tests in interactive watch mode run:

```bash
npm run test:watch
```

## Tooling configs

For most of the tools, the configuration is in the `package.json` to minimize the amount of files in your project.

If you customize the configuration a lot, you can consider moving them to individual files.

## Local Demo with `web-dev-server`

```bash
npm start
```

To run a local development server that serves the basic demo located in `demo/index.html`
npm package: @firstcoders/player-button-element
Description: Webcomponent soundws-player-button following open-wc recommendations
Author: The First Coders Team
Latest version: 1.1.0-beta.0

# \<soundws-player-button>

Renders a button with a player svg icon

This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.

## Installation

```bash
npm i @firstcoders/player-button-element
```

## Usage

```html
<script type="module">
  import '@firstcoders/player-button-element/soundws-player-button.js';
</script>

<soundws-player-button></soundws-player-button>
```

## Linting and formatting

To scan the project for linting and formatting errors, run

```bash
npm run lint
```

To automatically fix linting and formatting errors, run

```bash
npm run format
```

## Testing with Web Test Runner

To execute a single test run:

```bash
npm run test
```

To run the tests in interactive watch mode run:

```bash
npm run test:watch
```

## Tooling configs

For most of the tools, the configuration is in the `package.json` to minimize the amount of files in your project.

If you customize the configuration a lot, you can consider moving them to individual files.

## Local Demo with `web-dev-server`

```bash
npm start
```

To run a local development server that serves the basic demo located in `demo/index.html`
npm package: @firstcoders/range-element
Description: Webcomponent soundws-range following open-wc recommendations
Author: team First Coders
Latest version: 1.0.1-beta.1

# \<soundws-range>

A styled range slider

This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.

## Installation

```bash
npm i @firstcoders/range-element
```

## Usage

```html
<script type="module">
  import '@firstcoders/range-element/soundws-range.js';
</script>

<soundws-range></soundws-range>
```

## Linting and formatting

To scan the project for linting and formatting errors, run

```bash
npm run lint
```

To automatically fix linting and formatting errors, run

```bash
npm run format
```

## Testing with Web Test Runner

To execute a single test run:

```bash
npm run test
```

To run the tests in interactive watch mode run:

```bash
npm run test:watch
```

## Tooling configs

For most of the tools, the configuration is in the `package.json` to minimize the amount of files in your project.

If you customize the configuration a lot, you can consider moving them to individual files.

## Local Demo with `web-dev-server`

```bash
npm start
```

To run a local development server that serves the basic demo located in `demo/index.html`
npm package: @firstcoders/slider-element
Description: Webcomponent soundws-slider following open-wc recommendations
Author: The First Coders Team
Latest version: 1.0.1-beta.1

# \<soundws-slider>

This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.

## Installation

```bash
npm i @firstcoders/slider-element
```

## Usage

```html
<script type="module">
  import '@firstcoders/slider-element/soundws-slider.js';
</script>

<soundws-slider></soundws-slider>
```

## Linting and formatting

To scan the project for linting and formatting errors, run

```bash
npm run lint
```

To automatically fix linting and formatting errors, run

```bash
npm run format
```

## Testing with Web Test Runner

To execute a single test run:

```bash
npm run test
```

To run the tests in interactive watch mode run:

```bash
npm run test:watch
```

## Tooling configs

For most of the tools, the configuration is in the `package.json` to minimize the amount of files in your project.

If you customize the configuration a lot, you can consider moving them to individual files.

## Local Demo with `web-dev-server`

```bash
npm start
```

To run a local development server that serves the basic demo located in `demo/index.html`
npm package: @firstcoders/waveform-element
Description: Webcomponent soundws-waveform following open-wc recommendations
Author: The First Coders Team
Latest version: 1.0.1-beta.1

# \<soundws-waveform>

This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.

## Installation

```bash
npm i @firstcoders/waveform-element
```

## Usage

```html
<script type="module">
  import '@firstcoders/waveform-element/soundws-waveform.js';
</script>

<soundws-waveform></soundws-waveform>
```

## Linting and formatting

To scan the project for linting and formatting errors, run

```bash
npm run lint
```

To automatically fix linting and formatting errors, run

```bash
npm run format
```

## Testing with Web Test Runner

To execute a single test run:

```bash
npm run test
```

To run the tests in interactive watch mode run:

```bash
npm run test:watch
```

## Tooling configs

For most of the tools, the configuration is in the `package.json` to minimize the amount of files in your project.

If you customize the configuration a lot, you can consider moving them to individual files.

## Local Demo with `web-dev-server`

```bash
npm start
```

To run a local development server that serves the basic demo located in `demo/index.html`