@descope/web-components-ui 3.20.3 → 3.21.0

package/dist/umd/descope-recovery-codes.js.map

@@ -1 +1 @@
-{"version":3,"file":"descope-recovery-codes.js","mappings":"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","sources":["webpack://@descope/web-components-ui/../components/descope-recovery-codes/src/component/RecoveryCodesClass.js","webpack://@descope/web-components-ui/../components/descope-recovery-codes/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-text/src/component/TextClass.js","webpack://@descope/web-components-ui/../components/descope-text/src/component/index.js"],"sourcesContent":["import {\n  createStyleMixin,\n  draggableMixin,\n  componentNameValidationMixin,\n  createDynamicDataMixin,\n} from '@descope-ui/common/components-mixins';\nimport { compose } from '@descope-ui/common/utils';\nimport {\n  forwardAttrs,\n  getComponentName,\n  injectStyle,\n} from '@descope-ui/common/components-helpers';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport { TextClass } from '@descope-ui/descope-text/class';\n\nexport const componentName = getComponentName('recovery-codes');\n\nconst itemRenderer = ({ value }, _, ref) => {\n  return `\n    <descope-text variant=\"${ref.variant}\" mode=\"${ref.mode}\">\n      <span>${value}</span>\n    </descope-text>\n  `;\n};\n\nclass RawRecoveryCodes extends createBaseClass({\n  componentName,\n  baseSelector: ':host > div',\n}) {\n  static get observedAttributes() {\n    return ['readonly'];\n  }\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n      <div class=\"wrapper\">\n        <div class=\"list\"></div>\n        <descope-text class=\"icon-wrapper\">\n          <vaadin-icon class=\"icon\" icon=\"vaadin:copy-o\" title=\"Copy\"></vaadin-icon>\n        </descope-text>\n      </div>\n    `;\n\n    this.list = this.shadowRoot.querySelector('.list');\n    this.icon = this.shadowRoot.querySelector('.icon');\n    this.iconWrapper = this.shadowRoot.querySelector('.icon-wrapper');\n\n    injectStyle(\n      `\n      :host {\n        display: inline-block;\n        position: relative;\n      }\n      .wrapper {\n        display: flex;\n        justify-content: space-between;\n      }\n      .list {\n        display: flex;\n        flex-grow: 1;\n        flex-direction: column;\n      }\n      descope-text span {\n        display: inline-flex;\n        align-items: center;\n        width: fit-content;\n      }\n      descope-text span::before {\n        content: '\\\\02022';\n        transform: translateY(-0.06em);\n      }\n      .icon-wrapper {\n        align-self: flex-start;\n      }\n      .icon {\n        cursor: pointer;\n      }\n      .icon.copied {\n        cursor: initial;\n      }\n      .icon.readonly {\n        pointer-events: none;\n      }\n    `,\n      this,\n    );\n  }\n\n  get variant() {\n    return this.getAttribute('variant');\n  }\n\n  get mode() {\n    return this.getAttribute('mode');\n  }\n\n  init() {\n    super.init();\n\n    this.icon.addEventListener('click', this.onCopy.bind(this));\n\n    forwardAttrs(this, this.iconWrapper, { includeAttrs: ['variant', 'mode'] });\n  }\n\n  onCopy() {\n    navigator.clipboard.writeText(\n      String(this.data.map((rc) => rc.value).join('\\n')),\n    );\n\n    this.icon.setAttribute('icon', 'vaadin:check-circle-o');\n    this.icon.setAttribute('title', 'Copied');\n    this.icon.classList.add('copied');\n\n    setTimeout(() => {\n      this.icon.setAttribute('icon', 'vaadin:copy-o');\n      this.icon.setAttribute('title', 'Copy');\n      this.icon.classList.remove('copied');\n    }, 5000);\n  }\n\n  onReadOnly(isReadOnly) {\n    this.icon.classList.toggle('readonly', isReadOnly);\n  }\n\n  attributeChangedCallback(attrName, oldValue, newValue) {\n    super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n    if (newValue !== oldValue) {\n      if (attrName === 'readonly') {\n        this.onReadOnly(newValue === 'true');\n      }\n    }\n  }\n}\n\nexport const RecoveryCodesClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: { selector: () => ':host', property: 'width' },\n      hostMinWidth: { selector: () => ':host', property: 'min-width' },\n      hostDirection: [\n        { selector: () => ':host', property: 'direction' },\n        {\n          selector: () => TextClass.componentName,\n          property: TextClass.cssVarList.hostDirection,\n        },\n      ],\n      textAlign: { selector: () => '.list', property: 'align-items' },\n      iconColor: { selector: () => 'vaadin-icon', property: 'color' },\n      iconSize: { selector: () => 'vaadin-icon', property: 'font-size' },\n      iconGap: { selector: () => '.wrapper', property: 'gap' },\n      bulletGap: { selector: () => 'descope-text span', property: 'gap' },\n    },\n  }),\n  createDynamicDataMixin({\n    itemRenderer,\n    rerenderAttrsList: ['variant', 'mode'],\n    targetSelector: '.list',\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawRecoveryCodes);\n","import '@descope-ui/descope-text';\nimport '@vaadin/icons';\nimport '@vaadin/icon';\n\nimport { componentName, RecoveryCodesClass } from './RecoveryCodesClass';\n\ncustomElements.define(componentName, RecoveryCodesClass);\n\nexport { RecoveryCodesClass, componentName };\n","import {\n  createStyleMixin,\n  draggableMixin,\n  componentNameValidationMixin,\n  stretchMixin,\n} from '@descope-ui/common/components-mixins';\nimport { compose } from '@descope-ui/common/utils';\nimport {\n  getComponentName,\n  injectStyle,\n  observeChildren,\n} from '@descope-ui/common/components-helpers';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\n\nexport const componentName = getComponentName('text');\n\nclass RawText extends createBaseClass({\n  componentName,\n  baseSelector: ':host > slot',\n}) {\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n    <slot part=\"text-wrapper\"></slot>\n    `;\n\n    injectStyle(\n      `\n      :host {\n        display: inline-block;\n        line-height: 1em;\n      }\n      :host > slot {\n        width: 100%;\n        display: inline-block;\n      }\n    `,\n      this,\n    );\n  }\n\n  get hideWhenEmpty() {\n    return this.getAttribute('hide-when-empty') === 'true';\n  }\n\n  init() {\n    super.init();\n\n    observeChildren(this, () => {\n      const hasChildren = !!this.childNodes.length;\n      this.style.display = !hasChildren && this.hideWhenEmpty ? 'none' : '';\n    });\n  }\n}\n\nconst { host } = {\n  host: { selector: () => ':host' },\n};\n\nexport const TextClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: { ...host, property: 'width' },\n      hostDirection: { ...host, property: 'direction' },\n      fontSize: {},\n      textColor: [{ property: 'color' }],\n      textLineHeight: { property: 'line-height' },\n      textLetterSpacing: { property: 'letter-spacing' },\n      textShadow: {},\n      textAlign: {},\n      textTransform: {},\n      fontFamily: {},\n      fontStyle: {},\n      fontWeight: {},\n      borderWidth: {},\n      borderStyle: {},\n      borderColor: {},\n    },\n  }),\n  stretchMixin({ triggers: [{ attr: 'full-width', value: 'true' }] }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawText);\n","import { componentName, TextClass } from './TextClass';\n\ncustomElements.define(componentName, TextClass);\n\nexport { TextClass, componentName };\n"],"names":["componentName","componentsHelpers","xE","RawRecoveryCodes","baseClasses","qu","baseSelector","observedAttributes","constructor","super","this","attachShadow","mode","innerHTML","list","shadowRoot","querySelector","icon","iconWrapper","fz","variant","getAttribute","init","addEventListener","onCopy","bind","EA","includeAttrs","navigator","clipboard","writeText","String","data","map","rc","value","join","setAttribute","classList","add","setTimeout","remove","onReadOnly","isReadOnly","toggle","attributeChangedCallback","attrName","oldValue","newValue","RecoveryCodesClass","utils","Zz","componentsMixins","RF","mappings","hostWidth","selector","property","hostMinWidth","hostDirection","TextClass","s","cssVarList","textAlign","iconColor","iconSize","iconGap","bulletGap","t$","itemRenderer","_","ref","rerenderAttrsList","targetSelector","VO","tQ","customElements","define","_descope_ui_common_components_helpers__WEBPACK_IMPORTED_MODULE_2__","RawText","_descope_ui_common_base_classes__WEBPACK_IMPORTED_MODULE_3__","hideWhenEmpty","Ge","hasChildren","childNodes","length","style","display","host","_descope_ui_common_utils__WEBPACK_IMPORTED_MODULE_1__","_descope_ui_common_components_mixins__WEBPACK_IMPORTED_MODULE_0__","fontSize","textColor","textLineHeight","textLetterSpacing","textShadow","textTransform","fontFamily","fontStyle","fontWeight","borderWidth","borderStyle","borderColor","DM","triggers","attr","_TextClass__WEBPACK_IMPORTED_MODULE_0__","T"],"sourceRoot":""}
+{"version":3,"file":"descope-recovery-codes.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-icon/src/component/index.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/../components/descope-image/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-recovery-codes/src/component/RecoveryCodesClass.js","webpack://@descope/web-components-ui/../components/descope-recovery-codes/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-text/src/component/TextClass.js","webpack://@descope/web-components-ui/../components/descope-text/src/component/index.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","import '@descope-ui/descope-image';\n\nimport { componentName, IconClass } from './IconClass';\n\ncustomElements.define(componentName, IconClass);\n\nexport { IconClass, componentName };\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","import { componentName, ImageClass } from './ImageClass';\n\ncustomElements.define(componentName, ImageClass);\n\nexport { ImageClass, componentName };\n","import {\n  createStyleMixin,\n  draggableMixin,\n  componentNameValidationMixin,\n  createDynamicDataMixin,\n} from '@descope-ui/common/components-mixins';\nimport { compose } from '@descope-ui/common/utils';\nimport {\n  forwardAttrs,\n  getComponentName,\n  injectStyle,\n} from '@descope-ui/common/components-helpers';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport { TextClass } from '@descope-ui/descope-text/class';\n\nexport const componentName = getComponentName('recovery-codes');\n\nconst NO_ACTION = 'none';\nconst DEFAULT_ERROR_MESSAGE = 'Please save your recovery codes to continue';\n\n// default button label per action (buttons variant). the icons variant uses the vaadin\n// glyphs hardcoded in the shadow-DOM template below; the buttons variant uses image srcs.\nconst ACTIONS = {\n  copy: { defaultText: 'Copy' },\n  download: { defaultText: 'Download' },\n};\n\n// per-button config suffixes; the full attribute is `${action}-${suffix}`.\n// `icon`/`icon-dark` are image srcs (the seeded glyph or a custom upload), matching\n// the standard button's start-icon (light/dark), not a boolean.\nconst BUTTON_SUFFIXES = [\n  'text',\n  'variant',\n  'color',\n  'size',\n  'icon',\n  'icon-dark',\n];\n\n// changing any of these rebuilds the buttons (so the editor preview stays live)\nconst BUTTON_ATTRS = [\n  'show-download',\n  ...Object.keys(ACTIONS).flatMap((action) =>\n    BUTTON_SUFFIXES.map((suffix) => `${action}-${suffix}`),\n  ),\n];\n\nconst itemRenderer = ({ value }, _, ref) => {\n  return `\n    <descope-text variant=\"${ref.variant}\" mode=\"${ref.mode}\">\n      <span>${value}</span>\n    </descope-text>\n  `;\n};\n\nclass RawRecoveryCodes extends createBaseClass({\n  componentName,\n  baseSelector: ':host > div',\n}) {\n  static get observedAttributes() {\n    return ['readonly', 'required', ...BUTTON_ATTRS];\n  }\n\n  // 'none' | 'copied' | 'downloaded' - the last action the user took on the codes\n  #action = NO_ACTION;\n\n  // the error is shown only after a submit attempt (reportValidity), like inputs\n  #showError = false;\n\n  // init() builds the buttons once with all seeded attrs; guards against rebuilding\n  // on every per-attribute change fired during element upgrade (before init runs)\n  #initialized = false;\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n      <div class=\"wrapper\">\n        <div class=\"codes-box\">\n          <div class=\"list\"></div>\n          <descope-text class=\"icon-wrapper\">\n            <div class=\"icons\">\n              <vaadin-icon class=\"icon copy-icon\" icon=\"vaadin:copy-o\" title=\"Copy\"></vaadin-icon>\n              <vaadin-icon class=\"icon download-icon\" icon=\"vaadin:download-alt\" title=\"Download\"></vaadin-icon>\n            </div>\n          </descope-text>\n        </div>\n        <div class=\"error-message\"></div>\n        <div class=\"buttons-row\"></div>\n      </div>\n    `;\n\n    this.list = this.shadowRoot.querySelector('.list');\n    this.copyIcon = this.shadowRoot.querySelector('.copy-icon');\n    this.downloadIcon = this.shadowRoot.querySelector('.download-icon');\n    this.iconWrapper = this.shadowRoot.querySelector('.icon-wrapper');\n    this.errorMessageEle = this.shadowRoot.querySelector('.error-message');\n    this.buttonsRow = this.shadowRoot.querySelector('.buttons-row');\n\n    injectStyle(\n      `\n      :host {\n        display: inline-block;\n        position: relative;\n      }\n      .wrapper {\n        display: flex;\n        flex-direction: column;\n      }\n      .codes-box {\n        display: flex;\n        justify-content: space-between;\n        box-sizing: border-box;\n        /* border shows the error ring inside the box; style/width/color/radius come from theme */\n      }\n      .list {\n        display: flex;\n        flex-grow: 1;\n        flex-direction: column;\n      }\n      descope-text span {\n        display: inline-flex;\n        align-items: center;\n        width: fit-content;\n      }\n      descope-text span::before {\n        content: '\\\\02022';\n        transform: translateY(-0.06em);\n      }\n      .icon-wrapper {\n        align-self: flex-start;\n      }\n      .icons {\n        display: flex;\n        flex-direction: column;\n      }\n      .icon {\n        cursor: pointer;\n      }\n      .icon.copied {\n        cursor: initial;\n        /* block re-clicks while the checkmark shows, so rapid clicks cannot repeat the action */\n        pointer-events: none;\n      }\n      /* readonly is a host attribute, so disable pointer events from one place */\n      :host([readonly=\"true\"]) .icon,\n      :host([readonly=\"true\"]) .buttons-row {\n        pointer-events: none;\n      }\n      .download-icon {\n        display: none;\n      }\n      :host([show-download=\"true\"]) .download-icon {\n        display: inline-flex;\n      }\n      .error-message {\n        display: none;\n        /* width:0 + min-width:100% lets the message wrap to the component width without\n           its text expanding the (shrink-to-fit) component; full-width still fills the parent */\n        width: 0;\n        min-width: 100%;\n        box-sizing: border-box;\n        line-height: 1.2;\n        overflow-wrap: break-word;\n      }\n      :host([invalid]) .error-message {\n        display: block;\n      }\n      .buttons-row {\n        display: none;\n      }\n      :host([display-variant=\"buttons\"]) .icon-wrapper {\n        display: none;\n      }\n      :host([display-variant=\"buttons\"]) .buttons-row {\n        display: flex;\n        flex-wrap: wrap;\n      }\n      /* grow to fill equally; don't shrink below content, so they wrap to a new line\n         when they don't fit (like a container with auto-fit items) */\n      .buttons-row > descope-button {\n        flex: 1 0 auto;\n      }\n    `,\n      this,\n    );\n  }\n\n  get variant() {\n    return this.getAttribute('variant');\n  }\n\n  get mode() {\n    return this.getAttribute('mode');\n  }\n\n  // the form value read by the flow SDK (#getFormData reads `.value`)\n  get value() {\n    return this.#action;\n  }\n\n  // a boolean attribute is \"on\" when present and not explicitly \"false\"\n  #boolAttr(name) {\n    return this.hasAttribute(name) && this.getAttribute(name) !== 'false';\n  }\n\n  get isRequired() {\n    return this.#boolAttr('required');\n  }\n\n  get isReadOnly() {\n    return this.#boolAttr('readonly');\n  }\n\n  get errorMessage() {\n    return (\n      this.getAttribute('data-errormessage-value-missing') ||\n      DEFAULT_ERROR_MESSAGE\n    );\n  }\n\n  get codesText() {\n    return String((this.data || []).map((rc) => rc.value).join('\\n'));\n  }\n\n  init() {\n    super.init();\n\n    this.copyIcon.addEventListener('click', this.onCopy.bind(this));\n    this.downloadIcon.addEventListener('click', this.onDownload.bind(this));\n\n    forwardAttrs(this, this.iconWrapper, { includeAttrs: ['variant', 'mode'] });\n\n    this.renderButtons();\n    this.#initialized = true;\n  }\n\n  get isDownloadEnabled() {\n    return this.getAttribute('show-download') === 'true';\n  }\n\n  // buttons variant: copy (+ download when enabled) as descope-buttons, each independently\n  // configurable. rendered even in the icons variant (CSS hides the row) so a variant switch is instant.\n  renderButtons() {\n    if (!this.buttonsRow) return;\n\n    const buttons = [this.buildButton('copy')];\n    if (this.isDownloadEnabled) {\n      buttons.push(this.buildButton('download'));\n    }\n    this.buttonsRow.replaceChildren(...buttons);\n  }\n\n  buildButton(action) {\n    const { defaultText } = ACTIONS[action];\n    const attr = (name, fallback) =>\n      this.getAttribute(`${action}-${name}`) || fallback;\n\n    const button = document.createElement('descope-button');\n    button.setAttribute('data-action', action);\n    button.setAttribute('variant', attr('variant', 'outline'));\n    button.setAttribute('mode', attr('color', 'primary'));\n    button.setAttribute('size', attr('size', 'md'));\n\n    // icon is an image src - the seeded glyph or a custom upload (light/dark),\n    // same as the standard button's start icon. rendered via descope-icon in the\n    // default slot (not slot=\"prefix\") so it centers with the label when the\n    // button grows. descope-icon inlines SVGs, so the glyph (authored with\n    // fill=\"currentColor\") tracks the button text color while an uploaded image\n    // keeps its own colors.\n    const iconSrc = this.getAttribute(`${action}-icon`);\n    if (iconSrc) {\n      const icon = document.createElement('descope-icon');\n      icon.setAttribute('src', iconSrc);\n      const iconDark = this.getAttribute(`${action}-icon-dark`);\n      if (iconDark) icon.setAttribute('src-dark', iconDark);\n      button.appendChild(icon);\n    }\n\n    button.appendChild(document.createTextNode(attr('text', defaultText)));\n    button.addEventListener('click', () =>\n      action === 'copy' ? this.onCopy() : this.onDownload(),\n    );\n    return button;\n  }\n\n  onCopy() {\n    if (this.isReadOnly) return;\n    navigator.clipboard.writeText(this.codesText);\n    this.showActionFeedback(this.copyIcon, 'Copied');\n    this.recordAction('copied');\n  }\n\n  onDownload() {\n    if (this.isReadOnly) return;\n    const blob = new Blob([this.codesText], { type: 'text/plain' });\n    const url = URL.createObjectURL(blob);\n    const anchor = document.createElement('a');\n    anchor.href = url;\n    anchor.download = 'recovery-codes.txt';\n    anchor.click();\n    URL.revokeObjectURL(url);\n\n    this.showActionFeedback(this.downloadIcon, 'Downloaded');\n    this.recordAction('downloaded');\n  }\n\n  // copy/download share this - only the visual feedback differs by variant\n  recordAction(action) {\n    this.#action = action;\n    // let the flow re-evaluate real-time conditions and pick up the new value\n    this.dispatchEvent(new Event('change', { bubbles: true }));\n    // acting clears the mandatory error\n    if (this.checkValidity()) {\n      this.#showError = false;\n    }\n    this.syncValidityUI();\n  }\n\n  // icons variant: swap the icon to a checkmark for 5s (buttons variant is static)\n  showActionFeedback(iconEle, doneTitle) {\n    // on a rapid re-click the checkmark is already showing, so cancel the pending restore\n    // and keep the glyph/title we saved the first time (never capture the checkmark itself)\n    if (iconEle.feedbackTimer) {\n      clearTimeout(iconEle.feedbackTimer);\n    } else {\n      iconEle.originalIcon = iconEle.getAttribute('icon');\n      iconEle.originalTitle = iconEle.getAttribute('title');\n    }\n\n    iconEle.setAttribute('icon', 'vaadin:check-circle-o');\n    iconEle.setAttribute('title', doneTitle);\n    iconEle.classList.add('copied');\n\n    iconEle.feedbackTimer = setTimeout(() => {\n      iconEle.setAttribute('icon', iconEle.originalIcon);\n      iconEle.setAttribute('title', iconEle.originalTitle);\n      iconEle.classList.remove('copied');\n      iconEle.feedbackTimer = null;\n    }, 5000);\n  }\n\n  // the flow SDK's #validateInputs calls checkValidity/reportValidity on every *[name]\n  checkValidity() {\n    return this.isReadOnly || !this.isRequired || this.value !== NO_ACTION;\n  }\n\n  reportValidity() {\n    const valid = this.checkValidity();\n    this.#showError = !valid;\n    this.syncValidityUI();\n    return valid;\n  }\n\n  // single source of truth for the error UI - reflects `invalid` (theme `_invalid`\n  // draws the outline) and fills the message. never toggled anywhere else.\n  syncValidityUI() {\n    this.toggleAttribute('invalid', this.#showError);\n    if (this.errorMessageEle) {\n      this.errorMessageEle.textContent = this.#showError\n        ? this.errorMessage\n        : '';\n    }\n  }\n\n  attributeChangedCallback(attrName, oldValue, newValue) {\n    super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n    if (newValue === oldValue) return;\n\n    // if it stops being required, drop any error already shown\n    if (attrName === 'required' && !this.isRequired) {\n      this.#showError = false;\n      this.syncValidityUI();\n    }\n\n    // only rebuild for live edits after init (init already built once with all attrs);\n    // avoids rebuilding once per attribute during the initial element upgrade\n    if (this.#initialized && BUTTON_ATTRS.includes(attrName)) {\n      this.renderButtons();\n    }\n  }\n}\n\nexport const RecoveryCodesClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: { selector: () => ':host', property: 'width' },\n      hostMinWidth: { selector: () => ':host', property: 'min-width' },\n      hostDirection: [\n        { selector: () => ':host', property: 'direction' },\n        {\n          selector: () => TextClass.componentName,\n          property: TextClass.cssVarList.hostDirection,\n        },\n      ],\n      textAlign: { selector: () => '.list', property: 'align-items' },\n      iconColor: { selector: () => 'vaadin-icon', property: 'color' },\n      iconSize: { selector: () => 'vaadin-icon', property: 'font-size' },\n      iconGap: { selector: () => '.codes-box', property: 'gap' },\n      iconStackGap: { selector: () => '.icons', property: 'gap' },\n      buttonsGap: { selector: () => '.buttons-row', property: 'gap' },\n      sectionsGap: { selector: () => '.wrapper', property: 'gap' },\n      bulletGap: { selector: () => 'descope-text span', property: 'gap' },\n      // top + bottom padding sit inside the border (below the codes) in both variants; in the\n      // buttons variant the bottom padding also repeats below the buttons (the buttons-row entry\n      // is inert in the icons variant, where the row is display:none).\n      verticalPadding: [\n        { selector: () => '.codes-box', property: 'padding-top' },\n        { selector: () => '.codes-box', property: 'padding-bottom' },\n        { selector: () => '.buttons-row', property: 'padding-bottom' },\n      ],\n      // horizontal padding insets the codes (inside the border) and the buttons, but NOT the\n      // error message, which stays aligned to the component edge (like the input error).\n      horizontalPadding: [\n        { selector: () => '.codes-box', property: 'padding-left' },\n        { selector: () => '.codes-box', property: 'padding-right' },\n        { selector: () => '.buttons-row', property: 'padding-left' },\n        { selector: () => '.buttons-row', property: 'padding-right' },\n      ],\n      errorBorderColor: {\n        selector: () => '.codes-box',\n        property: 'border-color',\n      },\n      errorMessageColor: {\n        selector: () => '.error-message',\n        property: 'color',\n      },\n      errorMessageFontSize: {\n        selector: () => '.error-message',\n        property: 'font-size',\n      },\n      errorMessageFontWeight: {\n        selector: () => '.error-message',\n        property: 'font-weight',\n      },\n      errorMessageFontFamily: {\n        selector: () => '.error-message',\n        property: 'font-family',\n      },\n      boxBorderRadius: {\n        selector: () => '.codes-box',\n        property: 'border-radius',\n      },\n      errorBorderWidth: {\n        selector: () => '.codes-box',\n        property: 'border-width',\n      },\n      boxBorderStyle: {\n        selector: () => '.codes-box',\n        property: 'border-style',\n      },\n    },\n  }),\n  // also inject the shared input-wrapper theme onto our host (like the input components do),\n  // so the error message + border track the console \"customize inputs\" tokens\n  createStyleMixin({\n    componentNameOverride: getComponentName('input-wrapper'),\n  }),\n  createDynamicDataMixin({\n    itemRenderer,\n    rerenderAttrsList: ['variant', 'mode'],\n    targetSelector: '.list',\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawRecoveryCodes);\n","import '@descope-ui/descope-text';\nimport '@descope-ui/descope-button';\nimport '@descope-ui/descope-icon';\nimport '@vaadin/icons';\nimport '@vaadin/icon';\n\nimport { componentName, RecoveryCodesClass } from './RecoveryCodesClass';\n\ncustomElements.define(componentName, RecoveryCodesClass);\n\nexport { RecoveryCodesClass, componentName };\n","import {\n  createStyleMixin,\n  draggableMixin,\n  componentNameValidationMixin,\n  stretchMixin,\n} from '@descope-ui/common/components-mixins';\nimport { compose } from '@descope-ui/common/utils';\nimport {\n  getComponentName,\n  injectStyle,\n  observeChildren,\n} from '@descope-ui/common/components-helpers';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\n\nexport const componentName = getComponentName('text');\n\nclass RawText extends createBaseClass({\n  componentName,\n  baseSelector: ':host > slot',\n}) {\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n    <slot part=\"text-wrapper\"></slot>\n    `;\n\n    injectStyle(\n      `\n      :host {\n        display: inline-block;\n        line-height: 1em;\n      }\n      :host > slot {\n        width: 100%;\n        display: inline-block;\n      }\n    `,\n      this,\n    );\n  }\n\n  get hideWhenEmpty() {\n    return this.getAttribute('hide-when-empty') === 'true';\n  }\n\n  init() {\n    super.init();\n\n    observeChildren(this, () => {\n      const hasChildren = !!this.childNodes.length;\n      this.style.display = !hasChildren && this.hideWhenEmpty ? 'none' : '';\n    });\n  }\n}\n\nconst { host } = {\n  host: { selector: () => ':host' },\n};\n\nexport const TextClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: { ...host, property: 'width' },\n      hostDirection: { ...host, property: 'direction' },\n      fontSize: {},\n      textColor: [{ property: 'color' }],\n      textLineHeight: { property: 'line-height' },\n      textLetterSpacing: { property: 'letter-spacing' },\n      textShadow: {},\n      textAlign: {},\n      textTransform: {},\n      fontFamily: {},\n      fontStyle: {},\n      fontWeight: {},\n      borderWidth: {},\n      borderStyle: {},\n      borderColor: {},\n    },\n  }),\n  stretchMixin({ triggers: [{ attr: 'full-width', value: 'true' }] }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawText);\n","import { componentName, TextClass } from './TextClass';\n\ncustomElements.define(componentName, TextClass);\n\nexport { TextClass, componentName };\n"],"names":["componentName","_descope_ui_common_components_helpers__WEBPACK_IMPORTED_MODULE_1__","xE","host","label","slottedIcon","selector","loadingIndicatorStyles","ButtonClass","_descope_ui_common_utils__WEBPACK_IMPORTED_MODULE_0__","Zz","_descope_ui_common_components_mixins__WEBPACK_IMPORTED_MODULE_2__","DM","triggers","attr","value","RF","mappings","hostWidth","property","hostMaxWidth","hostHeight","hostDirection","fontSize","fontFamily","fontWeight","cursor","backgroundColor","outlineOffset","outlineColor","outlineStyle","outlineWidth","borderRadius","borderColor","borderStyle","borderWidth","verticalPadding","horizontalPadding","fallback","labelTextColor","iconColor","_descope_ui_descope_icon_class__WEBPACK_IMPORTED_MODULE_3__","S","cssVarList","fill","labelTextDecoration","labelSpacing","textAlign","iconSize","_clickableMixin__WEBPACK_IMPORTED_MODULE_4__","G","VO","tQ","tz","slots","wrappedEleName","style","excludeAttrsSync","color","clickableMixin","superclass","isLoading","this","getAttribute","click","super","customElements","define","_ButtonClass__WEBPACK_IMPORTED_MODULE_0__","T","J","IconClass","_descope_ui_common_utils__WEBPACK_IMPORTED_MODULE_3__","_descope_ui_common_components_mixins__WEBPACK_IMPORTED_MODULE_0__","_descope_ui_descope_image_class__WEBPACK_IMPORTED_MODULE_2__","q","height","width","_IconClass__WEBPACK_IMPORTED_MODULE_1__","_descope_ui_common_components_helpers__WEBPACK_IMPORTED_MODULE_3__","srcAttrs","RawImage","_descope_ui_common_base_classes__WEBPACK_IMPORTED_MODULE_1__","qu","baseSelector","observedAttributes","constructor","attachShadow","mode","innerHTML","fz","init","toggleVisibility","getSrc","onThemeChange","renderImage","isVisible","classList","remove","add","altText","legacySrc","themeSrc","currentThemeName","updateFillColor","node","querySelectorAll","forEach","ele","setAttribute","ImageClass","_helpers__WEBPACK_IMPORTED_MODULE_4__","m","then","res","appendChild","shouldRender","src","srcVal","attributeChangedCallback","attrName","oldValue","newValue","_descope_ui_common_utils__WEBPACK_IMPORTED_MODULE_2__","createSvgEle","text","clean","dompurify__WEBPACK_IMPORTED_MODULE_0__","A","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","_ImageClass__WEBPACK_IMPORTED_MODULE_0__","componentsHelpers","NO_ACTION","ACTIONS","copy","defaultText","download","BUTTON_SUFFIXES","BUTTON_ATTRS","Object","keys","flatMap","action","map","suffix","RawRecoveryCodes","baseClasses","showError","initialized","list","shadowRoot","copyIcon","downloadIcon","iconWrapper","errorMessageEle","buttonsRow","variant","boolAttr","name","hasAttribute","isRequired","isReadOnly","errorMessage","codesText","String","data","rc","join","addEventListener","onCopy","bind","onDownload","EA","includeAttrs","renderButtons","isDownloadEnabled","buttons","buildButton","push","replaceChildren","button","iconSrc","icon","iconDark","createTextNode","navigator","clipboard","writeText","showActionFeedback","recordAction","blob","Blob","type","url","URL","createObjectURL","anchor","href","revokeObjectURL","dispatchEvent","Event","bubbles","checkValidity","syncValidityUI","iconEle","doneTitle","feedbackTimer","clearTimeout","originalIcon","originalTitle","setTimeout","reportValidity","valid","toggleAttribute","textContent","includes","RecoveryCodesClass","utils","componentsMixins","hostMinWidth","TextClass","s","iconGap","iconStackGap","buttonsGap","sectionsGap","bulletGap","errorBorderColor","errorMessageColor","errorMessageFontSize","errorMessageFontWeight","errorMessageFontFamily","boxBorderRadius","errorBorderWidth","boxBorderStyle","componentNameOverride","t$","itemRenderer","_","ref","rerenderAttrsList","targetSelector","_descope_ui_common_components_helpers__WEBPACK_IMPORTED_MODULE_2__","RawText","_descope_ui_common_base_classes__WEBPACK_IMPORTED_MODULE_3__","hideWhenEmpty","Ge","hasChildren","childNodes","length","display","_descope_ui_common_utils__WEBPACK_IMPORTED_MODULE_1__","textColor","textLineHeight","textLetterSpacing","textShadow","textTransform","fontStyle","_TextClass__WEBPACK_IMPORTED_MODULE_0__"],"sourceRoot":""}

