open-index/open-npm huggingface dataset:
npm package: @lrnwebcomponents/course-design
Description: some different elements specific to the design of educational materials. Lots of small elements and a catch all repo
Author: haxtheweb
Latest version: 8.0.2

# &lt;course-design&gt;

Design
> some different elements specific to the design of educational materials. Lots of small elements and a catch all repo

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing JS module / web component */
import '@lrnwebcomponents/course-design/course-design.js';
/* At top of an application with build routine */
<script type="module" src="@lrnwebcomponents/course-design/course-design.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/course-design/course-design.js';
  // imperative form
  import {CourseDesign} from '@lrnwebcomponents/course-design';
  // if you don't have a build routine and need to reference directly
  import './node_modules/@lrnwebcomponents/course-design/course-design.js';
</script>
// via unpkg CDN (good for testing)
<script type="module" src="https://unpkg.com/@lrnwebcomponents/course-design/course-design.js"></script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
$ yarn start
```

## Test

```bash
$ yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
$ yarn run build
```

## Contributing

1. Fork it! `git clone https://github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

Design (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[Apache-2.0 License](http://opensource.org/licenses/Apache-2.0)
npm package: @lrnwebcomponents/course-model
Description: view 3d models with multiple angel rotation for a course experience
Author: haxtheweb
Latest version: 8.0.2

# &lt;course-model&gt;

Model
> view 3d models with multiple angel rotation for a course experience

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing JS module / web component */
import '@lrnwebcomponents/course-model/course-model.js';
/* At top of an application with build routine */
<script type="module" src="@lrnwebcomponents/course-model/course-model.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/course-model/course-model.js';
  // imperative form
  import {CourseModel} from '@lrnwebcomponents/course-model';
  // if you don't have a build routine and need to reference directly
  import './node_modules/@lrnwebcomponents/course-model/course-model.js';
</script>
// via unpkg CDN (good for testing)
<script type="module" src="https://unpkg.com/@lrnwebcomponents/course-model/course-model.js"></script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
yarn start
```

## Test

```bash
yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
yarn run build
```

## Contributing

1. Fork it! `git clone https://github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

Model (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[ License](http://opensource.org/licenses/)
npm package: @lrnwebcomponents/csv-render
Description: Remote render a CSV file in place as an accessible table.
Author: haxtheweb
Latest version: 8.0.2

# &lt;csv-render&gt;

Render
> Render a CSV file as a highly accessible table element

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing module / web component */
import '@lrnwebcomponents/csv-render/csv-render.js';
/* At top of an application */
<script type="module" src="node_modules/@lrnwebcomponents/csv-render/csv-render.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/csv-render/csv-render.js';

  import {CsvRender} from '@lrnwebcomponents/csv-render/csv-render.js';
</script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
$ yarn start
```

## Test

```bash
$ yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
$ yarn run build
```

## Contributing

1. Fork it! `git clone git@github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

Render (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[Apache-2.0 License](http://opensource.org/licenses/Apache-2.0)
npm package: @lrnwebcomponents/d-d-d
Description: design, develop, destroy the competition
Author: haxtheweb
Latest version: 8.0.2

# &lt;d-d-d&gt;

D
> design, develop, destroy the competition

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing JS module / web component */
import '@lrnwebcomponents/d-d-d/d-d-d.js';
/* At top of an application with build routine */
<script type="module" src="@lrnwebcomponents/d-d-d/d-d-d.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/d-d-d/d-d-d.js';
  // imperative form
  import {DDD} from '@lrnwebcomponents/d-d-d';
  // if you don't have a build routine and need to reference directly
  import './node_modules/@lrnwebcomponents/d-d-d/d-d-d.js';
</script>
// via unpkg CDN (good for testing)
<script type="module" src="https://unpkg.com/@lrnwebcomponents/d-d-d/d-d-d.js"></script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
yarn start
```

## Test

```bash
yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
yarn run build
```

## Contributing

1. Fork it! `git clone https://github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

D (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[ License](http://opensource.org/licenses/)
npm package: @lrnwebcomponents/data-viz
Description: display pouch-db data using graphs
Author: haxtheweb
Latest version: 8.0.2

# &lt;data-viz&gt;

Viz
> display pouch-db data using graphs

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing JS module / web component */
import '@lrnwebcomponents/data-viz/data-viz.js';
/* At top of an application with build routine */
<script type="module" src="@lrnwebcomponents/data-viz/data-viz.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/data-viz/data-viz.js';
  // imperative form
  import {DataViz} from '@lrnwebcomponents/data-viz';
  // if you don't have a build routine and need to reference directly
  import './node_modules/@lrnwebcomponents/data-viz/data-viz.js';
</script>
// via unpkg CDN (good for testing)
<script type="module" src="https://unpkg.com/@lrnwebcomponents/data-viz/data-viz.js"></script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
$ yarn start
```

## Test

```bash
$ yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
$ yarn run build
```

## Contributing

1. Fork it! `git clone https://github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

Viz (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[Apache-2.0 License](http://opensource.org/licenses/Apache-2.0)
npm package: @lrnwebcomponents/date-card
Description: A simple presentation of a date
Author: haxtheweb
Latest version: 8.0.2

# &lt;date-card&gt;

Card
> A simple presentation of a date

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing JS module / web component */
import '@lrnwebcomponents/date-card/date-card.js';
/* At top of an application with build routine */
<script type="module" src="@lrnwebcomponents/date-card/date-card.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/date-card/date-card.js';
  // imperative form
  import {DateCard} from '@lrnwebcomponents/date-card';
  // if you don't have a build routine and need to reference directly
  import './node_modules/@lrnwebcomponents/date-card/date-card.js';
</script>
// via unpkg CDN (good for testing)
<script type="module" src="https://unpkg.com/@lrnwebcomponents/date-card/date-card.js"></script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
$ yarn start
```

## Test

```bash
$ yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
$ yarn run build
```

## Contributing

1. Fork it! `git clone https://github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

Card (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[Apache-2.0 License](http://opensource.org/licenses/Apache-2.0)
npm package: @lrnwebcomponents/deduping-fix
Description: A very simple fix for Failed to execute 'define' on 'CustomElementRegistry'
Author: haxtheweb
Latest version: 8.0.2

# Deduping fix

This is a utility that helps fix a core issue with "the platform" in that if two things try to call window.customElements.define('tag-name',ClassName) and reference the same tag-name, it is a hard bricking issue. This problem can pop up in local development for a number of reasons (or timing with legacy platforms and dynamically imported assets) and so this little utility helps rewrite this global function to perform it's same function, but issue a warning if already defined as opposed to outright failing.
npm package: @lrnwebcomponents/discord-embed
Description: widgetbot.io based embed widget for discord threads and channels
Author: haxtheweb
Latest version: 8.0.2

# &lt;discord-embed&gt;

Embed
> widgetbot.io based embed widget for discord threads and channels

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing JS module / web component */
import '@lrnwebcomponents/discord-embed/discord-embed.js';
/* At top of an application with build routine */
<script type="module" src="@lrnwebcomponents/discord-embed/discord-embed.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/discord-embed/discord-embed.js';
  // imperative form
  import {DiscordEmbed} from '@lrnwebcomponents/discord-embed';
  // if you don't have a build routine and need to reference directly
  import './node_modules/@lrnwebcomponents/discord-embed/discord-embed.js';
</script>
// via unpkg CDN (good for testing)
<script type="module" src="https://unpkg.com/@lrnwebcomponents/discord-embed/discord-embed.js"></script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
yarn start
```

## Test

```bash
yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
yarn run build
```

## Contributing

1. Fork it! `git clone https://github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

Embed (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[ License](http://opensource.org/licenses/)
npm package: @lrnwebcomponents/disqus-embed
Description: Disqus service integration
Author: haxtheweb
Latest version: 8.0.2

# &lt;disqus-embed&gt;

Embed
> Disqus service integration

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing JS module / web component */
import '@lrnwebcomponents/disqus-embed/disqus-embed.js';
/* At top of an application with build routine */
<script type="module" src="@lrnwebcomponents/disqus-embed/disqus-embed.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/disqus-embed/disqus-embed.js';
  // imperative form
  import {DisqusEmbed} from '@lrnwebcomponents/disqus-embed';
  // if you don't have a build routine and need to reference directly
  import './node_modules/@lrnwebcomponents/disqus-embed/disqus-embed.js';
</script>
// via unpkg CDN (good for testing)
<script type="module" src="https://unpkg.com/@lrnwebcomponents/disqus-embed/disqus-embed.js"></script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
yarn start
```

## Test

```bash
yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
yarn run build
```

## Contributing

1. Fork it! `git clone https://github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

Embed (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[ License](http://opensource.org/licenses/)
npm package: @lrnwebcomponents/dl-behavior
Description: Start of download thing
Author: haxtheweb
Latest version: 8.0.2

# &lt;dl-behavior&gt;

File
> Start of dl-behavior fork

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing module / web component */
import '@lrnwebcomponents/dl-behavior.js';
/* At top of an application */
<script type="module" src="dl-behavior.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/dl-behavior.js';

  import {MtzFileDownloadBehavior} from '@lrnwebcomponents/dl-behavior';
</script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
$ yarn start
```

## Test

```bash
$ yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
$ yarn run build
```

## Contributing

1. Fork it! `git clone git@github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

File (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[Apache-2.0 License](http://opensource.org/licenses/Apache-2.0)
npm package: @lrnwebcomponents/documentation-player
Description: playlist like element but for documenting web components in the context of hax
Author: haxtheweb
Latest version: 8.0.2

# &lt;documentation-player&gt;

Player
> playlist like element but for documenting web components in the context of hax

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing JS module / web component */
import '@lrnwebcomponents/documentation-player/documentation-player.js';
/* At top of an application with build routine */
<script type="module" src="@lrnwebcomponents/documentation-player/documentation-player.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/documentation-player/documentation-player.js';
  // imperative form
  import {DocumentationPlayer} from '@lrnwebcomponents/documentation-player';
  // if you don't have a build routine and need to reference directly
  import './node_modules/@lrnwebcomponents/documentation-player/documentation-player.js';
</script>
// via unpkg CDN (good for testing)
<script type="module" src="https://unpkg.com/@lrnwebcomponents/documentation-player/documentation-player.js"></script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
yarn start
```

## Test

```bash
yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
yarn run build
```

## Contributing

1. Fork it! `git clone https://github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

Player (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[ License](http://opensource.org/licenses/)
npm package: @lrnwebcomponents/drag-n-drop
Description: drag and drop elements and manager
Author: btopro
Latest version: 4.0.25

# &lt;drag-n-drop&gt;

N
> drag and drop elements and manager

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing JS module / web component */
import '@lrnwebcomponents/drag-n-drop/drag-n-drop.js';
/* At top of an application with build routine */
<script type="module" src="@lrnwebcomponents/drag-n-drop/drag-n-drop.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/drag-n-drop/drag-n-drop.js';
  // imperative form
  import {DragNDrop} from '@lrnwebcomponents/drag-n-drop';
  // if you don't have a build routine and need to reference directly
  import './node_modules/@lrnwebcomponents/drag-n-drop/drag-n-drop.js';
</script>
// via unpkg CDN (good for testing)
<script type="module" src="https://unpkg.com/@lrnwebcomponents/drag-n-drop/drag-n-drop.js"></script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
$ yarn start
```

## Test

```bash
$ yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
$ yarn run build
```

## Contributing

1. Fork it! `git clone https://github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

N (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[Apache-2.0 License](http://opensource.org/licenses/Apache-2.0)
npm package: @lrnwebcomponents/drawing-icons
Description: iconset for drawing toolbar buttons
Author: haxtheweb
Latest version: 8.0.2

# &lt;drawing-icons&gt;

Icons
> iconset for drawing toolbar buttons

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing module / web component */
import '@lrnwebcomponents/drawing-icons.js';
/* At top of an application */
<script type="module" src="drawing-icons.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/drawing-icons.js';

  import {DrawingIcons} from '@lrnwebcomponents/drawing-icons';
</script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
$ yarn start
```

## Test

```bash
$ yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
$ yarn run build
```

## Contributing

1. Fork it! `git clone git@github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

Icons (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[Apache-2.0 License](http://opensource.org/licenses/Apache-2.0)
npm package: @lrnwebcomponents/dropdown-select
Description: A dropdown element with better event and data binding
Author: btopro
Latest version: 7.0.11

# &lt;dropdown-select&gt;

Select
> dropdown that provides selection capabilities

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing module / web component */
import '@lrnwebcomponents/dropdown-select/dropdown-select.js';
/* At top of an application */
<script type="module" src="node_modules/@lrnwebcomponents/dropdown-select/dropdown-select.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/dropdown-select/dropdown-select.js';

  import {DropdownSelect} from '@lrnwebcomponents/dropdown-select/dropdown-select.js';
</script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
$ yarn start
```

## Test

```bash
$ yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
$ yarn run build
```

## Contributing

1. Fork it! `git clone git@github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

Select (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[Apache-2.0 License](http://opensource.org/licenses/Apache-2.0)
npm package: @lrnwebcomponents/dynamic-import-registry
Description: maintain manage the registration and usage of dynamic imports
Author: haxtheweb
Latest version: 8.0.2

# &lt;dynamic-import-registry&gt;

Import
> maintain manage the registration and usage of dynamic imports

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing JS module / web component */
import '@lrnwebcomponents/dynamic-import-registry/dynamic-import-registry.js';
/* At top of an application with build routine */
<script type="module" src="@lrnwebcomponents/dynamic-import-registry/dynamic-import-registry.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/dynamic-import-registry/dynamic-import-registry.js';
  // imperative form
  import {DynamicImportRegistry} from '@lrnwebcomponents/dynamic-import-registry';
  // if you don't have a build routine and need to reference directly
  import './node_modules/@lrnwebcomponents/dynamic-import-registry/dynamic-import-registry.js';
</script>
// via unpkg CDN (good for testing)
<script type="module" src="https://unpkg.com/@lrnwebcomponents/dynamic-import-registry/dynamic-import-registry.js"></script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
$ yarn start
```

## Test

```bash
$ yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
$ yarn run build
```

## Contributing

1. Fork it! `git clone https://github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

Import (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[Apache-2.0 License](http://opensource.org/licenses/Apache-2.0)
npm package: @lrnwebcomponents/eco-json-schema-form
Description: JSON Schema form data binding magic
Author: btopro
Latest version: 7.0.14

# &lt;eco-json-schema-form&gt;

Json
> JSON Schema data bound form

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing module / web component */
import '@lrnwebcomponents/eco-json-schema-form/eco-json-schema-form.js';
/* At top of an application */
<script type="module" src="node_modules/@lrnwebcomponents/eco-json-schema-form/eco-json-schema-form.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/eco-json-schema-form/eco-json-schema-form.js';

  import {EcoJsonSchemaForm} from '@lrnwebcomponents/eco-json-schema-form/eco-json-schema-form.js';
</script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
$ yarn start
```

## Test

```bash
$ yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
$ yarn run build
```

## Contributing

1. Fork it! `git clone git@github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

Json (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[Apache-2.0 License](http://opensource.org/licenses/Apache-2.0)
npm package: @lrnwebcomponents/editable-list
Description: a listing of items that can be edited in place with operations
Author: haxtheweb
Latest version: 8.0.2

# &lt;editable-list&gt;

List
> a listing of items that can be edited in place with operations

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing JS module / web component */
import '@lrnwebcomponents/editable-list/editable-list.js';
/* At top of an application with build routine */
<script type="module" src="@lrnwebcomponents/editable-list/editable-list.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/editable-list/editable-list.js';
  // imperative form
  import {EditableList} from '@lrnwebcomponents/editable-list';
  // if you don't have a build routine and need to reference directly
  import './node_modules/@lrnwebcomponents/editable-list/editable-list.js';
</script>
// via unpkg CDN (good for testing)
<script type="module" src="https://unpkg.com/@lrnwebcomponents/editable-list/editable-list.js"></script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
$ yarn start
```

## Test

```bash
$ yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
$ yarn run build
```

## Contributing

1. Fork it! `git clone https://github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

List (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[Apache-2.0 License](http://opensource.org/licenses/Apache-2.0)
npm package: @lrnwebcomponents/editable-outline
Description: a simple outline thats contenteditable in nature
Author: haxtheweb
Latest version: 8.0.2

# &lt;editable-outline&gt;

Outline
> a simple outline thats contenteditable in nature

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing JS module / web component */
import '@lrnwebcomponents/editable-outline/editable-outline.js';
/* At top of an application with build routine */
<script type="module" src="@lrnwebcomponents/editable-outline/editable-outline.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/editable-outline/editable-outline.js';
  // imperative form
  import {EditableOutline} from '@lrnwebcomponents/editable-outline';
  // if you don't have a build routine and need to reference directly
  import './node_modules/@lrnwebcomponents/editable-outline/editable-outline.js';
</script>
// via unpkg CDN (good for testing)
<script type="module" src="https://unpkg.com/@lrnwebcomponents/editable-outline/editable-outline.js"></script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
$ yarn start
```

## Test

```bash
$ yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
$ yarn run build
```

## Contributing

1. Fork it! `git clone https://github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

Outline (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[Apache-2.0 License](http://opensource.org/licenses/Apache-2.0)
npm package: @lrnwebcomponents/editable-table
Description: A table that's editable
Author: haxtheweb
Latest version: 8.0.2

# &lt;editable-table&gt;

Table
> A table that can be edited on the front end

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing module / web component */
import '@lrnwebcomponents/editable-table/editable-table.js';
/* At top of an application */
<script type="module" src="node_modules/@lrnwebcomponents/editable-table/editable-table.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/editable-table/editable-table.js';

  import {EditableTable} from '@lrnwebcomponents/editable-table/editable-table.js';
</script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
$ yarn start
```

## Test

```bash
$ yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
$ yarn run build
```

## Contributing

1. Fork it! `git clone git@github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

Table (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[Apache-2.0 License](http://opensource.org/licenses/Apache-2.0)
npm package: @lrnwebcomponents/elmsln-apps
Description: The applications of ELMSLN in one place to make it easier to work on
Author: haxtheweb
Latest version: 8.0.2

# &lt;elmsln-apps&gt;

Apps
> The applications of ELMSLN in one place to make it easier to work on

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing JS module / web component */
import '@lrnwebcomponents/elmsln-apps/elmsln-apps.js';
/* At top of an application with build routine */
<script type="module" src="@lrnwebcomponents/elmsln-apps/elmsln-apps.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/elmsln-apps/elmsln-apps.js';
  // imperative form
  import {ElmslnApps} from '@lrnwebcomponents/elmsln-apps';
  // if you don't have a build routine and need to reference directly
  import './node_modules/@lrnwebcomponents/elmsln-apps/elmsln-apps.js';
</script>
// via unpkg CDN (good for testing)
<script type="module" src="https://unpkg.com/@lrnwebcomponents/elmsln-apps/elmsln-apps.js"></script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
$ yarn start
```

## Test

```bash
$ yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
$ yarn run build
```

## Contributing

1. Fork it! `git clone git@github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

Apps (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[Apache-2.0 License](http://opensource.org/licenses/Apache-2.0)
npm package: @lrnwebcomponents/elmsln-loading
Description: Basic loading spinner based on the ELMS:LN icon
Author: haxtheweb
Latest version: 8.0.2

# &lt;elmsln-loading&gt;

Loading
> ELMS:LN logo that spins as a loading icon

## Usage
To use this web component in your project you can utilize one of the following styles of syntax.

```js
/* In an existing module / web component */
import '@lrnwebcomponents/elmsln-loading/elmsln-loading.js';
/* At top of an application */
<script type="module" src="node_modules/@lrnwebcomponents/elmsln-loading/elmsln-loading.js"></script>
/* Alternatives for top of application */
<script type="module">
  import '@lrnwebcomponents/elmsln-loading/elmsln-loading.js';

  import {ElmslnLoading} from '@lrnwebcomponents/elmsln-loading/elmsln-loading.js';
</script>
```

## Develop / Demo
Run `yarn start` will start a local development server, open your default browser to display it, open your finder to the correct window and start watching the `/src` directory for changes and automatically rebuilding the element and documentation site for the demo.
```bash
$ yarn start
```

## Test

```bash
$ yarn run test
```

## Build
Builds ensure that wcfactory can correctly compile your web component project to
work on the maximum number of browsers possible.
```bash
$ yarn run build
```

## Contributing

1. Fork it! `git clone git@github.com/elmsln/lrnwebcomponents.git`
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -m 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D

## Code style

Loading (and all lrnwebcomponents) use [Prettier][prettier] to auto-format JS and JSON.  The style rules get applied when you commit a change.  If you choose to, you can [integrate your editor][prettier-ed] with Prettier to have the style rules applied on every save.

[prettier]: https://github.com/prettier/prettier/
[prettier-ed]: https://github.com/prettier/prettier/#editor-integration
[polyserve]: https://github.com/Polymer/polyserve
[web-component-tester]: https://github.com/Polymer/web-component-tester

## License
[Apache-2.0 License](http://opensource.org/licenses/Apache-2.0)