@scandit/web-datacapture-barcode/build/js/ar/ui/organisms/BarcodeArCircleHighlight.js

Scandit Data Capture SDK for the Web

import{updatePosition as e}from"./private/updatePosition.js";import{Brush as t,Color as n,ScanditIconBuilder as r,ScanditIconShape as i}from"@scandit/web-datacapture-core";import{ScanditHTMLElement as a}from"@scandit/web-datacapture-core/build/js/private/utils/ScanditHTMLElement.js";import{defineCustomElements as o}from"@scandit/web-datacapture-core/build/js/private/utils/defineCustomElements.js";import{html as s}from"@scandit/web-datacapture-core/build/js/private/utils/html.js";import{css as c}from"@scandit/web-datacapture-core/build/js/private/utils/css.js";let l=function(e){return e.Dot=`dot`,e.Icon=`icon`,e}({});const u=n.fromHex(`#00FFFF`),d=u.withAlpha(0);var f=class l extends a{set isPulsing(e){this._isPulsing=e,this.toggleAttribute(`pulse`,e)}get isPulsing(){return this._isPulsing}set icon(e){var t;(t=this._icon)==null||t.remove(),this._icon=e,e&&this.preset===`icon`&&(e.backgroundShape=i.Circle,this.append(e),this.updateBrush(),this.updateSize())}get icon(){return this._icon}constructor(){super(),this._isPulsing=!1,this._icon=null,this.dot=null,this._brush=new t(u.withAlpha(.45),n.fromHex(`#00FFFF`),2);let e=this.attachShadow({mode:`open`});e.innerHTML=s`<slot></slot>`,e.append(l.createStyleElement().cloneNode(!0))}set barcode(e){this._barcode=e}get barcode(){return this._barcode}set brush(e){this._brush=e,this.updateBrush()}get brush(){return this._brush}set size(e){this._size=e,this.updateSize()}get size(){return this._size===void 0?this.preset===`dot`?26:32:this._size}static create(e,t){l.register();let n=document.createElement(l.tag);return n.barcode=e,n.preset=t,n}static register(){o({[l.tag]:l})}static createStyleElement(){return c`:host{border-radius:50%;display:inline-flex;--fill:#${u.toJSON()};--fill-no-opacity:#${d.toJSON()};--size:20px}:host([pulse]){animation:pulse 1.5s infinite}:host(:not([pulse])){animation:none}@keyframes pulse{0%{box-shadow:0 0 0 0 var(--fill)}70%{box-shadow:0 0 0 var(--size) var(--fill-no-opacity)}to{box-shadow:0 0 0 0 var(--fill-no-opacity)}}`}async connectedCallback(){this.brushBuilder=new r().withBackgroundShape(i.Circle).withBackgroundColor(this.brush.fillColor).withBackgroundStrokeColor(this.brush.strokeColor).withBackgroundStrokeWidth(this.brush.strokeWidth),this.dot=await this.brushBuilder.build(),this.preset===`dot`?this.append(this.dot):this.preset===`icon`&&this._icon!=null&&(this._icon.backgroundShape=i.Circle,this.append(this._icon)),this.updateBrush(),this.updateSize()}updateSize(){this.dot&&(this.dot.width=this.size,this.dot.height=this.size),this.icon&&(this.icon.width=this.size,this.icon.height=this.size),this.style.setProperty(`--size`,`${this.size*9/10}px`)}updateBrush(){this.dot&&(this.dot.backgroundColor=this._brush.fillColor,this.dot.backgroundStrokeColor=this._brush.strokeColor,this.dot.backgroundStrokeWidth=this._brush.strokeWidth),this.icon&&(this.icon.backgroundColor=this._brush.fillColor,this.icon.backgroundStrokeColor=this._brush.strokeColor,this.icon.backgroundStrokeWidth=this._brush.strokeWidth),this.style.setProperty(`--fill`,`#${this._brush.fillColor.toJSON()}`),this.style.setProperty(`--fill-no-opacity`,`#${this._brush.fillColor.withAlpha(0).toJSON()}`)}updatePosition(t,n,r){e(this,t,n,0)}};f.tag=`scandit-barcode-ar-circle-highlight`;export{f as BarcodeArCircleHighlight,l as BarcodeArCircleHighlightPreset};