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

Scandit Data Capture SDK for the Web

import {Orientation}from'@scandit/web-datacapture-core';import {GestureRecognizer}from'@scandit/web-datacapture-core/build/js/private/GestureRecognizer/GestureRecognizer.js';import {OrientationObserver,orientationChangeEvent}from'@scandit/web-datacapture-core/build/js/private/OrientationObserver.js';import {ScanditHTMLElement,debounce,html,defineCustomElements,css,safeRequestAnimationFrame}from'@scandit/web-datacapture-core/build/js/private/utils/index.js';var O=(r=>(r.onTap="onlayouttap",r))(O||{}),n=class n extends ScanditHTMLElement{constructor(){super();this.orientationObserver=new OrientationObserver;this.onOrientationChangeHandler=debounce(this.onOrientationChange.bind(this),50);let t=this.attachShadow({mode:"open"});t.append(n.createStyleElement().cloneNode(true));let e=document.createElement("div");e.id="root",this.absoluteContainer=document.createElement("div"),this.absoluteContainer.classList.add("absolute-container"),this.absoluteContainer.innerHTML="<slot></slot>",t.insertBefore(this.absoluteContainer,e.nextElementSibling),e.innerHTML=html`<div class="wrapper"><div class="header"><slot name="progress"></slot><div class="controls top"><div class="control left"><slot name="top-controls-left"></slot></div><div class="control center"><slot name="top-controls-center"></slot></div><div class="control right"><slot name="top-controls-right"></slot></div></div></div><div class="main"><slot name="card-list"></slot></div></div><div class="controls"><div class="control left"><slot name="bottom-controls-left"></slot></div><div class="control center"><slot name="bottom-controls-center"></slot></div><div class="control right"><slot name="bottom-controls-right"></slot></div></div>`,t.append(e),this.gestureRecognizer=new GestureRecognizer(this.absoluteContainer);}get cardListContainer(){return this.querySelector('[slot="card-list"]')}get main(){var t;return (t=this.shadowRoot)==null?void 0:t.querySelector(".main")}static create(){return document.createElement(n.tag)}static register(){defineCustomElements({[n.tag]:n});}static createStyleElement(){return css`:host{inset:0;overflow:hidden;position:absolute;z-index:1}:host #root{--padding:1rem;box-sizing:border-box;display:flex;flex-direction:column;gap:.5rem;height:100%;justify-content:space-between;margin:0 auto;max-width:960px;padding:calc(var(--padding))}:host .absolute-container{height:100%;overflow:hidden;position:absolute;width:100%}.main{overflow:hidden}.main,.wrapper{display:flex;flex-direction:column}.wrapper{gap:.5rem;height:100%;justify-content:space-between}.controls{align-items:center;display:flex;flex-direction:row;justify-content:space-evenly;min-height:85px;z-index:1}@media (orientation:landscape){.controls{flex-direction:column}.wrapper{flex:0 70%;margin:0 auto}:host #root{flex-direction:row}}.controls .control{align-items:center;display:flex;flex:1 1 25%;flex-direction:row;justify-content:center}.controls .control.center{flex:1 1 50%;max-width:5rem}.controls.top{min-height:auto}.controls.top .control.left{justify-content:flex-start}.controls.top .control.right{justify-content:flex-end}.header{display:flex;flex-direction:column;gap:1.5rem;position:relative}::slotted([hidden]){display:none}`}connectedCallback(){this.orientationObserver.addEventListener(orientationChangeEvent,this.onOrientationChangeHandler),this.orientationObserver.register(),this.gestureRecognizer.addListener(this);}disconnectedCallback(){this.orientationObserver.unregister(),this.orientationObserver.removeEventListener(orientationChangeEvent,this.onOrientationChangeHandler),this.gestureRecognizer.removeListener(this);}toggleVisibility(t,e){var o;(o=this.querySelector(t))==null||o.toggleAttribute("hidden",!e);}onTap(t,e){let o=new CustomEvent("onlayouttap",{detail:{point:t,target:e.target}});this.dispatchEvent(o);}onOrientationChange(t){var o,a,s,l;let e=this.shadowRoot.querySelector(".controls.top");t.detail.value===Orientation.Portrait?(a=(o=this.shadowRoot)==null?void 0:o.querySelector(".header"))==null||a.append(e):(l=(s=this.shadowRoot)==null?void 0:s.querySelector("#root"))==null||l.prepend(e),safeRequestAnimationFrame(()=>{var c,d,p,m,u;(c=this.main)==null||c.style.setProperty("height","100%");let v=(p=(d=this.main)==null?void 0:d.getBoundingClientRect().height)!=null?p:0;(m=this.cardListContainer)==null||m.updateHeight(v),(u=this.main)==null||u.style.setProperty("height","unset");});}};n.tag="scandit-find-layout";var i=n;i.register();export{O as a,i as b};