@scandit/web-datacapture-core
Version:
Scandit Data Capture SDK for the Web
1 lines • 4.84 kB
JavaScript
import {a as a$3}from'./chunk-4GKVQAVF.js';import {a as a$2}from'./chunk-F2IJCZAS.js';import {e}from'./chunk-SOCEWYYO.js';import {a as a$7,b}from'./chunk-EQ6V4W5K.js';import {a as a$6}from'./chunk-3A4KLILV.js';import {a as a$4}from'./chunk-UWBNF47P.js';import {a as a$1}from'./chunk-EV4OEANA.js';import {a as a$5}from'./chunk-LSZZVJ6B.js';var E=(e=>(e.DidShow="didshow",e.DidHide="didhide",e.WillShow="willshow",e))(E||{}),o="--text-size",s="--text-color",n="--text-alignment",r="--text-weight",a="--line-height",l="--background-color",c="--corner-radius",h="--max-lines",w="ease-in-out",i=class i extends a$1{constructor(){super();this.toast=null;this._hintStyle=null;this._customIcon=null;this.currentAnimation=null;this.animationDuration=250;this._currentAnimationDirection=null;let t=this.attachShadow({mode:"open"});this._exclamationIcon=a$2.create(),this._checkIcon=a$3.create(),this._exclamationIcon.size=24,this._checkIcon.size=24,t.innerHTML=a$4`<div class="toast"><slot name="first-child"></slot><div class="left"><slot name="icon"></slot></div><p class="middle"><slot></slot></p></div>`,t.append(i.createStyleElement().cloneNode(true)),this.toast=t.querySelector(".toast");}static createStyleElement(){return a$5`:host{display:inline-block;font-family:SF Pro Display,sans-serif}:host([hidden]){display:none}.toast{${o}:1rem;${s}:#000;${r}:400;${n}:${"center"};${a}:1.5rem;${l}:#fff;${c}:.25rem;${h}:2;align-items:flex-start;background-color:var(${l});border-radius:var(${c});color:var(${s});display:flex;flex-direction:row;font-size:var(${o});font-weight:var(${r});gap:.625rem;justify-content:var(${n});line-height:var(${a});padding:.75rem 1rem}:host([direction=column]) .toast{align-items:center;flex-direction:column}:host([direction=row]) .toast{align-items:center;flex-direction:row}.toast .left{align-self:flex-start;display:flex}.toast.icon-${"none"} .left{display:none}.toast p.middle{display:inline-block;display:-webkit-box;margin:0;padding:0;text-align:var(${n});-webkit-line-clamp:var(${h});-webkit-box-orient:vertical;align-self:center;overflow:hidden;text-shadow:0 1px 2px #${e.withAlpha(.3).toJSON()}}p.middle{text-align:var(${n})}`}get hintStyle(){return this._hintStyle}set hintStyle(t){this._hintStyle=t,this.render();}get customIcon(){return this._customIcon}set customIcon(t){this._customIcon=t,this.render();}get showAnimation(){return new Animation(new KeyframeEffect(this,[{opacity:0},{opacity:1}],{duration:this.animationDuration,fill:"both",easing:w}))}get hideAnimation(){return new Animation(new KeyframeEffect(this,[{opacity:1},{opacity:0}],{duration:this.animationDuration,fill:"both",easing:w}))}static create(){return i.register(),document.createElement(i.tag)}static register(){a$6({[i.tag]:i});}async show(){return this.toggle(true)}async hide(){return this.toggle(false)}connectedCallback(){this.render();}async toggle(t){var m,d;let e=t?"showing":"hiding";this.currentAnimation&&this._currentAnimationDirection===e&&this.currentAnimation.playState==="running"||(this.currentAnimation&&a$7(this.currentAnimation),this.animationDuration=(d=(m=this.hintStyle)==null?void 0:m.isAnimatedToView)==null||d?250:0,this._currentAnimationDirection=e,this.currentAnimation=t?this.showAnimation:this.hideAnimation,t&&this.dispatchEvent(new CustomEvent("willshow",{bubbles:true})),this.currentAnimation.play(),await b(this.currentAnimation),this.dispatchEvent(new CustomEvent(t?"didshow":"didhide",{bubbles:true,detail:{target:this}})),this.currentAnimation=null,this._currentAnimationDirection=null);}render(){var t;if(!(!this.toast||!this.hintStyle)){this.toast.className="toast",this.toast.style.setProperty(o,`${this.hintStyle.textSize}px`),this.toast.style.setProperty(s,`#${this.hintStyle.textColor}`),this.toast.style.setProperty(r,this.hintStyle.textWeight.toString()),this.toast.style.setProperty(n,this.hintStyle.textAlignment),this.toast.style.setProperty(a,`${this.hintStyle.lineHeight/14}`),this.toast.style.setProperty(l,`#${this.hintStyle.backgroundColor}`),this.toast.style.setProperty(c,`${this.hintStyle.cornerRadius/10}rem`),this.toast.style.setProperty(h,this.hintStyle.maxLines.toString());for(let e of this.querySelectorAll("[slot=icon]"))e.remove();this._customIcon?(this._customIcon.setAttribute("slot","icon"),this.append(this._customIcon),this.toast.classList.remove("icon-none")):(this.toast.classList.toggle("icon-none",this.hintStyle.hintIcon==="none"),this.hintStyle.hintIcon==="check"?(this._checkIcon.setAttribute("slot","icon"),this.append(this._checkIcon)):this.hintStyle.hintIcon==="exclamationMark"&&(this._exclamationIcon.setAttribute("slot","icon"),this.append(this._exclamationIcon)),this.hintStyle.iconColor&&((t=this.querySelector("[slot=icon]"))==null||t.setAttribute("fill",`#${this.hintStyle.iconColor}`)));}}};i.tag="scandit-toast-hint";var A=i;export{E as a,A as b};