@descope/web-components-ui 3.23.3 → 3.25.0

package/dist/umd/descope-email-field.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"descope-email-field.js","mappings":";+NAkBO,MAAAA,GAAsB,EAAAC,EAAAC,IAAgB,eAG7CC,EAAA,SAyFAC,KACAA,EAAAC,MACAA,EAAAC,YACAA,EAAAC,kBACAA,EAAAC,WACAA,EAAAC,MACAA,EAAAC,UACAA,EAAAC,WACAA,EAAAC,aACAA,EAAAC,oBACAA,EAAAC,cACAA,EAAAC,UACAA,EAAAC,cACAA,EAAAC,sBACAA,EAAAC,oBACAA,EAAAC,4BACAA,GACE,CACFf,KAAA,CAAUgB,SAAA,aACVf,MAAA,CAAWe,SAAA,iBACXb,kBAAA,CACAa,SAAA,+CAEAd,YAAA,CACA,CAAMc,SAAA,6BACN,CAAMA,SAAA,gDAENP,oBAAA,CAAyBO,SAAA,iCACzBZ,WAAA,CAAgBY,SAAA,uBAChBX,MAAA,CAAWW,SAAA,SACXV,UAAA,CAAeU,SAAA,+BACfN,cAAA,CAAmBM,SAAA,kBACnBT,WAAA,CAAgBS,SAAA,uBAChBR,aAAA,CAAkBQ,SAAA,yBAClBL,UAAA,CAAeK,SAAA,eACfJ,cAAA,CAAmBI,SAAA,wBACnBH,sBAAA,CAA2BG,SAAA,iCAC3BF,oBAAA,CAAyBE,SAAA,0CACzBD,4BAAA,CACAC,SAAA,+CAIOC,GAAwB,EAAAC,EAAAC,KAC7B,EAAAC,EAAAC,IAAgB,CAClBC,SAAA,CAEAC,SAAA,IAAmBvB,GACnBwB,WAAA,CAAAvB,EAAAG,EAAAG,EAAAC,GAEAiB,cAAA,IAAuBxB,EAAAyB,SAAA,aACvBC,gBAAA,IAAyB1B,EAAAyB,SAAA,eAEzBE,qBAAA,CACA,IAAUvB,EAAAqB,SAAA,eACV,IAAUd,EAAAc,SAAA,gBAEVG,2BAAA,CACA,CACAb,SAAA,oCACAU,SAAA,eAEA,IAAUZ,EAAAY,SAAA,gBAEVI,qBAAA,IAA8BvB,EAAAmB,SAAA,eAC9BK,uBAAA,IAAgCvB,EAAAkB,SAAA,eAEhCM,eAAA,CACA,IAAU/B,EAAAyB,SAAA,SACV,IAAUvB,EAAAuB,SAAA,SACV,IAAUzB,EAAAyB,SAAA,2BACV,IAAUvB,EAAAuB,SAAA,4BAGVO,UAAA,IAAmBjC,EAAA0B,SAAA,SACnBQ,aAAA,IAAsBlC,EAAA0B,SAAA,aACtBS,cAAA,IAAuBnC,EAAA0B,SAAA,aACvBU,eAAA,IAAwB/B,EAAAqB,SAAA,aAExBW,qBAAA,CACA,IAAUjC,EAAAsB,SAAA,oBACV,IAAUpB,EAAAoB,SAAA,qBAGVY,sBAAA,IAA+B9B,EAAAkB,SAAA,SAC/Ba,iBAAA,IAA0B/B,EAAAkB,SAAA,oBAC1Bc,qBAAA,IAA8BhC,EAAAkB,SAAA,mBAC9Be,wBAAA,IACAjC,EACAkB,SAAA,wBAEAgB,uBAAA,IACAlC,EACAkB,SAAA,qBAEAiB,yBAAA,IACAnC,EACAkB,SAAA,uBAEAkB,qBAAA,IAA8BpC,EAAAkB,SAAA,aAE9BmB,gBAAA,IAAyBtC,EAAAmB,SAAA,2BAEzBoB,oBAAA,CACA,IAAU1C,EAAAsB,SAAA,SACV,IAAUhB,EAAAgB,SAAA,2BACV,IAAUb,EAAAa,SAAA,4BAEVqB,oBAAA,CACA,IAAU1C,EAAAqB,SAAA,eACV,IAAUd,EAAAc,SAAA,gBAGVsB,uBAAA,IAAgC7C,EAAAuB,SAAA,WAEhCuB,iBAAA,IAA0B7C,EAAAsB,SAAA,gBAC1BwB,iBAAA,IAA0B9C,EAAAsB,SAAA,gBAC1ByB,iBAAA,IAA0B/C,EAAAsB,SAAA,gBAC1B0B,kBAAA,IAA2BhD,EAAAsB,SAAA,iBAE3B2B,YAAA,IAAqBjD,EAAAsB,SAAA,UACrB4B,uBAAA,CACA,IAAUjD,EAAAqB,SAAA,gBACV,IAAUrB,EAAAqB,SAAA,iBACV,IAAUd,EAAAc,SAAA,gBACV,IAAUd,EAAAc,SAAA,kBAGV6B,kBAAA,IAA2BnD,EAAAsB,SAAA,iBAC3B8B,kBAAA,IAA2BpD,EAAAsB,SAAA,iBAC3B+B,kBAAA,IAA2BrD,EAAAsB,SAAA,iBAC3BgC,mBAAA,IAA4BtD,EAAAsB,SAAA,kBAE5BiC,UAAA,GAEAC,eAAA,CACA,IAAUvD,EAAAqB,SAAA,cACV,IAAUd,EAAAc,SAAA,eAGVmC,sBAAA,CACA,CAAU7C,SAAA,oCAAAU,SAAA,SACV,IAAUZ,EAAAY,SAAA,SACV,IAAUxB,EAAAwB,SAAA,SACV,IAAUjB,EAAAiB,SAAA,2BACV,IAAUX,EAAAW,SAAA,4BAGVoC,cAAA,IAAuB7D,EAAAyB,SAAA,YACvBqC,iBAAA,IAA0B9D,EAAAyB,SAAA,OAC1BsC,wBAAA,CACA,IAAU/D,EAAAyB,SAAA,QACV,IAAUzB,EAAAyB,SAAA,UAEVuC,gBAAA,IAAyBhE,EAAAyB,SAAA,aACzBwC,gBAAA,IAAyBjE,EAAAyB,SAAA,cACzByC,kBAAA,IAA2BlE,EAAAyB,SAAA,uBAC3B0C,mBAAA,CACA,CAAUpD,SAAA,4BAAAU,SAAA,WACV,IAAUZ,EAAAY,SAAA,YAEV2C,uBAAA,CACA,IAAUjE,EAAAsB,SAAA,eACV,IAAUd,EAAAc,SAAA,gBAEV4C,iBAAA,CACA,IAAUjE,EAAAqB,SAAA,UACV,IAAUd,EAAAc,SAAA,WAEV6C,uBAAA,CACA,IAAUlE,EAAAqB,SAAA,iBACV,IAAUd,EAAAc,SAAA,kBAGV8C,gBAAA,CACA,IAAU7D,EAAAe,SAAA,gBACV,IAAUf,EAAAe,SAAA,gBAEV+C,cAAA,IAAuB9D,EAAAe,SAAA,aACvBgD,eAAA,IAAwB/D,EAAAe,SAAA,SACxBiD,kBAAA,CACA,IAAUtE,EAAAqB,SAAA,yBACV,IAAUrB,EAAAqB,SAAA,iBACV,IAAUd,EAAAc,SAAA,yBACV,IAAUd,EAAAc,SAAA,qBAIRN,EAAAwD,IACA,EAAAxD,EAAAyD,IAAkB,CACpBC,UAAA,QACAC,UAAA,QACAC,iBAAA,WACAC,aAAA,qCAEE,EAAA7D,EAAA8D,IAAe,CACjBC,WAAA,2BACAC,iBAAA,IAEEhE,EAAAiE,GA9RFC,GACA,cAAAA,EAMA,kBAAAC,GACA,gBAAAC,KAAAC,aAAA,iBACA,CAKA,mBAAAC,GACA,gBAAAF,KAAAC,aAAA,kBACA,CAEA,IAAAE,GACAC,MAAAD,SAGAH,KAAAK,YAAAC,aAAA,UAA+CC,EAAAC,GAE/CR,KAAAC,aAAA,iBACAD,KAAAM,aAAA,eA5BA,YA+BAN,KAAAS,sBAEA,CAAAT,KAAAU,aAAAV,KAAA5E,eACAuF,OAAAC,SACAC,QAAAhG,IACAA,EAAAiG,iBAAA,SAAAd,KAAAe,8BAGAf,KAAAD,gBACAC,KAAAgB,gBAGAhB,KAAAE,iBACAF,KAAAiB,yBAEA,CAEA,aAAAD,GACAhB,KAAAK,YAAAC,aAAA,UAA+CC,EAAAW,GAC/ClB,KAAAmB,aACA,CAEA,uBAAAF,GAEAjB,KAAAK,YAAAe,gBAAA,WACApB,KAAAmB,aACA,CAEA,WAAAA,GAKAnB,KAAAK,YAAAgB,SAAA,QAEArB,KAAA5E,gBACA4E,KAAA5E,cAAAkG,KAAA,QAIAtB,KAAAC,aAAA,cACAD,KAAAM,aAAA,YAAA/F,GAGAyF,KAAA5E,eAAAkF,aAAA,YAAA/F,EACA,CAEAwG,2BAAAQ,IACA,MAAAC,EAAAD,EAAAE,OAAAC,MAAAC,OACAH,IAAAD,EAAAE,OAAAC,QACA1B,KAAA0B,MAAAF,EAGAxB,KAAAU,aAAAkB,cACA,IAAAC,MAAA,SAA6BC,SAAA,EAAAC,UAAA,QAgDE,EA+J7B,EAAAnG,EAAAoG,IAAW,CACbC,MAAA,cACAC,eAAA,qBACAC,MAAA,4GAIwB1G,EAAA2G,WAAAnE,4BACxBxC,EAAA2G,WAAAlE,2EAIQ,EAAAmE,EAAAC,IAAuB,iCAC1B,EAAAD,EAAAE,IAAsB9G,EAAA2G,uBACtB,EAAAC,EAAAG,IAAmB,qBAAA/G,EAAA2G,uBAChB,EAAAC,EAAAI,qdAiBRC,iBAAA,qBACAtI,0DCpVO,MAAAuI,EACP,uFAEOC,EACP,qQCDA,MAAAC,EAAmBC,EAAAC,EAAG;;;;;;;;GAUtB,EAAAD,EAAAE,IAAc,sBAAwBC,EAAAC,EAAgBL,GAAA,CACtDM,SAAA,+CCXO,MAAAC,WAAyBL,EAAG;;;;;;;;;GCEnC,EAAAD,EAAAE,IAAc,qBAAuBI,EAAgB,CAAID,SAAA,8BAyBlD,MAAAE,UAAyBC,EAAAC,EAChC,aAAAC,GACA,0BACA,CAEA,WAAAC,GACArD,QACAJ,KAAAqB,SAAA,SACArB,KAAA0D,QAAA,gEACA,CAGA,KAAAC,GACAvD,MAAAuD,QAEA3D,KAAAU,eACAV,KAAAU,aAAAkD,eAAA,MAEA,GAGA,EAAAC,EAAAC,GAAmBT,kBCrDnBU,eAAAC,OAAsBvI,EAAAwI,EAAexI,EAAAyI,iDCO9B,MAAAC,UAA8BC,EAAAC,EACrC,WAAAZ,CAAAjJ,EAAA8J,GACAlE,MAAA5F,EAAA,iBACA+J,YAAA,CAAAC,EAAAhK,KACAA,EAAAkH,QACA8C,EAAA9C,MAAAlH,EAAAkH,OAEAlH,EAAA8G,MACAkD,EAAAlE,aAAA,OAAA9F,EAAA8G,MAIAkD,EAAAC,GAAAzE,KAAA0E,UAEA,mBAAAJ,GACAA,EAAAE,IAGAG,aAAA,GAEA,iDCjBO,MAAAC,EAAA9E,GACP,eAAqC,EAAA+E,EAAAC,GAAiBhF,IACtD,qBAAAiF,GACA,OAMAC,aAAA,CACA1D,KAAA2D,QAUAC,YAAA,CACA5D,KAAA2D,QAYArB,eAAA,CACAtC,KAAA2D,OACAE,oBAAA,GAGA,CAEA,wBAAAC,GACA,UAAAhF,MAAAgF,cAAA,8CACA,CAGA,UAAAC,GACA,OAAArF,KAAAsF,aAAA,EACA,CAEA,UAAAD,CAAA3D,GACA1B,KAAAsF,YAAA5D,CACA,CAOA,oBAAA6D,CAAA1K,GACAuF,MAAAmF,qBAAA1K,GAEAA,IAEAA,EAAA6G,OAAA7G,EAAA6G,QAAA1B,KAAA0B,QACA8D,QAAAC,KAAA,+BAAsDzF,KAAA0F,yBACtD7K,EAAA6G,MAAA,IAGA1B,KAAA0B,QACA7G,EAAA6G,MAAA1B,KAAA0B,OAGA,CAQA,WAAAiE,CAAAC,GACAxF,MAAAuF,YAAAC,IAIAA,GAAAC,SAAAC,YACA9F,KAAA+F,UAEA,CASA,QAAAC,CAAAC,GACA7F,MAAA4F,SAAAC,GAEAjG,KAAAkG,SACAlG,KAAA+F,UAEA,CAWA,aAAAI,CAAAC,EAAAC,GACAjG,MAAA+F,cAAAC,EAAAC,QAEAC,IAAAD,GAIArG,KAAAkG,SACAlG,KAAA+F,UAEA,kJC1HO,MAAAQ,EAAAC,GACP,eAAoC,EAAAC,EAAAjG,GAAegG,IACnD,qBAAAzB,GACA,OAIA2B,UAAA,CACApF,KAAAqF,QAMAC,UAAA,CACAtF,KAAAqF,QAOAjD,QAAA,CACApC,KAAA2D,QAGA,CAEA,wBAAAG,GACA,UAAAhF,MAAAgF,cAAA,kCACA,CAEA,sBAAAyB,GACA,UAAAzG,MAAAyG,YAAA,kCACA,CAEA,WAAApD,GACArD,QACAJ,KAAAqB,SAAA,OACA,CAGA,gBAAAyF,GACA,OAAA9G,KAAA+G,EAAAC,WACA,CAGA,KAAArD,GACAvD,MAAAuD,QAEA3D,KAAAiH,cACA,IAAYC,EAAAC,EAAenH,KAAAnF,IAC3BmF,KAAAoH,iBAAAvM,GACAmF,KAAAqH,iBAAAxM,GACAmF,KAAAsH,YAAAzM,EACAmF,KAAAuH,WAAA1M,KAGAmF,KAAAiH,cAAA,IAA6BO,EAAAC,EAAuBzH,KAAAU,aAAAV,KAAA0H,kBACpD,IC5DA,EAAA5E,EAAAE,IAAc,oBAAsB2E,EAAAzE,EAAgB,CAAIC,SAAA,6BAuEjD,MAAAyE,UAAwBrB,GAAe,EAAAzD,EAAA+E,KAAc,EAAAC,EAAAL,GAAaM,EAAAC,OACzE,aAAAxE,GACA,yBACA,CAEA,mBAAAyE,GACA,OAAWF,EAAAG,EAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAoCf,CAEA,qBAAAnD,GACA,OAIA2B,UAAA,CACApF,KAAAqF,QAMAC,UAAA,CACAtF,KAAAqF,QAGA,CAGA,KAAAhD,GACAvD,MAAAuD,QAEA3D,KAAAmI,mBAAA,IAAkCC,EAAAC,EAAiBrI,MACnDA,KAAAmI,mBAAAG,YAAA,OACAtI,KAAAmI,mBAAAI,cAAAvI,KAAAU,cACAV,KAAAiH,cAAAjH,KAAAmI,mBACA,GAGA,EAAAtE,EAAAC,GAAmB8D,0CCrJnB,WAAA5E,IAAc,oBAAsBC,EAAAC,EAAgB,CACpDC,SAAA","sources":["webpack://@descope/web-components-ui/../components/descope-email-field/src/component/EmailFieldClass.js","webpack://@descope/web-components-ui/../components/descope-email-field/src/component/emailPattern.js","webpack://@descope/web-components-ui/javascript/libs/webpack-extract-font-loader/node_modules/@vaadin/email-field/theme/lumo/vaadin-email-field-styles.js","webpack://@descope/web-components-ui/javascript/libs/webpack-extract-font-loader/node_modules/@vaadin/email-field/src/vaadin-email-field-styles.js","webpack://@descope/web-components-ui/javascript/libs/webpack-extract-font-loader/node_modules/@vaadin/email-field/src/vaadin-email-field.js","webpack://@descope/web-components-ui/../components/descope-email-field/src/component/index.js","webpack://@descope/web-components-ui/javascript/libs/webpack-extract-font-loader/node_modules/@vaadin/field-base/src/input-controller.js","webpack://@descope/web-components-ui/javascript/libs/webpack-extract-font-loader/node_modules/@vaadin/field-base/src/input-field-mixin.js","webpack://@descope/web-components-ui/javascript/libs/webpack-extract-font-loader/node_modules/@vaadin/text-field/src/vaadin-text-field-mixin.js","webpack://@descope/web-components-ui/javascript/libs/webpack-extract-font-loader/node_modules/@vaadin/text-field/src/vaadin-text-field.js","webpack://@descope/web-components-ui/javascript/libs/webpack-extract-font-loader/node_modules/@vaadin/text-field/theme/lumo/vaadin-text-field-styles.js"],"sourcesContent":["import {\n  createStyleMixin,\n  draggableMixin,\n  createProxy,\n  proxyInputMixin,\n  componentNameValidationMixin,\n  externalInputMixin,\n} from '@descope-ui/common/components-mixins';\nimport { compose } from '@descope-ui/common/utils';\nimport { asciiPattern, unicodePattern } from './emailPattern';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport {\n  inputFloatingLabelStyle,\n  resetInputLabelPosition,\n  resetInputOverrides,\n  useHostExternalPadding,\n} from '@descope-ui/common/theme-helpers';\n\nexport const componentName = getComponentName('email-field');\n\nconst defaultAutocomplete = 'username';\nconst defaultInputMode = 'email';\n\nconst customMixin = (superclass) =>\n  class EmailFieldMixinClass extends superclass {\n    // On by default - `accept-unicode=\"false\"` restores the pre-unicode field:\n    // native `type=\"email\"` validation and the ASCII pattern.\n    //\n    // Read once, in `init`. Changing the attribute afterwards has no effect; it\n    // is static configuration, which is how every consumer sets it.\n    get acceptsUnicode() {\n      return this.getAttribute('accept-unicode') !== 'false';\n    }\n\n    // On by default - `validate-format=\"false\"` drops the field's own format\n    // check (the pattern and native `type=\"email\"`), for composites that check\n    // the format themselves (descope-new-email). Read once, in `init`.\n    get validatesFormat() {\n      return this.getAttribute('validate-format') !== 'false';\n    }\n\n    init() {\n      super.init?.();\n\n      // we need to set the pattern on the base element because vaadin-email-field is overriding it\n      this.baseElement.setAttribute('pattern', asciiPattern);\n\n      if (!this.getAttribute('autocomplete')) {\n        this.setAttribute('autocomplete', defaultAutocomplete);\n      }\n\n      this.createExternalInput();\n\n      [this.inputElement, this.externalInput]\n        .filter(Boolean)\n        .forEach((input) => {\n          input.addEventListener('change', this.stripSurroundingWhitespace);\n        });\n\n      if (this.acceptsUnicode) {\n        this.enableUnicode();\n      }\n\n      if (!this.validatesFormat) {\n        this.disableFormatValidation();\n      }\n    }\n\n    enableUnicode() {\n      this.baseElement.setAttribute('pattern', unicodePattern);\n      this.useTextType();\n    }\n\n    disableFormatValidation() {\n      // removed rather than left unset: vaadin-email-field has a default pattern\n      this.baseElement.removeAttribute('pattern');\n      this.useTextType();\n    }\n\n    useTextType() {\n      // native `type=\"email\"` validation is ASCII only and sets typeMismatch\n      // before `pattern` is consulted, so `text` is what lets the pattern decide.\n      // Through vaadin's `_setType` because `type` is a readOnly property bound\n      // to the inner input - assigning `input.type` is re-applied over.\n      this.baseElement._setType('text');\n\n      if (this.externalInput) {\n        this.externalInput.type = 'text';\n      }\n\n      // `type=\"text\"` loses the email keyboard on mobile\n      if (!this.getAttribute('inputmode')) {\n        this.setAttribute('inputmode', defaultInputMode);\n      }\n\n      this.externalInput?.setAttribute('inputmode', defaultInputMode);\n    }\n\n    stripSurroundingWhitespace = (e) => {\n      const trimmed = e.target.value.trim();\n      if (trimmed === e.target.value) return;\n      this.value = trimmed;\n\n      // validity is cached and was computed against the untrimmed value\n      this.inputElement.dispatchEvent(\n        new Event('input', { bubbles: true, composed: true }),\n      );\n    };\n  };\n\nconst {\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: {\n    selector: '[required]::part(required-indicator)::after',\n  },\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: {\n    selector: () => '::slotted(input:disabled::placeholder)',\n  },\n};\n\nexport const EmailFieldClass = compose(\n  createStyleMixin({\n    mappings: {\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      inputValueFontWeight: [\n        { ...input, property: 'font-weight' },\n        { ...externalInput, property: 'font-weight' },\n      ],\n      inputPlaceholderFontWeight: [\n        {\n          selector: () => ':host input:placeholder-shown',\n          property: 'font-weight',\n        },\n        { ...externalPlaceholder, property: 'font-weight' },\n      ],\n      helperTextFontWeight: { ...helperText, property: 'font-weight' },\n      errorMessageFontWeight: { ...errorMessage, 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: {\n        ...errorMessage,\n        property: 'padding-inline-start',\n      },\n      errorMessageIconRepeat: {\n        ...errorMessage,\n        property: 'background-repeat',\n      },\n      errorMessageIconPosition: {\n        ...errorMessage,\n        property: 'background-position',\n      },\n      errorMessageFontSize: { ...errorMessage, property: 'font-size' },\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      inputTextSecurity: [\n        { ...input, property: '-webkit-text-security' },\n        { ...input, property: 'text-security' },\n        { ...externalInput, property: '-webkit-text-security' },\n        { ...externalInput, property: 'text-security' },\n      ],\n    },\n  }),\n  draggableMixin,\n  externalInputMixin({\n    inputType: 'email',\n    inputName: 'email',\n    autocompleteType: 'username',\n    includeAttrs: ['disabled', 'readonly', 'pattern'],\n  }),\n  proxyInputMixin({\n    proxyProps: ['value', 'selectionStart'],\n    useProxyTargets: true,\n  }),\n  componentNameValidationMixin,\n  customMixin,\n)(\n  createProxy({\n    slots: ['', 'suffix'],\n    wrappedEleName: 'vaadin-email-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(${EmailFieldClass.cssVarList.inputOutlineWidth}) + var(${\n          EmailFieldClass.cssVarList.inputOutlineOffset\n        }));\n        box-sizing: border-box;\n\t\t\t}\n      ${resetInputLabelPosition('vaadin-email-field')}\n\t\t\t${useHostExternalPadding(EmailFieldClass.cssVarList)}\n\t\t\t${resetInputOverrides('vaadin-email-field', EmailFieldClass.cssVarList)}\n      ${inputFloatingLabelStyle()}\n\n      vaadin-email-field[label-type=\"floating\"]:not([focused])[readonly] > input:placeholder-shown {\n        opacity: 0;\n      }\n      vaadin-email-field[label-type=\"floating\"]:not([focused])[disabled] > input:placeholder-shown {\n        opacity: 0;\n      }\n\n      :host ::slotted(*) {\n        -webkit-mask-image: none;\n      }\n\n      vaadin-email-field[external-input=\"true\"] > input:not(:placeholder-shown) {\n        opacity: 0;\n      }\n\t\t`,\n    excludeAttrsSync: ['tabindex', 'style'],\n    componentName,\n  }),\n);\n","// Kept in its own module (with no imports) so it can be unit tested without\n// pulling in the whole component / vaadin dependency chain.\n\n// domain: dot-separated labels, each starting and ending with a letter or digit\n// (no empty labels, no leading/trailing hyphen), then the TLD\nexport const asciiPattern =\n  \"^[\\\\w\\\\.\\\\%\\\\+\\\\-']+@(?:[A-Za-z0-9](?:[A-Za-z0-9\\\\-]*[A-Za-z0-9])?\\\\.)+[A-Za-z]{2,}$\";\n\nexport const unicodePattern =\n  \"^[\\\\p{L}\\\\p{M}\\\\p{N}._%+'\\\\-]+@(?:[\\\\p{L}\\\\p{M}\\\\p{N}](?:[\\\\p{L}\\\\p{M}\\\\p{N}\\\\-]*[\\\\p{L}\\\\p{M}\\\\p{N}])?\\\\.)+[\\\\p{L}\\\\p{M}][\\\\p{L}\\\\p{M}\\\\p{N}\\\\-]+$\";\n","/**\n * @license\n * Copyright (c) 2021 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { inputFieldShared } from '@vaadin/vaadin-lumo-styles/mixins/input-field-shared.js';\nimport { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\n\nconst emailField = css`\n  :host([dir='rtl']) [part='input-field'] ::slotted(input) {\n    --_lumo-text-field-overflow-mask-image: linear-gradient(to left, transparent, #000 1.25em);\n  }\n\n  :host([dir='rtl']) [part='input-field'] ::slotted(input:placeholder-shown) {\n    --_lumo-text-field-overflow-mask-image: none;\n  }\n`;\n\nregisterStyles('vaadin-email-field', [inputFieldShared, emailField], {\n  moduleId: 'lumo-email-field',\n});\n","/**\n * @license\n * Copyright (c) 2021 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { css } from 'lit';\n\n// See https://github.com/vaadin/vaadin-text-field/issues/466\nexport const emailFieldStyles = css`\n  :host([dir='rtl']) [part='input-field'] {\n    direction: ltr;\n  }\n\n  :host([dir='rtl']) [part='input-field'] ::slotted(input)::placeholder {\n    direction: rtl;\n    text-align: left;\n  }\n`;\n","/**\n * @license\n * Copyright (c) 2021 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { TextField } from '@vaadin/text-field/src/vaadin-text-field.js';\nimport { registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { emailFieldStyles } from './vaadin-email-field-styles.js';\n\nregisterStyles('vaadin-email-field', emailFieldStyles, { moduleId: 'vaadin-email-field-styles' });\n\n/**\n * `<vaadin-email-field>` is a Web Component for email field control in forms.\n *\n * ```html\n * <vaadin-email-field label=\"Email\"></vaadin-email-field>\n * ```\n *\n * ### Styling\n *\n * `<vaadin-email-field>` provides the same set of shadow DOM parts and state attributes as `<vaadin-text-field>`.\n * See [`<vaadin-text-field>`](#/elements/vaadin-text-field) for the styling documentation.\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @fires {Event} input - Fired when the value is changed by the user: on every typing keystroke, and the value is cleared using the clear button.\n * @fires {Event} change - Fired when the user commits a value change.\n * @fires {CustomEvent} invalid-changed - Fired when the `invalid` property changes.\n * @fires {CustomEvent} value-changed - Fired when the `value` property changes.\n * @fires {CustomEvent} validated - Fired whenever the field is validated.\n *\n * @customElement\n * @extends TextField\n */\nexport class EmailField extends TextField {\n  static get is() {\n    return 'vaadin-email-field';\n  }\n\n  constructor() {\n    super();\n    this._setType('email');\n    this.pattern = '^([a-zA-Z0-9_\\\\.\\\\-+])+@[a-zA-Z0-9\\\\-.]+\\\\.[a-zA-Z0-9\\\\-]{2,}$';\n  }\n\n  /** @protected */\n  ready() {\n    super.ready();\n\n    if (this.inputElement) {\n      this.inputElement.autocapitalize = 'off';\n    }\n  }\n}\n\ndefineCustomElement(EmailField);\n","import '@vaadin/email-field';\nimport { componentName, EmailFieldClass } from './EmailFieldClass';\n\ncustomElements.define(componentName, EmailFieldClass);\n\nexport { EmailFieldClass, componentName };\n","/**\n * @license\n * Copyright (c) 2021 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { SlotController } from '@vaadin/component-base/src/slot-controller.js';\n\n/**\n * A controller to create and initialize slotted `<input>` element.\n */\nexport class InputController extends SlotController {\n  constructor(host, callback) {\n    super(host, 'input', 'input', {\n      initializer: (node, host) => {\n        if (host.value) {\n          node.value = host.value;\n        }\n        if (host.type) {\n          node.setAttribute('type', host.type);\n        }\n\n        // Ensure every instance has unique ID\n        node.id = this.defaultId;\n\n        if (typeof callback === 'function') {\n          callback(node);\n        }\n      },\n      useUniqueId: true,\n    });\n  }\n}\n","/**\n * @license\n * Copyright (c) 2021 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { InputControlMixin } from './input-control-mixin.js';\n\n/**\n * A mixin to provide logic for vaadin-text-field and related components.\n *\n * @polymerMixin\n * @mixes InputControlMixin\n */\nexport const InputFieldMixin = (superclass) =>\n  class InputFieldMixinClass extends InputControlMixin(superclass) {\n    static get properties() {\n      return {\n        /**\n         * Whether the value of the control can be automatically completed by the browser.\n         * List of available options at:\n         * https://developer.mozilla.org/en/docs/Web/HTML/Element/input#attr-autocomplete\n         */\n        autocomplete: {\n          type: String,\n        },\n\n        /**\n         * This is a property supported by Safari that is used to control whether\n         * autocorrection should be enabled when the user is entering/editing the text.\n         * Possible values are:\n         * on: Enable autocorrection.\n         * off: Disable autocorrection.\n         */\n        autocorrect: {\n          type: String,\n        },\n\n        /**\n         * This is a property supported by Safari and Chrome that is used to control whether\n         * autocapitalization should be enabled when the user is entering/editing the text.\n         * Possible values are:\n         * characters: Characters capitalization.\n         * words: Words capitalization.\n         * sentences: Sentences capitalization.\n         * none: No capitalization.\n         */\n        autocapitalize: {\n          type: String,\n          reflectToAttribute: true,\n        },\n      };\n    }\n\n    static get delegateAttrs() {\n      return [...super.delegateAttrs, 'autocapitalize', 'autocomplete', 'autocorrect'];\n    }\n\n    // Workaround for https://github.com/Polymer/polymer/issues/5259\n    get __data() {\n      return this.__dataValue || {};\n    }\n\n    set __data(value) {\n      this.__dataValue = value;\n    }\n\n    /**\n     * @param {HTMLElement} input\n     * @protected\n     * @override\n     */\n    _inputElementChanged(input) {\n      super._inputElementChanged(input);\n\n      if (input) {\n        // Discard value set on the custom slotted input.\n        if (input.value && input.value !== this.value) {\n          console.warn(`Please define value on the <${this.localName}> component!`);\n          input.value = '';\n        }\n\n        if (this.value) {\n          input.value = this.value;\n        }\n      }\n    }\n\n    /**\n     * Override an event listener from `FocusMixin`.\n     * @param {boolean} focused\n     * @protected\n     * @override\n     */\n    _setFocused(focused) {\n      super._setFocused(focused);\n\n      // Do not validate when focusout is caused by document\n      // losing focus, which happens on browser tab switch.\n      if (!focused && document.hasFocus()) {\n        this.validate();\n      }\n    }\n\n    /**\n     * Override an event listener from `InputMixin`\n     * to mark as valid after user started typing.\n     * @param {Event} event\n     * @protected\n     * @override\n     */\n    _onInput(event) {\n      super._onInput(event);\n\n      if (this.invalid) {\n        this.validate();\n      }\n    }\n\n    /**\n     * Override an observer from `InputMixin` to validate the field\n     * when a new value is set programmatically.\n     *\n     * @param {string | undefined} newValue\n     * @param {string | undefined} oldValue\n     * @protected\n     * @override\n     */\n    _valueChanged(newValue, oldValue) {\n      super._valueChanged(newValue, oldValue);\n\n      if (oldValue === undefined) {\n        return;\n      }\n\n      if (this.invalid) {\n        this.validate();\n      }\n    }\n  };\n","/**\n * @license\n * Copyright (c) 2021 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { InputController } from '@vaadin/field-base/src/input-controller.js';\nimport { InputFieldMixin } from '@vaadin/field-base/src/input-field-mixin.js';\nimport { LabelledInputController } from '@vaadin/field-base/src/labelled-input-controller.js';\n\n/**\n * A mixin providing common text field functionality.\n *\n * @polymerMixin\n * @mixes InputFieldMixin\n */\nexport const TextFieldMixin = (superClass) =>\n  class TextFieldMixinClass extends InputFieldMixin(superClass) {\n    static get properties() {\n      return {\n        /**\n         * Maximum number of characters (in Unicode code points) that the user can enter.\n         */\n        maxlength: {\n          type: Number,\n        },\n\n        /**\n         * Minimum number of characters (in Unicode code points) that the user can enter.\n         */\n        minlength: {\n          type: Number,\n        },\n\n        /**\n         * A regular expression that the value is checked against.\n         * The pattern must match the entire value, not just some subset.\n         */\n        pattern: {\n          type: String,\n        },\n      };\n    }\n\n    static get delegateAttrs() {\n      return [...super.delegateAttrs, 'maxlength', 'minlength', 'pattern'];\n    }\n\n    static get constraints() {\n      return [...super.constraints, 'maxlength', 'minlength', 'pattern'];\n    }\n\n    constructor() {\n      super();\n      this._setType('text');\n    }\n\n    /** @protected */\n    get clearElement() {\n      return this.$.clearButton;\n    }\n\n    /** @protected */\n    ready() {\n      super.ready();\n\n      this.addController(\n        new InputController(this, (input) => {\n          this._setInputElement(input);\n          this._setFocusElement(input);\n          this.stateTarget = input;\n          this.ariaTarget = input;\n        }),\n      );\n      this.addController(new LabelledInputController(this.inputElement, this._labelController));\n    }\n  };\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport '@vaadin/input-container/src/vaadin-input-container.js';\nimport { html, PolymerElement } from '@polymer/polymer';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';\nimport { TooltipController } from '@vaadin/component-base/src/tooltip-controller.js';\nimport { inputFieldShared } from '@vaadin/field-base/src/styles/input-field-shared-styles.js';\nimport { registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { TextFieldMixin } from './vaadin-text-field-mixin.js';\n\nregisterStyles('vaadin-text-field', inputFieldShared, { moduleId: 'vaadin-text-field-styles' });\n\n/**\n * `<vaadin-text-field>` is a web component that allows the user to input and edit text.\n *\n * ```html\n * <vaadin-text-field label=\"First Name\"></vaadin-text-field>\n * ```\n *\n * ### Prefixes and suffixes\n *\n * These are child elements of a `<vaadin-text-field>` that are displayed\n * inline with the input, before or after.\n * In order for an element to be considered as a prefix, it must have the slot\n * attribute set to `prefix` (and similarly for `suffix`).\n *\n * ```html\n * <vaadin-text-field label=\"Email address\">\n *   <div slot=\"prefix\">Sent to:</div>\n *   <div slot=\"suffix\">@vaadin.com</div>\n * </vaadin-text-field>\n * ```\n *\n * ### Styling\n *\n * The following custom properties are available for styling:\n *\n * Custom property                | Description                | Default\n * -------------------------------|----------------------------|---------\n * `--vaadin-field-default-width` | Default width of the field | `12em`\n *\n * The following shadow DOM parts are available for styling:\n *\n * Part name            | Description\n * ---------------------|----------------\n * `label`              | The label element\n * `input-field`        | The element that wraps prefix, value and suffix\n * `clear-button`       | The clear button\n * `error-message`      | The error message element\n * `helper-text`        | The helper text element wrapper\n * `required-indicator` | The `required` state indicator element\n *\n * The following state attributes are available for styling:\n *\n * Attribute           | Description | Part name\n * --------------------|-------------|------------\n * `disabled`          | Set to a disabled text field | :host\n * `has-value`         | Set when the element has a value | :host\n * `has-label`         | Set when the element has a label | :host\n * `has-helper`        | Set when the element has helper text or slot | :host\n * `has-error-message` | Set when the element has an error message | :host\n * `invalid`           | Set when the element is invalid | :host\n * `input-prevented`   | Temporarily set when invalid input is prevented | :host\n * `focused`           | Set when the element is focused | :host\n * `focus-ring`        | Set when the element is keyboard focused | :host\n * `readonly`          | Set to a readonly text field | :host\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @fires {Event} input - Fired when the value is changed by the user: on every typing keystroke, and the value is cleared using the clear button.\n * @fires {Event} change - Fired when the user commits a value change.\n * @fires {CustomEvent} invalid-changed - Fired when the `invalid` property changes.\n * @fires {CustomEvent} value-changed - Fired when the `value` property changes.\n * @fires {CustomEvent} validated - Fired whenever the field is validated.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ElementMixin\n * @mixes ThemableMixin\n * @mixes TextFieldMixin\n */\nexport class TextField extends TextFieldMixin(ThemableMixin(ElementMixin(PolymerElement))) {\n  static get is() {\n    return 'vaadin-text-field';\n  }\n\n  static get template() {\n    return html`\n      <style>\n        [part='input-field'] {\n          flex-grow: 0;\n        }\n      </style>\n\n      <div class=\"vaadin-field-container\">\n        <div part=\"label\">\n          <slot name=\"label\"></slot>\n          <span part=\"required-indicator\" aria-hidden=\"true\" on-click=\"focus\"></span>\n        </div>\n\n        <vaadin-input-container\n          part=\"input-field\"\n          readonly=\"[[readonly]]\"\n          disabled=\"[[disabled]]\"\n          invalid=\"[[invalid]]\"\n          theme$=\"[[_theme]]\"\n        >\n          <slot name=\"prefix\" slot=\"prefix\"></slot>\n          <slot name=\"input\"></slot>\n          <slot name=\"suffix\" slot=\"suffix\"></slot>\n          <div id=\"clearButton\" part=\"clear-button\" slot=\"suffix\" aria-hidden=\"true\"></div>\n        </vaadin-input-container>\n\n        <div part=\"helper-text\">\n          <slot name=\"helper\"></slot>\n        </div>\n\n        <div part=\"error-message\">\n          <slot name=\"error-message\"></slot>\n        </div>\n      </div>\n      <slot name=\"tooltip\"></slot>\n    `;\n  }\n\n  static get properties() {\n    return {\n      /**\n       * Maximum number of characters (in Unicode code points) that the user can enter.\n       */\n      maxlength: {\n        type: Number,\n      },\n\n      /**\n       * Minimum number of characters (in Unicode code points) that the user can enter.\n       */\n      minlength: {\n        type: Number,\n      },\n    };\n  }\n\n  /** @protected */\n  ready() {\n    super.ready();\n\n    this._tooltipController = new TooltipController(this);\n    this._tooltipController.setPosition('top');\n    this._tooltipController.setAriaTarget(this.inputElement);\n    this.addController(this._tooltipController);\n  }\n}\n\ndefineCustomElement(TextField);\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport '@vaadin/input-container/theme/lumo/vaadin-input-container-styles.js';\nimport { inputFieldShared } from '@vaadin/vaadin-lumo-styles/mixins/input-field-shared.js';\nimport { registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\n\nregisterStyles('vaadin-text-field', inputFieldShared, {\n  moduleId: 'lumo-text-field-styles',\n});\n"],"names":["componentName","_descope_ui_common_components_helpers__WEBPACK_IMPORTED_MODULE_3__","xE","defaultInputMode","host","label","placeholder","requiredIndicator","inputField","input","inputMask","helperText","errorMessage","disabledPlaceholder","inputDisabled","inputIcon","externalInput","externalInputDisabled","externalPlaceholder","externalDisabledPlaceholder","selector","EmailFieldClass","_descope_ui_common_utils__WEBPACK_IMPORTED_MODULE_1__","Zz","_descope_ui_common_components_mixins__WEBPACK_IMPORTED_MODULE_0__","RF","mappings","fontSize","fontFamily","labelFontSize","property","labelFontWeight","inputValueFontWeight","inputPlaceholderFontWeight","helperTextFontWeight","errorMessageFontWeight","labelTextColor","hostWidth","hostMinWidth","hostDirection","inputDirection","inputBackgroundColor","errorMessageTextColor","errorMessageIcon","errorMessageIconSize","errorMessageIconPadding","errorMessageIconRepeat","errorMessageIconPosition","errorMessageFontSize","helperTextColor","inputValueTextColor","inputCaretTextColor","labelRequiredIndicator","inputBorderColor","inputBorderWidth","inputBorderStyle","inputBorderRadius","inputHeight","inputHorizontalPadding","inputOutlineColor","inputOutlineStyle","inputOutlineWidth","inputOutlineOffset","textAlign","inputTextAlign","inputPlaceholderColor","labelPosition","labelTopPosition","labelHorizontalPosition","inputTransformY","inputTransition","marginInlineStart","placeholderOpacity","inputVerticalAlignment","valueInputHeight","valueInputMarginBottom","inputIconOffset","inputIconSize","inputIconColor","inputTextSecurity","VO","RV","inputType","inputName","autocompleteType","includeAttrs","OZ","proxyProps","useProxyTargets","tQ","superclass","acceptsUnicode","this","getAttribute","validatesFormat","init","super","baseElement","setAttribute","_emailPattern__WEBPACK_IMPORTED_MODULE_2__","a","createExternalInput","inputElement","filter","Boolean","forEach","addEventListener","stripSurroundingWhitespace","enableUnicode","disableFormatValidation","g","useTextType","removeAttribute","_setType","type","e","trimmed","target","value","trim","dispatchEvent","Event","bubbles","composed","tz","slots","wrappedEleName","style","cssVarList","_descope_ui_common_theme_helpers__WEBPACK_IMPORTED_MODULE_4__","$J","cy","LJ","Kl","excludeAttrsSync","asciiPattern","unicodePattern","emailField","vaadin_themable_mixin","AH","SF","input_field_shared","k","moduleId","emailFieldStyles","EmailField","src_vaadin_text_field","A","is","constructor","pattern","ready","autocapitalize","src_define","X","customElements","define","T","v","InputController","_vaadin_component_base_src_slot_controller_js__WEBPACK_IMPORTED_MODULE_0__","r","callback","initializer","node","id","defaultId","useUniqueId","InputFieldMixin","_input_control_mixin_js__WEBPACK_IMPORTED_MODULE_0__","R","properties","autocomplete","String","autocorrect","reflectToAttribute","delegateAttrs","__data","__dataValue","_inputElementChanged","console","warn","localName","_setFocused","focused","document","hasFocus","validate","_onInput","event","invalid","_valueChanged","newValue","oldValue","undefined","TextFieldMixin","superClass","input_field_mixin","maxlength","Number","minlength","constraints","clearElement","$","clearButton","addController","input_controller","f","_setInputElement","_setFocusElement","stateTarget","ariaTarget","labelled_input_controller","q","_labelController","input_field_shared_styles","TextField","cp","element_mixin","polymer_element","Pu","template","qy","_tooltipController","tooltip_controller","I","setPosition","setAriaTarget"],"sourceRoot":""}

