@descope/web-components-ui 3.16.4 → 3.18.0

package/dist/umd/descope-attachment.js

@@ -1,2 +1,2 @@
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[3267,7164],{13094(t,e,n){n.r(e),n.d(e,{AnchoredClass:()=>c,componentName:()=>a});var s=n(88961),o=n(72270),i=n(25964),r=n(63200);const a=(0,i.xE)("anchored");class h extends((0,o.qu)({componentName:a,baseSelector:".anchored-root"})){#t=null;#e=null;#n=null;#s=null;get#o(){return this.defaultSlot.assignedElements({flatten:!0})[0]}get#i(){return this.shadowRoot.querySelector('slot[name="anchored"]')?.assignedElements()[0]}get#r(){return this.getRootNode().host}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n      <div class="anchored-root" part="root">\n        <slot></slot>\n        <div class="anchored-host" part="anchored">\n          <slot name="anchored"></slot>\n        </div>\n      </div>\n    ',this.defaultSlot=this.shadowRoot.querySelector("slot:not([name])")}init(){super.init?.(),(0,i.fz)("\n      :host {\n        display: inline-flex;\n        position: relative;\n        box-sizing: border-box;\n      }\n\n      :host(:not([has-anchor])) {\n        display: none;\n      }\n\n      .anchored-root {\n        position: relative;\n        display: flex;\n        width: 100%;\n        min-width: 0;\n      }\n\n      /* Make anchor fill the flex row and allow it to shrink. */\n      ::slotted(*:not([slot])) {\n        flex-grow: 1;       /* fill the flex row */\n        flex-shrink: 1;     /* compress when constrained */\n        flex-basis: auto;   /* start from the anchor's natural size */\n        min-width: 0;       /* flex items won't shrink below content size without this */\n      }\n\n      /* Anchored container covers the anchor but is invisible to pointer events. */\n      .anchored-host {\n        position: absolute;\n        inset: 0;\n        pointer-events: none;\n      }\n\n      /* Restore interactivity for actual anchored content. */\n      ::slotted([slot=\"anchored\"]) {\n        pointer-events: auto;\n      }\n      ",this),this.#a(),this.defaultSlot.addEventListener("slotchange",()=>this.#h()),this.#h()}#c(){const t=this.#o?.classList?.contains("hidden");this.classList.toggle("hidden",t)}#h(){this.#l(),this.#t=this.#d(this.#t,this.#r,"stretch"),this.#e=this.#d(this.#e,this.#i,"st-host-direction"),this.#u()}#u(){this.#s?.disconnect(),this.#o&&(this.#s=(0,i.mx)(this.#o,()=>this.#c(),{includeAttrs:["class"]}))}connectedCallback(){super.connectedCallback?.(),this.#u(),this.#c()}#a(){const t="\n      descope-anchored {\n        width: 100%;          /* fill the outer host so the anchored element spans the full anchor width */\n      }\n      :host([stretch]) {\n        display: inline-flex; /* switch from inline-block so internal children are flex items */\n        width: 100%;          /* fill non-flex parents */\n        flex-grow: 1;         /* absorb extra space in flex parents */\n        flex-shrink: 0;       /* hold full width — shrink:1 would let siblings squeeze it below 100% */\n        flex-basis: auto;     /* defer to width:100% on the main axis; avoids forcing 100% height in column-flex parents */\n        min-width: 0;         /* prevent overflow when the outer host is itself inside a constrained flex row */\n      }\n    ";this.#n?this.#n.replaceSync(t):this.#r&&(this.#n=(0,i.fz)(t,this.#r))}#d(t,e,n){return t?.disconnect(),e?.removeAttribute(n),this.#o&&e?(0,i.EA)(this.#o,e,{includeAttrs:[n]}):null}disconnectedCallback(){super.disconnectedCallback?.(),this.#t?.disconnect(),this.#e?.disconnect(),this.#s?.disconnect()}#l(){this.toggleAttribute("has-anchor",!!this.#o),this.#c()}}const c=(0,r.Zz)(s.tQ)(h);customElements.define(a,c)},44050(t,e,n){n.r(e),n.d(e,{AttachmentClass:()=>u,componentName:()=>a}),n(13094);var s=n(88961),o=n(72270),i=n(25964),r=n(63200);const a=(0,i.xE)("attachment"),h=["top-end","top-start","top-center","bottom-start","bottom-end","bottom-center"],c=h[0];class l extends((0,o.qu)({componentName:a,baseSelector:"descope-anchored"})){#b=null;constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n      <descope-anchored>\n        <slot></slot>\n        <div slot="anchored" class="attachment-container">\n          <slot name="attachment"></slot>\n        </div>\n      </descope-anchored>\n    ',this.defaultSlot=this.shadowRoot.querySelector("slot:not([name])"),this.attachmentSlot=this.shadowRoot.querySelector('slot[name="attachment"]'),this.anchored=this.shadowRoot.querySelector("descope-anchored")}get#m(){return this.attachmentSlot?.assignedElements()[0]}static get observedAttributes(){return[...super.observedAttributes||[],"position"]}attributeChangedCallback(t,e,n){super.attributeChangedCallback?.(t,e,n),"position"===t&&e!==n&&this.#p()}init(){super.init?.(),(0,i.fz)("\n      :host {\n        display: inline-block;\n      }\n      :host(.hidden) {\n        display: none;\n      }\n      .attachment-container {\n        position: absolute;\n        z-index: 1;\n        pointer-events: none;\n        width: 100%;\n        display: flex;\n        align-items: center;\n        container-type: inline-size;\n      }\n",this),this.#p();const t=this.shadowRoot.querySelector(".attachment-container");(0,i.mx)(t,()=>this.#f(),{includeAttrs:["st-host-direction"]}),this.attachmentSlot.addEventListener("slotchange",()=>this.#f()),this.defaultSlot.addEventListener("slotchange",()=>{this.#v(),window.requestAnimationFrame(()=>this.#g())}),window.requestAnimationFrame(()=>this.#v())}#c(){const t=this.anchored?.classList?.contains("hidden");this.classList.toggle("hidden",t)}#w(){this.#b?.disconnect(),this.anchored&&(this.#b=(0,i.mx)(this.anchored,()=>this.#c(),{includeAttrs:["class"]}))}connectedCallback(){super.connectedCallback?.(),this.#c(),this.#w()}disconnectedCallback(){super.disconnectedCallback?.(),this.#b?.disconnect()}#g(){const t=this.defaultSlot?.assignedElements()?.[0],e=t?.getBoundingClientRect();if(e){const t=e.width;this.#m?.setAttribute("data-attachment-size",Number(t))}}#v(){const t=this.defaultSlot?.assignedElements()?.length>0;this.classList.toggle("hidden",!t)}#f(){const t=this.shadowRoot.querySelector(".attachment-container")?.getAttribute("st-host-direction");t&&this.#m?.setAttribute("st-host-direction",t)}get offsetX(){return this.getAttribute("offset-x")||"0px"}get offsetY(){return this.getAttribute("offset-y")||"0px"}#p(){const t=this.getAttribute("position");h.includes(t)||this.setAttribute("position",c)}}const d={selector:()=>".attachment-container"},u=(0,r.Zz)((0,s.RF)({mappings:{transform:{...d},justifyContent:{...d},maxWidth:{...d},top:{...d},bottom:{...d},left:{...d},right:{...d},offsetX:{},offsetY:{}}}),s.VO,s.tQ)(l);customElements.define(a,u)}}]);
+"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[3267,7164],{13094(t,e,n){n.r(e),n.d(e,{AnchoredClass:()=>c,componentName:()=>a});var s=n(88961),o=n(72270),i=n(25964),r=n(63200);const a=(0,i.xE)("anchored");class h extends((0,o.qu)({componentName:a,baseSelector:".anchored-root"})){#t=null;#e=null;#n=null;#s=null;get#o(){return this.defaultSlot.assignedElements({flatten:!0})[0]}get#i(){return this.shadowRoot.querySelector('slot[name="anchored"]')?.assignedElements()[0]}get#r(){return this.getRootNode().host}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n      <div class="anchored-root" part="root">\n        <slot></slot>\n        <div class="anchored-host" part="anchored">\n          <slot name="anchored"></slot>\n        </div>\n      </div>\n    ',this.defaultSlot=this.shadowRoot.querySelector("slot:not([name])")}init(){super.init?.(),(0,i.fz)("\n      :host {\n        display: inline-flex;\n        position: relative;\n        box-sizing: border-box;\n      }\n\n      :host(:not([has-anchor])) {\n        display: none;\n      }\n\n      .anchored-root {\n        position: relative;\n        display: flex;\n        width: 100%;\n        min-width: 0;\n      }\n\n      /* Make anchor fill the flex row and allow it to shrink. */\n      ::slotted(*:not([slot])) {\n        flex-grow: 1;       /* fill the flex row */\n        flex-shrink: 1;     /* compress when constrained */\n        flex-basis: auto;   /* start from the anchor's natural size */\n        min-width: 0;       /* flex items won't shrink below content size without this */\n      }\n\n      /* Anchored container covers the anchor but is invisible to pointer events. */\n      .anchored-host {\n        position: absolute;\n        inset: 0;\n        pointer-events: none;\n      }\n\n      /* Restore interactivity for actual anchored content. */\n      ::slotted([slot=\"anchored\"]) {\n        pointer-events: auto;\n      }\n      ",this),this.#a(),this.defaultSlot.addEventListener("slotchange",()=>this.#h()),this.#h()}#c(){const t=this.#o?.classList?.contains("hidden");this.classList.toggle("hidden",t)}#h(){this.#l(),this.#t=this.#d(this.#t,this.#r,"stretch"),this.#e=this.#d(this.#e,this.#i,"st-host-direction"),this.#u()}#u(){this.#s?.disconnect(),this.#o&&(this.#s=(0,i.mx)(this.#o,()=>this.#c(),{includeAttrs:["class"]}))}connectedCallback(){super.connectedCallback?.(),this.#u(),this.#c()}#a(){const t="\n      descope-anchored {\n        width: 100%;          /* fill the outer host so the anchored element spans the full anchor width */\n      }\n      :host([stretch]) {\n        display: inline-flex; /* switch from inline-block so internal children are flex items */\n        width: 100%;          /* fill non-flex parents */\n        flex-grow: 1;         /* absorb extra space in flex parents */\n        flex-shrink: 0;       /* hold full width — shrink:1 would let siblings squeeze it below 100% */\n        flex-basis: auto;     /* defer to width:100% on the main axis; avoids forcing 100% height in column-flex parents */\n        min-width: 0;         /* prevent overflow when the outer host is itself inside a constrained flex row */\n      }\n    ";this.#n?this.#n.replaceSync(t):this.#r&&(this.#n=(0,i.fz)(t,this.#r))}#d(t,e,n){return t?.disconnect(),e?.removeAttribute(n),this.#o&&e?(0,i.EA)(this.#o,e,{includeAttrs:[n]}):null}disconnectedCallback(){super.disconnectedCallback?.(),this.#t?.disconnect(),this.#e?.disconnect(),this.#s?.disconnect()}#l(){this.toggleAttribute("has-anchor",!!this.#o),this.#c()}}const c=(0,r.Zz)(s.tQ)(h);customElements.define(a,c)},11298(t,e,n){n.d(e,{T:()=>a,q:()=>u});var s=n(88961),o=n(72270),i=n(25964),r=n(63200);const a=(0,i.xE)("attachment"),h=["top-end","top-start","top-center","bottom-start","bottom-end","bottom-center"],c=h[0];class l extends((0,o.qu)({componentName:a,baseSelector:"descope-anchored"})){#b=null;constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n      <descope-anchored>\n        <slot></slot>\n        <div slot="anchored" class="attachment-container">\n          <slot name="attachment"></slot>\n        </div>\n      </descope-anchored>\n    ',this.defaultSlot=this.shadowRoot.querySelector("slot:not([name])"),this.attachmentSlot=this.shadowRoot.querySelector('slot[name="attachment"]'),this.anchored=this.shadowRoot.querySelector("descope-anchored")}get#m(){return this.attachmentSlot?.assignedElements()[0]}static get observedAttributes(){return[...super.observedAttributes||[],"position"]}attributeChangedCallback(t,e,n){super.attributeChangedCallback?.(t,e,n),"position"===t&&e!==n&&this.#p()}init(){super.init?.(),(0,i.fz)("\n      :host {\n        display: inline-block;\n      }\n      :host(.hidden) {\n        display: none;\n      }\n      .attachment-container {\n        position: absolute;\n        z-index: 1;\n        pointer-events: none;\n        width: 100%;\n        display: flex;\n        align-items: center;\n        container-type: inline-size;\n      }\n",this),this.#p();const t=this.shadowRoot.querySelector(".attachment-container");(0,i.mx)(t,()=>this.#f(),{includeAttrs:["st-host-direction"]}),this.attachmentSlot.addEventListener("slotchange",()=>this.#f()),this.defaultSlot.addEventListener("slotchange",()=>{this.#v(),window.requestAnimationFrame(()=>this.#g())}),window.requestAnimationFrame(()=>this.#v())}#c(){const t=this.anchored?.classList?.contains("hidden");this.classList.toggle("hidden",t)}#w(){this.#b?.disconnect(),this.anchored&&(this.#b=(0,i.mx)(this.anchored,()=>this.#c(),{includeAttrs:["class"]}))}connectedCallback(){super.connectedCallback?.(),this.#c(),this.#w()}disconnectedCallback(){super.disconnectedCallback?.(),this.#b?.disconnect()}#g(){const t=this.defaultSlot?.assignedElements()?.[0],e=t?.getBoundingClientRect();if(e){const t=e.width;this.#m?.setAttribute("data-attachment-size",Number(t))}}#v(){const t=this.defaultSlot?.assignedElements()?.length>0;this.classList.toggle("hidden",!t)}#f(){const t=this.shadowRoot.querySelector(".attachment-container")?.getAttribute("st-host-direction");t&&this.#m?.setAttribute("st-host-direction",t)}get offsetX(){return this.getAttribute("offset-x")||"0px"}get offsetY(){return this.getAttribute("offset-y")||"0px"}#p(){const t=this.getAttribute("position");h.includes(t)||this.setAttribute("position",c)}}const d={selector:()=>".attachment-container"},u=(0,r.Zz)((0,s.RF)({mappings:{transform:{...d},justifyContent:{...d},maxWidth:{...d},top:{...d},bottom:{...d},left:{...d},right:{...d},offsetX:{},offsetY:{}}}),s.VO,s.tQ)(l)},28313(t,e,n){n.r(e),n.d(e,{AttachmentClass:()=>s.q,componentName:()=>s.T}),n(13094);var s=n(11298);customElements.define(s.T,s.q)}}]);
 //# sourceMappingURL=descope-attachment.js.map

package/dist/umd/descope-attachment.js.map

@@ -1 +1 @@
-{"version":3,"file":"descope-attachment.js","mappings":"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","sources":["webpack://@descope/web-components-ui/../components/descope-anchored/src/component/AnchoredClass.js","webpack://@descope/web-components-ui/../components/descope-anchored/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-attachment/src/component/AttachmentClass.js","webpack://@descope/web-components-ui/../components/descope-attachment/src/component/index.js"],"sourcesContent":["import { componentNameValidationMixin } from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport {\n  forwardAttrs,\n  getComponentName,\n  injectStyle,\n  observeAttributes,\n} from '@descope-ui/common/components-helpers';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('anchored');\n\nclass RawAnchored extends createBaseClass({\n  componentName,\n  baseSelector: '.anchored-root',\n}) {\n  #stretchObserver = null;\n\n  #directionObserver = null;\n\n  #hostStretchSheet = null;\n\n  // Observes the anchor's `class` attribute so runtime updates by the SDK\n  // (e.g. real-time conditional components toggling `.hidden`) propagate to\n  // this element. Without this, only the initial slotchange would sync.\n  #anchorClassObserver = null;\n\n  get #anchor() {\n    return this.defaultSlot.assignedElements({ flatten: true })[0];\n  }\n\n  get #anchored() {\n    return this.shadowRoot\n      .querySelector('slot[name=\"anchored\"]')\n      ?.assignedElements()[0];\n  }\n\n  get #outerHost() {\n    return this.getRootNode().host;\n  }\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n      <div class=\"anchored-root\" part=\"root\">\n        <slot></slot>\n        <div class=\"anchored-host\" part=\"anchored\">\n          <slot name=\"anchored\"></slot>\n        </div>\n      </div>\n    `;\n\n    this.defaultSlot = this.shadowRoot.querySelector('slot:not([name])');\n  }\n\n  init() {\n    super.init?.();\n\n    injectStyle(\n      `\n      :host {\n        display: inline-flex;\n        position: relative;\n        box-sizing: border-box;\n      }\n\n      :host(:not([has-anchor])) {\n        display: none;\n      }\n\n      .anchored-root {\n        position: relative;\n        display: flex;\n        width: 100%;\n        min-width: 0;\n      }\n\n      /* Make anchor fill the flex row and allow it to shrink. */\n      ::slotted(*:not([slot])) {\n        flex-grow: 1;       /* fill the flex row */\n        flex-shrink: 1;     /* compress when constrained */\n        flex-basis: auto;   /* start from the anchor's natural size */\n        min-width: 0;       /* flex items won't shrink below content size without this */\n      }\n\n      /* Anchored container covers the anchor but is invisible to pointer events. */\n      .anchored-host {\n        position: absolute;\n        inset: 0;\n        pointer-events: none;\n      }\n\n      /* Restore interactivity for actual anchored content. */\n      ::slotted([slot=\"anchored\"]) {\n        pointer-events: auto;\n      }\n      `,\n      this,\n    );\n\n    this.#syncStretchCSS();\n\n    this.defaultSlot.addEventListener('slotchange', () => this.#syncAnchor());\n\n    this.#syncAnchor();\n  }\n\n  // To support conditional components in flow, we need to sync the 'hidden' className to the root of the component.\n  // Ideally, this would happen in the SDK, but we resolved to this patch to fix the issue without forcing users to update SDKs.\n  #syncComponentState() {\n    const hasHidden = this.#anchor?.classList?.contains('hidden');\n    this.classList.toggle('hidden', hasHidden);\n  }\n\n  #syncAnchor() {\n    this.#onAnchorChanged();\n\n    this.#stretchObserver = this.#forwardAttr(\n      this.#stretchObserver,\n      this.#outerHost,\n      'stretch',\n    );\n\n    this.#directionObserver = this.#forwardAttr(\n      this.#directionObserver,\n      this.#anchored,\n      'st-host-direction',\n    );\n\n    this.#observeAnchorClass();\n  }\n\n  #observeAnchorClass() {\n    this.#anchorClassObserver?.disconnect();\n    if (this.#anchor) {\n      this.#anchorClassObserver = observeAttributes(\n        this.#anchor,\n        () => this.#syncComponentState(),\n        { includeAttrs: ['class'] },\n      );\n    }\n  }\n\n  // createBaseClass gates init() to first-connect (#isInit). Without\n  // re-observing here, runtime `.hidden` toggles stop syncing after a\n  // detach/reattach cycle.\n  connectedCallback() {\n    super.connectedCallback?.();\n    this.#observeAnchorClass();\n    this.#syncComponentState();\n  }\n\n  // Injects [stretch] layout rules into the containing component's shadow root (e.g. descope-attachment)\n  // so it stretches when the anchor has [stretch]. Replaces the existing rules on subsequent calls.\n  #syncStretchCSS() {\n    const css = `\n      descope-anchored {\n        width: 100%;          /* fill the outer host so the anchored element spans the full anchor width */\n      }\n      :host([stretch]) {\n        display: inline-flex; /* switch from inline-block so internal children are flex items */\n        width: 100%;          /* fill non-flex parents */\n        flex-grow: 1;         /* absorb extra space in flex parents */\n        flex-shrink: 0;       /* hold full width — shrink:1 would let siblings squeeze it below 100% */\n        flex-basis: auto;     /* defer to width:100% on the main axis; avoids forcing 100% height in column-flex parents */\n        min-width: 0;         /* prevent overflow when the outer host is itself inside a constrained flex row */\n      }\n    `;\n\n    if (this.#hostStretchSheet) {\n      this.#hostStretchSheet.replaceSync(css);\n    } else if (this.#outerHost) {\n      this.#hostStretchSheet = injectStyle(css, this.#outerHost);\n    }\n  }\n\n  // Reconnects forwarding to the current anchor. Disconnects the old observer and\n  // removes the stale attr from target first — forwardAttrs only sets attrs present\n  // on the source, so absent attrs won't be removed automatically.\n  #forwardAttr(observer, target, attr) {\n    observer?.disconnect();\n    target?.removeAttribute(attr);\n    if (!this.#anchor || !target) return null;\n    return forwardAttrs(this.#anchor, target, { includeAttrs: [attr] });\n  }\n\n  // Prevent stale callbacks from firing on a detached anchor after removal.\n  disconnectedCallback() {\n    super.disconnectedCallback?.();\n    this.#stretchObserver?.disconnect();\n    this.#directionObserver?.disconnect();\n    this.#anchorClassObserver?.disconnect();\n  }\n\n  // Track whether anything is slotted, so the host display rule can hide an\n  // empty host rather than reserving its layout box.\n  #onAnchorChanged() {\n    this.toggleAttribute('has-anchor', !!this.#anchor);\n    this.#syncComponentState();\n  }\n}\n\nexport const AnchoredClass = compose(componentNameValidationMixin)(RawAnchored);\n","import { componentName, AnchoredClass } from './AnchoredClass';\n\ncustomElements.define(componentName, AnchoredClass);\n\nexport { AnchoredClass, componentName };\n","import {\n  componentNameValidationMixin,\n  createStyleMixin,\n  draggableMixin,\n} from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport {\n  getComponentName,\n  injectStyle,\n  observeAttributes,\n} from '@descope-ui/common/components-helpers';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('attachment');\n\nconst ATTACHMENT_POSITIONS = [\n  'top-end',\n  'top-start',\n  'top-center',\n  'bottom-start',\n  'bottom-end',\n  'bottom-center',\n];\n\nconst DEFAULT_POSITION = ATTACHMENT_POSITIONS[0];\n\nclass RawAttachment extends createBaseClass({\n  componentName,\n  baseSelector: 'descope-anchored',\n}) {\n  // Observes the inner descope-anchored's `class` attribute so runtime\n  // updates (e.g. real-time conditional components toggling `.hidden`) keep\n  // this attachment host's class in sync. Set up in connectedCallback so\n  // reconnects work (createBaseClass gates init() to first connect only).\n  #anchoredClassObserver = null;\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n      <descope-anchored>\n        <slot></slot>\n        <div slot=\"anchored\" class=\"attachment-container\">\n          <slot name=\"attachment\"></slot>\n        </div>\n      </descope-anchored>\n    `;\n\n    this.defaultSlot = this.shadowRoot.querySelector('slot:not([name])');\n    this.attachmentSlot = this.shadowRoot.querySelector(\n      'slot[name=\"attachment\"]',\n    );\n\n    this.anchored = this.shadowRoot.querySelector('descope-anchored');\n  }\n\n  get #attachment() {\n    return this.attachmentSlot?.assignedElements()[0];\n  }\n\n  static get observedAttributes() {\n    return [...(super.observedAttributes || []), 'position'];\n  }\n\n  attributeChangedCallback(name, oldVal, newVal) {\n    super.attributeChangedCallback?.(name, oldVal, newVal);\n    if (name === 'position' && oldVal !== newVal) {\n      this.#handlePositionChange();\n    }\n  }\n\n  init() {\n    super.init?.();\n\n    injectStyle(\n      `\n      :host {\n        display: inline-block;\n      }\n      :host(.hidden) {\n        display: none;\n      }\n      .attachment-container {\n        position: absolute;\n        z-index: 1;\n        pointer-events: none;\n        width: 100%;\n        display: flex;\n        align-items: center;\n        container-type: inline-size;\n      }\n`,\n      this,\n    );\n\n    this.#handlePositionChange();\n\n    // When descope-anchored forwards st-host-direction from the anchor to this container,\n    // propagate it to the attachment elements.\n    const container = this.shadowRoot.querySelector('.attachment-container');\n    observeAttributes(container, () => this.#syncDirection(), {\n      includeAttrs: ['st-host-direction'],\n    });\n\n    // Re-sync direction when new elements are slotted into the attachment slot.\n    this.attachmentSlot.addEventListener('slotchange', () =>\n      this.#syncDirection(),\n    );\n\n    this.defaultSlot.addEventListener('slotchange', () => {\n      this.#setVisibility();\n      window.requestAnimationFrame(() => this.#syncAvailableSizeAttr());\n    });\n\n    window.requestAnimationFrame(() => this.#setVisibility());\n  }\n\n  // To support conditional components in flow, we need to sync the 'hidden' className to the root of the component.\n  // Ideally, this would happen in the SDK, but we resolved to this patch to fix the issue without forcing users to update SDKs.\n  #syncComponentState() {\n    const hasHidden = this.anchored?.classList?.contains('hidden');\n    this.classList.toggle('hidden', hasHidden);\n  }\n\n  #observeAnchored() {\n    this.#anchoredClassObserver?.disconnect();\n    if (this.anchored) {\n      this.#anchoredClassObserver = observeAttributes(\n        this.anchored,\n        () => this.#syncComponentState(),\n        { includeAttrs: ['class'] },\n      );\n    }\n  }\n\n  // createBaseClass gates init() to first-connect, so observing here is\n  // required for the detach/reattach cycle to keep working.\n  connectedCallback() {\n    super.connectedCallback?.();\n    this.#syncComponentState();\n    this.#observeAnchored();\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback?.();\n    this.#anchoredClassObserver?.disconnect();\n  }\n\n  #syncAvailableSizeAttr() {\n    const anchor = this.defaultSlot?.assignedElements()?.[0];\n\n    const anchorRect = anchor?.getBoundingClientRect();\n    if (anchorRect) {\n      const availableWidth = anchorRect.width;\n      this.#attachment?.setAttribute(\n        'data-attachment-size',\n        Number(availableWidth),\n      );\n    }\n  }\n\n  #setVisibility() {\n    const hasAnchor = this.defaultSlot?.assignedElements()?.length > 0;\n    this.classList.toggle('hidden', !hasAnchor);\n  }\n\n  #syncDirection() {\n    const direction = this.shadowRoot\n      .querySelector('.attachment-container')\n      ?.getAttribute('st-host-direction');\n\n    if (!direction) return;\n    // currently we support direction sync only for web-components-ui\n    // elements, which support st-host-direction attribute.\n    this.#attachment?.setAttribute('st-host-direction', direction);\n  }\n\n  get offsetX() {\n    return this.getAttribute('offset-x') || '0px';\n  }\n\n  get offsetY() {\n    return this.getAttribute('offset-y') || '0px';\n  }\n\n  #handlePositionChange() {\n    const pos = this.getAttribute('position');\n    if (!ATTACHMENT_POSITIONS.includes(pos)) {\n      this.setAttribute('position', DEFAULT_POSITION);\n    }\n  }\n}\n\nconst attachmentContainer = { selector: () => '.attachment-container' };\n\nexport const AttachmentClass = compose(\n  createStyleMixin({\n    mappings: {\n      transform: { ...attachmentContainer },\n      justifyContent: { ...attachmentContainer },\n      maxWidth: { ...attachmentContainer },\n      top: { ...attachmentContainer },\n      bottom: { ...attachmentContainer },\n      left: { ...attachmentContainer },\n      right: { ...attachmentContainer },\n      offsetX: {},\n      offsetY: {},\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawAttachment);\n","import '@descope-ui/descope-anchored';\nimport { componentName, AttachmentClass } from './AttachmentClass';\n\ncustomElements.define(componentName, AttachmentClass);\n\nexport { AttachmentClass, componentName };\n"],"names":["componentName","RawAnchored","baseSelector","this","defaultSlot","assignedElements","flatten","shadowRoot","querySelector","getRootNode","host","constructor","super","attachShadow","mode","innerHTML","init","addEventListener","hasHidden","classList","contains","toggle","disconnect","includeAttrs","connectedCallback","css","replaceSync","observer","target","attr","removeAttribute","disconnectedCallback","toggleAttribute","AnchoredClass","customElements","define","ATTACHMENT_POSITIONS","DEFAULT_POSITION","RawAttachment","attachmentSlot","anchored","observedAttributes","attributeChangedCallback","name","oldVal","newVal","container","window","requestAnimationFrame","anchor","anchorRect","getBoundingClientRect","availableWidth","width","setAttribute","Number","hasAnchor","length","direction","getAttribute","offsetX","offsetY","pos","includes","attachmentContainer","selector","AttachmentClass","mappings","transform","justifyContent","maxWidth","top","bottom","left","right"],"sourceRoot":""}
+{"version":3,"file":"descope-attachment.js","mappings":"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","sources":["webpack://@descope/web-components-ui/../components/descope-anchored/src/component/AnchoredClass.js","webpack://@descope/web-components-ui/../components/descope-anchored/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-attachment/src/component/AttachmentClass.js","webpack://@descope/web-components-ui/../components/descope-attachment/src/component/index.js"],"sourcesContent":["import { componentNameValidationMixin } from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport {\n  forwardAttrs,\n  getComponentName,\n  injectStyle,\n  observeAttributes,\n} from '@descope-ui/common/components-helpers';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('anchored');\n\nclass RawAnchored extends createBaseClass({\n  componentName,\n  baseSelector: '.anchored-root',\n}) {\n  #stretchObserver = null;\n\n  #directionObserver = null;\n\n  #hostStretchSheet = null;\n\n  // Observes the anchor's `class` attribute so runtime updates by the SDK\n  // (e.g. real-time conditional components toggling `.hidden`) propagate to\n  // this element. Without this, only the initial slotchange would sync.\n  #anchorClassObserver = null;\n\n  get #anchor() {\n    return this.defaultSlot.assignedElements({ flatten: true })[0];\n  }\n\n  get #anchored() {\n    return this.shadowRoot\n      .querySelector('slot[name=\"anchored\"]')\n      ?.assignedElements()[0];\n  }\n\n  get #outerHost() {\n    return this.getRootNode().host;\n  }\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n      <div class=\"anchored-root\" part=\"root\">\n        <slot></slot>\n        <div class=\"anchored-host\" part=\"anchored\">\n          <slot name=\"anchored\"></slot>\n        </div>\n      </div>\n    `;\n\n    this.defaultSlot = this.shadowRoot.querySelector('slot:not([name])');\n  }\n\n  init() {\n    super.init?.();\n\n    injectStyle(\n      `\n      :host {\n        display: inline-flex;\n        position: relative;\n        box-sizing: border-box;\n      }\n\n      :host(:not([has-anchor])) {\n        display: none;\n      }\n\n      .anchored-root {\n        position: relative;\n        display: flex;\n        width: 100%;\n        min-width: 0;\n      }\n\n      /* Make anchor fill the flex row and allow it to shrink. */\n      ::slotted(*:not([slot])) {\n        flex-grow: 1;       /* fill the flex row */\n        flex-shrink: 1;     /* compress when constrained */\n        flex-basis: auto;   /* start from the anchor's natural size */\n        min-width: 0;       /* flex items won't shrink below content size without this */\n      }\n\n      /* Anchored container covers the anchor but is invisible to pointer events. */\n      .anchored-host {\n        position: absolute;\n        inset: 0;\n        pointer-events: none;\n      }\n\n      /* Restore interactivity for actual anchored content. */\n      ::slotted([slot=\"anchored\"]) {\n        pointer-events: auto;\n      }\n      `,\n      this,\n    );\n\n    this.#syncStretchCSS();\n\n    this.defaultSlot.addEventListener('slotchange', () => this.#syncAnchor());\n\n    this.#syncAnchor();\n  }\n\n  // To support conditional components in flow, we need to sync the 'hidden' className to the root of the component.\n  // Ideally, this would happen in the SDK, but we resolved to this patch to fix the issue without forcing users to update SDKs.\n  #syncComponentState() {\n    const hasHidden = this.#anchor?.classList?.contains('hidden');\n    this.classList.toggle('hidden', hasHidden);\n  }\n\n  #syncAnchor() {\n    this.#onAnchorChanged();\n\n    this.#stretchObserver = this.#forwardAttr(\n      this.#stretchObserver,\n      this.#outerHost,\n      'stretch',\n    );\n\n    this.#directionObserver = this.#forwardAttr(\n      this.#directionObserver,\n      this.#anchored,\n      'st-host-direction',\n    );\n\n    this.#observeAnchorClass();\n  }\n\n  #observeAnchorClass() {\n    this.#anchorClassObserver?.disconnect();\n    if (this.#anchor) {\n      this.#anchorClassObserver = observeAttributes(\n        this.#anchor,\n        () => this.#syncComponentState(),\n        { includeAttrs: ['class'] },\n      );\n    }\n  }\n\n  // createBaseClass gates init() to first-connect (#isInit). Without\n  // re-observing here, runtime `.hidden` toggles stop syncing after a\n  // detach/reattach cycle.\n  connectedCallback() {\n    super.connectedCallback?.();\n    this.#observeAnchorClass();\n    this.#syncComponentState();\n  }\n\n  // Injects [stretch] layout rules into the containing component's shadow root (e.g. descope-attachment)\n  // so it stretches when the anchor has [stretch]. Replaces the existing rules on subsequent calls.\n  #syncStretchCSS() {\n    const css = `\n      descope-anchored {\n        width: 100%;          /* fill the outer host so the anchored element spans the full anchor width */\n      }\n      :host([stretch]) {\n        display: inline-flex; /* switch from inline-block so internal children are flex items */\n        width: 100%;          /* fill non-flex parents */\n        flex-grow: 1;         /* absorb extra space in flex parents */\n        flex-shrink: 0;       /* hold full width — shrink:1 would let siblings squeeze it below 100% */\n        flex-basis: auto;     /* defer to width:100% on the main axis; avoids forcing 100% height in column-flex parents */\n        min-width: 0;         /* prevent overflow when the outer host is itself inside a constrained flex row */\n      }\n    `;\n\n    if (this.#hostStretchSheet) {\n      this.#hostStretchSheet.replaceSync(css);\n    } else if (this.#outerHost) {\n      this.#hostStretchSheet = injectStyle(css, this.#outerHost);\n    }\n  }\n\n  // Reconnects forwarding to the current anchor. Disconnects the old observer and\n  // removes the stale attr from target first — forwardAttrs only sets attrs present\n  // on the source, so absent attrs won't be removed automatically.\n  #forwardAttr(observer, target, attr) {\n    observer?.disconnect();\n    target?.removeAttribute(attr);\n    if (!this.#anchor || !target) return null;\n    return forwardAttrs(this.#anchor, target, { includeAttrs: [attr] });\n  }\n\n  // Prevent stale callbacks from firing on a detached anchor after removal.\n  disconnectedCallback() {\n    super.disconnectedCallback?.();\n    this.#stretchObserver?.disconnect();\n    this.#directionObserver?.disconnect();\n    this.#anchorClassObserver?.disconnect();\n  }\n\n  // Track whether anything is slotted, so the host display rule can hide an\n  // empty host rather than reserving its layout box.\n  #onAnchorChanged() {\n    this.toggleAttribute('has-anchor', !!this.#anchor);\n    this.#syncComponentState();\n  }\n}\n\nexport const AnchoredClass = compose(componentNameValidationMixin)(RawAnchored);\n","import { componentName, AnchoredClass } from './AnchoredClass';\n\ncustomElements.define(componentName, AnchoredClass);\n\nexport { AnchoredClass, componentName };\n","import {\n  componentNameValidationMixin,\n  createStyleMixin,\n  draggableMixin,\n} from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport {\n  getComponentName,\n  injectStyle,\n  observeAttributes,\n} from '@descope-ui/common/components-helpers';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('attachment');\n\nconst ATTACHMENT_POSITIONS = [\n  'top-end',\n  'top-start',\n  'top-center',\n  'bottom-start',\n  'bottom-end',\n  'bottom-center',\n];\n\nconst DEFAULT_POSITION = ATTACHMENT_POSITIONS[0];\n\nclass RawAttachment extends createBaseClass({\n  componentName,\n  baseSelector: 'descope-anchored',\n}) {\n  // Observes the inner descope-anchored's `class` attribute so runtime\n  // updates (e.g. real-time conditional components toggling `.hidden`) keep\n  // this attachment host's class in sync. Set up in connectedCallback so\n  // reconnects work (createBaseClass gates init() to first connect only).\n  #anchoredClassObserver = null;\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n      <descope-anchored>\n        <slot></slot>\n        <div slot=\"anchored\" class=\"attachment-container\">\n          <slot name=\"attachment\"></slot>\n        </div>\n      </descope-anchored>\n    `;\n\n    this.defaultSlot = this.shadowRoot.querySelector('slot:not([name])');\n    this.attachmentSlot = this.shadowRoot.querySelector(\n      'slot[name=\"attachment\"]',\n    );\n\n    this.anchored = this.shadowRoot.querySelector('descope-anchored');\n  }\n\n  get #attachment() {\n    return this.attachmentSlot?.assignedElements()[0];\n  }\n\n  static get observedAttributes() {\n    return [...(super.observedAttributes || []), 'position'];\n  }\n\n  attributeChangedCallback(name, oldVal, newVal) {\n    super.attributeChangedCallback?.(name, oldVal, newVal);\n    if (name === 'position' && oldVal !== newVal) {\n      this.#handlePositionChange();\n    }\n  }\n\n  init() {\n    super.init?.();\n\n    injectStyle(\n      `\n      :host {\n        display: inline-block;\n      }\n      :host(.hidden) {\n        display: none;\n      }\n      .attachment-container {\n        position: absolute;\n        z-index: 1;\n        pointer-events: none;\n        width: 100%;\n        display: flex;\n        align-items: center;\n        container-type: inline-size;\n      }\n`,\n      this,\n    );\n\n    this.#handlePositionChange();\n\n    // When descope-anchored forwards st-host-direction from the anchor to this container,\n    // propagate it to the attachment elements.\n    const container = this.shadowRoot.querySelector('.attachment-container');\n    observeAttributes(container, () => this.#syncDirection(), {\n      includeAttrs: ['st-host-direction'],\n    });\n\n    // Re-sync direction when new elements are slotted into the attachment slot.\n    this.attachmentSlot.addEventListener('slotchange', () =>\n      this.#syncDirection(),\n    );\n\n    this.defaultSlot.addEventListener('slotchange', () => {\n      this.#setVisibility();\n      window.requestAnimationFrame(() => this.#syncAvailableSizeAttr());\n    });\n\n    window.requestAnimationFrame(() => this.#setVisibility());\n  }\n\n  // To support conditional components in flow, we need to sync the 'hidden' className to the root of the component.\n  // Ideally, this would happen in the SDK, but we resolved to this patch to fix the issue without forcing users to update SDKs.\n  #syncComponentState() {\n    const hasHidden = this.anchored?.classList?.contains('hidden');\n    this.classList.toggle('hidden', hasHidden);\n  }\n\n  #observeAnchored() {\n    this.#anchoredClassObserver?.disconnect();\n    if (this.anchored) {\n      this.#anchoredClassObserver = observeAttributes(\n        this.anchored,\n        () => this.#syncComponentState(),\n        { includeAttrs: ['class'] },\n      );\n    }\n  }\n\n  // createBaseClass gates init() to first-connect, so observing here is\n  // required for the detach/reattach cycle to keep working.\n  connectedCallback() {\n    super.connectedCallback?.();\n    this.#syncComponentState();\n    this.#observeAnchored();\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback?.();\n    this.#anchoredClassObserver?.disconnect();\n  }\n\n  #syncAvailableSizeAttr() {\n    const anchor = this.defaultSlot?.assignedElements()?.[0];\n\n    const anchorRect = anchor?.getBoundingClientRect();\n    if (anchorRect) {\n      const availableWidth = anchorRect.width;\n      this.#attachment?.setAttribute(\n        'data-attachment-size',\n        Number(availableWidth),\n      );\n    }\n  }\n\n  #setVisibility() {\n    const hasAnchor = this.defaultSlot?.assignedElements()?.length > 0;\n    this.classList.toggle('hidden', !hasAnchor);\n  }\n\n  #syncDirection() {\n    const direction = this.shadowRoot\n      .querySelector('.attachment-container')\n      ?.getAttribute('st-host-direction');\n\n    if (!direction) return;\n    // currently we support direction sync only for web-components-ui\n    // elements, which support st-host-direction attribute.\n    this.#attachment?.setAttribute('st-host-direction', direction);\n  }\n\n  get offsetX() {\n    return this.getAttribute('offset-x') || '0px';\n  }\n\n  get offsetY() {\n    return this.getAttribute('offset-y') || '0px';\n  }\n\n  #handlePositionChange() {\n    const pos = this.getAttribute('position');\n    if (!ATTACHMENT_POSITIONS.includes(pos)) {\n      this.setAttribute('position', DEFAULT_POSITION);\n    }\n  }\n}\n\nconst attachmentContainer = { selector: () => '.attachment-container' };\n\nexport const AttachmentClass = compose(\n  createStyleMixin({\n    mappings: {\n      transform: { ...attachmentContainer },\n      justifyContent: { ...attachmentContainer },\n      maxWidth: { ...attachmentContainer },\n      top: { ...attachmentContainer },\n      bottom: { ...attachmentContainer },\n      left: { ...attachmentContainer },\n      right: { ...attachmentContainer },\n      offsetX: {},\n      offsetY: {},\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawAttachment);\n","import '@descope-ui/descope-anchored';\nimport { componentName, AttachmentClass } from './AttachmentClass';\n\ncustomElements.define(componentName, AttachmentClass);\n\nexport { AttachmentClass, componentName };\n"],"names":["componentName","RawAnchored","baseSelector","this","defaultSlot","assignedElements","flatten","shadowRoot","querySelector","getRootNode","host","constructor","super","attachShadow","mode","innerHTML","init","addEventListener","hasHidden","classList","contains","toggle","disconnect","includeAttrs","connectedCallback","css","replaceSync","observer","target","attr","removeAttribute","disconnectedCallback","toggleAttribute","AnchoredClass","customElements","define","ATTACHMENT_POSITIONS","DEFAULT_POSITION","RawAttachment","attachmentSlot","anchored","observedAttributes","attributeChangedCallback","name","oldVal","newVal","container","window","requestAnimationFrame","anchor","anchorRect","getBoundingClientRect","availableWidth","width","setAttribute","Number","hasAnchor","length","direction","getAttribute","offsetX","offsetY","pos","includes","attachmentContainer","selector","AttachmentClass","mappings","transform","justifyContent","maxWidth","top","bottom","left","right"],"sourceRoot":""}

package/dist/umd/descope-badge.js

@@ -1,2 +1,2 @@
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[4188],{77888(t,e,o){o.d(e,{T:()=>a,e:()=>h});var r=o(88961),n=o(72270),i=o(25964),s=o(63200);const a=(0,i.xE)("badge");class d extends((0,n.qu)({componentName:a,baseSelector:":host > div"})){static get observedAttributes(){return["data-attachment-size","shrink-to-indicator-threshold"]}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<div>\n      <slot></slot>\n\t\t</div>\n\t\t",(0,i.fz)("\n      :host {\n        display: inline-flex;\n      }\n      :host > div {\n        position: relative;\n        width: 100%;\n        text-overflow: ellipsis;\n        overflow: hidden;\n        white-space: nowrap;\n      }\n      ",this)}get shrinkToIndicatorThreshold(){return this.getAttribute("shrink-to-indicator-threshold")||65}#t(t){this.toggleAttribute("shrink-to-indicator",parseFloat(t)<this.shrinkToIndicatorThreshold)}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),"data-attachment-size"===t&&e!==o&&this.#t(o)}}const h=(0,s.Zz)((0,r.RF)({mappings:{hostWidth:[{selector:()=>":host",property:"width"}],hostHeight:[{selector:()=>":host",property:"height"}],hostDirection:{property:"direction"},fontFamily:{},fontSize:{},fontWeight:{},textTransform:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-left"},{property:"padding-right"}],borderWidth:{},borderStyle:{},borderColor:{},borderRadius:{},backgroundColor:{},textColor:{property:"color"},textAlign:{},boxShadow:{},textIndent:{}}}),r.VO,r.tQ)(d)},11065(t,e,o){o.r(e),o.d(e,{BadgeClass:()=>r.e,componentName:()=>r.T});var r=o(77888);customElements.define(r.T,r.e)}}]);
+"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[4188],{77888(t,e,o){o.d(e,{T:()=>a,e:()=>h});var r=o(88961),n=o(72270),i=o(25964),s=o(63200);const a=(0,i.xE)("badge");class d extends((0,n.qu)({componentName:a,baseSelector:":host > div"})){static get observedAttributes(){return["data-attachment-size","shrink-to-indicator-threshold"]}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<div>\n      <slot></slot>\n\t\t</div>\n\t\t",(0,i.fz)("\n      :host {\n        display: inline-flex;\n      }\n      :host > div {\n        position: relative;\n        width: 100%;\n        text-overflow: ellipsis;\n        overflow: hidden;\n        white-space: nowrap;\n      }\n      ",this)}get shrinkToIndicatorThreshold(){return this.getAttribute("shrink-to-indicator-threshold")||65}#t(t){this.toggleAttribute("shrink-to-indicator",parseFloat(t)<this.shrinkToIndicatorThreshold)}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),"data-attachment-size"===t&&e!==o&&this.#t(o)}}const h=(0,s.Zz)((0,r.RF)({mappings:{hostWidth:[{selector:()=>":host",property:"width"}],hostHeight:[{selector:()=>":host",property:"height"}],hostDirection:{property:"direction"},fontFamily:{},fontSize:{},fontWeight:{},lineHeight:{},textTransform:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-left"},{property:"padding-right"}],borderWidth:{},borderStyle:{},borderColor:{},borderRadius:{},backgroundColor:{},textColor:{property:"color"},textAlign:{},boxShadow:{},textIndent:{}}}),r.VO,r.tQ)(d)},11065(t,e,o){o.r(e),o.d(e,{BadgeClass:()=>r.e,componentName:()=>r.T});var r=o(77888);customElements.define(r.T,r.e)}}]);
 //# sourceMappingURL=descope-badge.js.map

