@descope/web-components-ui 1.0.349 → 1.0.350

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

@@ -1 +1 @@
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[9656],{73878:(e,t,i)=>{i.d(t,{P:()=>l});var n=i(2061),s=i(21e3),a=i(82561);const l=(...e)=>(0,n.qC)(s.wX,s.li,s.QT,s.mE)((0,a.s)(...e))},6867:(e,t,i)=>{i.d(t,{Z:()=>p,f:()=>a});var n=i(73878),s=i(54567);const a=(0,s.iY)("saml-group-mappings-internal"),l=(0,n.P)({componentName:a,baseSelector:""}),p=class extends l{static get observedAttributes(){return["invalid"].concat(l.observedAttributes||[])}constructor(){super(),this.innerHTML='\n      <descope-text-field variant="body2" bordered="true"></descope-text-field>\n      <descope-mappings-field></descope-mappings-field>\n    ',this.groupInputElement=this.querySelector("descope-text-field"),this.mappingsElement=this.querySelector("descope-mappings-field")}resetInvalidIndication(){this.removeAttribute("invalid")}handleMappingsInvalidChange(e){e.includes("invalid")&&(this.mappingsElement.hasAttribute("invalid")||this.resetInvalidIndication())}initFocusHandler(){this.addEventListener("focus",(e=>{e.isTrusted&&(this.mappingsElement.checkValidity()?this.groupInputElement:this.mappingsElement).focus()}))}init(){this.initFocusHandler(),super.init?.(),(0,s.oP)(this,this.groupInputElement,{mapAttrs:{"label-group":"label"},includeAttrs:["size","label-group","readonly","disabled"]}),(0,s.oP)(this,this.mappingsElement,{includeAttrs:["size","full-width","label-value","label-attr","button-label","separator","options","readonly","disabled","data-errormessage-pattern-mismatch"]}),(0,s.FX)(this.mappingsElement,this.handleMappingsInvalidChange.bind(this),{includeAttrs:["invalid"]})}get value(){return{group:this.groupInputElement.value,mappings:this.mappingsElement.value}}set value(e){e?.group&&"string"==typeof e.group&&(this.groupInputElement.value=e.group),Array.isArray(e?.mappings)&&(this.mappingsElement.value=e.mappings)}getValidity(){return this.groupInputElement.checkValidity()?this.mappingsElement.checkValidity()?{}:this.mappingsElement.validity:this.groupInputElement.validity}#e(e){if(e){if(!this.groupInputElement.checkValidity())return void this.groupInputElement.setAttribute("invalid","true");this.mappingsElement.checkValidity()||this.mappingsElement.setAttribute("invalid","true")}}attributeChangedCallback(e,t,i){super.attributeChangedCallback?.(e,t,i),"invalid"===e&&this.#e("true"===i)}}},74115:(e,t,i)=>{i.r(t);var n=i(6867);customElements.define(n.f,n.Z)}}]);
+"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[9656],{73878:(e,t,i)=>{i.d(t,{P:()=>l});var n=i(2061),s=i(94978),a=i(33346);const l=(...e)=>(0,n.qC)(s.wX,s.li,s.QT,s.mE)((0,a.s)(...e))},6867:(e,t,i)=>{i.d(t,{Z:()=>p,f:()=>a});var n=i(73878),s=i(54567);const a=(0,s.iY)("saml-group-mappings-internal"),l=(0,n.P)({componentName:a,baseSelector:""}),p=class extends l{static get observedAttributes(){return["invalid"].concat(l.observedAttributes||[])}constructor(){super(),this.innerHTML='\n      <descope-text-field variant="body2" bordered="true"></descope-text-field>\n      <descope-mappings-field></descope-mappings-field>\n    ',this.groupInputElement=this.querySelector("descope-text-field"),this.mappingsElement=this.querySelector("descope-mappings-field")}resetInvalidIndication(){this.removeAttribute("invalid")}handleMappingsInvalidChange(e){e.includes("invalid")&&(this.mappingsElement.hasAttribute("invalid")||this.resetInvalidIndication())}initFocusHandler(){this.addEventListener("focus",(e=>{e.isTrusted&&(this.mappingsElement.checkValidity()?this.groupInputElement:this.mappingsElement).focus()}))}init(){this.initFocusHandler(),super.init?.(),(0,s.oP)(this,this.groupInputElement,{mapAttrs:{"label-group":"label"},includeAttrs:["size","label-group","readonly","disabled"]}),(0,s.oP)(this,this.mappingsElement,{includeAttrs:["size","full-width","label-value","label-attr","button-label","separator","options","readonly","disabled","data-errormessage-pattern-mismatch"]}),(0,s.FX)(this.mappingsElement,this.handleMappingsInvalidChange.bind(this),{includeAttrs:["invalid"]})}get value(){return{group:this.groupInputElement.value,mappings:this.mappingsElement.value}}set value(e){e?.group&&"string"==typeof e.group&&(this.groupInputElement.value=e.group),Array.isArray(e?.mappings)&&(this.mappingsElement.value=e.mappings)}getValidity(){return this.groupInputElement.checkValidity()?this.mappingsElement.checkValidity()?{}:this.mappingsElement.validity:this.groupInputElement.validity}#e(e){if(e){if(!this.groupInputElement.checkValidity())return void this.groupInputElement.setAttribute("invalid","true");this.mappingsElement.checkValidity()||this.mappingsElement.setAttribute("invalid","true")}}attributeChangedCallback(e,t,i){super.attributeChangedCallback?.(e,t,i),"invalid"===e&&this.#e("true"===i)}}},74115:(e,t,i)=>{i.r(t);var n=i(6867);customElements.define(n.f,n.Z)}}]);

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

@@ -1 +1 @@
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[9476],{6867:(e,t,i)=>{i.d(t,{Z:()=>p,f:()=>a});var n=i(73878),s=i(54567);const a=(0,s.iY)("saml-group-mappings-internal"),l=(0,n.P)({componentName:a,baseSelector:""}),p=class extends l{static get observedAttributes(){return["invalid"].concat(l.observedAttributes||[])}constructor(){super(),this.innerHTML='\n      <descope-text-field variant="body2" bordered="true"></descope-text-field>\n      <descope-mappings-field></descope-mappings-field>\n    ',this.groupInputElement=this.querySelector("descope-text-field"),this.mappingsElement=this.querySelector("descope-mappings-field")}resetInvalidIndication(){this.removeAttribute("invalid")}handleMappingsInvalidChange(e){e.includes("invalid")&&(this.mappingsElement.hasAttribute("invalid")||this.resetInvalidIndication())}initFocusHandler(){this.addEventListener("focus",(e=>{e.isTrusted&&(this.mappingsElement.checkValidity()?this.groupInputElement:this.mappingsElement).focus()}))}init(){this.initFocusHandler(),super.init?.(),(0,s.oP)(this,this.groupInputElement,{mapAttrs:{"label-group":"label"},includeAttrs:["size","label-group","readonly","disabled"]}),(0,s.oP)(this,this.mappingsElement,{includeAttrs:["size","full-width","label-value","label-attr","button-label","separator","options","readonly","disabled","data-errormessage-pattern-mismatch"]}),(0,s.FX)(this.mappingsElement,this.handleMappingsInvalidChange.bind(this),{includeAttrs:["invalid"]})}get value(){return{group:this.groupInputElement.value,mappings:this.mappingsElement.value}}set value(e){e?.group&&"string"==typeof e.group&&(this.groupInputElement.value=e.group),Array.isArray(e?.mappings)&&(this.mappingsElement.value=e.mappings)}getValidity(){return this.groupInputElement.checkValidity()?this.mappingsElement.checkValidity()?{}:this.mappingsElement.validity:this.groupInputElement.validity}#e(e){if(e){if(!this.groupInputElement.checkValidity())return void this.groupInputElement.setAttribute("invalid","true");this.mappingsElement.checkValidity()||this.mappingsElement.setAttribute("invalid","true")}}attributeChangedCallback(e,t,i){super.attributeChangedCallback?.(e,t,i),"invalid"===e&&this.#e("true"===i)}}},74115:(e,t,i)=>{i.r(t);var n=i(6867);customElements.define(n.f,n.Z)},73277:(e,t,i)=>{i.r(t),i.d(t,{SamlGroupMappingsClass:()=>d}),i(99381);var n=i(21e3),s=i(2061),a=i(54567),l=i(6867);const p=(0,a.iY)("saml-group-mappings"),{host:r,groupInput:o}={host:{selector:()=>":host"},groupInput:{selector:"descope-text-field"}},d=(0,s.qC)((0,n.yk)({mappings:{hostWidth:{...r,property:"width"},hostDirection:{...r,property:"direction"},groupNameInputMarginBottom:{...o,property:"margin-bottom"}}}),n.e4,(0,n.dj)({proxyProps:["value","selectionStart"],inputEvent:"input",triggerValidationEvents:["mapping-item-added","mapping-item-removed"],proxyParentValidation:!0}),n.Ae,(e=>class extends e{init(){super.init?.();const e=document.createElement("template");e.innerHTML=`\n      <${l.f}\n        tabindex="-1"\n      ></${l.f}>\n      `,this.baseElement.appendChild(e.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(l.f),(0,a.oP)(this,this.inputElement,{includeAttrs:["size","full-width","label-group","label-value","label-attr","button-label","separator","options","readonly","disabled"]}),(0,a.tg)(this,this.inputElement,{includeAttrs:["invalid"]})}}))((0,n.DM)({slots:[],wrappedEleName:"vaadin-custom-field",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    ",excludeAttrsSync:["tabindex","label-group","label-value","label-attr","button-label","separator","options","error-message"],componentName:p}));i(19357),i(5894),i(74115),customElements.define(p,d)}}]);
+"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[9476],{6867:(e,t,i)=>{i.d(t,{Z:()=>p,f:()=>a});var n=i(73878),s=i(54567);const a=(0,s.iY)("saml-group-mappings-internal"),l=(0,n.P)({componentName:a,baseSelector:""}),p=class extends l{static get observedAttributes(){return["invalid"].concat(l.observedAttributes||[])}constructor(){super(),this.innerHTML='\n      <descope-text-field variant="body2" bordered="true"></descope-text-field>\n      <descope-mappings-field></descope-mappings-field>\n    ',this.groupInputElement=this.querySelector("descope-text-field"),this.mappingsElement=this.querySelector("descope-mappings-field")}resetInvalidIndication(){this.removeAttribute("invalid")}handleMappingsInvalidChange(e){e.includes("invalid")&&(this.mappingsElement.hasAttribute("invalid")||this.resetInvalidIndication())}initFocusHandler(){this.addEventListener("focus",(e=>{e.isTrusted&&(this.mappingsElement.checkValidity()?this.groupInputElement:this.mappingsElement).focus()}))}init(){this.initFocusHandler(),super.init?.(),(0,s.oP)(this,this.groupInputElement,{mapAttrs:{"label-group":"label"},includeAttrs:["size","label-group","readonly","disabled"]}),(0,s.oP)(this,this.mappingsElement,{includeAttrs:["size","full-width","label-value","label-attr","button-label","separator","options","readonly","disabled","data-errormessage-pattern-mismatch"]}),(0,s.FX)(this.mappingsElement,this.handleMappingsInvalidChange.bind(this),{includeAttrs:["invalid"]})}get value(){return{group:this.groupInputElement.value,mappings:this.mappingsElement.value}}set value(e){e?.group&&"string"==typeof e.group&&(this.groupInputElement.value=e.group),Array.isArray(e?.mappings)&&(this.mappingsElement.value=e.mappings)}getValidity(){return this.groupInputElement.checkValidity()?this.mappingsElement.checkValidity()?{}:this.mappingsElement.validity:this.groupInputElement.validity}#e(e){if(e){if(!this.groupInputElement.checkValidity())return void this.groupInputElement.setAttribute("invalid","true");this.mappingsElement.checkValidity()||this.mappingsElement.setAttribute("invalid","true")}}attributeChangedCallback(e,t,i){super.attributeChangedCallback?.(e,t,i),"invalid"===e&&this.#e("true"===i)}}},74115:(e,t,i)=>{i.r(t);var n=i(6867);customElements.define(n.f,n.Z)},73277:(e,t,i)=>{i.r(t),i.d(t,{SamlGroupMappingsClass:()=>d}),i(99381);var n=i(94978),s=i(2061),a=i(54567),l=i(6867);const p=(0,a.iY)("saml-group-mappings"),{host:r,groupInput:o}={host:{selector:()=>":host"},groupInput:{selector:"descope-text-field"}},d=(0,s.qC)((0,n.yk)({mappings:{hostWidth:{...r,property:"width"},hostDirection:{...r,property:"direction"},groupNameInputMarginBottom:{...o,property:"margin-bottom"}}}),n.e4,(0,n.dj)({proxyProps:["value","selectionStart"],inputEvent:"input",triggerValidationEvents:["mapping-item-added","mapping-item-removed"],proxyParentValidation:!0}),n.Ae,(e=>class extends e{init(){super.init?.();const e=document.createElement("template");e.innerHTML=`\n      <${l.f}\n        tabindex="-1"\n      ></${l.f}>\n      `,this.baseElement.appendChild(e.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(l.f),(0,a.oP)(this,this.inputElement,{includeAttrs:["size","full-width","label-group","label-value","label-attr","button-label","separator","options","readonly","disabled"]}),(0,a.tg)(this,this.inputElement,{includeAttrs:["invalid"]})}}))((0,n.DM)({slots:[],wrappedEleName:"vaadin-custom-field",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    ",excludeAttrsSync:["tabindex","label-group","label-value","label-attr","button-label","separator","options","error-message"],componentName:p}));i(19357),i(5894),i(74115),customElements.define(p,d)}}]);

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

