@descope/web-components-ui 1.32.0 → 1.33.0

package/dist/umd/mapping-fields-descope-saml-group-mappings-index-js.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mapping-fields-descope-saml-group-mappings-index-js.js","mappings":"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","sources":["webpack://@descope/web-components-ui/../components/descope-text/src/component/TextClass.js","webpack://@descope/web-components-ui/../components/descope-text/src/component/index.js","webpack://@descope/web-components-ui/./src/baseClasses/createBaseInputClass.js","webpack://@descope/web-components-ui/./src/components/descope-button/ButtonClass.js","webpack://@descope/web-components-ui/./src/components/descope-button/clickableMixin.js","webpack://@descope/web-components-ui/./src/components/descope-button/index.js","webpack://@descope/web-components-ui/./src/components/descope-icon/IconClass.js","webpack://@descope/web-components-ui/./src/components/descope-icon/helpers.js","webpack://@descope/web-components-ui/./src/components/descope-text-field/TextFieldClass.js","webpack://@descope/web-components-ui/./src/components/descope-text-field/index.js","webpack://@descope/web-components-ui/./src/components/descope-text-field/textFieldMappings.js","webpack://@descope/web-components-ui/./src/components/mapping-fields/descope-mappings-field/descope-mapping-item/MappingItem.js","webpack://@descope/web-components-ui/./src/components/mapping-fields/descope-mappings-field/descope-mapping-item/index.js","webpack://@descope/web-components-ui/./src/components/mapping-fields/descope-mappings-field/descope-mappings-field-internal/MappingsFieldInternal.js","webpack://@descope/web-components-ui/./src/components/mapping-fields/descope-mappings-field/descope-mappings-field-internal/index.js","webpack://@descope/web-components-ui/./src/components/mapping-fields/descope-mappings-field/MappingsFieldClass.js","webpack://@descope/web-components-ui/./src/components/mapping-fields/descope-mappings-field/index.js","webpack://@descope/web-components-ui/./src/components/mapping-fields/descope-saml-group-mappings/descope-saml-group-mappings-internal/SamlGroupMappingsInternal.js","webpack://@descope/web-components-ui/./src/components/mapping-fields/descope-saml-group-mappings/descope-saml-group-mappings-internal/index.js","webpack://@descope/web-components-ui/./src/components/mapping-fields/descope-saml-group-mappings/SamlGroupMappingsClass.js","webpack://@descope/web-components-ui/./src/components/mapping-fields/descope-saml-group-mappings/index.js","webpack://@descope/web-components-ui/./src/helpers/themeHelpers/resetHelpers.js"],"sourcesContent":["import {\n  createStyleMixin,\n  draggableMixin,\n  componentNameValidationMixin,\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      :host {\n        display: inline-block;\n        line-height: 1em;\n      }\n      :host > slot {\n        width: 100%;\n        display: inline-block;\n      }\n    `, this);\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\nexport const TextClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: { selector: () => ':host', property: 'width' },\n      hostDirection: { selector: () => ':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  draggableMixin,\n  componentNameValidationMixin,\n)(RawText);\n","import { componentName, TextClass } from './TextClass';\n\ncustomElements.define(componentName, TextClass);\n\nexport { TextClass, componentName };\n","import { compose } from '../helpers';\nimport {\n  changeMixin,\n  inputEventsDispatchingMixin,\n  inputValidationMixin,\n  normalizeBooleanAttributesMixin,\n} from '../mixins';\nimport { createBaseClass } from './createBaseClass';\n\nexport const createBaseInputClass = (...args) =>\n  compose(\n    inputValidationMixin,\n    changeMixin,\n    normalizeBooleanAttributesMixin,\n    inputEventsDispatchingMixin\n  )(createBaseClass(...args));\n","import { compose } from '../../helpers';\nimport { getComponentName } from '../../helpers/componentHelpers';\nimport {\n  createStyleMixin,\n  draggableMixin,\n  createProxy,\n  componentNameValidationMixin,\n} from '../../mixins';\nimport { IconClass } from '../descope-icon/IconClass';\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  createStyleMixin({\n    mappings: {\n      hostWidth: { property: 'width' },\n      hostHeight: { property: 'height' },\n      hostDirection: { ...host, property: 'direction' },\n      fontSize: {},\n      fontFamily: {},\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: [{ property: 'padding-top' }, { property: 'padding-bottom' }],\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'],\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 '@vaadin/button';\nimport { componentName, ButtonClass } from './ButtonClass';\n\ncustomElements.define(componentName, ButtonClass);\n\nexport { ButtonClass, componentName };\n","/* eslint-disable no-use-before-define */\nimport { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../mixins';\nimport { createBaseClass } from '../../baseClasses/createBaseClass';\nimport { compose } from '../../helpers';\nimport { getComponentName } from '../../helpers/componentHelpers';\nimport { createIcon } from './helpers';\nimport { injectStyle } from '@descope-ui/common/components-helpers';\n\nexport const componentName = getComponentName('icon');\n\nclass RawIcon extends createBaseClass({ componentName, baseSelector: 'slot' }) {\n  static get observedAttributes() {\n    return ['src'];\n  }\n\n  #icon;\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 > slot {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t}\n  `,\n      this\n    );\n  }\n\n  init() {\n    super.init?.();\n    this.toggleVisibility(this.src);\n  }\n\n  toggleVisibility(isVisible) {\n    this.style.display = isVisible ? '' : 'none';\n  }\n\n  get src() {\n    return this.getAttribute('src');\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  // eslint-disable-next-line class-methods-use-this\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(${IconClass.cssVarList.fill}, ${ele.getAttribute('fill') || \"''\"})`\n      );\n    });\n  }\n\n  attributeChangedCallback(attrName, oldValue, newValue) {\n    super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n    if (oldValue === newValue) return;\n\n    if (attrName === 'src') {\n      this.toggleVisibility(newValue);\n\n      createIcon(this.src).then((res) => {\n        this.innerHTML = '';\n        if (res) {\n          const clonedNode = res.cloneNode(true);\n          this.updateFillColor(clonedNode);\n          this.appendChild(clonedNode);\n        }\n      });\n    }\n  }\n}\n\nexport const IconClass = compose(\n  createStyleMixin({\n    mappings: {\n      fill: {},\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin\n)(RawIcon);\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) => {\n  const ele = document.createElement('img');\n  ele.setAttribute('src', src);\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, { USE_PROFILES: { svg: true, svgFilters: true } });\n\n  const parser = new DOMParser();\n  const ele = parser.parseFromString(clean, 'image/svg+xml').querySelector('svg');\n  return ele;\n};\n\nexport const createIcon = async (src) => {\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);\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 {\n  createStyleMixin,\n  draggableMixin,\n  createProxy,\n  proxyInputMixin,\n  componentNameValidationMixin,\n} from '../../mixins';\nimport textFieldMappings from './textFieldMappings';\nimport { compose } from '../../helpers';\nimport { getComponentName } from '../../helpers/componentHelpers';\nimport {\n  inputFloatingLabelStyle,\n  resetInputLabelPosition,\n  resetInputOverrides,\n  useHostExternalPadding,\n} from '../../helpers/themeHelpers/resetHelpers';\n\nexport const componentName = getComponentName('text-field');\n\nconst observedAttrs = ['type', 'label-type', 'copy-to-clipboard'];\n\nconst customMixin = (superclass) =>\n  class TextFieldClass extends superclass {\n    static get observedAttributes() {\n      return observedAttrs.concat(superclass.observedAttributes || []);\n    }\n\n    icon;\n\n    init() {\n      super.init?.();\n    }\n\n    renderCopyToClipboard(shouldRender) {\n      if (!shouldRender) {\n        this.icon?.remove();\n        return;\n      }\n\n      const iconInitConfig = {\n        icon: 'vaadin:copy-o',\n        title: 'Copy',\n        style: 'cursor: pointer',\n      };\n\n      const iconCopiedConfig = {\n        icon: 'vaadin:check-circle-o',\n        title: 'Copied',\n        style: 'cursor: initial',\n      };\n\n      this.icon = Object.assign(document.createElement('vaadin-icon'), {\n        slot: 'suffix',\n        ...iconInitConfig,\n      });\n\n      this.baseElement.appendChild(this.icon);\n      this.icon.addEventListener('click', () => {\n        navigator.clipboard.writeText(this.value);\n        Object.assign(this.icon, iconCopiedConfig);\n\n        // we want the icon to go back to the initial state after 5 seconds\n        setTimeout(() => {\n          Object.assign(this.icon, iconInitConfig);\n        }, 5000);\n      });\n    }\n\n    onLabelClick() {\n      this.focus();\n    }\n\n    attributeChangedCallback(attrName, oldVal, newVal) {\n      super.attributeChangeCallback?.(attrName, oldVal, newVal);\n\n      // Vaadin doesn't allow to change the input type attribute.\n      // We need the ability to do that, so we're overriding their\n      // behavior with their private API.\n      // When receiving a `type` attribute, we use their private API\n      // to set it on the input.\n      if (attrName === 'type') {\n        this.baseElement._setType(newVal);\n      }\n\n      if (oldVal !== newVal) {\n        if (attrName === 'label-type') {\n          if (newVal === 'floating') {\n            this.addEventListener('click', this.onLabelClick);\n          } else {\n            this.removeEventListener('click', this.onLabelClick);\n          }\n        } else if (attrName === 'copy-to-clipboard') {\n          this.renderCopyToClipboard(newVal === 'true');\n        }\n      }\n    }\n  };\n\nexport const TextFieldClass = compose(\n  createStyleMixin({\n    mappings: textFieldMappings,\n  }),\n  draggableMixin,\n  proxyInputMixin({ proxyProps: ['value', 'selectionStart'], useProxyTargets: true }),\n  componentNameValidationMixin,\n  customMixin\n)(\n  createProxy({\n    slots: ['prefix', 'suffix'],\n    wrappedEleName: 'vaadin-text-field',\n    style: () => `\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tpadding: calc(var(${TextFieldClass.cssVarList.inputOutlineWidth}) + var(${\n          TextFieldClass.cssVarList.inputOutlineOffset\n        }));\n        box-sizing: border-box;\n\t\t\t}\n      :host(:is([readonly], [disabled])) ::slotted(:is(input, textarea):placeholder-shown) {\n        opacity: 1;\n      }\n\n      vaadin-text-field[label-type=\"floating\"]:not([focused])[readonly] > input:placeholder-shown {\n        opacity: 0;\n      }\n      vaadin-text-field[label-type=\"floating\"]:not([focused])[disabled] > input:placeholder-shown {\n        opacity: 0;\n      }\n      ${resetInputLabelPosition('vaadin-text-field')}\n\t\t\t${useHostExternalPadding(TextFieldClass.cssVarList)}\n\t\t\t${resetInputOverrides('vaadin-text-field', TextFieldClass.cssVarList)}\n      ${inputFloatingLabelStyle()}\n\n      vaadin-text-field vaadin-icon {\n        align-self: center;\n      }\n\t\t`,\n    excludeAttrsSync: ['tabindex', 'style'],\n    componentName,\n  })\n);\n","import '@vaadin/text-field';\nimport '@vaadin/icons';\nimport '@vaadin/icon';\n\nimport { componentName, TextFieldClass } from './TextFieldClass';\n\ncustomElements.define(componentName, TextFieldClass);\n\nexport { TextFieldClass, componentName };\n","const {\n  host,\n  label,\n  placeholder,\n  requiredIndicator,\n  inputField,\n  input,\n  inputMask,\n  helperText,\n  errorMessage,\n  disabledPlaceholder,\n  inputDisabled,\n  inputIcon,\n  externalInput,\n  externalInputDisabled,\n  externalPlaceholder,\n  externalDisabledPlaceholder,\n} = {\n  host: { selector: () => ':host' },\n  label: { selector: '::part(label)' },\n  requiredIndicator: { selector: '[required]::part(required-indicator)::after' },\n  placeholder: [\n    { selector: '> input:placeholder-shown' },\n    { selector: () => ':host::slotted(input:placeholder-shown)' },\n  ],\n  disabledPlaceholder: { selector: '> input:disabled::placeholder' },\n  inputField: { selector: '::part(input-field)' },\n  input: { selector: 'input' },\n  inputMask: { selector: '::part(input-field)::before' },\n  inputDisabled: { selector: 'input:disabled' },\n  helperText: { selector: '::part(helper-text)' },\n  errorMessage: { selector: '::part(error-message)' },\n  inputIcon: { selector: 'vaadin-icon' },\n  externalInput: { selector: () => '::slotted(input)' },\n  externalInputDisabled: { selector: () => '::slotted(input:disabled)' },\n  externalPlaceholder: { selector: () => '::slotted(input:placeholder-shown)' },\n  externalDisabledPlaceholder: { selector: () => '::slotted(input:disabled::placeholder)' },\n};\n\nexport default {\n  // we apply font-size also on the host so we can set its width with em\n  fontSize: [{}, host],\n  fontFamily: [label, inputField, helperText, errorMessage],\n\n  labelFontSize: { ...label, property: 'font-size' },\n  labelFontWeight: { ...label, property: 'font-weight' },\n\n  labelTextColor: [\n    { ...label, property: 'color' },\n    { ...requiredIndicator, property: 'color' },\n    { ...label, property: '-webkit-text-fill-color' },\n    { ...requiredIndicator, property: '-webkit-text-fill-color' },\n  ],\n\n  hostWidth: { ...host, property: 'width' },\n  hostMinWidth: { ...host, property: 'min-width' },\n  hostDirection: { ...host, property: 'direction' },\n  inputDirection: { ...input, property: 'direction' },\n\n  inputBackgroundColor: [\n    { ...inputField, property: 'background-color' },\n    { ...inputMask, property: 'background-color' },\n  ],\n\n  errorMessageTextColor: { ...errorMessage, property: 'color' },\n  errorMessageIcon: { ...errorMessage, property: 'background-image' },\n  errorMessageIconSize: { ...errorMessage, property: 'background-size' },\n  errorMessageIconPadding: { ...errorMessage, property: 'padding-inline-start' },\n  errorMessageIconRepeat: { ...errorMessage, property: 'background-repeat' },\n  errorMessageIconPosition: { ...errorMessage, property: 'background-position' },\n\n  helperTextColor: { ...helperText, property: '-webkit-text-fill-color' },\n\n  inputValueTextColor: [\n    { ...inputField, property: 'color' },\n    { ...inputDisabled, property: '-webkit-text-fill-color' },\n    { ...externalInputDisabled, property: '-webkit-text-fill-color' },\n  ],\n  inputCaretTextColor: [\n    { ...input, property: 'caret-color' },\n    { ...externalInput, property: 'caret-color' },\n  ],\n\n  labelRequiredIndicator: { ...requiredIndicator, property: 'content' },\n\n  inputBorderColor: { ...inputField, property: 'border-color' },\n  inputBorderWidth: { ...inputField, property: 'border-width' },\n  inputBorderStyle: { ...inputField, property: 'border-style' },\n  inputBorderRadius: { ...inputField, property: 'border-radius' },\n\n  inputHeight: { ...inputField, property: 'height' },\n  inputHorizontalPadding: [\n    { ...input, property: 'padding-left' },\n    { ...input, property: 'padding-right' },\n    { ...externalInput, property: 'padding-left' },\n    { ...externalInput, property: 'padding-right' },\n  ],\n\n  inputOutlineColor: { ...inputField, property: 'outline-color' },\n  inputOutlineStyle: { ...inputField, property: 'outline-style' },\n  inputOutlineWidth: { ...inputField, property: 'outline-width' },\n  inputOutlineOffset: { ...inputField, property: 'outline-offset' },\n\n  textAlign: {},\n\n  inputTextAlign: [\n    { ...input, property: 'text-align' },\n    { ...externalInput, property: 'text-align' },\n  ],\n\n  inputPlaceholderColor: [\n    { selector: () => ':host input:placeholder-shown', property: 'color' },\n    { ...externalPlaceholder, property: 'color' },\n    { ...placeholder, property: 'color' },\n    { ...disabledPlaceholder, property: '-webkit-text-fill-color' },\n    { ...externalDisabledPlaceholder, property: '-webkit-text-fill-color' },\n  ],\n\n  labelPosition: { ...label, property: 'position' },\n  labelTopPosition: { ...label, property: 'top' },\n  labelHorizontalPosition: [\n    { ...label, property: 'left' },\n    { ...label, property: 'right' },\n  ],\n  inputTransformY: { ...label, property: 'transform' },\n  inputTransition: { ...label, property: 'transition' },\n  marginInlineStart: { ...label, property: 'margin-inline-start' },\n  placeholderOpacity: [\n    { selector: '> input:placeholder-shown', property: 'opacity' },\n    { ...externalPlaceholder, property: 'opacity' },\n  ],\n  inputVerticalAlignment: [\n    { ...inputField, property: 'align-items' },\n    { ...externalInput, property: 'align-items' },\n  ],\n  valueInputHeight: [\n    { ...input, property: 'height' },\n    { ...externalInput, property: 'height' },\n  ],\n  valueInputMarginBottom: [\n    { ...input, property: 'margin-bottom' },\n    { ...externalInput, property: 'margin-bottom' },\n  ],\n\n  inputIconOffset: [\n    { ...inputIcon, property: 'margin-right' },\n    { ...inputIcon, property: 'margin-left' },\n  ],\n  inputIconSize: { ...inputIcon, property: 'font-size' },\n  inputIconColor: { ...inputIcon, property: 'color' },\n};\n","import { injectStyle } from '@descope-ui/common/components-helpers';\nimport { createBaseInputClass } from '../../../../baseClasses/createBaseInputClass';\nimport { forwardAttrs, getComponentName } from '../../../../helpers/componentHelpers';\n\nexport const componentName = getComponentName('mapping-item');\n\nconst inputAttrs = [\n  'size',\n  'bordered',\n  'readonly',\n  'full-width',\n  'disabled',\n  'st-error-message-icon',\n  'st-error-message-icon-size',\n  'st-error-message-icon-padding',\n];\n\nconst BaseInputClass = createBaseInputClass({ componentName, baseSelector: 'div' });\n\nclass MappingItem extends BaseInputClass {\n  static get observedAttributes() {\n    return [].concat(BaseInputClass.observedAttributes || [], inputAttrs, [\n      'separator',\n      'options',\n      'invalid',\n      'disabled',\n    ]);\n  }\n\n  get separator() {\n    return this.getAttribute('separator') || 'map to';\n  }\n\n  get value() {\n    const attributeValue = this.attributeInput.value;\n    const inputValue = this.valueInput.value;\n    if (attributeValue && inputValue) {\n      return { [attributeValue]: inputValue };\n    }\n    return null;\n  }\n\n  set value(mapping) {\n    if (Object.entries(mapping).length !== 1) {\n      // eslint-disable-next-line no-console\n      console.error(\n        'descope-mapping item expected expects only one key-value pair in the value but received: ',\n        mapping\n      );\n      return;\n    }\n    const [attribute, value] = Object.entries(mapping)[0];\n    this.valueInput.value = value;\n    this.attributeInput.value = attribute;\n    // The event needs to be dispatched to trigger the validation if setting the value externally\n    this.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));\n  }\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n      <div class=\"wrapper\" part=\"wrapper\">\n        <descope-text-field required=\"true\"></descope-text-field>\n        <div class=\"separator\" part=\"separator\">${this.separator}</div>\n        <descope-combo-box\n          item-label-path=\"data-name\"\n          item-value-path=\"data-id\"\n          required=\"true\"\n        >\n        </descope-combo-box>\n        <descope-button variant=\"link\" mode=\"primary\">\n          <vaadin-icon icon=\"vaadin:minus\"></vaadin-icon>\n        </descope-button>\n      </div>\n\t`;\n\n    injectStyle(\n      `\n        .wrapper {\n          display: flex;\n        }\n        .separator {\n          text-align: center;\n          flex-shrink: 0;\n        }\n    `,\n      this\n    );\n\n    this.valueInput = this.shadowRoot.querySelector('descope-text-field');\n    this.attributeInput = this.shadowRoot.querySelector('descope-combo-box');\n    this.inputs = [this.valueInput, this.attributeInput];\n    this.removeButton = this.shadowRoot.querySelector('descope-button');\n\n    forwardAttrs(this, this.valueInput, {\n      includeAttrs: inputAttrs,\n    });\n    forwardAttrs(this, this.attributeInput, {\n      includeAttrs: [...inputAttrs, 'options'],\n      mapAttrs: { options: 'data' },\n    });\n    forwardAttrs(this, this.removeButton, {\n      includeAttrs: ['disabled'],\n    });\n  }\n\n  initRemoveButton() {\n    this.removeButton.addEventListener('click', () =>\n      this.dispatchEvent(new CustomEvent('mapping-item-removed', { bubbles: true, composed: true }))\n    );\n  }\n\n  init() {\n    super.init?.();\n    this.initRemoveButton();\n  }\n\n  getValidity() {\n    const attributeValue = this.attributeInput.value;\n    const inputValue = this.valueInput.value;\n    if (!attributeValue || !inputValue) {\n      return { badInput: true };\n    }\n    return {};\n  }\n\n  reportValidity() {\n    this.inputs.forEach((input) => input.reportValidity());\n  }\n\n  focus() {\n    const focusedElement =\n      this.checkValidity() || !this.valueInput.checkValidity()\n        ? this.valueInput\n        : this.attributeInput;\n    focusedElement.focus();\n  }\n\n  handleSeparatorChange() {\n    this.shadowRoot.querySelector('.separator').textContent = this.separator;\n  }\n\n  #handleInvalidMapping(invalid) {\n    if (invalid === 'true') {\n      const inputValue = this.valueInput.value;\n      if (!inputValue) {\n        this.valueInput.setAttribute('invalid', 'true');\n        this.valueInput.setAttribute('error-message', this.defaultErrorMsgValueMissing);\n      }\n\n      const attributeValue = this.attributeInput.value;\n      if (!attributeValue) {\n        this.attributeInput.setAttribute('invalid', 'true');\n        this.attributeInput.setAttribute('error-message', this.defaultErrorMsgValueMissing);\n      }\n    }\n  }\n\n  attributeChangedCallback(attrName, oldValue, newValue) {\n    super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n    if (attrName === 'separator') {\n      this.handleSeparatorChange();\n    }\n\n    if (attrName === 'invalid') {\n      this.#handleInvalidMapping(newValue);\n    }\n  }\n}\n\nexport default MappingItem;\n","import MappingItem, { componentName } from './MappingItem';\n\ncustomElements.define(componentName, MappingItem);\n","import { createBaseInputClass } from '../../../../baseClasses/createBaseInputClass';\nimport {\n  getComponentName,\n  forwardAttrs,\n  observeChildren,\n} from '../../../../helpers/componentHelpers';\n\nexport const componentName = getComponentName('mappings-field-internal');\n\nconst BaseInputClass = createBaseInputClass({ componentName, baseSelector: 'div' });\n\nclass MappingsFieldInternal extends BaseInputClass {\n  #errorItem;\n\n  static get observedAttributes() {\n    return [].concat(BaseInputClass.observedAttributes || [], [\n      'label-value',\n      'label-attr',\n      'button-label',\n      'invalid',\n      'readonly',\n      'disabled',\n      'st-error-message-icon',\n      'st-error-message-icon-size',\n      'st-error-message-icon-padding',\n    ]);\n  }\n\n  // eslint-disable-next-line class-methods-use-this\n  isValidDataType(data) {\n    try {\n      return data.every(\n        (obj) =>\n          typeof obj === 'object' &&\n          !Array.isArray(obj) &&\n          Object.getOwnPropertyNames(obj).length === 1 &&\n          typeof obj[Object.keys(obj)[0]] === 'string' &&\n          obj[Object.keys(obj)[0]].trim() !== ''\n      );\n    } catch (e) {\n      return false;\n    }\n  }\n\n  get labelValue() {\n    return this.getAttribute('label-value') || 'Value';\n  }\n\n  get labelAttr() {\n    return this.getAttribute('label-attr') || 'Attribute';\n  }\n\n  get buttonLabel() {\n    return this.getAttribute('button-label') || 'Add mapping';\n  }\n\n  get options() {\n    return this.getAttribute('options') || [];\n  }\n\n  addNewMappingItem(focusNewItem) {\n    const newMappingItem = document.createElement('descope-mapping-item');\n    newMappingItem.setAttribute('bordered', 'true');\n    this.mappingsContainerEle.appendChild(newMappingItem);\n    forwardAttrs(this, newMappingItem, {\n      includeAttrs: [\n        'size',\n        'full-width',\n        'separator',\n        'options',\n        'disabled',\n        'st-error-message-icon',\n        'st-error-message-icon-size',\n        'st-error-message-icon-padding',\n      ],\n    });\n    // This needs to be done with the timeout, otherwise the validation is performed\n    // before the new item is added and thus returns a wrong result\n    setTimeout(() => {\n      this.setCustomValidity('');\n      newMappingItem.addEventListener('mapping-item-removed', () => {\n        // If the removed item was the one that was invalid, we need to reset the invalid indication for the internal\n        if (newMappingItem === this.#errorItem) {\n          this.resetInvalidIndication();\n          this.#errorItem = undefined;\n        }\n        newMappingItem.remove();\n        this.setCustomValidity('');\n      });\n      this.dispatchEvent(new CustomEvent('mapping-item-added', { bubbles: true, composed: true }));\n      if (focusNewItem) {\n        newMappingItem.focus();\n      }\n    }, 0);\n    return newMappingItem;\n  }\n\n  get items() {\n    return Array.from(this.mappingsContainerEle.querySelectorAll('descope-mapping-item'));\n  }\n\n  get value() {\n    return this.items.reduce((acc, item) => {\n      if (!item.value) {\n        return acc;\n      }\n\n      return [...acc, item.value];\n    }, []);\n  }\n\n  set value(mappings) {\n    if (!this.isValidDataType(mappings)) {\n      // eslint-disable-next-line no-console\n      console.error(\n        'received invalid value to set - should be an array of objects with one key-value pair'\n      );\n      return;\n    }\n\n    const currentItems = this.items;\n\n    // Remove extra mapping items we don't need\n    if (currentItems.length > mappings.length) {\n      for (let i = mappings.length; i < currentItems.length; i++) {\n        this.mappingsContainerEle.removeChild(currentItems[i]);\n      }\n    }\n\n    // Add or update items\n    mappings.forEach((mapping, index) => {\n      const mappingItem = currentItems[index];\n      if (mappingItem) {\n        // Set existing item value\n        mappingItem.value = mapping;\n      } else {\n        // Add new item\n        const newMappingItem = this.addNewMappingItem(false);\n        // Setting the new item value needs to be done with the timeout,\n        // otherwise the value is not set correctly\n        setTimeout(() => {\n          newMappingItem.value = mapping;\n        }, 0);\n      }\n    });\n  }\n\n  constructor() {\n    super();\n\n    this.innerHTML = `\n      <div class=\"labels-container\" part=\"labels\"></div>\n      <div class=\"mappings-container\"></div>\n      <div class=\"button-container\"></div>\n    `;\n\n    this.labelsEle = this.querySelector('.labels-container');\n    this.mappingsContainerEle = this.querySelector('.mappings-container');\n    this.buttonContainer = this.querySelector('.button-container');\n  }\n\n  initLabels() {\n    this.labelsEle.innerHTML = `\n      <descope-text variant=\"body2\" part=\"value-label\">${this.labelValue}</descope-text>\n      <descope-text variant=\"body2\" part=\"attr-label\">${this.labelAttr}</descope-text>\n    `;\n  }\n\n  initAddButton() {\n    this.buttonContainer.innerHTML = `\n      <descope-button variant=\"link\" mode=\"primary\" disabled=\"${this.isDisabled}\">\n        <vaadin-icon icon=\"vaadin:plus\"></vaadin-icon>\n        ${this.buttonLabel}\n      </descope-button>\n    `;\n    const button = this.querySelector('descope-button');\n    button.onclick = () => {\n      this.addNewMappingItem(true);\n    };\n    forwardAttrs(this, button, {\n      includeAttrs: ['disabled'],\n    });\n  }\n\n  #onMappingsContainerChildrenChange() {\n    this.labelsEle.style.display = this.items.length ? 'grid' : 'none';\n  }\n\n  init() {\n    // This event listener needs to be placed before the super.init() call\n    this.addEventListener('focus', (e) => {\n      // we want to ignore focus events we are dispatching\n      if (e.isTrusted) {\n        const focusedElement =\n          this.#errorItem || this.items[0] || this.querySelector('descope-button');\n        focusedElement.focus();\n      }\n    });\n\n    super.init?.();\n    this.initLabels();\n    this.initAddButton();\n\n    // This event listener is responsible for removing the invalid attribute\n    // from the internal once the invalid item turns valid\n    this.addEventListener('input', () => {\n      const isErrorItemMounted = this.mappingsContainerEle.contains(this.#errorItem);\n      if (isErrorItemMounted && this.#errorItem?.checkValidity()) {\n        // Item has changed, it was invalid before and now it's valid\n        this.resetInvalidIndication();\n        this.#errorItem.removeAttribute('invalid');\n        this.#errorItem = undefined;\n      }\n    });\n\n    observeChildren(this.mappingsContainerEle, this.#onMappingsContainerChildrenChange.bind(this));\n  }\n\n  resetInvalidIndication() {\n    this.removeAttribute('invalid');\n  }\n\n  getValidity() {\n    const errorItem = this.items.find((item) => !item.checkValidity());\n    if (errorItem) {\n      return errorItem.validity;\n    }\n\n    return {};\n  }\n\n  #handleInvalidMappings(isInvalid) {\n    if (isInvalid) {\n      this.#errorItem = this.items.find((item) => !item.checkValidity());\n      this.#errorItem?.reportValidity();\n      this.#errorItem?.setAttribute('invalid', 'true');\n    }\n  }\n\n  attributeChangedCallback(attrName, oldValue, newValue) {\n    super.attributeChangedCallback?.(attrName, oldValue, newValue);\n    if (attrName === 'label-value' || attrName === 'label-attr') {\n      this.initLabels();\n    }\n    if (attrName === 'button-label') {\n      this.initAddButton();\n    }\n    if (attrName === 'invalid') {\n      this.#handleInvalidMappings(newValue === 'true');\n    }\n    if (attrName === 'readonly') {\n      this.toggleAttribute('inert', newValue === 'true');\n    }\n  }\n}\n\nexport default MappingsFieldInternal;\n","import MappingsFieldInternal, { componentName } from './MappingsFieldInternal';\n\ncustomElements.define(componentName, MappingsFieldInternal);\n","import {\n  createStyleMixin,\n  draggableMixin,\n  createProxy,\n  proxyInputMixin,\n  componentNameValidationMixin,\n} from '../../../mixins';\nimport { TextClass } from '@descope-ui/descope-text/class';\nimport { compose } from '../../../helpers';\nimport { forwardAttrs, getComponentName, syncAttrs } from '../../../helpers/componentHelpers';\nimport { componentName as descopeInternalComponentName } from './descope-mappings-field-internal/MappingsFieldInternal';\n\nexport const componentName = getComponentName('mappings-field');\n\nconst customMixin = (superclass) =>\n  class MappingsFieldMixinClass extends superclass {\n    get defaultValues() {\n      const defaultValuesAttr = this.getAttribute('default-values');\n      if (defaultValuesAttr) {\n        try {\n          return JSON.parse(defaultValuesAttr);\n        } catch (e) {\n          // eslint-disable-next-line no-console\n          console.error('could not parse data string from attribute \"default-values\" -', e.message);\n        }\n      }\n      return [];\n    }\n\n    setDefaultValues() {\n      const initialDefaultValues = this.defaultValues;\n      if (Object.keys(initialDefaultValues).length > 0) {\n        this.inputElement.value = initialDefaultValues;\n      }\n    }\n\n    init() {\n      super.init?.();\n      const template = document.createElement('template');\n\n      template.innerHTML = `\n      <${descopeInternalComponentName}\n        tabindex=\"-1\"\n      ></${descopeInternalComponentName}>\n      `;\n\n      this.baseElement.appendChild(template.content.cloneNode(true));\n\n      this.inputElement = this.shadowRoot.querySelector(descopeInternalComponentName);\n\n      forwardAttrs(this, this.inputElement, {\n        includeAttrs: [\n          'size',\n          'full-width',\n          'label-value',\n          'label-attr',\n          'button-label',\n          'separator',\n          'options',\n          'default-values',\n          'invalid',\n          'readonly',\n          'disabled',\n          'st-error-message-icon',\n          'st-error-message-icon-size',\n          'st-error-message-icon-padding',\n        ],\n      });\n\n      // This is required since when we remove the invalid attribute from the internal mappings field,\n      // we want to reflect the change in the parent component\n      syncAttrs(this, this.inputElement, { includeAttrs: ['invalid'] });\n\n      this.setDefaultValues();\n    }\n  };\n\nconst {\n  host,\n  helperText,\n  errorMessage,\n  mappingItem,\n  labels,\n  labelsText,\n  valueLabel,\n  attrLabel,\n  separator,\n  labelsContainer,\n} = {\n  host: { selector: () => ':host' },\n  helperText: { selector: '::part(helper-text)' },\n  errorMessage: { selector: '::part(error-message)' },\n  mappingItem: { selector: 'descope-mapping-item::part(wrapper)' },\n  labels: { selector: 'descope-mappings-field-internal [part=\"labels\"] descope-text' },\n  labelsText: {\n    selector: 'descope-mappings-field-internal [part=\"labels\"] descope-text::part(text-wrapper)',\n  },\n  valueLabel: { selector: 'descope-mappings-field-internal [part=\"labels\"] [part=\"value-label\"]' },\n  attrLabel: { selector: 'descope-mappings-field-internal [part=\"labels\"] [part=\"attr-label\"]' },\n  separator: { selector: 'descope-mapping-item::part(separator)' },\n  labelsContainer: { selector: 'descope-mappings-field-internal [part=\"labels\"]' },\n};\n\nexport const MappingsFieldClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: { ...host, property: 'width' },\n      hostDirection: { ...host, property: 'direction' },\n      // we apply font-size also on the host so we can set its width with em\n      fontSize: [{}, host, { ...separator, property: 'margin-top' }],\n      fontFamily: [helperText, errorMessage, labels],\n      separatorFontSize: { ...separator, property: 'font-size' },\n      labelsFontSize: { ...labelsText, property: 'font-size' },\n      labelsLineHeight: [\n        { ...labelsText, property: 'line-height' },\n        { ...labels, property: 'line-height' },\n      ],\n      labelTextColor: [\n        { ...labels, property: TextClass.cssVarList.textColor },\n        { ...separator, property: 'color' },\n      ],\n      itemMarginBottom: { ...mappingItem, property: 'margin-bottom' },\n      valueLabelMinWidth: { ...valueLabel, property: 'min-width' },\n      attrLabelMinWidth: { ...attrLabel, property: 'min-width' },\n      labelsMarginBottom: { ...labelsContainer, property: 'margin-bottom' },\n      separatorWidth: {},\n      removeButtonWidth: {},\n    },\n  }),\n  draggableMixin,\n  proxyInputMixin({\n    proxyProps: ['value', 'selectionStart'],\n    inputEvent: 'input',\n    proxyParentValidation: true,\n  }),\n  componentNameValidationMixin,\n  customMixin\n)(\n  createProxy({\n    slots: [],\n    wrappedEleName: 'vaadin-custom-field',\n    style: () => `\n      :host {\n        display: inline-flex;\n        max-width: 100%;\n        direction: ltr;\n      }\n      vaadin-custom-field {\n        line-height: unset;\n        width: 100%;\n      }\n\n      descope-mappings-field-internal [part=\"labels\"] {\n        display: none;\n        grid-template-columns: 1fr var(${MappingsFieldClass.cssVarList.separatorWidth}) 1fr var(${MappingsFieldClass.cssVarList.removeButtonWidth});\n      }\n\n      descope-mappings-field-internal [part=\"labels\"] [part=\"value-label\"],\n      descope-mappings-field-internal [part=\"labels\"] [part=\"attr-label\"] {\n        ${TextClass.cssVarList.fontWeight}: 500;\n      }\n\n      descope-mappings-field-internal [part=\"labels\"] [part=\"value-label\"] {\n        grid-column: 1 / span 1;\n      }\n\n      descope-mappings-field-internal [part=\"labels\"] [part=\"attr-label\"] {\n        grid-column: 3 / span 1;\n      }\n\n      descope-mapping-item::part(wrapper) {\n        display: grid;\n        grid-template-columns: 1fr var(${MappingsFieldClass.cssVarList.separatorWidth}) 1fr var(${MappingsFieldClass.cssVarList.removeButtonWidth});\n      }\n    `,\n    excludeAttrsSync: [\n      'tabindex',\n      'label-value',\n      'label-attr',\n      'button-label',\n      'options',\n      'error-message',\n    ],\n    componentName,\n  })\n);\n\nexport default MappingsFieldClass;\n","import '@vaadin/custom-field';\nimport '@vaadin/icon';\nimport '@vaadin/icons';\nimport { componentName, MappingsFieldClass } from './MappingsFieldClass';\nimport '@descope-ui/descope-text';\nimport '../../descope-button';\nimport '../../descope-text-field';\nimport '@descope-ui/descope-combo-box';\nimport './descope-mappings-field-internal';\nimport './descope-mapping-item';\n\ncustomElements.define(componentName, MappingsFieldClass);\n\nexport { MappingsFieldClass, componentName };\n","import { createBaseInputClass } from '../../../../baseClasses/createBaseInputClass';\nimport {\n  getComponentName,\n  forwardAttrs,\n  observeAttributes,\n} from '../../../../helpers/componentHelpers';\n\nexport const componentName = getComponentName('saml-group-mappings-internal');\n\nconst BaseInputClass = createBaseInputClass({ componentName, baseSelector: '' });\n\nclass SamlGroupMappingsInternal extends BaseInputClass {\n  static get observedAttributes() {\n    return ['invalid'].concat(BaseInputClass.observedAttributes || []);\n  }\n\n  constructor() {\n    super();\n\n    this.innerHTML = `\n      <descope-text-field variant=\"body2\" bordered=\"true\"></descope-text-field>\n      <descope-mappings-field></descope-mappings-field>\n    `;\n\n    this.groupInputElement = this.querySelector('descope-text-field');\n    this.mappingsElement = this.querySelector('descope-mappings-field');\n  }\n\n  resetInvalidIndication() {\n    this.removeAttribute('invalid');\n  }\n\n  handleMappingsInvalidChange(changedAttributes) {\n    if (changedAttributes.includes('invalid')) {\n      if (!this.mappingsElement.hasAttribute('invalid')) {\n        this.resetInvalidIndication();\n      }\n    }\n  }\n\n  initFocusHandler() {\n    // This event listener needs to be placed before the super.init() call\n    this.addEventListener('focus', (e) => {\n      // we want to ignore focus events we are dispatching\n      if (e.isTrusted) {\n        const focusedElement = this.mappingsElement.checkValidity()\n          ? this.groupInputElement\n          : this.mappingsElement;\n        focusedElement.focus();\n      }\n    });\n  }\n\n  init() {\n    // This needs to be placed before the super.init() call to work\n    this.initFocusHandler();\n\n    super.init?.();\n\n    forwardAttrs(this, this.groupInputElement, {\n      mapAttrs: { 'label-group': 'label' },\n      includeAttrs: ['size', 'label-group', 'readonly', 'disabled'],\n    });\n\n    forwardAttrs(this, this.mappingsElement, {\n      includeAttrs: [\n        'size',\n        'full-width',\n        'label-value',\n        'label-attr',\n        'button-label',\n        'separator',\n        'options',\n        'readonly',\n        'disabled',\n        'data-errormessage-pattern-mismatch',\n      ],\n    });\n\n    // Observing the invalid attribute of the mappings field to reset the invalid state for this component.\n    // When an invalid item turns valid, the mappings field will remove the invalid attribute, and at this component\n    // level, we need to remove the invalid attribute as well to be able to mark the component as invalid the next time\n    observeAttributes(this.mappingsElement, this.handleMappingsInvalidChange.bind(this), {\n      includeAttrs: ['invalid'],\n    });\n  }\n\n  get value() {\n    return {\n      group: this.groupInputElement.value,\n      mappings: this.mappingsElement.value,\n    };\n  }\n\n  set value(value) {\n    if (value?.group && typeof value.group === 'string') {\n      this.groupInputElement.value = value.group;\n    }\n    if (Array.isArray(value?.mappings)) {\n      this.mappingsElement.value = value.mappings;\n    }\n  }\n\n  getValidity() {\n    if (!this.groupInputElement.checkValidity()) {\n      return this.groupInputElement.validity;\n    }\n    if (!this.mappingsElement.checkValidity()) {\n      return this.mappingsElement.validity;\n    }\n\n    return {};\n  }\n\n  #handleInvalidState(isInvalid) {\n    if (isInvalid) {\n      if (!this.groupInputElement.checkValidity()) {\n        this.groupInputElement.setAttribute('invalid', 'true');\n        return;\n      }\n\n      if (!this.mappingsElement.checkValidity()) {\n        this.mappingsElement.setAttribute('invalid', 'true');\n      }\n    }\n  }\n\n  attributeChangedCallback(attrName, oldValue, newValue) {\n    super.attributeChangedCallback?.(attrName, oldValue, newValue);\n    if (attrName === 'invalid') {\n      this.#handleInvalidState(newValue === 'true');\n    }\n  }\n}\n\nexport default SamlGroupMappingsInternal;\n","import SamlGroupMappingsInternal, { componentName } from './SamlGroupMappingsInternal';\n\ncustomElements.define(componentName, SamlGroupMappingsInternal);\n","import {\n  createStyleMixin,\n  draggableMixin,\n  createProxy,\n  proxyInputMixin,\n  componentNameValidationMixin,\n} from '../../../mixins';\nimport { compose } from '../../../helpers';\nimport { forwardAttrs, getComponentName, syncAttrs } from '../../../helpers/componentHelpers';\nimport { componentName as descopeInternalComponentName } from './descope-saml-group-mappings-internal/SamlGroupMappingsInternal';\n\nexport const componentName = getComponentName('saml-group-mappings');\n\nconst customMixin = (superclass) =>\n  class SamlGroupMappingsMixinClass extends superclass {\n    init() {\n      super.init?.();\n\n      const template = document.createElement('template');\n\n      template.innerHTML = `\n      <${descopeInternalComponentName}\n        tabindex=\"-1\"\n      ></${descopeInternalComponentName}>\n      `;\n\n      this.baseElement.appendChild(template.content.cloneNode(true));\n\n      this.inputElement = this.shadowRoot.querySelector(descopeInternalComponentName);\n\n      forwardAttrs(this, this.inputElement, {\n        includeAttrs: [\n          'size',\n          'full-width',\n          'label-group',\n          'label-value',\n          'label-attr',\n          'button-label',\n          'separator',\n          'options',\n          'readonly',\n          'disabled',\n        ],\n      });\n\n      syncAttrs(this, this.inputElement, { includeAttrs: ['invalid'] });\n    }\n  };\n\nconst { host, groupInput, errorMessage } = {\n  host: { selector: () => ':host' },\n  groupInput: { selector: 'descope-text-field' },\n  errorMessage: { selector: '::part(error-message)' },\n};\n\nexport const SamlGroupMappingsClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: { ...host, property: 'width' },\n      hostDirection: { ...host, property: 'direction' },\n      groupNameInputMarginBottom: { ...groupInput, property: 'margin-bottom' },\n      errorMessageIcon: { ...errorMessage, property: 'background-image' },\n      errorMessageIconSize: { ...errorMessage, property: 'background-size' },\n      errorMessageIconPadding: { ...errorMessage, property: 'padding-inline-start' },\n      errorMessageIconRepeat: { ...errorMessage, property: 'background-repeat' },\n      errorMessageIconPosition: { ...errorMessage, property: 'background-position' },\n    },\n  }),\n  draggableMixin,\n  proxyInputMixin({\n    proxyProps: ['value', 'selectionStart'],\n    inputEvent: 'input',\n    triggerValidationEvents: ['mapping-item-added', 'mapping-item-removed'],\n    proxyParentValidation: true,\n  }),\n  componentNameValidationMixin,\n  customMixin\n)(\n  createProxy({\n    slots: [],\n    wrappedEleName: 'vaadin-custom-field',\n    style: () => `\n      :host {\n        display: inline-flex;\n        max-width: 100%;\n        direction: ltr;\n      }\n\n      vaadin-custom-field {\n        line-height: unset;\n        width: 100%;\n      }\n\n      descope-text-field {\n        width: auto;\n      }\n\n      descope-mappings-field {\n        display: block;\n      }\n    `,\n    excludeAttrsSync: [\n      'tabindex',\n      'label-group',\n      'label-value',\n      'label-attr',\n      'button-label',\n      'separator',\n      'options',\n      'error-message',\n    ],\n    componentName,\n  })\n);\n\nexport default SamlGroupMappingsClass;\n","import '@vaadin/custom-field';\n\nimport { componentName, SamlGroupMappingsClass } from './SamlGroupMappingsClass';\nimport '../../descope-text-field';\nimport '../descope-mappings-field';\nimport './descope-saml-group-mappings-internal';\n\ncustomElements.define(componentName, SamlGroupMappingsClass);\n\nexport { SamlGroupMappingsClass, componentName };\n","export const useHostExternalPadding = (cssVarList) => `\n    :host {\n        padding: calc(var(${cssVarList.inputOutlineWidth}) + var(${cssVarList.inputOutlineOffset}))\n    }\n`;\n\nexport const resetInputFieldUnderlayingBorder = (name) => `\n    ${name}::part(input-field)::after {\n        border: none;\n    }\n`;\n\nexport const resetInitialHeight = (name) => `\n    ${name}::before {\n\t\theight: unset;\n\t}\n`;\n\nexport const resetInputElement = (name) => `\n    ${name} > input {\n        -webkit-mask-image: none;\n        min-height: 0;\n        box-sizing: border-box;\n    }\n`;\n\nexport const resetInputContainer = (name) => `\n    ${name} {\n        margin: 0;\n        padding: 0;\n        width: 100%;\n        height: 100%;\n        box-sizing: border-box;\n    }\n`;\n\nexport const resetInputField = (name) => `\n    ${name}::part(input-field) {\n        overflow: hidden;\n        padding: 0;\n        box-shadow: none;\n    }\n`;\n\nexport const resetInputCursor = (name) => `\n    ${name} > label,\n    ${name}::part(label),\n    ${name}::part(required-indicator) {\n        cursor: pointer;\n    }\n`;\n\nexport const resetInputPlaceholder = (name, ele = 'input') => `\n    ${name}[disabled] > ${ele}:placeholder-shown,\n\t${name}[readonly] > ${ele}:placeholder-shown {\n\t\topacity: 1;\n\t}\n`;\n\nexport const resetInputAutoFill = (name, cssVarList) => `\n    ${name} input:-webkit-autofill,\n    ${name} input:-webkit-autofill::first-line,\n    ${name} input:-webkit-autofill:hover,\n    ${name} input:-webkit-autofill:active,\n    ${name} input:-webkit-autofill:focus {\n        -webkit-text-fill-color: var(${cssVarList.inputValueTextColor});\n        box-shadow: 0 0 0 var(${cssVarList.inputHeight}) var(${cssVarList.inputBackgroundColor}) inset;\n    }\n`;\n\nexport const resetInputFieldDefaultWidth = () => `\n    :host {\n        --vaadin-field-default-width: auto;\n        box-sizing: border-box;\n    }\n`;\n\nexport const resetInputReadonlyStyle = (name) => `\n    ${name}::part(input-field)::after {\n        opacity: 0;\n    }\n`;\n\nexport const resetInputFieldInvalidBackgroundColor = (name) => `\n    ${name}::part(input-field)::after {\n        background: none;\n    }\n`;\n\nexport const resetInputOverrides = (name, cssVarList) => `\n    ${resetInputContainer(name)}\n    ${resetInputCursor(name)}\n    ${resetInputPlaceholder(name)}\n    ${resetInputField(name)}\n    ${resetInputAutoFill(name, cssVarList)}\n    ${resetInputFieldInvalidBackgroundColor(name)}\n    ${resetInitialHeight(name)}\n    ${resetInputElement(name)}\n    ${resetInputFieldUnderlayingBorder(name)}\n`;\n\n// This function is used to support RTL correctly for input components.\n// It also fixes the error message to be displayed LTR since we currently\n// don't support RTL for error messages.\nexport const resetInputLabelPosition = (name) => `\n    :host ::part(error-message) {\n      direction: ltr;\n    }\n    :host([required]) ::part(required-indicator) {\n      width: 1em;\n      display: inline-flex;\n    }\n    :host([required]) ::part(required-indicator)::after {\n      position: static;\n    }\n    :host([has-label]) ::part(label) {\n      padding-right: 0;\n      padding-bottom: 0;\n      display: flex;\n      width: 100%;\n    }\n    ${name} [slot=\"label\"] {\n      max-width: calc(100% - 1em);\n      overflow: hidden;\n      text-overflow: ellipsis;\n      padding-bottom: 0.5em;\n    }\n`;\n\nexport const inputFloatingLabelStyle = () => {\n  return `\n  :host([label-type=\"floating\"]) {\n    position: relative;\n  }\n  :host([label-type=\"floating\"][has-label]) [slot=\"label\"] {\n    padding: 0;\n  }\n  :host([label-type=\"floating\"][has-label]) > ::part(label) {\n    z-index: 1;\n    padding: 0;\n    width: auto;\n  }\n  `;\n};\n"],"names":["componentName","RawText","baseSelector","constructor","super","this","attachShadow","mode","innerHTML","hideWhenEmpty","getAttribute","init","hasChildren","childNodes","length","style","display","TextClass","mappings","hostWidth","selector","property","hostDirection","fontSize","textColor","textLineHeight","textLetterSpacing","textShadow","textAlign","textTransform","fontFamily","fontStyle","fontWeight","borderWidth","borderStyle","borderColor","customElements","define","createBaseInputClass","args","host","label","slottedIcon","loadingIndicatorStyles","ButtonClass","hostHeight","cursor","backgroundColor","outlineOffset","outlineColor","outlineStyle","outlineWidth","borderRadius","verticalPadding","horizontalPadding","fallback","labelTextColor","iconColor","cssVarList","fill","labelTextDecoration","labelSpacing","iconSize","slots","wrappedEleName","excludeAttrsSync","color","clickableMixin","superclass","isLoading","click","RawIcon","observedAttributes","toggleVisibility","src","isVisible","updateFillColor","node","querySelectorAll","forEach","ele","setAttribute","IconClass","attributeChangedCallback","attrName","oldValue","newValue","then","res","clonedNode","cloneNode","appendChild","createSvgEle","text","clean","sanitize","USE_PROFILES","svg","svgFilters","DOMParser","parseFromString","querySelector","createIcon","async","startsWith","isBase64Svg","svgXml","atob","slice","base64Prefix","path","match","getFileExtension","fetchedSrc","fetch","document","createElement","createImgEle","setProperty","observedAttrs","TextFieldClass","proxyProps","useProxyTargets","concat","icon","renderCopyToClipboard","shouldRender","remove","iconInitConfig","title","iconCopiedConfig","Object","assign","slot","baseElement","addEventListener","navigator","clipboard","writeText","value","setTimeout","onLabelClick","focus","oldVal","newVal","attributeChangeCallback","_setType","removeEventListener","inputOutlineWidth","inputOutlineOffset","placeholder","requiredIndicator","inputField","input","inputMask","helperText","errorMessage","disabledPlaceholder","inputDisabled","inputIcon","externalInput","externalInputDisabled","externalPlaceholder","externalDisabledPlaceholder","labelFontSize","labelFontWeight","hostMinWidth","inputDirection","inputBackgroundColor","errorMessageTextColor","errorMessageIcon","errorMessageIconSize","errorMessageIconPadding","errorMessageIconRepeat","errorMessageIconPosition","helperTextColor","inputValueTextColor","inputCaretTextColor","labelRequiredIndicator","inputBorderColor","inputBorderWidth","inputBorderStyle","inputBorderRadius","inputHeight","inputHorizontalPadding","inputOutlineColor","inputOutlineStyle","inputTextAlign","inputPlaceholderColor","labelPosition","labelTopPosition","labelHorizontalPosition","inputTransformY","inputTransition","marginInlineStart","placeholderOpacity","inputVerticalAlignment","valueInputHeight","valueInputMarginBottom","inputIconOffset","inputIconSize","inputIconColor","inputAttrs","BaseInputClass","separator","attributeValue","attributeInput","inputValue","valueInput","mapping","entries","console","error","attribute","dispatchEvent","InputEvent","bubbles","composed","shadowRoot","inputs","removeButton","includeAttrs","mapAttrs","options","initRemoveButton","CustomEvent","getValidity","badInput","reportValidity","checkValidity","handleSeparatorChange","textContent","invalid","defaultErrorMsgValueMissing","isValidDataType","data","every","obj","Array","isArray","getOwnPropertyNames","keys","trim","e","labelValue","labelAttr","buttonLabel","addNewMappingItem","focusNewItem","newMappingItem","mappingsContainerEle","setCustomValidity","resetInvalidIndication","undefined","items","from","reduce","acc","item","currentItems","i","removeChild","index","mappingItem","labelsEle","buttonContainer","initLabels","initAddButton","isDisabled","button","onclick","isTrusted","contains","removeAttribute","bind","errorItem","find","validity","isInvalid","toggleAttribute","labels","labelsText","valueLabel","attrLabel","labelsContainer","MappingsFieldClass","separatorFontSize","labelsFontSize","labelsLineHeight","itemMarginBottom","valueLabelMinWidth","attrLabelMinWidth","labelsMarginBottom","separatorWidth","removeButtonWidth","inputEvent","proxyParentValidation","defaultValues","defaultValuesAttr","JSON","parse","message","setDefaultValues","initialDefaultValues","inputElement","template","content","groupInputElement","mappingsElement","handleMappingsInvalidChange","changedAttributes","includes","hasAttribute","initFocusHandler","group","groupInput","SamlGroupMappingsClass","groupNameInputMarginBottom","triggerValidationEvents","useHostExternalPadding","resetInputContainer","name","resetInputField","resetInputCursor","resetInputPlaceholder","resetInputFieldDefaultWidth","resetInputReadonlyStyle","resetInputFieldInvalidBackgroundColor","resetInputOverrides","resetInputAutoFill","resetInitialHeight","resetInputElement","resetInputFieldUnderlayingBorder","resetInputLabelPosition","inputFloatingLabelStyle"],"sourceRoot":""}