package/dist/umd/descope-badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"descope-badge.js","mappings":"+MAYO,MAAMA,GAAgB,QAAiB,SAE9C,MAAMC,WAAiB,QAAgB,CACrCD,gBACAE,aAAc,iBAEd,6BAAWC,GACT,MAAO,CAAC,uBAAwB,gCAClC,CAEA,WAAAC,GACEC,QAEAC,KAAKC,aAAa,CAAEC,KAAM,SAAUC,UAAY,sDAMhD,QACE,8OAYAH,KAEJ,CAEA,8BAAII,GACF,OAAOJ,KAAKK,aAAa,kCAAoC,EAC/D,CAEA,GAAyBC,GACvBN,KAAKO,gBACH,sBACAC,WAAWF,GAASN,KAAKI,2BAE7B,CAEA,wBAAAK,CAAyBC,EAAMC,EAAQC,GACrCb,MAAMU,2BAA2BC,EAAMC,EAAQC,GAClC,yBAATF,GAAmCC,IAAWC,GAChDZ,MAAK,EAAyBY,EAElC,EAGK,MAAMC,GAAa,SACxB,QAAiB,CACfC,SAAU,CACRC,UAAW,CAAC,CAAEC,SAAU,IAAM,QAASC,SAAU,UACjDC,WAAY,CAAC,CAAEF,SAAU,IAAM,QAASC,SAAU,WAClDE,cAAe,CAAEF,SAAU,aAE3BG,WAAY,CAAC,EACbC,SAAU,CAAC,EACXC,WAAY,CAAC,EACbC,cAAe,CAAC,EAChBC,gBAAiB,CACf,CAAEP,SAAU,eACZ,CAAEA,SAAU,mBAEdQ,kBAAmB,CACjB,CAAER,SAAU,gBACZ,CAAEA,SAAU,kBAGdS,YAAa,CAAC,EACdC,YAAa,CAAC,EACdC,YAAa,CAAC,EACdC,aAAc,CAAC,EAEfC,gBAAiB,CAAC,EAElBC,UAAW,CAAEd,SAAU,SACvBe,UAAW,CAAC,EACZC,UAAW,CAAC,EACZC,WAAY,CAAC,KAGjB,KACA,KAlCwB,CAmCxBvC,E,uFCpGFwC,eAAeC,OAAO,IAAe,I","sources":["webpack://@descope/web-components-ui/../components/descope-badge/src/component/BadgeClass.js","webpack://@descope/web-components-ui/../components/descope-badge/src/component/index.js"],"sourcesContent":["import {\n  componentNameValidationMixin,\n  createStyleMixin,\n  draggableMixin,\n} from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport {\n  getComponentName,\n  injectStyle,\n} from '@descope-ui/common/components-helpers';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('badge');\n\nclass RawBadge extends createBaseClass({\n  componentName,\n  baseSelector: ':host > div',\n}) {\n  static get observedAttributes() {\n    return ['data-attachment-size', 'shrink-to-indicator-threshold'];\n  }\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n\t\t<div>\n      <slot></slot>\n\t\t</div>\n\t\t`;\n\n    injectStyle(\n      `\n      :host {\n        display: inline-flex;\n      }\n      :host > div {\n        position: relative;\n        width: 100%;\n        text-overflow: ellipsis;\n        overflow: hidden;\n        white-space: nowrap;\n      }\n      `,\n      this,\n    );\n  }\n\n  get shrinkToIndicatorThreshold() {\n    return this.getAttribute('shrink-to-indicator-threshold') || 65;\n  }\n\n  #handleShrinkToIndicator(value) {\n    this.toggleAttribute(\n      'shrink-to-indicator',\n      parseFloat(value) < this.shrinkToIndicatorThreshold,\n    );\n  }\n\n  attributeChangedCallback(name, oldVal, newVal) {\n    super.attributeChangedCallback?.(name, oldVal, newVal);\n    if (name === 'data-attachment-size' && oldVal !== newVal) {\n      this.#handleShrinkToIndicator(newVal);\n    }\n  }\n}\n\nexport const BadgeClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: [{ selector: () => ':host', property: 'width' }],\n      hostHeight: [{ selector: () => ':host', property: 'height' }],\n      hostDirection: { property: 'direction' },\n\n      fontFamily: {},\n      fontSize: {},\n      fontWeight: {},\n      textTransform: {},\n      verticalPadding: [\n        { property: 'padding-top' },\n        { property: 'padding-bottom' },\n      ],\n      horizontalPadding: [\n        { property: 'padding-left' },\n        { property: 'padding-right' },\n      ],\n\n      borderWidth: {},\n      borderStyle: {},\n      borderColor: {},\n      borderRadius: {},\n\n      backgroundColor: {},\n\n      textColor: { property: 'color' },\n      textAlign: {},\n      boxShadow: {},\n      textIndent: {},\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawBadge);\n","import { componentName, BadgeClass } from './BadgeClass';\n\ncustomElements.define(componentName, BadgeClass);\n\nexport { BadgeClass, componentName };\n"],"names":["componentName","RawBadge","baseSelector","observedAttributes","constructor","super","this","attachShadow","mode","innerHTML","shrinkToIndicatorThreshold","getAttribute","value","toggleAttribute","parseFloat","attributeChangedCallback","name","oldVal","newVal","BadgeClass","mappings","hostWidth","selector","property","hostHeight","hostDirection","fontFamily","fontSize","fontWeight","textTransform","verticalPadding","horizontalPadding","borderWidth","borderStyle","borderColor","borderRadius","backgroundColor","textColor","textAlign","boxShadow","textIndent","customElements","define"],"sourceRoot":""}
+{"version":3,"file":"descope-badge.js","mappings":"+MAYO,MAAMA,GAAgB,QAAiB,SAE9C,MAAMC,WAAiB,QAAgB,CACrCD,gBACAE,aAAc,iBAEd,6BAAWC,GACT,MAAO,CAAC,uBAAwB,gCAClC,CAEA,WAAAC,GACEC,QAEAC,KAAKC,aAAa,CAAEC,KAAM,SAAUC,UAAY,sDAMhD,QACE,8OAYAH,KAEJ,CAEA,8BAAII,GACF,OAAOJ,KAAKK,aAAa,kCAAoC,EAC/D,CAEA,GAAyBC,GACvBN,KAAKO,gBACH,sBACAC,WAAWF,GAASN,KAAKI,2BAE7B,CAEA,wBAAAK,CAAyBC,EAAMC,EAAQC,GACrCb,MAAMU,2BAA2BC,EAAMC,EAAQC,GAClC,yBAATF,GAAmCC,IAAWC,GAChDZ,MAAK,EAAyBY,EAElC,EAGK,MAAMC,GAAa,SACxB,QAAiB,CACfC,SAAU,CACRC,UAAW,CAAC,CAAEC,SAAU,IAAM,QAASC,SAAU,UACjDC,WAAY,CAAC,CAAEF,SAAU,IAAM,QAASC,SAAU,WAClDE,cAAe,CAAEF,SAAU,aAE3BG,WAAY,CAAC,EACbC,SAAU,CAAC,EACXC,WAAY,CAAC,EACbC,WAAY,CAAC,EACbC,cAAe,CAAC,EAChBC,gBAAiB,CACf,CAAER,SAAU,eACZ,CAAEA,SAAU,mBAEdS,kBAAmB,CACjB,CAAET,SAAU,gBACZ,CAAEA,SAAU,kBAGdU,YAAa,CAAC,EACdC,YAAa,CAAC,EACdC,YAAa,CAAC,EACdC,aAAc,CAAC,EAEfC,gBAAiB,CAAC,EAElBC,UAAW,CAAEf,SAAU,SACvBgB,UAAW,CAAC,EACZC,UAAW,CAAC,EACZC,WAAY,CAAC,KAGjB,KACA,KAnCwB,CAoCxBxC,E,uFCrGFyC,eAAeC,OAAO,IAAe,I","sources":["webpack://@descope/web-components-ui/../components/descope-badge/src/component/BadgeClass.js","webpack://@descope/web-components-ui/../components/descope-badge/src/component/index.js"],"sourcesContent":["import {\n  componentNameValidationMixin,\n  createStyleMixin,\n  draggableMixin,\n} from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport {\n  getComponentName,\n  injectStyle,\n} from '@descope-ui/common/components-helpers';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('badge');\n\nclass RawBadge extends createBaseClass({\n  componentName,\n  baseSelector: ':host > div',\n}) {\n  static get observedAttributes() {\n    return ['data-attachment-size', 'shrink-to-indicator-threshold'];\n  }\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n\t\t<div>\n      <slot></slot>\n\t\t</div>\n\t\t`;\n\n    injectStyle(\n      `\n      :host {\n        display: inline-flex;\n      }\n      :host > div {\n        position: relative;\n        width: 100%;\n        text-overflow: ellipsis;\n        overflow: hidden;\n        white-space: nowrap;\n      }\n      `,\n      this,\n    );\n  }\n\n  get shrinkToIndicatorThreshold() {\n    return this.getAttribute('shrink-to-indicator-threshold') || 65;\n  }\n\n  #handleShrinkToIndicator(value) {\n    this.toggleAttribute(\n      'shrink-to-indicator',\n      parseFloat(value) < this.shrinkToIndicatorThreshold,\n    );\n  }\n\n  attributeChangedCallback(name, oldVal, newVal) {\n    super.attributeChangedCallback?.(name, oldVal, newVal);\n    if (name === 'data-attachment-size' && oldVal !== newVal) {\n      this.#handleShrinkToIndicator(newVal);\n    }\n  }\n}\n\nexport const BadgeClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: [{ selector: () => ':host', property: 'width' }],\n      hostHeight: [{ selector: () => ':host', property: 'height' }],\n      hostDirection: { property: 'direction' },\n\n      fontFamily: {},\n      fontSize: {},\n      fontWeight: {},\n      lineHeight: {},\n      textTransform: {},\n      verticalPadding: [\n        { property: 'padding-top' },\n        { property: 'padding-bottom' },\n      ],\n      horizontalPadding: [\n        { property: 'padding-left' },\n        { property: 'padding-right' },\n      ],\n\n      borderWidth: {},\n      borderStyle: {},\n      borderColor: {},\n      borderRadius: {},\n\n      backgroundColor: {},\n\n      textColor: { property: 'color' },\n      textAlign: {},\n      boxShadow: {},\n      textIndent: {},\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawBadge);\n","import { componentName, BadgeClass } from './BadgeClass';\n\ncustomElements.define(componentName, BadgeClass);\n\nexport { BadgeClass, componentName };\n"],"names":["componentName","RawBadge","baseSelector","observedAttributes","constructor","super","this","attachShadow","mode","innerHTML","shrinkToIndicatorThreshold","getAttribute","value","toggleAttribute","parseFloat","attributeChangedCallback","name","oldVal","newVal","BadgeClass","mappings","hostWidth","selector","property","hostHeight","hostDirection","fontFamily","fontSize","fontWeight","lineHeight","textTransform","verticalPadding","horizontalPadding","borderWidth","borderStyle","borderColor","borderRadius","backgroundColor","textColor","textAlign","boxShadow","textIndent","customElements","define"],"sourceRoot":""}