@@ -1 +1 @@
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[9288],{84049:(t,e,o)=>{o.d(e,{H:()=>v,f:()=>s});var r=o(2061),n=o(54567),i=o(54201),a=o(21e3);const s=(0,n.iY)("combo-box"),{host:l,inputField:d,inputElement:p,placeholder:u,toggle:c,clearButton:h,label:b,requiredIndicator:m,helperText:y,errorMessage:g}={host:{selector:()=>":host"},inputField:{selector:"::part(input-field)"},inputElement:{selector:"input"},placeholder:{selector:"> input:placeholder-shown"},toggle:{selector:"::part(toggle-button)"},clearButton:{selector:"::part(clear-button)"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},v=(0,r.qC)((0,a.yk)({mappings:{hostWidth:{...l,property:"width"},hostDirection:{...l,property:"direction"},fontSize:[{},l],fontFamily:[b,u,d,y,g],labelFontSize:{...b,property:"font-size"},labelFontWeight:{...b,property:"font-weight"},labelTextColor:[{...b,property:"color"},{...m,property:"color"}],errorMessageTextColor:{...g,property:"color"},inputHeight:{...d,property:"height"},inputBackgroundColor:{...d,property:"background-color"},inputBorderColor:{...d,property:"border-color"},inputBorderWidth:{...d,property:"border-width"},inputBorderStyle:{...d,property:"border-style"},inputBorderRadius:{...d,property:"border-radius"},labelRequiredIndicator:{...m,property:"content"},inputValueTextColor:{...d,property:"color"},inputPlaceholderTextColor:{...u,property:"color"},inputDropdownButtonCursor:[{...c,property:"cursor"},{...h,property:"cursor"}],inputDropdownButtonColor:[{...c,property:"color"},{...h,property:"color"}],inputDropdownButtonSize:[{...c,property:"font-size"},{...h,property:"font-size"}],inputDropdownButtonOffset:[{...c,property:"margin-right"},{...c,property:"margin-left"}],inputOutlineColor:{...d,property:"outline-color"},inputOutlineWidth:{...d,property:"outline-width"},inputOutlineStyle:{...d,property:"outline-style"},inputOutlineOffset:{...d,property:"outline-offset"},inputHorizontalPadding:[{...p,property:"padding-left"},{...p,property:"padding-right"}],labelPosition:{...b,property:"position"},labelTopPosition:{...b,property:"top"},labelHorizontalPosition:[{...b,property:"left"},{...b,property:"right"}],inputTransformY:{...b,property:"transform"},inputTransition:{...b,property:"transition"},marginInlineStart:{...b,property:"margin-inline-start"},placeholderOpacity:{...u,property:"opacity"},inputVerticalAlignment:{...d,property:"align-items"},valueInputHeight:{...p,property:"height"},valueInputMarginBottom:{...p,property:"margin-bottom"},overlayBackground:{property:()=>v.cssVarList.overlay.backgroundColor},overlayTextColor:{property:()=>v.cssVarList.overlay.textColor},overlayBorder:{property:()=>v.cssVarList.overlay.border},overlayFontSize:{property:()=>v.cssVarList.overlay.fontSize},overlayFontFamily:{property:()=>v.cssVarList.overlay.fontFamily},overlayCursor:{property:()=>v.cssVarList.overlay.cursor},overlayItemBoxShadow:{property:()=>v.cssVarList.overlay.itemBoxShadow},overlayItemPaddingInlineStart:{property:()=>v.cssVarList.overlay.itemPaddingInlineStart},overlayItemPaddingInlineEnd:{property:()=>v.cssVarList.overlay.itemPaddingInlineEnd}}}),a.e4,(0,a.Iw)({name:"overlay",selector:"",mappings:{backgroundColor:{selector:"vaadin-combo-box-scroller"},minHeight:{selector:"vaadin-combo-box-overlay"},margin:{selector:"vaadin-combo-box-overlay"},cursor:{selector:"vaadin-combo-box-item"},fontFamily:{selector:"vaadin-combo-box-item"},textColor:{selector:"vaadin-combo-box-item",property:"color"},fontSize:{selector:"vaadin-combo-box-item"},itemBoxShadow:{selector:"vaadin-combo-box-item",property:"box-shadow"},itemPaddingInlineStart:{selector:"vaadin-combo-box-item",property:"padding-inline-start"},itemPaddingInlineEnd:{selector:"vaadin-combo-box-item",property:"padding-inline-end"}},forward:{include:!1,attributes:["size"]}}),(0,a.dj)({proxyProps:["selectionStart"],inputEvent:"selected-item-changed"}),a.Ae,(t=>class extends t{static get observedAttributes(){return["label-type"]}#t=({displayName:t,value:e,label:o})=>`<span data-name="${o}" data-id="${e}">${t||o}</span>`;#e;get defaultValue(){return this.getAttribute("default-value")}get renderItem(){return this.#t}set renderItem(t){this.#t=t,this.renderItems()}get data(){if(this.#e)return this.#e;const t=this.getAttribute("data");if(t)try{const e=JSON.parse(t);if(this.isValidDataType(e))return e}catch(t){console.error('could not parse data string from attribute "data" -',t.message)}return[]}set data(t){this.isValidDataType(t)&&(this.#e=t,this.renderItems())}isValidDataType(t){const e=Array.isArray(t);return e||console.error("data must be an array, received:",t),e}getItemsTemplate(){return this.data?.reduce?.(((t,e)=>t+(this.renderItem?.(e||{})||"")),"")}renderItems(){const t=this.getItemsTemplate();t&&(this.innerHTML=t)}handleSelectedItem(){const t=this.baseElement.selectedItem?.["data-id"];this.baseElement.selectedItem=void 0,t&&(this.value=t),this.value||this.setDefaultValue()}customValueTransformFn(t){return t}setComboBoxDescriptor(){const t=Object.getOwnPropertyDescriptor(this.inputElement.constructor.prototype,"value"),e=this;Object.defineProperties(this.inputElement,{value:{...t,set(o){if(!e.baseElement.items?.length)return;const r=e.customValueTransformFn(o)||"";r!==this.value&&t.set.call(this,r)}}})}#o(){const t=this.shadowRoot.querySelector(this.baseSelector),e=Array.from(this.children);e.length&&(e.forEach((t=>{Object.defineProperty(t,"data-name",{value:t.getAttribute("data-name"),configurable:!0,writable:!0}),Object.defineProperty(t,"data-id",{value:t.getAttribute("data-id"),configurable:!0,writable:!0})})),t.items=e,setTimeout((()=>{this.handleSelectedItem()}),0)),t.renderer=(t,e,o)=>{t.innerHTML=o.item.outerHTML}}#r(){const t=this.baseElement.shadowRoot.querySelector("vaadin-combo-box-overlay");t._attachOverlay=()=>{t.bringToFront()},t._detachOverlay=()=>{},t._enterModalState=()=>{}}init(){super.init?.(),this.getValidity=function(){return!this.value&&this.isRequired?{valueMissing:!0}:{}},this.setComboBoxDescriptor(),this.#r(),this.renderItems(),(0,n.FX)(this,this.renderItems.bind(this),{includeAttrs:["data"]}),(0,n.P$)(this,this.#o.bind(this)),this.setDefaultValue(),this.baseElement.addEventListener("selected-item-changed",(()=>{this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0}))}))}onLabelClick(){this.isReadOnly||this.isDisabled||(this.focus(),this.setAttribute("opened","true"))}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),e!==o&&"label-type"===t&&("floating"===o?this.addEventListener("click",this.onLabelClick):this.removeEventListener("click",this.onLabelClick))}setDefaultValue(){this.value=this.defaultValue}set value(t){if(t){const e=this.baseElement.items?.find((e=>e["data-id"]===t));e&&(this.baseElement.selectedItem=e)}else this.baseElement.selectedItem=void 0}get value(){return this.baseElement.selectedItem?.["data-id"]||""}}))((0,a.DM)({slots:["","prefix"],wrappedEleName:"vaadin-combo-box",style:()=>`\n\t\t:host {\n\t\t\tdisplay: inline-flex;\n\t\t\tbox-sizing: border-box;\n\t\t\t-webkit-mask-image: none;\n\t\t}\n\t\t${(0,i.bi)(v.cssVarList)}\n\t\t${(0,i.PH)("vaadin-combo-box")}\n\t\t${(0,i.jI)("vaadin-combo-box")}\n\t\t${(0,i.Pd)("vaadin-combo-box")}\n\n\t\tvaadin-combo-box {\n\t\t\tpadding: 0;\n\t\t\twidth: 100%;\n\t\t}\n\t\tvaadin-combo-box::before {\n\t\t\theight: initial;\n\t\t}\n\t\tvaadin-combo-box [slot="input"] {\n\t\t\t-webkit-mask-image: none;\n\t\t\tmin-height: 0;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\tvaadin-combo-box::part(input-field) {\n\t\t\tpadding: 0;\n\t\t\tbox-shadow: none;\n\t\t}\n\n    vaadin-combo-box::part(toggle-button),\n    vaadin-combo-box::part(clear-button) {\n      align-self: center;\n    }\n\n    vaadin-combo-box[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n      opacity: 0;\n    }\n    vaadin-combo-box[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n      opacity: 0;\n    }\n  \n    ${(0,i.Wf)("vaadin-combo-box")}\n    ${(0,i.bz)()}\n\t\t`,excludeAttrsSync:["tabindex","size","data"],componentName:s,includeForwardProps:["items","renderer","selectedItem"]}))},21294:(t,e,o)=>{o.r(e),o.d(e,{ComboBoxClass:()=>r.H}),o(47583);var r=o(84049);customElements.define(r.f,r.H)},4963:(t,e,o)=>{o.d(e,{Z:()=>m,f:()=>s});var r=o(73878),n=o(54567),i=o(87262),a=o(22485);const s=(0,n.iY)("phone-field-internal"),l=["disabled","size","bordered","invalid","readonly"],d=["country-input-placeholder","default-code","restrict-countries"],p=["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,d,p,u),b=(0,r.P)({componentName:s,baseSelector:"div"}),m=class extends b{static get observedAttributes(){return[].concat(b.observedAttributes||[],h)}constructor(){super(),this.innerHTML=`\n    <div>\n      <descope-combo-box\n        item-label-path="data-name"\n        item-value-path="data-id"\n      >\n      ${i.Z.map((t=>(0,a.V)(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,n.oP)(this,this.countryCodeInput,{includeAttrs:["label-type"]}),(0,n.oP)(this,this.phoneNumberInput,{includeAttrs:["label-type"]}),this.countryCodeInput.customValueTransformFn=t=>{const[,e]=t?.split?.(" ")||[];return e}}get value(){return this.phoneNumberValue?`${this.countryCodeInput.value}-${this.phoneNumberInput.value}`:""}set value(t){const[e="",o=""]=t.split("-");if(e){const t=this.getCountryByDialCode(e);t&&(this.countryCodeInput.selectedItem=t)}else this.countryCodeInput.selectedItem=void 0;this.phoneNumberInput.value=this.phoneNumberInput.value||o}get phoneNumberValue(){return this.phoneNumberInput.value}get countryCodeValue(){return this.countryCodeInput.shadowRoot.querySelector("input").value}get minLength(){return parseInt(this.getAttribute("minlength"),10)||0}getValidity(){const t=this.countryCodeInput.value,e=this.phoneNumberInput.value,o=!t||!e,r=this.phoneNumberInput.value?.length&&this.phoneNumberInput.value.length<this.minLength;return this.isRequired&&o?{valueMissing:!0}:r?{tooShort:!0}:e&&!t?{valueMissing:!0}:{}}init(){this.addEventListener("focus",(t=>{t.isTrusted&&this.inputs[1].focus()})),super.init?.(),this.initInputs()}getRestrictedCountries(){return this.getAttribute("restrict-countries")?.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?i.Z.filter((e=>t.includes(e.code))):i.Z;this.querySelector("descope-combo-box").innerHTML=e.map((t=>(0,a.V)(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=>{const e=/^\d$/,o=t.target.value.split("").filter((t=>e.test(t))).join("");t.target.value=o})),this.handleFocusEventsDispatching(this.inputs),this.handleInputEventDispatching()}handleLabelTypeAttrs(t,e){const o=c[t]||t;"label-type"===t?this.onLabelTypeChange(e):"floating"===this.getAttribute("label-type")&&("country-input-label"===t?this.countryCodeInput.setAttribute(o,e):"label"===t&&this.phoneNumberInput.setAttribute(o,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,o){if(super.attributeChangedCallback(t,e,o),e!==o){if("default-code"===t&&o)this.handleDefaultCountryCode(o);else if(h.includes(t)){const e=c[t]||t;l.includes(t)?this.inputs.forEach((t=>t.setAttribute(e,o))):d.includes(t)?this.countryCodeInput.setAttribute(e,o):p.includes(t)&&this.phoneNumberInput.setAttribute(e,o)}u.includes(t)&&this.handleLabelTypeAttrs(t,o),"restrict-countries"===t&&this.updateCountryCodeItems(this.getRestrictedCountries())}}}},99240:(t,e,o)=>{o.r(e),o(21294),o(19357);var r=o(4963);customElements.define(r.f,r.Z)},22485:(t,e,o)=>{o.d(e,{V:()=>r});const r=({code:t,dialCode:e,name:o})=>`\n\t<div\n\t\tstyle="display:flex; flex-direction: column;"\n\t\tdata-id="${e}"\n\t\tdata-name="${t} ${e} ${o}"\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>${o}</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`}}]);
+"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[9288],{84049:(t,e,o)=>{o.d(e,{H:()=>v,f:()=>s});var r=o(2061),n=o(54567),i=o(54201),a=o(94978);const s=(0,n.iY)("combo-box"),{host:l,inputField:d,inputElement:p,placeholder:u,toggle:c,clearButton:h,label:b,requiredIndicator:m,helperText:y,errorMessage:g}={host:{selector:()=>":host"},inputField:{selector:"::part(input-field)"},inputElement:{selector:"input"},placeholder:{selector:"> input:placeholder-shown"},toggle:{selector:"::part(toggle-button)"},clearButton:{selector:"::part(clear-button)"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},v=(0,r.qC)((0,a.yk)({mappings:{hostWidth:{...l,property:"width"},hostDirection:{...l,property:"direction"},fontSize:[{},l],fontFamily:[b,u,d,y,g],labelFontSize:{...b,property:"font-size"},labelFontWeight:{...b,property:"font-weight"},labelTextColor:[{...b,property:"color"},{...m,property:"color"}],errorMessageTextColor:{...g,property:"color"},inputHeight:{...d,property:"height"},inputBackgroundColor:{...d,property:"background-color"},inputBorderColor:{...d,property:"border-color"},inputBorderWidth:{...d,property:"border-width"},inputBorderStyle:{...d,property:"border-style"},inputBorderRadius:{...d,property:"border-radius"},labelRequiredIndicator:{...m,property:"content"},inputValueTextColor:{...d,property:"color"},inputPlaceholderTextColor:{...u,property:"color"},inputDropdownButtonCursor:[{...c,property:"cursor"},{...h,property:"cursor"}],inputDropdownButtonColor:[{...c,property:"color"},{...h,property:"color"}],inputDropdownButtonSize:[{...c,property:"font-size"},{...h,property:"font-size"}],inputDropdownButtonOffset:[{...c,property:"margin-right"},{...c,property:"margin-left"}],inputOutlineColor:{...d,property:"outline-color"},inputOutlineWidth:{...d,property:"outline-width"},inputOutlineStyle:{...d,property:"outline-style"},inputOutlineOffset:{...d,property:"outline-offset"},inputHorizontalPadding:[{...p,property:"padding-left"},{...p,property:"padding-right"}],labelPosition:{...b,property:"position"},labelTopPosition:{...b,property:"top"},labelHorizontalPosition:[{...b,property:"left"},{...b,property:"right"}],inputTransformY:{...b,property:"transform"},inputTransition:{...b,property:"transition"},marginInlineStart:{...b,property:"margin-inline-start"},placeholderOpacity:{...u,property:"opacity"},inputVerticalAlignment:{...d,property:"align-items"},valueInputHeight:{...p,property:"height"},valueInputMarginBottom:{...p,property:"margin-bottom"},overlayBackground:{property:()=>v.cssVarList.overlay.backgroundColor},overlayTextColor:{property:()=>v.cssVarList.overlay.textColor},overlayBorder:{property:()=>v.cssVarList.overlay.border},overlayFontSize:{property:()=>v.cssVarList.overlay.fontSize},overlayFontFamily:{property:()=>v.cssVarList.overlay.fontFamily},overlayCursor:{property:()=>v.cssVarList.overlay.cursor},overlayItemBoxShadow:{property:()=>v.cssVarList.overlay.itemBoxShadow},overlayItemPaddingInlineStart:{property:()=>v.cssVarList.overlay.itemPaddingInlineStart},overlayItemPaddingInlineEnd:{property:()=>v.cssVarList.overlay.itemPaddingInlineEnd}}}),a.e4,(0,a.Iw)({name:"overlay",selector:"",mappings:{backgroundColor:{selector:"vaadin-combo-box-scroller"},minHeight:{selector:"vaadin-combo-box-overlay"},margin:{selector:"vaadin-combo-box-overlay"},cursor:{selector:"vaadin-combo-box-item"},fontFamily:{selector:"vaadin-combo-box-item"},textColor:{selector:"vaadin-combo-box-item",property:"color"},fontSize:{selector:"vaadin-combo-box-item"},itemBoxShadow:{selector:"vaadin-combo-box-item",property:"box-shadow"},itemPaddingInlineStart:{selector:"vaadin-combo-box-item",property:"padding-inline-start"},itemPaddingInlineEnd:{selector:"vaadin-combo-box-item",property:"padding-inline-end"}},forward:{include:!1,attributes:["size"]}}),(0,a.dj)({proxyProps:["selectionStart"],inputEvent:"selected-item-changed"}),a.Ae,(t=>class extends t{static get observedAttributes(){return["label-type"]}#t=({displayName:t,value:e,label:o})=>`<span data-name="${o}" data-id="${e}">${t||o}</span>`;#e;get defaultValue(){return this.getAttribute("default-value")}get renderItem(){return this.#t}set renderItem(t){this.#t=t,this.renderItems()}get data(){if(this.#e)return this.#e;const t=this.getAttribute("data");if(t)try{const e=JSON.parse(t);if(this.isValidDataType(e))return e}catch(t){console.error('could not parse data string from attribute "data" -',t.message)}return[]}set data(t){this.isValidDataType(t)&&(this.#e=t,this.renderItems())}isValidDataType(t){const e=Array.isArray(t);return e||console.error("data must be an array, received:",t),e}getItemsTemplate(){return this.data?.reduce?.(((t,e)=>t+(this.renderItem?.(e||{})||"")),"")}renderItems(){const t=this.getItemsTemplate();t&&(this.innerHTML=t)}handleSelectedItem(){const t=this.baseElement.selectedItem?.["data-id"];this.baseElement.selectedItem=void 0,t&&(this.value=t),this.value||this.setDefaultValue()}customValueTransformFn(t){return t}setComboBoxDescriptor(){const t=Object.getOwnPropertyDescriptor(this.inputElement.constructor.prototype,"value"),e=this;Object.defineProperties(this.inputElement,{value:{...t,set(o){if(!e.baseElement.items?.length)return;const r=e.customValueTransformFn(o)||"";r!==this.value&&t.set.call(this,r)}}})}#o(){const t=this.shadowRoot.querySelector(this.baseSelector),e=Array.from(this.children);e.length&&(e.forEach((t=>{Object.defineProperty(t,"data-name",{value:t.getAttribute("data-name"),configurable:!0,writable:!0}),Object.defineProperty(t,"data-id",{value:t.getAttribute("data-id"),configurable:!0,writable:!0})})),t.items=e,setTimeout((()=>{this.handleSelectedItem()}),0)),t.renderer=(t,e,o)=>{t.innerHTML=o.item.outerHTML}}#r(){const t=this.baseElement.shadowRoot.querySelector("vaadin-combo-box-overlay");t._attachOverlay=()=>{t.bringToFront()},t._detachOverlay=()=>{},t._enterModalState=()=>{}}init(){super.init?.(),this.getValidity=function(){return!this.value&&this.isRequired?{valueMissing:!0}:{}},this.setComboBoxDescriptor(),this.#r(),this.renderItems(),(0,n.FX)(this,this.renderItems.bind(this),{includeAttrs:["data"]}),(0,n.P$)(this,this.#o.bind(this)),this.setDefaultValue(),this.baseElement.addEventListener("selected-item-changed",(()=>{this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0}))}))}onLabelClick(){this.isReadOnly||this.isDisabled||(this.focus(),this.setAttribute("opened","true"))}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),e!==o&&"label-type"===t&&("floating"===o?this.addEventListener("click",this.onLabelClick):this.removeEventListener("click",this.onLabelClick))}setDefaultValue(){this.value=this.defaultValue}set value(t){if(t){const e=this.baseElement.items?.find((e=>e["data-id"]===t));e&&(this.baseElement.selectedItem=e)}else this.baseElement.selectedItem=void 0}get value(){return this.baseElement.selectedItem?.["data-id"]||""}}))((0,a.DM)({slots:["","prefix"],wrappedEleName:"vaadin-combo-box",style:()=>`\n\t\t:host {\n\t\t\tdisplay: inline-flex;\n\t\t\tbox-sizing: border-box;\n\t\t\t-webkit-mask-image: none;\n\t\t}\n\t\t${(0,i.bi)(v.cssVarList)}\n\t\t${(0,i.PH)("vaadin-combo-box")}\n\t\t${(0,i.jI)("vaadin-combo-box")}\n\t\t${(0,i.Pd)("vaadin-combo-box")}\n\n\t\tvaadin-combo-box {\n\t\t\tpadding: 0;\n\t\t\twidth: 100%;\n\t\t}\n\t\tvaadin-combo-box::before {\n\t\t\theight: initial;\n\t\t}\n\t\tvaadin-combo-box [slot="input"] {\n\t\t\t-webkit-mask-image: none;\n\t\t\tmin-height: 0;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\tvaadin-combo-box::part(input-field) {\n\t\t\tpadding: 0;\n\t\t\tbox-shadow: none;\n\t\t}\n\n    vaadin-combo-box::part(toggle-button),\n    vaadin-combo-box::part(clear-button) {\n      align-self: center;\n    }\n\n    vaadin-combo-box[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n      opacity: 0;\n    }\n    vaadin-combo-box[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n      opacity: 0;\n    }\n  \n    ${(0,i.Wf)("vaadin-combo-box")}\n    ${(0,i.bz)()}\n\t\t`,excludeAttrsSync:["tabindex","size","data"],componentName:s,includeForwardProps:["items","renderer","selectedItem"]}))},21294:(t,e,o)=>{o.r(e),o.d(e,{ComboBoxClass:()=>r.H}),o(47583);var r=o(84049);customElements.define(r.f,r.H)},4963:(t,e,o)=>{o.d(e,{Z:()=>m,f:()=>s});var r=o(73878),n=o(54567),i=o(87262),a=o(22485);const s=(0,n.iY)("phone-field-internal"),l=["disabled","size","bordered","invalid","readonly"],d=["country-input-placeholder","default-code","restrict-countries"],p=["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,d,p,u),b=(0,r.P)({componentName:s,baseSelector:"div"}),m=class extends b{static get observedAttributes(){return[].concat(b.observedAttributes||[],h)}constructor(){super(),this.innerHTML=`\n    <div>\n      <descope-combo-box\n        item-label-path="data-name"\n        item-value-path="data-id"\n      >\n      ${i.Z.map((t=>(0,a.V)(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,n.oP)(this,this.countryCodeInput,{includeAttrs:["label-type"]}),(0,n.oP)(this,this.phoneNumberInput,{includeAttrs:["label-type"]}),this.countryCodeInput.customValueTransformFn=t=>{const[,e]=t?.split?.(" ")||[];return e}}get value(){return this.phoneNumberValue?`${this.countryCodeInput.value}-${this.phoneNumberInput.value}`:""}set value(t){const[e="",o=""]=t.split("-");if(e){const t=this.getCountryByDialCode(e);t&&(this.countryCodeInput.selectedItem=t)}else this.countryCodeInput.selectedItem=void 0;this.phoneNumberInput.value=this.phoneNumberInput.value||o}get phoneNumberValue(){return this.phoneNumberInput.value}get countryCodeValue(){return this.countryCodeInput.shadowRoot.querySelector("input").value}get minLength(){return parseInt(this.getAttribute("minlength"),10)||0}getValidity(){const t=this.countryCodeInput.value,e=this.phoneNumberInput.value,o=!t||!e,r=this.phoneNumberInput.value?.length&&this.phoneNumberInput.value.length<this.minLength;return this.isRequired&&o?{valueMissing:!0}:r?{tooShort:!0}:e&&!t?{valueMissing:!0}:{}}init(){this.addEventListener("focus",(t=>{t.isTrusted&&this.inputs[1].focus()})),super.init?.(),this.initInputs()}getRestrictedCountries(){return this.getAttribute("restrict-countries")?.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?i.Z.filter((e=>t.includes(e.code))):i.Z;this.querySelector("descope-combo-box").innerHTML=e.map((t=>(0,a.V)(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=>{const e=/^\d$/,o=t.target.value.split("").filter((t=>e.test(t))).join("");t.target.value=o})),this.handleFocusEventsDispatching(this.inputs),this.handleInputEventDispatching()}handleLabelTypeAttrs(t,e){const o=c[t]||t;"label-type"===t?this.onLabelTypeChange(e):"floating"===this.getAttribute("label-type")&&("country-input-label"===t?this.countryCodeInput.setAttribute(o,e):"label"===t&&this.phoneNumberInput.setAttribute(o,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,o){if(super.attributeChangedCallback(t,e,o),e!==o){if("default-code"===t&&o)this.handleDefaultCountryCode(o);else if(h.includes(t)){const e=c[t]||t;l.includes(t)?this.inputs.forEach((t=>t.setAttribute(e,o))):d.includes(t)?this.countryCodeInput.setAttribute(e,o):p.includes(t)&&this.phoneNumberInput.setAttribute(e,o)}u.includes(t)&&this.handleLabelTypeAttrs(t,o),"restrict-countries"===t&&this.updateCountryCodeItems(this.getRestrictedCountries())}}}},99240:(t,e,o)=>{o.r(e),o(21294),o(19357);var r=o(4963);customElements.define(r.f,r.Z)},22485:(t,e,o)=>{o.d(e,{V:()=>r});const r=({code:t,dialCode:e,name:o})=>`\n\t<div\n\t\tstyle="display:flex; flex-direction: column;"\n\t\tdata-id="${e}"\n\t\tdata-name="${t} ${e} ${o}"\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>${o}</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`}}]);

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

@@ -1 +1 @@
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[9806,9288],{84049:(t,e,o)=>{o.d(e,{H:()=>f,f:()=>l});var n=o(2061),r=o(54567),i=o(54201),a=o(21e3);const l=(0,r.iY)("combo-box"),{host:s,inputField:p,inputElement:d,placeholder:u,toggle:c,clearButton:h,label:b,requiredIndicator:y,helperText:m,errorMessage:g}={host:{selector:()=>":host"},inputField:{selector:"::part(input-field)"},inputElement:{selector:"input"},placeholder:{selector:"> input:placeholder-shown"},toggle:{selector:"::part(toggle-button)"},clearButton:{selector:"::part(clear-button)"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},f=(0,n.qC)((0,a.yk)({mappings:{hostWidth:{...s,property:"width"},hostDirection:{...s,property:"direction"},fontSize:[{},s],fontFamily:[b,u,p,m,g],labelFontSize:{...b,property:"font-size"},labelFontWeight:{...b,property:"font-weight"},labelTextColor:[{...b,property:"color"},{...y,property:"color"}],errorMessageTextColor:{...g,property:"color"},inputHeight:{...p,property:"height"},inputBackgroundColor:{...p,property:"background-color"},inputBorderColor:{...p,property:"border-color"},inputBorderWidth:{...p,property:"border-width"},inputBorderStyle:{...p,property:"border-style"},inputBorderRadius:{...p,property:"border-radius"},labelRequiredIndicator:{...y,property:"content"},inputValueTextColor:{...p,property:"color"},inputPlaceholderTextColor:{...u,property:"color"},inputDropdownButtonCursor:[{...c,property:"cursor"},{...h,property:"cursor"}],inputDropdownButtonColor:[{...c,property:"color"},{...h,property:"color"}],inputDropdownButtonSize:[{...c,property:"font-size"},{...h,property:"font-size"}],inputDropdownButtonOffset:[{...c,property:"margin-right"},{...c,property:"margin-left"}],inputOutlineColor:{...p,property:"outline-color"},inputOutlineWidth:{...p,property:"outline-width"},inputOutlineStyle:{...p,property:"outline-style"},inputOutlineOffset:{...p,property:"outline-offset"},inputHorizontalPadding:[{...d,property:"padding-left"},{...d,property:"padding-right"}],labelPosition:{...b,property:"position"},labelTopPosition:{...b,property:"top"},labelHorizontalPosition:[{...b,property:"left"},{...b,property:"right"}],inputTransformY:{...b,property:"transform"},inputTransition:{...b,property:"transition"},marginInlineStart:{...b,property:"margin-inline-start"},placeholderOpacity:{...u,property:"opacity"},inputVerticalAlignment:{...p,property:"align-items"},valueInputHeight:{...d,property:"height"},valueInputMarginBottom:{...d,property:"margin-bottom"},overlayBackground:{property:()=>f.cssVarList.overlay.backgroundColor},overlayTextColor:{property:()=>f.cssVarList.overlay.textColor},overlayBorder:{property:()=>f.cssVarList.overlay.border},overlayFontSize:{property:()=>f.cssVarList.overlay.fontSize},overlayFontFamily:{property:()=>f.cssVarList.overlay.fontFamily},overlayCursor:{property:()=>f.cssVarList.overlay.cursor},overlayItemBoxShadow:{property:()=>f.cssVarList.overlay.itemBoxShadow},overlayItemPaddingInlineStart:{property:()=>f.cssVarList.overlay.itemPaddingInlineStart},overlayItemPaddingInlineEnd:{property:()=>f.cssVarList.overlay.itemPaddingInlineEnd}}}),a.e4,(0,a.Iw)({name:"overlay",selector:"",mappings:{backgroundColor:{selector:"vaadin-combo-box-scroller"},minHeight:{selector:"vaadin-combo-box-overlay"},margin:{selector:"vaadin-combo-box-overlay"},cursor:{selector:"vaadin-combo-box-item"},fontFamily:{selector:"vaadin-combo-box-item"},textColor:{selector:"vaadin-combo-box-item",property:"color"},fontSize:{selector:"vaadin-combo-box-item"},itemBoxShadow:{selector:"vaadin-combo-box-item",property:"box-shadow"},itemPaddingInlineStart:{selector:"vaadin-combo-box-item",property:"padding-inline-start"},itemPaddingInlineEnd:{selector:"vaadin-combo-box-item",property:"padding-inline-end"}},forward:{include:!1,attributes:["size"]}}),(0,a.dj)({proxyProps:["selectionStart"],inputEvent:"selected-item-changed"}),a.Ae,(t=>class extends t{static get observedAttributes(){return["label-type"]}#t=({displayName:t,value:e,label:o})=>`<span data-name="${o}" data-id="${e}">${t||o}</span>`;#e;get defaultValue(){return this.getAttribute("default-value")}get renderItem(){return this.#t}set renderItem(t){this.#t=t,this.renderItems()}get data(){if(this.#e)return this.#e;const t=this.getAttribute("data");if(t)try{const e=JSON.parse(t);if(this.isValidDataType(e))return e}catch(t){console.error('could not parse data string from attribute "data" -',t.message)}return[]}set data(t){this.isValidDataType(t)&&(this.#e=t,this.renderItems())}isValidDataType(t){const e=Array.isArray(t);return e||console.error("data must be an array, received:",t),e}getItemsTemplate(){return this.data?.reduce?.(((t,e)=>t+(this.renderItem?.(e||{})||"")),"")}renderItems(){const t=this.getItemsTemplate();t&&(this.innerHTML=t)}handleSelectedItem(){const t=this.baseElement.selectedItem?.["data-id"];this.baseElement.selectedItem=void 0,t&&(this.value=t),this.value||this.setDefaultValue()}customValueTransformFn(t){return t}setComboBoxDescriptor(){const t=Object.getOwnPropertyDescriptor(this.inputElement.constructor.prototype,"value"),e=this;Object.defineProperties(this.inputElement,{value:{...t,set(o){if(!e.baseElement.items?.length)return;const n=e.customValueTransformFn(o)||"";n!==this.value&&t.set.call(this,n)}}})}#o(){const t=this.shadowRoot.querySelector(this.baseSelector),e=Array.from(this.children);e.length&&(e.forEach((t=>{Object.defineProperty(t,"data-name",{value:t.getAttribute("data-name"),configurable:!0,writable:!0}),Object.defineProperty(t,"data-id",{value:t.getAttribute("data-id"),configurable:!0,writable:!0})})),t.items=e,setTimeout((()=>{this.handleSelectedItem()}),0)),t.renderer=(t,e,o)=>{t.innerHTML=o.item.outerHTML}}#n(){const t=this.baseElement.shadowRoot.querySelector("vaadin-combo-box-overlay");t._attachOverlay=()=>{t.bringToFront()},t._detachOverlay=()=>{},t._enterModalState=()=>{}}init(){super.init?.(),this.getValidity=function(){return!this.value&&this.isRequired?{valueMissing:!0}:{}},this.setComboBoxDescriptor(),this.#n(),this.renderItems(),(0,r.FX)(this,this.renderItems.bind(this),{includeAttrs:["data"]}),(0,r.P$)(this,this.#o.bind(this)),this.setDefaultValue(),this.baseElement.addEventListener("selected-item-changed",(()=>{this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0}))}))}onLabelClick(){this.isReadOnly||this.isDisabled||(this.focus(),this.setAttribute("opened","true"))}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),e!==o&&"label-type"===t&&("floating"===o?this.addEventListener("click",this.onLabelClick):this.removeEventListener("click",this.onLabelClick))}setDefaultValue(){this.value=this.defaultValue}set value(t){if(t){const e=this.baseElement.items?.find((e=>e["data-id"]===t));e&&(this.baseElement.selectedItem=e)}else this.baseElement.selectedItem=void 0}get value(){return this.baseElement.selectedItem?.["data-id"]||""}}))((0,a.DM)({slots:["","prefix"],wrappedEleName:"vaadin-combo-box",style:()=>`\n\t\t:host {\n\t\t\tdisplay: inline-flex;\n\t\t\tbox-sizing: border-box;\n\t\t\t-webkit-mask-image: none;\n\t\t}\n\t\t${(0,i.bi)(f.cssVarList)}\n\t\t${(0,i.PH)("vaadin-combo-box")}\n\t\t${(0,i.jI)("vaadin-combo-box")}\n\t\t${(0,i.Pd)("vaadin-combo-box")}\n\n\t\tvaadin-combo-box {\n\t\t\tpadding: 0;\n\t\t\twidth: 100%;\n\t\t}\n\t\tvaadin-combo-box::before {\n\t\t\theight: initial;\n\t\t}\n\t\tvaadin-combo-box [slot="input"] {\n\t\t\t-webkit-mask-image: none;\n\t\t\tmin-height: 0;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\tvaadin-combo-box::part(input-field) {\n\t\t\tpadding: 0;\n\t\t\tbox-shadow: none;\n\t\t}\n\n    vaadin-combo-box::part(toggle-button),\n    vaadin-combo-box::part(clear-button) {\n      align-self: center;\n    }\n\n    vaadin-combo-box[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n      opacity: 0;\n    }\n    vaadin-combo-box[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n      opacity: 0;\n    }\n  \n    ${(0,i.Wf)("vaadin-combo-box")}\n    ${(0,i.bz)()}\n\t\t`,excludeAttrsSync:["tabindex","size","data"],componentName:l,includeForwardProps:["items","renderer","selectedItem"]}))},21294:(t,e,o)=>{o.r(e),o.d(e,{ComboBoxClass:()=>n.H}),o(47583);var n=o(84049);customElements.define(n.f,n.H)},4963:(t,e,o)=>{o.d(e,{Z:()=>y,f:()=>l});var n=o(73878),r=o(54567),i=o(87262),a=o(22485);const l=(0,r.iY)("phone-field-internal"),s=["disabled","size","bordered","invalid","readonly"],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(s,p,d,u),b=(0,n.P)({componentName:l,baseSelector:"div"}),y=class extends b{static get observedAttributes(){return[].concat(b.observedAttributes||[],h)}constructor(){super(),this.innerHTML=`\n    <div>\n      <descope-combo-box\n        item-label-path="data-name"\n        item-value-path="data-id"\n      >\n      ${i.Z.map((t=>(0,a.V)(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,r.oP)(this,this.countryCodeInput,{includeAttrs:["label-type"]}),(0,r.oP)(this,this.phoneNumberInput,{includeAttrs:["label-type"]}),this.countryCodeInput.customValueTransformFn=t=>{const[,e]=t?.split?.(" ")||[];return e}}get value(){return this.phoneNumberValue?`${this.countryCodeInput.value}-${this.phoneNumberInput.value}`:""}set value(t){const[e="",o=""]=t.split("-");if(e){const t=this.getCountryByDialCode(e);t&&(this.countryCodeInput.selectedItem=t)}else this.countryCodeInput.selectedItem=void 0;this.phoneNumberInput.value=this.phoneNumberInput.value||o}get phoneNumberValue(){return this.phoneNumberInput.value}get countryCodeValue(){return this.countryCodeInput.shadowRoot.querySelector("input").value}get minLength(){return parseInt(this.getAttribute("minlength"),10)||0}getValidity(){const t=this.countryCodeInput.value,e=this.phoneNumberInput.value,o=!t||!e,n=this.phoneNumberInput.value?.length&&this.phoneNumberInput.value.length<this.minLength;return this.isRequired&&o?{valueMissing:!0}:n?{tooShort:!0}:e&&!t?{valueMissing:!0}:{}}init(){this.addEventListener("focus",(t=>{t.isTrusted&&this.inputs[1].focus()})),super.init?.(),this.initInputs()}getRestrictedCountries(){return this.getAttribute("restrict-countries")?.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?i.Z.filter((e=>t.includes(e.code))):i.Z;this.querySelector("descope-combo-box").innerHTML=e.map((t=>(0,a.V)(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=>{const e=/^\d$/,o=t.target.value.split("").filter((t=>e.test(t))).join("");t.target.value=o})),this.handleFocusEventsDispatching(this.inputs),this.handleInputEventDispatching()}handleLabelTypeAttrs(t,e){const o=c[t]||t;"label-type"===t?this.onLabelTypeChange(e):"floating"===this.getAttribute("label-type")&&("country-input-label"===t?this.countryCodeInput.setAttribute(o,e):"label"===t&&this.phoneNumberInput.setAttribute(o,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,o){if(super.attributeChangedCallback(t,e,o),e!==o){if("default-code"===t&&o)this.handleDefaultCountryCode(o);else if(h.includes(t)){const e=c[t]||t;s.includes(t)?this.inputs.forEach((t=>t.setAttribute(e,o))):p.includes(t)?this.countryCodeInput.setAttribute(e,o):d.includes(t)&&this.phoneNumberInput.setAttribute(e,o)}u.includes(t)&&this.handleLabelTypeAttrs(t,o),"restrict-countries"===t&&this.updateCountryCodeItems(this.getRestrictedCountries())}}}},99240:(t,e,o)=>{o.r(e),o(21294),o(19357);var n=o(4963);customElements.define(n.f,n.Z)},22485:(t,e,o)=>{o.d(e,{V:()=>n});const n=({code:t,dialCode:e,name:o})=>`\n\t<div\n\t\tstyle="display:flex; flex-direction: column;"\n\t\tdata-id="${e}"\n\t\tdata-name="${t} ${e} ${o}"\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>${o}</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`},76581:(t,e,o)=>{o.r(e),o.d(e,{PhoneFieldClass:()=>w}),o(99240),o(21294),o(19357);var n=o(4963),r=o(54567),i=o(2061),a=o(21e3),l=o(56417),s=o(84049),p=o(87262),d=o(54201);const u=l.z.cssVarList,c=s.H.cssVarList,h=(0,r.iY)("phone-field"),{host:b,label:y,requiredIndicator:m,inputField:g,countryCodeInput:f,phoneInput:v,separator:x,errorMessage:I,helperText:C}={host:{selector:()=>":host"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},inputField:{selector:"::part(input-field)"},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)"}},w=(0,i.qC)((0,a.yk)({mappings:{fontSize:[b,g,{selector:l.z.componentName,property:l.z.cssVarList.fontSize},{selector:s.H.componentName,property:s.H.cssVarList.fontSize}],fontFamily:[y,I,C,{...f,property:s.H.cssVarList.overlay.fontFamily}],hostWidth:[{...b,property:"width"},{...v,property:"width"},{...f,property:"--vaadin-combo-box-overlay-width"}],hostDirection:{...b,property:"direction"},inputBorderStyle:[{...g,property:"border-style"},{...x,property:"border-left-style"}],inputBorderWidth:[{...g,property:"border-width"},{...x,property:"border-left-width"}],inputBorderColor:[{...g,property:"border-color"},{...x,property:"border-left-color"}],inputBorderRadius:{...g,property:"border-radius"},countryCodeInputWidth:{...f,property:c.hostWidth},countryCodeDropdownWidth:{...f,property:"--vaadin-combo-box-overlay-width"},phoneInputWidth:{...v,property:"width"},horizontalPadding:[{...v,property:"padding-left"},{...v,property:"padding-right"},{...f,property:"padding-left"},{...f,property:"padding-right"}],labelTextColor:[{...y,property:"color"},{...m,property:"color"}],labelRequiredIndicator:{...m,property:"content"},errorMessageTextColor:{...I,property:"color"},inputValueTextColor:[{...v,property:u.inputValueTextColor},{...f,property:c.inputValueTextColor}],inputPlaceholderTextColor:{...v,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:[{...f,property:c.valueInputHeight}],valueInputMarginBottom:[{...v,property:u.valueInputMarginBottom}],marginInlineStart:[{...v,property:u.marginInlineStart},{...f,property:c.marginInlineStart}]}}),a.e4,(0,a.dj)({proxyProps:["value","selectionStart"]}),(t=>class extends t{static get CountryCodes(){return p.Z}init(){super.init?.();const t=document.createElement("template");t.innerHTML=`\n\t\t\t\t<${n.f}\n\t\t\t\t\ttabindex="-1"\n\t\t\t\t\tslot="input"\n\t\t\t\t></${n.f}>\n      \t\t`,this.baseElement.appendChild(t.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(n.f),(0,r.oP)(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"]})}}))((0,a.DM)({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.bi)(w.cssVarList)}\n\t\t\t${(0,d.Pd)("vaadin-text-field")}\n\t\t\t${(0,d.B)("vaadin-text-field")}\n\t\t\t${(0,d.DY)()}\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(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\t\t\t}\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\t\t\t\tmin-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.Wf)("vaadin-text-field")}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:h}));customElements.define(h,w)}}]);
+"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[9806,9288],{84049:(t,e,o)=>{o.d(e,{H:()=>f,f:()=>l});var n=o(2061),r=o(54567),i=o(54201),a=o(94978);const l=(0,r.iY)("combo-box"),{host:s,inputField:p,inputElement:d,placeholder:u,toggle:c,clearButton:h,label:b,requiredIndicator:y,helperText:m,errorMessage:g}={host:{selector:()=>":host"},inputField:{selector:"::part(input-field)"},inputElement:{selector:"input"},placeholder:{selector:"> input:placeholder-shown"},toggle:{selector:"::part(toggle-button)"},clearButton:{selector:"::part(clear-button)"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},f=(0,n.qC)((0,a.yk)({mappings:{hostWidth:{...s,property:"width"},hostDirection:{...s,property:"direction"},fontSize:[{},s],fontFamily:[b,u,p,m,g],labelFontSize:{...b,property:"font-size"},labelFontWeight:{...b,property:"font-weight"},labelTextColor:[{...b,property:"color"},{...y,property:"color"}],errorMessageTextColor:{...g,property:"color"},inputHeight:{...p,property:"height"},inputBackgroundColor:{...p,property:"background-color"},inputBorderColor:{...p,property:"border-color"},inputBorderWidth:{...p,property:"border-width"},inputBorderStyle:{...p,property:"border-style"},inputBorderRadius:{...p,property:"border-radius"},labelRequiredIndicator:{...y,property:"content"},inputValueTextColor:{...p,property:"color"},inputPlaceholderTextColor:{...u,property:"color"},inputDropdownButtonCursor:[{...c,property:"cursor"},{...h,property:"cursor"}],inputDropdownButtonColor:[{...c,property:"color"},{...h,property:"color"}],inputDropdownButtonSize:[{...c,property:"font-size"},{...h,property:"font-size"}],inputDropdownButtonOffset:[{...c,property:"margin-right"},{...c,property:"margin-left"}],inputOutlineColor:{...p,property:"outline-color"},inputOutlineWidth:{...p,property:"outline-width"},inputOutlineStyle:{...p,property:"outline-style"},inputOutlineOffset:{...p,property:"outline-offset"},inputHorizontalPadding:[{...d,property:"padding-left"},{...d,property:"padding-right"}],labelPosition:{...b,property:"position"},labelTopPosition:{...b,property:"top"},labelHorizontalPosition:[{...b,property:"left"},{...b,property:"right"}],inputTransformY:{...b,property:"transform"},inputTransition:{...b,property:"transition"},marginInlineStart:{...b,property:"margin-inline-start"},placeholderOpacity:{...u,property:"opacity"},inputVerticalAlignment:{...p,property:"align-items"},valueInputHeight:{...d,property:"height"},valueInputMarginBottom:{...d,property:"margin-bottom"},overlayBackground:{property:()=>f.cssVarList.overlay.backgroundColor},overlayTextColor:{property:()=>f.cssVarList.overlay.textColor},overlayBorder:{property:()=>f.cssVarList.overlay.border},overlayFontSize:{property:()=>f.cssVarList.overlay.fontSize},overlayFontFamily:{property:()=>f.cssVarList.overlay.fontFamily},overlayCursor:{property:()=>f.cssVarList.overlay.cursor},overlayItemBoxShadow:{property:()=>f.cssVarList.overlay.itemBoxShadow},overlayItemPaddingInlineStart:{property:()=>f.cssVarList.overlay.itemPaddingInlineStart},overlayItemPaddingInlineEnd:{property:()=>f.cssVarList.overlay.itemPaddingInlineEnd}}}),a.e4,(0,a.Iw)({name:"overlay",selector:"",mappings:{backgroundColor:{selector:"vaadin-combo-box-scroller"},minHeight:{selector:"vaadin-combo-box-overlay"},margin:{selector:"vaadin-combo-box-overlay"},cursor:{selector:"vaadin-combo-box-item"},fontFamily:{selector:"vaadin-combo-box-item"},textColor:{selector:"vaadin-combo-box-item",property:"color"},fontSize:{selector:"vaadin-combo-box-item"},itemBoxShadow:{selector:"vaadin-combo-box-item",property:"box-shadow"},itemPaddingInlineStart:{selector:"vaadin-combo-box-item",property:"padding-inline-start"},itemPaddingInlineEnd:{selector:"vaadin-combo-box-item",property:"padding-inline-end"}},forward:{include:!1,attributes:["size"]}}),(0,a.dj)({proxyProps:["selectionStart"],inputEvent:"selected-item-changed"}),a.Ae,(t=>class extends t{static get observedAttributes(){return["label-type"]}#t=({displayName:t,value:e,label:o})=>`<span data-name="${o}" data-id="${e}">${t||o}</span>`;#e;get defaultValue(){return this.getAttribute("default-value")}get renderItem(){return this.#t}set renderItem(t){this.#t=t,this.renderItems()}get data(){if(this.#e)return this.#e;const t=this.getAttribute("data");if(t)try{const e=JSON.parse(t);if(this.isValidDataType(e))return e}catch(t){console.error('could not parse data string from attribute "data" -',t.message)}return[]}set data(t){this.isValidDataType(t)&&(this.#e=t,this.renderItems())}isValidDataType(t){const e=Array.isArray(t);return e||console.error("data must be an array, received:",t),e}getItemsTemplate(){return this.data?.reduce?.(((t,e)=>t+(this.renderItem?.(e||{})||"")),"")}renderItems(){const t=this.getItemsTemplate();t&&(this.innerHTML=t)}handleSelectedItem(){const t=this.baseElement.selectedItem?.["data-id"];this.baseElement.selectedItem=void 0,t&&(this.value=t),this.value||this.setDefaultValue()}customValueTransformFn(t){return t}setComboBoxDescriptor(){const t=Object.getOwnPropertyDescriptor(this.inputElement.constructor.prototype,"value"),e=this;Object.defineProperties(this.inputElement,{value:{...t,set(o){if(!e.baseElement.items?.length)return;const n=e.customValueTransformFn(o)||"";n!==this.value&&t.set.call(this,n)}}})}#o(){const t=this.shadowRoot.querySelector(this.baseSelector),e=Array.from(this.children);e.length&&(e.forEach((t=>{Object.defineProperty(t,"data-name",{value:t.getAttribute("data-name"),configurable:!0,writable:!0}),Object.defineProperty(t,"data-id",{value:t.getAttribute("data-id"),configurable:!0,writable:!0})})),t.items=e,setTimeout((()=>{this.handleSelectedItem()}),0)),t.renderer=(t,e,o)=>{t.innerHTML=o.item.outerHTML}}#n(){const t=this.baseElement.shadowRoot.querySelector("vaadin-combo-box-overlay");t._attachOverlay=()=>{t.bringToFront()},t._detachOverlay=()=>{},t._enterModalState=()=>{}}init(){super.init?.(),this.getValidity=function(){return!this.value&&this.isRequired?{valueMissing:!0}:{}},this.setComboBoxDescriptor(),this.#n(),this.renderItems(),(0,r.FX)(this,this.renderItems.bind(this),{includeAttrs:["data"]}),(0,r.P$)(this,this.#o.bind(this)),this.setDefaultValue(),this.baseElement.addEventListener("selected-item-changed",(()=>{this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0}))}))}onLabelClick(){this.isReadOnly||this.isDisabled||(this.focus(),this.setAttribute("opened","true"))}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),e!==o&&"label-type"===t&&("floating"===o?this.addEventListener("click",this.onLabelClick):this.removeEventListener("click",this.onLabelClick))}setDefaultValue(){this.value=this.defaultValue}set value(t){if(t){const e=this.baseElement.items?.find((e=>e["data-id"]===t));e&&(this.baseElement.selectedItem=e)}else this.baseElement.selectedItem=void 0}get value(){return this.baseElement.selectedItem?.["data-id"]||""}}))((0,a.DM)({slots:["","prefix"],wrappedEleName:"vaadin-combo-box",style:()=>`\n\t\t:host {\n\t\t\tdisplay: inline-flex;\n\t\t\tbox-sizing: border-box;\n\t\t\t-webkit-mask-image: none;\n\t\t}\n\t\t${(0,i.bi)(f.cssVarList)}\n\t\t${(0,i.PH)("vaadin-combo-box")}\n\t\t${(0,i.jI)("vaadin-combo-box")}\n\t\t${(0,i.Pd)("vaadin-combo-box")}\n\n\t\tvaadin-combo-box {\n\t\t\tpadding: 0;\n\t\t\twidth: 100%;\n\t\t}\n\t\tvaadin-combo-box::before {\n\t\t\theight: initial;\n\t\t}\n\t\tvaadin-combo-box [slot="input"] {\n\t\t\t-webkit-mask-image: none;\n\t\t\tmin-height: 0;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\tvaadin-combo-box::part(input-field) {\n\t\t\tpadding: 0;\n\t\t\tbox-shadow: none;\n\t\t}\n\n    vaadin-combo-box::part(toggle-button),\n    vaadin-combo-box::part(clear-button) {\n      align-self: center;\n    }\n\n    vaadin-combo-box[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n      opacity: 0;\n    }\n    vaadin-combo-box[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n      opacity: 0;\n    }\n  \n    ${(0,i.Wf)("vaadin-combo-box")}\n    ${(0,i.bz)()}\n\t\t`,excludeAttrsSync:["tabindex","size","data"],componentName:l,includeForwardProps:["items","renderer","selectedItem"]}))},21294:(t,e,o)=>{o.r(e),o.d(e,{ComboBoxClass:()=>n.H}),o(47583);var n=o(84049);customElements.define(n.f,n.H)},4963:(t,e,o)=>{o.d(e,{Z:()=>y,f:()=>l});var n=o(73878),r=o(54567),i=o(87262),a=o(22485);const l=(0,r.iY)("phone-field-internal"),s=["disabled","size","bordered","invalid","readonly"],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(s,p,d,u),b=(0,n.P)({componentName:l,baseSelector:"div"}),y=class extends b{static get observedAttributes(){return[].concat(b.observedAttributes||[],h)}constructor(){super(),this.innerHTML=`\n    <div>\n      <descope-combo-box\n        item-label-path="data-name"\n        item-value-path="data-id"\n      >\n      ${i.Z.map((t=>(0,a.V)(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,r.oP)(this,this.countryCodeInput,{includeAttrs:["label-type"]}),(0,r.oP)(this,this.phoneNumberInput,{includeAttrs:["label-type"]}),this.countryCodeInput.customValueTransformFn=t=>{const[,e]=t?.split?.(" ")||[];return e}}get value(){return this.phoneNumberValue?`${this.countryCodeInput.value}-${this.phoneNumberInput.value}`:""}set value(t){const[e="",o=""]=t.split("-");if(e){const t=this.getCountryByDialCode(e);t&&(this.countryCodeInput.selectedItem=t)}else this.countryCodeInput.selectedItem=void 0;this.phoneNumberInput.value=this.phoneNumberInput.value||o}get phoneNumberValue(){return this.phoneNumberInput.value}get countryCodeValue(){return this.countryCodeInput.shadowRoot.querySelector("input").value}get minLength(){return parseInt(this.getAttribute("minlength"),10)||0}getValidity(){const t=this.countryCodeInput.value,e=this.phoneNumberInput.value,o=!t||!e,n=this.phoneNumberInput.value?.length&&this.phoneNumberInput.value.length<this.minLength;return this.isRequired&&o?{valueMissing:!0}:n?{tooShort:!0}:e&&!t?{valueMissing:!0}:{}}init(){this.addEventListener("focus",(t=>{t.isTrusted&&this.inputs[1].focus()})),super.init?.(),this.initInputs()}getRestrictedCountries(){return this.getAttribute("restrict-countries")?.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?i.Z.filter((e=>t.includes(e.code))):i.Z;this.querySelector("descope-combo-box").innerHTML=e.map((t=>(0,a.V)(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=>{const e=/^\d$/,o=t.target.value.split("").filter((t=>e.test(t))).join("");t.target.value=o})),this.handleFocusEventsDispatching(this.inputs),this.handleInputEventDispatching()}handleLabelTypeAttrs(t,e){const o=c[t]||t;"label-type"===t?this.onLabelTypeChange(e):"floating"===this.getAttribute("label-type")&&("country-input-label"===t?this.countryCodeInput.setAttribute(o,e):"label"===t&&this.phoneNumberInput.setAttribute(o,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,o){if(super.attributeChangedCallback(t,e,o),e!==o){if("default-code"===t&&o)this.handleDefaultCountryCode(o);else if(h.includes(t)){const e=c[t]||t;s.includes(t)?this.inputs.forEach((t=>t.setAttribute(e,o))):p.includes(t)?this.countryCodeInput.setAttribute(e,o):d.includes(t)&&this.phoneNumberInput.setAttribute(e,o)}u.includes(t)&&this.handleLabelTypeAttrs(t,o),"restrict-countries"===t&&this.updateCountryCodeItems(this.getRestrictedCountries())}}}},99240:(t,e,o)=>{o.r(e),o(21294),o(19357);var n=o(4963);customElements.define(n.f,n.Z)},22485:(t,e,o)=>{o.d(e,{V:()=>n});const n=({code:t,dialCode:e,name:o})=>`\n\t<div\n\t\tstyle="display:flex; flex-direction: column;"\n\t\tdata-id="${e}"\n\t\tdata-name="${t} ${e} ${o}"\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>${o}</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`},76581:(t,e,o)=>{o.r(e),o.d(e,{PhoneFieldClass:()=>w}),o(99240),o(21294),o(19357);var n=o(4963),r=o(54567),i=o(2061),a=o(94978),l=o(56417),s=o(84049),p=o(87262),d=o(54201);const u=l.z.cssVarList,c=s.H.cssVarList,h=(0,r.iY)("phone-field"),{host:b,label:y,requiredIndicator:m,inputField:g,countryCodeInput:f,phoneInput:v,separator:x,errorMessage:I,helperText:C}={host:{selector:()=>":host"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},inputField:{selector:"::part(input-field)"},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)"}},w=(0,i.qC)((0,a.yk)({mappings:{fontSize:[b,g,{selector:l.z.componentName,property:l.z.cssVarList.fontSize},{selector:s.H.componentName,property:s.H.cssVarList.fontSize}],fontFamily:[y,I,C,{...f,property:s.H.cssVarList.overlay.fontFamily}],hostWidth:[{...b,property:"width"},{...v,property:"width"},{...f,property:"--vaadin-combo-box-overlay-width"}],hostDirection:{...b,property:"direction"},inputBorderStyle:[{...g,property:"border-style"},{...x,property:"border-left-style"}],inputBorderWidth:[{...g,property:"border-width"},{...x,property:"border-left-width"}],inputBorderColor:[{...g,property:"border-color"},{...x,property:"border-left-color"}],inputBorderRadius:{...g,property:"border-radius"},countryCodeInputWidth:{...f,property:c.hostWidth},countryCodeDropdownWidth:{...f,property:"--vaadin-combo-box-overlay-width"},phoneInputWidth:{...v,property:"width"},horizontalPadding:[{...v,property:"padding-left"},{...v,property:"padding-right"},{...f,property:"padding-left"},{...f,property:"padding-right"}],labelTextColor:[{...y,property:"color"},{...m,property:"color"}],labelRequiredIndicator:{...m,property:"content"},errorMessageTextColor:{...I,property:"color"},inputValueTextColor:[{...v,property:u.inputValueTextColor},{...f,property:c.inputValueTextColor}],inputPlaceholderTextColor:{...v,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:[{...f,property:c.valueInputHeight}],valueInputMarginBottom:[{...v,property:u.valueInputMarginBottom}],marginInlineStart:[{...v,property:u.marginInlineStart},{...f,property:c.marginInlineStart}]}}),a.e4,(0,a.dj)({proxyProps:["value","selectionStart"]}),(t=>class extends t{static get CountryCodes(){return p.Z}init(){super.init?.();const t=document.createElement("template");t.innerHTML=`\n\t\t\t\t<${n.f}\n\t\t\t\t\ttabindex="-1"\n\t\t\t\t\tslot="input"\n\t\t\t\t></${n.f}>\n      \t\t`,this.baseElement.appendChild(t.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(n.f),(0,r.oP)(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"]})}}))((0,a.DM)({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.bi)(w.cssVarList)}\n\t\t\t${(0,d.Pd)("vaadin-text-field")}\n\t\t\t${(0,d.B)("vaadin-text-field")}\n\t\t\t${(0,d.DY)()}\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(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\t\t\t}\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\t\t\t\tmin-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.Wf)("vaadin-text-field")}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:h}));customElements.define(h,w)}}]);

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

@@ -1 +1 @@
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[5119],{84049:(e,t,r)=>{r.d(t,{H:()=>f,f:()=>l});var o=r(2061),n=r(54567),i=r(54201),a=r(21e3);const l=(0,n.iY)("combo-box"),{host:s,inputField:p,inputElement:d,placeholder:u,toggle:c,clearButton:h,label:b,requiredIndicator:m,helperText:y,errorMessage:g}={host:{selector:()=>":host"},inputField:{selector:"::part(input-field)"},inputElement:{selector:"input"},placeholder:{selector:"> input:placeholder-shown"},toggle:{selector:"::part(toggle-button)"},clearButton:{selector:"::part(clear-button)"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},f=(0,o.qC)((0,a.yk)({mappings:{hostWidth:{...s,property:"width"},hostDirection:{...s,property:"direction"},fontSize:[{},s],fontFamily:[b,u,p,y,g],labelFontSize:{...b,property:"font-size"},labelFontWeight:{...b,property:"font-weight"},labelTextColor:[{...b,property:"color"},{...m,property:"color"}],errorMessageTextColor:{...g,property:"color"},inputHeight:{...p,property:"height"},inputBackgroundColor:{...p,property:"background-color"},inputBorderColor:{...p,property:"border-color"},inputBorderWidth:{...p,property:"border-width"},inputBorderStyle:{...p,property:"border-style"},inputBorderRadius:{...p,property:"border-radius"},labelRequiredIndicator:{...m,property:"content"},inputValueTextColor:{...p,property:"color"},inputPlaceholderTextColor:{...u,property:"color"},inputDropdownButtonCursor:[{...c,property:"cursor"},{...h,property:"cursor"}],inputDropdownButtonColor:[{...c,property:"color"},{...h,property:"color"}],inputDropdownButtonSize:[{...c,property:"font-size"},{...h,property:"font-size"}],inputDropdownButtonOffset:[{...c,property:"margin-right"},{...c,property:"margin-left"}],inputOutlineColor:{...p,property:"outline-color"},inputOutlineWidth:{...p,property:"outline-width"},inputOutlineStyle:{...p,property:"outline-style"},inputOutlineOffset:{...p,property:"outline-offset"},inputHorizontalPadding:[{...d,property:"padding-left"},{...d,property:"padding-right"}],labelPosition:{...b,property:"position"},labelTopPosition:{...b,property:"top"},labelHorizontalPosition:[{...b,property:"left"},{...b,property:"right"}],inputTransformY:{...b,property:"transform"},inputTransition:{...b,property:"transition"},marginInlineStart:{...b,property:"margin-inline-start"},placeholderOpacity:{...u,property:"opacity"},inputVerticalAlignment:{...p,property:"align-items"},valueInputHeight:{...d,property:"height"},valueInputMarginBottom:{...d,property:"margin-bottom"},overlayBackground:{property:()=>f.cssVarList.overlay.backgroundColor},overlayTextColor:{property:()=>f.cssVarList.overlay.textColor},overlayBorder:{property:()=>f.cssVarList.overlay.border},overlayFontSize:{property:()=>f.cssVarList.overlay.fontSize},overlayFontFamily:{property:()=>f.cssVarList.overlay.fontFamily},overlayCursor:{property:()=>f.cssVarList.overlay.cursor},overlayItemBoxShadow:{property:()=>f.cssVarList.overlay.itemBoxShadow},overlayItemPaddingInlineStart:{property:()=>f.cssVarList.overlay.itemPaddingInlineStart},overlayItemPaddingInlineEnd:{property:()=>f.cssVarList.overlay.itemPaddingInlineEnd}}}),a.e4,(0,a.Iw)({name:"overlay",selector:"",mappings:{backgroundColor:{selector:"vaadin-combo-box-scroller"},minHeight:{selector:"vaadin-combo-box-overlay"},margin:{selector:"vaadin-combo-box-overlay"},cursor:{selector:"vaadin-combo-box-item"},fontFamily:{selector:"vaadin-combo-box-item"},textColor:{selector:"vaadin-combo-box-item",property:"color"},fontSize:{selector:"vaadin-combo-box-item"},itemBoxShadow:{selector:"vaadin-combo-box-item",property:"box-shadow"},itemPaddingInlineStart:{selector:"vaadin-combo-box-item",property:"padding-inline-start"},itemPaddingInlineEnd:{selector:"vaadin-combo-box-item",property:"padding-inline-end"}},forward:{include:!1,attributes:["size"]}}),(0,a.dj)({proxyProps:["selectionStart"],inputEvent:"selected-item-changed"}),a.Ae,(e=>class extends e{static get observedAttributes(){return["label-type"]}#e=({displayName:e,value:t,label:r})=>`<span data-name="${r}" data-id="${t}">${e||r}</span>`;#t;get defaultValue(){return this.getAttribute("default-value")}get renderItem(){return this.#e}set renderItem(e){this.#e=e,this.renderItems()}get data(){if(this.#t)return this.#t;const e=this.getAttribute("data");if(e)try{const t=JSON.parse(e);if(this.isValidDataType(t))return t}catch(e){console.error('could not parse data string from attribute "data" -',e.message)}return[]}set data(e){this.isValidDataType(e)&&(this.#t=e,this.renderItems())}isValidDataType(e){const t=Array.isArray(e);return t||console.error("data must be an array, received:",e),t}getItemsTemplate(){return this.data?.reduce?.(((e,t)=>e+(this.renderItem?.(t||{})||"")),"")}renderItems(){const e=this.getItemsTemplate();e&&(this.innerHTML=e)}handleSelectedItem(){const e=this.baseElement.selectedItem?.["data-id"];this.baseElement.selectedItem=void 0,e&&(this.value=e),this.value||this.setDefaultValue()}customValueTransformFn(e){return e}setComboBoxDescriptor(){const e=Object.getOwnPropertyDescriptor(this.inputElement.constructor.prototype,"value"),t=this;Object.defineProperties(this.inputElement,{value:{...e,set(r){if(!t.baseElement.items?.length)return;const o=t.customValueTransformFn(r)||"";o!==this.value&&e.set.call(this,o)}}})}#r(){const e=this.shadowRoot.querySelector(this.baseSelector),t=Array.from(this.children);t.length&&(t.forEach((e=>{Object.defineProperty(e,"data-name",{value:e.getAttribute("data-name"),configurable:!0,writable:!0}),Object.defineProperty(e,"data-id",{value:e.getAttribute("data-id"),configurable:!0,writable:!0})})),e.items=t,setTimeout((()=>{this.handleSelectedItem()}),0)),e.renderer=(e,t,r)=>{e.innerHTML=r.item.outerHTML}}#o(){const e=this.baseElement.shadowRoot.querySelector("vaadin-combo-box-overlay");e._attachOverlay=()=>{e.bringToFront()},e._detachOverlay=()=>{},e._enterModalState=()=>{}}init(){super.init?.(),this.getValidity=function(){return!this.value&&this.isRequired?{valueMissing:!0}:{}},this.setComboBoxDescriptor(),this.#o(),this.renderItems(),(0,n.FX)(this,this.renderItems.bind(this),{includeAttrs:["data"]}),(0,n.P$)(this,this.#r.bind(this)),this.setDefaultValue(),this.baseElement.addEventListener("selected-item-changed",(()=>{this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0}))}))}onLabelClick(){this.isReadOnly||this.isDisabled||(this.focus(),this.setAttribute("opened","true"))}attributeChangedCallback(e,t,r){super.attributeChangedCallback?.(e,t,r),t!==r&&"label-type"===e&&("floating"===r?this.addEventListener("click",this.onLabelClick):this.removeEventListener("click",this.onLabelClick))}setDefaultValue(){this.value=this.defaultValue}set value(e){if(e){const t=this.baseElement.items?.find((t=>t["data-id"]===e));t&&(this.baseElement.selectedItem=t)}else this.baseElement.selectedItem=void 0}get value(){return this.baseElement.selectedItem?.["data-id"]||""}}))((0,a.DM)({slots:["","prefix"],wrappedEleName:"vaadin-combo-box",style:()=>`\n\t\t:host {\n\t\t\tdisplay: inline-flex;\n\t\t\tbox-sizing: border-box;\n\t\t\t-webkit-mask-image: none;\n\t\t}\n\t\t${(0,i.bi)(f.cssVarList)}\n\t\t${(0,i.PH)("vaadin-combo-box")}\n\t\t${(0,i.jI)("vaadin-combo-box")}\n\t\t${(0,i.Pd)("vaadin-combo-box")}\n\n\t\tvaadin-combo-box {\n\t\t\tpadding: 0;\n\t\t\twidth: 100%;\n\t\t}\n\t\tvaadin-combo-box::before {\n\t\t\theight: initial;\n\t\t}\n\t\tvaadin-combo-box [slot="input"] {\n\t\t\t-webkit-mask-image: none;\n\t\t\tmin-height: 0;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\tvaadin-combo-box::part(input-field) {\n\t\t\tpadding: 0;\n\t\t\tbox-shadow: none;\n\t\t}\n\n    vaadin-combo-box::part(toggle-button),\n    vaadin-combo-box::part(clear-button) {\n      align-self: center;\n    }\n\n    vaadin-combo-box[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n      opacity: 0;\n    }\n    vaadin-combo-box[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n      opacity: 0;\n    }\n  \n    ${(0,i.Wf)("vaadin-combo-box")}\n    ${(0,i.bz)()}\n\t\t`,excludeAttrsSync:["tabindex","size","data"],componentName:l,includeForwardProps:["items","renderer","selectedItem"]}))},21294:(e,t,r)=>{r.r(t),r.d(t,{ComboBoxClass:()=>o.H}),r(47583);var o=r(84049);customElements.define(o.f,o.H)},41377:(e,t,r)=>{r.d(t,{Z:()=>d,f:()=>a});var o=r(73878),n=r(54567),i=r(16418);const a=(0,n.iY)("phone-field-internal-input-box"),l=["disabled","size","bordered","invalid","readonly","phone-input-placeholder","name","autocomplete","label-type"],s={"phone-input-placeholder":"placeholder"},p=(0,o.P)({componentName:a,baseSelector:"div"}),d=class extends p{static get observedAttributes(){return[].concat(p.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,i.g)(this.getAttribute("default-code"))}get hasDefaultCode(){return!!this.getAttribute("default-code")}get value(){if(!this.phoneNumberValue)return"";if(this.hasDefaultCode){const e=new RegExp(`\\+?${parseInt(this.defaultCountryCode,10)}--?`);return`${this.defaultCountryCode}-${this.phoneNumberInput.value.replace(e,"")}`}return this.phoneNumberInput.value}set value(e){this.phoneNumberInput.value=e}get phoneNumberValue(){return this.phoneNumberInput.value}get minLength(){return parseInt(this.getAttribute("minlength"),10)||0}get maxLength(){return parseInt(this.getAttribute("maxlength"),10)||50}getValidity(){const e=this.value.replace(/\D/g,"");return this.isRequired&&!this.value?{valueMissing:!0}:e.length<this.minLength?{tooShort:!0}:e.length>this.maxLength?{tooLong:!0}:/^\+?\d{1,4}-?(?:\d-?){1,15}$/.test(this.value)?{}:{patternMismatch:!0}}init(){this.addEventListener("focus",(e=>{e.isTrusted&&this.phoneNumberInput.focus()})),super.init?.(),this.initInputs()}getCountryByDialCode(e){return this.countryCodeInput.items?.find((t=>t.getAttribute("data-country-code")===e))}initInputs(){this.phoneNumberInput.addEventListener("input",(e=>{1===e.target.value.length&&"-"===e.target.value&&(e.target.value=""),e.target.value=e.target.value.replace(/(?!^)\+/g,"").replace("--","-").replace("+-","+");const t=/^[+\d-]+$/,r=e.target.value.split("").filter((e=>t.test(e))).join("");e.target.value=r})),this.handleFocusEventsDispatching([this.phoneNumberInput]),this.handleInputEventDispatching()}attributeChangedCallback(e,t,r){if(super.attributeChangedCallback(e,t,r),t!==r&&l.includes(e)){const t=s[e]||e;this.phoneNumberInput.setAttribute(t,r)}}}},83067:(e,t,r)=>{r.r(t),r(19357);var o=r(41377);customElements.define(o.f,o.Z)},69423:(e,t,r)=>{r.r(t),r.d(t,{PhoneFieldInputBoxClass:()=>x}),r(83067),r(21294),r(19357);var o=r(41377),n=r(54567),i=r(2061),a=r(21e3),l=r(56417),s=r(87262),p=r(54201);const d=l.z.cssVarList,u=(0,n.iY)("phone-input-box-field"),{host:c,label:h,inputElement:b,requiredIndicator:m,inputField:y,phoneInput:g,errorMessage:f,helperText:v}={host:{selector:()=>":host"},label:{selector:"::part(label)"},placeholder:{selector:"> input:placeholder-shown"},inputElement:{selector:"input"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},inputField:{selector:"::part(input-field)"},phoneInput:{selector:()=>"descope-text-field"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},x=(0,i.qC)((0,a.yk)({mappings:{fontSize:[c,y,{selector:l.z.componentName,property:l.z.cssVarList.fontSize}],fontFamily:[h,f,v],hostWidth:{...c,property:"width"},hostMinWidth:{...c,property:"min-width"},hostDirection:{...c,property:"direction"},inputBorderStyle:{...y,property:"border-style"},inputBorderWidth:{...y,property:"border-width"},inputBorderColor:{...y,property:"border-color"},inputBorderRadius:{...y,property:"border-radius"},inputHorizontalPadding:[{...g,property:"padding-left"},{...g,property:"padding-right"}],labelFontSize:{...h,property:"font-size"},labelFontWeight:{...h,property:"font-weight"},labelTextColor:[{...h,property:"color"},{...m,property:"color"}],labelRequiredIndicator:{...m,property:"content"},errorMessageTextColor:{...f,property:"color"},inputValueTextColor:{...g,property:d.inputValueTextColor},inputPlaceholderTextColor:{...g,property:d.inputPlaceholderColor},inputOutlineStyle:{...y,property:"outline-style"},inputOutlineColor:{...y,property:"outline-color"},inputOutlineWidth:{...y,property:"outline-width"},inputOutlineOffset:{...y,property:"outline-offset"},labelPosition:{...h,property:"position"},labelTopPosition:{...h,property:"top"},labelHorizontalPosition:[{...h,property:"left"},{...h,property:"right"}],inputTransformY:{...h,property:"transform"},inputTransition:{...h,property:"transition"},marginInlineStart:{...h,property:"margin-inline-start"},valueInputHeight:{...b,property:"height"},valueInputMarginBottom:{selector:l.z.componentName,property:d.valueInputMarginBottom}}}),a.e4,(0,a.dj)({proxyProps:["value","selectionStart"]}),(e=>class extends e{static get CountryCodes(){return s.Z}init(){super.init?.();const e=document.createElement("template");e.innerHTML=`\n\t\t\t\t<${o.f}\n\t\t\t\t\ttabindex="-1"\n\t\t\t\t\tslot="input"\n\t\t\t\t></${o.f}>\n      `,this.baseElement.appendChild(e.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(o.f),(0,n.oP)(this.shadowRoot.host,this.inputElement,{includeAttrs:["size","bordered","invalid","minlength","maxlength","default-code","disabled","phone-input-placeholder","label","label-type"]})}}))((0,a.DM)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n    :host {\n      display: inline-flex;\n      max-width: 100%;\n      box-sizing: border-box;\n    }\n    ${(0,p.bi)(x.cssVarList)}\n    ${(0,p.Pd)("vaadin-text-field")}\n    ${(0,p.B)("vaadin-text-field")}\n    ${(0,p.DY)()}\n\n    vaadin-text-field {\n      width: 100%;\n      height: 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      overflow: hidden;\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      height: 100%;\n    }\n    descope-phone-field-internal-input-box > div {\n      width: 100%;\n      height: 100%;\n    }\n    descope-phone-field-internal-input-box .separator {\n      flex: 0;\n      border: none;\n    }\n    descope-text-field {\n      flex-grow: 1;\n      width: 100%;\n      ${d.inputOutlineWidth}: 0;\n      ${d.inputOutlineOffset}: 0;\n      ${d.inputBorderWidth}: 0;\n      ${d.inputBorderRadius}: 0;\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,p.Wf)("vaadin-text-field")}\n    ${(0,p.bz)()}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:u}));customElements.define(u,x)},16418:(e,t,r)=>{r.d(t,{g:()=>n});var o=r(87262);const n=e=>o.Z.find((t=>t.code===e))?.dialCode}}]);
+"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[5119],{84049:(e,t,r)=>{r.d(t,{H:()=>f,f:()=>l});var o=r(2061),n=r(54567),i=r(54201),a=r(94978);const l=(0,n.iY)("combo-box"),{host:s,inputField:p,inputElement:d,placeholder:u,toggle:c,clearButton:h,label:b,requiredIndicator:m,helperText:y,errorMessage:g}={host:{selector:()=>":host"},inputField:{selector:"::part(input-field)"},inputElement:{selector:"input"},placeholder:{selector:"> input:placeholder-shown"},toggle:{selector:"::part(toggle-button)"},clearButton:{selector:"::part(clear-button)"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},f=(0,o.qC)((0,a.yk)({mappings:{hostWidth:{...s,property:"width"},hostDirection:{...s,property:"direction"},fontSize:[{},s],fontFamily:[b,u,p,y,g],labelFontSize:{...b,property:"font-size"},labelFontWeight:{...b,property:"font-weight"},labelTextColor:[{...b,property:"color"},{...m,property:"color"}],errorMessageTextColor:{...g,property:"color"},inputHeight:{...p,property:"height"},inputBackgroundColor:{...p,property:"background-color"},inputBorderColor:{...p,property:"border-color"},inputBorderWidth:{...p,property:"border-width"},inputBorderStyle:{...p,property:"border-style"},inputBorderRadius:{...p,property:"border-radius"},labelRequiredIndicator:{...m,property:"content"},inputValueTextColor:{...p,property:"color"},inputPlaceholderTextColor:{...u,property:"color"},inputDropdownButtonCursor:[{...c,property:"cursor"},{...h,property:"cursor"}],inputDropdownButtonColor:[{...c,property:"color"},{...h,property:"color"}],inputDropdownButtonSize:[{...c,property:"font-size"},{...h,property:"font-size"}],inputDropdownButtonOffset:[{...c,property:"margin-right"},{...c,property:"margin-left"}],inputOutlineColor:{...p,property:"outline-color"},inputOutlineWidth:{...p,property:"outline-width"},inputOutlineStyle:{...p,property:"outline-style"},inputOutlineOffset:{...p,property:"outline-offset"},inputHorizontalPadding:[{...d,property:"padding-left"},{...d,property:"padding-right"}],labelPosition:{...b,property:"position"},labelTopPosition:{...b,property:"top"},labelHorizontalPosition:[{...b,property:"left"},{...b,property:"right"}],inputTransformY:{...b,property:"transform"},inputTransition:{...b,property:"transition"},marginInlineStart:{...b,property:"margin-inline-start"},placeholderOpacity:{...u,property:"opacity"},inputVerticalAlignment:{...p,property:"align-items"},valueInputHeight:{...d,property:"height"},valueInputMarginBottom:{...d,property:"margin-bottom"},overlayBackground:{property:()=>f.cssVarList.overlay.backgroundColor},overlayTextColor:{property:()=>f.cssVarList.overlay.textColor},overlayBorder:{property:()=>f.cssVarList.overlay.border},overlayFontSize:{property:()=>f.cssVarList.overlay.fontSize},overlayFontFamily:{property:()=>f.cssVarList.overlay.fontFamily},overlayCursor:{property:()=>f.cssVarList.overlay.cursor},overlayItemBoxShadow:{property:()=>f.cssVarList.overlay.itemBoxShadow},overlayItemPaddingInlineStart:{property:()=>f.cssVarList.overlay.itemPaddingInlineStart},overlayItemPaddingInlineEnd:{property:()=>f.cssVarList.overlay.itemPaddingInlineEnd}}}),a.e4,(0,a.Iw)({name:"overlay",selector:"",mappings:{backgroundColor:{selector:"vaadin-combo-box-scroller"},minHeight:{selector:"vaadin-combo-box-overlay"},margin:{selector:"vaadin-combo-box-overlay"},cursor:{selector:"vaadin-combo-box-item"},fontFamily:{selector:"vaadin-combo-box-item"},textColor:{selector:"vaadin-combo-box-item",property:"color"},fontSize:{selector:"vaadin-combo-box-item"},itemBoxShadow:{selector:"vaadin-combo-box-item",property:"box-shadow"},itemPaddingInlineStart:{selector:"vaadin-combo-box-item",property:"padding-inline-start"},itemPaddingInlineEnd:{selector:"vaadin-combo-box-item",property:"padding-inline-end"}},forward:{include:!1,attributes:["size"]}}),(0,a.dj)({proxyProps:["selectionStart"],inputEvent:"selected-item-changed"}),a.Ae,(e=>class extends e{static get observedAttributes(){return["label-type"]}#e=({displayName:e,value:t,label:r})=>`<span data-name="${r}" data-id="${t}">${e||r}</span>`;#t;get defaultValue(){return this.getAttribute("default-value")}get renderItem(){return this.#e}set renderItem(e){this.#e=e,this.renderItems()}get data(){if(this.#t)return this.#t;const e=this.getAttribute("data");if(e)try{const t=JSON.parse(e);if(this.isValidDataType(t))return t}catch(e){console.error('could not parse data string from attribute "data" -',e.message)}return[]}set data(e){this.isValidDataType(e)&&(this.#t=e,this.renderItems())}isValidDataType(e){const t=Array.isArray(e);return t||console.error("data must be an array, received:",e),t}getItemsTemplate(){return this.data?.reduce?.(((e,t)=>e+(this.renderItem?.(t||{})||"")),"")}renderItems(){const e=this.getItemsTemplate();e&&(this.innerHTML=e)}handleSelectedItem(){const e=this.baseElement.selectedItem?.["data-id"];this.baseElement.selectedItem=void 0,e&&(this.value=e),this.value||this.setDefaultValue()}customValueTransformFn(e){return e}setComboBoxDescriptor(){const e=Object.getOwnPropertyDescriptor(this.inputElement.constructor.prototype,"value"),t=this;Object.defineProperties(this.inputElement,{value:{...e,set(r){if(!t.baseElement.items?.length)return;const o=t.customValueTransformFn(r)||"";o!==this.value&&e.set.call(this,o)}}})}#r(){const e=this.shadowRoot.querySelector(this.baseSelector),t=Array.from(this.children);t.length&&(t.forEach((e=>{Object.defineProperty(e,"data-name",{value:e.getAttribute("data-name"),configurable:!0,writable:!0}),Object.defineProperty(e,"data-id",{value:e.getAttribute("data-id"),configurable:!0,writable:!0})})),e.items=t,setTimeout((()=>{this.handleSelectedItem()}),0)),e.renderer=(e,t,r)=>{e.innerHTML=r.item.outerHTML}}#o(){const e=this.baseElement.shadowRoot.querySelector("vaadin-combo-box-overlay");e._attachOverlay=()=>{e.bringToFront()},e._detachOverlay=()=>{},e._enterModalState=()=>{}}init(){super.init?.(),this.getValidity=function(){return!this.value&&this.isRequired?{valueMissing:!0}:{}},this.setComboBoxDescriptor(),this.#o(),this.renderItems(),(0,n.FX)(this,this.renderItems.bind(this),{includeAttrs:["data"]}),(0,n.P$)(this,this.#r.bind(this)),this.setDefaultValue(),this.baseElement.addEventListener("selected-item-changed",(()=>{this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0}))}))}onLabelClick(){this.isReadOnly||this.isDisabled||(this.focus(),this.setAttribute("opened","true"))}attributeChangedCallback(e,t,r){super.attributeChangedCallback?.(e,t,r),t!==r&&"label-type"===e&&("floating"===r?this.addEventListener("click",this.onLabelClick):this.removeEventListener("click",this.onLabelClick))}setDefaultValue(){this.value=this.defaultValue}set value(e){if(e){const t=this.baseElement.items?.find((t=>t["data-id"]===e));t&&(this.baseElement.selectedItem=t)}else this.baseElement.selectedItem=void 0}get value(){return this.baseElement.selectedItem?.["data-id"]||""}}))((0,a.DM)({slots:["","prefix"],wrappedEleName:"vaadin-combo-box",style:()=>`\n\t\t:host {\n\t\t\tdisplay: inline-flex;\n\t\t\tbox-sizing: border-box;\n\t\t\t-webkit-mask-image: none;\n\t\t}\n\t\t${(0,i.bi)(f.cssVarList)}\n\t\t${(0,i.PH)("vaadin-combo-box")}\n\t\t${(0,i.jI)("vaadin-combo-box")}\n\t\t${(0,i.Pd)("vaadin-combo-box")}\n\n\t\tvaadin-combo-box {\n\t\t\tpadding: 0;\n\t\t\twidth: 100%;\n\t\t}\n\t\tvaadin-combo-box::before {\n\t\t\theight: initial;\n\t\t}\n\t\tvaadin-combo-box [slot="input"] {\n\t\t\t-webkit-mask-image: none;\n\t\t\tmin-height: 0;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\tvaadin-combo-box::part(input-field) {\n\t\t\tpadding: 0;\n\t\t\tbox-shadow: none;\n\t\t}\n\n    vaadin-combo-box::part(toggle-button),\n    vaadin-combo-box::part(clear-button) {\n      align-self: center;\n    }\n\n    vaadin-combo-box[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n      opacity: 0;\n    }\n    vaadin-combo-box[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n      opacity: 0;\n    }\n  \n    ${(0,i.Wf)("vaadin-combo-box")}\n    ${(0,i.bz)()}\n\t\t`,excludeAttrsSync:["tabindex","size","data"],componentName:l,includeForwardProps:["items","renderer","selectedItem"]}))},21294:(e,t,r)=>{r.r(t),r.d(t,{ComboBoxClass:()=>o.H}),r(47583);var o=r(84049);customElements.define(o.f,o.H)},41377:(e,t,r)=>{r.d(t,{Z:()=>d,f:()=>a});var o=r(73878),n=r(54567),i=r(16418);const a=(0,n.iY)("phone-field-internal-input-box"),l=["disabled","size","bordered","invalid","readonly","phone-input-placeholder","name","autocomplete","label-type"],s={"phone-input-placeholder":"placeholder"},p=(0,o.P)({componentName:a,baseSelector:"div"}),d=class extends p{static get observedAttributes(){return[].concat(p.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,i.g)(this.getAttribute("default-code"))}get hasDefaultCode(){return!!this.getAttribute("default-code")}get value(){if(!this.phoneNumberValue)return"";if(this.hasDefaultCode){const e=new RegExp(`\\+?${parseInt(this.defaultCountryCode,10)}--?`);return`${this.defaultCountryCode}-${this.phoneNumberInput.value.replace(e,"")}`}return this.phoneNumberInput.value}set value(e){this.phoneNumberInput.value=e}get phoneNumberValue(){return this.phoneNumberInput.value}get minLength(){return parseInt(this.getAttribute("minlength"),10)||0}get maxLength(){return parseInt(this.getAttribute("maxlength"),10)||50}getValidity(){const e=this.value.replace(/\D/g,"");return this.isRequired&&!this.value?{valueMissing:!0}:e.length<this.minLength?{tooShort:!0}:e.length>this.maxLength?{tooLong:!0}:/^\+?\d{1,4}-?(?:\d-?){1,15}$/.test(this.value)?{}:{patternMismatch:!0}}init(){this.addEventListener("focus",(e=>{e.isTrusted&&this.phoneNumberInput.focus()})),super.init?.(),this.initInputs()}getCountryByDialCode(e){return this.countryCodeInput.items?.find((t=>t.getAttribute("data-country-code")===e))}initInputs(){this.phoneNumberInput.addEventListener("input",(e=>{1===e.target.value.length&&"-"===e.target.value&&(e.target.value=""),e.target.value=e.target.value.replace(/(?!^)\+/g,"").replace("--","-").replace("+-","+");const t=/^[+\d-]+$/,r=e.target.value.split("").filter((e=>t.test(e))).join("");e.target.value=r})),this.handleFocusEventsDispatching([this.phoneNumberInput]),this.handleInputEventDispatching()}attributeChangedCallback(e,t,r){if(super.attributeChangedCallback(e,t,r),t!==r&&l.includes(e)){const t=s[e]||e;this.phoneNumberInput.setAttribute(t,r)}}}},83067:(e,t,r)=>{r.r(t),r(19357);var o=r(41377);customElements.define(o.f,o.Z)},69423:(e,t,r)=>{r.r(t),r.d(t,{PhoneFieldInputBoxClass:()=>x}),r(83067),r(21294),r(19357);var o=r(41377),n=r(54567),i=r(2061),a=r(94978),l=r(56417),s=r(87262),p=r(54201);const d=l.z.cssVarList,u=(0,n.iY)("phone-input-box-field"),{host:c,label:h,inputElement:b,requiredIndicator:m,inputField:y,phoneInput:g,errorMessage:f,helperText:v}={host:{selector:()=>":host"},label:{selector:"::part(label)"},placeholder:{selector:"> input:placeholder-shown"},inputElement:{selector:"input"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},inputField:{selector:"::part(input-field)"},phoneInput:{selector:()=>"descope-text-field"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},x=(0,i.qC)((0,a.yk)({mappings:{fontSize:[c,y,{selector:l.z.componentName,property:l.z.cssVarList.fontSize}],fontFamily:[h,f,v],hostWidth:{...c,property:"width"},hostMinWidth:{...c,property:"min-width"},hostDirection:{...c,property:"direction"},inputBorderStyle:{...y,property:"border-style"},inputBorderWidth:{...y,property:"border-width"},inputBorderColor:{...y,property:"border-color"},inputBorderRadius:{...y,property:"border-radius"},inputHorizontalPadding:[{...g,property:"padding-left"},{...g,property:"padding-right"}],labelFontSize:{...h,property:"font-size"},labelFontWeight:{...h,property:"font-weight"},labelTextColor:[{...h,property:"color"},{...m,property:"color"}],labelRequiredIndicator:{...m,property:"content"},errorMessageTextColor:{...f,property:"color"},inputValueTextColor:{...g,property:d.inputValueTextColor},inputPlaceholderTextColor:{...g,property:d.inputPlaceholderColor},inputOutlineStyle:{...y,property:"outline-style"},inputOutlineColor:{...y,property:"outline-color"},inputOutlineWidth:{...y,property:"outline-width"},inputOutlineOffset:{...y,property:"outline-offset"},labelPosition:{...h,property:"position"},labelTopPosition:{...h,property:"top"},labelHorizontalPosition:[{...h,property:"left"},{...h,property:"right"}],inputTransformY:{...h,property:"transform"},inputTransition:{...h,property:"transition"},marginInlineStart:{...h,property:"margin-inline-start"},valueInputHeight:{...b,property:"height"},valueInputMarginBottom:{selector:l.z.componentName,property:d.valueInputMarginBottom}}}),a.e4,(0,a.dj)({proxyProps:["value","selectionStart"]}),(e=>class extends e{static get CountryCodes(){return s.Z}init(){super.init?.();const e=document.createElement("template");e.innerHTML=`\n\t\t\t\t<${o.f}\n\t\t\t\t\ttabindex="-1"\n\t\t\t\t\tslot="input"\n\t\t\t\t></${o.f}>\n      `,this.baseElement.appendChild(e.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(o.f),(0,n.oP)(this.shadowRoot.host,this.inputElement,{includeAttrs:["size","bordered","invalid","minlength","maxlength","default-code","disabled","phone-input-placeholder","label","label-type"]})}}))((0,a.DM)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n    :host {\n      display: inline-flex;\n      max-width: 100%;\n      box-sizing: border-box;\n    }\n    ${(0,p.bi)(x.cssVarList)}\n    ${(0,p.Pd)("vaadin-text-field")}\n    ${(0,p.B)("vaadin-text-field")}\n    ${(0,p.DY)()}\n\n    vaadin-text-field {\n      width: 100%;\n      height: 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      overflow: hidden;\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      height: 100%;\n    }\n    descope-phone-field-internal-input-box > div {\n      width: 100%;\n      height: 100%;\n    }\n    descope-phone-field-internal-input-box .separator {\n      flex: 0;\n      border: none;\n    }\n    descope-text-field {\n      flex-grow: 1;\n      width: 100%;\n      ${d.inputOutlineWidth}: 0;\n      ${d.inputOutlineOffset}: 0;\n      ${d.inputBorderWidth}: 0;\n      ${d.inputBorderRadius}: 0;\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,p.Wf)("vaadin-text-field")}\n    ${(0,p.bz)()}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:u}));customElements.define(u,x)},16418:(e,t,r)=>{r.d(t,{g:()=>n});var o=r(87262);const n=e=>o.Z.find((t=>t.code===e))?.dialCode}}]);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@descope/web-components-ui",
-  "version": "1.0.349",
+  "version": "1.0.350",
   "description": "",
   "main": "dist/cjs/index.cjs.js",
   "module": "dist/index.esm.js",

package/src/components/descope-grid/GridClass.js

@@ -29,7 +29,6 @@ const GridMixin = (superclass) =>
     // this renders the details panel content
     // in order to open it, the descope-grid-item-details-column should be used
     #rowDetailsRenderer = async (cell, _col, model) => {
-      await import('../descope-code-snippet');
       // prevent details panel from being scrolled into view when clicked
       cell.addEventListener('mousedown', (e) => e.stopImmediatePropagation(), true);
 

package/src/components/descope-grid/index.js

@@ -3,6 +3,7 @@ import './descope-grid-text-column';
 import './descope-grid-custom-column';
 import './descope-grid-selection-column';
 import './descope-grid-item-details-column';
+import '../descope-code-snippet'; // this is needed for the details panel
 
 import { componentName, GridClass } from './GridClass';
 

package/dist/umd/1000.js

@@ -1 +0,0 @@
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[1e3],{82561:(t,e,s)=>{s.d(e,{s:()=>l});var i=s(2061),n=s(30357);const r=t=>class extends t{updateComponentsContext(t){this.dispatchEvent(new CustomEvent("components-context",{bubbles:!0,composed:!0,detail:t}))}};var a=s(12666),o=s(28084);const l=({componentName:t,baseSelector:e=""})=>{class s extends HTMLElement{static get componentName(){return t}#t;#e=!0;get baseSelector(){return e}get baseElement(){return this.#t??=this.baseSelector?this.rootElement.querySelector(this.baseSelector):this,this.#t||console.warn("missing base element for component",this.localName),this.#t}get rootElement(){return this.shadowRoot||this}get name(){return this.getAttribute("name")}connectedCallback(){super.connectedCallback?.(),this.rootElement.isConnected&&this.#e&&(this.#e=!1,this.init?.())}}return(0,i.qC)(n.A,a._,o.Q,r)(s)}},65279:(t,e,s)=>{s.d(e,{gh:()=>i,k4:()=>n,qM:()=>a,qg:()=>r});const i="descope",n=3,r="host",a="@"},54567:(t,e,s)=>{s.d(e,{Db:()=>d,FX:()=>r,P$:()=>a,Tk:()=>c,iY:()=>h,oP:()=>u,tg:()=>l});var i=s(2061),n=s(65279);const r=(t,e,{excludeAttrs:s=[],includeAttrs:i=[]})=>{const n=Array.from(t.attributes).filter((t=>!s.includes(t.name)&&(!i.length||i.includes(t.name)))).map((t=>t.name));e(n),new MutationObserver((t=>{t.forEach((t=>{"attributes"!==t.type||s.includes(t.attributeName)||i.length&&!i.includes(t.attributeName)||e([t.attributeName])}))})).observe(t,{attributes:!0})},a=(t,e)=>{e({addedNodes:Array.from(t.children),removedNodes:[]}),new MutationObserver((t=>{t.forEach((t=>{"childList"!==t.type&&"characterData"!==t.type||e(t)}))})).observe(t,{childList:!0,characterData:!0,subtree:!0})},o=(t,e,s={})=>i=>{i.forEach((i=>{const n=s[i]||i,r=t.getAttribute(i);null!==r?e.getAttribute(n)!==r&&e.setAttribute(n,r):e.removeAttribute(n)}))},l=(t,e,s)=>{r(t,o(t,e),s),r(e,o(e,t),s)},h=t=>(0,i.E3)(n.gh,t),c=(...t)=>`--${(0,i.E3)(...t)}`,u=(t,e,s={})=>{r(t,o(t,e,s.mapAttrs),s)},d=(t,e,s=[])=>{if(!s.length)return;const i=s.reduce(((e,s)=>Object.assign(e,{[s]:{get:()=>t[s],set(e){t[s]=e}}})),{});Object.defineProperties(e,i)}},2061:(t,e,s)=>{s.d(e,{E3:()=>n,GL:()=>i,_k:()=>l,lo:()=>o,mf:()=>a,qC:()=>r});const i=t=>t.replace(/([a-z])([A-Z])/g,"$1-$2").replace(/[\s_.]+/g,"-").toLowerCase(),n=(...t)=>i(t.filter((t=>!!t)).join("-")),r=(...t)=>e=>t.reduceRight(((t,e)=>e(t)),e),a=t=>"function"==typeof t,o=(t,e)=>{if(!Array.isArray(t)||!Array.isArray(e))return!1;if(t.length!==e.length)return!1;const s=t.slice().sort(),i=e.slice().sort();for(let t=0;t<s.length;t++)if(s[t]!==i[t])return!1;return!0},l=t=>t.replace(/([A-Z])/g," $1").trim().split(" ").map((t=>t.charAt(0).toUpperCase()+t.slice(1))).join(" ")},37878:(t,e,s)=>{function i(t,e={}){const s=new Event(t,e);this[`on${t}`]?.(s),this.dispatchEvent(s)}s.d(e,{C:()=>i})},30357:(t,e,s)=>{s.d(e,{A:()=>i});const i=t=>class extends t{#s(){const e=this.localName;if(!t.componentName)throw Error('component name is not defined on super class, make sure you have a static get for "componentName"');if(e!==t.componentName)throw Error(`component name mismatch, expected "${t.componentName}", current "${e}"`)}init(){super.init?.(),this.#s()}}},12666:(t,e,s)=>{s.d(e,{_:()=>i});const i=t=>class extends t{init(){super.init?.(),this.baseElement.addEventListener("mouseover",(t=>{this.setAttribute("hover","true"),t.target.addEventListener("mouseleave",(()=>this.removeAttribute("hover")),{once:!0})}))}}},21e3:(t,e,s)=>{s.d(e,{li:()=>C,Ae:()=>A.A,DM:()=>m,yk:()=>h,e4:()=>c,_A:()=>S._,mE:()=>x,wX:()=>b,QT:()=>T.Q,Iw:()=>w,dj:()=>f});var i=s(65279),n=s(2061),r=s(54567),a=s(25561);class o{constructor(){this.styleMap=new Map}add(t,e,s){this.styleMap.has(t)||this.styleMap.set(t,[]),this.styleMap.set(t,[...this.styleMap.get(t),{property:e,value:s}])}toString(){return Array.from(this.styleMap.entries()).reduce(((t,[e,s])=>`${t}${e} { \n${s.map((({property:t,value:e})=>`${t}: ${e}`)).join(";\n")} \n}\n\n`),"")}}const l=(t,e)=>Object.keys(e).reduce(((e,s)=>Object.assign(e,{[s]:(0,r.Tk)(t,s)})),{}),h=({mappings:t={},componentNameOverride:e=""})=>s=>{const h=e||s.componentName;return class extends s{static get cssVarList(){return{...s.cssVarList,...l(h,{...t})}}#i;#n;#r;#a;#o;#l;#h;#c;#u;constructor({getRootElement:e,componentNameSuffix:s="",themeSection:r=i.qg,baseSelector:a}={}){super(),this.#a=s,this.#o=r,this.#h=a??this.baseSelector,this.#u=e,this.#c=Object.keys(t).map((t=>(0,n.E3)("st",s,t)))}get#d(){return a.componentsThemeManager.currentTheme?.[h]||""}#m(){this.#n.innerHTML=this.#d[this.#o]}#p(){this.#n=document.createElement("style"),this.#n.id=`style-mixin-theme__${h}`,this.#l.prepend(this.#n),this.#r=a.componentsThemeManager.onCurrentThemeChange(this.#m.bind(this)),this.#m()}#g(){if(this.#c.length){this.#i=document.createElement("style"),this.#i.id=`style-mixin-overrides__${h}`;const s=(t=h,e=i.k4,Array(e).fill(`.${t}`).join(""));this.#i.innerText=`:host(${s}) {}`,this.#l.append(this.#i)}var t,e}#b(t,e){const s=this.#i?.sheet?.cssRules[0].style;if(!s)return;const i=(0,r.Tk)(h,t.replace(new RegExp("^st-"),""));e?s?.setProperty(i,e):(s?.removeProperty(i),this.removeAttribute(t))}#E(t=[]){let e=!1;t.forEach((t=>{this.#c.includes(t)&&(this.#b(t,this.getAttribute(t)),e=!0)})),e&&(this.#i.innerHTML=this.#i?.sheet?.cssRules[0].cssText)}#v(){if(Object.keys(t).length){const e=document.createElement("style");e.id=`style-mixin-mappings__${h}`,e.innerHTML=((t,e,s)=>{const i=new o;return Object.keys(s).forEach((a=>{const o=((t,e)=>{const s={selector:"",property:(0,n.GL)(t)};return e&&Object.keys(e).length?Array.isArray(e)?e.map((t=>({...s,...t}))):[{...s,...e}]:[s]})(a,s[a]),l=(0,r.Tk)(t,a);o.forEach((({selector:t,property:s,important:r,fallback:a})=>{i.add(((t="",e="")=>(0,n.mf)(e)?e(t):`${t}${/^[A-Za-z]/.test(e)?` ${e}`:e}`)(e,t),(0,n.mf)(s)?s():s,((t,e)=>`var(${t}${e?`, ${e}`:""})`)(l,a)+(r?"!important":""))}))})),i.toString()})((0,n.E3)(h,this.#a),this.#h,t),this.#l.prepend(e)}}#y(t){(this.#l.classList||this.#l.host.classList).add(t)}async init(){super.init?.(),this.shadowRoot.isConnected&&(this.#l=await(this.#u?.(this))||this.shadowRoot,this.#y(h),this.#v(),this.#p(),this.#g(),(0,r.FX)(this,this.#E.bind(this),{}))}disconnectedCallback(){super.disconnectedCallback?.(),this.#r?.()}}},c=t=>class extends t{#f=null;static get observedAttributes(){return[...t.observedAttributes||[],"draggable"]}constructor(){super(),this.#f=document.createElement("style"),this.#f.innerText="* { cursor: inherit!important }"}#A(t){t?this.shadowRoot.appendChild(this.#f):this.#f.remove()}get isDraggable(){return this.hasAttribute("draggable")&&"false"!==this.getAttribute("draggable")}init(){this.addEventListener("mousedown",(t=>{if(this.isDraggable){const e=this.baseElement.getAttribute("tabindex");this.baseElement.setAttribute("tabindex","-1");const s=()=>{e?this.baseElement.setAttribute("tabindex",e):this.baseElement.removeAttribute("tabindex"),t.target.removeEventListener("mouseup",s),t.target.removeEventListener("dragend",s)};t.target.addEventListener("mouseup",s,{once:!0}),t.target.addEventListener("dragend",s,{once:!0})}})),super.init?.()}attributeChangedCallback(t,e,s){super.attributeChangedCallback?.(t,e,s),"draggable"===t&&this.#A("true"===s)}};var u=s(82561),d=s(37878);const m=({componentName:t,wrappedEleName:e,slots:s=[],style:i,excludeAttrsSync:a=[],includeAttrsSync:o=[],includeForwardProps:l=[],delegatesFocus:h=!0})=>{class c extends((0,u.s)({componentName:t,baseSelector:e})){#S=d.C.bind(this,"blur");#M=d.C.bind(this,"focus");constructor(){super().attachShadow({mode:"open",delegatesFocus:h}).innerHTML=`\n\t\t\t<style id="create-proxy">${((0,n.mf)(i)?i():i)||""}</style>\n\t\t\t<${e}>\n\t\t\t${s.map((t=>`<slot ${t?`name="${t}" slot="${t}"`:""} ></slot>`)).join("")}\n\t\t\t</${e}>\n\t\t`}init(){super.init?.(),this.baseElement.addEventListener("blur",(t=>{this.#S()})),this.baseElement.addEventListener("focus",(t=>{this.#M()})),(0,r.Db)(this.baseElement,this,l),(0,r.tg)(this.baseElement,this,{excludeAttrs:a,includeAttrs:o})}}return c};s(95910);const p=["required","pattern"],g=Symbol("validationTarget"),b=t=>class extends t{#w=g;static get observedAttributes(){return[...t.observedAttributes||[],...p]}static get formAssociated(){return!0}#C;get internals(){return this.#C}set internals(t){this.#C=t}constructor(){super(),this.#C=this.attachInternals()}get defaultErrorMsgValueMissing(){return"Please fill out this field."}get defaultErrorMsgPatternMismatch(){return"Please match the requested format."}get defaultErrorMsgTooShort(){return`Minimum length is ${this.getAttribute("minlength")}.`}get defaultErrorMsgTooLong(){return`Maximum length is ${this.getAttribute("maxlength")}.  `}get defaultErrorMsgRangeUnderflow(){return`At least ${this.getAttribute("min-items-selection")} items are required.`}get defaultErrorMsgRangeOverflow(){return`At most ${this.getAttribute("max-items-selection")} items are allowed.`}getErrorMessage(t){const{valueMissing:e,patternMismatch:s,typeMismatch:i,stepMismatch:n,tooShort:r,tooLong:a,rangeOverflow:o,rangeUnderflow:l,badInput:h,customError:c}=t;switch(!0){case e:return this.getAttribute("data-errormessage-value-missing")||this.defaultErrorMsgValueMissing;case s||i||n||h:return this.getAttribute("data-errormessage-pattern-mismatch")||this.defaultErrorMsgPatternMismatch;case r:return this.getAttribute("data-errormessage-pattern-mismatch-too-short")||this.defaultErrorMsgTooShort;case a:return this.getAttribute("data-errormessage-pattern-mismatch-too-long")||this.defaultErrorMsgTooLong;case l:return this.defaultErrorMsgRangeUnderflow;case o:return this.defaultErrorMsgRangeOverflow;case c:return this.validationMessage;default:return""}}#T(){const t=this.isReadOnly?{}:this.getValidity();this.#C.setValidity(t,this.getErrorMessage(t),this.validationTarget)}get validationMessage(){return this.#C.validationMessage}getValidity(){console.warn("getValidity","is not implemented")}checkValidity(){return this.#C.validity.valid}reportValidity(){return this.#C.reportValidity()}get validity(){return this.#C.validity}get validationTarget(){return this.#w===g?this.inputElement:this.#w}set validationTarget(t){this.#w=t}setCustomValidity(t){t?this.#C.setValidity({customError:!0},t,this.validationTarget):(this.#C.setValidity({}),this.#T())}get isRequired(){return this.hasAttribute("required")&&"false"!==this.getAttribute("required")}get isReadOnly(){return this.hasAttribute("readonly")&&"false"!==this.getAttribute("readonly")}get isDisabled(){return this.hasAttribute("disabled")&&"false"!==this.getAttribute("disabled")}get pattern(){return this.getAttribute("pattern")}get form(){return this.#C.form}attributeChangedCallback(t,e,s){super.attributeChangedCallback?.(t,e,s),p.includes(t)&&this.#T()}init(){super.init?.(),this.addEventListener("change",this.#T),this.addEventListener("invalid",(t=>t.stopPropagation())),this.addEventListener("input",this.#T),setTimeout((()=>this.#T()))}},E=["invalid","required"],v=t=>{if(!t)return;let e=t;for(let t=0;t<10;t++)if([e]=e.assignedElements(),"slot"!==e?.localName)return e},y=({proxyProps:t=[],useProxyTargets:e=!1,inputEvent:s="input",triggerValidationEvents:i=[],proxyParentValidation:n=!1})=>a=>class extends(b(a)){static get observedAttributes(){return[...a.observedAttributes||[],...E]}#x;#L=d.C.bind(this,"change");constructor(){super(),this.#x=super.inputElement}warnIfInputElementIsMissing(){clearTimeout(this.inputElementTimerId),this.inputElementTimerId=setTimeout((()=>{!this.#x&&console.warn(this.localName,"no input was found")}),0)}get inputElement(){if(this.#x)return this.#x;this.warnIfInputElementIsMissing();const t=this.baseElement.shadowRoot?.querySelector('slot[name="input"]'),e=this.baseElement.shadowRoot?.querySelector('slot[name="textarea"]');return this.#x=v(t)||v(e),this.#x}set inputElement(t){this.#x=t}getValidity(){return this.inputElement?.validity||{}}#V(){this.setAttribute("error-message",this.validationMessage)}reportValidity=()=>{this.inputElement.setCustomValidity(""),this.setCustomValidity(""),this.checkValidity()||(this.setAttribute("invalid","true"),this.#V(),this.focus())};defaultReportValidity(){return super.reportValidity()}init(){if(super.init?.(),this.baseElement._setInvalid=function(t){!t&&this._shouldSetInvalid(t)&&(this.invalid=t)},this.baseElement.addEventListener("input",(t=>{t.composed||this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0}))})),i.forEach((t=>{this.baseElement?.addEventListener(t,(()=>{this.inputElement?.setCustomValidity("")}))})),setTimeout((()=>{(Array.isArray(s)?s:[s]).forEach((t=>{this.baseElement?.addEventListener(t,(()=>{this.baseElement.checkValidity()?this.removeAttribute("invalid"):this.#V()}))})),this.baseElement.addEventListener("change",(()=>{this.#L()})),this.addEventListener("invalid",(()=>{this.checkValidity()||this.setAttribute("invalid","true"),this.#V()})),t.forEach((t=>{const s=e?[this.baseElement].filter(Boolean):[];((t,e,s)=>{const i=Array.isArray(e)?e:[e];Object.defineProperty(t,s,{set(t){i.forEach((e=>{e[s]=t}))},get:()=>e[0][s],configurable:!0})})(this,[this.inputElement,...s],t)})),this.setSelectionRange=this.inputElement.setSelectionRange?.bind(this.inputElement),(0,r.oP)(this,this.inputElement,{includeAttrs:["inputmode"]})})),n){const t=this.inputElement.internals,e=this;this.inputElement.internals=new Proxy(t,{get:(t,s)=>"function"==typeof t[s]&&"setValidity"===s?(...i)=>{if(3===i.length){const t=i.slice(0,i.length-1);t.push(e.inputElement),e.internals[s](...t)}else e.internals[s](...i);return t[s](...i)}:"function"==typeof t[s]?(...i)=>(e.internals[s](...i),t[s](...i)):t[s]})}}},f=t=>(0,n.qC)(y(t),h({componentNameOverride:(0,r.iY)("input-wrapper")}));var A=s(30357),S=s(12666);const M=t=>async e=>{const s=await t(e);return new Promise((t=>{let e=0;const i=()=>{if(e>20)return console.error("could not get shadow root for element",s),void t(s);e++,s?.shadowRoot?t(s.shadowRoot):setTimeout(i)};i()}))},w=({name:t,selector:e,mappings:s={},forward:{attributes:a=[],include:o=!0}={}})=>c=>{const u=t||(t=>t.replace(/[^\w\s]/gi,""))(e),d=h({mappings:s})(c);return class extends d{static get cssVarList(){return{...d.cssVarList,[u]:l((0,n.E3)(c.componentName,"_"+u),s)}}#k;constructor(){const t=M((async t=>{const s=t.shadowRoot.querySelector(t.baseSelector);return e?(await M((()=>s))(t)).querySelector(e):s}));super({getRootElement:t,componentNameSuffix:"_"+u,themeSection:i.qM+u,baseSelector:":host"}),this.#k=t(this).then((t=>t.host))}async#$(){const t=await this.#k;t.onmouseenter=t=>{t.target.setAttribute("hover","true")},t.onmouseleave=t=>{t.target.removeAttribute("hover")}}async init(){super.init?.();const t=await this.#k;(0,r.oP)(this,t,{[o?"includeAttrs":"excludeAttrs"]:a}),this.#$()}}},C=t=>class extends t{#L=d.C.bind(this,"change");init(){super.init?.(),this.prevValue=this.value,this.addEventListener("change",(t=>{t.stopPropagation()})),this.addEventListener("blur",(()=>{this.value!==this.prevValue&&(this.#L(),this.prevValue=this.value)}))}};var T=s(28084);const x=t=>class extends t{init(){this.#N(),super.init?.()}#N(){["blur","focus","focusin","focusout"].forEach((t=>{this.addEventListener(t,(t=>{t.isTrusted&&t.target===this&&t.stopImmediatePropagation()}))}))}handleFocusEventsDispatching(t){let e;t?.forEach((t=>{t?.addEventListener("focusout",(t=>{t.stopImmediatePropagation(),e=setTimeout((()=>{e=null,d.C.call(this,"blur"),d.C.call(this,"focusout",{bubbles:!0})}))}));const s=t=>{t.stopImmediatePropagation(),clearTimeout(e),e||(d.C.call(this,"focus"),d.C.call(this,"focusin",{bubbles:!0}))};t?.addEventListener("focusin",s),t?.addEventListener("focus",s)}))}handleInputEventDispatching(){let t=this.value;this.addEventListener("input",(e=>{t===this.value?e.stopImmediatePropagation():t=this.value}))}}},28084:(t,e,s)=>{s.d(e,{Q:()=>r});var i=s(54567);const n=["readonly","focused","invalid","has-label","required","disabled","checked","has-helper","has-value","step-buttons-visible","hover","has-error-message","focus-ring","opened","active","password-visible","opening","closing","has-no-options"],r=t=>class extends t{init(){super.init?.(),(0,i.FX)(this,(t=>t.forEach((t=>{const e=this.getAttribute(t);(t=>n.includes(t))(t)?""===e?this.setAttribute(t,"true"):"false"===e&&this.removeAttribute(t):e||console.debug(`attribute "${t}" has no value, should it be added to the boolean attributes list?`)}))),{})}}}}]);

package/dist/umd/1765.js

@@ -1 +0,0 @@
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[1765,8807],{96609:(e,o,t)=>{t.d(o,{b:()=>re,f:()=>p});var r=t(20637),l=t(21e3),s=t(2061),c=t(54567),a=t(82561);const p=(0,c.iY)("code-snippet");class n extends((0,a.s)({componentName:p,baseSelector:":host > code"})){static get observedAttributes(){return["lang","inline"]}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n    <style>\n      :host {\n        display: inline-block;\n        width: 100%;\n      }\n      code {\n        display: block;\n        width: 100%;\n        min-height: 1em;\n        overflow-x: scroll;\n        overflow-y: scroll;\n      }\n      pre {\n        margin: 0;\n      }\n    </style>\n    <code class="hljs"></code>\n    '}init(){super.init?.(),this.lang=this.getAttribute("lang"),this.isInline="true"===this.getAttribute("inline"),(0,c.P$)(this,this.#e.bind(this))}get contentNode(){return this.shadowRoot.querySelector(this.baseSelector)}attributeChangedCallback(e,o,t){super.attributeChangedCallback?.(e,o,t),o!==t&&("inline"===e&&(this.isInline=t),"lang"===e&&(this.lang=t),this.#e())}#e(){const e=(e=>{const o=document.createElement("textarea");return o.innerHTML=e,o.value})(this.textContent),o=this.lang;if(!o)return void(this.contentNode.textContent=e);const{value:t}=r.Z.highlight(e,{language:o});var l;this.contentNode.innerHTML=(l=t,this.isInline?l:`<pre>${l}</pre>`)}}const{root:i,docTag:h,keyword:d,metaKeyword:u,templateTag:y,templateVariable:C,type:g,variableLanguage:m,title:b,titleClass:T,titleClassInherited:x,titleFunction:j,attr:k,attribute:v,literal:w,meta:_,number:f,operator:I,variable:S,selectorAttr:A,selectorClass:q,selectorId:L,regexp:E,string:N,metaString:P,builtIn:B,symbol:F,comment:H,code:K,formula:M,name:V,quote:$,selectorTag:R,selectorPseudo:Y,subst:Z,section:z,bullet:D,emphasis:G,strong:J,addition:O,deletion:Q,charEscape:U,link:W,params:X,property:ee,punctuation:oe,tag:te}={root:{selector:()=>".hljs"},docTag:{selector:()=>".hljs-doctag"},keyword:{selector:()=>".hljs-keyword"},metaKeyword:{selector:()=>".hljs-meta .hljs-keyword"},templateTag:{selector:()=>".hljs-template-tag"},templateVariable:{selector:()=>".hljs-template-variable"},type:{selector:()=>".hljs-type"},variableLanguage:{selector:()=>".hljs-variable.language"},title:{selector:()=>".hljs-title"},titleClass:{selector:()=>".hljs-title.class_"},titleClassInherited:{selector:()=>".hljs-title.class_.inherited__"},titleFunction:{selector:()=>".hljs-title.function_"},attr:{selector:()=>".hljs-attr"},attribute:{selector:()=>".hljs-attribute"},literal:{selector:()=>".hljs-literal"},meta:{selector:()=>".hljs-meta"},number:{selector:()=>".hljs-number"},operator:{selector:()=>".hljs-operator"},variable:{selector:()=>".hljs-variable"},selectorAttr:{selector:()=>".hljs-selector-attr"},selectorClass:{selector:()=>".hljs-selector-class"},selectorId:{selector:()=>".hljs-selector-id"},regexp:{selector:()=>".hljs-regexp"},string:{selector:()=>".hljs-string"},metaString:{selector:()=>".hljs-meta .hljs-string"},builtIn:{selector:()=>".hljs-built_in"},symbol:{selector:()=>".hljs-symbol"},comment:{selector:()=>".hljs-comment"},code:{selector:()=>".hljs-code"},formula:{selector:()=>".hljs-formula"},name:{selector:()=>".hljs-name"},quote:{selector:()=>".hljs-quote"},selectorTag:{selector:()=>".hljs-selector-tag"},selectorPseudo:{selector:()=>".hljs-selector-pseudo"},subst:{selector:()=>".hljs-subst"},section:{selector:()=>".hljs-section"},bullet:{selector:()=>".hljs-bullet"},emphasis:{selector:()=>".hljs-emphasis"},strong:{selector:()=>".hljs-strong"},addition:{selector:()=>".hljs-addition"},deletion:{selector:()=>".hljs-deletion"},charEscape:{selector:()=>".hljs-char.escape"},link:{selector:()=>".hljs-link"},params:{selector:()=>".hljs-params"},property:{selector:()=>".hljs-property"},punctuation:{selector:()=>".hljs-punctuation"},tag:{selector:()=>".hljs-tag"}},re=(0,s.qC)((0,l.yk)({mappings:{rootBgColor:{...i,property:"background-color"},rootTextColor:{...i,property:"color"},docTagTextColor:{...h,property:"color"},keywordTextColor:{...d,property:"color"},metaKeywordTextColor:{...u,property:"color"},templateTagTextColor:{...y,property:"color"},templateVariableTextColor:{...C,property:"color"},typeTextColor:{...g,property:"color"},variableLanguageTextColor:{...m,property:"color"},titleTextColor:{...b,property:"color"},titleClassTextColor:{...T,property:"color"},titleClassInheritedTextColor:{...x,property:"color"},titleFunctionTextColor:{...j,property:"color"},attrTextColor:{...k,property:"color"},attributeTextColor:{...v,property:"color"},literalTextColor:{...w,property:"color"},metaTextColor:{..._,property:"color"},numberTextColor:{...f,property:"color"},operatorTextColor:{...I,property:"color"},variableTextColor:{...S,property:"color"},selectorAttrTextColor:{...A,property:"color"},selectorClassTextColor:{...q,property:"color"},selectorIdTextColor:{...L,property:"color"},regexpTextColor:{...E,property:"color"},stringTextColor:{...N,property:"color"},metaStringTextColor:{...P,property:"color"},builtInTextColor:{...B,property:"color"},symbolTextColor:{...F,property:"color"},commentTextColor:{...H,property:"color"},codeTextColor:{...K,property:"color"},formulaTextColor:{...M,property:"color"},nameTextColor:{...V,property:"color"},quoteTextColor:{...$,property:"color"},selectorTagTextColor:{...R,property:"color"},selectorPseudoTextColor:{...Y,property:"color"},substTextColor:{...Z,property:"color"},sectionTextColor:{...z,property:"color"},bulletTextColor:{...D,property:"color"},emphasisTextColor:{...G,property:"color"},strongTextColor:{...J,property:"color"},additionTextColor:{...O,property:"color"},additionBgColor:{...O,property:"background-color"},deletionTextColor:{...Q,property:"color"},deletionBgColor:{...Q,property:"background-color"},charEscapeTextColor:{...U,property:"color"},linkTextColor:{...W,property:"color"},paramsTextColor:{...X,property:"color"},propertyTextColor:{...ee,property:"color"},punctuationTextColor:{...oe,property:"color"},tagTextColor:{...te,property:"color"}}}),l.e4,l.Ae)(n)},91765:(e,o,t)=>{t.r(o),t.d(o,{CodeSnippetClass:()=>r.b});var r=t(96609);customElements.define(r.f,r.b)}}]);