@scandit/web-datacapture-barcode/build/js/chunks/chunk-XGPORK2H.js

Scandit Data Capture SDK for the Web

import {a}from'./chunk-F7NAOKPF.js';import {a as a$4}from'./chunk-OQVPV5PW.js';import {a as a$2}from'./chunk-LR6JSIOR.js';import {a as a$3}from'./chunk-5URXITXR.js';import {a as a$1}from'./chunk-CYVVGAZ4.js';import {Color,ScanditIcon}from'@scandit/web-datacapture-core';import {ScanditHTMLElement,html,defineCustomElements,css}from'@scandit/web-datacapture-core/build/js/private/utils/index.js';var m=(o=>(o[o.Top="top-center"]="Top",o[o.Bottom="bottom-center"]="Bottom",o[o.Left="left-center"]="Left",o[o.Right="right-center"]="Right",o))(m||{}),N=(e=>(e.Small="small",e.Medium="medium",e.Large="large",e))(N||{}),U=(T=>(T.InfoAnnotationTap="BarcodeArInfoAnnotationEventTap",T))(U||{}),h="slot[name='header']",p="slot[name='footer']",v="--arrow-background-color",s=class s extends ScanditHTMLElement{constructor(){super();this.isEntireAnnotationTappable=false;this.annotationTrigger="highlightTapAndBarcodeScan";this._widthPreset="small";this.onPointerUpListener=this.onPointerUp.bind(this);this.onSlotChangeListener=this.onSlotChange.bind(this);this.highlightableElementListenerMap=new Map;let t=this.attachShadow({mode:"open"});t.innerHTML=html`<div
      class="container arw-${m.Bottom} ${"small"}"
    >
      <slot name="header"></slot>
      <div class="body-container">
        <slot></slot>
      </div>
      <slot name="footer"></slot>
    </div>`,this.containerElement=t.querySelector(".container"),t.append(s.createStyleElement().cloneNode(true)),t.append(a());}get barcode(){return this._barcode}set barcode(t){this._barcode=t;}updatePosition(t,e,o){a$1(this,t,e,0);}set anchor(t){for(let e of Object.values(m))this.containerElement.classList.remove(`arw-${e}`);this.containerElement.classList.add(`arw-${t}`),this.updateArrowColor();}get anchor(){for(let t of Object.values(m))if(this.containerElement.classList.contains(`arw-${t}`))return t;return m.Bottom}set widthPreset(t){this._widthPreset=t,this.containerElement.classList.remove("small","medium","large"),this.containerElement.classList.add(t);}get widthPreset(){switch(true){case this.containerElement.classList.contains("small"):return "small";case this.containerElement.classList.contains("medium"):return "medium";case this.containerElement.classList.contains("large"):return "large";default:return "small"}}get backgroundColor(){let t=this.containerElement.style.getPropertyValue("--background-color");return Color.fromHex(t)}set backgroundColor(t){this.containerElement.style.setProperty("--background-color",`#${t.toJSON()}`),this.updateArrowColor();}set body(t){this.append(...t);}get body(){var e,o;let t=(e=this.shadowRoot)==null?void 0:e.querySelector("slot:not([name])");return (o=t==null?void 0:t.assignedElements({flatten:true}))!=null?o:[]}set header(t){let e=this.querySelector(h);t!=null&&(e==null?void 0:e.assignedElements()[0])!==t&&(e==null||e.remove(),t.setAttribute("slot","header"),this.append(t));}get header(){var e,o;let t=(e=this.shadowRoot)==null?void 0:e.querySelector(h);return ((o=t==null?void 0:t.assignedElements())!=null?o:[])[0]}set footer(t){let e=this.querySelector(p);t!=null&&(e==null?void 0:e.assignedElements()[0])!==t&&(e==null||e.remove(),t.setAttribute("slot","footer"),this.append(t));}get footer(){var e,o;let t=(e=this.shadowRoot)==null?void 0:e.querySelector(p);return ((o=t==null?void 0:t.assignedElements())!=null?o:[])[0]}set hasTip(t){this.containerElement.classList.toggle(`arw-${this.anchor}`,t);}get hasTip(){return this.containerElement.classList.contains(`arw-${this.anchor}`)}static create(t){s.register();let e=document.createElement(s.tag);return e.barcode=t,e}static register(){defineCustomElements({[a$4.tag]:a$4,[a$3.tag]:a$3,[a$2.tag]:a$2,[s.tag]:s});}static createStyleElement(){return css`:host{--background-color:#fff;--arrow-size:7px;--arrow-background-color:var(--background-color);--arrow-offset:10px;font-family:SF Pro Display,sans-serif}.container{background-color:var(--background-color);border-radius:16px;display:flex;flex-direction:column;min-width:100px;position:relative;transition:opacity .3s ease;width:100%}.container.highlighted{opacity:.75}.container.${"small"}{width:180px}.container.${"medium"}{width:210px}.container.${"large"}{width:240px}.body-container{padding-bottom:1rem}`}connectedCallback(){var o,n;this.widthPreset=this._widthPreset,this.addEventListener("pointerup",this.onPointerUpListener);let t=(o=this.shadowRoot)==null?void 0:o.querySelector(h),e=(n=this.shadowRoot)==null?void 0:n.querySelector(p);t==null||t.addEventListener("slotchange",this.onSlotChangeListener),e==null||e.addEventListener("slotchange",this.onSlotChangeListener),this.onSlotChange(),this.isEntireAnnotationTappable&&this.makeHighlightable(this.containerElement);}disconnectedCallback(){var o,n;let t=(o=this.shadowRoot)==null?void 0:o.querySelector(h),e=(n=this.shadowRoot)==null?void 0:n.querySelector(p);t==null||t.removeEventListener("slotchange",this.onSlotChangeListener),e==null||e.removeEventListener("slotchange",this.onSlotChangeListener),this.removeEventListener("pointerup",this.onPointerUpListener);for(let[i,a]of this.highlightableElementListenerMap)i.removeEventListener("pointerdown",a.pointerdown),i.removeEventListener("pointerup",a.pointerup);}onSlotChange(){var i,a,c,d;let t=(i=this.shadowRoot)==null?void 0:i.querySelector(h),e=(a=this.shadowRoot)==null?void 0:a.querySelector(p),o=(c=t==null?void 0:t.assignedElements())!=null?c:[],n=(d=e==null?void 0:e.assignedElements())!=null?d:[];for(let r of o)r.style.setProperty("--top-left-corner-radius","16px"),r.style.setProperty("--top-right-corner-radius","16px"),this.isEntireAnnotationTappable||this.makeHighlightable(r);for(let r of n)r.style.setProperty("--bottom-left-corner-radius","16px"),r.style.setProperty("--bottom-right-corner-radius","16px"),this.isEntireAnnotationTappable||this.makeHighlightable(r);this.updateArrowColor();}updateArrowColor(){this.style.removeProperty(v),this.header||this.footer?this.header&&this.anchor.startsWith("top")?this.style.setProperty(v,`#${this.header.backgroundColor.toJSON()}`):this.footer&&this.anchor.startsWith("bottom")&&this.style.setProperty(v,`#${this.footer.backgroundColor.toJSON()}`):this.body.length>0&&!this.header&&!this.footer&&this.style.setProperty(v,`#${this.backgroundColor.toJSON()}`);}makeHighlightable(t){var i;let e=t.classList.contains("container")?t:(i=t.shadowRoot)==null?void 0:i.querySelector(".container");if(!e||this.highlightableElementListenerMap.has(e))return;let o=()=>{e.classList.add("highlighted");},n=()=>{e.classList.remove("highlighted");};e.addEventListener("pointerdown",o),e.addEventListener("pointerup",n),this.highlightableElementListenerMap.set(e,{pointerdown:o,pointerup:n});}onPointerUp(t){var a,c,d,r,B,f,I,u,S,g,w,b,P;let e=(a=t.target)==null?void 0:a.closest(a$3.tag),o=(c=t.target)==null?void 0:c.closest(a$2.tag),n=(d=t.target)==null?void 0:d.closest(`${a$4.tag} ${ScanditIcon.tag}`),i=new CustomEvent("BarcodeArInfoAnnotationEventTap",{bubbles:true});if(e&&((B=(r=this.listener)==null?void 0:r.onInfoAnnotationHeaderTapped)==null||B.call(r,this),this.dispatchEvent(i)),o&&((I=(f=this.listener)==null?void 0:f.onInfoAnnotationFooterTapped)==null||I.call(f,this),this.dispatchEvent(i)),(n==null?void 0:n.slot)==="left-barcode-icon"){let l=this.body.findIndex(y=>y.contains(n));this.body[l].isLeftIconTappable&&((S=(u=this.listener)==null?void 0:u.onInfoAnnotationLeftIconTapped)==null||S.call(u,this,this.body[l],l),this.dispatchEvent(i));}if((n==null?void 0:n.slot)==="right-barcode-icon"){let l=this.body.findIndex(y=>y.contains(n));this.body[l].isRightIconTappable&&((w=(g=this.listener)==null?void 0:g.onInfoAnnotationRightIconTapped)==null||w.call(g,this,this.body[l],l),this.dispatchEvent(i));}this.isEntireAnnotationTappable&&((P=(b=this.listener)==null?void 0:b.onInfoAnnotationTapped)==null||P.call(b,this),this.dispatchEvent(i));}};s.tag="scandit-barcode-ar-info-annotation";var H=s;export{m as a,N as b,U as c,H as d};