package/dist/umd/descope-date-field-descope-calendar-index-js.js

@@ -1,5 +1,5 @@
 /*! For license information please see descope-date-field-descope-calendar-index-js.js.LICENSE.txt */
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[5691,6028],{89389(t,o,e){e.d(o,{$:()=>p});var r=e(13256),a=e(55774),i=e(82901),n=e(72562),s=e(81488),l=e(87550);const d=e(51450).AH`
+"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[5087,5691,6028],{19624(t,e,o){o.d(e,{J:()=>p,T:()=>l});var r=o(63200),i=o(25964),a=o(88961),n=o(98538),s=o(10767);const l=(0,i.xE)("button"),{host:d,label:c,slottedIcon:h}={host:{selector:()=>":host"},label:{selector:"::part(label)"},slottedIcon:{selector:()=>"::slotted(descope-icon)"}};let u;const p=(0,r.Zz)((0,a.DM)({triggers:[{attr:"full-width",value:"true"}]}),(0,a.RF)({mappings:{hostWidth:{property:"width"},hostMaxWidth:{...d,property:"max-width"},hostHeight:{property:"height"},hostDirection:{...d,property:"direction"},fontSize:{},fontFamily:{},fontWeight:{},cursor:{},backgroundColor:{},outlineOffset:{},outlineColor:{},outlineStyle:{},outlineWidth:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-right",fallback:"0.875em"},{property:"padding-left",fallback:"0.875em"}],labelTextColor:{property:"color"},iconColor:{selector:()=>"::slotted(*)",property:n.S.cssVarList.fill},labelTextDecoration:{...c,property:"text-decoration"},labelSpacing:{...c,property:"gap"},textAlign:{...c,property:"justify-content",fallback:"center"},iconSize:[{...h,property:"width"},{...h,property:"height"}]}}),s.G,a.VO,a.tQ)((0,a.tz)({slots:["","prefix","label","suffix"],wrappedEleName:"vaadin-button",style:()=>`\n\t\t\t\n\t:host {\n\t\tdisplay: inline-block;\n\t\tbox-sizing: border-box;\n\t}\n\tvaadin-button::before,\n\tvaadin-button::after {\n\t\topacity: 0;\n\t}\n\tvaadin-button {\n\t\tmargin: 0;\n\t\tmin-width: 0;\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tbox-shadow: none;\n\t}\n\tvaadin-button::part(label) {\n\t\tpadding: 0;\n    width: 100%;\n\t}\n\tvaadin-button::part(prefix) {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n\n\t\t\t\n\tvaadin-button::part(prefix),\n\tvaadin-button::part(label) {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n\n\t\t\t${u}\n\t\t\tvaadin-button::part(label) { pointer-events: none; }\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${p.cssVarList.outlineWidth}) + var(${p.cssVarList.outlineOffset}));\n\t\t\t}\n      :host([full-width="true"]) {\n        width: var(${p.cssVarList.hostWidth});\n      }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${p.cssVarList.hostHeight}) - var(${p.cssVarList.outlineWidth}) - var(${p.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square="true"]:not([full-width="true"]) {\n\t\t\t\twidth: calc(var(${p.cssVarList.hostWidth}) - var(${p.cssVarList.outlineWidth}) - var(${p.cssVarList.outlineOffset}));\n        padding: 0;\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex","class","style"],componentName:l})),{color:m,fontSize:b}=p.cssVarList;u=`\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading="true"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${m});\n\t\ttop: calc(50% - (var(${b}) / 2));\n\t\tleft: calc(50% - (var(${b}) / 2));\n\t\tborder-width: calc(var(${b}) / 10);\n\t\twidth: var(${b});\n\t\theight: var(${b});\n\t}\n\t:host([disabled="true"]),\n\t:host([loading="true"]) {\n\t\tpointer-events: none;\n\t}\n\t:host([loading="true"]) ::part(prefix),\n\t:host([loading="true"]) ::part(label) {\n\t\tvisibility: hidden;\n\t}\n`},10767(t,e,o){o.d(e,{G:()=>r});const r=t=>class extends t{get isLoading(){return"true"===this.getAttribute("loading")}click(){this.isLoading||super.click()}}},30576(t,e,o){o.r(e),o.d(e,{ButtonClass:()=>r.J,componentName:()=>r.T});var r=o(19624);o(83799),customElements.define(r.T,r.J)},98538(t,e,o){o.d(e,{S:()=>l,T:()=>s});var r=o(88961),i=o(25964),a=o(8512),n=o(63200);const s=(0,i.xE)("icon"),l=(0,n.Zz)((0,r.RF)({mappings:{fill:[{},{property:a.q.cssVarList.fill}],height:{selector:()=>":host"},width:{selector:()=>":host"}}}),r.VO,r.tQ)((0,r.tz)({slots:[],wrappedEleName:"descope-image",style:()=>"\n      :host {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        max-height: 100%;\n      }\n      ",excludeAttrsSync:["tabindex","class","style","st-height","st-width"],componentName:s}))},8512(t,e,o){o.d(e,{T:()=>l,q:()=>h});var r=o(88961),i=o(72270),a=o(63200),n=o(25964),s=o(18782);const l=(0,n.xE)("image"),d=["src","src-dark"];class c extends((0,i.qu)({componentName:l,baseSelector:"slot"})){static get observedAttributes(){return d}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<slot></slot>\n\t",(0,n.fz)("\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n      :host > slot {\n        width: 100%;\n        height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n      ::slotted(*) {\n        width: 100%;\n\t\t\t}\n\n      .hidden {\n        display: none;\n      }\n      ",this)}init(){super.init?.(),this.toggleVisibility(this.getSrc)}onThemeChange(){this.renderImage()}toggleVisibility(t){t?this.classList.remove("hidden"):this.classList.add("hidden")}get altText(){return this.getAttribute("alt")||""}get legacySrc(){return this.getAttribute("src")}get themeSrc(){return this.getAttribute(`src-${this.currentThemeName}`)}get getSrc(){return this.themeSrc||this.legacySrc}updateFillColor(t){[t,...t.querySelectorAll("*[fill]")].forEach(t=>{t.setAttribute("fill",`var(${h.cssVarList.fill}, ${t.getAttribute("fill")||"''"})`)})}renderImage(){this.toggleVisibility(this.getSrc),(0,s.m)(this.getSrc,this.altText).then(t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))})}shouldRender(t){const e=this.getAttribute(t);return this.getSrc===e}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),e!==o&&this.shouldRender(t)&&this.renderImage()}}const h=(0,a.Zz)((0,r.RF)({mappings:{fill:{},height:{selector:()=>":host"},width:{selector:()=>":host"}}}),r.VO,r.tQ)(c)},18782(t,e,o){o.d(e,{m:()=>a});var r=o(25414);const i=t=>{const e=r.A.sanitize(t,{USE_PROFILES:{svg:!0,svgFilters:!0},ADD_TAGS:["image"],FORBID_TAGS:["defs"]});return(new DOMParser).parseFromString(e,"image/svg+xml").querySelector("svg")},a=async(t,e)=>{try{let o;if((t=>t.startsWith("data:image/svg+xml;base64,"))(t)){const e=atob(t.slice(26));o=i(e)}else if("svg"===(t=>{const e=t.match(/\.([0-9a-z]+)(?:[\\?#]|$)/i);return e?e[1]:null})(t)){const e=await fetch(t),r=await e.text();o=i(r)}else o=((t,e)=>{const o=document.createElement("img");return o.setAttribute("src",t),o.setAttribute("alt",e),o})(t,e);return o.style.setProperty("max-width","100%"),o.style.setProperty("max-height","100%"),o}catch{return null}}},89389(t,e,o){o.d(e,{$:()=>m});var r=o(13256),i=o(55774),a=o(82901),n=o(72562),s=o(81488),l=o(87550);const d=o(51450).AH`
   :host {
     display: inline-block;
     position: relative;
@@ -59,7 +59,7 @@
       outline-color: GrayText;
     }
   }
-`;var c=e(84467),u=e(53149),m=e(36176);const h=t=>class extends((0,c.e)((0,m.l)((0,u.y)(t)))){static get properties(){return{tabindex:{type:Number,value:0,reflectToAttribute:!0}}}get _activeKeys(){return["Enter"," "]}ready(){super.ready(),this.hasAttribute("role")||this.setAttribute("role","button")}_onKeyDown(t){super._onKeyDown(t),t.altKey||t.shiftKey||t.ctrlKey||t.metaKey||this._activeKeys.includes(t.key)&&(t.preventDefault(),this.click())}};(0,l.SF)("vaadin-button",d,{moduleId:"vaadin-button-styles"});class p extends(h((0,n.q)((0,l.cp)((0,a.w)(r.Pu))))){static get is(){return"vaadin-button"}static get template(){return r.qy`
+`;var c=o(84467),h=o(53149),u=o(36176);const p=t=>class extends((0,c.e)((0,u.l)((0,h.y)(t)))){static get properties(){return{tabindex:{type:Number,value:0,reflectToAttribute:!0}}}get _activeKeys(){return["Enter"," "]}ready(){super.ready(),this.hasAttribute("role")||this.setAttribute("role","button")}_onKeyDown(t){super._onKeyDown(t),t.altKey||t.shiftKey||t.ctrlKey||t.metaKey||this._activeKeys.includes(t.key)&&(t.preventDefault(),this.click())}};(0,l.SF)("vaadin-button",d,{moduleId:"vaadin-button-styles"});class m extends(p((0,n.q)((0,l.cp)((0,i.w)(r.Pu))))){static get is(){return"vaadin-button"}static get template(){return r.qy`
   <div class="vaadin-button-container">
     <span part="prefix" aria-hidden="true">
       <slot name="prefix"></slot>
@@ -72,7 +72,7 @@
     </span>
   </div>
   <slot name="tooltip"></slot>
-`}ready(){super.ready(),this._tooltipController=new s.I(this),this.addController(this._tooltipController)}}(0,i.X)(p)},93555(t,o,e){e.d(o,{x:()=>a}),e(64511),e(42068),e(9433),e(3241),e(83315);var r=e(87550);const a=r.AH`
+`}ready(){super.ready(),this._tooltipController=new s.I(this),this.addController(this._tooltipController)}}(0,a.X)(m)},93555(t,e,o){o.d(e,{x:()=>i}),o(64511),o(42068),o(9433),o(3241),o(83315);var r=o(87550);const i=r.AH`
   :host {
     /* Sizing */
     --lumo-button-size: var(--lumo-size-m);
@@ -335,7 +335,7 @@
     margin-left: 0;
     margin-right: 0;
   }
-`;(0,r.SF)("vaadin-button",a,{moduleId:"lumo-button"})},83799(t,o,e){e(93555),e(89389)},1632(t,o,e){e(52915),e(54886),e(27397),e(25244);var r=e(47642),a=e(87550);const i=a.AH`
+`;(0,r.SF)("vaadin-button",i,{moduleId:"lumo-button"})},83799(t,e,o){o(93555),o(89389)},1632(t,e,o){o(52915),o(54886),o(27397),o(25244);var r=o(47642),i=o(87550);const a=i.AH`
   :host {
     outline: none;
   }
@@ -343,7 +343,7 @@
   [part='toggle-button']::before {
     content: var(--lumo-icons-dropdown);
   }
-`;(0,a.SF)("vaadin-combo-box",[r.k,i],{moduleId:"lumo-combo-box"}),e(86689);var n=e(13256),s=e(82901),l=e(23927),d=e(79769);class c extends((0,d.y)((0,a.cp)((0,l.v)(n.Pu)))){static get template(){return n.qy`
+`;(0,i.SF)("vaadin-combo-box",[r.k,a],{moduleId:"lumo-combo-box"}),o(86689);var n=o(13256),s=o(82901),l=o(23927),d=o(79769);class c extends((0,d.y)((0,i.cp)((0,l.v)(n.Pu)))){static get template(){return n.qy`
       <style>
         :host {
           display: block;
@@ -357,7 +357,7 @@
       <div part="content">
         <slot></slot>
       </div>
-    `}static get is(){return"vaadin-combo-box-item"}}(0,s.X)(c);var u=e(58069),m=e(5072),h=e(32888);const p=a.AH`
+    `}static get is(){return"vaadin-combo-box-item"}}(0,s.X)(c);var h=o(58069),u=o(5072),p=o(32888);const m=i.AH`
   #overlay {
     width: var(--vaadin-combo-box-overlay-width, var(--_vaadin-combo-box-overlay-default-width, auto));
   }
@@ -367,13 +367,13 @@
     flex-direction: column;
     height: 100%;
   }
-`;(0,a.SF)("vaadin-combo-box-overlay",[m.B,p],{moduleId:"vaadin-combo-box-overlay-styles"});class v extends((0,h.p)((0,u.c)((0,l.v)((0,a.cp)(n.Pu))))){static get is(){return"vaadin-combo-box-overlay"}static get template(){return n.qy`
+`;(0,i.SF)("vaadin-combo-box-overlay",[u.B,m],{moduleId:"vaadin-combo-box-overlay-styles"});class b extends((0,p.p)((0,h.c)((0,l.v)((0,i.cp)(n.Pu))))){static get is(){return"vaadin-combo-box-overlay"}static get template(){return n.qy`
       <div id="backdrop" part="backdrop" hidden></div>
       <div part="overlay" id="overlay">
         <div part="loader"></div>
         <div part="content" id="content"><slot></slot></div>
       </div>
-    `}}(0,s.X)(v);var b=e(70616);class g extends((0,b.N)(n.Pu)){static get is(){return"vaadin-combo-box-scroller"}static get template(){return n.qy`
+    `}}(0,s.X)(b);var v=o(70616);class g extends((0,v.N)(n.Pu)){static get is(){return"vaadin-combo-box-scroller"}static get template(){return n.qy`
       <style>
         :host {
           display: block;
@@ -400,7 +400,7 @@
       <div id="selector">
         <slot></slot>
       </div>
-    `}}(0,s.X)(g);var y=e(72562),f=e(81488),x=e(44218),w=e(18330),_=e(37720),k=e(83304);const z=t=>class extends((0,k.U)(t)){static get properties(){return{pattern:{type:String}}}static get delegateAttrs(){return[...super.delegateAttrs,"pattern"]}static get constraints(){return[...super.constraints,"pattern"]}};var C=e(86314),S=e(11402),A=e(65909);(0,a.SF)("vaadin-combo-box",C.k,{moduleId:"vaadin-combo-box-styles"});class K extends((0,S.K)((0,A.x)(z((0,x.R)((0,a.cp)((0,y.q)(n.Pu))))))){static get is(){return"vaadin-combo-box"}static get template(){return n.qy`
+    `}}(0,s.X)(g);var f=o(72562),y=o(81488),x=o(44218),w=o(18330),k=o(37720),_=o(83304);const z=t=>class extends((0,_.U)(t)){static get properties(){return{pattern:{type:String}}}static get delegateAttrs(){return[...super.delegateAttrs,"pattern"]}static get constraints(){return[...super.constraints,"pattern"]}};var S=o(86314),C=o(11402),A=o(65909);(0,i.SF)("vaadin-combo-box",S.k,{moduleId:"vaadin-combo-box-styles"});class T extends((0,C.K)((0,A.x)(z((0,x.R)((0,i.cp)((0,f.q)(n.Pu))))))){static get is(){return"vaadin-combo-box"}static get template(){return n.qy`
       <style>
         :host([opened]) {
           pointer-events: auto;
@@ -446,5 +446,5 @@
       ></vaadin-combo-box-overlay>
 
       <slot name="tooltip"></slot>
-    `}static get properties(){return{_positionTarget:{type:Object}}}get clearElement(){return this.$.clearButton}ready(){super.ready(),this.addController(new w.f(this,t=>{this._setInputElement(t),this._setFocusElement(t),this.stateTarget=t,this.ariaTarget=t})),this.addController(new _.q(this.inputElement,this._labelController)),this._tooltipController=new f.I(this),this.addController(this._tooltipController),this._tooltipController.setPosition("top"),this._tooltipController.setAriaTarget(this.inputElement),this._tooltipController.setShouldShow(t=>!t.opened),this._positionTarget=this.shadowRoot.querySelector('[part="input-field"]'),this._toggleElement=this.$.toggleButton}_onClearButtonClick(t){t.stopPropagation(),super._onClearButtonClick(t)}_onHostClick(t){const o=t.composedPath();(o.includes(this._labelNode)||o.includes(this._positionTarget))&&super._onHostClick(t)}}(0,s.X)(K)}}]);
+    `}static get properties(){return{_positionTarget:{type:Object}}}get clearElement(){return this.$.clearButton}ready(){super.ready(),this.addController(new w.f(this,t=>{this._setInputElement(t),this._setFocusElement(t),this.stateTarget=t,this.ariaTarget=t})),this.addController(new k.q(this.inputElement,this._labelController)),this._tooltipController=new y.I(this),this.addController(this._tooltipController),this._tooltipController.setPosition("top"),this._tooltipController.setAriaTarget(this.inputElement),this._tooltipController.setShouldShow(t=>!t.opened),this._positionTarget=this.shadowRoot.querySelector('[part="input-field"]'),this._toggleElement=this.$.toggleButton}_onClearButtonClick(t){t.stopPropagation(),super._onClearButtonClick(t)}_onHostClick(t){const e=t.composedPath();(e.includes(this._labelNode)||e.includes(this._positionTarget))&&super._onHostClick(t)}}(0,s.X)(T)}}]);
 //# sourceMappingURL=descope-date-field-descope-calendar-index-js.js.map

package/dist/umd/descope-date-field-descope-calendar-index-js.js.map

@@ -1 +1 @@
-{"version":3,"file":"descope-date-field-descope-calendar-index-js.js","mappings":"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","sources":["webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button-base.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button-mixin.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/theme/lumo/vaadin-button-styles.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/combo-box/theme/lumo/vaadin-combo-box-styles.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/combo-box/src/vaadin-combo-box-item.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/combo-box/src/vaadin-combo-box-overlay.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/combo-box/src/vaadin-combo-box-scroller.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/field-base/src/pattern-mixin.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/combo-box/src/vaadin-combo-box.js"],"sourcesContent":["/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { css } from 'lit';\n\nexport const buttonStyles = css`\n  :host {\n    display: inline-block;\n    position: relative;\n    outline: none;\n    white-space: nowrap;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    user-select: none;\n  }\n\n  :host([hidden]) {\n    display: none !important;\n  }\n\n  /* Aligns the button with form fields when placed on the same line.\n  Note, to make it work, the form fields should have the same \"::before\" pseudo-element. */\n  .vaadin-button-container::before {\n    content: '\\\\2003';\n    display: inline-block;\n    width: 0;\n    max-height: 100%;\n  }\n\n  .vaadin-button-container {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n    width: 100%;\n    height: 100%;\n    min-height: inherit;\n    text-shadow: inherit;\n  }\n\n  [part='prefix'],\n  [part='suffix'] {\n    flex: none;\n  }\n\n  [part='label'] {\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  @media (forced-colors: active) {\n    :host {\n      outline: 1px solid;\n      outline-offset: -1px;\n    }\n\n    :host([focused]) {\n      outline-width: 2px;\n    }\n\n    :host([disabled]) {\n      outline-color: GrayText;\n    }\n  }\n`;\n\nexport const buttonTemplate = (html) => html`\n  <div class=\"vaadin-button-container\">\n    <span part=\"prefix\" aria-hidden=\"true\">\n      <slot name=\"prefix\"></slot>\n    </span>\n    <span part=\"label\">\n      <slot></slot>\n    </span>\n    <span part=\"suffix\" aria-hidden=\"true\">\n      <slot name=\"suffix\"></slot>\n    </span>\n  </div>\n  <slot name=\"tooltip\"></slot>\n`;\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { ActiveMixin } from '@vaadin/a11y-base/src/active-mixin.js';\nimport { FocusMixin } from '@vaadin/a11y-base/src/focus-mixin.js';\nimport { TabindexMixin } from '@vaadin/a11y-base/src/tabindex-mixin.js';\n\n/**\n * A mixin providing common button functionality.\n *\n * @polymerMixin\n * @mixes ActiveMixin\n * @mixes FocusMixin\n * @mixes TabindexMixin\n */\nexport const ButtonMixin = (superClass) =>\n  class ButtonMixinClass extends ActiveMixin(TabindexMixin(FocusMixin(superClass))) {\n    static get properties() {\n      return {\n        /**\n         * Indicates whether the element can be focused and where it participates in sequential keyboard navigation.\n         *\n         * @override\n         * @protected\n         */\n        tabindex: {\n          type: Number,\n          value: 0,\n          reflectToAttribute: true,\n        },\n      };\n    }\n\n    /**\n     * By default, `Space` is the only possible activation key for a focusable HTML element.\n     * Nonetheless, the button is an exception as it can be also activated by pressing `Enter`.\n     * See the \"Keyboard Support\" section in https://www.w3.org/TR/wai-aria-practices/examples/button/button.html.\n     *\n     * @protected\n     * @override\n     */\n    get _activeKeys() {\n      return ['Enter', ' '];\n    }\n\n    /** @protected */\n    ready() {\n      super.ready();\n\n      // By default, if the user hasn't provided a custom role,\n      // the role attribute is set to \"button\".\n      if (!this.hasAttribute('role')) {\n        this.setAttribute('role', 'button');\n      }\n    }\n\n    /**\n     * Since the button component is designed on the base of the `[role=button]` attribute,\n     * and doesn't have a native <button> inside, in order to be fully accessible from the keyboard,\n     * it should manually fire the `click` event once an activation key is pressed,\n     * as it follows from the WAI-ARIA specifications:\n     * https://www.w3.org/TR/wai-aria-practices-1.1/#button\n     *\n     * According to the UI Events specifications,\n     * the `click` event should be fired exactly on `keydown`:\n     * https://www.w3.org/TR/uievents/#event-type-keydown\n     *\n     * @param {KeyboardEvent} event\n     * @protected\n     * @override\n     */\n    _onKeyDown(event) {\n      super._onKeyDown(event);\n\n      if (event.altKey || event.shiftKey || event.ctrlKey || event.metaKey) {\n        return;\n      }\n\n      if (this._activeKeys.includes(event.key)) {\n        event.preventDefault();\n\n        // `DisabledMixin` overrides the standard `click()` method\n        // so that it doesn't fire the `click` event when the element is disabled.\n        this.click();\n      }\n    }\n  };\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { ControllerMixin } from '@vaadin/component-base/src/controller-mixin.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';\nimport { TooltipController } from '@vaadin/component-base/src/tooltip-controller.js';\nimport { registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { buttonStyles, buttonTemplate } from './vaadin-button-base.js';\nimport { ButtonMixin } from './vaadin-button-mixin.js';\n\nregisterStyles('vaadin-button', buttonStyles, { moduleId: 'vaadin-button-styles' });\n\n/**\n * `<vaadin-button>` is an accessible and customizable button that allows users to perform actions.\n *\n * ```html\n * <vaadin-button>Press me</vaadin-button>\n * ```\n *\n * ### Styling\n *\n * The following shadow DOM parts are available for styling:\n *\n * Part name | Description\n * ----------|-------------\n * `label`   | The label (text) inside the button.\n * `prefix`  | A slot for content before the label (e.g. an icon).\n * `suffix`  | A slot for content after the label (e.g. an icon).\n *\n * The following attributes are available for styling:\n *\n * Attribute    | Description\n * -------------|-------------\n * `active`     | Set when the button is pressed down, either with mouse, touch or the keyboard.\n * `disabled`   | Set when the button is disabled.\n * `focus-ring` | Set when the button is focused using the keyboard.\n * `focused`    | Set when the button is focused.\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ButtonMixin\n * @mixes ControllerMixin\n * @mixes ElementMixin\n * @mixes ThemableMixin\n */\nclass Button extends ButtonMixin(ElementMixin(ThemableMixin(ControllerMixin(PolymerElement)))) {\n  static get is() {\n    return 'vaadin-button';\n  }\n\n  static get template() {\n    return buttonTemplate(html);\n  }\n\n  /** @protected */\n  ready() {\n    super.ready();\n\n    this._tooltipController = new TooltipController(this);\n    this.addController(this._tooltipController);\n  }\n}\n\ndefineCustomElement(Button);\n\nexport { Button };\n","import '@vaadin/vaadin-lumo-styles/color.js';\nimport '@vaadin/vaadin-lumo-styles/sizing.js';\nimport '@vaadin/vaadin-lumo-styles/spacing.js';\nimport '@vaadin/vaadin-lumo-styles/style.js';\nimport '@vaadin/vaadin-lumo-styles/typography.js';\nimport { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\n\nconst button = css`\n  :host {\n    /* Sizing */\n    --lumo-button-size: var(--lumo-size-m);\n    min-width: var(--vaadin-button-min-width, calc(var(--_button-size) * 2));\n    height: var(--_button-size);\n    padding: var(--vaadin-button-padding, 0 calc(var(--_button-size) / 3 + var(--lumo-border-radius-m) / 2));\n    margin: var(--vaadin-button-margin, var(--lumo-space-xs) 0);\n    box-sizing: border-box;\n    /* Style */\n    font-family: var(--lumo-font-family);\n    font-size: var(--vaadin-button-font-size, var(--lumo-font-size-m));\n    font-weight: var(--vaadin-button-font-weight, 500);\n    color: var(--_lumo-button-text-color);\n    background: var(--_lumo-button-background);\n    border: var(--vaadin-button-border, none);\n    border-radius: var(--vaadin-button-border-radius, var(--lumo-border-radius-m));\n    cursor: var(--lumo-clickable-cursor);\n    -webkit-tap-highlight-color: transparent;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n    flex-shrink: 0;\n    --_button-size: var(--vaadin-button-height, var(--lumo-button-size));\n    --_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-primary-color-50pct));\n    --_focus-ring-width: var(--vaadin-focus-ring-width, 2px);\n    /* Used by notification */\n    --_lumo-button-background: var(--vaadin-button-background, var(--lumo-contrast-5pct));\n    --_lumo-button-text-color: var(--vaadin-button-text-color, var(--lumo-primary-text-color));\n    --_lumo-button-primary-background: var(--vaadin-button-primary-background, var(--lumo-primary-color));\n    --_lumo-button-primary-text-color: var(--vaadin-button-primary-text-color, var(--lumo-primary-contrast-color));\n  }\n\n  /* Set only for the internal parts so we don't affect the host vertical alignment */\n  [part='label'],\n  [part='prefix'],\n  [part='suffix'] {\n    line-height: var(--lumo-line-height-xs);\n  }\n\n  [part='label'] {\n    padding: calc(var(--lumo-button-size) / 6) 0;\n  }\n\n  :host([theme~='small']) {\n    font-size: var(--lumo-font-size-s);\n    --lumo-button-size: var(--lumo-size-s);\n  }\n\n  :host([theme~='large']) {\n    font-size: var(--lumo-font-size-l);\n    --lumo-button-size: var(--lumo-size-l);\n  }\n\n  /* For interaction states */\n  :host::before,\n  :host::after {\n    content: '';\n    /* We rely on the host always being relative */\n    position: absolute;\n    z-index: 1;\n    inset: 0;\n    background-color: currentColor;\n    border-radius: inherit;\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  /* Hover */\n\n  @media (any-hover: hover) {\n    :host(:hover)::before {\n      opacity: 0.02;\n    }\n  }\n\n  /* Active */\n\n  :host::after {\n    transition: opacity 1.4s, transform 0.1s;\n    filter: blur(8px);\n  }\n\n  :host([active])::before {\n    opacity: 0.05;\n    transition-duration: 0s;\n  }\n\n  :host([active])::after {\n    opacity: 0.1;\n    transition-duration: 0s, 0s;\n    transform: scale(0);\n  }\n\n  /* Keyboard focus */\n\n  :host([focus-ring]) {\n    box-shadow: 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);\n  }\n\n  :host([theme~='primary'][focus-ring]) {\n    box-shadow: 0 0 0 1px var(--lumo-base-color), 0 0 0 3px var(--lumo-primary-color-50pct);\n  }\n\n  /* Types (primary, tertiary, tertiary-inline */\n\n  :host([theme~='tertiary']),\n  :host([theme~='tertiary-inline']) {\n    --_background: transparent !important;\n    background: var(--vaadin-button-tertiary-background, var(--_background));\n    min-width: 0;\n  }\n\n  :host([theme~='tertiary']) {\n    border: var(--vaadin-button-tertiary-border, none);\n    color: var(--vaadin-button-tertiary-text-color, var(--lumo-primary-text-color));\n    font-weight: var(--vaadin-button-tertiary-font-weight, 500);\n    padding: var(--vaadin-button-tertiary-padding, 0 calc(var(--_button-size) / 6));\n  }\n\n  :host([theme~='tertiary-inline'])::before {\n    display: none;\n  }\n\n  :host([theme~='tertiary-inline']) {\n    margin: 0;\n    height: auto;\n    padding: 0;\n    line-height: inherit;\n    font-size: inherit;\n  }\n\n  :host([theme~='tertiary-inline']) [part='label'] {\n    padding: 0;\n    overflow: visible;\n    line-height: inherit;\n  }\n\n  :host([theme~='primary']) {\n    background: var(--_lumo-button-primary-background);\n    border: var(--vaadin-button-primary-border, none);\n    color: var(--_lumo-button-primary-text-color);\n    font-weight: var(--vaadin-button-primary-font-weight, 600);\n    min-width: calc(var(--lumo-button-size) * 2.5);\n  }\n\n  :host([theme~='primary'])::before {\n    background-color: black;\n  }\n\n  @media (any-hover: hover) {\n    :host([theme~='primary']:hover)::before {\n      opacity: 0.05;\n    }\n  }\n\n  :host([theme~='primary'][active])::before {\n    opacity: 0.1;\n  }\n\n  :host([theme~='primary'][active])::after {\n    opacity: 0.2;\n  }\n\n  /* Colors (success, error, contrast) */\n\n  :host([theme~='success']) {\n    color: var(--lumo-success-text-color);\n  }\n\n  :host([theme~='success'][theme~='primary']) {\n    background-color: var(--lumo-success-color);\n    color: var(--lumo-success-contrast-color);\n  }\n\n  :host([theme~='error']) {\n    color: var(--lumo-error-text-color);\n  }\n\n  :host([theme~='error'][theme~='primary']) {\n    background-color: var(--lumo-error-color);\n    color: var(--lumo-error-contrast-color);\n  }\n\n  :host([theme~='contrast']) {\n    color: var(--lumo-contrast);\n  }\n\n  :host([theme~='contrast'][theme~='primary']) {\n    background-color: var(--lumo-contrast);\n    color: var(--lumo-base-color);\n  }\n\n  /* Disabled state. Keep selectors after other color variants. */\n\n  :host([disabled]) {\n    pointer-events: none;\n    color: var(--lumo-disabled-text-color);\n  }\n\n  :host([theme~='primary'][disabled]) {\n    background-color: var(--lumo-contrast-30pct);\n    color: var(--lumo-base-color);\n  }\n\n  :host([theme~='primary'][disabled]) [part] {\n    opacity: 0.7;\n  }\n\n  /* Icons */\n\n  [part] ::slotted(vaadin-icon) {\n    display: inline-block;\n    width: var(--lumo-icon-size-m);\n    height: var(--lumo-icon-size-m);\n  }\n\n  /* Vaadin icons are based on a 16x16 grid (unlike Lumo and Material icons with 24x24), so they look too big by default */\n  [part] ::slotted(vaadin-icon[icon^='vaadin:']) {\n    padding: 0.25em;\n    box-sizing: border-box !important;\n  }\n\n  [part='prefix'] {\n    margin-left: -0.25em;\n    margin-right: 0.25em;\n  }\n\n  [part='suffix'] {\n    margin-left: 0.25em;\n    margin-right: -0.25em;\n  }\n\n  /* Icon-only */\n\n  :host([theme~='icon']:not([theme~='tertiary-inline'])) {\n    min-width: var(--lumo-button-size);\n    padding-left: calc(var(--lumo-button-size) / 4);\n    padding-right: calc(var(--lumo-button-size) / 4);\n  }\n\n  :host([theme~='icon']) [part='prefix'],\n  :host([theme~='icon']) [part='suffix'] {\n    margin-left: 0;\n    margin-right: 0;\n  }\n\n  /* RTL specific styles */\n\n  :host([dir='rtl']) [part='prefix'] {\n    margin-left: 0.25em;\n    margin-right: -0.25em;\n  }\n\n  :host([dir='rtl']) [part='suffix'] {\n    margin-left: -0.25em;\n    margin-right: 0.25em;\n  }\n\n  :host([dir='rtl'][theme~='icon']) [part='prefix'],\n  :host([dir='rtl'][theme~='icon']) [part='suffix'] {\n    margin-left: 0;\n    margin-right: 0;\n  }\n`;\n\nregisterStyles('vaadin-button', button, { moduleId: 'lumo-button' });\n\nexport { button };\n","import '@vaadin/input-container/theme/lumo/vaadin-input-container-styles.js';\nimport '@vaadin/vaadin-lumo-styles/font-icons.js';\nimport { inputFieldShared } from '@vaadin/vaadin-lumo-styles/mixins/input-field-shared.js';\nimport { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\n\nconst comboBox = css`\n  :host {\n    outline: none;\n  }\n\n  [part='toggle-button']::before {\n    content: var(--lumo-icons-dropdown);\n  }\n`;\n\nregisterStyles('vaadin-combo-box', [inputFieldShared, comboBox], { moduleId: 'lumo-combo-box' });\n","/**\n * @license\n * Copyright (c) 2015 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { DirMixin } from '@vaadin/component-base/src/dir-mixin.js';\nimport { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { ComboBoxItemMixin } from './vaadin-combo-box-item-mixin.js';\n\n/**\n * An item element used by the `<vaadin-combo-box>` dropdown.\n *\n * ### Styling\n *\n * The following shadow DOM parts are available for styling:\n *\n * Part name   | Description\n * ------------|--------------\n * `checkmark` | The graphical checkmark shown for a selected item\n * `content`   | The element that wraps the item content\n *\n * The following state attributes are exposed for styling:\n *\n * Attribute    | Description\n * -------------|-------------\n * `selected`   | Set when the item is selected\n * `focused`    | Set when the item is focused\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @customElement\n * @mixes ComboBoxItemMixin\n * @mixes ThemableMixin\n * @mixes DirMixin\n * @private\n */\nexport class ComboBoxItem extends ComboBoxItemMixin(ThemableMixin(DirMixin(PolymerElement))) {\n  static get template() {\n    return html`\n      <style>\n        :host {\n          display: block;\n        }\n\n        :host([hidden]) {\n          display: none;\n        }\n      </style>\n      <span part=\"checkmark\" aria-hidden=\"true\"></span>\n      <div part=\"content\">\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  static get is() {\n    return 'vaadin-combo-box-item';\n  }\n}\n\ndefineCustomElement(ComboBoxItem);\n","/**\n * @license\n * Copyright (c) 2015 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { DirMixin } from '@vaadin/component-base/src/dir-mixin.js';\nimport { OverlayMixin } from '@vaadin/overlay/src/vaadin-overlay-mixin.js';\nimport { overlayStyles } from '@vaadin/overlay/src/vaadin-overlay-styles.js';\nimport { css, registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { ComboBoxOverlayMixin } from './vaadin-combo-box-overlay-mixin.js';\n\nconst comboBoxOverlayStyles = css`\n  #overlay {\n    width: var(--vaadin-combo-box-overlay-width, var(--_vaadin-combo-box-overlay-default-width, auto));\n  }\n\n  [part='content'] {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n  }\n`;\n\nregisterStyles('vaadin-combo-box-overlay', [overlayStyles, comboBoxOverlayStyles], {\n  moduleId: 'vaadin-combo-box-overlay-styles',\n});\n\n/**\n * An element used internally by `<vaadin-combo-box>`. Not intended to be used separately.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ComboBoxOverlayMixin\n * @mixes DirMixin\n * @mixes OverlayMixin\n * @mixes ThemableMixin\n * @private\n */\nexport class ComboBoxOverlay extends ComboBoxOverlayMixin(OverlayMixin(DirMixin(ThemableMixin(PolymerElement)))) {\n  static get is() {\n    return 'vaadin-combo-box-overlay';\n  }\n\n  static get template() {\n    return html`\n      <div id=\"backdrop\" part=\"backdrop\" hidden></div>\n      <div part=\"overlay\" id=\"overlay\">\n        <div part=\"loader\"></div>\n        <div part=\"content\" id=\"content\"><slot></slot></div>\n      </div>\n    `;\n  }\n}\n\ndefineCustomElement(ComboBoxOverlay);\n","/**\n * @license\n * Copyright (c) 2015 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { ComboBoxScrollerMixin } from './vaadin-combo-box-scroller-mixin.js';\n\n/**\n * An element used internally by `<vaadin-combo-box>`. Not intended to be used separately.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ComboBoxScrollerMixin\n * @private\n */\nexport class ComboBoxScroller extends ComboBoxScrollerMixin(PolymerElement) {\n  static get is() {\n    return 'vaadin-combo-box-scroller';\n  }\n\n  static get template() {\n    return html`\n      <style>\n        :host {\n          display: block;\n          min-height: 1px;\n          overflow: auto;\n\n          /* Fixes item background from getting on top of scrollbars on Safari */\n          transform: translate3d(0, 0, 0);\n\n          /* Enable momentum scrolling on iOS */\n          -webkit-overflow-scrolling: touch;\n\n          /* Fixes scrollbar disappearing when 'Show scroll bars: Always' enabled in Safari */\n          box-shadow: 0 0 0 white;\n        }\n\n        #selector {\n          border-width: var(--_vaadin-combo-box-items-container-border-width);\n          border-style: var(--_vaadin-combo-box-items-container-border-style);\n          border-color: var(--_vaadin-combo-box-items-container-border-color, transparent);\n          position: relative;\n        }\n      </style>\n      <div id=\"selector\">\n        <slot></slot>\n      </div>\n    `;\n  }\n}\n\ndefineCustomElement(ComboBoxScroller);\n","/**\n * @license\n * Copyright (c) 2021 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { InputConstraintsMixin } from './input-constraints-mixin.js';\n\n/**\n * A mixin to provide `pattern` property.\n *\n * @polymerMixin\n * @mixes InputConstraintsMixin\n */\nexport const PatternMixin = (superclass) =>\n  class PatternMixinClass extends InputConstraintsMixin(superclass) {\n    static get properties() {\n      return {\n        /**\n         * A regular expression that the value is checked against.\n         * The pattern must match the entire value, not just some subset.\n         */\n        pattern: {\n          type: String,\n        },\n      };\n    }\n\n    static get delegateAttrs() {\n      return [...super.delegateAttrs, 'pattern'];\n    }\n\n    static get constraints() {\n      return [...super.constraints, 'pattern'];\n    }\n  };\n","/**\n * @license\n * Copyright (c) 2015 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport '@vaadin/input-container/src/vaadin-input-container.js';\nimport './vaadin-combo-box-item.js';\nimport './vaadin-combo-box-overlay.js';\nimport './vaadin-combo-box-scroller.js';\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';\nimport { TooltipController } from '@vaadin/component-base/src/tooltip-controller.js';\nimport { InputControlMixin } from '@vaadin/field-base/src/input-control-mixin.js';\nimport { InputController } from '@vaadin/field-base/src/input-controller.js';\nimport { LabelledInputController } from '@vaadin/field-base/src/labelled-input-controller.js';\nimport { PatternMixin } from '@vaadin/field-base/src/pattern-mixin.js';\nimport { inputFieldShared } from '@vaadin/field-base/src/styles/input-field-shared-styles.js';\nimport { registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { ComboBoxDataProviderMixin } from './vaadin-combo-box-data-provider-mixin.js';\nimport { ComboBoxMixin } from './vaadin-combo-box-mixin.js';\n\nregisterStyles('vaadin-combo-box', inputFieldShared, { moduleId: 'vaadin-combo-box-styles' });\n\n/**\n * `<vaadin-combo-box>` is a web component for choosing a value from a filterable list of options\n * presented in a dropdown overlay. The options can be provided as a list of strings or objects\n * by setting [`items`](#/elements/vaadin-combo-box#property-items) property on the element.\n *\n * ```html\n * <vaadin-combo-box id=\"combo-box\"></vaadin-combo-box>\n * ```\n *\n * ```js\n * document.querySelector('#combo-box').items = ['apple', 'orange', 'banana'];\n * ```\n *\n * When the selected `value` is changed, a `value-changed` event is triggered.\n *\n * ### Item rendering\n *\n * To customize the content of the `<vaadin-combo-box-item>` elements placed in the dropdown, use\n * [`renderer`](#/elements/vaadin-combo-box#property-renderer) property which accepts a function.\n * The renderer function is called with `root`, `comboBox`, and `model` as arguments.\n *\n * Generate DOM content by using `model` object properties if needed, and append it to the `root`\n * element. The `comboBox` reference is provided to access the combo-box element state. Do not\n * set combo-box properties in a `renderer` function.\n *\n * ```js\n * const comboBox = document.querySelector('#combo-box');\n * comboBox.items = [{'label': 'Hydrogen', 'value': 'H'}];\n * comboBox.renderer = (root, comboBox, model) => {\n *   const item = model.item;\n *   root.innerHTML = `${model.index}: ${item.label} <b>${item.value}</b>`;\n * };\n * ```\n *\n * Renderer is called on the opening of the combo-box and each time the related model is updated.\n * Before creating new content, it is recommended to check if there is already an existing DOM\n * element in `root` from a previous renderer call for reusing it. Even though combo-box uses\n * infinite scrolling, reducing DOM operations might improve performance.\n *\n * The following properties are available in the `model` argument:\n *\n * Property   | Type             | Description\n * -----------|------------------|-------------\n * `index`    | Number           | Index of the item in the `items` array\n * `item`     | String or Object | The item reference\n * `selected` | Boolean          | True when item is selected\n * `focused`  | Boolean          | True when item is focused\n *\n * ### Lazy Loading with Function Data Provider\n *\n * In addition to assigning an array to the items property, you can alternatively use the\n * [`dataProvider`](#/elements/vaadin-combo-box#property-dataProvider) function property.\n * The `<vaadin-combo-box>` calls this function lazily, only when it needs more data\n * to be displayed.\n *\n * __Note that when using function data providers, the total number of items\n * needs to be set manually. The total number of items can be returned\n * in the second argument of the data provider callback:__\n *\n * ```js\n * comboBox.dataProvider = async (params, callback) => {\n *   const API = 'https://demo.vaadin.com/demo-data/1.0/filtered-countries';\n *   const { filter, page, pageSize } = params;\n *   const index = page * pageSize;\n *\n *   const res = await fetch(`${API}?index=${index}&count=${pageSize}&filter=${filter}`);\n *   if (res.ok) {\n *     const { result, size } = await res.json();\n *     callback(result, size);\n *   }\n * };\n * ```\n *\n * ### Styling\n *\n * The following custom properties are available for styling:\n *\n * Custom property                         | Description                | Default\n * ----------------------------------------|----------------------------|---------\n * `--vaadin-field-default-width`          | Default width of the field | `12em`\n * `--vaadin-combo-box-overlay-width`      | Width of the overlay       | `auto`\n * `--vaadin-combo-box-overlay-max-height` | Max height of the overlay  | `65vh`\n *\n * `<vaadin-combo-box>` provides the same set of shadow DOM parts and state attributes as `<vaadin-text-field>`.\n * See [`<vaadin-text-field>`](#/elements/vaadin-text-field) for the styling documentation.\n *\n * In addition to `<vaadin-text-field>` parts, the following parts are available for theming:\n *\n * Part name       | Description\n * ----------------|----------------\n * `toggle-button` | The toggle button\n *\n * In addition to `<vaadin-text-field>` state attributes, the following state attributes are available for theming:\n *\n * Attribute | Description | Part name\n * ----------|-------------|------------\n * `opened`  | Set when the combo box dropdown is open | :host\n * `loading` | Set when new items are expected | :host\n *\n * If you want to replace the default `<input>` and its container with a custom implementation to get full control\n * over the input field, consider using the [`<vaadin-combo-box-light>`](#/elements/vaadin-combo-box-light) element.\n *\n * ### Internal components\n *\n * In addition to `<vaadin-combo-box>` itself, the following internal\n * components are themable:\n *\n * - `<vaadin-combo-box-overlay>` - has the same API as [`<vaadin-overlay>`](#/elements/vaadin-overlay).\n * - `<vaadin-combo-box-item>` - has the same API as [`<vaadin-item>`](#/elements/vaadin-item).\n * - [`<vaadin-input-container>`](#/elements/vaadin-input-container) - an internal element wrapping the input.\n *\n * Note: the `theme` attribute value set on `<vaadin-combo-box>` is\n * propagated to the internal components listed above.\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @fires {Event} change - Fired when the user commits a value change.\n * @fires {CustomEvent} custom-value-set - Fired when the user sets a custom value.\n * @fires {CustomEvent} filter-changed - Fired when the `filter` property changes.\n * @fires {CustomEvent} invalid-changed - Fired when the `invalid` property changes.\n * @fires {CustomEvent} opened-changed - Fired when the `opened` property changes.\n * @fires {CustomEvent} selected-item-changed - Fired when the `selectedItem` property changes.\n * @fires {CustomEvent} value-changed - Fired when the `value` property changes.\n * @fires {CustomEvent} validated - Fired whenever the field is validated.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ElementMixin\n * @mixes ThemableMixin\n * @mixes InputControlMixin\n * @mixes PatternMixin\n * @mixes ComboBoxDataProviderMixin\n * @mixes ComboBoxMixin\n */\nclass ComboBox extends ComboBoxDataProviderMixin(\n  ComboBoxMixin(PatternMixin(InputControlMixin(ThemableMixin(ElementMixin(PolymerElement))))),\n) {\n  static get is() {\n    return 'vaadin-combo-box';\n  }\n\n  static get template() {\n    return html`\n      <style>\n        :host([opened]) {\n          pointer-events: auto;\n        }\n      </style>\n\n      <div class=\"vaadin-combo-box-container\">\n        <div part=\"label\">\n          <slot name=\"label\"></slot>\n          <span part=\"required-indicator\" aria-hidden=\"true\" on-click=\"focus\"></span>\n        </div>\n\n        <vaadin-input-container\n          part=\"input-field\"\n          readonly=\"[[readonly]]\"\n          disabled=\"[[disabled]]\"\n          invalid=\"[[invalid]]\"\n          theme$=\"[[_theme]]\"\n        >\n          <slot name=\"prefix\" slot=\"prefix\"></slot>\n          <slot name=\"input\"></slot>\n          <div id=\"clearButton\" part=\"clear-button\" slot=\"suffix\" aria-hidden=\"true\"></div>\n          <div id=\"toggleButton\" part=\"toggle-button\" slot=\"suffix\" aria-hidden=\"true\"></div>\n        </vaadin-input-container>\n\n        <div part=\"helper-text\">\n          <slot name=\"helper\"></slot>\n        </div>\n\n        <div part=\"error-message\">\n          <slot name=\"error-message\"></slot>\n        </div>\n      </div>\n\n      <vaadin-combo-box-overlay\n        id=\"overlay\"\n        opened=\"[[_overlayOpened]]\"\n        loading$=\"[[loading]]\"\n        theme$=\"[[_theme]]\"\n        position-target=\"[[_positionTarget]]\"\n        no-vertical-overlap\n        restore-focus-node=\"[[inputElement]]\"\n      ></vaadin-combo-box-overlay>\n\n      <slot name=\"tooltip\"></slot>\n    `;\n  }\n\n  static get properties() {\n    return {\n      /**\n       * @protected\n       */\n      _positionTarget: {\n        type: Object,\n      },\n    };\n  }\n\n  /**\n   * Used by `InputControlMixin` as a reference to the clear button element.\n   * @protected\n   * @return {!HTMLElement}\n   */\n  get clearElement() {\n    return this.$.clearButton;\n  }\n\n  /** @protected */\n  ready() {\n    super.ready();\n\n    this.addController(\n      new InputController(this, (input) => {\n        this._setInputElement(input);\n        this._setFocusElement(input);\n        this.stateTarget = input;\n        this.ariaTarget = input;\n      }),\n    );\n    this.addController(new LabelledInputController(this.inputElement, this._labelController));\n\n    this._tooltipController = new TooltipController(this);\n    this.addController(this._tooltipController);\n    this._tooltipController.setPosition('top');\n    this._tooltipController.setAriaTarget(this.inputElement);\n    this._tooltipController.setShouldShow((target) => !target.opened);\n\n    this._positionTarget = this.shadowRoot.querySelector('[part=\"input-field\"]');\n    this._toggleElement = this.$.toggleButton;\n  }\n\n  /**\n   * Override the method from `InputControlMixin`\n   * to stop event propagation to prevent `ComboBoxMixin`\n   * from handling this click event also on its own.\n   *\n   * @param {Event} event\n   * @protected\n   * @override\n   */\n  _onClearButtonClick(event) {\n    event.stopPropagation();\n    super._onClearButtonClick(event);\n  }\n\n  /**\n   * @param {Event} event\n   * @protected\n   */\n  _onHostClick(event) {\n    const path = event.composedPath();\n\n    // Open dropdown only when clicking on the label or input field\n    if (path.includes(this._labelNode) || path.includes(this._positionTarget)) {\n      super._onHostClick(event);\n    }\n  }\n}\n\ndefineCustomElement(ComboBox);\n\nexport { ComboBox };\n"],"names":["buttonStyles","ButtonMixin","superClass","properties","tabindex","type","Number","value","reflectToAttribute","_activeKeys","ready","super","this","hasAttribute","setAttribute","_onKeyDown","event","altKey","shiftKey","ctrlKey","metaKey","includes","key","preventDefault","click","moduleId","Button","is","template","_tooltipController","addController","button","comboBox","ComboBoxItem","comboBoxOverlayStyles","ComboBoxOverlay","ComboBoxScroller","PatternMixin","superclass","pattern","String","delegateAttrs","constraints","ComboBox","_positionTarget","Object","clearElement","$","clearButton","input","_setInputElement","_setFocusElement","stateTarget","ariaTarget","inputElement","_labelController","setPosition","setAriaTarget","setShouldShow","target","opened","shadowRoot","querySelector","_toggleElement","toggleButton","_onClearButtonClick","stopPropagation","_onHostClick","path","composedPath","_labelNode"],"sourceRoot":""}
+{"version":3,"file":"descope-date-field-descope-calendar-index-js.js","mappings":"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","sources":["webpack://@descope/web-components-ui/../components/descope-button/src/component/ButtonClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/clickableMixin.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-icon/src/component/IconClass.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/ImageClass.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/helpers.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button-base.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button-mixin.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/theme/lumo/vaadin-button-styles.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/combo-box/theme/lumo/vaadin-combo-box-styles.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/combo-box/src/vaadin-combo-box-item.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/combo-box/src/vaadin-combo-box-overlay.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/combo-box/src/vaadin-combo-box-scroller.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/field-base/src/pattern-mixin.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/combo-box/src/vaadin-combo-box.js"],"sourcesContent":["import { compose } from '@descope-ui/common/utils';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport {\n  createStyleMixin,\n  draggableMixin,\n  createProxy,\n  componentNameValidationMixin,\n  stretchMixin,\n} from '@descope-ui/common/components-mixins';\nimport { IconClass } from '@descope-ui/descope-icon/class';\nimport { clickableMixin } from './clickableMixin';\n\nexport const componentName = getComponentName('button');\n\nconst resetStyles = `\n\t:host {\n\t\tdisplay: inline-block;\n\t\tbox-sizing: border-box;\n\t}\n\tvaadin-button::before,\n\tvaadin-button::after {\n\t\topacity: 0;\n\t}\n\tvaadin-button {\n\t\tmargin: 0;\n\t\tmin-width: 0;\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tbox-shadow: none;\n\t}\n\tvaadin-button::part(label) {\n\t\tpadding: 0;\n    width: 100%;\n\t}\n\tvaadin-button::part(prefix) {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n`;\n\nconst iconStyles = `\n\tvaadin-button::part(prefix),\n\tvaadin-button::part(label) {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n`;\n\nconst editorOverrides = `vaadin-button::part(label) { pointer-events: none; }`;\n\nconst { host, label, slottedIcon } = {\n  host: { selector: () => ':host' },\n  label: { selector: '::part(label)' },\n  slottedIcon: { selector: () => '::slotted(descope-icon)' },\n};\n\nlet loadingIndicatorStyles;\n\nexport const ButtonClass = compose(\n  stretchMixin({ triggers: [{ attr: 'full-width', value: 'true' }] }),\n  createStyleMixin({\n    mappings: {\n      hostWidth: { property: 'width' },\n      hostMaxWidth: { ...host, property: 'max-width' },\n      hostHeight: { property: 'height' },\n      hostDirection: { ...host, property: 'direction' },\n      fontSize: {},\n      fontFamily: {},\n      fontWeight: {},\n\n      cursor: {},\n      backgroundColor: {},\n\n      outlineOffset: {},\n      outlineColor: {},\n      outlineStyle: {},\n      outlineWidth: {},\n\n      borderRadius: {},\n      borderColor: {},\n      borderStyle: {},\n      borderWidth: {},\n\n      verticalPadding: [\n        { property: 'padding-top' },\n        { property: 'padding-bottom' },\n      ],\n      horizontalPadding: [\n        { property: 'padding-right', fallback: '0.875em' },\n        { property: 'padding-left', fallback: '0.875em' },\n      ],\n\n      labelTextColor: { property: 'color' },\n      iconColor: {\n        selector: () => `::slotted(*)`,\n        property: IconClass.cssVarList.fill,\n      },\n      labelTextDecoration: { ...label, property: 'text-decoration' },\n      labelSpacing: { ...label, property: 'gap' },\n      textAlign: { ...label, property: 'justify-content', fallback: 'center' },\n\n      iconSize: [\n        { ...slottedIcon, property: 'width' },\n        { ...slottedIcon, property: 'height' },\n      ],\n    },\n  }),\n  clickableMixin,\n  draggableMixin,\n  componentNameValidationMixin,\n)(\n  createProxy({\n    slots: ['', 'prefix', 'label', 'suffix'],\n    wrappedEleName: 'vaadin-button',\n    style: () => `\n\t\t\t${resetStyles}\n\t\t\t${iconStyles}\n\t\t\t${loadingIndicatorStyles}\n\t\t\t${editorOverrides}\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${ButtonClass.cssVarList.outlineWidth}) + var(${ButtonClass.cssVarList.outlineOffset}));\n\t\t\t}\n      :host([full-width=\"true\"]) {\n        width: var(${ButtonClass.cssVarList.hostWidth});\n      }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${ButtonClass.cssVarList.hostHeight}) - var(${ButtonClass.cssVarList.outlineWidth}) - var(${ButtonClass.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square=\"true\"]:not([full-width=\"true\"]) {\n\t\t\t\twidth: calc(var(${ButtonClass.cssVarList.hostWidth}) - var(${ButtonClass.cssVarList.outlineWidth}) - var(${ButtonClass.cssVarList.outlineOffset}));\n        padding: 0;\n\t\t\t}\n\t\t`,\n    excludeAttrsSync: ['tabindex', 'class', 'style'],\n    componentName,\n  }),\n);\n\nconst { color, fontSize } = ButtonClass.cssVarList;\nloadingIndicatorStyles = `\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading=\"true\"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${color});\n\t\ttop: calc(50% - (var(${fontSize}) / 2));\n\t\tleft: calc(50% - (var(${fontSize}) / 2));\n\t\tborder-width: calc(var(${fontSize}) / 10);\n\t\twidth: var(${fontSize});\n\t\theight: var(${fontSize});\n\t}\n\t:host([disabled=\"true\"]),\n\t:host([loading=\"true\"]) {\n\t\tpointer-events: none;\n\t}\n\t:host([loading=\"true\"]) ::part(prefix),\n\t:host([loading=\"true\"]) ::part(label) {\n\t\tvisibility: hidden;\n\t}\n`;\n","export const clickableMixin = (superclass) =>\n  class ClickableMixinClass extends superclass {\n    get isLoading() {\n      return this.getAttribute('loading') === 'true';\n    }\n\n    click() {\n      this.isLoading || super.click();\n    }\n  };\n","import { componentName, ButtonClass } from './ButtonClass';\nimport '@vaadin/button';\n\ncustomElements.define(componentName, ButtonClass);\n\nexport { ButtonClass, componentName };\n","import {\n  componentNameValidationMixin,\n  createProxy,\n  createStyleMixin,\n  draggableMixin,\n} from '@descope-ui/common/components-mixins';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport { ImageClass } from '@descope-ui/descope-image/class';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('icon');\n\nexport const IconClass = compose(\n  createStyleMixin({\n    mappings: {\n      fill: [{}, { property: ImageClass.cssVarList.fill }],\n      height: { selector: () => ':host' },\n      width: { selector: () => ':host' },\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(\n  createProxy({\n    slots: [],\n    wrappedEleName: 'descope-image',\n    style: () => `\n      :host {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        max-height: 100%;\n      }\n      `,\n    excludeAttrsSync: ['tabindex', 'class', 'style', 'st-height', 'st-width'],\n    componentName,\n  }),\n);\n"," \nimport {\n  createStyleMixin,\n  draggableMixin,\n  componentNameValidationMixin,\n} from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport { compose } from '@descope-ui/common/utils';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport { createImage } from './helpers';\nimport { injectStyle } from '@descope-ui/common/components-helpers';\n\nexport const componentName = getComponentName('image');\n\nconst srcAttrs = ['src', 'src-dark'];\n\nclass RawImage extends createBaseClass({\n  componentName,\n  baseSelector: 'slot',\n}) {\n  static get observedAttributes() {\n    return srcAttrs;\n  }\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n\t\t<slot></slot>\n\t`;\n\n    injectStyle(\n      `\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n      :host > slot {\n        width: 100%;\n        height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n      ::slotted(*) {\n        width: 100%;\n\t\t\t}\n\n      .hidden {\n        display: none;\n      }\n      `,\n      this,\n    );\n  }\n\n  init() {\n    super.init?.();\n    this.toggleVisibility(this.getSrc);\n  }\n\n  onThemeChange() {\n    this.renderImage();\n  }\n\n  toggleVisibility(isVisible) {\n    if (isVisible) {\n      this.classList.remove('hidden');\n    } else {\n      this.classList.add('hidden');\n    }\n  }\n\n  get altText() {\n    return this.getAttribute('alt') || '';\n  }\n\n  get legacySrc() {\n    return this.getAttribute('src');\n  }\n\n  get themeSrc() {\n    return this.getAttribute(`src-${this.currentThemeName}`);\n  }\n\n  get getSrc() {\n    return this.themeSrc || this.legacySrc;\n  }\n\n  // in order to fill an SVG with `currentColor` override all of its `fill` and `path` nodes\n  // with the value from the `st-fill` attribute\n   \n  updateFillColor(node) {\n    // set fill to root node and all its relevant selectors\n    const elementsToReplace = [node, ...node.querySelectorAll('*[fill]')];\n\n    elementsToReplace.forEach((ele) => {\n      ele.setAttribute(\n        'fill',\n        `var(${ImageClass.cssVarList.fill}, ${ele.getAttribute('fill') || \"''\"})`,\n      );\n    });\n  }\n\n  renderImage() {\n    this.toggleVisibility(this.getSrc);\n\n    createImage(this.getSrc, this.altText).then((res) => {\n      this.innerHTML = '';\n      if (res) {\n        this.updateFillColor(res);\n        this.appendChild(res);\n      }\n    });\n  }\n\n  // render only when src attribute matches current theme\n  shouldRender(src) {\n    const srcVal = this.getAttribute(src);\n    return this.getSrc === srcVal;\n  }\n\n  attributeChangedCallback(attrName, oldValue, newValue) {\n    super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n    if (oldValue === newValue) return;\n\n    if (this.shouldRender(attrName)) {\n      this.renderImage();\n    }\n  }\n}\n\nexport const ImageClass = compose(\n  createStyleMixin({\n    mappings: {\n      fill: {},\n      height: { selector: () => ':host' },\n      width: { selector: () => ':host' },\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawImage);\n","import DOMPurify from 'dompurify';\n\nconst getFileExtension = (path) => {\n  const match = path.match(/\\.([0-9a-z]+)(?:[\\\\?#]|$)/i);\n  return match ? match[1] : null;\n};\n\nconst base64Prefix = 'data:image/svg+xml;base64,';\n\nconst isBase64Svg = (src) => src.startsWith(base64Prefix);\n\nconst createImgEle = (src, altText) => {\n  const ele = document.createElement('img');\n  ele.setAttribute('src', src);\n  ele.setAttribute('alt', altText);\n  return ele;\n};\n\nconst createSvgEle = (text) => {\n  // we want to purify the SVG to avoid XSS attacks\n  const clean = DOMPurify.sanitize(text, {\n    USE_PROFILES: { svg: true, svgFilters: true },\n    // allow image to render\n    ADD_TAGS: ['image'],\n    // forbid interactiviy via `use` tags (which are sanitized by default)\n    FORBID_TAGS: ['defs']\n  });\n\n  const parser = new DOMParser();\n  const ele = parser\n    .parseFromString(clean, 'image/svg+xml')\n    .querySelector('svg');\n  return ele;\n};\n\nexport const createImage = async (src, altText) => {\n  try {\n    let ele;\n    if (isBase64Svg(src)) {\n      // handle base64 source\n      const svgXml = atob(src.slice(base64Prefix.length));\n      ele = createSvgEle(svgXml);\n    } else if (getFileExtension(src) === 'svg') {\n      // handle urls\n      const fetchedSrc = await fetch(src);\n      const text = await fetchedSrc.text();\n      ele = createSvgEle(text);\n    } else {\n      // handle binary\n      ele = createImgEle(src, altText);\n    }\n\n    ele.style.setProperty('max-width', '100%');\n    ele.style.setProperty('max-height', '100%');\n\n    return ele;\n  } catch {\n    return null;\n  }\n};\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { css } from 'lit';\n\nexport const buttonStyles = css`\n  :host {\n    display: inline-block;\n    position: relative;\n    outline: none;\n    white-space: nowrap;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    user-select: none;\n  }\n\n  :host([hidden]) {\n    display: none !important;\n  }\n\n  /* Aligns the button with form fields when placed on the same line.\n  Note, to make it work, the form fields should have the same \"::before\" pseudo-element. */\n  .vaadin-button-container::before {\n    content: '\\\\2003';\n    display: inline-block;\n    width: 0;\n    max-height: 100%;\n  }\n\n  .vaadin-button-container {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n    width: 100%;\n    height: 100%;\n    min-height: inherit;\n    text-shadow: inherit;\n  }\n\n  [part='prefix'],\n  [part='suffix'] {\n    flex: none;\n  }\n\n  [part='label'] {\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  @media (forced-colors: active) {\n    :host {\n      outline: 1px solid;\n      outline-offset: -1px;\n    }\n\n    :host([focused]) {\n      outline-width: 2px;\n    }\n\n    :host([disabled]) {\n      outline-color: GrayText;\n    }\n  }\n`;\n\nexport const buttonTemplate = (html) => html`\n  <div class=\"vaadin-button-container\">\n    <span part=\"prefix\" aria-hidden=\"true\">\n      <slot name=\"prefix\"></slot>\n    </span>\n    <span part=\"label\">\n      <slot></slot>\n    </span>\n    <span part=\"suffix\" aria-hidden=\"true\">\n      <slot name=\"suffix\"></slot>\n    </span>\n  </div>\n  <slot name=\"tooltip\"></slot>\n`;\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { ActiveMixin } from '@vaadin/a11y-base/src/active-mixin.js';\nimport { FocusMixin } from '@vaadin/a11y-base/src/focus-mixin.js';\nimport { TabindexMixin } from '@vaadin/a11y-base/src/tabindex-mixin.js';\n\n/**\n * A mixin providing common button functionality.\n *\n * @polymerMixin\n * @mixes ActiveMixin\n * @mixes FocusMixin\n * @mixes TabindexMixin\n */\nexport const ButtonMixin = (superClass) =>\n  class ButtonMixinClass extends ActiveMixin(TabindexMixin(FocusMixin(superClass))) {\n    static get properties() {\n      return {\n        /**\n         * Indicates whether the element can be focused and where it participates in sequential keyboard navigation.\n         *\n         * @override\n         * @protected\n         */\n        tabindex: {\n          type: Number,\n          value: 0,\n          reflectToAttribute: true,\n        },\n      };\n    }\n\n    /**\n     * By default, `Space` is the only possible activation key for a focusable HTML element.\n     * Nonetheless, the button is an exception as it can be also activated by pressing `Enter`.\n     * See the \"Keyboard Support\" section in https://www.w3.org/TR/wai-aria-practices/examples/button/button.html.\n     *\n     * @protected\n     * @override\n     */\n    get _activeKeys() {\n      return ['Enter', ' '];\n    }\n\n    /** @protected */\n    ready() {\n      super.ready();\n\n      // By default, if the user hasn't provided a custom role,\n      // the role attribute is set to \"button\".\n      if (!this.hasAttribute('role')) {\n        this.setAttribute('role', 'button');\n      }\n    }\n\n    /**\n     * Since the button component is designed on the base of the `[role=button]` attribute,\n     * and doesn't have a native <button> inside, in order to be fully accessible from the keyboard,\n     * it should manually fire the `click` event once an activation key is pressed,\n     * as it follows from the WAI-ARIA specifications:\n     * https://www.w3.org/TR/wai-aria-practices-1.1/#button\n     *\n     * According to the UI Events specifications,\n     * the `click` event should be fired exactly on `keydown`:\n     * https://www.w3.org/TR/uievents/#event-type-keydown\n     *\n     * @param {KeyboardEvent} event\n     * @protected\n     * @override\n     */\n    _onKeyDown(event) {\n      super._onKeyDown(event);\n\n      if (event.altKey || event.shiftKey || event.ctrlKey || event.metaKey) {\n        return;\n      }\n\n      if (this._activeKeys.includes(event.key)) {\n        event.preventDefault();\n\n        // `DisabledMixin` overrides the standard `click()` method\n        // so that it doesn't fire the `click` event when the element is disabled.\n        this.click();\n      }\n    }\n  };\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { ControllerMixin } from '@vaadin/component-base/src/controller-mixin.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';\nimport { TooltipController } from '@vaadin/component-base/src/tooltip-controller.js';\nimport { registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { buttonStyles, buttonTemplate } from './vaadin-button-base.js';\nimport { ButtonMixin } from './vaadin-button-mixin.js';\n\nregisterStyles('vaadin-button', buttonStyles, { moduleId: 'vaadin-button-styles' });\n\n/**\n * `<vaadin-button>` is an accessible and customizable button that allows users to perform actions.\n *\n * ```html\n * <vaadin-button>Press me</vaadin-button>\n * ```\n *\n * ### Styling\n *\n * The following shadow DOM parts are available for styling:\n *\n * Part name | Description\n * ----------|-------------\n * `label`   | The label (text) inside the button.\n * `prefix`  | A slot for content before the label (e.g. an icon).\n * `suffix`  | A slot for content after the label (e.g. an icon).\n *\n * The following attributes are available for styling:\n *\n * Attribute    | Description\n * -------------|-------------\n * `active`     | Set when the button is pressed down, either with mouse, touch or the keyboard.\n * `disabled`   | Set when the button is disabled.\n * `focus-ring` | Set when the button is focused using the keyboard.\n * `focused`    | Set when the button is focused.\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ButtonMixin\n * @mixes ControllerMixin\n * @mixes ElementMixin\n * @mixes ThemableMixin\n */\nclass Button extends ButtonMixin(ElementMixin(ThemableMixin(ControllerMixin(PolymerElement)))) {\n  static get is() {\n    return 'vaadin-button';\n  }\n\n  static get template() {\n    return buttonTemplate(html);\n  }\n\n  /** @protected */\n  ready() {\n    super.ready();\n\n    this._tooltipController = new TooltipController(this);\n    this.addController(this._tooltipController);\n  }\n}\n\ndefineCustomElement(Button);\n\nexport { Button };\n","import '@vaadin/vaadin-lumo-styles/color.js';\nimport '@vaadin/vaadin-lumo-styles/sizing.js';\nimport '@vaadin/vaadin-lumo-styles/spacing.js';\nimport '@vaadin/vaadin-lumo-styles/style.js';\nimport '@vaadin/vaadin-lumo-styles/typography.js';\nimport { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\n\nconst button = css`\n  :host {\n    /* Sizing */\n    --lumo-button-size: var(--lumo-size-m);\n    min-width: var(--vaadin-button-min-width, calc(var(--_button-size) * 2));\n    height: var(--_button-size);\n    padding: var(--vaadin-button-padding, 0 calc(var(--_button-size) / 3 + var(--lumo-border-radius-m) / 2));\n    margin: var(--vaadin-button-margin, var(--lumo-space-xs) 0);\n    box-sizing: border-box;\n    /* Style */\n    font-family: var(--lumo-font-family);\n    font-size: var(--vaadin-button-font-size, var(--lumo-font-size-m));\n    font-weight: var(--vaadin-button-font-weight, 500);\n    color: var(--_lumo-button-text-color);\n    background: var(--_lumo-button-background);\n    border: var(--vaadin-button-border, none);\n    border-radius: var(--vaadin-button-border-radius, var(--lumo-border-radius-m));\n    cursor: var(--lumo-clickable-cursor);\n    -webkit-tap-highlight-color: transparent;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n    flex-shrink: 0;\n    --_button-size: var(--vaadin-button-height, var(--lumo-button-size));\n    --_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-primary-color-50pct));\n    --_focus-ring-width: var(--vaadin-focus-ring-width, 2px);\n    /* Used by notification */\n    --_lumo-button-background: var(--vaadin-button-background, var(--lumo-contrast-5pct));\n    --_lumo-button-text-color: var(--vaadin-button-text-color, var(--lumo-primary-text-color));\n    --_lumo-button-primary-background: var(--vaadin-button-primary-background, var(--lumo-primary-color));\n    --_lumo-button-primary-text-color: var(--vaadin-button-primary-text-color, var(--lumo-primary-contrast-color));\n  }\n\n  /* Set only for the internal parts so we don't affect the host vertical alignment */\n  [part='label'],\n  [part='prefix'],\n  [part='suffix'] {\n    line-height: var(--lumo-line-height-xs);\n  }\n\n  [part='label'] {\n    padding: calc(var(--lumo-button-size) / 6) 0;\n  }\n\n  :host([theme~='small']) {\n    font-size: var(--lumo-font-size-s);\n    --lumo-button-size: var(--lumo-size-s);\n  }\n\n  :host([theme~='large']) {\n    font-size: var(--lumo-font-size-l);\n    --lumo-button-size: var(--lumo-size-l);\n  }\n\n  /* For interaction states */\n  :host::before,\n  :host::after {\n    content: '';\n    /* We rely on the host always being relative */\n    position: absolute;\n    z-index: 1;\n    inset: 0;\n    background-color: currentColor;\n    border-radius: inherit;\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  /* Hover */\n\n  @media (any-hover: hover) {\n    :host(:hover)::before {\n      opacity: 0.02;\n    }\n  }\n\n  /* Active */\n\n  :host::after {\n    transition: opacity 1.4s, transform 0.1s;\n    filter: blur(8px);\n  }\n\n  :host([active])::before {\n    opacity: 0.05;\n    transition-duration: 0s;\n  }\n\n  :host([active])::after {\n    opacity: 0.1;\n    transition-duration: 0s, 0s;\n    transform: scale(0);\n  }\n\n  /* Keyboard focus */\n\n  :host([focus-ring]) {\n    box-shadow: 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);\n  }\n\n  :host([theme~='primary'][focus-ring]) {\n    box-shadow: 0 0 0 1px var(--lumo-base-color), 0 0 0 3px var(--lumo-primary-color-50pct);\n  }\n\n  /* Types (primary, tertiary, tertiary-inline */\n\n  :host([theme~='tertiary']),\n  :host([theme~='tertiary-inline']) {\n    --_background: transparent !important;\n    background: var(--vaadin-button-tertiary-background, var(--_background));\n    min-width: 0;\n  }\n\n  :host([theme~='tertiary']) {\n    border: var(--vaadin-button-tertiary-border, none);\n    color: var(--vaadin-button-tertiary-text-color, var(--lumo-primary-text-color));\n    font-weight: var(--vaadin-button-tertiary-font-weight, 500);\n    padding: var(--vaadin-button-tertiary-padding, 0 calc(var(--_button-size) / 6));\n  }\n\n  :host([theme~='tertiary-inline'])::before {\n    display: none;\n  }\n\n  :host([theme~='tertiary-inline']) {\n    margin: 0;\n    height: auto;\n    padding: 0;\n    line-height: inherit;\n    font-size: inherit;\n  }\n\n  :host([theme~='tertiary-inline']) [part='label'] {\n    padding: 0;\n    overflow: visible;\n    line-height: inherit;\n  }\n\n  :host([theme~='primary']) {\n    background: var(--_lumo-button-primary-background);\n    border: var(--vaadin-button-primary-border, none);\n    color: var(--_lumo-button-primary-text-color);\n    font-weight: var(--vaadin-button-primary-font-weight, 600);\n    min-width: calc(var(--lumo-button-size) * 2.5);\n  }\n\n  :host([theme~='primary'])::before {\n    background-color: black;\n  }\n\n  @media (any-hover: hover) {\n    :host([theme~='primary']:hover)::before {\n      opacity: 0.05;\n    }\n  }\n\n  :host([theme~='primary'][active])::before {\n    opacity: 0.1;\n  }\n\n  :host([theme~='primary'][active])::after {\n    opacity: 0.2;\n  }\n\n  /* Colors (success, error, contrast) */\n\n  :host([theme~='success']) {\n    color: var(--lumo-success-text-color);\n  }\n\n  :host([theme~='success'][theme~='primary']) {\n    background-color: var(--lumo-success-color);\n    color: var(--lumo-success-contrast-color);\n  }\n\n  :host([theme~='error']) {\n    color: var(--lumo-error-text-color);\n  }\n\n  :host([theme~='error'][theme~='primary']) {\n    background-color: var(--lumo-error-color);\n    color: var(--lumo-error-contrast-color);\n  }\n\n  :host([theme~='contrast']) {\n    color: var(--lumo-contrast);\n  }\n\n  :host([theme~='contrast'][theme~='primary']) {\n    background-color: var(--lumo-contrast);\n    color: var(--lumo-base-color);\n  }\n\n  /* Disabled state. Keep selectors after other color variants. */\n\n  :host([disabled]) {\n    pointer-events: none;\n    color: var(--lumo-disabled-text-color);\n  }\n\n  :host([theme~='primary'][disabled]) {\n    background-color: var(--lumo-contrast-30pct);\n    color: var(--lumo-base-color);\n  }\n\n  :host([theme~='primary'][disabled]) [part] {\n    opacity: 0.7;\n  }\n\n  /* Icons */\n\n  [part] ::slotted(vaadin-icon) {\n    display: inline-block;\n    width: var(--lumo-icon-size-m);\n    height: var(--lumo-icon-size-m);\n  }\n\n  /* Vaadin icons are based on a 16x16 grid (unlike Lumo and Material icons with 24x24), so they look too big by default */\n  [part] ::slotted(vaadin-icon[icon^='vaadin:']) {\n    padding: 0.25em;\n    box-sizing: border-box !important;\n  }\n\n  [part='prefix'] {\n    margin-left: -0.25em;\n    margin-right: 0.25em;\n  }\n\n  [part='suffix'] {\n    margin-left: 0.25em;\n    margin-right: -0.25em;\n  }\n\n  /* Icon-only */\n\n  :host([theme~='icon']:not([theme~='tertiary-inline'])) {\n    min-width: var(--lumo-button-size);\n    padding-left: calc(var(--lumo-button-size) / 4);\n    padding-right: calc(var(--lumo-button-size) / 4);\n  }\n\n  :host([theme~='icon']) [part='prefix'],\n  :host([theme~='icon']) [part='suffix'] {\n    margin-left: 0;\n    margin-right: 0;\n  }\n\n  /* RTL specific styles */\n\n  :host([dir='rtl']) [part='prefix'] {\n    margin-left: 0.25em;\n    margin-right: -0.25em;\n  }\n\n  :host([dir='rtl']) [part='suffix'] {\n    margin-left: -0.25em;\n    margin-right: 0.25em;\n  }\n\n  :host([dir='rtl'][theme~='icon']) [part='prefix'],\n  :host([dir='rtl'][theme~='icon']) [part='suffix'] {\n    margin-left: 0;\n    margin-right: 0;\n  }\n`;\n\nregisterStyles('vaadin-button', button, { moduleId: 'lumo-button' });\n\nexport { button };\n","import '@vaadin/input-container/theme/lumo/vaadin-input-container-styles.js';\nimport '@vaadin/vaadin-lumo-styles/font-icons.js';\nimport { inputFieldShared } from '@vaadin/vaadin-lumo-styles/mixins/input-field-shared.js';\nimport { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\n\nconst comboBox = css`\n  :host {\n    outline: none;\n  }\n\n  [part='toggle-button']::before {\n    content: var(--lumo-icons-dropdown);\n  }\n`;\n\nregisterStyles('vaadin-combo-box', [inputFieldShared, comboBox], { moduleId: 'lumo-combo-box' });\n","/**\n * @license\n * Copyright (c) 2015 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { DirMixin } from '@vaadin/component-base/src/dir-mixin.js';\nimport { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { ComboBoxItemMixin } from './vaadin-combo-box-item-mixin.js';\n\n/**\n * An item element used by the `<vaadin-combo-box>` dropdown.\n *\n * ### Styling\n *\n * The following shadow DOM parts are available for styling:\n *\n * Part name   | Description\n * ------------|--------------\n * `checkmark` | The graphical checkmark shown for a selected item\n * `content`   | The element that wraps the item content\n *\n * The following state attributes are exposed for styling:\n *\n * Attribute    | Description\n * -------------|-------------\n * `selected`   | Set when the item is selected\n * `focused`    | Set when the item is focused\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @customElement\n * @mixes ComboBoxItemMixin\n * @mixes ThemableMixin\n * @mixes DirMixin\n * @private\n */\nexport class ComboBoxItem extends ComboBoxItemMixin(ThemableMixin(DirMixin(PolymerElement))) {\n  static get template() {\n    return html`\n      <style>\n        :host {\n          display: block;\n        }\n\n        :host([hidden]) {\n          display: none;\n        }\n      </style>\n      <span part=\"checkmark\" aria-hidden=\"true\"></span>\n      <div part=\"content\">\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  static get is() {\n    return 'vaadin-combo-box-item';\n  }\n}\n\ndefineCustomElement(ComboBoxItem);\n","/**\n * @license\n * Copyright (c) 2015 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { DirMixin } from '@vaadin/component-base/src/dir-mixin.js';\nimport { OverlayMixin } from '@vaadin/overlay/src/vaadin-overlay-mixin.js';\nimport { overlayStyles } from '@vaadin/overlay/src/vaadin-overlay-styles.js';\nimport { css, registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { ComboBoxOverlayMixin } from './vaadin-combo-box-overlay-mixin.js';\n\nconst comboBoxOverlayStyles = css`\n  #overlay {\n    width: var(--vaadin-combo-box-overlay-width, var(--_vaadin-combo-box-overlay-default-width, auto));\n  }\n\n  [part='content'] {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n  }\n`;\n\nregisterStyles('vaadin-combo-box-overlay', [overlayStyles, comboBoxOverlayStyles], {\n  moduleId: 'vaadin-combo-box-overlay-styles',\n});\n\n/**\n * An element used internally by `<vaadin-combo-box>`. Not intended to be used separately.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ComboBoxOverlayMixin\n * @mixes DirMixin\n * @mixes OverlayMixin\n * @mixes ThemableMixin\n * @private\n */\nexport class ComboBoxOverlay extends ComboBoxOverlayMixin(OverlayMixin(DirMixin(ThemableMixin(PolymerElement)))) {\n  static get is() {\n    return 'vaadin-combo-box-overlay';\n  }\n\n  static get template() {\n    return html`\n      <div id=\"backdrop\" part=\"backdrop\" hidden></div>\n      <div part=\"overlay\" id=\"overlay\">\n        <div part=\"loader\"></div>\n        <div part=\"content\" id=\"content\"><slot></slot></div>\n      </div>\n    `;\n  }\n}\n\ndefineCustomElement(ComboBoxOverlay);\n","/**\n * @license\n * Copyright (c) 2015 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { ComboBoxScrollerMixin } from './vaadin-combo-box-scroller-mixin.js';\n\n/**\n * An element used internally by `<vaadin-combo-box>`. Not intended to be used separately.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ComboBoxScrollerMixin\n * @private\n */\nexport class ComboBoxScroller extends ComboBoxScrollerMixin(PolymerElement) {\n  static get is() {\n    return 'vaadin-combo-box-scroller';\n  }\n\n  static get template() {\n    return html`\n      <style>\n        :host {\n          display: block;\n          min-height: 1px;\n          overflow: auto;\n\n          /* Fixes item background from getting on top of scrollbars on Safari */\n          transform: translate3d(0, 0, 0);\n\n          /* Enable momentum scrolling on iOS */\n          -webkit-overflow-scrolling: touch;\n\n          /* Fixes scrollbar disappearing when 'Show scroll bars: Always' enabled in Safari */\n          box-shadow: 0 0 0 white;\n        }\n\n        #selector {\n          border-width: var(--_vaadin-combo-box-items-container-border-width);\n          border-style: var(--_vaadin-combo-box-items-container-border-style);\n          border-color: var(--_vaadin-combo-box-items-container-border-color, transparent);\n          position: relative;\n        }\n      </style>\n      <div id=\"selector\">\n        <slot></slot>\n      </div>\n    `;\n  }\n}\n\ndefineCustomElement(ComboBoxScroller);\n","/**\n * @license\n * Copyright (c) 2021 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { InputConstraintsMixin } from './input-constraints-mixin.js';\n\n/**\n * A mixin to provide `pattern` property.\n *\n * @polymerMixin\n * @mixes InputConstraintsMixin\n */\nexport const PatternMixin = (superclass) =>\n  class PatternMixinClass extends InputConstraintsMixin(superclass) {\n    static get properties() {\n      return {\n        /**\n         * A regular expression that the value is checked against.\n         * The pattern must match the entire value, not just some subset.\n         */\n        pattern: {\n          type: String,\n        },\n      };\n    }\n\n    static get delegateAttrs() {\n      return [...super.delegateAttrs, 'pattern'];\n    }\n\n    static get constraints() {\n      return [...super.constraints, 'pattern'];\n    }\n  };\n","/**\n * @license\n * Copyright (c) 2015 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport '@vaadin/input-container/src/vaadin-input-container.js';\nimport './vaadin-combo-box-item.js';\nimport './vaadin-combo-box-overlay.js';\nimport './vaadin-combo-box-scroller.js';\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';\nimport { TooltipController } from '@vaadin/component-base/src/tooltip-controller.js';\nimport { InputControlMixin } from '@vaadin/field-base/src/input-control-mixin.js';\nimport { InputController } from '@vaadin/field-base/src/input-controller.js';\nimport { LabelledInputController } from '@vaadin/field-base/src/labelled-input-controller.js';\nimport { PatternMixin } from '@vaadin/field-base/src/pattern-mixin.js';\nimport { inputFieldShared } from '@vaadin/field-base/src/styles/input-field-shared-styles.js';\nimport { registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { ComboBoxDataProviderMixin } from './vaadin-combo-box-data-provider-mixin.js';\nimport { ComboBoxMixin } from './vaadin-combo-box-mixin.js';\n\nregisterStyles('vaadin-combo-box', inputFieldShared, { moduleId: 'vaadin-combo-box-styles' });\n\n/**\n * `<vaadin-combo-box>` is a web component for choosing a value from a filterable list of options\n * presented in a dropdown overlay. The options can be provided as a list of strings or objects\n * by setting [`items`](#/elements/vaadin-combo-box#property-items) property on the element.\n *\n * ```html\n * <vaadin-combo-box id=\"combo-box\"></vaadin-combo-box>\n * ```\n *\n * ```js\n * document.querySelector('#combo-box').items = ['apple', 'orange', 'banana'];\n * ```\n *\n * When the selected `value` is changed, a `value-changed` event is triggered.\n *\n * ### Item rendering\n *\n * To customize the content of the `<vaadin-combo-box-item>` elements placed in the dropdown, use\n * [`renderer`](#/elements/vaadin-combo-box#property-renderer) property which accepts a function.\n * The renderer function is called with `root`, `comboBox`, and `model` as arguments.\n *\n * Generate DOM content by using `model` object properties if needed, and append it to the `root`\n * element. The `comboBox` reference is provided to access the combo-box element state. Do not\n * set combo-box properties in a `renderer` function.\n *\n * ```js\n * const comboBox = document.querySelector('#combo-box');\n * comboBox.items = [{'label': 'Hydrogen', 'value': 'H'}];\n * comboBox.renderer = (root, comboBox, model) => {\n *   const item = model.item;\n *   root.innerHTML = `${model.index}: ${item.label} <b>${item.value}</b>`;\n * };\n * ```\n *\n * Renderer is called on the opening of the combo-box and each time the related model is updated.\n * Before creating new content, it is recommended to check if there is already an existing DOM\n * element in `root` from a previous renderer call for reusing it. Even though combo-box uses\n * infinite scrolling, reducing DOM operations might improve performance.\n *\n * The following properties are available in the `model` argument:\n *\n * Property   | Type             | Description\n * -----------|------------------|-------------\n * `index`    | Number           | Index of the item in the `items` array\n * `item`     | String or Object | The item reference\n * `selected` | Boolean          | True when item is selected\n * `focused`  | Boolean          | True when item is focused\n *\n * ### Lazy Loading with Function Data Provider\n *\n * In addition to assigning an array to the items property, you can alternatively use the\n * [`dataProvider`](#/elements/vaadin-combo-box#property-dataProvider) function property.\n * The `<vaadin-combo-box>` calls this function lazily, only when it needs more data\n * to be displayed.\n *\n * __Note that when using function data providers, the total number of items\n * needs to be set manually. The total number of items can be returned\n * in the second argument of the data provider callback:__\n *\n * ```js\n * comboBox.dataProvider = async (params, callback) => {\n *   const API = 'https://demo.vaadin.com/demo-data/1.0/filtered-countries';\n *   const { filter, page, pageSize } = params;\n *   const index = page * pageSize;\n *\n *   const res = await fetch(`${API}?index=${index}&count=${pageSize}&filter=${filter}`);\n *   if (res.ok) {\n *     const { result, size } = await res.json();\n *     callback(result, size);\n *   }\n * };\n * ```\n *\n * ### Styling\n *\n * The following custom properties are available for styling:\n *\n * Custom property                         | Description                | Default\n * ----------------------------------------|----------------------------|---------\n * `--vaadin-field-default-width`          | Default width of the field | `12em`\n * `--vaadin-combo-box-overlay-width`      | Width of the overlay       | `auto`\n * `--vaadin-combo-box-overlay-max-height` | Max height of the overlay  | `65vh`\n *\n * `<vaadin-combo-box>` provides the same set of shadow DOM parts and state attributes as `<vaadin-text-field>`.\n * See [`<vaadin-text-field>`](#/elements/vaadin-text-field) for the styling documentation.\n *\n * In addition to `<vaadin-text-field>` parts, the following parts are available for theming:\n *\n * Part name       | Description\n * ----------------|----------------\n * `toggle-button` | The toggle button\n *\n * In addition to `<vaadin-text-field>` state attributes, the following state attributes are available for theming:\n *\n * Attribute | Description | Part name\n * ----------|-------------|------------\n * `opened`  | Set when the combo box dropdown is open | :host\n * `loading` | Set when new items are expected | :host\n *\n * If you want to replace the default `<input>` and its container with a custom implementation to get full control\n * over the input field, consider using the [`<vaadin-combo-box-light>`](#/elements/vaadin-combo-box-light) element.\n *\n * ### Internal components\n *\n * In addition to `<vaadin-combo-box>` itself, the following internal\n * components are themable:\n *\n * - `<vaadin-combo-box-overlay>` - has the same API as [`<vaadin-overlay>`](#/elements/vaadin-overlay).\n * - `<vaadin-combo-box-item>` - has the same API as [`<vaadin-item>`](#/elements/vaadin-item).\n * - [`<vaadin-input-container>`](#/elements/vaadin-input-container) - an internal element wrapping the input.\n *\n * Note: the `theme` attribute value set on `<vaadin-combo-box>` is\n * propagated to the internal components listed above.\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @fires {Event} change - Fired when the user commits a value change.\n * @fires {CustomEvent} custom-value-set - Fired when the user sets a custom value.\n * @fires {CustomEvent} filter-changed - Fired when the `filter` property changes.\n * @fires {CustomEvent} invalid-changed - Fired when the `invalid` property changes.\n * @fires {CustomEvent} opened-changed - Fired when the `opened` property changes.\n * @fires {CustomEvent} selected-item-changed - Fired when the `selectedItem` property changes.\n * @fires {CustomEvent} value-changed - Fired when the `value` property changes.\n * @fires {CustomEvent} validated - Fired whenever the field is validated.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ElementMixin\n * @mixes ThemableMixin\n * @mixes InputControlMixin\n * @mixes PatternMixin\n * @mixes ComboBoxDataProviderMixin\n * @mixes ComboBoxMixin\n */\nclass ComboBox extends ComboBoxDataProviderMixin(\n  ComboBoxMixin(PatternMixin(InputControlMixin(ThemableMixin(ElementMixin(PolymerElement))))),\n) {\n  static get is() {\n    return 'vaadin-combo-box';\n  }\n\n  static get template() {\n    return html`\n      <style>\n        :host([opened]) {\n          pointer-events: auto;\n        }\n      </style>\n\n      <div class=\"vaadin-combo-box-container\">\n        <div part=\"label\">\n          <slot name=\"label\"></slot>\n          <span part=\"required-indicator\" aria-hidden=\"true\" on-click=\"focus\"></span>\n        </div>\n\n        <vaadin-input-container\n          part=\"input-field\"\n          readonly=\"[[readonly]]\"\n          disabled=\"[[disabled]]\"\n          invalid=\"[[invalid]]\"\n          theme$=\"[[_theme]]\"\n        >\n          <slot name=\"prefix\" slot=\"prefix\"></slot>\n          <slot name=\"input\"></slot>\n          <div id=\"clearButton\" part=\"clear-button\" slot=\"suffix\" aria-hidden=\"true\"></div>\n          <div id=\"toggleButton\" part=\"toggle-button\" slot=\"suffix\" aria-hidden=\"true\"></div>\n        </vaadin-input-container>\n\n        <div part=\"helper-text\">\n          <slot name=\"helper\"></slot>\n        </div>\n\n        <div part=\"error-message\">\n          <slot name=\"error-message\"></slot>\n        </div>\n      </div>\n\n      <vaadin-combo-box-overlay\n        id=\"overlay\"\n        opened=\"[[_overlayOpened]]\"\n        loading$=\"[[loading]]\"\n        theme$=\"[[_theme]]\"\n        position-target=\"[[_positionTarget]]\"\n        no-vertical-overlap\n        restore-focus-node=\"[[inputElement]]\"\n      ></vaadin-combo-box-overlay>\n\n      <slot name=\"tooltip\"></slot>\n    `;\n  }\n\n  static get properties() {\n    return {\n      /**\n       * @protected\n       */\n      _positionTarget: {\n        type: Object,\n      },\n    };\n  }\n\n  /**\n   * Used by `InputControlMixin` as a reference to the clear button element.\n   * @protected\n   * @return {!HTMLElement}\n   */\n  get clearElement() {\n    return this.$.clearButton;\n  }\n\n  /** @protected */\n  ready() {\n    super.ready();\n\n    this.addController(\n      new InputController(this, (input) => {\n        this._setInputElement(input);\n        this._setFocusElement(input);\n        this.stateTarget = input;\n        this.ariaTarget = input;\n      }),\n    );\n    this.addController(new LabelledInputController(this.inputElement, this._labelController));\n\n    this._tooltipController = new TooltipController(this);\n    this.addController(this._tooltipController);\n    this._tooltipController.setPosition('top');\n    this._tooltipController.setAriaTarget(this.inputElement);\n    this._tooltipController.setShouldShow((target) => !target.opened);\n\n    this._positionTarget = this.shadowRoot.querySelector('[part=\"input-field\"]');\n    this._toggleElement = this.$.toggleButton;\n  }\n\n  /**\n   * Override the method from `InputControlMixin`\n   * to stop event propagation to prevent `ComboBoxMixin`\n   * from handling this click event also on its own.\n   *\n   * @param {Event} event\n   * @protected\n   * @override\n   */\n  _onClearButtonClick(event) {\n    event.stopPropagation();\n    super._onClearButtonClick(event);\n  }\n\n  /**\n   * @param {Event} event\n   * @protected\n   */\n  _onHostClick(event) {\n    const path = event.composedPath();\n\n    // Open dropdown only when clicking on the label or input field\n    if (path.includes(this._labelNode) || path.includes(this._positionTarget)) {\n      super._onHostClick(event);\n    }\n  }\n}\n\ndefineCustomElement(ComboBox);\n\nexport { ComboBox };\n"],"names":["componentName","host","label","slottedIcon","selector","loadingIndicatorStyles","ButtonClass","triggers","attr","value","mappings","hostWidth","property","hostMaxWidth","hostHeight","hostDirection","fontSize","fontFamily","fontWeight","cursor","backgroundColor","outlineOffset","outlineColor","outlineStyle","outlineWidth","borderRadius","borderColor","borderStyle","borderWidth","verticalPadding","horizontalPadding","fallback","labelTextColor","iconColor","cssVarList","fill","labelTextDecoration","labelSpacing","textAlign","iconSize","slots","wrappedEleName","style","excludeAttrsSync","color","clickableMixin","superclass","isLoading","this","getAttribute","click","super","customElements","define","IconClass","height","width","srcAttrs","RawImage","baseSelector","observedAttributes","constructor","attachShadow","mode","innerHTML","init","toggleVisibility","getSrc","onThemeChange","renderImage","isVisible","classList","remove","add","altText","legacySrc","themeSrc","currentThemeName","updateFillColor","node","querySelectorAll","forEach","ele","setAttribute","ImageClass","then","res","appendChild","shouldRender","src","srcVal","attributeChangedCallback","attrName","oldValue","newValue","createSvgEle","text","clean","sanitize","USE_PROFILES","svg","svgFilters","ADD_TAGS","FORBID_TAGS","DOMParser","parseFromString","querySelector","createImage","async","startsWith","isBase64Svg","svgXml","atob","slice","base64Prefix","path","match","getFileExtension","fetchedSrc","fetch","document","createElement","createImgEle","setProperty","buttonStyles","ButtonMixin","superClass","properties","tabindex","type","Number","reflectToAttribute","_activeKeys","ready","hasAttribute","_onKeyDown","event","altKey","shiftKey","ctrlKey","metaKey","includes","key","preventDefault","moduleId","Button","is","template","_tooltipController","addController","button","comboBox","ComboBoxItem","comboBoxOverlayStyles","ComboBoxOverlay","ComboBoxScroller","PatternMixin","pattern","String","delegateAttrs","constraints","ComboBox","_positionTarget","Object","clearElement","$","clearButton","input","_setInputElement","_setFocusElement","stateTarget","ariaTarget","inputElement","_labelController","setPosition","setAriaTarget","setShouldShow","target","opened","shadowRoot","_toggleElement","toggleButton","_onClearButtonClick","stopPropagation","_onHostClick","composedPath","_labelNode"],"sourceRoot":""}