@sutton-signwriting/sgnw-components
Version:
a javascript package of web components for use with the SignWriting script.
4 lines • 2.46 kB
JavaScript
/*!
* The Sutton SignWriting Web Components
*/
import{proxyCustomElement as t,HTMLElement as o,h as s,Host as n,transformTag as r}from"@stencil/core/internal/client";import{C as i,s as e}from"./color-watch.js";import{f as a}from"./fsw.js";import{c}from"./global.js";import{a as l}from"./svg.js";const f=t(class extends o{constructor(t){super(),!1!==t&&this.__registerHost(),this.sgnw=window.sgnw}connectedCallback(){if(this.colorWatch=new i(this.el,this),!this.sgnw){let t=this;function o(){t.sgnw=window.sgnw,window.removeEventListener("sgnw",o,!1)}window.addEventListener("sgnw",o,!1)}}disconnectedCallback(){this.colorWatch.dispose()}render(){const t=e.compose(Object.assign(c(this.el),{background:"transparent",zoom:"x"}));let o="";return this.symbol?o=this.sgnw?a.symbolSvg(this.symbol+t):"":this.sign?o=this.sgnw?a.signSvg(this.sign+t):"":this.svg&&(o=this.svg),s(n,{key:"c0995013dd80cdef237afa3e4e2ab822cbecf67e",innerHTML:l(o,"position:absolute;top:10%;bottom:10%;left:5%;right:5%;margin:auto;max-width:90%;max-height:80%;cursor:default;fill:var(--font-color)")})}get el(){return this}static get style(){return'*.sc-fsw-button,*.sc-fsw-button::before,*.sc-fsw-button::after{box-sizing:border-box}.sc-fsw-button-h{--font-color:#424242;--button-color:lightgray;--button-hover:darkgray;--bg-color:#fff}[data-color-mode="dark"] .sc-fsw-button-h,[data-theme="dark"] .sc-fsw-button-h{--font-color:#e1e1ff;--button-color:gray;--button-hover:darkgray;--bg-color:#161625}.swu.sc-fsw-button{font-family:SuttonSignWritingOneD !important}.sc-fsw-button-h{display:inline-block;position:relative;border-radius:5px;color:var(--font-color);background-color:var(--button-color);width:5rem;height:4rem}.sc-fsw-button-h:hover{background-color:var(--button-hover)}.sc-fsw-button-s>svg{position:absolute;top:10%;bottom:10%;left:5%;right:5%;margin:auto;max-width:90%;max-height:80%;cursor:default}.sc-fsw-button-s>svg g text.sym-line,.sc-fsw-button-s>svg path{fill:var(--font-color) !important}.sc-fsw-button-s>svg g text.sym-fill{fill:var(--button-color) !important}.sc-fsw-button-h:hover.sc-fsw-button-s>svg g text.sym-fill{fill:var(--button-hover) !important}.sc-fsw-button-h{transition:color 1ms, background-color 1ms}'}},[2,"fsw-button",{symbol:[1537],sign:[1537],svg:[1537],sgnw:[32]}]);function u(){"undefined"!=typeof customElements&&["fsw-button"].forEach((t=>{"fsw-button"===t&&(customElements.get(r(t))||customElements.define(r(t),f))}))}export{f as F,u as d}