package/dist/umd/descope-timer-button.js

@@ -1,339 +1,2 @@
-/*! For license information please see descope-timer-button.js.LICENSE.txt */
-(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[743,1202,2250,5087,6724],{44006(t){t.exports="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMWVtIiBoZWlnaHQ9IjFlbSIgdmlld0JveD0iMCAwIDEwNCAxMDQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+IDxwYXRoIGQ9Ik01MC4zMzM0IDAuMzMzMjUyQzIyLjgzMzQgMC4zMzMyNTIgMC4zMzMzNzQgMjIuODMzMyAwLjMzMzM3NCA1MC4zMzMzQzAuMzMzMzc0IDc3LjgzMzMgMjIuODMzNCAxMDAuMzMzIDUwLjMzMzQgMTAwLjMzM0M3Ny44MzM0IDEwMC4zMzMgMTAwLjMzMyA3Ny44MzMzIDEwMC4zMzMgNTAuMzMzM0MxMDAuMzMzIDIyLjgzMzMgNzcuODMzNCAwLjMzMzI1MiA1MC4zMzM0IDAuMzMzMjUyWk01MC4zMzM0IDg3LjgzMzNDMjkuNzA4NCA4Ny44MzMzIDEyLjgzMzQgNzAuOTU4MyAxMi44MzM0IDUwLjMzMzNDMTIuODMzNCAyOS43MDgzIDI5LjcwODQgMTIuODMzMyA1MC4zMzM0IDEyLjgzMzNDNzAuOTU4NCAxMi44MzMzIDg3LjgzMzQgMjkuNzA4MyA4Ny44MzM0IDUwLjMzMzNDODcuODMzNCA3MC45NTgzIDcwLjk1ODQgODcuODMzMyA1MC4zMzM0IDg3LjgzMzNaIiBmaWxsPSIjMTgxQTFDIi8+IDxwYXRoIGQ9Ik01MC4zMzI4IDE5LjA4MzNINDQuMDgyOFY1Ni41ODMySDc1LjMzMjhWNTAuMzMzMkg1MC4zMzI4VjE5LjA4MzNaIiBmaWxsPSIjMTgxQTFDIi8+IDwvc3ZnPiA="},19624(t,e,i){"use strict";i.d(e,{J:()=>m,T:()=>l});var r=i(63200),o=i(25964),n=i(88961),s=i(98538),a=i(10767);const l=(0,o.xE)("button"),{host:d,label:c,slottedIcon:h}={host:{selector:()=>":host"},label:{selector:"::part(label)"},slottedIcon:{selector:()=>"::slotted(descope-icon)"}};let u;const m=(0,r.Zz)((0,n.DM)({triggers:[{attr:"full-width",value:"true"}]}),(0,n.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:s.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"}]}}),a.G,n.VO,n.tQ)((0,n.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(${m.cssVarList.outlineWidth}) + var(${m.cssVarList.outlineOffset}));\n\t\t\t}\n      :host([full-width="true"]) {\n        width: var(${m.cssVarList.hostWidth});\n      }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${m.cssVarList.hostHeight}) - var(${m.cssVarList.outlineWidth}) - var(${m.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square="true"]:not([full-width="true"]) {\n\t\t\t\twidth: calc(var(${m.cssVarList.hostWidth}) - var(${m.cssVarList.outlineWidth}) - var(${m.cssVarList.outlineOffset}));\n        padding: 0;\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex","class","style"],componentName:l})),{color:p,fontSize:b}=m.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(${p});\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,i){"use strict";i.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,i){"use strict";i.r(e),i.d(e,{ButtonClass:()=>r.J,componentName:()=>r.T});var r=i(19624);i(83799),customElements.define(r.T,r.J)},98538(t,e,i){"use strict";i.d(e,{S:()=>l,T:()=>a});var r=i(88961),o=i(25964),n=i(8512),s=i(63200);const a=(0,o.xE)("icon"),l=(0,s.Zz)((0,r.RF)({mappings:{fill:[{},{property:n.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:a}))},56737(t,e,i){"use strict";i.r(e),i.d(e,{IconClass:()=>r.S,componentName:()=>r.T}),i(53455);var r=i(98538);customElements.define(r.T,r.S)},8512(t,e,i){"use strict";i.d(e,{T:()=>l,q:()=>h});var r=i(88961),o=i(72270),n=i(63200),s=i(25964),a=i(18782);const l=(0,s.xE)("image"),d=["src","src-dark"];class c extends((0,o.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,s.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,a.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,i){super.attributeChangedCallback?.(t,e,i),e!==i&&this.shouldRender(t)&&this.renderImage()}}const h=(0,n.Zz)((0,r.RF)({mappings:{fill:{},height:{selector:()=>":host"},width:{selector:()=>":host"}}}),r.VO,r.tQ)(c)},18782(t,e,i){"use strict";i.d(e,{m:()=>n});var r=i(25414);const o=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")},n=async(t,e)=>{try{let i;if((t=>t.startsWith("data:image/svg+xml;base64,"))(t)){const e=atob(t.slice(26));i=o(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();i=o(r)}else i=((t,e)=>{const i=document.createElement("img");return i.setAttribute("src",t),i.setAttribute("alt",e),i})(t,e);return i.style.setProperty("max-width","100%"),i.style.setProperty("max-height","100%"),i}catch{return null}}},53455(t,e,i){"use strict";i.r(e),i.d(e,{ImageClass:()=>r.q,componentName:()=>r.T});var r=i(8512);customElements.define(r.T,r.q)},60096(t,e,i){"use strict";i.r(e),i.d(e,{TimerButtonClass:()=>z,componentName:()=>d});var r=i(88961),o=i(72270),n=i(63200),s=i(25964),a=i(64388),l=i(19624);const d=(0,s.xE)("timer-button"),c=["button-variant","button-mode","size","text-align","full-width"],h={"button-variant":"variant","button-mode":"mode"},u=["timer-seconds","timer-hide-icon","timer-paused","size","text-align","full-width"],m={"timer-seconds":"seconds","timer-hide-icon":"hide-icon","timer-paused":"paused"},p=(0,o.qu)({componentName:d,baseSelector:":host > div"}),{host:b,nestedTimer:g,nestedButton:v,timerInsideNotReversed:y,timerInsideReversed:f}={host:{selector:()=>":host"},nestedTimer:{selector:()=>':host([timer-inside="true"]) .timer'},nestedButton:{selector:()=>':host([timer-inside="true"]) .button'},timerInsideNotReversed:{selector:()=>':host([timer-inside="true"]:not([timer-position="end"])) .timer'},timerInsideReversed:{selector:()=>':host([timer-inside="true"][timer-position="end"]) .timer'}},z=(0,n.Zz)((0,r.RF)({mappings:{gap:{},flexDirection:{},hostWidth:{...b,property:"width"},hostDirection:{...b,property:"direction"},timerTextColor:{...g,property:a.A.cssVarList.textColor},timerIconColor:{...g,property:a.A.cssVarList.iconColor},timerHostWidth:{...g,property:a.A.cssVarList.hostWidth},buttonLabelSpacing:{...v,property:l.J.cssVarList.labelSpacing},timerInsideGapEnd:{...y,property:"margin-inline-end"},timerInsideGapStart:{...f,property:"margin-inline-start"}}}),r.VO,r.tQ)(class extends p{constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n      <div class="wrapper">\n        <descope-timer class="timer"></descope-timer>\n        <descope-button class="button" disabled="true">\n          <slot></slot>\n        </descope-button>\n      </div>\n\t\t',(0,s.fz)('\n      :host {\n        display: inline-flex;\n      }\n      .wrapper {\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        width: 100%;\n      }\n      /* allow timer to grow along the main axis in the wrapper flex container */\n      :host(:not([timer-inside="true"])) .timer {\n        flex: 1;\n      }\n      :host([timer-inside="true"]) .timer {\n        flex: 0 0 auto;\n      }\n    ',this),this.wrapper=this.shadowRoot.querySelector(".wrapper"),this.timer=this.shadowRoot.querySelector(".timer"),this.button=this.shadowRoot.querySelector(".button"),this.forwardingSlot=this.shadowRoot.querySelector(".button slot"),this.timer.addEventListener("timer-started",()=>this.onTimerStarted()),this.timer.addEventListener("timer-ended",()=>this.onTimerEnded()),this.syncTimerPlacement(),this.button.addEventListener("click",this.onClick.bind(this))}static get observedAttributes(){return[...super.observedAttributes||[],"timer-inside","timer-position"]}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i),"timer-inside"!==t&&"timer-position"!==t||this.syncTimerPlacement()}get#t(){return"true"===this.getAttribute("timer-inside")}get#e(){return"end"===this.getAttribute("timer-position")}syncTimerPlacement(){this.#t?this.#i(this.#e):this.#r()}#i(t){t?this.timer.previousSibling!==this.forwardingSlot&&this.button.appendChild(this.timer):this.timer.nextSibling!==this.forwardingSlot&&this.button.insertBefore(this.timer,this.forwardingSlot)}#r(){this.timer.parentElement!==this.wrapper&&this.wrapper.insertBefore(this.timer,this.button)}set onclick(t){this.button.onclick=t}init(){super.init?.(),(0,s.EA)(this,this.button,{includeAttrs:c,mapAttrs:h}),(0,s.EA)(this,this.timer,{includeAttrs:u,mapAttrs:m}),this.button.shadowRoot.querySelector("vaadin-button").setAttribute("disabled","true")}onTimerStarted(){this.toggleButtonDisable(!0)}onTimerEnded(){this.toggleButtonDisable(!1)}onClick(){this.timer.reset()}toggleButtonDisable(t){setTimeout(()=>{t?this.button.setAttribute("disabled","true"):this.button.removeAttribute("disabled")})}});i(30576),i(61479),customElements.define(d,z)},64388(t,e,i){"use strict";i.d(e,{A:()=>v,T:()=>h});var r=i(88961),o=i(72270),n=i(63200),s=i(25964),a=i(44006),l=i.n(a),d=i(98538),c=i(62054);const h=(0,s.xE)("timer"),u=["seconds","hide-icon","paused"],m=(0,o.qu)({componentName:h,baseSelector:":host > .wrapper"}),{host:p,icon:b,timer:g}={host:{selector:()=>":host"},icon:{selector:()=>".icon"},timer:{selector:()=>".timer"}},v=(0,n.Zz)((0,r.RF)({mappings:{fontSize:{},iconSize:[{...b,property:"width"},{...b,property:"height"}],fontFamily:{},minHeight:{},fontWeight:{...g},lineHeight:{...g},textColor:{...g,property:"color"},gap:{},textAlign:{property:"justify-content"},hostWidth:{...p,property:"width"},hostDirection:{...p,property:"direction"},iconColor:{...b,property:d.S.cssVarList.fill}}}),r.VO,r.tQ)(class extends m{#o=0;#n;static get observedAttributes(){return u.concat(m.observedAttributes||[])}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML=`\n      <div class="wrapper">\n        <descope-icon src="${l()}" class="icon"></descope-icon>\n        <div class="timer"></div>\n      </div>\n\t\t`,(0,s.fz)("\n      :host {\n        display: inline-flex;\n        user-select: none;\n        -webkit-user-select: none;\n      }\n      .wrapper {\n        display: flex;\n        align-items: center;\n        flex-direction: row;\n        width: 100%;\n      }\n      .hidden {\n        display: none;\n      }\n    ",this),this.icon=this.shadowRoot.querySelector(".icon"),this.timer=this.shadowRoot.querySelector(".timer")}get seconds(){const t=this.getAttribute("seconds"),e=1e3*parseInt(t||0,10);return Math.max(0,e)}get isPaused(){return"true"===this.getAttribute("paused")}init(){super.init?.(),this.#o=this.seconds}startInterval(){this.#o?this.#n=setInterval(()=>{this.#s(),this.#o||this.stop(),this.#a(this.#o)},1e3):this.stop()}stopInterval(){clearInterval(this.#n)}#s(){this.#o=this.#o-1e3}reset(){this.#o=this.seconds,this.#a(this.#o),this.isPaused||(this.dispatchEvent(new CustomEvent("timer-started",{bubbles:!0})),this.startInterval())}stop(){this.stopInterval(),this.#o=0,this.#a(this.#o),this.dispatchEvent(new CustomEvent("timer-ended",{bubbles:!0}))}pause(){this.setAttribute("paused","true"),this.stopInterval()}resume(){this.removeAttribute("paused"),this.startInterval()}#a(t){this.timer.textContent=(0,c.f)(t)}#l(t){this.icon.classList.toggle("hidden",t)}#d(t){setTimeout(()=>{t?this.pause():this.#n||this.resume()})}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i),i!==e&&("seconds"===t&&this.reset(),"hide-icon"===t&&this.#l("true"===i),"paused"===t&&this.#d("true"===i))}})},62054(t,e,i){"use strict";i.d(e,{f:()=>o});const r=(t,e=2)=>String(t).padStart(e,"0"),o=(t=0)=>{const e=Math.floor(t/1e3),i=Math.floor(e/3600),o=Math.floor(e%3600/60),n=e%60;return[...i?[r(i)]:[],r(o),r(n)].join(":")}},61479(t,e,i){"use strict";i.r(e),i.d(e,{TimerClass:()=>r.A,componentName:()=>r.T});var r=i(64388);i(56737),customElements.define(r.T,r.A)},89389(t,e,i){"use strict";i.d(e,{$:()=>p});var r=i(13256),o=i(55774),n=i(82901),s=i(72562),a=i(81488),l=i(87550);const d=i(51450).AH`
-  :host {
-    display: inline-block;
-    position: relative;
-    outline: none;
-    white-space: nowrap;
-    -webkit-user-select: none;
-    -moz-user-select: none;
-    user-select: none;
-  }
-
-  :host([hidden]) {
-    display: none !important;
-  }
-
-  /* Aligns the button with form fields when placed on the same line.
-  Note, to make it work, the form fields should have the same "::before" pseudo-element. */
-  .vaadin-button-container::before {
-    content: '\\2003';
-    display: inline-block;
-    width: 0;
-    max-height: 100%;
-  }
-
-  .vaadin-button-container {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    text-align: center;
-    width: 100%;
-    height: 100%;
-    min-height: inherit;
-    text-shadow: inherit;
-  }
-
-  [part='prefix'],
-  [part='suffix'] {
-    flex: none;
-  }
-
-  [part='label'] {
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-  }
-
-  @media (forced-colors: active) {
-    :host {
-      outline: 1px solid;
-      outline-offset: -1px;
-    }
-
-    :host([focused]) {
-      outline-width: 2px;
-    }
-
-    :host([disabled]) {
-      outline-color: GrayText;
-    }
-  }
-`;var c=i(84467),h=i(53149),u=i(36176);const m=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 p extends(m((0,s.q)((0,l.cp)((0,o.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>
-    </span>
-    <span part="label">
-      <slot></slot>
-    </span>
-    <span part="suffix" aria-hidden="true">
-      <slot name="suffix"></slot>
-    </span>
-  </div>
-  <slot name="tooltip"></slot>
-`}ready(){super.ready(),this._tooltipController=new a.I(this),this.addController(this._tooltipController)}}(0,n.X)(p)},93555(t,e,i){"use strict";i.d(e,{x:()=>o}),i(64511),i(42068),i(9433),i(3241),i(83315);var r=i(87550);const o=r.AH`
-  :host {
-    /* Sizing */
-    --lumo-button-size: var(--lumo-size-m);
-    min-width: var(--vaadin-button-min-width, calc(var(--_button-size) * 2));
-    height: var(--_button-size);
-    padding: var(--vaadin-button-padding, 0 calc(var(--_button-size) / 3 + var(--lumo-border-radius-m) / 2));
-    margin: var(--vaadin-button-margin, var(--lumo-space-xs) 0);
-    box-sizing: border-box;
-    /* Style */
-    font-family: var(--lumo-font-family);
-    font-size: var(--vaadin-button-font-size, var(--lumo-font-size-m));
-    font-weight: var(--vaadin-button-font-weight, 500);
-    color: var(--_lumo-button-text-color);
-    background: var(--_lumo-button-background);
-    border: var(--vaadin-button-border, none);
-    border-radius: var(--vaadin-button-border-radius, var(--lumo-border-radius-m));
-    cursor: var(--lumo-clickable-cursor);
-    -webkit-tap-highlight-color: transparent;
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale;
-    flex-shrink: 0;
-    --_button-size: var(--vaadin-button-height, var(--lumo-button-size));
-    --_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-primary-color-50pct));
-    --_focus-ring-width: var(--vaadin-focus-ring-width, 2px);
-    /* Used by notification */
-    --_lumo-button-background: var(--vaadin-button-background, var(--lumo-contrast-5pct));
-    --_lumo-button-text-color: var(--vaadin-button-text-color, var(--lumo-primary-text-color));
-    --_lumo-button-primary-background: var(--vaadin-button-primary-background, var(--lumo-primary-color));
-    --_lumo-button-primary-text-color: var(--vaadin-button-primary-text-color, var(--lumo-primary-contrast-color));
-  }
-
-  /* Set only for the internal parts so we don't affect the host vertical alignment */
-  [part='label'],
-  [part='prefix'],
-  [part='suffix'] {
-    line-height: var(--lumo-line-height-xs);
-  }
-
-  [part='label'] {
-    padding: calc(var(--lumo-button-size) / 6) 0;
-  }
-
-  :host([theme~='small']) {
-    font-size: var(--lumo-font-size-s);
-    --lumo-button-size: var(--lumo-size-s);
-  }
-
-  :host([theme~='large']) {
-    font-size: var(--lumo-font-size-l);
-    --lumo-button-size: var(--lumo-size-l);
-  }
-
-  /* For interaction states */
-  :host::before,
-  :host::after {
-    content: '';
-    /* We rely on the host always being relative */
-    position: absolute;
-    z-index: 1;
-    inset: 0;
-    background-color: currentColor;
-    border-radius: inherit;
-    opacity: 0;
-    pointer-events: none;
-  }
-
-  /* Hover */
-
-  @media (any-hover: hover) {
-    :host(:hover)::before {
-      opacity: 0.02;
-    }
-  }
-
-  /* Active */
-
-  :host::after {
-    transition: opacity 1.4s, transform 0.1s;
-    filter: blur(8px);
-  }
-
-  :host([active])::before {
-    opacity: 0.05;
-    transition-duration: 0s;
-  }
-
-  :host([active])::after {
-    opacity: 0.1;
-    transition-duration: 0s, 0s;
-    transform: scale(0);
-  }
-
-  /* Keyboard focus */
-
-  :host([focus-ring]) {
-    box-shadow: 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);
-  }
-
-  :host([theme~='primary'][focus-ring]) {
-    box-shadow: 0 0 0 1px var(--lumo-base-color), 0 0 0 3px var(--lumo-primary-color-50pct);
-  }
-
-  /* Types (primary, tertiary, tertiary-inline */
-
-  :host([theme~='tertiary']),
-  :host([theme~='tertiary-inline']) {
-    --_background: transparent !important;
-    background: var(--vaadin-button-tertiary-background, var(--_background));
-    min-width: 0;
-  }
-
-  :host([theme~='tertiary']) {
-    border: var(--vaadin-button-tertiary-border, none);
-    color: var(--vaadin-button-tertiary-text-color, var(--lumo-primary-text-color));
-    font-weight: var(--vaadin-button-tertiary-font-weight, 500);
-    padding: var(--vaadin-button-tertiary-padding, 0 calc(var(--_button-size) / 6));
-  }
-
-  :host([theme~='tertiary-inline'])::before {
-    display: none;
-  }
-
-  :host([theme~='tertiary-inline']) {
-    margin: 0;
-    height: auto;
-    padding: 0;
-    line-height: inherit;
-    font-size: inherit;
-  }
-
-  :host([theme~='tertiary-inline']) [part='label'] {
-    padding: 0;
-    overflow: visible;
-    line-height: inherit;
-  }
-
-  :host([theme~='primary']) {
-    background: var(--_lumo-button-primary-background);
-    border: var(--vaadin-button-primary-border, none);
-    color: var(--_lumo-button-primary-text-color);
-    font-weight: var(--vaadin-button-primary-font-weight, 600);
-    min-width: calc(var(--lumo-button-size) * 2.5);
-  }
-
-  :host([theme~='primary'])::before {
-    background-color: black;
-  }
-
-  @media (any-hover: hover) {
-    :host([theme~='primary']:hover)::before {
-      opacity: 0.05;
-    }
-  }
-
-  :host([theme~='primary'][active])::before {
-    opacity: 0.1;
-  }
-
-  :host([theme~='primary'][active])::after {
-    opacity: 0.2;
-  }
-
-  /* Colors (success, error, contrast) */
-
-  :host([theme~='success']) {
-    color: var(--lumo-success-text-color);
-  }
-
-  :host([theme~='success'][theme~='primary']) {
-    background-color: var(--lumo-success-color);
-    color: var(--lumo-success-contrast-color);
-  }
-
-  :host([theme~='error']) {
-    color: var(--lumo-error-text-color);
-  }
-
-  :host([theme~='error'][theme~='primary']) {
-    background-color: var(--lumo-error-color);
-    color: var(--lumo-error-contrast-color);
-  }
-
-  :host([theme~='contrast']) {
-    color: var(--lumo-contrast);
-  }
-
-  :host([theme~='contrast'][theme~='primary']) {
-    background-color: var(--lumo-contrast);
-    color: var(--lumo-base-color);
-  }
-
-  /* Disabled state. Keep selectors after other color variants. */
-
-  :host([disabled]) {
-    pointer-events: none;
-    color: var(--lumo-disabled-text-color);
-  }
-
-  :host([theme~='primary'][disabled]) {
-    background-color: var(--lumo-contrast-30pct);
-    color: var(--lumo-base-color);
-  }
-
-  :host([theme~='primary'][disabled]) [part] {
-    opacity: 0.7;
-  }
-
-  /* Icons */
-
-  [part] ::slotted(vaadin-icon) {
-    display: inline-block;
-    width: var(--lumo-icon-size-m);
-    height: var(--lumo-icon-size-m);
-  }
-
-  /* Vaadin icons are based on a 16x16 grid (unlike Lumo and Material icons with 24x24), so they look too big by default */
-  [part] ::slotted(vaadin-icon[icon^='vaadin:']) {
-    padding: 0.25em;
-    box-sizing: border-box !important;
-  }
-
-  [part='prefix'] {
-    margin-left: -0.25em;
-    margin-right: 0.25em;
-  }
-
-  [part='suffix'] {
-    margin-left: 0.25em;
-    margin-right: -0.25em;
-  }
-
-  /* Icon-only */
-
-  :host([theme~='icon']:not([theme~='tertiary-inline'])) {
-    min-width: var(--lumo-button-size);
-    padding-left: calc(var(--lumo-button-size) / 4);
-    padding-right: calc(var(--lumo-button-size) / 4);
-  }
-
-  :host([theme~='icon']) [part='prefix'],
-  :host([theme~='icon']) [part='suffix'] {
-    margin-left: 0;
-    margin-right: 0;
-  }
-
-  /* RTL specific styles */
-
-  :host([dir='rtl']) [part='prefix'] {
-    margin-left: 0.25em;
-    margin-right: -0.25em;
-  }
-
-  :host([dir='rtl']) [part='suffix'] {
-    margin-left: -0.25em;
-    margin-right: 0.25em;
-  }
-
-  :host([dir='rtl'][theme~='icon']) [part='prefix'],
-  :host([dir='rtl'][theme~='icon']) [part='suffix'] {
-    margin-left: 0;
-    margin-right: 0;
-  }
-`;(0,r.SF)("vaadin-button",o,{moduleId:"lumo-button"})},83799(t,e,i){"use strict";i(93555),i(89389)}}]);
+(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[743,1202,2250,6724],{44006(t){t.exports="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMWVtIiBoZWlnaHQ9IjFlbSIgdmlld0JveD0iMCAwIDEwNCAxMDQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+IDxwYXRoIGQ9Ik01MC4zMzM0IDAuMzMzMjUyQzIyLjgzMzQgMC4zMzMyNTIgMC4zMzMzNzQgMjIuODMzMyAwLjMzMzM3NCA1MC4zMzMzQzAuMzMzMzc0IDc3LjgzMzMgMjIuODMzNCAxMDAuMzMzIDUwLjMzMzQgMTAwLjMzM0M3Ny44MzM0IDEwMC4zMzMgMTAwLjMzMyA3Ny44MzMzIDEwMC4zMzMgNTAuMzMzM0MxMDAuMzMzIDIyLjgzMzMgNzcuODMzNCAwLjMzMzI1MiA1MC4zMzM0IDAuMzMzMjUyWk01MC4zMzM0IDg3LjgzMzNDMjkuNzA4NCA4Ny44MzMzIDEyLjgzMzQgNzAuOTU4MyAxMi44MzM0IDUwLjMzMzNDMTIuODMzNCAyOS43MDgzIDI5LjcwODQgMTIuODMzMyA1MC4zMzM0IDEyLjgzMzNDNzAuOTU4NCAxMi44MzMzIDg3LjgzMzQgMjkuNzA4MyA4Ny44MzM0IDUwLjMzMzNDODcuODMzNCA3MC45NTgzIDcwLjk1ODQgODcuODMzMyA1MC4zMzM0IDg3LjgzMzNaIiBmaWxsPSIjMTgxQTFDIi8+IDxwYXRoIGQ9Ik01MC4zMzI4IDE5LjA4MzNINDQuMDgyOFY1Ni41ODMySDc1LjMzMjhWNTAuMzMzMkg1MC4zMzI4VjE5LjA4MzNaIiBmaWxsPSIjMTgxQTFDIi8+IDwvc3ZnPiA="},19624(t,e,i){"use strict";i.d(e,{J:()=>p,T:()=>l});var s=i(63200),n=i(25964),r=i(88961),o=i(98538),a=i(10767);const l=(0,n.xE)("button"),{host:d,label:h,slottedIcon:c}={host:{selector:()=>":host"},label:{selector:"::part(label)"},slottedIcon:{selector:()=>"::slotted(descope-icon)"}};let u;const p=(0,s.Zz)((0,r.DM)({triggers:[{attr:"full-width",value:"true"}]}),(0,r.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:o.S.cssVarList.fill},labelTextDecoration:{...h,property:"text-decoration"},labelSpacing:{...h,property:"gap"},textAlign:{...h,property:"justify-content",fallback:"center"},iconSize:[{...c,property:"width"},{...c,property:"height"}]}}),a.G,r.VO,r.tQ)((0,r.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:g}=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(${g}) / 2));\n\t\tleft: calc(50% - (var(${g}) / 2));\n\t\tborder-width: calc(var(${g}) / 10);\n\t\twidth: var(${g});\n\t\theight: var(${g});\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,i){"use strict";i.d(e,{G:()=>s});const s=t=>class extends t{get isLoading(){return"true"===this.getAttribute("loading")}click(){this.isLoading||super.click()}}},30576(t,e,i){"use strict";i.r(e),i.d(e,{ButtonClass:()=>s.J,componentName:()=>s.T});var s=i(19624);i(83799),customElements.define(s.T,s.J)},98538(t,e,i){"use strict";i.d(e,{S:()=>l,T:()=>a});var s=i(88961),n=i(25964),r=i(8512),o=i(63200);const a=(0,n.xE)("icon"),l=(0,o.Zz)((0,s.RF)({mappings:{fill:[{},{property:r.q.cssVarList.fill}],height:{selector:()=>":host"},width:{selector:()=>":host"}}}),s.VO,s.tQ)((0,s.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:a}))},56737(t,e,i){"use strict";i.r(e),i.d(e,{IconClass:()=>s.S,componentName:()=>s.T}),i(53455);var s=i(98538);customElements.define(s.T,s.S)},8512(t,e,i){"use strict";i.d(e,{T:()=>l,q:()=>c});var s=i(88961),n=i(72270),r=i(63200),o=i(25964),a=i(18782);const l=(0,o.xE)("image"),d=["src","src-dark"];class h extends((0,n.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,o.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(${c.cssVarList.fill}, ${t.getAttribute("fill")||"''"})`)})}renderImage(){this.toggleVisibility(this.getSrc),(0,a.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,i){super.attributeChangedCallback?.(t,e,i),e!==i&&this.shouldRender(t)&&this.renderImage()}}const c=(0,r.Zz)((0,s.RF)({mappings:{fill:{},height:{selector:()=>":host"},width:{selector:()=>":host"}}}),s.VO,s.tQ)(h)},18782(t,e,i){"use strict";i.d(e,{m:()=>r});var s=i(25414);const n=t=>{const e=s.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")},r=async(t,e)=>{try{let i;if((t=>t.startsWith("data:image/svg+xml;base64,"))(t)){const e=atob(t.slice(26));i=n(e)}else if("svg"===(t=>{const e=t.match(/\.([0-9a-z]+)(?:[\\?#]|$)/i);return e?e[1]:null})(t)){const e=await fetch(t),s=await e.text();i=n(s)}else i=((t,e)=>{const i=document.createElement("img");return i.setAttribute("src",t),i.setAttribute("alt",e),i})(t,e);return i.style.setProperty("max-width","100%"),i.style.setProperty("max-height","100%"),i}catch{return null}}},53455(t,e,i){"use strict";i.r(e),i.d(e,{ImageClass:()=>s.q,componentName:()=>s.T});var s=i(8512);customElements.define(s.T,s.q)},60096(t,e,i){"use strict";i.r(e),i.d(e,{TimerButtonClass:()=>v,componentName:()=>d});var s=i(88961),n=i(72270),r=i(63200),o=i(25964),a=i(64388),l=i(19624);const d=(0,o.xE)("timer-button"),h=["button-variant","button-mode","size","text-align","full-width"],c={"button-variant":"variant","button-mode":"mode"},u=["timer-seconds","timer-hide-icon","timer-paused","size","text-align","full-width"],p={"timer-seconds":"seconds","timer-hide-icon":"hide-icon","timer-paused":"paused"},m=(0,n.qu)({componentName:d,baseSelector:":host > div"}),{host:g,nestedTimer:b,nestedButton:M,timerInsideNotReversed:z,timerInsideReversed:y}={host:{selector:()=>":host"},nestedTimer:{selector:()=>':host([timer-inside="true"]) .timer'},nestedButton:{selector:()=>':host([timer-inside="true"]) .button'},timerInsideNotReversed:{selector:()=>':host([timer-inside="true"]:not([timer-position="end"])) .timer'},timerInsideReversed:{selector:()=>':host([timer-inside="true"][timer-position="end"]) .timer'}},v=(0,r.Zz)((0,s.RF)({mappings:{gap:{},flexDirection:{},hostWidth:{...g,property:"width"},hostDirection:{...g,property:"direction"},timerTextColor:{...b,property:a.A.cssVarList.textColor},timerIconColor:{...b,property:a.A.cssVarList.iconColor},timerHostWidth:{...b,property:a.A.cssVarList.hostWidth},buttonLabelSpacing:{...M,property:l.J.cssVarList.labelSpacing},timerInsideGapEnd:{...z,property:"margin-inline-end"},timerInsideGapStart:{...y,property:"margin-inline-start"}}}),s.VO,s.tQ)(class extends m{constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n      <div class="wrapper">\n        <descope-timer class="timer"></descope-timer>\n        <descope-button class="button" disabled="true">\n          <slot></slot>\n        </descope-button>\n      </div>\n\t\t',(0,o.fz)('\n      :host {\n        display: inline-flex;\n      }\n      .wrapper {\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        width: 100%;\n      }\n      /* allow timer to grow along the main axis in the wrapper flex container */\n      :host(:not([timer-inside="true"])) .timer {\n        flex: 1;\n      }\n      :host([timer-inside="true"]) .timer {\n        flex: 0 0 auto;\n      }\n    ',this),this.wrapper=this.shadowRoot.querySelector(".wrapper"),this.timer=this.shadowRoot.querySelector(".timer"),this.button=this.shadowRoot.querySelector(".button"),this.forwardingSlot=this.shadowRoot.querySelector(".button slot"),this.timer.addEventListener("timer-started",()=>this.onTimerStarted()),this.timer.addEventListener("timer-ended",()=>this.onTimerEnded()),this.syncTimerPlacement(),this.button.addEventListener("click",this.onClick.bind(this))}static get observedAttributes(){return[...super.observedAttributes||[],"timer-inside","timer-position"]}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i),"timer-inside"!==t&&"timer-position"!==t||this.syncTimerPlacement()}get#t(){return"true"===this.getAttribute("timer-inside")}get#e(){return"end"===this.getAttribute("timer-position")}syncTimerPlacement(){this.#t?this.#i(this.#e):this.#s()}#i(t){t?this.timer.previousSibling!==this.forwardingSlot&&this.button.appendChild(this.timer):this.timer.nextSibling!==this.forwardingSlot&&this.button.insertBefore(this.timer,this.forwardingSlot)}#s(){this.timer.parentElement!==this.wrapper&&this.wrapper.insertBefore(this.timer,this.button)}set onclick(t){this.button.onclick=t}init(){super.init?.(),(0,o.EA)(this,this.button,{includeAttrs:h,mapAttrs:c}),(0,o.EA)(this,this.timer,{includeAttrs:u,mapAttrs:p}),this.button.shadowRoot.querySelector("vaadin-button").setAttribute("disabled","true")}onTimerStarted(){this.toggleButtonDisable(!0)}onTimerEnded(){this.toggleButtonDisable(!1)}onClick(){this.timer.reset()}toggleButtonDisable(t){setTimeout(()=>{t?this.button.setAttribute("disabled","true"):this.button.removeAttribute("disabled")})}});i(30576),i(61479),customElements.define(d,v)},64388(t,e,i){"use strict";i.d(e,{A:()=>M,T:()=>c});var s=i(88961),n=i(72270),r=i(63200),o=i(25964),a=i(44006),l=i.n(a),d=i(98538),h=i(62054);const c=(0,o.xE)("timer"),u=["seconds","hide-icon","paused"],p=(0,n.qu)({componentName:c,baseSelector:":host > .wrapper"}),{host:m,icon:g,timer:b}={host:{selector:()=>":host"},icon:{selector:()=>".icon"},timer:{selector:()=>".timer"}},M=(0,r.Zz)((0,s.RF)({mappings:{fontSize:{},iconSize:[{...g,property:"width"},{...g,property:"height"}],fontFamily:{},minHeight:{},fontWeight:{...b},lineHeight:{...b},textColor:{...b,property:"color"},gap:{},textAlign:{property:"justify-content"},hostWidth:{...m,property:"width"},hostDirection:{...m,property:"direction"},iconColor:{...g,property:d.S.cssVarList.fill}}}),s.VO,s.tQ)(class extends p{#n=0;#r;static get observedAttributes(){return u.concat(p.observedAttributes||[])}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML=`\n      <div class="wrapper">\n        <descope-icon src="${l()}" class="icon"></descope-icon>\n        <div class="timer"></div>\n      </div>\n\t\t`,(0,o.fz)("\n      :host {\n        display: inline-flex;\n        user-select: none;\n        -webkit-user-select: none;\n      }\n      .wrapper {\n        display: flex;\n        align-items: center;\n        flex-direction: row;\n        width: 100%;\n      }\n      .hidden {\n        display: none;\n      }\n    ",this),this.icon=this.shadowRoot.querySelector(".icon"),this.timer=this.shadowRoot.querySelector(".timer")}get seconds(){const t=this.getAttribute("seconds"),e=1e3*parseInt(t||0,10);return Math.max(0,e)}get isPaused(){return"true"===this.getAttribute("paused")}init(){super.init?.(),this.#n=this.seconds}startInterval(){this.#n?this.#r=setInterval(()=>{this.#o(),this.#n||this.stop(),this.#a(this.#n)},1e3):this.stop()}stopInterval(){clearInterval(this.#r)}#o(){this.#n=this.#n-1e3}reset(){this.#n=this.seconds,this.#a(this.#n),this.isPaused||(this.dispatchEvent(new CustomEvent("timer-started",{bubbles:!0})),this.startInterval())}stop(){this.stopInterval(),this.#n=0,this.#a(this.#n),this.dispatchEvent(new CustomEvent("timer-ended",{bubbles:!0}))}pause(){this.setAttribute("paused","true"),this.stopInterval()}resume(){this.removeAttribute("paused"),this.startInterval()}#a(t){this.timer.textContent=(0,h.f)(t)}#l(t){this.icon.classList.toggle("hidden",t)}#d(t){setTimeout(()=>{t?this.pause():this.#r||this.resume()})}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i),i!==e&&("seconds"===t&&this.reset(),"hide-icon"===t&&this.#l("true"===i),"paused"===t&&this.#d("true"===i))}})},62054(t,e,i){"use strict";i.d(e,{f:()=>n});const s=(t,e=2)=>String(t).padStart(e,"0"),n=(t=0)=>{const e=Math.floor(t/1e3),i=Math.floor(e/3600),n=Math.floor(e%3600/60),r=e%60;return[...i?[s(i)]:[],s(n),s(r)].join(":")}},61479(t,e,i){"use strict";i.r(e),i.d(e,{TimerClass:()=>s.A,componentName:()=>s.T});var s=i(64388);i(56737),customElements.define(s.T,s.A)}}]);
 //# sourceMappingURL=descope-timer-button.js.map