@sutton-signwriting/sgnw-components/dist/sgnw-components/p-473c1302.entry.js

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

/*!
 * The Sutton SignWriting Web Components
 */
import{r as s,f as t,d as e,H as i,e as o}from"./p-BAJUTSOF.js";import{s as n}from"./p-CKUP3WBD.js";import{C as a,s as r}from"./p-BgrNWcmU.js";const l=class{constructor(t){s(this,t),this.sgnw=window.sgnw,this.items=[]}parseText(s){this.items=n.parse.text(s).map((s=>{let t=n.info(s);return t.text=s,t}))}connectedCallback(){if(this.colorWatch=new a(this.el,this),this.vp?this.parseText(this.vp):this.vp=this.el.innerHTML,!this.sgnw){let s=this;function t(){s.sgnw=window.sgnw,window.removeEventListener("sgnw",t,!1)}window.addEventListener("sgnw",t,!1)}}disconnectedCallback(){this.colorWatch.dispose()}render(){const s=t(this.el),o=r.compose({colorize:this.colorize,detail:s.detail});return e(i,{key:"3bf0a8d933adc7717ea5475879399667653ee1c9",vp:this.vp},e("span",{key:"f30475de1517a15a57c9e6ae70772d95a1b0ecdf",class:"outside"},e("span",{key:"aecc1ff9efd7c6ca8fa2f6babc6846432a165cf1",class:"middle"},e("span",{key:"4ec328456fa1e19a681e8e65efc71ae8e96876ae",class:"inside"},this.items.map((t=>{let i,n,a,r,l,d;return"sign"==t.segment?(i=s.zoom*t.zoom,n=t.padding*i,a=t.width*i+2*n,r=t.height*i+2*n,l=(1e3-2*t.minX-t.width)*i-150*s.zoom*t.lane,d=Math.max(0,20*i-n),e("sgnw-sign",{styling:o,style:{"font-size":30*s.zoom+"px",width:a+"px",height:r+"px","margin-right":(l>0?l:0)+"px","border-left":(l<0?-l:0)+"px solid transparent",padding:d+"px"}},t.text)):"symbol"==t.segment?(i=s.zoom*t.zoom,n=t.padding*i,a=t.width*i+2*n,r=t.height*i+2*n,d=Math.max(0,20*i-n),e("sgnw-symbol",{styling:o,style:{"font-size":30*s.zoom+"px",width:a+"px",height:r+"px","padding-bottom":d+"px"}},t.text)):(console.log("other"),e("div",null,t.text))}))))))}get el(){return o(this)}static get watchers(){return{vp:[{parseText:0}]}}};l.style=":host{writing-mode:vertical-lr;border-left:1px solid blue;border-right:1px solid blue;height:100%}:host svg{display:block}:host span.outside{font-size:0%;line-height:0%;border-left:1px solid blue;vertical-align:top}:host span.middle{vertical-align:bottom}:host span.inside{border-left:1px dashed red}sgnw-sign,sgnw-symbol{writing-mode:horizontal-tb;display:inline-block;vertical-align:middle;box-sizing:content-box}:host{transition:color 1ms, background-color 1ms}";export{l as sgnw_vp}