package/dist/umd/descope-hybrid-field-index-js.js

@@ -1,5 +1,5 @@
 /*! For license information please see descope-hybrid-field-index-js.js.LICENSE.txt */
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[7299],{63768(e,t,i){i.r(t),i.d(t,{EmailFieldClass:()=>f,componentName:()=>g}),i(52733);var n=i(47642),r=i(87550);const o=r.AH`
+"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[7299],{67383(e,t,i){i.d(t,{T:()=>l,v:()=>V});var r=i(88961),n=i(63200),o=i(92985),a=i(25964),s=i(79673);const l=(0,a.xE)("email-field"),p="email",{host:u,label:d,placeholder:c,requiredIndicator:h,inputField:m,input:y,inputMask:g,helperText:f,errorMessage:b,disabledPlaceholder:x,inputDisabled:v,inputIcon:I,externalInput:F,externalInputDisabled:C,externalPlaceholder:w,externalDisabledPlaceholder:A}={host:{selector:()=>":host"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},placeholder:[{selector:"> input:placeholder-shown"},{selector:()=>":host::slotted(input:placeholder-shown)"}],disabledPlaceholder:{selector:"> input:disabled::placeholder"},inputField:{selector:"::part(input-field)"},input:{selector:"input"},inputMask:{selector:"::part(input-field)::before"},inputDisabled:{selector:"input:disabled"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"},inputIcon:{selector:"vaadin-icon"},externalInput:{selector:()=>"::slotted(input)"},externalInputDisabled:{selector:()=>"::slotted(input:disabled)"},externalPlaceholder:{selector:()=>"::slotted(input:placeholder-shown)"},externalDisabledPlaceholder:{selector:()=>"::slotted(input:disabled::placeholder)"}},V=(0,n.Zz)((0,r.RF)({mappings:{fontSize:[{},u],fontFamily:[d,m,f,b],labelFontSize:{...d,property:"font-size"},labelFontWeight:{...d,property:"font-weight"},inputValueFontWeight:[{...y,property:"font-weight"},{...F,property:"font-weight"}],inputPlaceholderFontWeight:[{selector:()=>":host input:placeholder-shown",property:"font-weight"},{...w,property:"font-weight"}],helperTextFontWeight:{...f,property:"font-weight"},errorMessageFontWeight:{...b,property:"font-weight"},labelTextColor:[{...d,property:"color"},{...h,property:"color"},{...d,property:"-webkit-text-fill-color"},{...h,property:"-webkit-text-fill-color"}],hostWidth:{...u,property:"width"},hostMinWidth:{...u,property:"min-width"},hostDirection:{...u,property:"direction"},inputDirection:{...y,property:"direction"},inputBackgroundColor:[{...m,property:"background-color"},{...g,property:"background-color"}],errorMessageTextColor:{...b,property:"color"},errorMessageIcon:{...b,property:"background-image"},errorMessageIconSize:{...b,property:"background-size"},errorMessageIconPadding:{...b,property:"padding-inline-start"},errorMessageIconRepeat:{...b,property:"background-repeat"},errorMessageIconPosition:{...b,property:"background-position"},errorMessageFontSize:{...b,property:"font-size"},helperTextColor:{...f,property:"-webkit-text-fill-color"},inputValueTextColor:[{...m,property:"color"},{...v,property:"-webkit-text-fill-color"},{...C,property:"-webkit-text-fill-color"}],inputCaretTextColor:[{...y,property:"caret-color"},{...F,property:"caret-color"}],labelRequiredIndicator:{...h,property:"content"},inputBorderColor:{...m,property:"border-color"},inputBorderWidth:{...m,property:"border-width"},inputBorderStyle:{...m,property:"border-style"},inputBorderRadius:{...m,property:"border-radius"},inputHeight:{...m,property:"height"},inputHorizontalPadding:[{...y,property:"padding-left"},{...y,property:"padding-right"},{...F,property:"padding-left"},{...F,property:"padding-right"}],inputOutlineColor:{...m,property:"outline-color"},inputOutlineStyle:{...m,property:"outline-style"},inputOutlineWidth:{...m,property:"outline-width"},inputOutlineOffset:{...m,property:"outline-offset"},textAlign:{},inputTextAlign:[{...y,property:"text-align"},{...F,property:"text-align"}],inputPlaceholderColor:[{selector:()=>":host input:placeholder-shown",property:"color"},{...w,property:"color"},{...c,property:"color"},{...x,property:"-webkit-text-fill-color"},{...A,property:"-webkit-text-fill-color"}],labelPosition:{...d,property:"position"},labelTopPosition:{...d,property:"top"},labelHorizontalPosition:[{...d,property:"left"},{...d,property:"right"}],inputTransformY:{...d,property:"transform"},inputTransition:{...d,property:"transition"},marginInlineStart:{...d,property:"margin-inline-start"},placeholderOpacity:[{selector:"> input:placeholder-shown",property:"opacity"},{...w,property:"opacity"}],inputVerticalAlignment:[{...m,property:"align-items"},{...F,property:"align-items"}],valueInputHeight:[{...y,property:"height"},{...F,property:"height"}],valueInputMarginBottom:[{...y,property:"margin-bottom"},{...F,property:"margin-bottom"}],inputIconOffset:[{...I,property:"margin-right"},{...I,property:"margin-left"}],inputIconSize:{...I,property:"font-size"},inputIconColor:{...I,property:"color"},inputTextSecurity:[{...y,property:"-webkit-text-security"},{...y,property:"text-security"},{...F,property:"-webkit-text-security"},{...F,property:"text-security"}]}}),r.VO,(0,r.RV)({inputType:"email",inputName:"email",autocompleteType:"username",includeAttrs:["disabled","readonly","pattern"]}),(0,r.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),r.tQ,e=>class extends e{get acceptsUnicode(){return"false"!==this.getAttribute("accept-unicode")}get validatesFormat(){return"false"!==this.getAttribute("validate-format")}init(){super.init?.(),this.baseElement.setAttribute("pattern",o.a),this.getAttribute("autocomplete")||this.setAttribute("autocomplete","username"),this.createExternalInput(),[this.inputElement,this.externalInput].filter(Boolean).forEach(e=>{e.addEventListener("change",this.stripSurroundingWhitespace)}),this.acceptsUnicode&&this.enableUnicode(),this.validatesFormat||this.disableFormatValidation()}enableUnicode(){this.baseElement.setAttribute("pattern",o.g),this.useTextType()}disableFormatValidation(){this.baseElement.removeAttribute("pattern"),this.useTextType()}useTextType(){this.baseElement._setType("text"),this.externalInput&&(this.externalInput.type="text"),this.getAttribute("inputmode")||this.setAttribute("inputmode",p),this.externalInput?.setAttribute("inputmode",p)}stripSurroundingWhitespace=e=>{const t=e.target.value.trim();t!==e.target.value&&(this.value=t,this.inputElement.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})))}})((0,r.tz)({slots:["","suffix"],wrappedEleName:"vaadin-email-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(${V.cssVarList.inputOutlineWidth}) + var(${V.cssVarList.inputOutlineOffset}));\n        box-sizing: border-box;\n\t\t\t}\n      ${(0,s.$J)("vaadin-email-field")}\n\t\t\t${(0,s.cy)(V.cssVarList)}\n\t\t\t${(0,s.LJ)("vaadin-email-field",V.cssVarList)}\n      ${(0,s.Kl)()}\n\n      vaadin-email-field[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n        opacity: 0;\n      }\n      vaadin-email-field[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n        opacity: 0;\n      }\n\n      :host ::slotted(*) {\n        -webkit-mask-image: none;\n      }\n\n      vaadin-email-field[external-input="true"] > input:not(:placeholder-shown) {\n        opacity: 0;\n      }\n\t\t`,excludeAttrsSync:["tabindex","style"],componentName:l}))},92985(e,t,i){i.d(t,{a:()=>r,g:()=>n});const r="^[\\w\\.\\%\\+\\-']+@(?:[A-Za-z0-9](?:[A-Za-z0-9\\-]*[A-Za-z0-9])?\\.)+[A-Za-z]{2,}$",n="^[\\p{L}\\p{M}\\p{N}._%+'\\-]+@(?:[\\p{L}\\p{M}\\p{N}](?:[\\p{L}\\p{M}\\p{N}\\-]*[\\p{L}\\p{M}\\p{N}])?\\.)+[\\p{L}\\p{M}][\\p{L}\\p{M}\\p{N}\\-]+$"},30133(e,t,i){i.r(t),i.d(t,{EmailFieldClass:()=>u.v,componentName:()=>u.T}),i(52733);var r=i(47642),n=i(87550);const o=n.AH`
   :host([dir='rtl']) [part='input-field'] ::slotted(input) {
     --_lumo-text-field-overflow-mask-image: linear-gradient(to left, transparent, #000 1.25em);
   }
@@ -7,7 +7,7 @@
   :host([dir='rtl']) [part='input-field'] ::slotted(input:placeholder-shown) {
     --_lumo-text-field-overflow-mask-image: none;
   }
-`;(0,r.SF)("vaadin-email-field",[n.k,o],{moduleId:"lumo-email-field"});var s=i(82901),a=i(27136);const l=i(51450).AH`
+`;(0,n.SF)("vaadin-email-field",[r.k,o],{moduleId:"lumo-email-field"});var a=i(82901),s=i(27136);const l=i(51450).AH`
   :host([dir='rtl']) [part='input-field'] {
     direction: ltr;
   }
@@ -16,5 +16,5 @@
     direction: rtl;
     text-align: left;
   }
-`;(0,r.SF)("vaadin-email-field",l,{moduleId:"vaadin-email-field-styles"});class p extends a.A{static get is(){return"vaadin-email-field"}constructor(){super(),this._setType("email"),this.pattern="^([a-zA-Z0-9_\\.\\-+])+@[a-zA-Z0-9\\-.]+\\.[a-zA-Z0-9\\-]{2,}$"}ready(){super.ready(),this.inputElement&&(this.inputElement.autocapitalize="off")}}(0,s.X)(p);var u=i(47656),d=i(79365),h=i(9696),c=i(97810),m=i(73551);const g=(0,c.xE)("email-field"),y="email",f=(0,h.Zz)((0,d.RF)({mappings:u.A}),d.VO,(0,d.RV)({inputType:"email",inputName:"email",autocompleteType:"username",includeAttrs:["disabled","readonly","pattern"]}),(0,d.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),d.tQ,e=>class extends e{get acceptsUnicode(){return"false"!==this.getAttribute("accept-unicode")}init(){super.init?.(),this.baseElement.setAttribute("pattern","^[\\w\\.\\%\\+\\-']+@[\\w\\.\\-]+\\.[A-Za-z]{2,}$"),this.getAttribute("autocomplete")||this.setAttribute("autocomplete","username"),this.createExternalInput(),[this.inputElement,this.externalInput].filter(Boolean).forEach(e=>{e.addEventListener("change",this.stripSurroundingWhitespace)}),this.acceptsUnicode&&this.enableUnicode()}enableUnicode(){this.baseElement.setAttribute("pattern","^[\\p{L}\\p{M}\\p{N}._%+'\\-]+@[\\p{L}\\p{M}\\p{N}.\\-]+\\.[\\p{L}\\p{M}][\\p{L}\\p{M}\\p{N}\\-]+$"),this.baseElement._setType("text"),this.externalInput&&(this.externalInput.type="text"),this.getAttribute("inputmode")||this.setAttribute("inputmode",y),this.externalInput?.setAttribute("inputmode",y)}stripSurroundingWhitespace=e=>{const t=e.target.value.trim();t!==e.target.value&&(this.value=t,this.inputElement.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})))}})((0,d.tz)({slots:["","suffix"],wrappedEleName:"vaadin-email-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(${f.cssVarList.inputOutlineWidth}) + var(${f.cssVarList.inputOutlineOffset}));\n        box-sizing: border-box;\n\t\t\t}\n      ${(0,m.$J)("vaadin-email-field")}\n\t\t\t${(0,m.cy)(f.cssVarList)}\n\t\t\t${(0,m.LJ)("vaadin-email-field",f.cssVarList)}\n      ${(0,m.Kl)()}\n\n      vaadin-email-field[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n        opacity: 0;\n      }\n      vaadin-email-field[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n        opacity: 0;\n      }\n\n      :host ::slotted(*) {\n        -webkit-mask-image: none;\n      }\n\n      vaadin-email-field[external-input="true"] > input:not(:placeholder-shown) {\n        opacity: 0;\n      }\n\t\t`,excludeAttrsSync:["tabindex","style"],componentName:g}));customElements.define(g,f)},44966(e,t,i){i.r(t),i.d(t,{HybridFieldClass:()=>y,componentName:()=>d}),i(63768),i(98136),i(30057);var n=i(25964),r=i(79365),o=i(81365),s=i(9696),a=i(97810);const l=/[^\d\s+\-()]/;var p=i(81808),u=i(16306);const d=(0,a.xE)("hybrid-field"),h={shared:["label","bordered","full-width","label-type","size","disabled","readonly","required","st-host-direction","st-error-message-icon","st-error-message-icon-size","st-error-message-icon-padding"],email:["placeholder","data-errormessage-value-missing-email","data-errormessage-pattern-mismatch-email","external-input"],phone:{countryCode:["phone-input-label","country-input-label","country-input-placeholder","restrict-countries","default-code","phone-minlength","phone-format-value","phone-strict-validation","phone-input-type","data-errormessage-value-missing-phone"],inputBox:["restrict-countries","default-code","phone-minlength","phone-format-value","phone-strict-validation","phone-input-type","data-errormessage-value-missing-phone"]}},c={email:{"data-errormessage-value-missing-email":"data-errormessage-value-missing","data-errormessage-pattern-mismatch-email":"data-errormessage-pattern-mismatch"},phone:{"phone-input-label":"label","phone-minlength":"minlength","phone-format-value":"format-value","phone-strict-validation":"strict-validation","data-errormessage-value-missing-phone":"data-errormessage-value-missing"}},m="descope-phone-field",g=(0,o.q)({componentName:d,baseSelector:"div"}),y=(0,s.Zz)((0,r.RF)({componentNameOverride:(0,a.xE)("input-wrapper")}),(0,r.RF)({mappings:{hostWidth:{selector:()=>":host",property:"width"},hostDirection:[{selector:()=>"descope-email-field",property:"direction"},{selector:()=>"descope-phone-field",property:"direction"},{selector:()=>"descope-phone-input-box-field",property:"direction"}],errorMessageIcon:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIcon},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIcon}],errorMessageIconSize:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIconSize},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIconSize}],errorMessageIconPadding:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIconPadding},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIconPadding}],errorMessageIconRepeat:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIconRepeat},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIconRepeat}],errorMessageIconPosition:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIconPosition},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIconPosition}],errorMessageFontSize:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageFontSize},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageFontSize}],labelFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.labelFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.labelFontWeight}],inputValueFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.inputValueFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.inputValueFontWeight}],inputPlaceholderFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.inputPlaceholderFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.inputPlaceholderFontWeight}],helperTextFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.helperTextFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.helperTextFontWeight}],errorMessageFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageFontWeight}]}}),r.VO,r.tQ)(class extends g{#e=!1;#t;constructor(){super(),this.attachShadow({mode:"open"}).innerHTML=`\n    <div class="wrapper">\n      <descope-email-field external-input="${this.isExternalInput}"></descope-email-field>\n      <descope-phone-field allow-alphanumeric-input="true" phone-input-type="text"></descope-phone-field>\n      <descope-phone-input-box-field allow-alphanumeric-input="true" phone-input-type="text"></descope-phone-input-box-field>\n    </div>\n\t\t`,(0,n.fz)("\n      :host {\n        display: inline-flex;\n        box-sizing: border-box;\n        padding: 0;\n        gap: 0;\n      }\n      .wrapper {\n        display: grid;\n        width: 100%;\n      }\n      descope-email-field,\n      descope-phone-field,\n      descope-phone-input-box-field {\n        grid-area: 1/1;\n        width: 100%;\n        height: 100%;\n      }\n      .hidden {\n        visibility: hidden;\n      }\n      ",this)}get isExternalInput(){return"true"===this.getAttribute("external-input")}get emailInputEle(){return this.isExternalInput?this.emailInput.externalInput:this.emailInput.inputElement}get phoneVariant(){return"inputBox"===this.getAttribute("phone-variant")?this.phoneInputBoxInput:this.phoneCountryCodeInput}get defaultCode(){const e=this.phoneCountryCodeInput.countryCodes?.[0]||"";return this.getAttribute("default-code")||e}get activeInputEle(){return this.activeInput===this.emailInput?this.emailInputEle:this.phoneVariant.phoneNumberInputEle}get value(){return this.activeInput?.value||""}set value(e){this.handleActiveInput(e),setTimeout(()=>{this.activeInput.value=e})}async init(){super.init?.(),this.initInputs(),this.updateAttrs(),this.toggleInputVisibility(),await this.waitForInputs(),this.initInputEles(),this.overrideEmailInputType(),this.overrideEmailSetAttribute()}waitForInputs(){return new Promise(e=>{const t=setInterval(()=>{this.emailInputEle&&(clearInterval(t),e())})})}initInputs(){this.emailInput=this.shadowRoot.querySelector("descope-email-field"),this.phoneCountryCodeInput=this.shadowRoot.querySelector(m),this.phoneInputBoxInput=this.shadowRoot.querySelector("descope-phone-input-box-field"),this.inputs=[this.emailInput,this.phoneCountryCodeInput,this.phoneInputBoxInput],this.activeInput=this.emailInput}initInputEles(){[this.emailInputEle,this.phoneCountryCodeInput.phoneNumberInputEle,this.phoneInputBoxInput.phoneNumberInputEle].forEach(e=>{e.addEventListener("input",this.onValueChange.bind(this))})}overrideEmailInputType(){this.emailInputEle.addEventListener("focus",()=>{this.emailInputEle.setAttribute("type","text")}),this.emailInputEle.addEventListener("blur",()=>{setTimeout(()=>{this.emailInputEle.setAttribute("type","email")})})}overrideEmailSetAttribute(){const e=this.emailInput.setAttribute.bind(this.emailInputEle);this.emailInputEle.setAttribute=(t,i)=>("type"!==t||"email"!==i||!this.emailInput.hasAttribute("focused"))&&e(t,i)}updateAttrs(){(0,a.EA)(this,this.emailInput,{includeAttrs:h.email,mapAttrs:c.email}),(0,a.EA)(this,this.phoneCountryCodeInput,{includeAttrs:h.phone.countryCode,mapAttrs:c.phone}),(0,a.EA)(this,this.phoneInputBoxInput,{includeAttrs:h.phone.inputBox,mapAttrs:c.phone}),this.inputs.forEach(e=>(0,a.EA)(this,e,{includeAttrs:h.shared})),setTimeout(()=>this.phoneCountryCodeInput.setAttribute("default-code",this.defaultCode))}onValueChange(){this.#t=this.activeInputEle.selectionStart,this.handleActiveInput(this.activeInputEle.value||this.activeInput.value)}handleActiveInput(e){const t=(e=>!!e&&!l.test(e))(e)?this.phoneVariant:this.emailInput;this.activeInput!==t&&this.setActiveInput(t)}setActiveInput(e){const t=this.activeInputEle.value||this.activeInput.value;this.activeInput=e,this.setActiveInputValue(t),this.#e&&this.activeInput.reportValidity(),this.setActiveInputSelectionStart(),this.toggleInputVisibility()}setActiveInputSelectionStart(){setTimeout(()=>{const e=this.activeInputEle;e.focus();try{e.setSelectionRange?.(this.#t,this.#t)}catch{}})}#i(){const e=this.getAttribute("default-code"),t=e&&p.NF.CountryCodes.find(t=>t.code===e);return t?.dialCode||p.NF.CountryCodes[0]?.dialCode||""}setActiveInputValue(e){const t=(e=>e.replace(/\+\d+-/,""))(e);if(this.activeInput.localName===m){const e=this.phoneCountryCodeInput.countryCodeItems||this.#i();this.activeInput.value=`${e}-${t}`}else this.activeInput.value=t}toggleInputVisibility(){this.inputs.forEach(e=>{e!==this.activeInput?e.classList.add("hidden"):e.classList.remove("hidden")})}reportValidity(){this.#e=!0;const e=this.activeInputEle,t=e.type;return e.setAttribute("type","text"),setTimeout(()=>{e.setSelectionRange?.(e.value.length,e.value.length),e.setAttribute("type",t)}),this.activeInput.reportValidity()}checkValidity(){return this.activeInput.checkValidity()}});customElements.define(d,y)},16306(e,t,i){i.d(t,{TQ:()=>h,Ul:()=>C});var n=i(25964),r=i(28027),o=i(9035),s=i(97810),a=i(9696),l=i(79365),p=i(51680),u=i(73551);const d=r.w.cssVarList,h=(0,s.xE)("phone-input-box-field"),{host:c,label:m,inputElement:g,requiredIndicator:y,inputField:f,internalComponent:b,internalComponentAfter:v,phoneInput:x,errorMessage:I,helperText:F}={host:{selector:()=>":host"},label:{selector:"::part(label)"},placeholder:{selector:"> input:placeholder-shown"},inputElement:{selector:"input"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},inputField:{selector:()=>"vaadin-text-field::part(input-field)"},internalComponent:{selector:"descope-phone-field-internal-input-box"},internalComponentAfter:{selector:"descope-phone-field-internal-input-box::after"},phoneInput:{selector:()=>"descope-text-field"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},C=(0,a.Zz)((0,l.RF)({mappings:{fontSize:[c,f,{selector:r.w.componentName,property:r.w.cssVarList.fontSize}],fontFamily:[m,I,F],hostWidth:{...c,property:"width"},hostMinWidth:{...c,property:"min-width"},hostDirection:{...c,property:"direction"},inputHorizontalPadding:[{...x,property:"padding-left"},{...x,property:"padding-right"}],labelFontSize:{...m,property:"font-size"},labelFontWeight:{...m,property:"font-weight"},inputValueFontWeight:{...x,property:d.inputValueFontWeight},inputPlaceholderFontWeight:{...x,property:d.inputPlaceholderFontWeight},helperTextFontWeight:{...F,property:"font-weight"},errorMessageFontWeight:{...I,property:"font-weight"},labelTextColor:[{...m,property:"color"},{...m,property:"-webkit-text-fill-color"},{...y,property:"color"}],labelRequiredIndicator:{...y,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"},errorMessageFontSize:{...I,property:"font-size"},inputValueTextColor:{...x,property:d.inputValueTextColor},inputPlaceholderTextColor:{...x,property:d.inputPlaceholderColor},inputBorderStyle:{...v,property:"border-style"},inputBorderWidth:{...v,property:"border-width"},inputBorderColor:{...v,property:"border-color"},inputBorderRadius:[{...b,property:"border-radius"},{...v,property:"border-radius"}],inputOutlineStyle:{...b,property:"outline-style"},inputOutlineColor:{...b,property:"outline-color"},inputOutlineWidth:{...b,property:"outline-width"},inputOutlineOffset:{...b,property:"outline-offset"},labelPosition:{...m,property:"position"},labelTopPosition:{...m,property:"top"},labelHorizontalPosition:[{...m,property:"left"},{...m,property:"right"}],inputTransformY:{...m,property:"transform"},inputTransition:{...m,property:"transition"},marginInlineStart:{...m,property:"margin-inline-start"},valueInputHeight:{...g,property:"height"},valueInputMarginBottom:{selector:r.w.componentName,property:d.valueInputMarginBottom}}}),l.VO,l.Yg,(0,l.OZ)({proxyProps:["value","selectionStart"]}),e=>class extends e{static get CountryCodes(){return p.A}init(){super.init?.();const e=document.createElement("template");e.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      `,this.baseElement.appendChild(e.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(o.T),(0,n.Gh)(this,this.inputElement,{includeAttrs:["has-value"]}),(0,s.EA)(this.shadowRoot.host,this.inputElement,{includeAttrs:["size","minlength","maxlength","default-code","disabled","phone-input-placeholder","label","label-type","allow-alphanumeric-input","restrict-countries","format-value","strict-validation","data-errormessage-type-mismatch","phone-input-type"]})}get phoneNumberInputEle(){return this.inputElement?.phoneNumberInputEle}})((0,l.tz)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n    :host {\n      display: inline-flex;\n      max-width: 100%;\n      box-sizing: border-box;\n    }\n    ${(0,u.cy)(C.cssVarList)}\n    ${(0,u.I4)("vaadin-text-field")}\n    ${(0,u.kG)("vaadin-text-field")}\n    ${(0,u.X6)()}\n\n    vaadin-text-field {\n      width: 100%;\n      box-sizing: border-box;\n      padding: 0;\n    }\n    vaadin-text-field[focus-ring]::part(input-field) {\n      box-shadow: none;\n    }\n    vaadin-text-field::before {\n      height: 0;\n    }\n    vaadin-text-field::part(input-field) {\n      padding: 0;\n      background: transparent;\n      -webkit-mask-image: none;\n    }\n    descope-phone-field-internal-input-box {\n      -webkit-mask-image: none;\n      padding: 0;\n      width: 100%;\n    }\n    descope-phone-field-internal-input-box > div {\n      width: 100%;\n    }\n    descope-phone-field-internal-input-box descope-text-field {\n      ${d.inputOutlineWidth}: 0;\n      ${d.inputOutlineOffset}: 0;\n    }\n    descope-phone-field-internal-input-box::after {\n      content: '';\n      position: absolute;\n      width: 100%;\n      height: 100%;\n      top: 0;\n      left: 0;\n      box-sizing: border-box;\n      pointer-events: none;\n    }\n    descope-text-field {\n      flex-grow: 1;\n      width: 100%;\n      direction: ltr;\n    }\n    vaadin-text-field[readonly] > input:placeholder-shown {\n      opacity: 1;\n    }\n    vaadin-text-field::part(input-field)::after {\n      border: none;\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\n    ${(0,u.$J)("vaadin-text-field")}\n    ${(0,u.Kl)()}\n\t\t`,excludeAttrsSync:["tabindex","style"],componentName:h}))},9035(e,t,i){i.d(t,{A:()=>c,T:()=>p});var n=i(25964),r=i(10473),o=i(23530),s=i(3393),a=i(97810),l=i(92259);const p=(0,a.xE)("phone-field-internal-input-box"),u=["disabled","size","readonly","phone-input-placeholder","name","maxlength","autocomplete","label-type","phone-input-type"],d={"phone-input-placeholder":"placeholder","phone-input-type":"type"},h=(0,s.y)({componentName:p,baseSelector:"div"}),c=class extends h{static get observedAttributes(){return[].concat(h.observedAttributes||[],u)}#n;constructor(){super(),this.innerHTML='\n      <div>\n        <descope-text-field tabindex="1" type="tel" bordered="false"></descope-text-field>\n      </div>\n      ',this.textField=this.querySelector("descope-text-field")}get phoneNumberInputEle(){return this.textField.shadowRoot.querySelector("input")}get defaultDialCode(){return(0,l.Q)(this.getAttribute("default-code"))}get defaultCode(){return this.getAttribute("default-code")}get allowAlphanumericInput(){return"true"===this.getAttribute("allow-alphanumeric-input")}get minLength(){return parseInt(this.getAttribute("minlength"),10)||0}get maxLength(){return parseInt(this.getAttribute("maxlength"),10)||50}get restrictCountries(){return this.getAttribute("restrict-countries")?.split(",").filter(Boolean)||[]}get isFormatValue(){return"true"===this.getAttribute("format-value")}get isStrictValidation(){return"true"===this.getAttribute("strict-validation")}get value(){if(!this.textField.value)return"";if(!this.isStrictValidation)return this.#r();const e=this.#o();return e?.country&&e?.countryCallingCode&&e?.nationalNumber?`+${[e?.countryCallingCode,e?.nationalNumber].join("-")}`:this.textField.value}set value(e){this.textField.value=e}init(){this.addEventListener("focus",e=>{e.isTrusted&&this.textField.focus()}),super.init?.(),this.textField.addEventListener("input",this.#s.bind(this)),this.handleFocusEventsDispatching([this.textField]),(0,n.EA)(this.textField,this,{includeAttrs:["has-value"]}),(0,n.EA)(this,this.textField,{includeAttrs:["phone-input-type"],mapAttrs:{"phone-input-type":"type"}})}getValidity(){const e=/^\+?\d{1,4}-?(?:\d-?){1,15}$/,t=this.#a(this.textField.value||"");if(this.isRequired&&!this.textField.value)return{valueMissing:!0};if(this.textField.value){if(t.length<this.minLength)return{tooShort:!0};if(this.isStrictValidation&&this.textField.value&&!this.#l()||!this.isStrictValidation&&this.textField.value&&!e.test(this.value))return{patternMismatch:!0}}return{}}setSelectionRange(...e){this.textField.setSelectionRange(...e)}attributeChangedCallback(e,t,i){if(super.attributeChangedCallback(e,t,i),t!==i&&u.includes(e)){const t=d[e]||e;this.textField.setAttribute(t,i)}}#s(e){let t=this.#p(e.target.value);this.isFormatValue&&this.#u(t)&&(t=this.#d(t)),e.target.value=t}#r(){if(!this.defaultDialCode)return this.textField.value;const e=this.#h(this.textField.value),t=this.#a(e);return[this.defaultDialCode,t].join("-")}#o(){return this.defaultDialCode?(0,r.l)([this.defaultDialCode,this.#a(this.textField.value)].filter(Boolean).join("")):(0,r.l)(this.textField.value)}#a(e){return e.replace(/\D/g,"")}#h(e){if("+"===this.textField.value?.[0]){const t=new RegExp(`^\\${this.defaultDialCode}`);return e.replace(t,"")}return e}#l(){const e=(0,r.l)(this.value);return!(!e||!e.isValid?.()||!e.country||!this.#c(e.country)||this.defaultCode&&this.defaultCode!==e.country)}#c(e){return!this.restrictCountries.length||this.restrictCountries.includes(e)}#p(e){if(e=e.replace(/^-+/,"").replace(/(?!^)\+/g,"").replace("--","-").replace("+-","+"),!this.allowAlphanumericInput){const t=/^[+\d-\(\)]+$/;e=e.split("").filter(e=>t.test(e)).join("")}return e}#d(e=""){const t=this.defaultCode||this.#m(e);return t?(this.#n&&this.#n.country===t||(this.#n=new o.Q(t)),this.#n.reset(),this.#n.input(e)||e):e}#m(e){const t=(0,r.l)(e);return t?.country||""}#u(e){return!!(0,l.W)(e)}}},78343(e,t,i){i.r(t),i(64014);var n=i(9035);customElements.define(n.T,n.A)},30057(e,t,i){i.r(t),i.d(t,{PhoneFieldInputBoxClass:()=>n.Ul,componentName:()=>n.TQ}),i(78343),i(64014);var n=i(16306);customElements.define(n.TQ,n.Ul)},92259(e,t,i){i.d(t,{Q:()=>r,W:()=>o});var n=i(51680);const r=e=>n.A.find(t=>t.code===e)?.dialCode,o=e=>{const t=e.match(/\(/g),i=e.match(/\)/g);return t?.length===i?.length}}}]);
+`;(0,n.SF)("vaadin-email-field",l,{moduleId:"vaadin-email-field-styles"});class p extends s.A{static get is(){return"vaadin-email-field"}constructor(){super(),this._setType("email"),this.pattern="^([a-zA-Z0-9_\\.\\-+])+@[a-zA-Z0-9\\-.]+\\.[a-zA-Z0-9\\-]{2,}$"}ready(){super.ready(),this.inputElement&&(this.inputElement.autocapitalize="off")}}(0,a.X)(p);var u=i(67383);customElements.define(u.T,u.v)},44966(e,t,i){i.r(t),i.d(t,{HybridFieldClass:()=>g,componentName:()=>d}),i(30133),i(98136),i(30057);var r=i(25964),n=i(79365),o=i(81365),a=i(9696),s=i(97810);const l=/[^\d\s+\-()]/;var p=i(81808),u=i(16306);const d=(0,s.xE)("hybrid-field"),c={shared:["label","bordered","full-width","label-type","size","disabled","readonly","required","st-host-direction","st-error-message-icon","st-error-message-icon-size","st-error-message-icon-padding"],email:["placeholder","data-errormessage-value-missing-email","data-errormessage-pattern-mismatch-email","external-input"],phone:{countryCode:["phone-input-label","country-input-label","country-input-placeholder","restrict-countries","default-code","phone-minlength","phone-format-value","phone-strict-validation","phone-input-type","data-errormessage-value-missing-phone"],inputBox:["restrict-countries","default-code","phone-minlength","phone-format-value","phone-strict-validation","phone-input-type","data-errormessage-value-missing-phone"]}},h={email:{"data-errormessage-value-missing-email":"data-errormessage-value-missing","data-errormessage-pattern-mismatch-email":"data-errormessage-pattern-mismatch"},phone:{"phone-input-label":"label","phone-minlength":"minlength","phone-format-value":"format-value","phone-strict-validation":"strict-validation","data-errormessage-value-missing-phone":"data-errormessage-value-missing"}},m="descope-phone-field",y=(0,o.q)({componentName:d,baseSelector:"div"}),g=(0,a.Zz)((0,n.RF)({componentNameOverride:(0,s.xE)("input-wrapper")}),(0,n.RF)({mappings:{hostWidth:{selector:()=>":host",property:"width"},hostDirection:[{selector:()=>"descope-email-field",property:"direction"},{selector:()=>"descope-phone-field",property:"direction"},{selector:()=>"descope-phone-input-box-field",property:"direction"}],errorMessageIcon:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIcon},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIcon}],errorMessageIconSize:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIconSize},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIconSize}],errorMessageIconPadding:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIconPadding},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIconPadding}],errorMessageIconRepeat:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIconRepeat},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIconRepeat}],errorMessageIconPosition:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIconPosition},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIconPosition}],errorMessageFontSize:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageFontSize},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageFontSize}],labelFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.labelFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.labelFontWeight}],inputValueFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.inputValueFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.inputValueFontWeight}],inputPlaceholderFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.inputPlaceholderFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.inputPlaceholderFontWeight}],helperTextFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.helperTextFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.helperTextFontWeight}],errorMessageFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageFontWeight}]}}),n.VO,n.tQ)(class extends y{#e=!1;#t;constructor(){super(),this.attachShadow({mode:"open"}).innerHTML=`\n    <div class="wrapper">\n      <descope-email-field external-input="${this.isExternalInput}"></descope-email-field>\n      <descope-phone-field allow-alphanumeric-input="true" phone-input-type="text"></descope-phone-field>\n      <descope-phone-input-box-field allow-alphanumeric-input="true" phone-input-type="text"></descope-phone-input-box-field>\n    </div>\n\t\t`,(0,r.fz)("\n      :host {\n        display: inline-flex;\n        box-sizing: border-box;\n        padding: 0;\n        gap: 0;\n      }\n      .wrapper {\n        display: grid;\n        width: 100%;\n      }\n      descope-email-field,\n      descope-phone-field,\n      descope-phone-input-box-field {\n        grid-area: 1/1;\n        width: 100%;\n        height: 100%;\n      }\n      .hidden {\n        visibility: hidden;\n      }\n      ",this)}get isExternalInput(){return"true"===this.getAttribute("external-input")}get emailInputEle(){return this.isExternalInput?this.emailInput.externalInput:this.emailInput.inputElement}get phoneVariant(){return"inputBox"===this.getAttribute("phone-variant")?this.phoneInputBoxInput:this.phoneCountryCodeInput}get defaultCode(){const e=this.phoneCountryCodeInput.countryCodes?.[0]||"";return this.getAttribute("default-code")||e}get activeInputEle(){return this.activeInput===this.emailInput?this.emailInputEle:this.phoneVariant.phoneNumberInputEle}get value(){return this.activeInput?.value||""}set value(e){this.handleActiveInput(e),setTimeout(()=>{this.activeInput.value=e})}async init(){super.init?.(),this.initInputs(),this.updateAttrs(),this.toggleInputVisibility(),await this.waitForInputs(),this.initInputEles(),this.overrideEmailInputType(),this.overrideEmailSetAttribute()}waitForInputs(){return new Promise(e=>{const t=setInterval(()=>{this.emailInputEle&&(clearInterval(t),e())})})}initInputs(){this.emailInput=this.shadowRoot.querySelector("descope-email-field"),this.phoneCountryCodeInput=this.shadowRoot.querySelector(m),this.phoneInputBoxInput=this.shadowRoot.querySelector("descope-phone-input-box-field"),this.inputs=[this.emailInput,this.phoneCountryCodeInput,this.phoneInputBoxInput],this.activeInput=this.emailInput}initInputEles(){[this.emailInputEle,this.phoneCountryCodeInput.phoneNumberInputEle,this.phoneInputBoxInput.phoneNumberInputEle].forEach(e=>{e.addEventListener("input",this.onValueChange.bind(this))})}overrideEmailInputType(){this.emailInputEle.addEventListener("focus",()=>{this.emailInputEle.setAttribute("type","text")}),this.emailInputEle.addEventListener("blur",()=>{setTimeout(()=>{this.emailInputEle.setAttribute("type","email")})})}overrideEmailSetAttribute(){const e=this.emailInput.setAttribute.bind(this.emailInputEle);this.emailInputEle.setAttribute=(t,i)=>("type"!==t||"email"!==i||!this.emailInput.hasAttribute("focused"))&&e(t,i)}updateAttrs(){(0,s.EA)(this,this.emailInput,{includeAttrs:c.email,mapAttrs:h.email}),(0,s.EA)(this,this.phoneCountryCodeInput,{includeAttrs:c.phone.countryCode,mapAttrs:h.phone}),(0,s.EA)(this,this.phoneInputBoxInput,{includeAttrs:c.phone.inputBox,mapAttrs:h.phone}),this.inputs.forEach(e=>(0,s.EA)(this,e,{includeAttrs:c.shared})),setTimeout(()=>this.phoneCountryCodeInput.setAttribute("default-code",this.defaultCode))}onValueChange(){this.#t=this.activeInputEle.selectionStart,this.handleActiveInput(this.activeInputEle.value||this.activeInput.value)}handleActiveInput(e){const t=(e=>!!e&&!l.test(e))(e)?this.phoneVariant:this.emailInput;this.activeInput!==t&&this.setActiveInput(t)}setActiveInput(e){const t=this.activeInputEle.value||this.activeInput.value;this.activeInput=e,this.setActiveInputValue(t),this.#e&&this.activeInput.reportValidity(),this.setActiveInputSelectionStart(),this.toggleInputVisibility()}setActiveInputSelectionStart(){setTimeout(()=>{const e=this.activeInputEle;e.focus();try{e.setSelectionRange?.(this.#t,this.#t)}catch{}})}#i(){const e=this.getAttribute("default-code"),t=e&&p.NF.CountryCodes.find(t=>t.code===e);return t?.dialCode||p.NF.CountryCodes[0]?.dialCode||""}setActiveInputValue(e){const t=(e=>e.replace(/\+\d+-/,""))(e);if(this.activeInput.localName===m){const e=this.phoneCountryCodeInput.countryCodeItems||this.#i();this.activeInput.value=`${e}-${t}`}else this.activeInput.value=t}toggleInputVisibility(){this.inputs.forEach(e=>{e!==this.activeInput?e.classList.add("hidden"):e.classList.remove("hidden")})}reportValidity(){this.#e=!0;const e=this.activeInputEle,t=e.type;return e.setAttribute("type","text"),setTimeout(()=>{e.setSelectionRange?.(e.value.length,e.value.length),e.setAttribute("type",t)}),this.activeInput.reportValidity()}checkValidity(){return this.activeInput.checkValidity()}});customElements.define(d,g)},16306(e,t,i){i.d(t,{TQ:()=>c,Ul:()=>C});var r=i(25964),n=i(28027),o=i(9035),a=i(97810),s=i(9696),l=i(79365),p=i(51680),u=i(73551);const d=n.w.cssVarList,c=(0,a.xE)("phone-input-box-field"),{host:h,label:m,inputElement:y,requiredIndicator:g,inputField:f,internalComponent:b,internalComponentAfter:x,phoneInput:v,errorMessage:I,helperText:F}={host:{selector:()=>":host"},label:{selector:"::part(label)"},placeholder:{selector:"> input:placeholder-shown"},inputElement:{selector:"input"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},inputField:{selector:()=>"vaadin-text-field::part(input-field)"},internalComponent:{selector:"descope-phone-field-internal-input-box"},internalComponentAfter:{selector:"descope-phone-field-internal-input-box::after"},phoneInput:{selector:()=>"descope-text-field"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},C=(0,s.Zz)((0,l.RF)({mappings:{fontSize:[h,f,{selector:n.w.componentName,property:n.w.cssVarList.fontSize}],fontFamily:[m,I,F],hostWidth:{...h,property:"width"},hostMinWidth:{...h,property:"min-width"},hostDirection:{...h,property:"direction"},inputHorizontalPadding:[{...v,property:"padding-left"},{...v,property:"padding-right"}],labelFontSize:{...m,property:"font-size"},labelFontWeight:{...m,property:"font-weight"},inputValueFontWeight:{...v,property:d.inputValueFontWeight},inputPlaceholderFontWeight:{...v,property:d.inputPlaceholderFontWeight},helperTextFontWeight:{...F,property:"font-weight"},errorMessageFontWeight:{...I,property:"font-weight"},labelTextColor:[{...m,property:"color"},{...m,property:"-webkit-text-fill-color"},{...g,property:"color"}],labelRequiredIndicator:{...g,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"},errorMessageFontSize:{...I,property:"font-size"},inputValueTextColor:{...v,property:d.inputValueTextColor},inputPlaceholderTextColor:{...v,property:d.inputPlaceholderColor},inputBorderStyle:{...x,property:"border-style"},inputBorderWidth:{...x,property:"border-width"},inputBorderColor:{...x,property:"border-color"},inputBorderRadius:[{...b,property:"border-radius"},{...x,property:"border-radius"}],inputOutlineStyle:{...b,property:"outline-style"},inputOutlineColor:{...b,property:"outline-color"},inputOutlineWidth:{...b,property:"outline-width"},inputOutlineOffset:{...b,property:"outline-offset"},labelPosition:{...m,property:"position"},labelTopPosition:{...m,property:"top"},labelHorizontalPosition:[{...m,property:"left"},{...m,property:"right"}],inputTransformY:{...m,property:"transform"},inputTransition:{...m,property:"transition"},marginInlineStart:{...m,property:"margin-inline-start"},valueInputHeight:{...y,property:"height"},valueInputMarginBottom:{selector:n.w.componentName,property:d.valueInputMarginBottom}}}),l.VO,l.Yg,(0,l.OZ)({proxyProps:["value","selectionStart"]}),e=>class extends e{static get CountryCodes(){return p.A}init(){super.init?.();const e=document.createElement("template");e.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      `,this.baseElement.appendChild(e.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(o.T),(0,r.Gh)(this,this.inputElement,{includeAttrs:["has-value"]}),(0,a.EA)(this.shadowRoot.host,this.inputElement,{includeAttrs:["size","minlength","maxlength","default-code","disabled","phone-input-placeholder","label","label-type","allow-alphanumeric-input","restrict-countries","format-value","strict-validation","data-errormessage-type-mismatch","phone-input-type"]})}get phoneNumberInputEle(){return this.inputElement?.phoneNumberInputEle}})((0,l.tz)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n    :host {\n      display: inline-flex;\n      max-width: 100%;\n      box-sizing: border-box;\n    }\n    ${(0,u.cy)(C.cssVarList)}\n    ${(0,u.I4)("vaadin-text-field")}\n    ${(0,u.kG)("vaadin-text-field")}\n    ${(0,u.X6)()}\n\n    vaadin-text-field {\n      width: 100%;\n      box-sizing: border-box;\n      padding: 0;\n    }\n    vaadin-text-field[focus-ring]::part(input-field) {\n      box-shadow: none;\n    }\n    vaadin-text-field::before {\n      height: 0;\n    }\n    vaadin-text-field::part(input-field) {\n      padding: 0;\n      background: transparent;\n      -webkit-mask-image: none;\n    }\n    descope-phone-field-internal-input-box {\n      -webkit-mask-image: none;\n      padding: 0;\n      width: 100%;\n    }\n    descope-phone-field-internal-input-box > div {\n      width: 100%;\n    }\n    descope-phone-field-internal-input-box descope-text-field {\n      ${d.inputOutlineWidth}: 0;\n      ${d.inputOutlineOffset}: 0;\n    }\n    descope-phone-field-internal-input-box::after {\n      content: '';\n      position: absolute;\n      width: 100%;\n      height: 100%;\n      top: 0;\n      left: 0;\n      box-sizing: border-box;\n      pointer-events: none;\n    }\n    descope-text-field {\n      flex-grow: 1;\n      width: 100%;\n      direction: ltr;\n    }\n    vaadin-text-field[readonly] > input:placeholder-shown {\n      opacity: 1;\n    }\n    vaadin-text-field::part(input-field)::after {\n      border: none;\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\n    ${(0,u.$J)("vaadin-text-field")}\n    ${(0,u.Kl)()}\n\t\t`,excludeAttrsSync:["tabindex","style"],componentName:c}))},9035(e,t,i){i.d(t,{A:()=>h,T:()=>p});var r=i(25964),n=i(10473),o=i(23530),a=i(3393),s=i(97810),l=i(92259);const p=(0,s.xE)("phone-field-internal-input-box"),u=["disabled","size","readonly","phone-input-placeholder","name","maxlength","autocomplete","label-type","phone-input-type"],d={"phone-input-placeholder":"placeholder","phone-input-type":"type"},c=(0,a.y)({componentName:p,baseSelector:"div"}),h=class extends c{static get observedAttributes(){return[].concat(c.observedAttributes||[],u)}#r;constructor(){super(),this.innerHTML='\n      <div>\n        <descope-text-field tabindex="1" type="tel" bordered="false"></descope-text-field>\n      </div>\n      ',this.textField=this.querySelector("descope-text-field")}get phoneNumberInputEle(){return this.textField.shadowRoot.querySelector("input")}get defaultDialCode(){return(0,l.Q)(this.getAttribute("default-code"))}get defaultCode(){return this.getAttribute("default-code")}get allowAlphanumericInput(){return"true"===this.getAttribute("allow-alphanumeric-input")}get minLength(){return parseInt(this.getAttribute("minlength"),10)||0}get maxLength(){return parseInt(this.getAttribute("maxlength"),10)||50}get restrictCountries(){return this.getAttribute("restrict-countries")?.split(",").filter(Boolean)||[]}get isFormatValue(){return"true"===this.getAttribute("format-value")}get isStrictValidation(){return"true"===this.getAttribute("strict-validation")}get value(){if(!this.textField.value)return"";if(!this.isStrictValidation)return this.#n();const e=this.#o();return e?.country&&e?.countryCallingCode&&e?.nationalNumber?`+${[e?.countryCallingCode,e?.nationalNumber].join("-")}`:this.textField.value}set value(e){this.textField.value=e}init(){this.addEventListener("focus",e=>{e.isTrusted&&this.textField.focus()}),super.init?.(),this.textField.addEventListener("input",this.#a.bind(this)),this.handleFocusEventsDispatching([this.textField]),(0,r.EA)(this.textField,this,{includeAttrs:["has-value"]}),(0,r.EA)(this,this.textField,{includeAttrs:["phone-input-type"],mapAttrs:{"phone-input-type":"type"}})}getValidity(){const e=/^\+?\d{1,4}-?(?:\d-?){1,15}$/,t=this.#s(this.textField.value||"");if(this.isRequired&&!this.textField.value)return{valueMissing:!0};if(this.textField.value){if(t.length<this.minLength)return{tooShort:!0};if(this.isStrictValidation&&this.textField.value&&!this.#l()||!this.isStrictValidation&&this.textField.value&&!e.test(this.value))return{patternMismatch:!0}}return{}}setSelectionRange(...e){this.textField.setSelectionRange(...e)}attributeChangedCallback(e,t,i){if(super.attributeChangedCallback(e,t,i),t!==i&&u.includes(e)){const t=d[e]||e;this.textField.setAttribute(t,i)}}#a(e){let t=this.#p(e.target.value);this.isFormatValue&&this.#u(t)&&(t=this.#d(t)),e.target.value=t}#n(){if(!this.defaultDialCode)return this.textField.value;const e=this.#c(this.textField.value),t=this.#s(e);return[this.defaultDialCode,t].join("-")}#o(){return this.defaultDialCode?(0,n.l)([this.defaultDialCode,this.#s(this.textField.value)].filter(Boolean).join("")):(0,n.l)(this.textField.value)}#s(e){return e.replace(/\D/g,"")}#c(e){if("+"===this.textField.value?.[0]){const t=new RegExp(`^\\${this.defaultDialCode}`);return e.replace(t,"")}return e}#l(){const e=(0,n.l)(this.value);return!(!e||!e.isValid?.()||!e.country||!this.#h(e.country)||this.defaultCode&&this.defaultCode!==e.country)}#h(e){return!this.restrictCountries.length||this.restrictCountries.includes(e)}#p(e){if(e=e.replace(/^-+/,"").replace(/(?!^)\+/g,"").replace("--","-").replace("+-","+"),!this.allowAlphanumericInput){const t=/^[+\d-\(\)]+$/;e=e.split("").filter(e=>t.test(e)).join("")}return e}#d(e=""){const t=this.defaultCode||this.#m(e);return t?(this.#r&&this.#r.country===t||(this.#r=new o.Q(t)),this.#r.reset(),this.#r.input(e)||e):e}#m(e){const t=(0,n.l)(e);return t?.country||""}#u(e){return!!(0,l.W)(e)}}},78343(e,t,i){i.r(t),i(64014);var r=i(9035);customElements.define(r.T,r.A)},30057(e,t,i){i.r(t),i.d(t,{PhoneFieldInputBoxClass:()=>r.Ul,componentName:()=>r.TQ}),i(78343),i(64014);var r=i(16306);customElements.define(r.TQ,r.Ul)},92259(e,t,i){i.d(t,{Q:()=>n,W:()=>o});var r=i(51680);const n=e=>r.A.find(t=>t.code===e)?.dialCode,o=e=>{const t=e.match(/\(/g),i=e.match(/\)/g);return t?.length===i?.length}}}]);
 //# sourceMappingURL=descope-hybrid-field-index-js.js.map