UNPKG

@sutton-signwriting/sgnw-components

Version:

a javascript package of web components for use with the SignWriting script.

76 lines (51 loc) 2.71 kB
[Read Me](README.md) | [Using the Components](USAGE.md) | [&lt;sgnw-components />](SGNW-COMPONENTS.md) | [&lt;fsw-components />](FSW-COMPONENTS.md) | [Change Log](CHANGELOG.md) --- # Using the Sutton SignWriting Web Components ## Script tag Put tags similar to this in HEAD <script type="module" src="https://unpkg.com/@sutton-signwriting/sgnw-components@1.1.0/dist/sgnw-components/sgnw-components.esm.js"></script> <link type="text/css" rel="stylesheet" href="https://unpkg.com/@sutton-signwriting/sgnw-components@1.1.0/dist/sgnw-components/sgnw-components.css"/> Then use the elements anywhere in your template, JSX, html etc --- ## ES Modules Put script tag in HEAD <script type="module"> import { defineCustomElements } from 'https://unpkg.com/@sutton-signwriting/sgnw-components@1.1.0/loader/index.es2017.mjs'; defineCustomElements(); </script> Then use the elements anywhere in your template, JSX, html etc --- ## Node modules - Run `npm install @sutton-signwriting/sgnw-components --save` - Put a script tag similar to this `<script src='node_modules/@sutton-signwriting/sgnw-components/dist/sgnw-components.js'></script>` in the head of your index.html - Then you can use the element anywhere in your template, JSX, html etc --- ## In a stencil-starter app - Run `npm install @sutton-signwriting/sgnw-components --save` - Add an import to the npm packages `import '@sutton-signwriting/sgnw-components';` - Then you can use the element anywhere in your template, JSX, html etc --- ## Sutton SignWriting Web Components **&lt;sgnw-components /&gt;** use [SignWriting in Unicode (SWU)](https://tools.ietf.org/id/draft-slevinski-formal-signwriting-09.html#name-signwriting-in-unicode-swu) characters. - [sgnw-symbol](SGNW-COMPONENTS.md#sgnw-symbol) - [sgnw-sign](SGNW-COMPONENTS.md#sgnw-sign) - [sgnw-vp](SGNW-COMPONENTS.md#sgnw-vp) - [sgnw-button](SGNW-COMPONENTS.md#sgnw-button) - [sgnw-palette-symbol](SGNW-COMPONENTS.md#sgnw-palette-symbol) - [sgnw-palette](SGNW-COMPONENTS.md#sgnw-palette) - [sgnw-signbox](SGNW-COMPONENTS.md#sgnw-signbox) --- ## Formal SignWriting Web Components **&lt;fsw-components /&gt;** use [Formal SignWriting in ASCII (FSW)](https://tools.ietf.org/id/draft-slevinski-formal-signwriting-09.html#name-formal-signwriting-in-ascii) characters. - [fsw-symbol](FSW-COMPONENTS.md#fsw-symbol) - [fsw-sign](FSW-COMPONENTS.md#fsw-sign) - [fsw-vp](FSW-COMPONENTS.md#fsw-vp) - [fsw-button](FSW-COMPONENTS.md#fsw-button) - [fsw-palette-symbol](FSW-COMPONENTS.md#fsw-palette-symbol) - [fsw-palette](FSW-COMPONENTS.md#fsw-palette) - [fsw-signbox](FSW-COMPONENTS.md#fsw-signbox) ---