package/dist/umd/phone-fields-descope-phone-field-descope-phone-field-internal-index-js.js

@@ -1 +1,2 @@
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[2878],{69473:(t,e,n)=>{n.d(e,{T:()=>a,w:()=>c});var i=n(94619),s=n(93826),o=n(7138),r=n(14944),u=n(33177);const a=(0,r.xE)("text-field"),l=["type","label-type","copy-to-clipboard"],c=(0,o.Zz)((0,i.RF)({mappings:s.A}),i.VO,(0,i.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),i.tQ,(t=>class extends t{static get observedAttributes(){return l.concat(t.observedAttributes||[])}icon;init(){super.init?.()}renderCopyToClipboard(t){if(!t)return void this.icon?.remove();const e={icon:"vaadin:copy-o",title:"Copy",style:"cursor: pointer"},n={icon:"vaadin:check-circle-o",title:"Copied",style:"cursor: initial"};this.icon=Object.assign(document.createElement("vaadin-icon"),{slot:"suffix",...e}),this.baseElement.appendChild(this.icon),this.icon.addEventListener("click",(()=>{navigator.clipboard.writeText(this.value),Object.assign(this.icon,n),setTimeout((()=>{Object.assign(this.icon,e)}),5e3)}))}onLabelClick(){this.focus()}attributeChangedCallback(t,e,n){super.attributeChangeCallback?.(t,e,n),"type"===t&&this.baseElement._setType(n),e!==n&&("label-type"===t?"floating"===n?this.addEventListener("click",this.onLabelClick):this.removeEventListener("click",this.onLabelClick):"copy-to-clipboard"===t&&this.renderCopyToClipboard("true"===n))}}))((0,i.tz)({slots:["prefix","suffix"],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tpadding: calc(var(${c.cssVarList.inputOutlineWidth}) + var(${c.cssVarList.inputOutlineOffset}));\n        box-sizing: border-box;\n\t\t\t}\n      :host(:is([readonly], [disabled])) ::slotted(:is(input, textarea):placeholder-shown) {\n        opacity: 1;\n      }\n\n      vaadin-text-field[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n        opacity: 0;\n      }\n      vaadin-text-field[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n        opacity: 0;\n      }\n      ${(0,u.$J)("vaadin-text-field")}\n\t\t\t${(0,u.cy)(c.cssVarList)}\n\t\t\t${(0,u.LJ)("vaadin-text-field",c.cssVarList)}\n      ${(0,u.Kl)()}\n\n      vaadin-text-field vaadin-icon {\n        align-self: center;\n      }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:a}))},89348:(t,e,n)=>{n.r(e),n.d(e,{TextFieldClass:()=>i.w,componentName:()=>i.T}),n(63970),n(23638),n(80201);var i=n(69473);customElements.define(i.T,i.w)},32413:(t,e,n)=>{n.d(e,{A:()=>y,T:()=>u});var i=n(25827),s=n(14944),o=n(44066),r=n(41611);const u=(0,s.xE)("phone-field-internal"),a=["disabled","size","bordered","readonly","allow-alphanumeric-input"],l=["country-input-placeholder","default-code","restrict-countries"],c=["phone-input-placeholder","maxlength","autocomplete","name"],p=["label-type","country-input-label","label"],d={"country-input-label":"label","country-input-placeholder":"placeholder","phone-input-placeholder":"placeholder"},h=[].concat(a,l,c,p),b=(0,i.y)({componentName:u,baseSelector:"div"}),y=class extends b{static get observedAttributes(){return[].concat(b.observedAttributes||[],h)}constructor(){super(),this.innerHTML=`\n    <div class="wrapper">\n      <descope-combo-box\n        item-label-path="data-name"\n        item-value-path="data-id"\n      >\n      ${o.A.map((t=>(0,r.$B)(t))).join("")}\n      </descope-combo-box>\n      <div class="separator"></div>\n      <descope-text-field type="tel"></descope-text-field>\n    </div>\n    `,this.countryCodeInput=this.querySelector("descope-combo-box"),this.phoneNumberInput=this.querySelector("descope-text-field"),this.inputs=[this.countryCodeInput,this.phoneNumberInput],(0,s.EA)(this,this.countryCodeInput,{includeAttrs:["label-type"]}),(0,s.EA)(this,this.phoneNumberInput,{includeAttrs:["label-type","required"]}),this.countryCodeInput.customValueTransformFn=t=>{const[,e]=t?.split?.(" ")||[];return e}}get countryCodeInputData(){return this.countryCodeInput.items}get allowAlphanumericInput(){return"true"===this.getAttribute("allow-alphanumeric-input")}get value(){return this.phoneNumberValue?`${this.countryCodeInput.value}-${this.phoneNumberInput.value}`:""}set value(t){const[e,n]=(0,r.lq)(t);this.#t(e),this.#e(n)}setSelectionRange(...t){this.phoneNumberInput.setSelectionRange(...t)}get selectionStart(){return this.phoneNumberInput.selectionStart}#t(t){if(t){const e=this.getCountryByDialCode(t);e&&(this.countryCodeInput.selectedItem=e)}else this.countryCodeInput.selectedItem=void 0}#e(t){this.phoneNumberInput.value!==t&&(this.phoneNumberInput.value=t)}get phoneNumberValue(){return this.phoneNumberInput.value}get countryCodeValue(){return this.countryCodeInput.shadowRoot.querySelector("input").value}get phoneNumberInputEle(){return this.phoneNumberInput.shadowRoot.querySelector("input")}get minLength(){return parseInt(this.getAttribute("minlength"),10)||0}getValidity(){const t=this.countryCodeInput.value,e=this.phoneNumberInput.value,n=!t||!e,i=this.phoneNumberInput.value?.length&&this.phoneNumberInput.value.length<this.minLength;return this.isRequired&&n?{valueMissing:!0}:i?{tooShort:!0}:e&&!t?{valueMissing:!0}:{}}init(){this.addEventListener("focus",(t=>{t.isTrusted&&this.inputs[1].focus()})),super.init?.(),this.initInputs()}getRestrictedCountries(){const t=this.getAttribute("restrict-countries");return t?t.split(","):[]}getCountryByDialCode(t){return this.countryCodeInput.items?.find((e=>e.getAttribute("data-id")===t))}getCountryByCodeId(t){return this.countryCodeInput.items?.find((e=>e.getAttribute("data-country-code")===t))}updateCountryCodeItems(t){const e=t.length?o.A.filter((e=>t.includes(e.code))):o.A;this.querySelector("descope-combo-box").innerHTML=e.map((t=>(0,r.$B)(t))).join("")}handleDefaultCountryCode(t){if(!this.countryCodeInput.value){const e=this.getCountryByCodeId(t);e&&setTimeout((()=>{this.countryCodeInput.selectedItem=e}))}}initInputs(){this.phoneNumberInput.addEventListener("input",(t=>{if(t.stopPropagation(),!this.allowAlphanumericInput){const e=/^\d$/,n=t.target.value.split("").filter((t=>e.test(t))).join("");t.target.value=n}})),this.handleFocusEventsDispatching(this.inputs),this.handleInputEventDispatching()}handleLabelTypeAttrs(t,e){const n=d[t]||t;"label-type"===t?this.onLabelTypeChange(e):"floating"===this.getAttribute("label-type")&&("country-input-label"===t?this.countryCodeInput.setAttribute(n,e):"label"===t&&this.phoneNumberInput.setAttribute(n,e))}onLabelTypeChange(t){"floating"===t?(this.countryCodeInput.setAttribute("label",this.getAttribute("country-input-label")||""),this.countryCodeInput.setAttribute("placeholder",this.getAttribute("country-input-placeholder")||""),this.phoneNumberInput.setAttribute("label",this.getAttribute("label")||""),this.phoneNumberInput.setAttribute("placeholder",this.getAttribute("phone-input-placeholder")||"")):this.inputs.forEach((t=>t.removeAttribute("label")))}attributeChangedCallback(t,e,n){if(super.attributeChangedCallback(t,e,n),e!==n){if("default-code"===t&&n)this.handleDefaultCountryCode(n);else if(h.includes(t)){const e=d[t]||t;a.includes(t)?this.inputs.forEach((t=>t.setAttribute(e,n))):l.includes(t)?this.countryCodeInput.setAttribute(e,n):c.includes(t)&&this.phoneNumberInput.setAttribute(e,n)}p.includes(t)&&this.handleLabelTypeAttrs(t,n),"restrict-countries"===t&&this.updateCountryCodeItems(this.getRestrictedCountries())}}}},54930:(t,e,n)=>{n.r(e),n(11738),n(89348);var i=n(32413);customElements.define(i.T,i.A)},41611:(t,e,n)=>{n.d(e,{$B:()=>s,lq:()=>o});var i=n(94327);const s=({code:t,dialCode:e,name:n})=>`\n\t<div\n\t\tstyle="display:flex; flex-direction: column;"\n\t\tdata-id="${e}"\n\t\tdata-name="${t} ${e} ${n}"\n\t\tdata-country-code="${t}"\n\t>\n\t\t<div>\n\t\t\t<span>\n\t\t\t\t<img src="${(t=>`https://static.descope.com/npm/svg-country-flags@1.2.10/svg/${t.toLowerCase()}.svg`)(t)}" width="20"/>\n\t\t\t</span>\n\t\t\t<span>${n}</span>\n\t\t</div>\n\t\t<div>\n\t\t\t<span>${t}</span>\n\t\t\t<span>${e}</span>\n\t\t</div>\n\t</div>\n`,o=t=>{const e=t||"";let n="",s="";const o=(0,i.l)(e);if(o)o.countryCallingCode&&(n=`+${o.countryCallingCode}`),o.nationalNumber&&(s=o.nationalNumber);else{const[t,i]=e.split("-");n=t||"",s=i||""}return[n,s]}}}]);
+"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[2878],{79275:(t,e,n)=>{n.d(e,{T:()=>a,w:()=>c});var i=n(79365),s=n(6424),o=n(9696),r=n(97810),u=n(73551);const a=(0,r.xE)("text-field"),l=["type","label-type","copy-to-clipboard"],c=(0,o.Zz)((0,i.RF)({mappings:s.A}),i.VO,(0,i.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),i.tQ,(t=>class extends t{static get observedAttributes(){return l.concat(t.observedAttributes||[])}icon;init(){super.init?.()}renderCopyToClipboard(t){if(!t)return void this.icon?.remove();const e={icon:"vaadin:copy-o",title:"Copy",style:"cursor: pointer"},n={icon:"vaadin:check-circle-o",title:"Copied",style:"cursor: initial"};this.icon=Object.assign(document.createElement("vaadin-icon"),{slot:"suffix",...e}),this.baseElement.appendChild(this.icon),this.icon.addEventListener("click",(()=>{navigator.clipboard.writeText(this.value),Object.assign(this.icon,n),setTimeout((()=>{Object.assign(this.icon,e)}),5e3)}))}onLabelClick(){this.focus()}attributeChangedCallback(t,e,n){super.attributeChangeCallback?.(t,e,n),"type"===t&&this.baseElement._setType(n),e!==n&&("label-type"===t?"floating"===n?this.addEventListener("click",this.onLabelClick):this.removeEventListener("click",this.onLabelClick):"copy-to-clipboard"===t&&this.renderCopyToClipboard("true"===n))}}))((0,i.tz)({slots:["prefix","suffix"],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tpadding: calc(var(${c.cssVarList.inputOutlineWidth}) + var(${c.cssVarList.inputOutlineOffset}));\n        box-sizing: border-box;\n\t\t\t}\n      :host(:is([readonly], [disabled])) ::slotted(:is(input, textarea):placeholder-shown) {\n        opacity: 1;\n      }\n\n      vaadin-text-field[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n        opacity: 0;\n      }\n      vaadin-text-field[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n        opacity: 0;\n      }\n      ${(0,u.$J)("vaadin-text-field")}\n\t\t\t${(0,u.cy)(c.cssVarList)}\n\t\t\t${(0,u.LJ)("vaadin-text-field",c.cssVarList)}\n      ${(0,u.Kl)()}\n\n      vaadin-text-field vaadin-icon {\n        align-self: center;\n      }\n\t\t`,excludeAttrsSync:["tabindex","style"],componentName:a}))},21374:(t,e,n)=>{n.r(e),n.d(e,{TextFieldClass:()=>i.w,componentName:()=>i.T}),n(11284),n(37182),n(95260);var i=n(79275);customElements.define(i.T,i.w)},84015:(t,e,n)=>{n.d(e,{A:()=>y,T:()=>u});var i=n(3393),s=n(97810),o=n(51680),r=n(49157);const u=(0,s.xE)("phone-field-internal"),a=["disabled","size","bordered","readonly","allow-alphanumeric-input"],l=["country-input-placeholder","default-code","restrict-countries"],c=["phone-input-placeholder","maxlength","autocomplete","name"],p=["label-type","country-input-label","label"],d={"country-input-label":"label","country-input-placeholder":"placeholder","phone-input-placeholder":"placeholder"},h=[].concat(a,l,c,p),b=(0,i.y)({componentName:u,baseSelector:"div"}),y=class extends b{static get observedAttributes(){return[].concat(b.observedAttributes||[],h)}constructor(){super(),this.innerHTML=`\n    <div class="wrapper">\n      <descope-combo-box\n        item-label-path="data-name"\n        item-value-path="data-id"\n      >\n      ${o.A.map((t=>(0,r.$B)(t))).join("")}\n      </descope-combo-box>\n      <div class="separator"></div>\n      <descope-text-field type="tel"></descope-text-field>\n    </div>\n    `,this.countryCodeInput=this.querySelector("descope-combo-box"),this.phoneNumberInput=this.querySelector("descope-text-field"),this.inputs=[this.countryCodeInput,this.phoneNumberInput],(0,s.EA)(this,this.countryCodeInput,{includeAttrs:["label-type"]}),(0,s.EA)(this,this.phoneNumberInput,{includeAttrs:["label-type","required"]}),this.countryCodeInput.customValueTransformFn=t=>{const[,e]=t?.split?.(" ")||[];return e}}get countryCodeInputData(){return this.countryCodeInput.items}get allowAlphanumericInput(){return"true"===this.getAttribute("allow-alphanumeric-input")}get value(){return this.phoneNumberValue?`${this.countryCodeInput.value}-${this.phoneNumberInput.value}`:""}set value(t){const[e,n]=(0,r.lq)(t);this.#t(e),this.#e(n)}setSelectionRange(...t){this.phoneNumberInput.setSelectionRange(...t)}get selectionStart(){return this.phoneNumberInput.selectionStart}#t(t){if(t){const e=this.getCountryByDialCode(t);e&&(this.countryCodeInput.selectedItem=e)}else this.countryCodeInput.selectedItem=void 0}#e(t){this.phoneNumberInput.value!==t&&(this.phoneNumberInput.value=t)}get phoneNumberValue(){return this.phoneNumberInput.value}get countryCodeValue(){return this.countryCodeInput.shadowRoot.querySelector("input").value}get phoneNumberInputEle(){return this.phoneNumberInput.shadowRoot.querySelector("input")}get minLength(){return parseInt(this.getAttribute("minlength"),10)||0}getValidity(){const t=this.countryCodeInput.value,e=this.phoneNumberInput.value,n=!t||!e,i=this.phoneNumberInput.value?.length&&this.phoneNumberInput.value.length<this.minLength;return this.isRequired&&n?{valueMissing:!0}:i?{tooShort:!0}:e&&!t?{valueMissing:!0}:{}}init(){this.addEventListener("focus",(t=>{t.isTrusted&&this.inputs[1].focus()})),super.init?.(),this.initInputs()}getRestrictedCountries(){const t=this.getAttribute("restrict-countries");return t?t.split(","):[]}getCountryByDialCode(t){return this.countryCodeInput.items?.find((e=>e.getAttribute("data-id")===t))}getCountryByCodeId(t){return this.countryCodeInput.items?.find((e=>e.getAttribute("data-country-code")===t))}updateCountryCodeItems(t){const e=t.length?o.A.filter((e=>t.includes(e.code))):o.A;this.querySelector("descope-combo-box").innerHTML=e.map((t=>(0,r.$B)(t))).join("")}handleDefaultCountryCode(t){if(!this.countryCodeInput.value){const e=this.getCountryByCodeId(t);e&&setTimeout((()=>{this.countryCodeInput.selectedItem=e}))}}initInputs(){this.phoneNumberInput.addEventListener("input",(t=>{if(t.stopPropagation(),!this.allowAlphanumericInput){const e=/^\d$/,n=t.target.value.split("").filter((t=>e.test(t))).join("");t.target.value=n}})),this.handleFocusEventsDispatching(this.inputs),this.handleInputEventDispatching()}handleLabelTypeAttrs(t,e){const n=d[t]||t;"label-type"===t?this.onLabelTypeChange(e):"floating"===this.getAttribute("label-type")&&("country-input-label"===t?this.countryCodeInput.setAttribute(n,e):"label"===t&&this.phoneNumberInput.setAttribute(n,e))}onLabelTypeChange(t){"floating"===t?(this.countryCodeInput.setAttribute("label",this.getAttribute("country-input-label")||""),this.countryCodeInput.setAttribute("placeholder",this.getAttribute("country-input-placeholder")||""),this.phoneNumberInput.setAttribute("label",this.getAttribute("label")||""),this.phoneNumberInput.setAttribute("placeholder",this.getAttribute("phone-input-placeholder")||"")):this.inputs.forEach((t=>t.removeAttribute("label")))}attributeChangedCallback(t,e,n){if(super.attributeChangedCallback(t,e,n),e!==n){if("default-code"===t&&n)this.handleDefaultCountryCode(n);else if(h.includes(t)){const e=d[t]||t;a.includes(t)?this.inputs.forEach((t=>t.setAttribute(e,n))):l.includes(t)?this.countryCodeInput.setAttribute(e,n):c.includes(t)&&this.phoneNumberInput.setAttribute(e,n)}p.includes(t)&&this.handleLabelTypeAttrs(t,n),"restrict-countries"===t&&this.updateCountryCodeItems(this.getRestrictedCountries())}}}},92132:(t,e,n)=>{n.r(e),n(27092),n(21374);var i=n(84015);customElements.define(i.T,i.A)},49157:(t,e,n)=>{n.d(e,{$B:()=>s,lq:()=>o});var i=n(10473);const s=({code:t,dialCode:e,name:n})=>`\n\t<div\n\t\tdata-id="${e}"\n\t\tdata-name="${t} ${e} ${n}"\n\t\tdata-country-code="${t}"\n\t>\n\t\t<div>\n\t\t\t<span>\n\t\t\t\t<img src="${(t=>`https://static.descope.com/npm/svg-country-flags@1.2.10/svg/${t.toLowerCase()}.svg`)(t)}" width="20"/>\n\t\t\t</span>\n\t\t\t<span>${n}</span>\n\t\t</div>\n\t\t<div>\n\t\t\t<span>${t}</span>\n\t\t\t<span>${e}</span>\n\t\t</div>\n\t</div>\n`,o=t=>{const e=t||"";let n="",s="";const o=(0,i.l)(e);if(o)o.countryCallingCode&&(n=`+${o.countryCallingCode}`),o.nationalNumber&&(s=o.nationalNumber);else{const[t,i]=e.split("-");n=t||"",s=i||""}return[n,s]}}}]);
+//# sourceMappingURL=phone-fields-descope-phone-field-descope-phone-field-internal-index-js.js.map

package/dist/umd/phone-fields-descope-phone-field-descope-phone-field-internal-index-js.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"phone-fields-descope-phone-field-descope-phone-field-internal-index-js.js","mappings":"2NAiBO,MAAMA,GAAgB,QAAiB,cAExCC,EAAgB,CAAC,OAAQ,aAAc,qBA+EhCC,GAAiB,SAC5B,QAAiB,CACfC,SAAU,MAEZ,MACA,QAAgB,CAAEC,WAAY,CAAC,QAAS,kBAAmBC,iBAAiB,IAC5E,MAnFmBC,GACnB,cAA6BA,EAC3B,6BAAWC,GACT,OAAON,EAAcO,OAAOF,EAAWC,oBAAsB,GAC/D,CAEAE,KAEA,IAAAC,GACEC,MAAMD,QACR,CAEA,qBAAAE,CAAsBC,GACpB,IAAKA,EAEH,YADAC,KAAKL,MAAMM,SAIb,MAAMC,EAAiB,CACrBP,KAAM,gBACNQ,MAAO,OACPC,MAAO,mBAGHC,EAAmB,CACvBV,KAAM,wBACNQ,MAAO,SACPC,MAAO,mBAGTJ,KAAKL,KAAOW,OAAOC,OAAOC,SAASC,cAAc,eAAgB,CAC/DC,KAAM,YACHR,IAGLF,KAAKW,YAAYC,YAAYZ,KAAKL,MAClCK,KAAKL,KAAKkB,iBAAiB,SAAS,KAClCC,UAAUC,UAAUC,UAAUhB,KAAKiB,OACnCX,OAAOC,OAAOP,KAAKL,KAAMU,GAGzBa,YAAW,KACTZ,OAAOC,OAAOP,KAAKL,KAAMO,EAAe,GACvC,IAAK,GAEZ,CAEA,YAAAiB,GACEnB,KAAKoB,OACP,CAEA,wBAAAC,CAAyBC,EAAUC,EAAQC,GACzC3B,MAAM4B,0BAA0BH,EAAUC,EAAQC,GAOjC,SAAbF,GACFtB,KAAKW,YAAYe,SAASF,GAGxBD,IAAWC,IACI,eAAbF,EACa,aAAXE,EACFxB,KAAKa,iBAAiB,QAASb,KAAKmB,cAEpCnB,KAAK2B,oBAAoB,QAAS3B,KAAKmB,cAEnB,sBAAbG,GACTtB,KAAKF,sBAAiC,SAAX0B,GAGjC,IAG0B,EAS5B,QAAY,CACVI,MAAO,CAAC,SAAU,UAClBC,eAAgB,oBAChBzB,MAAO,IAAM,wGAIOhB,EAAe0C,WAAWC,4BACxC3C,EAAe0C,WAAWE,+cAc5B,QAAwB,gCAC3B,QAAuB5C,EAAe0C,uBACtC,QAAoB,oBAAqB1C,EAAe0C,uBACrD,iGAMJG,iBAAkB,CAAC,WAAY,SAC/B/C,kB,yHCrIJgD,eAAeC,OAAO,IAAe,I,0FCD9B,MAAMjD,GAAgB,QAAiB,wBAExCkD,EAAc,CAAC,WAAY,OAAQ,WAAY,WAAY,4BAC3DC,EAAe,CAAC,4BAA6B,eAAgB,sBAC7DC,EAAa,CAAC,0BAA2B,YAAa,eAAgB,QACtEC,EAAiB,CAAC,aAAc,sBAAuB,SACvDC,EAAW,CACf,sBAAuB,QACvB,4BAA6B,cAC7B,0BAA2B,eAGvBC,EAAoB,GAAG/C,OAAO0C,EAAaC,EAAcC,EAAYC,GAErEG,GAAiB,OAAqB,CAAExD,gBAAeyD,aAAc,QA+P3E,EA7PA,cAAiCD,EAC/B,6BAAWjD,GACT,MAAO,GAAGC,OAAOgD,EAAejD,oBAAsB,GAAIgD,EAC5D,CAEA,WAAAG,GACE/C,QAEAG,KAAK6C,UAAY,iJAMb,IAAaC,KAAKC,IAAS,QAAaA,KAAOC,KAAK,qJAOxDhD,KAAKiD,iBAAmBjD,KAAKkD,cAAc,qBAC3ClD,KAAKmD,iBAAmBnD,KAAKkD,cAAc,sBAC3ClD,KAAKoD,OAAS,CAACpD,KAAKiD,iBAAkBjD,KAAKmD,mBAE3C,QAAanD,KAAMA,KAAKiD,iBAAkB,CAAEI,aAAc,CAAC,iBAC3D,QAAarD,KAAMA,KAAKmD,iBAAkB,CAAEE,aAAc,CAAC,aAAc,cAGzErD,KAAKiD,iBAAiBK,uBAA0BC,IAC9C,MAAO,CAAEC,GAAYD,GAAKE,QAAQ,MAAQ,GAC1C,OAAOD,CAAQ,CAEnB,CAEA,wBAAIE,GACF,OAAO1D,KAAKiD,iBAAiBU,KAC/B,CAEA,0BAAIC,GACF,MAAyD,SAAlD5D,KAAK6D,aAAa,2BAC3B,CAEA,SAAI5C,GACF,OAAKjB,KAAK8D,iBAGH,GAAG9D,KAAKiD,iBAAiBhC,SAASjB,KAAKmD,iBAAiBlC,QAFtD,EAGX,CAEA,SAAIA,CAAMsC,GACR,MAAOQ,EAAaC,IAAe,QAAiBT,GAEpDvD,MAAK,EAAgB+D,GACrB/D,MAAK,EAAgBgE,EACvB,CAEA,iBAAAC,IAAqBC,GACnBlE,KAAKmD,iBAAiBc,qBAAqBC,EAC7C,CAEA,kBAAIC,GACF,OAAOnE,KAAKmD,iBAAiBgB,cAC/B,CAEA,GAAgBZ,GACd,GAAIA,EAAK,CACP,MAAMa,EAAkBpE,KAAKqE,qBAAqBd,GAC9Ca,IACFpE,KAAKiD,iBAAiBqB,aAAeF,EAEzC,MACEpE,KAAKiD,iBAAiBqB,kBAAeC,CAEzC,CAEA,GAAgBhB,GACVvD,KAAKmD,iBAAiBlC,QAAUsC,IAIpCvD,KAAKmD,iBAAiBlC,MAAQsC,EAChC,CAEA,oBAAIO,GACF,OAAO9D,KAAKmD,iBAAiBlC,KAC/B,CAEA,oBAAIuD,GACF,OAAOxE,KAAKiD,iBAAiBwB,WAAWvB,cAAc,SAASjC,KACjE,CAEA,uBAAIyD,GACF,OAAO1E,KAAKmD,iBAAiBsB,WAAWvB,cAAc,QACxD,CAEA,aAAIyB,GACF,OAAOC,SAAS5E,KAAK6D,aAAa,aAAc,KAAO,CACzD,CAEA,WAAAgB,GACE,MAAMC,EAAU9E,KAAKiD,iBAAiBhC,MAChC8D,EAAW/E,KAAKmD,iBAAiBlC,MACjC+D,GAAcF,IAAYC,EAC1BE,EACJjF,KAAKmD,iBAAiBlC,OAAOiE,QAAUlF,KAAKmD,iBAAiBlC,MAAMiE,OAASlF,KAAK2E,UAEnF,OAAI3E,KAAKmF,YAAcH,EACd,CAAEI,cAAc,GAErBH,EACK,CAAEI,UAAU,GAEjBN,IAAaD,EACR,CAAEM,cAAc,GAElB,CAAC,CACV,CAEA,IAAAxF,GACEI,KAAKa,iBAAiB,SAAUyE,IAE1BA,EAAEC,WAAWvF,KAAKoD,OAAO,GAAGhC,OAAO,IAGzCvB,MAAMD,SACNI,KAAKwF,YACP,CAEA,sBAAAC,GACE,MAAMC,EAAO1F,KAAK6D,aAAa,sBAC/B,OAAO6B,EAAOA,EAAKjC,MAAM,KAAO,EAClC,CAEA,oBAAAY,CAAqBsB,GACnB,OAAO3F,KAAKiD,iBAAiBU,OAAOiC,MAAMC,GAAMA,EAAEhC,aAAa,aAAe8B,GAChF,CAEA,kBAAAG,CAAmB/B,GACjB,OAAO/D,KAAKiD,iBAAiBU,OAAOiC,MACjCC,GAAMA,EAAEhC,aAAa,uBAAyBE,GAEnD,CAEA,sBAAAgC,CAAuBC,GACrB,MAAMrC,EAAQqC,EAAkBd,OAC5B,IAAae,QAAQJ,GAAMG,EAAkBE,SAASL,EAAEM,QACxD,IACJnG,KAAKkD,cAAc,qBAAqBL,UAAYc,EACjDb,KAAKC,IAAS,QAAaA,KAC3BC,KAAK,GACV,CAEA,wBAAAoD,CAAyBrC,GACvB,IAAK/D,KAAKiD,iBAAiBhC,MAAO,CAChC,MAAMmD,EAAkBpE,KAAK8F,mBAAmB/B,GAI5CK,GACFlD,YAAW,KACTlB,KAAKiD,iBAAiBqB,aAAeF,CAAe,GAG1D,CACF,CAEA,UAAAoB,GAEExF,KAAKmD,iBAAiBtC,iBAAiB,SAAUyE,IAI/C,GAFAA,EAAEe,mBAEGrG,KAAK4D,uBAAwB,CAChC,MAAM0C,EAAkB,OAClBC,EAAiBjB,EAAEkB,OAAOvF,MAC7BwC,MAAM,IACNwC,QAAQQ,GAASH,EAAgBI,KAAKD,KACtCzD,KAAK,IACRsC,EAAEkB,OAAOvF,MAAQsF,CACnB,KAGFvG,KAAK2G,6BAA6B3G,KAAKoD,QACvCpD,KAAK4G,6BACP,CAEA,oBAAAC,CAAqBvF,EAAUwF,GAE7B,MAAMpB,EAAOlD,EAASlB,IAAaA,EAElB,eAAbA,EACFtB,KAAK+G,kBAAkBD,GAIoB,aAApC9G,KAAK6D,aAAa,gBACR,wBAAbvC,EACFtB,KAAKiD,iBAAiB+D,aAAatB,EAAMoB,GACnB,UAAbxF,GACTtB,KAAKmD,iBAAiB6D,aAAatB,EAAMoB,GAG/C,CAEA,iBAAAC,CAAkBD,GACC,aAAbA,GAEF9G,KAAKiD,iBAAiB+D,aAAa,QAAShH,KAAK6D,aAAa,wBAA0B,IACxF7D,KAAKiD,iBAAiB+D,aACpB,cACAhH,KAAK6D,aAAa,8BAAgC,IAEpD7D,KAAKmD,iBAAiB6D,aAAa,QAAShH,KAAK6D,aAAa,UAAY,IAC1E7D,KAAKmD,iBAAiB6D,aACpB,cACAhH,KAAK6D,aAAa,4BAA8B,KAIlD7D,KAAKoD,OAAO6D,SAASC,GAAUA,EAAMC,gBAAgB,UAEzD,CAEA,wBAAA9F,CAAyBC,EAAU8F,EAAUN,GAG3C,GAFAjH,MAAMwB,yBAAyBC,EAAU8F,EAAUN,GAE/CM,IAAaN,EAAU,CACzB,GAAiB,iBAAbxF,GAA+BwF,EACjC9G,KAAKoG,yBAAyBU,QACzB,GAAIrE,EAAkByD,SAAS5E,GAAW,CAC/C,MAAMoE,EAAOlD,EAASlB,IAAaA,EAE/Bc,EAAY8D,SAAS5E,GACvBtB,KAAKoD,OAAO6D,SAASC,GAAUA,EAAMF,aAAatB,EAAMoB,KAC/CzE,EAAa6D,SAAS5E,GAC/BtB,KAAKiD,iBAAiB+D,aAAatB,EAAMoB,GAChCxE,EAAW4D,SAAS5E,IAC7BtB,KAAKmD,iBAAiB6D,aAAatB,EAAMoB,EAE7C,CAEIvE,EAAe2D,SAAS5E,IAC1BtB,KAAK6G,qBAAqBvF,EAAUwF,GAGrB,uBAAbxF,GACFtB,KAAK+F,uBAAuB/F,KAAKyF,yBAErC,CACF,E,0DC1QFvD,eAAeC,OAAO,IAAe,I,4DCD9B,MAGMkF,EAAe,EAAGlB,OAAM3C,WAAU8D,KAAMC,KAAc,0BAEtD/D,sBACE2C,KAAQ3C,KAAY+D,8BACZpB,uDAPO,CAACA,GAC7B,+DAA+DA,EAAKqB,oBAUtDC,CAAetB,gDAEpBoB,gDAGApB,yBACA3C,mCAKEkE,EAAoBnE,IAC/B,MAAMtC,EAAQsC,GAAO,GACrB,IAAIQ,EAAc,GACdC,EAAc,GAGlB,MAAM2D,GAAS,OAA2B1G,GAE1C,GAAI0G,EACEA,EAAOC,qBACT7D,EAAc,IAAI4D,EAAOC,sBAGvBD,EAAOE,iBACT7D,EAAc2D,EAAOE,oBAElB,CAEL,MAAON,EAASO,GAAS7G,EAAMwC,MAAM,KACrCM,EAAcwD,GAAW,GACzBvD,EAAc8D,GAAS,EACzB,CAEA,MAAO,CAAC/D,EAAaC,EAAY,C","sources":["webpack://@descope/web-components-ui/./src/components/descope-text-field/TextFieldClass.js","webpack://@descope/web-components-ui/./src/components/descope-text-field/index.js","webpack://@descope/web-components-ui/./src/components/phone-fields/descope-phone-field/descope-phone-field-internal/PhoneFieldInternal.js","webpack://@descope/web-components-ui/./src/components/phone-fields/descope-phone-field/descope-phone-field-internal/index.js","webpack://@descope/web-components-ui/./src/components/phone-fields/descope-phone-field/helpers.js"],"sourcesContent":["import {\n  createStyleMixin,\n  draggableMixin,\n  createProxy,\n  proxyInputMixin,\n  componentNameValidationMixin,\n} from '../../mixins';\nimport textFieldMappings from './textFieldMappings';\nimport { compose } from '../../helpers';\nimport { getComponentName } from '../../helpers/componentHelpers';\nimport {\n  inputFloatingLabelStyle,\n  resetInputLabelPosition,\n  resetInputOverrides,\n  useHostExternalPadding,\n} from '../../helpers/themeHelpers/resetHelpers';\n\nexport const componentName = getComponentName('text-field');\n\nconst observedAttrs = ['type', 'label-type', 'copy-to-clipboard'];\n\nconst customMixin = (superclass) =>\n  class TextFieldClass extends superclass {\n    static get observedAttributes() {\n      return observedAttrs.concat(superclass.observedAttributes || []);\n    }\n\n    icon;\n\n    init() {\n      super.init?.();\n    }\n\n    renderCopyToClipboard(shouldRender) {\n      if (!shouldRender) {\n        this.icon?.remove();\n        return;\n      }\n\n      const iconInitConfig = {\n        icon: 'vaadin:copy-o',\n        title: 'Copy',\n        style: 'cursor: pointer',\n      };\n\n      const iconCopiedConfig = {\n        icon: 'vaadin:check-circle-o',\n        title: 'Copied',\n        style: 'cursor: initial',\n      };\n\n      this.icon = Object.assign(document.createElement('vaadin-icon'), {\n        slot: 'suffix',\n        ...iconInitConfig,\n      });\n\n      this.baseElement.appendChild(this.icon);\n      this.icon.addEventListener('click', () => {\n        navigator.clipboard.writeText(this.value);\n        Object.assign(this.icon, iconCopiedConfig);\n\n        // we want the icon to go back to the initial state after 5 seconds\n        setTimeout(() => {\n          Object.assign(this.icon, iconInitConfig);\n        }, 5000);\n      });\n    }\n\n    onLabelClick() {\n      this.focus();\n    }\n\n    attributeChangedCallback(attrName, oldVal, newVal) {\n      super.attributeChangeCallback?.(attrName, oldVal, newVal);\n\n      // Vaadin doesn't allow to change the input type attribute.\n      // We need the ability to do that, so we're overriding their\n      // behavior with their private API.\n      // When receiving a `type` attribute, we use their private API\n      // to set it on the input.\n      if (attrName === 'type') {\n        this.baseElement._setType(newVal);\n      }\n\n      if (oldVal !== newVal) {\n        if (attrName === 'label-type') {\n          if (newVal === 'floating') {\n            this.addEventListener('click', this.onLabelClick);\n          } else {\n            this.removeEventListener('click', this.onLabelClick);\n          }\n        } else if (attrName === 'copy-to-clipboard') {\n          this.renderCopyToClipboard(newVal === 'true');\n        }\n      }\n    }\n  };\n\nexport const TextFieldClass = compose(\n  createStyleMixin({\n    mappings: textFieldMappings,\n  }),\n  draggableMixin,\n  proxyInputMixin({ proxyProps: ['value', 'selectionStart'], useProxyTargets: true }),\n  componentNameValidationMixin,\n  customMixin\n)(\n  createProxy({\n    slots: ['prefix', 'suffix'],\n    wrappedEleName: 'vaadin-text-field',\n    style: () => `\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tpadding: calc(var(${TextFieldClass.cssVarList.inputOutlineWidth}) + var(${\n          TextFieldClass.cssVarList.inputOutlineOffset\n        }));\n        box-sizing: border-box;\n\t\t\t}\n      :host(:is([readonly], [disabled])) ::slotted(:is(input, textarea):placeholder-shown) {\n        opacity: 1;\n      }\n\n      vaadin-text-field[label-type=\"floating\"]:not([focused])[readonly] > input:placeholder-shown {\n        opacity: 0;\n      }\n      vaadin-text-field[label-type=\"floating\"]:not([focused])[disabled] > input:placeholder-shown {\n        opacity: 0;\n      }\n      ${resetInputLabelPosition('vaadin-text-field')}\n\t\t\t${useHostExternalPadding(TextFieldClass.cssVarList)}\n\t\t\t${resetInputOverrides('vaadin-text-field', TextFieldClass.cssVarList)}\n      ${inputFloatingLabelStyle()}\n\n      vaadin-text-field vaadin-icon {\n        align-self: center;\n      }\n\t\t`,\n    excludeAttrsSync: ['tabindex', 'style'],\n    componentName,\n  })\n);\n","import '@vaadin/text-field';\nimport '@vaadin/icons';\nimport '@vaadin/icon';\n\nimport { componentName, TextFieldClass } from './TextFieldClass';\n\ncustomElements.define(componentName, TextFieldClass);\n\nexport { TextFieldClass, componentName };\n","import { createBaseInputClass } from '../../../../baseClasses/createBaseInputClass';\nimport { forwardAttrs, getComponentName } from '../../../../helpers/componentHelpers';\nimport CountryCodes from '../../CountryCodes';\nimport { comboBoxItem, parsePhoneNumber } from '../helpers';\n\nexport const componentName = getComponentName('phone-field-internal');\n\nconst commonAttrs = ['disabled', 'size', 'bordered', 'readonly', 'allow-alphanumeric-input'];\nconst countryAttrs = ['country-input-placeholder', 'default-code', 'restrict-countries'];\nconst phoneAttrs = ['phone-input-placeholder', 'maxlength', 'autocomplete', 'name'];\nconst labelTypeAttrs = ['label-type', 'country-input-label', 'label'];\nconst mapAttrs = {\n  'country-input-label': 'label',\n  'country-input-placeholder': 'placeholder',\n  'phone-input-placeholder': 'placeholder',\n};\n\nconst inputRelatedAttrs = [].concat(commonAttrs, countryAttrs, phoneAttrs, labelTypeAttrs);\n\nconst BaseInputClass = createBaseInputClass({ componentName, baseSelector: 'div' });\n\nclass PhoneFieldInternal extends BaseInputClass {\n  static get observedAttributes() {\n    return [].concat(BaseInputClass.observedAttributes || [], inputRelatedAttrs);\n  }\n\n  constructor() {\n    super();\n\n    this.innerHTML = `\n    <div class=\"wrapper\">\n      <descope-combo-box\n        item-label-path=\"data-name\"\n        item-value-path=\"data-id\"\n      >\n      ${CountryCodes.map((item) => comboBoxItem(item)).join('')}\n      </descope-combo-box>\n      <div class=\"separator\"></div>\n      <descope-text-field type=\"tel\"></descope-text-field>\n    </div>\n    `;\n\n    this.countryCodeInput = this.querySelector('descope-combo-box');\n    this.phoneNumberInput = this.querySelector('descope-text-field');\n    this.inputs = [this.countryCodeInput, this.phoneNumberInput];\n\n    forwardAttrs(this, this.countryCodeInput, { includeAttrs: ['label-type'] });\n    forwardAttrs(this, this.phoneNumberInput, { includeAttrs: ['label-type', 'required'] });\n\n    // override combo box setter to display dialCode value in input\n    this.countryCodeInput.customValueTransformFn = (val) => {\n      const [, dialCode] = val?.split?.(' ') || [];\n      return dialCode;\n    };\n  }\n\n  get countryCodeInputData() {\n    return this.countryCodeInput.items;\n  }\n\n  get allowAlphanumericInput() {\n    return this.getAttribute('allow-alphanumeric-input') === 'true';\n  }\n\n  get value() {\n    if (!this.phoneNumberValue) {\n      return '';\n    }\n    return `${this.countryCodeInput.value}-${this.phoneNumberInput.value}`;\n  }\n\n  set value(val) {\n    const [countryCode, phoneNumber] = parsePhoneNumber(val);\n\n    this.#setCountryCode(countryCode);\n    this.#setPhoneNumber(phoneNumber);\n  }\n\n  setSelectionRange(...args) {\n    this.phoneNumberInput.setSelectionRange(...args);\n  }\n\n  get selectionStart() {\n    return this.phoneNumberInput.selectionStart;\n  }\n\n  #setCountryCode(val) {\n    if (val) {\n      const countryCodeItem = this.getCountryByDialCode(val);\n      if (countryCodeItem) {\n        this.countryCodeInput.selectedItem = countryCodeItem;\n      }\n    } else {\n      this.countryCodeInput.selectedItem = undefined;\n    }\n  }\n\n  #setPhoneNumber(val) {\n    if (this.phoneNumberInput.value === val) {\n      return;\n    }\n\n    this.phoneNumberInput.value = val;\n  }\n\n  get phoneNumberValue() {\n    return this.phoneNumberInput.value;\n  }\n\n  get countryCodeValue() {\n    return this.countryCodeInput.shadowRoot.querySelector('input').value;\n  }\n\n  get phoneNumberInputEle() {\n    return this.phoneNumberInput.shadowRoot.querySelector('input');\n  }\n\n  get minLength() {\n    return parseInt(this.getAttribute('minlength'), 10) || 0;\n  }\n\n  getValidity() {\n    const hasCode = this.countryCodeInput.value;\n    const hasPhone = this.phoneNumberInput.value;\n    const emptyValue = !hasCode || !hasPhone;\n    const hasMinPhoneLength =\n      this.phoneNumberInput.value?.length && this.phoneNumberInput.value.length < this.minLength;\n\n    if (this.isRequired && emptyValue) {\n      return { valueMissing: true };\n    }\n    if (hasMinPhoneLength) {\n      return { tooShort: true };\n    }\n    if (hasPhone && !hasCode) {\n      return { valueMissing: true };\n    }\n    return {};\n  }\n\n  init() {\n    this.addEventListener('focus', (e) => {\n      // we want to ignore focus events we are dispatching\n      if (e.isTrusted) this.inputs[1].focus();\n    });\n\n    super.init?.();\n    this.initInputs();\n  }\n\n  getRestrictedCountries() {\n    const attr = this.getAttribute('restrict-countries');\n    return attr ? attr.split(',') : [];\n  }\n\n  getCountryByDialCode(countryDialCode) {\n    return this.countryCodeInput.items?.find((c) => c.getAttribute('data-id') === countryDialCode);\n  }\n\n  getCountryByCodeId(countryCode) {\n    return this.countryCodeInput.items?.find(\n      (c) => c.getAttribute('data-country-code') === countryCode\n    );\n  }\n\n  updateCountryCodeItems(restrictCountries) {\n    const items = restrictCountries.length\n      ? CountryCodes.filter((c) => restrictCountries.includes(c.code))\n      : CountryCodes;\n    this.querySelector('descope-combo-box').innerHTML = items\n      .map((item) => comboBoxItem(item))\n      .join('');\n  }\n\n  handleDefaultCountryCode(countryCode) {\n    if (!this.countryCodeInput.value) {\n      const countryCodeItem = this.getCountryByCodeId(countryCode);\n      // When replacing the input component (inserting internal component into text-field) -\n      // Vaadin resets the input's value. We use setTimeout in order to make sure this happens\n      // after the reset.\n      if (countryCodeItem) {\n        setTimeout(() => {\n          this.countryCodeInput.selectedItem = countryCodeItem;\n        });\n      }\n    }\n  }\n\n  initInputs() {\n    // Sanitize phone input value to filter everything but digits\n    this.phoneNumberInput.addEventListener('input', (e) => {\n      // we want to update only phoneNumberInput, and avoid triggering `set value`\n      e.stopPropagation();\n\n      if (!this.allowAlphanumericInput) {\n        const telDigitsRegExp = /^\\d$/;\n        const sanitizedInput = e.target.value\n          .split('')\n          .filter((char) => telDigitsRegExp.test(char))\n          .join('');\n        e.target.value = sanitizedInput;\n      }\n    });\n\n    this.handleFocusEventsDispatching(this.inputs);\n    this.handleInputEventDispatching();\n  }\n\n  handleLabelTypeAttrs(attrName, newValue) {\n    // set or remove label attributes from inner text/combo components on `label-type` change\n    const attr = mapAttrs[attrName] || attrName;\n\n    if (attrName === 'label-type') {\n      this.onLabelTypeChange(newValue);\n    }\n    // on inner components label attr change - set label attributes for text/combo components\n    // only if label-type is `floating`\n    else if (this.getAttribute('label-type') === 'floating') {\n      if (attrName === 'country-input-label') {\n        this.countryCodeInput.setAttribute(attr, newValue);\n      } else if (attrName === 'label') {\n        this.phoneNumberInput.setAttribute(attr, newValue);\n      }\n    }\n  }\n\n  onLabelTypeChange(newValue) {\n    if (newValue === 'floating') {\n      // on change to `floating` label - set inner components `label` and `placeholder`\n      this.countryCodeInput.setAttribute('label', this.getAttribute('country-input-label') || '');\n      this.countryCodeInput.setAttribute(\n        'placeholder',\n        this.getAttribute('country-input-placeholder') || ''\n      );\n      this.phoneNumberInput.setAttribute('label', this.getAttribute('label') || '');\n      this.phoneNumberInput.setAttribute(\n        'placeholder',\n        this.getAttribute('phone-input-placeholder') || ''\n      );\n    } else {\n      // for other cases - reset inner components label-type and labels\n      this.inputs.forEach((input) => input.removeAttribute('label'));\n    }\n  }\n\n  attributeChangedCallback(attrName, oldValue, newValue) {\n    super.attributeChangedCallback(attrName, oldValue, newValue);\n\n    if (oldValue !== newValue) {\n      if (attrName === 'default-code' && newValue) {\n        this.handleDefaultCountryCode(newValue);\n      } else if (inputRelatedAttrs.includes(attrName)) {\n        const attr = mapAttrs[attrName] || attrName;\n\n        if (commonAttrs.includes(attrName)) {\n          this.inputs.forEach((input) => input.setAttribute(attr, newValue));\n        } else if (countryAttrs.includes(attrName)) {\n          this.countryCodeInput.setAttribute(attr, newValue);\n        } else if (phoneAttrs.includes(attrName)) {\n          this.phoneNumberInput.setAttribute(attr, newValue);\n        }\n      }\n\n      if (labelTypeAttrs.includes(attrName)) {\n        this.handleLabelTypeAttrs(attrName, newValue);\n      }\n\n      if (attrName === 'restrict-countries') {\n        this.updateCountryCodeItems(this.getRestrictedCountries());\n      }\n    }\n  }\n}\n\nexport default PhoneFieldInternal;\n","import '@descope-ui/descope-combo-box';\nimport '../../../descope-text-field';\n\nimport PhoneFieldInternal, { componentName } from './PhoneFieldInternal';\n\ncustomElements.define(componentName, PhoneFieldInternal);\n","import { parsePhoneNumberFromString } from 'libphonenumber-js/min';\n\n// We use JSDelivr (proxy by static.descope.com) in order to fetch the images as image file from this library (svg-country-flags)\n// This reduces our bundle size, and we use it as a static remote resource.\nexport const getCountryFlag = (code) =>\n  `https://static.descope.com/npm/svg-country-flags@1.2.10/svg/${code.toLowerCase()}.svg`;\n\nexport const comboBoxItem = ({ code, dialCode, name: country }) => `\n\t<div\n\t\tdata-id=\"${dialCode}\"\n\t\tdata-name=\"${code} ${dialCode} ${country}\"\n\t\tdata-country-code=\"${code}\"\n\t>\n\t\t<div>\n\t\t\t<span>\n\t\t\t\t<img src=\"${getCountryFlag(code)}\" width=\"20\"/>\n\t\t\t</span>\n\t\t\t<span>${country}</span>\n\t\t</div>\n\t\t<div>\n\t\t\t<span>${code}</span>\n\t\t\t<span>${dialCode}</span>\n\t\t</div>\n\t</div>\n`;\n\nexport const parsePhoneNumber = (val) => {\n  const value = val || '';\n  let countryCode = '';\n  let phoneNumber = '';\n\n  // Attempt to parse the value using libphonenumber-js\n  const parsed = parsePhoneNumberFromString(value);\n\n  if (parsed) {\n    if (parsed.countryCallingCode) {\n      countryCode = `+${parsed.countryCallingCode}`;\n    }\n\n    if (parsed.nationalNumber) {\n      phoneNumber = parsed.nationalNumber;\n    }\n  } else {\n    // Fallback: assume a dash separates country code and phone number\n    const [country, phone] = value.split('-');\n    countryCode = country || '';\n    phoneNumber = phone || '';\n  }\n\n  return [countryCode, phoneNumber];\n};\n"],"names":["componentName","observedAttrs","TextFieldClass","mappings","proxyProps","useProxyTargets","superclass","observedAttributes","concat","icon","init","super","renderCopyToClipboard","shouldRender","this","remove","iconInitConfig","title","style","iconCopiedConfig","Object","assign","document","createElement","slot","baseElement","appendChild","addEventListener","navigator","clipboard","writeText","value","setTimeout","onLabelClick","focus","attributeChangedCallback","attrName","oldVal","newVal","attributeChangeCallback","_setType","removeEventListener","slots","wrappedEleName","cssVarList","inputOutlineWidth","inputOutlineOffset","excludeAttrsSync","customElements","define","commonAttrs","countryAttrs","phoneAttrs","labelTypeAttrs","mapAttrs","inputRelatedAttrs","BaseInputClass","baseSelector","constructor","innerHTML","map","item","join","countryCodeInput","querySelector","phoneNumberInput","inputs","includeAttrs","customValueTransformFn","val","dialCode","split","countryCodeInputData","items","allowAlphanumericInput","getAttribute","phoneNumberValue","countryCode","phoneNumber","setSelectionRange","args","selectionStart","countryCodeItem","getCountryByDialCode","selectedItem","undefined","countryCodeValue","shadowRoot","phoneNumberInputEle","minLength","parseInt","getValidity","hasCode","hasPhone","emptyValue","hasMinPhoneLength","length","isRequired","valueMissing","tooShort","e","isTrusted","initInputs","getRestrictedCountries","attr","countryDialCode","find","c","getCountryByCodeId","updateCountryCodeItems","restrictCountries","filter","includes","code","handleDefaultCountryCode","stopPropagation","telDigitsRegExp","sanitizedInput","target","char","test","handleFocusEventsDispatching","handleInputEventDispatching","handleLabelTypeAttrs","newValue","onLabelTypeChange","setAttribute","forEach","input","removeAttribute","oldValue","comboBoxItem","name","country","toLowerCase","getCountryFlag","parsePhoneNumber","parsed","countryCallingCode","nationalNumber","phone"],"sourceRoot":""}

package/dist/umd/phone-fields-descope-phone-field-index-js.js

@@ -1 +1,2 @@
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[2878,9894],{69473:(t,e,n)=>{n.d(e,{T:()=>l,w:()=>d});var o=n(94619),i=n(93826),r=n(7138),a=n(14944),s=n(33177);const l=(0,a.xE)("text-field"),p=["type","label-type","copy-to-clipboard"],d=(0,r.Zz)((0,o.RF)({mappings:i.A}),o.VO,(0,o.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),o.tQ,(t=>class extends t{static get observedAttributes(){return p.concat(t.observedAttributes||[])}icon;init(){super.init?.()}renderCopyToClipboard(t){if(!t)return void this.icon?.remove();const e={icon:"vaadin:copy-o",title:"Copy",style:"cursor: pointer"},n={icon:"vaadin:check-circle-o",title:"Copied",style:"cursor: initial"};this.icon=Object.assign(document.createElement("vaadin-icon"),{slot:"suffix",...e}),this.baseElement.appendChild(this.icon),this.icon.addEventListener("click",(()=>{navigator.clipboard.writeText(this.value),Object.assign(this.icon,n),setTimeout((()=>{Object.assign(this.icon,e)}),5e3)}))}onLabelClick(){this.focus()}attributeChangedCallback(t,e,n){super.attributeChangeCallback?.(t,e,n),"type"===t&&this.baseElement._setType(n),e!==n&&("label-type"===t?"floating"===n?this.addEventListener("click",this.onLabelClick):this.removeEventListener("click",this.onLabelClick):"copy-to-clipboard"===t&&this.renderCopyToClipboard("true"===n))}}))((0,o.tz)({slots:["prefix","suffix"],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tpadding: calc(var(${d.cssVarList.inputOutlineWidth}) + var(${d.cssVarList.inputOutlineOffset}));\n        box-sizing: border-box;\n\t\t\t}\n      :host(:is([readonly], [disabled])) ::slotted(:is(input, textarea):placeholder-shown) {\n        opacity: 1;\n      }\n\n      vaadin-text-field[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n        opacity: 0;\n      }\n      vaadin-text-field[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n        opacity: 0;\n      }\n      ${(0,s.$J)("vaadin-text-field")}\n\t\t\t${(0,s.cy)(d.cssVarList)}\n\t\t\t${(0,s.LJ)("vaadin-text-field",d.cssVarList)}\n      ${(0,s.Kl)()}\n\n      vaadin-text-field vaadin-icon {\n        align-self: center;\n      }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:l}))},89348:(t,e,n)=>{n.r(e),n.d(e,{TextFieldClass:()=>o.w,componentName:()=>o.T}),n(63970),n(23638),n(80201);var o=n(69473);customElements.define(o.T,o.w)},23758:(t,e,n)=>{n.d(e,{NF:()=>A,TQ:()=>h});var o=n(32413),i=n(14944),r=n(7138),a=n(94619),s=n(69473),l=n(44976),p=n(44066),d=n(33177);const u=s.w.cssVarList,c=l.C.cssVarList,h=(0,i.xE)("phone-field"),{host:b,label:y,requiredIndicator:m,inputField:g,internalAfter:f,countryCodeInput:v,phoneInput:C,separator:x,errorMessage:I,helperText:w}={host:{selector:()=>":host"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},inputField:{selector:"::part(input-field)"},internalAfter:{selector:"descope-phone-field-internal::after"},phoneInput:{selector:()=>"descope-text-field"},countryCodeInput:{selector:()=>"descope-combo-box"},separator:{selector:"descope-phone-field-internal .separator"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},A=(0,r.Zz)((0,a.RF)({mappings:{fontSize:[b,g,{selector:s.w.componentName,property:s.w.cssVarList.fontSize},{selector:l.C.componentName,property:l.C.cssVarList.fontSize}],fontFamily:[y,I,w,{...v,property:l.C.cssVarList.overlay.fontFamily}],hostWidth:[{...b,property:"width"},{...C,property:"width"},{...v,property:"--vaadin-combo-box-overlay-width"}],hostDirection:{...b,property:"direction"},inputBorderStyle:[{...f,property:"border-style"},{...x,property:"border-left-style"}],inputBorderWidth:[{...f,property:"border-width"},{...x,property:"border-left-width"}],inputBorderColor:[{...f,property:"border-color"},{...x,property:"border-left-color"}],inputBorderRadius:[{...g,property:"border-radius"},{...f,property:"border-radius"}],countryCodeInputWidth:{...v,property:c.hostWidth},countryCodeDropdownWidth:{...v,property:"--vaadin-combo-box-overlay-width"},phoneInputWidth:{...C,property:"width"},horizontalPadding:[{...C,property:"padding-left"},{...C,property:"padding-right"},{...v,property:"padding-left"},{...v,property:"padding-right"}],labelTextColor:[{...y,property:"color"},{...m,property:"color"}],labelRequiredIndicator:{...m,property:"content"},errorMessageTextColor:{...I,property:"color"},errorMessageIcon:{...I,property:"background-image"},errorMessageIconSize:{...I,property:"background-size"},errorMessageIconPadding:{...I,property:"padding-inline-start"},errorMessageIconRepeat:{...I,property:"background-repeat"},errorMessageIconPosition:{...I,property:"background-position"},inputValueTextColor:[{...C,property:u.inputValueTextColor},{...v,property:c.inputValueTextColor}],inputPlaceholderTextColor:{...C,property:u.inputPlaceholderColor},overlayItemBackgroundColor:{selector:"descope-combo-box",property:c.overlayItemBackgroundColor},inputOutlineStyle:{...g,property:"outline-style"},inputOutlineColor:{...g,property:"outline-color"},inputOutlineWidth:{...g,property:"outline-width"},inputOutlineOffset:{...g,property:"outline-offset"},valueInputHeight:[{...v,property:c.valueInputHeight}],valueInputMarginBottom:[{...C,property:u.valueInputMarginBottom}],marginInlineStart:[{...C,property:u.marginInlineStart},{...v,property:c.marginInlineStart}]}}),a.VO,(0,a.OZ)({proxyProps:["value","selectionStart"]}),(t=>class extends t{static get CountryCodes(){return p.A}init(){super.init?.();const t=document.createElement("template");t.innerHTML=`\n\t\t\t\t<${o.T}\n\t\t\t\t\ttabindex="-1"\n\t\t\t\t\tslot="input"\n\t\t\t\t></${o.T}>\n      \t\t`,this.baseElement.appendChild(t.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(o.T),(0,i.EA)(this.shadowRoot.host,this.inputElement,{includeAttrs:["size","bordered","invalid","minlength","maxlength","default-code","country-input-placeholder","phone-input-placeholder","disabled","restrict-countries","country-input-label","readonly","label","label-type","allow-alphanumeric-input"]})}get countryCodeItems(){return this.inputElement?.countryCodeValue}get phoneNumberInputEle(){return this.inputElement?.phoneNumberInputEle}get countryCodeInputData(){return this.inputElement?.countryCodeInputData}get countryCodes(){return Array.from(this.inputElement.countryCodeInputData).map((t=>t.getAttribute("data-country-code")))}}))((0,a.tz)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tmin-width: 15em;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t}\n\t\t\t${(0,d.cy)(A.cssVarList)}\n\t\t\t${(0,d.I4)("vaadin-text-field")}\n\t\t\t${(0,d.kG)("vaadin-text-field")}\n\t\t\t${(0,d.X6)()}\n\n\t\t\tdiv {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n\t\t\tvaadin-text-field {\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-text-field[focus-ring]::part(input-field) {\n\t\t\t\tbox-shadow: none;\n\t\t\t}\n\t\t\tvaadin-text-field::before {\n\t\t\t\theight: 0;\n\t\t\t}\n\t\t\tvaadin-text-field::part(label) {\n        margin-left: 0;\n        margin-right: 0;\n      }\n\t\t\tvaadin-text-field::part(input-field) {\n\t\t\t\tpadding: 0;\n\t\t\t\tbackground: transparent;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\t\t\tdescope-phone-field-internal {\n\t\t\t\t-webkit-mask-image: none;\n\t\t\t\tpadding: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n        direction: ltr;\n        position: relative;\n\t\t\t}\n      descope-phone-field-internal::after {\n        content: '';\n        position: absolute;\n        width: 100%;\n        height: 100%;\n        top: 0;\n        left: 0;\n        box-sizing: border-box;\n        outline-offset: calc(var(${A.cssVarList.inputBorderWidth}) * -1);\n        pointer-events: none;\n      }\n\t\t\tdescope-phone-field-internal > div {\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t}\n\t\t\tdescope-phone-field-internal .separator {\n\t\t\t\tflex: 0;\n\t\t\t\tborder: none;\n\t\t\t}\n\t\t\tdescope-combo-box {\n\t\t\t\tflex-shrink: 0;\n        min-width: 5.75em;\n\t\t\t\t${c.inputOutlineWidth}: 0;\n\t\t\t\t${c.inputOutlineOffset}: 0;\n\t\t\t\t${c.inputBorderWidth}: 0;\n\t\t\t\t${c.inputBorderRadius}: 0;\n\t\t\t}\n\t\t\tdescope-text-field {\n\t\t\t\tflex-grow: 1;\n\t\t\t\t${u.inputOutlineWidth}: 0;\n\t\t\t\t${u.inputOutlineOffset}: 0;\n\t\t\t\t${u.inputBorderWidth}: 0;\n\t\t\t\t${u.inputBorderRadius}: 0;\n      }\n\n      :host([label-type="floating"]) vaadin-text-field::part(label) {\n        display: none;\n      }\n      descope-text-field[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n        opacity: 0;\n      }\n      descope-text-field[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n        opacity: 0;\n      }\n\n\t\t\tvaadin-text-field::part(input-field)::after {\n\t\t\t\tborder: none;\n\t\t\t}\n      ${(0,d.$J)("vaadin-text-field")}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:h}))},32413:(t,e,n)=>{n.d(e,{A:()=>y,T:()=>s});var o=n(25827),i=n(14944),r=n(44066),a=n(41611);const s=(0,i.xE)("phone-field-internal"),l=["disabled","size","bordered","readonly","allow-alphanumeric-input"],p=["country-input-placeholder","default-code","restrict-countries"],d=["phone-input-placeholder","maxlength","autocomplete","name"],u=["label-type","country-input-label","label"],c={"country-input-label":"label","country-input-placeholder":"placeholder","phone-input-placeholder":"placeholder"},h=[].concat(l,p,d,u),b=(0,o.y)({componentName:s,baseSelector:"div"}),y=class extends b{static get observedAttributes(){return[].concat(b.observedAttributes||[],h)}constructor(){super(),this.innerHTML=`\n    <div class="wrapper">\n      <descope-combo-box\n        item-label-path="data-name"\n        item-value-path="data-id"\n      >\n      ${r.A.map((t=>(0,a.$B)(t))).join("")}\n      </descope-combo-box>\n      <div class="separator"></div>\n      <descope-text-field type="tel"></descope-text-field>\n    </div>\n    `,this.countryCodeInput=this.querySelector("descope-combo-box"),this.phoneNumberInput=this.querySelector("descope-text-field"),this.inputs=[this.countryCodeInput,this.phoneNumberInput],(0,i.EA)(this,this.countryCodeInput,{includeAttrs:["label-type"]}),(0,i.EA)(this,this.phoneNumberInput,{includeAttrs:["label-type","required"]}),this.countryCodeInput.customValueTransformFn=t=>{const[,e]=t?.split?.(" ")||[];return e}}get countryCodeInputData(){return this.countryCodeInput.items}get allowAlphanumericInput(){return"true"===this.getAttribute("allow-alphanumeric-input")}get value(){return this.phoneNumberValue?`${this.countryCodeInput.value}-${this.phoneNumberInput.value}`:""}set value(t){const[e,n]=(0,a.lq)(t);this.#t(e),this.#e(n)}setSelectionRange(...t){this.phoneNumberInput.setSelectionRange(...t)}get selectionStart(){return this.phoneNumberInput.selectionStart}#t(t){if(t){const e=this.getCountryByDialCode(t);e&&(this.countryCodeInput.selectedItem=e)}else this.countryCodeInput.selectedItem=void 0}#e(t){this.phoneNumberInput.value!==t&&(this.phoneNumberInput.value=t)}get phoneNumberValue(){return this.phoneNumberInput.value}get countryCodeValue(){return this.countryCodeInput.shadowRoot.querySelector("input").value}get phoneNumberInputEle(){return this.phoneNumberInput.shadowRoot.querySelector("input")}get minLength(){return parseInt(this.getAttribute("minlength"),10)||0}getValidity(){const t=this.countryCodeInput.value,e=this.phoneNumberInput.value,n=!t||!e,o=this.phoneNumberInput.value?.length&&this.phoneNumberInput.value.length<this.minLength;return this.isRequired&&n?{valueMissing:!0}:o?{tooShort:!0}:e&&!t?{valueMissing:!0}:{}}init(){this.addEventListener("focus",(t=>{t.isTrusted&&this.inputs[1].focus()})),super.init?.(),this.initInputs()}getRestrictedCountries(){const t=this.getAttribute("restrict-countries");return t?t.split(","):[]}getCountryByDialCode(t){return this.countryCodeInput.items?.find((e=>e.getAttribute("data-id")===t))}getCountryByCodeId(t){return this.countryCodeInput.items?.find((e=>e.getAttribute("data-country-code")===t))}updateCountryCodeItems(t){const e=t.length?r.A.filter((e=>t.includes(e.code))):r.A;this.querySelector("descope-combo-box").innerHTML=e.map((t=>(0,a.$B)(t))).join("")}handleDefaultCountryCode(t){if(!this.countryCodeInput.value){const e=this.getCountryByCodeId(t);e&&setTimeout((()=>{this.countryCodeInput.selectedItem=e}))}}initInputs(){this.phoneNumberInput.addEventListener("input",(t=>{if(t.stopPropagation(),!this.allowAlphanumericInput){const e=/^\d$/,n=t.target.value.split("").filter((t=>e.test(t))).join("");t.target.value=n}})),this.handleFocusEventsDispatching(this.inputs),this.handleInputEventDispatching()}handleLabelTypeAttrs(t,e){const n=c[t]||t;"label-type"===t?this.onLabelTypeChange(e):"floating"===this.getAttribute("label-type")&&("country-input-label"===t?this.countryCodeInput.setAttribute(n,e):"label"===t&&this.phoneNumberInput.setAttribute(n,e))}onLabelTypeChange(t){"floating"===t?(this.countryCodeInput.setAttribute("label",this.getAttribute("country-input-label")||""),this.countryCodeInput.setAttribute("placeholder",this.getAttribute("country-input-placeholder")||""),this.phoneNumberInput.setAttribute("label",this.getAttribute("label")||""),this.phoneNumberInput.setAttribute("placeholder",this.getAttribute("phone-input-placeholder")||"")):this.inputs.forEach((t=>t.removeAttribute("label")))}attributeChangedCallback(t,e,n){if(super.attributeChangedCallback(t,e,n),e!==n){if("default-code"===t&&n)this.handleDefaultCountryCode(n);else if(h.includes(t)){const e=c[t]||t;l.includes(t)?this.inputs.forEach((t=>t.setAttribute(e,n))):p.includes(t)?this.countryCodeInput.setAttribute(e,n):d.includes(t)&&this.phoneNumberInput.setAttribute(e,n)}u.includes(t)&&this.handleLabelTypeAttrs(t,n),"restrict-countries"===t&&this.updateCountryCodeItems(this.getRestrictedCountries())}}}},54930:(t,e,n)=>{n.r(e),n(11738),n(89348);var o=n(32413);customElements.define(o.T,o.A)},41611:(t,e,n)=>{n.d(e,{$B:()=>i,lq:()=>r});var o=n(94327);const i=({code:t,dialCode:e,name:n})=>`\n\t<div\n\t\tstyle="display:flex; flex-direction: column;"\n\t\tdata-id="${e}"\n\t\tdata-name="${t} ${e} ${n}"\n\t\tdata-country-code="${t}"\n\t>\n\t\t<div>\n\t\t\t<span>\n\t\t\t\t<img src="${(t=>`https://static.descope.com/npm/svg-country-flags@1.2.10/svg/${t.toLowerCase()}.svg`)(t)}" width="20"/>\n\t\t\t</span>\n\t\t\t<span>${n}</span>\n\t\t</div>\n\t\t<div>\n\t\t\t<span>${t}</span>\n\t\t\t<span>${e}</span>\n\t\t</div>\n\t</div>\n`,r=t=>{const e=t||"";let n="",i="";const r=(0,o.l)(e);if(r)r.countryCallingCode&&(n=`+${r.countryCallingCode}`),r.nationalNumber&&(i=r.nationalNumber);else{const[t,o]=e.split("-");n=t||"",i=o||""}return[n,i]}},96442:(t,e,n)=>{n.r(e),n.d(e,{PhoneFieldClass:()=>o.NF,componentName:()=>o.TQ}),n(54930),n(11738),n(89348);var o=n(23758);customElements.define(o.TQ,o.NF)}}]);
+"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[2878,9894],{79275:(t,e,n)=>{n.d(e,{T:()=>l,w:()=>d});var o=n(79365),i=n(6424),r=n(9696),a=n(97810),s=n(73551);const l=(0,a.xE)("text-field"),p=["type","label-type","copy-to-clipboard"],d=(0,r.Zz)((0,o.RF)({mappings:i.A}),o.VO,(0,o.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),o.tQ,(t=>class extends t{static get observedAttributes(){return p.concat(t.observedAttributes||[])}icon;init(){super.init?.()}renderCopyToClipboard(t){if(!t)return void this.icon?.remove();const e={icon:"vaadin:copy-o",title:"Copy",style:"cursor: pointer"},n={icon:"vaadin:check-circle-o",title:"Copied",style:"cursor: initial"};this.icon=Object.assign(document.createElement("vaadin-icon"),{slot:"suffix",...e}),this.baseElement.appendChild(this.icon),this.icon.addEventListener("click",(()=>{navigator.clipboard.writeText(this.value),Object.assign(this.icon,n),setTimeout((()=>{Object.assign(this.icon,e)}),5e3)}))}onLabelClick(){this.focus()}attributeChangedCallback(t,e,n){super.attributeChangeCallback?.(t,e,n),"type"===t&&this.baseElement._setType(n),e!==n&&("label-type"===t?"floating"===n?this.addEventListener("click",this.onLabelClick):this.removeEventListener("click",this.onLabelClick):"copy-to-clipboard"===t&&this.renderCopyToClipboard("true"===n))}}))((0,o.tz)({slots:["prefix","suffix"],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tpadding: calc(var(${d.cssVarList.inputOutlineWidth}) + var(${d.cssVarList.inputOutlineOffset}));\n        box-sizing: border-box;\n\t\t\t}\n      :host(:is([readonly], [disabled])) ::slotted(:is(input, textarea):placeholder-shown) {\n        opacity: 1;\n      }\n\n      vaadin-text-field[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n        opacity: 0;\n      }\n      vaadin-text-field[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n        opacity: 0;\n      }\n      ${(0,s.$J)("vaadin-text-field")}\n\t\t\t${(0,s.cy)(d.cssVarList)}\n\t\t\t${(0,s.LJ)("vaadin-text-field",d.cssVarList)}\n      ${(0,s.Kl)()}\n\n      vaadin-text-field vaadin-icon {\n        align-self: center;\n      }\n\t\t`,excludeAttrsSync:["tabindex","style"],componentName:l}))},21374:(t,e,n)=>{n.r(e),n.d(e,{TextFieldClass:()=>o.w,componentName:()=>o.T}),n(11284),n(37182),n(95260);var o=n(79275);customElements.define(o.T,o.w)},81808:(t,e,n)=>{n.d(e,{NF:()=>A,TQ:()=>h});var o=n(84015),i=n(97810),r=n(9696),a=n(79365),s=n(79275),l=n(86365),p=n(51680),d=n(73551);const u=s.w.cssVarList,c=l.C.cssVarList,h=(0,i.xE)("phone-field"),{host:b,label:y,requiredIndicator:m,inputField:g,internalAfter:f,countryCodeInput:v,phoneInput:C,separator:x,errorMessage:I,helperText:w}={host:{selector:()=>":host"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},inputField:{selector:"::part(input-field)"},internalAfter:{selector:"descope-phone-field-internal::after"},phoneInput:{selector:()=>"descope-text-field"},countryCodeInput:{selector:()=>"descope-combo-box"},separator:{selector:"descope-phone-field-internal .separator"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},A=(0,r.Zz)((0,a.RF)({mappings:{fontSize:[b,g,{selector:s.w.componentName,property:s.w.cssVarList.fontSize},{selector:l.C.componentName,property:l.C.cssVarList.fontSize}],fontFamily:[y,I,w,{...v,property:l.C.cssVarList.overlay.fontFamily}],hostWidth:[{...b,property:"width"},{...C,property:"width"},{...v,property:"--vaadin-combo-box-overlay-width"}],hostDirection:{...b,property:"direction"},inputBorderStyle:[{...f,property:"border-style"},{...x,property:"border-left-style"}],inputBorderWidth:[{...f,property:"border-width"},{...x,property:"border-left-width"}],inputBorderColor:[{...f,property:"border-color"},{...x,property:"border-left-color"}],inputBorderRadius:[{...g,property:"border-radius"},{...f,property:"border-radius"}],countryCodeInputWidth:{...v,property:c.hostWidth},countryCodeDropdownWidth:{...v,property:"--vaadin-combo-box-overlay-width"},phoneInputWidth:{...C,property:"width"},horizontalPadding:[{...C,property:"padding-left"},{...C,property:"padding-right"},{...v,property:"padding-left"},{...v,property:"padding-right"}],labelTextColor:[{...y,property:"color"},{...m,property:"color"}],labelRequiredIndicator:{...m,property:"content"},errorMessageTextColor:{...I,property:"color"},errorMessageIcon:{...I,property:"background-image"},errorMessageIconSize:{...I,property:"background-size"},errorMessageIconPadding:{...I,property:"padding-inline-start"},errorMessageIconRepeat:{...I,property:"background-repeat"},errorMessageIconPosition:{...I,property:"background-position"},inputValueTextColor:[{...C,property:u.inputValueTextColor},{...v,property:c.inputValueTextColor}],inputPlaceholderTextColor:{...C,property:u.inputPlaceholderColor},overlayItemBackgroundColor:{selector:"descope-combo-box",property:c.overlayItemBackgroundColor},inputOutlineStyle:{...g,property:"outline-style"},inputOutlineColor:{...g,property:"outline-color"},inputOutlineWidth:{...g,property:"outline-width"},inputOutlineOffset:{...g,property:"outline-offset"},valueInputHeight:[{...v,property:c.valueInputHeight}],valueInputMarginBottom:[{...C,property:u.valueInputMarginBottom}],marginInlineStart:[{...C,property:u.marginInlineStart},{...v,property:c.marginInlineStart}]}}),a.VO,(0,a.OZ)({proxyProps:["value","selectionStart"]}),(t=>class extends t{static get CountryCodes(){return p.A}init(){super.init?.();const t=document.createElement("template");t.innerHTML=`\n\t\t\t\t<${o.T}\n\t\t\t\t\ttabindex="-1"\n\t\t\t\t\tslot="input"\n\t\t\t\t></${o.T}>\n      \t\t`,this.baseElement.appendChild(t.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(o.T),(0,i.EA)(this.shadowRoot.host,this.inputElement,{includeAttrs:["size","bordered","invalid","minlength","maxlength","default-code","country-input-placeholder","phone-input-placeholder","disabled","restrict-countries","country-input-label","readonly","label","label-type","allow-alphanumeric-input"]})}get countryCodeItems(){return this.inputElement?.countryCodeValue}get phoneNumberInputEle(){return this.inputElement?.phoneNumberInputEle}get countryCodeInputData(){return this.inputElement?.countryCodeInputData}get countryCodes(){return Array.from(this.inputElement.countryCodeInputData).map((t=>t.getAttribute("data-country-code")))}}))((0,a.tz)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tmin-width: 15em;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t}\n\t\t\t${(0,d.cy)(A.cssVarList)}\n\t\t\t${(0,d.I4)("vaadin-text-field")}\n\t\t\t${(0,d.kG)("vaadin-text-field")}\n\t\t\t${(0,d.X6)()}\n\n\t\t\tdiv {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n\t\t\tvaadin-text-field {\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-text-field[focus-ring]::part(input-field) {\n\t\t\t\tbox-shadow: none;\n\t\t\t}\n\t\t\tvaadin-text-field::before {\n\t\t\t\theight: 0;\n\t\t\t}\n\t\t\tvaadin-text-field::part(label) {\n        margin-left: 0;\n        margin-right: 0;\n      }\n\t\t\tvaadin-text-field::part(input-field) {\n\t\t\t\tpadding: 0;\n\t\t\t\tbackground: transparent;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\t\t\tdescope-phone-field-internal {\n\t\t\t\t-webkit-mask-image: none;\n\t\t\t\tpadding: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n        direction: ltr;\n        position: relative;\n\t\t\t}\n      descope-phone-field-internal::after {\n        content: '';\n        position: absolute;\n        width: 100%;\n        height: 100%;\n        top: 0;\n        left: 0;\n        box-sizing: border-box;\n        outline-offset: calc(var(${A.cssVarList.inputBorderWidth}) * -1);\n        pointer-events: none;\n      }\n\t\t\tdescope-phone-field-internal > div {\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t}\n\t\t\tdescope-phone-field-internal .separator {\n\t\t\t\tflex: 0;\n\t\t\t\tborder: none;\n\t\t\t}\n  \n\t\t\tdescope-combo-box {\n\t\t\t\tflex-shrink: 0;\n        min-width: 5.75em;\n\t\t\t\t${c.inputOutlineWidth}: 0;\n\t\t\t\t${c.inputOutlineOffset}: 0;\n\t\t\t\t${c.inputBorderWidth}: 0;\n\t\t\t\t${c.inputBorderRadius}: 0;\n\t\t\t}\n\t\t\tdescope-text-field {\n\t\t\t\tflex-grow: 1;\n\t\t\t\t${u.inputOutlineWidth}: 0;\n\t\t\t\t${u.inputOutlineOffset}: 0;\n\t\t\t\t${u.inputBorderWidth}: 0;\n\t\t\t\t${u.inputBorderRadius}: 0;\n      }\n\n      :host([label-type="floating"]) vaadin-text-field::part(label) {\n        display: none;\n      }\n      descope-text-field[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n        opacity: 0;\n      }\n      descope-text-field[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n        opacity: 0;\n      }\n\n\t\t\tvaadin-text-field::part(input-field)::after {\n\t\t\t\tborder: none;\n\t\t\t}\n      ${(0,d.$J)("vaadin-text-field")}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:h}))},84015:(t,e,n)=>{n.d(e,{A:()=>y,T:()=>s});var o=n(3393),i=n(97810),r=n(51680),a=n(49157);const s=(0,i.xE)("phone-field-internal"),l=["disabled","size","bordered","readonly","allow-alphanumeric-input"],p=["country-input-placeholder","default-code","restrict-countries"],d=["phone-input-placeholder","maxlength","autocomplete","name"],u=["label-type","country-input-label","label"],c={"country-input-label":"label","country-input-placeholder":"placeholder","phone-input-placeholder":"placeholder"},h=[].concat(l,p,d,u),b=(0,o.y)({componentName:s,baseSelector:"div"}),y=class extends b{static get observedAttributes(){return[].concat(b.observedAttributes||[],h)}constructor(){super(),this.innerHTML=`\n    <div class="wrapper">\n      <descope-combo-box\n        item-label-path="data-name"\n        item-value-path="data-id"\n      >\n      ${r.A.map((t=>(0,a.$B)(t))).join("")}\n      </descope-combo-box>\n      <div class="separator"></div>\n      <descope-text-field type="tel"></descope-text-field>\n    </div>\n    `,this.countryCodeInput=this.querySelector("descope-combo-box"),this.phoneNumberInput=this.querySelector("descope-text-field"),this.inputs=[this.countryCodeInput,this.phoneNumberInput],(0,i.EA)(this,this.countryCodeInput,{includeAttrs:["label-type"]}),(0,i.EA)(this,this.phoneNumberInput,{includeAttrs:["label-type","required"]}),this.countryCodeInput.customValueTransformFn=t=>{const[,e]=t?.split?.(" ")||[];return e}}get countryCodeInputData(){return this.countryCodeInput.items}get allowAlphanumericInput(){return"true"===this.getAttribute("allow-alphanumeric-input")}get value(){return this.phoneNumberValue?`${this.countryCodeInput.value}-${this.phoneNumberInput.value}`:""}set value(t){const[e,n]=(0,a.lq)(t);this.#t(e),this.#e(n)}setSelectionRange(...t){this.phoneNumberInput.setSelectionRange(...t)}get selectionStart(){return this.phoneNumberInput.selectionStart}#t(t){if(t){const e=this.getCountryByDialCode(t);e&&(this.countryCodeInput.selectedItem=e)}else this.countryCodeInput.selectedItem=void 0}#e(t){this.phoneNumberInput.value!==t&&(this.phoneNumberInput.value=t)}get phoneNumberValue(){return this.phoneNumberInput.value}get countryCodeValue(){return this.countryCodeInput.shadowRoot.querySelector("input").value}get phoneNumberInputEle(){return this.phoneNumberInput.shadowRoot.querySelector("input")}get minLength(){return parseInt(this.getAttribute("minlength"),10)||0}getValidity(){const t=this.countryCodeInput.value,e=this.phoneNumberInput.value,n=!t||!e,o=this.phoneNumberInput.value?.length&&this.phoneNumberInput.value.length<this.minLength;return this.isRequired&&n?{valueMissing:!0}:o?{tooShort:!0}:e&&!t?{valueMissing:!0}:{}}init(){this.addEventListener("focus",(t=>{t.isTrusted&&this.inputs[1].focus()})),super.init?.(),this.initInputs()}getRestrictedCountries(){const t=this.getAttribute("restrict-countries");return t?t.split(","):[]}getCountryByDialCode(t){return this.countryCodeInput.items?.find((e=>e.getAttribute("data-id")===t))}getCountryByCodeId(t){return this.countryCodeInput.items?.find((e=>e.getAttribute("data-country-code")===t))}updateCountryCodeItems(t){const e=t.length?r.A.filter((e=>t.includes(e.code))):r.A;this.querySelector("descope-combo-box").innerHTML=e.map((t=>(0,a.$B)(t))).join("")}handleDefaultCountryCode(t){if(!this.countryCodeInput.value){const e=this.getCountryByCodeId(t);e&&setTimeout((()=>{this.countryCodeInput.selectedItem=e}))}}initInputs(){this.phoneNumberInput.addEventListener("input",(t=>{if(t.stopPropagation(),!this.allowAlphanumericInput){const e=/^\d$/,n=t.target.value.split("").filter((t=>e.test(t))).join("");t.target.value=n}})),this.handleFocusEventsDispatching(this.inputs),this.handleInputEventDispatching()}handleLabelTypeAttrs(t,e){const n=c[t]||t;"label-type"===t?this.onLabelTypeChange(e):"floating"===this.getAttribute("label-type")&&("country-input-label"===t?this.countryCodeInput.setAttribute(n,e):"label"===t&&this.phoneNumberInput.setAttribute(n,e))}onLabelTypeChange(t){"floating"===t?(this.countryCodeInput.setAttribute("label",this.getAttribute("country-input-label")||""),this.countryCodeInput.setAttribute("placeholder",this.getAttribute("country-input-placeholder")||""),this.phoneNumberInput.setAttribute("label",this.getAttribute("label")||""),this.phoneNumberInput.setAttribute("placeholder",this.getAttribute("phone-input-placeholder")||"")):this.inputs.forEach((t=>t.removeAttribute("label")))}attributeChangedCallback(t,e,n){if(super.attributeChangedCallback(t,e,n),e!==n){if("default-code"===t&&n)this.handleDefaultCountryCode(n);else if(h.includes(t)){const e=c[t]||t;l.includes(t)?this.inputs.forEach((t=>t.setAttribute(e,n))):p.includes(t)?this.countryCodeInput.setAttribute(e,n):d.includes(t)&&this.phoneNumberInput.setAttribute(e,n)}u.includes(t)&&this.handleLabelTypeAttrs(t,n),"restrict-countries"===t&&this.updateCountryCodeItems(this.getRestrictedCountries())}}}},92132:(t,e,n)=>{n.r(e),n(27092),n(21374);var o=n(84015);customElements.define(o.T,o.A)},49157:(t,e,n)=>{n.d(e,{$B:()=>i,lq:()=>r});var o=n(10473);const i=({code:t,dialCode:e,name:n})=>`\n\t<div\n\t\tdata-id="${e}"\n\t\tdata-name="${t} ${e} ${n}"\n\t\tdata-country-code="${t}"\n\t>\n\t\t<div>\n\t\t\t<span>\n\t\t\t\t<img src="${(t=>`https://static.descope.com/npm/svg-country-flags@1.2.10/svg/${t.toLowerCase()}.svg`)(t)}" width="20"/>\n\t\t\t</span>\n\t\t\t<span>${n}</span>\n\t\t</div>\n\t\t<div>\n\t\t\t<span>${t}</span>\n\t\t\t<span>${e}</span>\n\t\t</div>\n\t</div>\n`,r=t=>{const e=t||"";let n="",i="";const r=(0,o.l)(e);if(r)r.countryCallingCode&&(n=`+${r.countryCallingCode}`),r.nationalNumber&&(i=r.nationalNumber);else{const[t,o]=e.split("-");n=t||"",i=o||""}return[n,i]}},98136:(t,e,n)=>{n.r(e),n.d(e,{PhoneFieldClass:()=>o.NF,componentName:()=>o.TQ}),n(92132),n(27092),n(21374);var o=n(81808);customElements.define(o.TQ,o.NF)}}]);
+//# sourceMappingURL=phone-fields-descope-phone-field-index-js.js.map

package/dist/umd/phone-fields-descope-phone-field-index-js.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"phone-fields-descope-phone-field-index-js.js","mappings":"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","sources":["webpack://@descope/web-components-ui/./src/components/descope-text-field/TextFieldClass.js","webpack://@descope/web-components-ui/./src/components/descope-text-field/index.js","webpack://@descope/web-components-ui/./src/components/phone-fields/descope-phone-field/PhoneFieldClass.js","webpack://@descope/web-components-ui/./src/components/phone-fields/descope-phone-field/descope-phone-field-internal/PhoneFieldInternal.js","webpack://@descope/web-components-ui/./src/components/phone-fields/descope-phone-field/descope-phone-field-internal/index.js","webpack://@descope/web-components-ui/./src/components/phone-fields/descope-phone-field/helpers.js","webpack://@descope/web-components-ui/./src/components/phone-fields/descope-phone-field/index.js"],"sourcesContent":["import {\n  createStyleMixin,\n  draggableMixin,\n  createProxy,\n  proxyInputMixin,\n  componentNameValidationMixin,\n} from '../../mixins';\nimport textFieldMappings from './textFieldMappings';\nimport { compose } from '../../helpers';\nimport { getComponentName } from '../../helpers/componentHelpers';\nimport {\n  inputFloatingLabelStyle,\n  resetInputLabelPosition,\n  resetInputOverrides,\n  useHostExternalPadding,\n} from '../../helpers/themeHelpers/resetHelpers';\n\nexport const componentName = getComponentName('text-field');\n\nconst observedAttrs = ['type', 'label-type', 'copy-to-clipboard'];\n\nconst customMixin = (superclass) =>\n  class TextFieldClass extends superclass {\n    static get observedAttributes() {\n      return observedAttrs.concat(superclass.observedAttributes || []);\n    }\n\n    icon;\n\n    init() {\n      super.init?.();\n    }\n\n    renderCopyToClipboard(shouldRender) {\n      if (!shouldRender) {\n        this.icon?.remove();\n        return;\n      }\n\n      const iconInitConfig = {\n        icon: 'vaadin:copy-o',\n        title: 'Copy',\n        style: 'cursor: pointer',\n      };\n\n      const iconCopiedConfig = {\n        icon: 'vaadin:check-circle-o',\n        title: 'Copied',\n        style: 'cursor: initial',\n      };\n\n      this.icon = Object.assign(document.createElement('vaadin-icon'), {\n        slot: 'suffix',\n        ...iconInitConfig,\n      });\n\n      this.baseElement.appendChild(this.icon);\n      this.icon.addEventListener('click', () => {\n        navigator.clipboard.writeText(this.value);\n        Object.assign(this.icon, iconCopiedConfig);\n\n        // we want the icon to go back to the initial state after 5 seconds\n        setTimeout(() => {\n          Object.assign(this.icon, iconInitConfig);\n        }, 5000);\n      });\n    }\n\n    onLabelClick() {\n      this.focus();\n    }\n\n    attributeChangedCallback(attrName, oldVal, newVal) {\n      super.attributeChangeCallback?.(attrName, oldVal, newVal);\n\n      // Vaadin doesn't allow to change the input type attribute.\n      // We need the ability to do that, so we're overriding their\n      // behavior with their private API.\n      // When receiving a `type` attribute, we use their private API\n      // to set it on the input.\n      if (attrName === 'type') {\n        this.baseElement._setType(newVal);\n      }\n\n      if (oldVal !== newVal) {\n        if (attrName === 'label-type') {\n          if (newVal === 'floating') {\n            this.addEventListener('click', this.onLabelClick);\n          } else {\n            this.removeEventListener('click', this.onLabelClick);\n          }\n        } else if (attrName === 'copy-to-clipboard') {\n          this.renderCopyToClipboard(newVal === 'true');\n        }\n      }\n    }\n  };\n\nexport const TextFieldClass = compose(\n  createStyleMixin({\n    mappings: textFieldMappings,\n  }),\n  draggableMixin,\n  proxyInputMixin({ proxyProps: ['value', 'selectionStart'], useProxyTargets: true }),\n  componentNameValidationMixin,\n  customMixin\n)(\n  createProxy({\n    slots: ['prefix', 'suffix'],\n    wrappedEleName: 'vaadin-text-field',\n    style: () => `\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tpadding: calc(var(${TextFieldClass.cssVarList.inputOutlineWidth}) + var(${\n          TextFieldClass.cssVarList.inputOutlineOffset\n        }));\n        box-sizing: border-box;\n\t\t\t}\n      :host(:is([readonly], [disabled])) ::slotted(:is(input, textarea):placeholder-shown) {\n        opacity: 1;\n      }\n\n      vaadin-text-field[label-type=\"floating\"]:not([focused])[readonly] > input:placeholder-shown {\n        opacity: 0;\n      }\n      vaadin-text-field[label-type=\"floating\"]:not([focused])[disabled] > input:placeholder-shown {\n        opacity: 0;\n      }\n      ${resetInputLabelPosition('vaadin-text-field')}\n\t\t\t${useHostExternalPadding(TextFieldClass.cssVarList)}\n\t\t\t${resetInputOverrides('vaadin-text-field', TextFieldClass.cssVarList)}\n      ${inputFloatingLabelStyle()}\n\n      vaadin-text-field vaadin-icon {\n        align-self: center;\n      }\n\t\t`,\n    excludeAttrsSync: ['tabindex', 'style'],\n    componentName,\n  })\n);\n","import '@vaadin/text-field';\nimport '@vaadin/icons';\nimport '@vaadin/icon';\n\nimport { componentName, TextFieldClass } from './TextFieldClass';\n\ncustomElements.define(componentName, TextFieldClass);\n\nexport { TextFieldClass, componentName };\n","import { componentName as descopeInternalComponentName } from './descope-phone-field-internal/PhoneFieldInternal';\nimport { forwardAttrs, getComponentName } from '../../../helpers/componentHelpers';\nimport { compose } from '../../../helpers';\nimport { createProxy, createStyleMixin, draggableMixin, proxyInputMixin } from '../../../mixins';\nimport { TextFieldClass } from '../../descope-text-field/TextFieldClass';\nimport { ComboBoxClass } from '@descope-ui/descope-combo-box/class';\nimport CountryCodes from '../CountryCodes';\nimport {\n  resetInputCursor,\n  resetInputLabelPosition,\n  resetInputFieldDefaultWidth,\n  resetInputFieldInvalidBackgroundColor,\n  useHostExternalPadding,\n} from '../../../helpers/themeHelpers/resetHelpers';\n\nconst textVars = TextFieldClass.cssVarList;\nconst comboVars = ComboBoxClass.cssVarList;\n\nexport const componentName = getComponentName('phone-field');\n\nconst customMixin = (superclass) =>\n  class PhoneFieldMixinClass extends superclass {\n    static get CountryCodes() {\n      return CountryCodes;\n    }\n\n    init() {\n      super.init?.();\n\n      const template = document.createElement('template');\n\n      template.innerHTML = `\n\t\t\t\t<${descopeInternalComponentName}\n\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\tslot=\"input\"\n\t\t\t\t></${descopeInternalComponentName}>\n      \t\t`;\n\n      this.baseElement.appendChild(template.content.cloneNode(true));\n\n      this.inputElement = this.shadowRoot.querySelector(descopeInternalComponentName);\n\n      forwardAttrs(this.shadowRoot.host, this.inputElement, {\n        includeAttrs: [\n          'size',\n          'bordered',\n          'invalid',\n          'minlength',\n          'maxlength',\n          'default-code',\n          'country-input-placeholder',\n          'phone-input-placeholder',\n          'disabled',\n          'restrict-countries',\n          'country-input-label',\n          'readonly',\n          'label',\n          'label-type',\n          'allow-alphanumeric-input',\n        ],\n      });\n    }\n\n    get countryCodeItems() {\n      return this.inputElement?.countryCodeValue;\n    }\n\n    get phoneNumberInputEle() {\n      return this.inputElement?.phoneNumberInputEle;\n    }\n\n    get countryCodeInputData() {\n      return this.inputElement?.countryCodeInputData;\n    }\n\n    get countryCodes() {\n      return Array.from(this.inputElement.countryCodeInputData).map((ele) =>\n        ele.getAttribute('data-country-code')\n      );\n    }\n  };\n\nconst {\n  host,\n  label,\n  requiredIndicator,\n  inputField,\n  internalAfter,\n  countryCodeInput,\n  phoneInput,\n  separator,\n  errorMessage,\n  helperText,\n} = {\n  host: { selector: () => ':host' },\n  label: { selector: '::part(label)' },\n  requiredIndicator: { selector: '[required]::part(required-indicator)::after' },\n  inputField: { selector: '::part(input-field)' },\n  internalAfter: { selector: 'descope-phone-field-internal::after' },\n  phoneInput: { selector: () => 'descope-text-field' },\n  countryCodeInput: { selector: () => 'descope-combo-box' },\n  separator: { selector: 'descope-phone-field-internal .separator' },\n  helperText: { selector: '::part(helper-text)' },\n  errorMessage: { selector: '::part(error-message)' },\n};\n\nexport const PhoneFieldClass = compose(\n  createStyleMixin({\n    mappings: {\n      fontSize: [\n        host,\n        inputField,\n        {\n          selector: TextFieldClass.componentName,\n          property: TextFieldClass.cssVarList.fontSize,\n        },\n        {\n          selector: ComboBoxClass.componentName,\n          property: ComboBoxClass.cssVarList.fontSize,\n        },\n      ],\n      fontFamily: [\n        label,\n        errorMessage,\n        helperText,\n        {\n          ...countryCodeInput,\n          property: ComboBoxClass.cssVarList.overlay.fontFamily,\n        },\n      ],\n      hostWidth: [\n        { ...host, property: 'width' },\n        { ...phoneInput, property: 'width' },\n        { ...countryCodeInput, property: '--vaadin-combo-box-overlay-width' },\n      ],\n      hostDirection: { ...host, property: 'direction' },\n\n      inputBorderStyle: [\n        { ...internalAfter, property: 'border-style' },\n        { ...separator, property: 'border-left-style' },\n      ],\n      inputBorderWidth: [\n        { ...internalAfter, property: 'border-width' },\n        { ...separator, property: 'border-left-width' },\n      ],\n      inputBorderColor: [\n        { ...internalAfter, property: 'border-color' },\n        { ...separator, property: 'border-left-color' },\n      ],\n      inputBorderRadius: [\n        { ...inputField, property: 'border-radius' },\n        { ...internalAfter, property: 'border-radius' },\n      ],\n\n      countryCodeInputWidth: { ...countryCodeInput, property: comboVars.hostWidth },\n      countryCodeDropdownWidth: {\n        ...countryCodeInput,\n        property: '--vaadin-combo-box-overlay-width',\n      },\n      phoneInputWidth: { ...phoneInput, property: 'width' },\n\n      horizontalPadding: [\n        { ...phoneInput, property: 'padding-left' },\n        { ...phoneInput, property: 'padding-right' },\n        { ...countryCodeInput, property: 'padding-left' },\n        { ...countryCodeInput, property: 'padding-right' },\n      ],\n\n      labelTextColor: [\n        { ...label, property: 'color' },\n        { ...requiredIndicator, property: 'color' },\n      ],\n      labelRequiredIndicator: { ...requiredIndicator, property: 'content' },\n\n      errorMessageTextColor: { ...errorMessage, property: 'color' },\n      errorMessageIcon: { ...errorMessage, property: 'background-image' },\n      errorMessageIconSize: { ...errorMessage, property: 'background-size' },\n      errorMessageIconPadding: { ...errorMessage, property: 'padding-inline-start' },\n      errorMessageIconRepeat: { ...errorMessage, property: 'background-repeat' },\n      errorMessageIconPosition: { ...errorMessage, property: 'background-position' },\n\n      inputValueTextColor: [\n        { ...phoneInput, property: textVars.inputValueTextColor },\n        { ...countryCodeInput, property: comboVars.inputValueTextColor },\n      ],\n\n      inputPlaceholderTextColor: { ...phoneInput, property: textVars.inputPlaceholderColor },\n\n      overlayItemBackgroundColor: {\n        selector: 'descope-combo-box',\n        property: comboVars.overlayItemBackgroundColor,\n      },\n\n      inputOutlineStyle: { ...inputField, property: 'outline-style' },\n      inputOutlineColor: { ...inputField, property: 'outline-color' },\n      inputOutlineWidth: { ...inputField, property: 'outline-width' },\n      inputOutlineOffset: { ...inputField, property: 'outline-offset' },\n\n      valueInputHeight: [{ ...countryCodeInput, property: comboVars.valueInputHeight }],\n      valueInputMarginBottom: [{ ...phoneInput, property: textVars.valueInputMarginBottom }],\n      marginInlineStart: [\n        { ...phoneInput, property: textVars.marginInlineStart },\n        { ...countryCodeInput, property: comboVars.marginInlineStart },\n      ],\n    },\n  }),\n  draggableMixin,\n  proxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),\n  customMixin\n)(\n  createProxy({\n    slots: [],\n    wrappedEleName: 'vaadin-text-field',\n    style: () => `\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tmin-width: 15em;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t}\n\t\t\t${useHostExternalPadding(PhoneFieldClass.cssVarList)}\n\t\t\t${resetInputCursor('vaadin-text-field')}\n\t\t\t${resetInputFieldInvalidBackgroundColor('vaadin-text-field')}\n\t\t\t${resetInputFieldDefaultWidth()}\n\n\t\t\tdiv {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n\t\t\tvaadin-text-field {\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-text-field[focus-ring]::part(input-field) {\n\t\t\t\tbox-shadow: none;\n\t\t\t}\n\t\t\tvaadin-text-field::before {\n\t\t\t\theight: 0;\n\t\t\t}\n\t\t\tvaadin-text-field::part(label) {\n        margin-left: 0;\n        margin-right: 0;\n      }\n\t\t\tvaadin-text-field::part(input-field) {\n\t\t\t\tpadding: 0;\n\t\t\t\tbackground: transparent;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\t\t\tdescope-phone-field-internal {\n\t\t\t\t-webkit-mask-image: none;\n\t\t\t\tpadding: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n        direction: ltr;\n        position: relative;\n\t\t\t}\n      descope-phone-field-internal::after {\n        content: '';\n        position: absolute;\n        width: 100%;\n        height: 100%;\n        top: 0;\n        left: 0;\n        box-sizing: border-box;\n        outline-offset: calc(var(${PhoneFieldClass.cssVarList.inputBorderWidth}) * -1);\n        pointer-events: none;\n      }\n\t\t\tdescope-phone-field-internal > div {\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t}\n\t\t\tdescope-phone-field-internal .separator {\n\t\t\t\tflex: 0;\n\t\t\t\tborder: none;\n\t\t\t}\n  \n\t\t\tdescope-combo-box {\n\t\t\t\tflex-shrink: 0;\n        min-width: 5.75em;\n\t\t\t\t${comboVars.inputOutlineWidth}: 0;\n\t\t\t\t${comboVars.inputOutlineOffset}: 0;\n\t\t\t\t${comboVars.inputBorderWidth}: 0;\n\t\t\t\t${comboVars.inputBorderRadius}: 0;\n\t\t\t}\n\t\t\tdescope-text-field {\n\t\t\t\tflex-grow: 1;\n\t\t\t\t${textVars.inputOutlineWidth}: 0;\n\t\t\t\t${textVars.inputOutlineOffset}: 0;\n\t\t\t\t${textVars.inputBorderWidth}: 0;\n\t\t\t\t${textVars.inputBorderRadius}: 0;\n      }\n\n      :host([label-type=\"floating\"]) vaadin-text-field::part(label) {\n        display: none;\n      }\n      descope-text-field[label-type=\"floating\"]:not([focused])[readonly] > input:placeholder-shown {\n        opacity: 0;\n      }\n      descope-text-field[label-type=\"floating\"]:not([focused])[disabled] > input:placeholder-shown {\n        opacity: 0;\n      }\n\n\t\t\tvaadin-text-field::part(input-field)::after {\n\t\t\t\tborder: none;\n\t\t\t}\n      ${resetInputLabelPosition('vaadin-text-field')}\n\t\t`,\n    excludeAttrsSync: ['tabindex'],\n    componentName,\n  })\n);\n\nexport default PhoneFieldClass;\n","import { createBaseInputClass } from '../../../../baseClasses/createBaseInputClass';\nimport { forwardAttrs, getComponentName } from '../../../../helpers/componentHelpers';\nimport CountryCodes from '../../CountryCodes';\nimport { comboBoxItem, parsePhoneNumber } from '../helpers';\n\nexport const componentName = getComponentName('phone-field-internal');\n\nconst commonAttrs = ['disabled', 'size', 'bordered', 'readonly', 'allow-alphanumeric-input'];\nconst countryAttrs = ['country-input-placeholder', 'default-code', 'restrict-countries'];\nconst phoneAttrs = ['phone-input-placeholder', 'maxlength', 'autocomplete', 'name'];\nconst labelTypeAttrs = ['label-type', 'country-input-label', 'label'];\nconst mapAttrs = {\n  'country-input-label': 'label',\n  'country-input-placeholder': 'placeholder',\n  'phone-input-placeholder': 'placeholder',\n};\n\nconst inputRelatedAttrs = [].concat(commonAttrs, countryAttrs, phoneAttrs, labelTypeAttrs);\n\nconst BaseInputClass = createBaseInputClass({ componentName, baseSelector: 'div' });\n\nclass PhoneFieldInternal extends BaseInputClass {\n  static get observedAttributes() {\n    return [].concat(BaseInputClass.observedAttributes || [], inputRelatedAttrs);\n  }\n\n  constructor() {\n    super();\n\n    this.innerHTML = `\n    <div class=\"wrapper\">\n      <descope-combo-box\n        item-label-path=\"data-name\"\n        item-value-path=\"data-id\"\n      >\n      ${CountryCodes.map((item) => comboBoxItem(item)).join('')}\n      </descope-combo-box>\n      <div class=\"separator\"></div>\n      <descope-text-field type=\"tel\"></descope-text-field>\n    </div>\n    `;\n\n    this.countryCodeInput = this.querySelector('descope-combo-box');\n    this.phoneNumberInput = this.querySelector('descope-text-field');\n    this.inputs = [this.countryCodeInput, this.phoneNumberInput];\n\n    forwardAttrs(this, this.countryCodeInput, { includeAttrs: ['label-type'] });\n    forwardAttrs(this, this.phoneNumberInput, { includeAttrs: ['label-type', 'required'] });\n\n    // override combo box setter to display dialCode value in input\n    this.countryCodeInput.customValueTransformFn = (val) => {\n      const [, dialCode] = val?.split?.(' ') || [];\n      return dialCode;\n    };\n  }\n\n  get countryCodeInputData() {\n    return this.countryCodeInput.items;\n  }\n\n  get allowAlphanumericInput() {\n    return this.getAttribute('allow-alphanumeric-input') === 'true';\n  }\n\n  get value() {\n    if (!this.phoneNumberValue) {\n      return '';\n    }\n    return `${this.countryCodeInput.value}-${this.phoneNumberInput.value}`;\n  }\n\n  set value(val) {\n    const [countryCode, phoneNumber] = parsePhoneNumber(val);\n\n    this.#setCountryCode(countryCode);\n    this.#setPhoneNumber(phoneNumber);\n  }\n\n  setSelectionRange(...args) {\n    this.phoneNumberInput.setSelectionRange(...args);\n  }\n\n  get selectionStart() {\n    return this.phoneNumberInput.selectionStart;\n  }\n\n  #setCountryCode(val) {\n    if (val) {\n      const countryCodeItem = this.getCountryByDialCode(val);\n      if (countryCodeItem) {\n        this.countryCodeInput.selectedItem = countryCodeItem;\n      }\n    } else {\n      this.countryCodeInput.selectedItem = undefined;\n    }\n  }\n\n  #setPhoneNumber(val) {\n    if (this.phoneNumberInput.value === val) {\n      return;\n    }\n\n    this.phoneNumberInput.value = val;\n  }\n\n  get phoneNumberValue() {\n    return this.phoneNumberInput.value;\n  }\n\n  get countryCodeValue() {\n    return this.countryCodeInput.shadowRoot.querySelector('input').value;\n  }\n\n  get phoneNumberInputEle() {\n    return this.phoneNumberInput.shadowRoot.querySelector('input');\n  }\n\n  get minLength() {\n    return parseInt(this.getAttribute('minlength'), 10) || 0;\n  }\n\n  getValidity() {\n    const hasCode = this.countryCodeInput.value;\n    const hasPhone = this.phoneNumberInput.value;\n    const emptyValue = !hasCode || !hasPhone;\n    const hasMinPhoneLength =\n      this.phoneNumberInput.value?.length && this.phoneNumberInput.value.length < this.minLength;\n\n    if (this.isRequired && emptyValue) {\n      return { valueMissing: true };\n    }\n    if (hasMinPhoneLength) {\n      return { tooShort: true };\n    }\n    if (hasPhone && !hasCode) {\n      return { valueMissing: true };\n    }\n    return {};\n  }\n\n  init() {\n    this.addEventListener('focus', (e) => {\n      // we want to ignore focus events we are dispatching\n      if (e.isTrusted) this.inputs[1].focus();\n    });\n\n    super.init?.();\n    this.initInputs();\n  }\n\n  getRestrictedCountries() {\n    const attr = this.getAttribute('restrict-countries');\n    return attr ? attr.split(',') : [];\n  }\n\n  getCountryByDialCode(countryDialCode) {\n    return this.countryCodeInput.items?.find((c) => c.getAttribute('data-id') === countryDialCode);\n  }\n\n  getCountryByCodeId(countryCode) {\n    return this.countryCodeInput.items?.find(\n      (c) => c.getAttribute('data-country-code') === countryCode\n    );\n  }\n\n  updateCountryCodeItems(restrictCountries) {\n    const items = restrictCountries.length\n      ? CountryCodes.filter((c) => restrictCountries.includes(c.code))\n      : CountryCodes;\n    this.querySelector('descope-combo-box').innerHTML = items\n      .map((item) => comboBoxItem(item))\n      .join('');\n  }\n\n  handleDefaultCountryCode(countryCode) {\n    if (!this.countryCodeInput.value) {\n      const countryCodeItem = this.getCountryByCodeId(countryCode);\n      // When replacing the input component (inserting internal component into text-field) -\n      // Vaadin resets the input's value. We use setTimeout in order to make sure this happens\n      // after the reset.\n      if (countryCodeItem) {\n        setTimeout(() => {\n          this.countryCodeInput.selectedItem = countryCodeItem;\n        });\n      }\n    }\n  }\n\n  initInputs() {\n    // Sanitize phone input value to filter everything but digits\n    this.phoneNumberInput.addEventListener('input', (e) => {\n      // we want to update only phoneNumberInput, and avoid triggering `set value`\n      e.stopPropagation();\n\n      if (!this.allowAlphanumericInput) {\n        const telDigitsRegExp = /^\\d$/;\n        const sanitizedInput = e.target.value\n          .split('')\n          .filter((char) => telDigitsRegExp.test(char))\n          .join('');\n        e.target.value = sanitizedInput;\n      }\n    });\n\n    this.handleFocusEventsDispatching(this.inputs);\n    this.handleInputEventDispatching();\n  }\n\n  handleLabelTypeAttrs(attrName, newValue) {\n    // set or remove label attributes from inner text/combo components on `label-type` change\n    const attr = mapAttrs[attrName] || attrName;\n\n    if (attrName === 'label-type') {\n      this.onLabelTypeChange(newValue);\n    }\n    // on inner components label attr change - set label attributes for text/combo components\n    // only if label-type is `floating`\n    else if (this.getAttribute('label-type') === 'floating') {\n      if (attrName === 'country-input-label') {\n        this.countryCodeInput.setAttribute(attr, newValue);\n      } else if (attrName === 'label') {\n        this.phoneNumberInput.setAttribute(attr, newValue);\n      }\n    }\n  }\n\n  onLabelTypeChange(newValue) {\n    if (newValue === 'floating') {\n      // on change to `floating` label - set inner components `label` and `placeholder`\n      this.countryCodeInput.setAttribute('label', this.getAttribute('country-input-label') || '');\n      this.countryCodeInput.setAttribute(\n        'placeholder',\n        this.getAttribute('country-input-placeholder') || ''\n      );\n      this.phoneNumberInput.setAttribute('label', this.getAttribute('label') || '');\n      this.phoneNumberInput.setAttribute(\n        'placeholder',\n        this.getAttribute('phone-input-placeholder') || ''\n      );\n    } else {\n      // for other cases - reset inner components label-type and labels\n      this.inputs.forEach((input) => input.removeAttribute('label'));\n    }\n  }\n\n  attributeChangedCallback(attrName, oldValue, newValue) {\n    super.attributeChangedCallback(attrName, oldValue, newValue);\n\n    if (oldValue !== newValue) {\n      if (attrName === 'default-code' && newValue) {\n        this.handleDefaultCountryCode(newValue);\n      } else if (inputRelatedAttrs.includes(attrName)) {\n        const attr = mapAttrs[attrName] || attrName;\n\n        if (commonAttrs.includes(attrName)) {\n          this.inputs.forEach((input) => input.setAttribute(attr, newValue));\n        } else if (countryAttrs.includes(attrName)) {\n          this.countryCodeInput.setAttribute(attr, newValue);\n        } else if (phoneAttrs.includes(attrName)) {\n          this.phoneNumberInput.setAttribute(attr, newValue);\n        }\n      }\n\n      if (labelTypeAttrs.includes(attrName)) {\n        this.handleLabelTypeAttrs(attrName, newValue);\n      }\n\n      if (attrName === 'restrict-countries') {\n        this.updateCountryCodeItems(this.getRestrictedCountries());\n      }\n    }\n  }\n}\n\nexport default PhoneFieldInternal;\n","import '@descope-ui/descope-combo-box';\nimport '../../../descope-text-field';\n\nimport PhoneFieldInternal, { componentName } from './PhoneFieldInternal';\n\ncustomElements.define(componentName, PhoneFieldInternal);\n","import { parsePhoneNumberFromString } from 'libphonenumber-js/min';\n\n// We use JSDelivr (proxy by static.descope.com) in order to fetch the images as image file from this library (svg-country-flags)\n// This reduces our bundle size, and we use it as a static remote resource.\nexport const getCountryFlag = (code) =>\n  `https://static.descope.com/npm/svg-country-flags@1.2.10/svg/${code.toLowerCase()}.svg`;\n\nexport const comboBoxItem = ({ code, dialCode, name: country }) => `\n\t<div\n\t\tdata-id=\"${dialCode}\"\n\t\tdata-name=\"${code} ${dialCode} ${country}\"\n\t\tdata-country-code=\"${code}\"\n\t>\n\t\t<div>\n\t\t\t<span>\n\t\t\t\t<img src=\"${getCountryFlag(code)}\" width=\"20\"/>\n\t\t\t</span>\n\t\t\t<span>${country}</span>\n\t\t</div>\n\t\t<div>\n\t\t\t<span>${code}</span>\n\t\t\t<span>${dialCode}</span>\n\t\t</div>\n\t</div>\n`;\n\nexport const parsePhoneNumber = (val) => {\n  const value = val || '';\n  let countryCode = '';\n  let phoneNumber = '';\n\n  // Attempt to parse the value using libphonenumber-js\n  const parsed = parsePhoneNumberFromString(value);\n\n  if (parsed) {\n    if (parsed.countryCallingCode) {\n      countryCode = `+${parsed.countryCallingCode}`;\n    }\n\n    if (parsed.nationalNumber) {\n      phoneNumber = parsed.nationalNumber;\n    }\n  } else {\n    // Fallback: assume a dash separates country code and phone number\n    const [country, phone] = value.split('-');\n    countryCode = country || '';\n    phoneNumber = phone || '';\n  }\n\n  return [countryCode, phoneNumber];\n};\n","import './descope-phone-field-internal';\nimport '@descope-ui/descope-combo-box';\nimport '../../descope-text-field';\n\nimport { componentName, PhoneFieldClass } from './PhoneFieldClass';\n\ncustomElements.define(componentName, PhoneFieldClass);\n\nexport { PhoneFieldClass, componentName };\n"],"names":["componentName","observedAttrs","TextFieldClass","mappings","proxyProps","useProxyTargets","superclass","observedAttributes","concat","icon","init","super","renderCopyToClipboard","shouldRender","this","remove","iconInitConfig","title","style","iconCopiedConfig","Object","assign","document","createElement","slot","baseElement","appendChild","addEventListener","navigator","clipboard","writeText","value","setTimeout","onLabelClick","focus","attributeChangedCallback","attrName","oldVal","newVal","attributeChangeCallback","_setType","removeEventListener","slots","wrappedEleName","cssVarList","inputOutlineWidth","inputOutlineOffset","excludeAttrsSync","customElements","define","textVars","comboVars","C","host","label","requiredIndicator","inputField","internalAfter","countryCodeInput","phoneInput","separator","errorMessage","helperText","selector","PhoneFieldClass","fontSize","property","fontFamily","overlay","hostWidth","hostDirection","inputBorderStyle","inputBorderWidth","inputBorderColor","inputBorderRadius","countryCodeInputWidth","countryCodeDropdownWidth","phoneInputWidth","horizontalPadding","labelTextColor","labelRequiredIndicator","errorMessageTextColor","errorMessageIcon","errorMessageIconSize","errorMessageIconPadding","errorMessageIconRepeat","errorMessageIconPosition","inputValueTextColor","inputPlaceholderTextColor","inputPlaceholderColor","overlayItemBackgroundColor","inputOutlineStyle","inputOutlineColor","valueInputHeight","valueInputMarginBottom","marginInlineStart","CountryCodes","template","innerHTML","content","cloneNode","inputElement","shadowRoot","querySelector","includeAttrs","countryCodeItems","countryCodeValue","phoneNumberInputEle","countryCodeInputData","countryCodes","Array","from","map","ele","getAttribute","commonAttrs","countryAttrs","phoneAttrs","labelTypeAttrs","mapAttrs","inputRelatedAttrs","BaseInputClass","baseSelector","constructor","item","join","phoneNumberInput","inputs","customValueTransformFn","val","dialCode","split","items","allowAlphanumericInput","phoneNumberValue","countryCode","phoneNumber","setSelectionRange","args","selectionStart","countryCodeItem","getCountryByDialCode","selectedItem","undefined","minLength","parseInt","getValidity","hasCode","hasPhone","emptyValue","hasMinPhoneLength","length","isRequired","valueMissing","tooShort","e","isTrusted","initInputs","getRestrictedCountries","attr","countryDialCode","find","c","getCountryByCodeId","updateCountryCodeItems","restrictCountries","filter","includes","code","handleDefaultCountryCode","stopPropagation","telDigitsRegExp","sanitizedInput","target","char","test","handleFocusEventsDispatching","handleInputEventDispatching","handleLabelTypeAttrs","newValue","onLabelTypeChange","setAttribute","forEach","input","removeAttribute","oldValue","comboBoxItem","name","country","toLowerCase","getCountryFlag","parsePhoneNumber","parsed","countryCallingCode","nationalNumber","phone"],"sourceRoot":""}

package/dist/umd/phone-fields-descope-phone-input-box-field-descope-phone-input-box-internal-index-js.js

@@ -1,5 +1,5 @@
 /*! For license information please see phone-fields-descope-phone-input-box-field-descope-phone-input-box-internal-index-js.js.LICENSE.txt */
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[8657],{69473:(t,e,i)=>{i.d(e,{T:()=>o,w:()=>d});var n=i(94619),a=i(93826),s=i(7138),r=i(14944),l=i(33177);const o=(0,r.xE)("text-field"),u=["type","label-type","copy-to-clipboard"],d=(0,s.Zz)((0,n.RF)({mappings:a.A}),n.VO,(0,n.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),n.tQ,(t=>class extends t{static get observedAttributes(){return u.concat(t.observedAttributes||[])}icon;init(){super.init?.()}renderCopyToClipboard(t){if(!t)return void this.icon?.remove();const e={icon:"vaadin:copy-o",title:"Copy",style:"cursor: pointer"},i={icon:"vaadin:check-circle-o",title:"Copied",style:"cursor: initial"};this.icon=Object.assign(document.createElement("vaadin-icon"),{slot:"suffix",...e}),this.baseElement.appendChild(this.icon),this.icon.addEventListener("click",(()=>{navigator.clipboard.writeText(this.value),Object.assign(this.icon,i),setTimeout((()=>{Object.assign(this.icon,e)}),5e3)}))}onLabelClick(){this.focus()}attributeChangedCallback(t,e,i){super.attributeChangeCallback?.(t,e,i),"type"===t&&this.baseElement._setType(i),e!==i&&("label-type"===t?"floating"===i?this.addEventListener("click",this.onLabelClick):this.removeEventListener("click",this.onLabelClick):"copy-to-clipboard"===t&&this.renderCopyToClipboard("true"===i))}}))((0,n.tz)({slots:["prefix","suffix"],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tpadding: calc(var(${d.cssVarList.inputOutlineWidth}) + var(${d.cssVarList.inputOutlineOffset}));\n        box-sizing: border-box;\n\t\t\t}\n      :host(:is([readonly], [disabled])) ::slotted(:is(input, textarea):placeholder-shown) {\n        opacity: 1;\n      }\n\n      vaadin-text-field[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n        opacity: 0;\n      }\n      vaadin-text-field[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n        opacity: 0;\n      }\n      ${(0,l.$J)("vaadin-text-field")}\n\t\t\t${(0,l.cy)(d.cssVarList)}\n\t\t\t${(0,l.LJ)("vaadin-text-field",d.cssVarList)}\n      ${(0,l.Kl)()}\n\n      vaadin-text-field vaadin-icon {\n        align-self: center;\n      }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:o}))},89348:(t,e,i)=>{i.r(e),i.d(e,{TextFieldClass:()=>n.w,componentName:()=>n.T}),i(63970),i(23638),i(80201);var n=i(69473);customElements.define(n.T,n.w)},43945:(t,e,i)=>{i.d(e,{A:()=>d,T:()=>r});var n=i(25827),a=i(14944),s=i(63789);const r=(0,a.xE)("phone-field-internal-input-box"),l=["disabled","size","bordered","invalid","readonly","phone-input-placeholder","name","autocomplete","label-type","allow-alphanumeric-input"],o={"phone-input-placeholder":"placeholder"},u=(0,n.y)({componentName:r,baseSelector:"div"}),d=class extends u{static get observedAttributes(){return[].concat(u.observedAttributes||[],l)}constructor(){super(),this.innerHTML='\n      <div>\n        <descope-text-field tabindex="1"></descope-text-field>\n      </div>\n      ',this.phoneNumberInput=this.querySelector("descope-text-field")}get defaultCountryCode(){return(0,s.Q)(this.getAttribute("default-code"))}get hasDefaultCode(){return!!this.getAttribute("default-code")}get allowAlphanumericInput(){return"true"===this.getAttribute("allow-alphanumeric-input")}get value(){if(!this.phoneNumberValue)return"";if(this.hasDefaultCode){const t=new RegExp(`\\+?${parseInt(this.defaultCountryCode,10)}--?`);return`${this.defaultCountryCode}-${this.phoneNumberInput.value.replace(t,"")}`}return this.phoneNumberInput.value}set value(t){this.phoneNumberInput.value=t}get phoneNumberValue(){return this.phoneNumberInput.value}get phoneNumberInputEle(){return this.phoneNumberInput.shadowRoot.querySelector("input")}get minLength(){return parseInt(this.getAttribute("minlength"),10)||0}get maxLength(){return parseInt(this.getAttribute("maxlength"),10)||50}getValidity(){const t=this.value.replace(/\D/g,"");return this.isRequired&&!this.value?{valueMissing:!0}:t.length<this.minLength?{tooShort:!0}:t.length>this.maxLength?{tooLong:!0}:this.value&&!/^\+?\d{1,4}-?(?:\d-?){1,15}$/.test(this.value)?{patternMismatch:!0}:{}}init(){this.addEventListener("focus",(t=>{t.isTrusted&&this.phoneNumberInput.focus()})),super.init?.(),this.initInputs()}getCountryByDialCode(t){return this.countryCodeInput.items?.find((e=>e.getAttribute("data-country-code")===t))}initInputs(){this.phoneNumberInput.addEventListener("input",(t=>{1===t.target.value.length&&"-"===t.target.value&&(t.target.value=""),t.target.value=t.target.value.replace(/(?!^)\+/g,"").replace("--","-").replace("+-","+");let e=t.target.value;if(!this.allowAlphanumericInput){const i=/^[+\d-]+$/;e=t.target.value.split("").filter((t=>i.test(t))).join("")}t.target.value=e})),this.handleFocusEventsDispatching([this.phoneNumberInput])}attributeChangedCallback(t,e,i){if(super.attributeChangedCallback(t,e,i),e!==i&&l.includes(t)){const e=o[t]||t;this.phoneNumberInput.setAttribute(e,i)}}}},46633:(t,e,i)=>{i.r(e),i(89348);var n=i(43945);customElements.define(n.T,n.A)},63789:(t,e,i)=>{i.d(e,{Q:()=>a});var n=i(44066);const a=t=>n.A.find((e=>e.code===t))?.dialCode},21860:(t,e,i)=>{i.d(e,{f:()=>a});var n=i(95925);class a extends n.r{constructor(t,e){super(t,"input","input",{initializer:(t,i)=>{i.value&&(t.value=i.value),i.type&&t.setAttribute("type",i.type),t.id=this.defaultId,"function"==typeof e&&e(t)},useUniqueId:!0})}}},60978:(t,e,i)=>{i.d(e,{a:()=>a});var n=i(60354);const a=t=>class extends((0,n.R)(t)){static get properties(){return{autocomplete:{type:String},autocorrect:{type:String},autocapitalize:{type:String,reflectToAttribute:!0}}}static get delegateAttrs(){return[...super.delegateAttrs,"autocapitalize","autocomplete","autocorrect"]}get __data(){return this.__dataValue||{}}set __data(t){this.__dataValue=t}_inputElementChanged(t){super._inputElementChanged(t),t&&(t.value&&t.value!==this.value&&(console.warn(`Please define value on the <${this.localName}> component!`),t.value=""),this.value&&(t.value=this.value))}_setFocused(t){super._setFocused(t),!t&&document.hasFocus()&&this.validate()}_onInput(t){super._onInput(t),this.invalid&&this.validate()}_valueChanged(t,e){super._valueChanged(t,e),void 0!==e&&this.invalid&&this.validate()}}},10056:(t,e,i)=>{i.d(e,{A:()=>h}),i(94009);var n=i(98633),a=i(65211),s=i(27150),r=i(83798),l=i(9685),o=i(57224),u=i(21860),d=i(60978),p=i(19074);const c=t=>class extends((0,d.a)(t)){static get properties(){return{maxlength:{type:Number},minlength:{type:Number},pattern:{type:String}}}static get delegateAttrs(){return[...super.delegateAttrs,"maxlength","minlength","pattern"]}static get constraints(){return[...super.constraints,"maxlength","minlength","pattern"]}constructor(){super(),this._setType("text")}get clearElement(){return this.$.clearButton}ready(){super.ready(),this.addController(new u.f(this,(t=>{this._setInputElement(t),this._setFocusElement(t),this.stateTarget=t,this.ariaTarget=t}))),this.addController(new p.q(this.inputElement,this._labelController))}};(0,o.SF)("vaadin-text-field",l.k,{moduleId:"vaadin-text-field-styles"});class h extends(c((0,o.cp)((0,s.q)(n.Pu)))){static get is(){return"vaadin-text-field"}static get template(){return n.qy`
+"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[8657],{79275:(t,e,i)=>{i.d(e,{T:()=>o,w:()=>d});var n=i(79365),a=i(6424),s=i(9696),r=i(97810),l=i(73551);const o=(0,r.xE)("text-field"),u=["type","label-type","copy-to-clipboard"],d=(0,s.Zz)((0,n.RF)({mappings:a.A}),n.VO,(0,n.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),n.tQ,(t=>class extends t{static get observedAttributes(){return u.concat(t.observedAttributes||[])}icon;init(){super.init?.()}renderCopyToClipboard(t){if(!t)return void this.icon?.remove();const e={icon:"vaadin:copy-o",title:"Copy",style:"cursor: pointer"},i={icon:"vaadin:check-circle-o",title:"Copied",style:"cursor: initial"};this.icon=Object.assign(document.createElement("vaadin-icon"),{slot:"suffix",...e}),this.baseElement.appendChild(this.icon),this.icon.addEventListener("click",(()=>{navigator.clipboard.writeText(this.value),Object.assign(this.icon,i),setTimeout((()=>{Object.assign(this.icon,e)}),5e3)}))}onLabelClick(){this.focus()}attributeChangedCallback(t,e,i){super.attributeChangeCallback?.(t,e,i),"type"===t&&this.baseElement._setType(i),e!==i&&("label-type"===t?"floating"===i?this.addEventListener("click",this.onLabelClick):this.removeEventListener("click",this.onLabelClick):"copy-to-clipboard"===t&&this.renderCopyToClipboard("true"===i))}}))((0,n.tz)({slots:["prefix","suffix"],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tpadding: calc(var(${d.cssVarList.inputOutlineWidth}) + var(${d.cssVarList.inputOutlineOffset}));\n        box-sizing: border-box;\n\t\t\t}\n      :host(:is([readonly], [disabled])) ::slotted(:is(input, textarea):placeholder-shown) {\n        opacity: 1;\n      }\n\n      vaadin-text-field[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n        opacity: 0;\n      }\n      vaadin-text-field[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n        opacity: 0;\n      }\n      ${(0,l.$J)("vaadin-text-field")}\n\t\t\t${(0,l.cy)(d.cssVarList)}\n\t\t\t${(0,l.LJ)("vaadin-text-field",d.cssVarList)}\n      ${(0,l.Kl)()}\n\n      vaadin-text-field vaadin-icon {\n        align-self: center;\n      }\n\t\t`,excludeAttrsSync:["tabindex","style"],componentName:o}))},21374:(t,e,i)=>{i.r(e),i.d(e,{TextFieldClass:()=>n.w,componentName:()=>n.T}),i(11284),i(37182),i(95260);var n=i(79275);customElements.define(n.T,n.w)},9035:(t,e,i)=>{i.d(e,{A:()=>d,T:()=>r});var n=i(3393),a=i(97810),s=i(92259);const r=(0,a.xE)("phone-field-internal-input-box"),l=["disabled","size","bordered","invalid","readonly","phone-input-placeholder","name","autocomplete","label-type","allow-alphanumeric-input"],o={"phone-input-placeholder":"placeholder"},u=(0,n.y)({componentName:r,baseSelector:"div"}),d=class extends u{static get observedAttributes(){return[].concat(u.observedAttributes||[],l)}constructor(){super(),this.innerHTML='\n      <div>\n        <descope-text-field tabindex="1"></descope-text-field>\n      </div>\n      ',this.phoneNumberInput=this.querySelector("descope-text-field")}get defaultCountryCode(){return(0,s.Q)(this.getAttribute("default-code"))}get hasDefaultCode(){return!!this.getAttribute("default-code")}get allowAlphanumericInput(){return"true"===this.getAttribute("allow-alphanumeric-input")}get value(){if(!this.phoneNumberValue)return"";if(this.hasDefaultCode){const t=new RegExp(`\\+?${parseInt(this.defaultCountryCode,10)}--?`);return`${this.defaultCountryCode}-${this.phoneNumberInput.value.replace(t,"")}`}return this.phoneNumberInput.value}set value(t){this.phoneNumberInput.value=t}get phoneNumberValue(){return this.phoneNumberInput.value}get phoneNumberInputEle(){return this.phoneNumberInput.shadowRoot.querySelector("input")}get minLength(){return parseInt(this.getAttribute("minlength"),10)||0}get maxLength(){return parseInt(this.getAttribute("maxlength"),10)||50}getValidity(){const t=this.value.replace(/\D/g,"");return this.isRequired&&!this.value?{valueMissing:!0}:t.length<this.minLength?{tooShort:!0}:t.length>this.maxLength?{tooLong:!0}:this.value&&!/^\+?\d{1,4}-?(?:\d-?){1,15}$/.test(this.value)?{patternMismatch:!0}:{}}init(){this.addEventListener("focus",(t=>{t.isTrusted&&this.phoneNumberInput.focus()})),super.init?.(),this.initInputs()}getCountryByDialCode(t){return this.countryCodeInput.items?.find((e=>e.getAttribute("data-country-code")===t))}initInputs(){this.phoneNumberInput.addEventListener("input",(t=>{1===t.target.value.length&&"-"===t.target.value&&(t.target.value=""),t.target.value=t.target.value.replace(/(?!^)\+/g,"").replace("--","-").replace("+-","+");let e=t.target.value;if(!this.allowAlphanumericInput){const i=/^[+\d-]+$/;e=t.target.value.split("").filter((t=>i.test(t))).join("")}t.target.value=e})),this.handleFocusEventsDispatching([this.phoneNumberInput])}attributeChangedCallback(t,e,i){if(super.attributeChangedCallback(t,e,i),e!==i&&l.includes(t)){const e=o[t]||t;this.phoneNumberInput.setAttribute(e,i)}}}},78343:(t,e,i)=>{i.r(e),i(21374);var n=i(9035);customElements.define(n.T,n.A)},92259:(t,e,i)=>{i.d(e,{Q:()=>a});var n=i(51680);const a=t=>n.A.find((e=>e.code===t))?.dialCode},18330:(t,e,i)=>{i.d(e,{f:()=>a});var n=i(44099);class a extends n.r{constructor(t,e){super(t,"input","input",{initializer:(t,i)=>{i.value&&(t.value=i.value),i.type&&t.setAttribute("type",i.type),t.id=this.defaultId,"function"==typeof e&&e(t)},useUniqueId:!0})}}},37436:(t,e,i)=>{i.d(e,{a:()=>a});var n=i(44218);const a=t=>class extends((0,n.R)(t)){static get properties(){return{autocomplete:{type:String},autocorrect:{type:String},autocapitalize:{type:String,reflectToAttribute:!0}}}static get delegateAttrs(){return[...super.delegateAttrs,"autocapitalize","autocomplete","autocorrect"]}get __data(){return this.__dataValue||{}}set __data(t){this.__dataValue=t}_inputElementChanged(t){super._inputElementChanged(t),t&&(t.value&&t.value!==this.value&&(console.warn(`Please define value on the <${this.localName}> component!`),t.value=""),this.value&&(t.value=this.value))}_setFocused(t){super._setFocused(t),!t&&document.hasFocus()&&this.validate()}_onInput(t){super._onInput(t),this.invalid&&this.validate()}_valueChanged(t,e){super._valueChanged(t,e),void 0!==e&&this.invalid&&this.validate()}}},27136:(t,e,i)=>{i.d(e,{A:()=>h}),i(86689);var n=i(13256),a=i(82901),s=i(90676),r=i(81488),l=i(86314),o=i(87550),u=i(18330),d=i(37436),p=i(37720);const c=t=>class extends((0,d.a)(t)){static get properties(){return{maxlength:{type:Number},minlength:{type:Number},pattern:{type:String}}}static get delegateAttrs(){return[...super.delegateAttrs,"maxlength","minlength","pattern"]}static get constraints(){return[...super.constraints,"maxlength","minlength","pattern"]}constructor(){super(),this._setType("text")}get clearElement(){return this.$.clearButton}ready(){super.ready(),this.addController(new u.f(this,(t=>{this._setInputElement(t),this._setFocusElement(t),this.stateTarget=t,this.ariaTarget=t}))),this.addController(new p.q(this.inputElement,this._labelController))}};(0,o.SF)("vaadin-text-field",l.k,{moduleId:"vaadin-text-field-styles"});class h extends(c((0,o.cp)((0,s.q)(n.Pu)))){static get is(){return"vaadin-text-field"}static get template(){return n.qy`
       <style>
         [part='input-field'] {
           flex-grow: 0;
@@ -34,4 +34,5 @@
         </div>
       </div>
       <slot name="tooltip"></slot>
-    `}static get properties(){return{maxlength:{type:Number},minlength:{type:Number}}}ready(){super.ready(),this._tooltipController=new r.I(this),this._tooltipController.setPosition("top"),this._tooltipController.setAriaTarget(this.inputElement),this.addController(this._tooltipController)}}(0,a.X)(h)},44085:(t,e,i)=>{i(67239);var n=i(80704);(0,i(57224).SF)("vaadin-text-field",n.k,{moduleId:"lumo-text-field-styles"}),i(10056)},63970:(t,e,i)=>{i(44085),i(10056)}}]);
+    `}static get properties(){return{maxlength:{type:Number},minlength:{type:Number}}}ready(){super.ready(),this._tooltipController=new r.I(this),this._tooltipController.setPosition("top"),this._tooltipController.setAriaTarget(this.inputElement),this.addController(this._tooltipController)}}(0,a.X)(h)},52733:(t,e,i)=>{i(27397);var n=i(47642);(0,i(87550).SF)("vaadin-text-field",n.k,{moduleId:"lumo-text-field-styles"}),i(27136)},11284:(t,e,i)=>{i(52733),i(27136)}}]);
+//# sourceMappingURL=phone-fields-descope-phone-input-box-field-descope-phone-input-box-internal-index-js.js.map