A [Material Components](https://material.io/components/) icon implementation using [Web Components](https://www.webcomponents.org/introduction)

Downloads in past


1000.9.04 years ago4 years agoMinified + gzip package size for @authentic/mwc-chips in KB


A Material Components icon implementation using Web Components

Getting started

  • When you're ready to use mwc-chips in a project, install it via npm. To run the project in the browser, a module-compatible toolctain is required. We recommend installing the Polymer CLI and using its development server as follows.

1. Ensure the webcomponents polyfills are included in your HTML page
- Install webcomponents polyfills

    ```npm i @webcomponents/webcomponentsjs```

- Add webcomponents polyfills to your HTML page

    ```<script src="@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>```
1. Add mwc-chips to your project:
```npm i @authentic/mwc-chips```
1. Import the mwc-chips definition into your HTML page:
```<script type="module" src="@authentic/mwc-chips/mwc-chip.js"></script>```

Or into your module script:

```import { Chip } from "@authentic/mwc-chips/mwc-chip"```
1. Create an instance of mwc-chips in your HTML page, or via any framework that supports rendering Custom Elements:
1. Install the Polymer CLI:
```npm i -g polymer-cli```
1. Run the development server and open a browser pointing to its URL:
```polymer serve```
> mwc-chips is published on npm using JavaScript Modules. This means it can take advantage of the standard native JavaScript module loader available in all current major browsers. > > However, since mwc-chips uses npm convention to reference dependencies by name, a light transform to rewrite specifiers to URLs is required to get it to run in the browser. The polymer-cli's development server polymer serve automatically handles this transform.
Tools like WebPack and Rollup can also be used to serve and/or bundle mwc-chips.

Supported Browsers

The last 2 versions of all modern browsers are supported, including Chrome, Safari, Opera, Firefox, Edge. In addition, Internet Explorer 11 is also supported.