@descope/web-components-ui 3.16.3 → 3.17.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.cjs.js +104 -8
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +104 -8
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/DescopeDev.js +1 -1
- package/dist/umd/DescopeDev.js.map +1 -1
- package/dist/umd/descope-hybrid-field-index-js.js +1 -1
- package/dist/umd/descope-hybrid-field-index-js.js.map +1 -1
- package/dist/umd/descope-user-attribute-index-js.js +2 -2
- package/dist/umd/descope-user-attribute-index-js.js.map +1 -1
- package/dist/umd/index.js +1 -1
- package/package.json +41 -41
- package/src/components/descope-hybrid-field/HybridFieldClass.js +11 -2
- package/src/components/descope-user-attribute/UserAttributeClass.js +91 -6
- package/src/components/descope-user-attribute/check.svg +3 -0
- package/src/components/descope-user-attribute/copy.svg +3 -0
- package/stories/descope-user-attribute.stories.js +12 -0
|
@@ -16,5 +16,5 @@
|
|
|
16
16
|
direction: rtl;
|
|
17
17
|
text-align: left;
|
|
18
18
|
}
|
|
19
|
-
`;(0,r.SF)("vaadin-email-field",l,{moduleId:"vaadin-email-field-styles"});class p extends a.A{static get is(){return"vaadin-email-field"}constructor(){super(),this._setType("email"),this.pattern="^([a-zA-Z0-9_\\.\\-+])+@[a-zA-Z0-9\\-.]+\\.[a-zA-Z0-9\\-]{2,}$"}ready(){super.ready(),this.inputElement&&(this.inputElement.autocapitalize="off")}}(0,s.X)(p);var u=i(47656),d=i(79365),h=i(9696),c=i(97810),m=i(73551);const g=(0,c.xE)("email-field"),y=(0,h.Zz)((0,d.RF)({mappings:u.A}),d.VO,(0,d.RV)({inputType:"email",inputName:"email",autocompleteType:"username",includeAttrs:["disabled","readonly","pattern"]}),(0,d.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),d.tQ,e=>class extends e{init(){super.init?.(),this.baseElement.setAttribute("pattern","^[\\w\\.\\%\\+\\-']+@[\\w\\.\\-]+\\.[A-Za-z]{2,}$"),this.getAttribute("autocomplete")||this.setAttribute("autocomplete","username"),this.createExternalInput()}})((0,d.tz)({slots:["","suffix"],wrappedEleName:"vaadin-email-field",style:()=>`\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tpadding: calc(var(${y.cssVarList.inputOutlineWidth}) + var(${y.cssVarList.inputOutlineOffset}));\n box-sizing: border-box;\n\t\t\t}\n ${(0,m.$J)("vaadin-email-field")}\n\t\t\t${(0,m.cy)(y.cssVarList)}\n\t\t\t${(0,m.LJ)("vaadin-email-field",y.cssVarList)}\n ${(0,m.Kl)()}\n\n vaadin-email-field[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n opacity: 0;\n }\n vaadin-email-field[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n opacity: 0;\n }\n\n :host ::slotted(*) {\n -webkit-mask-image: none;\n }\n\n vaadin-email-field[external-input="true"] > input:not(:placeholder-shown) {\n opacity: 0;\n }\n\t\t`,excludeAttrsSync:["tabindex","style"],componentName:g}));customElements.define(g,y)},44966(e,t,i){i.r(t),i.d(t,{HybridFieldClass:()=>y,componentName:()=>d}),i(54316),i(98136),i(30057);var n=i(25964),r=i(79365),o=i(81365),s=i(9696),a=i(97810);const l=/[^\d\s+\-()]/;var p=i(81808),u=i(16306);const d=(0,a.xE)("hybrid-field"),h={shared:["label","bordered","full-width","label-type","size","disabled","readonly","required","st-host-direction","st-error-message-icon","st-error-message-icon-size","st-error-message-icon-padding"],email:["placeholder","data-errormessage-value-missing-email","data-errormessage-pattern-mismatch-email","external-input"],phone:{countryCode:["phone-input-label","country-input-label","country-input-placeholder","restrict-countries","default-code","phone-minlength","phone-format-value","phone-strict-validation","phone-input-type","data-errormessage-value-missing-phone"],inputBox:["restrict-countries","default-code","phone-minlength","phone-format-value","phone-strict-validation","phone-input-type","data-errormessage-value-missing-phone"]}},c={email:{"data-errormessage-value-missing-email":"data-errormessage-value-missing","data-errormessage-pattern-mismatch-email":"data-errormessage-pattern-mismatch"},phone:{"phone-input-label":"label","phone-minlength":"minlength","phone-format-value":"format-value","phone-strict-validation":"strict-validation","data-errormessage-value-missing-phone":"data-errormessage-value-missing"}},m="descope-phone-field",g=(0,o.q)({componentName:d,baseSelector:"div"}),y=(0,s.Zz)((0,r.RF)({componentNameOverride:(0,a.xE)("input-wrapper")}),(0,r.RF)({mappings:{hostWidth:{selector:()=>":host",property:"width"},hostDirection:[{selector:()=>"descope-email-field",property:"direction"},{selector:()=>"descope-phone-field",property:"direction"},{selector:()=>"descope-phone-input-box-field",property:"direction"}],errorMessageIcon:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIcon},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIcon}],errorMessageIconSize:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIconSize},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIconSize}],errorMessageIconPadding:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIconPadding},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIconPadding}],errorMessageIconRepeat:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIconRepeat},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIconRepeat}],errorMessageIconPosition:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIconPosition},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIconPosition}],errorMessageFontSize:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageFontSize},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageFontSize}],labelFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.labelFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.labelFontWeight}],inputValueFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.inputValueFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.inputValueFontWeight}],inputPlaceholderFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.inputPlaceholderFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.inputPlaceholderFontWeight}],helperTextFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.helperTextFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.helperTextFontWeight}],errorMessageFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageFontWeight}]}}),r.VO,r.tQ)(class extends g{#e=!1;#t;constructor(){super(),this.attachShadow({mode:"open"}).innerHTML=`\n <div class="wrapper">\n <descope-email-field external-input="${this.isExternalInput}"></descope-email-field>\n <descope-phone-field allow-alphanumeric-input="true" phone-input-type="text"></descope-phone-field>\n <descope-phone-input-box-field allow-alphanumeric-input="true" phone-input-type="text"></descope-phone-input-box-field>\n </div>\n\t\t`,(0,n.fz)("\n :host {\n display: inline-flex;\n box-sizing: border-box;\n padding: 0;\n gap: 0;\n }\n .wrapper {\n display: grid;\n width: 100%;\n }\n descope-email-field,\n descope-phone-field,\n descope-phone-input-box-field {\n grid-area: 1/1;\n width: 100%;\n height: 100%;\n }\n .hidden {\n visibility: hidden;\n }\n ",this)}get isExternalInput(){return"true"===this.getAttribute("external-input")}get emailInputEle(){return this.isExternalInput?this.emailInput.externalInput:this.emailInput.inputElement}get phoneVariant(){return"inputBox"===this.getAttribute("phone-variant")?this.phoneInputBoxInput:this.phoneCountryCodeInput}get defaultCode(){const e=this.phoneCountryCodeInput.countryCodes?.[0]||"";return this.getAttribute("default-code")||e}get activeInputEle(){return this.activeInput===this.emailInput?this.emailInputEle:this.phoneVariant.phoneNumberInputEle}get value(){return this.activeInput?.value||""}set value(e){this.handleActiveInput(e),setTimeout(()=>{this.activeInput.value=e})}async init(){super.init?.(),this.initInputs(),this.updateAttrs(),this.toggleInputVisibility(),await this.waitForInputs(),this.initInputEles(),this.overrideEmailInputType(),this.overrideEmailSetAttribute()}waitForInputs(){return new Promise(e=>{const t=setInterval(()=>{this.emailInputEle&&(clearInterval(t),e())})})}initInputs(){this.emailInput=this.shadowRoot.querySelector("descope-email-field"),this.phoneCountryCodeInput=this.shadowRoot.querySelector(m),this.phoneInputBoxInput=this.shadowRoot.querySelector("descope-phone-input-box-field"),this.inputs=[this.emailInput,this.phoneCountryCodeInput,this.phoneInputBoxInput],this.activeInput=this.emailInput}initInputEles(){[this.emailInputEle,this.phoneCountryCodeInput.phoneNumberInputEle,this.phoneInputBoxInput.phoneNumberInputEle].forEach(e=>{e.addEventListener("input",this.onValueChange.bind(this))})}overrideEmailInputType(){this.emailInputEle.addEventListener("focus",()=>{this.emailInputEle.setAttribute("type","text")}),this.emailInputEle.addEventListener("blur",()=>{setTimeout(()=>{this.emailInputEle.setAttribute("type","email")})})}overrideEmailSetAttribute(){const e=this.emailInput.setAttribute.bind(this.emailInputEle);this.emailInputEle.setAttribute=(t,i)=>("type"!==t||"email"!==i||!this.emailInput.hasAttribute("focused"))&&e(t,i)}updateAttrs(){(0,a.EA)(this,this.emailInput,{includeAttrs:h.email,mapAttrs:c.email}),(0,a.EA)(this,this.phoneCountryCodeInput,{includeAttrs:h.phone.countryCode,mapAttrs:c.phone}),(0,a.EA)(this,this.phoneInputBoxInput,{includeAttrs:h.phone.inputBox,mapAttrs:c.phone}),this.inputs.forEach(e=>(0,a.EA)(this,e,{includeAttrs:h.shared})),setTimeout(()=>this.phoneCountryCodeInput.setAttribute("default-code",this.defaultCode))}onValueChange(){this.#t=this.activeInputEle.selectionStart,this.handleActiveInput(this.activeInputEle.value||this.activeInput.value)}handleActiveInput(e){const t=(e=>!!e&&!l.test(e))(e)?this.phoneVariant:this.emailInput;this.activeInput!==t&&this.setActiveInput(t)}setActiveInput(e){const t=this.activeInputEle.value||this.activeInput.value;this.activeInput=e,this.setActiveInputValue(t),this.#e&&this.activeInput.reportValidity(),this.setActiveInputSelectionStart(),this.toggleInputVisibility()}setActiveInputSelectionStart(){setTimeout(()=>{this.activeInputEle.focus(),this.activeInputEle.setSelectionRange?.(this.#t,this.#t)})}#i(){const e=this.getAttribute("default-code"),t=e&&p.NF.CountryCodes.find(t=>t.code===e);return t?.dialCode||p.NF.CountryCodes[0]?.dialCode||""}setActiveInputValue(e){const t=(e=>e.replace(/\+\d+-/,""))(e);if(this.activeInput.localName===m){const e=this.phoneCountryCodeInput.countryCodeItems||this.#i();this.activeInput.value=`${e}-${t}`}else this.activeInput.value=t}toggleInputVisibility(){this.inputs.forEach(e=>{e!==this.activeInput?e.classList.add("hidden"):e.classList.remove("hidden")})}reportValidity(){this.#e=!0;const e=this.activeInputEle,t=e.type;return e.setAttribute("type","text"),setTimeout(()=>{e.setSelectionRange?.(e.value.length,e.value.length),e.setAttribute("type",t)}),this.activeInput.reportValidity()}checkValidity(){return this.activeInput.checkValidity()}});customElements.define(d,y)},16306(e,t,i){i.d(t,{TQ:()=>h,Ul:()=>C});var n=i(25964),r=i(28027),o=i(9035),s=i(97810),a=i(9696),l=i(79365),p=i(51680),u=i(73551);const d=r.w.cssVarList,h=(0,s.xE)("phone-input-box-field"),{host:c,label:m,inputElement:g,requiredIndicator:y,inputField:f,internalComponent:v,internalComponentAfter:b,phoneInput:I,errorMessage:x,helperText:F}={host:{selector:()=>":host"},label:{selector:"::part(label)"},placeholder:{selector:"> input:placeholder-shown"},inputElement:{selector:"input"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},inputField:{selector:()=>"vaadin-text-field::part(input-field)"},internalComponent:{selector:"descope-phone-field-internal-input-box"},internalComponentAfter:{selector:"descope-phone-field-internal-input-box::after"},phoneInput:{selector:()=>"descope-text-field"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},C=(0,a.Zz)((0,l.RF)({mappings:{fontSize:[c,f,{selector:r.w.componentName,property:r.w.cssVarList.fontSize}],fontFamily:[m,x,F],hostWidth:{...c,property:"width"},hostMinWidth:{...c,property:"min-width"},hostDirection:{...c,property:"direction"},inputHorizontalPadding:[{...I,property:"padding-left"},{...I,property:"padding-right"}],labelFontSize:{...m,property:"font-size"},labelFontWeight:{...m,property:"font-weight"},inputValueFontWeight:{...I,property:d.inputValueFontWeight},inputPlaceholderFontWeight:{...I,property:d.inputPlaceholderFontWeight},helperTextFontWeight:{...F,property:"font-weight"},errorMessageFontWeight:{...x,property:"font-weight"},labelTextColor:[{...m,property:"color"},{...m,property:"-webkit-text-fill-color"},{...y,property:"color"}],labelRequiredIndicator:{...y,property:"content"},errorMessageTextColor:{...x,property:"color"},errorMessageIcon:{...x,property:"background-image"},errorMessageIconSize:{...x,property:"background-size"},errorMessageIconPadding:{...x,property:"padding-inline-start"},errorMessageIconRepeat:{...x,property:"background-repeat"},errorMessageIconPosition:{...x,property:"background-position"},errorMessageFontSize:{...x,property:"font-size"},inputValueTextColor:{...I,property:d.inputValueTextColor},inputPlaceholderTextColor:{...I,property:d.inputPlaceholderColor},inputBorderStyle:{...b,property:"border-style"},inputBorderWidth:{...b,property:"border-width"},inputBorderColor:{...b,property:"border-color"},inputBorderRadius:[{...v,property:"border-radius"},{...b,property:"border-radius"}],inputOutlineStyle:{...v,property:"outline-style"},inputOutlineColor:{...v,property:"outline-color"},inputOutlineWidth:{...v,property:"outline-width"},inputOutlineOffset:{...v,property:"outline-offset"},labelPosition:{...m,property:"position"},labelTopPosition:{...m,property:"top"},labelHorizontalPosition:[{...m,property:"left"},{...m,property:"right"}],inputTransformY:{...m,property:"transform"},inputTransition:{...m,property:"transition"},marginInlineStart:{...m,property:"margin-inline-start"},valueInputHeight:{...g,property:"height"},valueInputMarginBottom:{selector:r.w.componentName,property:d.valueInputMarginBottom}}}),l.VO,l.Yg,(0,l.OZ)({proxyProps:["value","selectionStart"]}),e=>class extends e{static get CountryCodes(){return p.A}init(){super.init?.();const e=document.createElement("template");e.innerHTML=`\n\t\t\t\t<${o.T}\n\t\t\t\t\ttabindex="-1"\n\t\t\t\t\tslot="input"\n\t\t\t\t></${o.T}>\n `,this.baseElement.appendChild(e.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(o.T),(0,n.Gh)(this,this.inputElement,{includeAttrs:["has-value"]}),(0,s.EA)(this.shadowRoot.host,this.inputElement,{includeAttrs:["size","minlength","maxlength","default-code","disabled","phone-input-placeholder","label","label-type","allow-alphanumeric-input","restrict-countries","format-value","strict-validation","data-errormessage-type-mismatch","phone-input-type"]})}get phoneNumberInputEle(){return this.inputElement?.phoneNumberInputEle}})((0,l.tz)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n :host {\n display: inline-flex;\n max-width: 100%;\n box-sizing: border-box;\n }\n ${(0,u.cy)(C.cssVarList)}\n ${(0,u.I4)("vaadin-text-field")}\n ${(0,u.kG)("vaadin-text-field")}\n ${(0,u.X6)()}\n\n vaadin-text-field {\n width: 100%;\n box-sizing: border-box;\n padding: 0;\n }\n vaadin-text-field[focus-ring]::part(input-field) {\n box-shadow: none;\n }\n vaadin-text-field::before {\n height: 0;\n }\n vaadin-text-field::part(input-field) {\n padding: 0;\n background: transparent;\n -webkit-mask-image: none;\n }\n descope-phone-field-internal-input-box {\n -webkit-mask-image: none;\n padding: 0;\n width: 100%;\n }\n descope-phone-field-internal-input-box > div {\n width: 100%;\n }\n descope-phone-field-internal-input-box descope-text-field {\n ${d.inputOutlineWidth}: 0;\n ${d.inputOutlineOffset}: 0;\n }\n descope-phone-field-internal-input-box::after {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n box-sizing: border-box;\n pointer-events: none;\n }\n descope-text-field {\n flex-grow: 1;\n width: 100%;\n direction: ltr;\n }\n vaadin-text-field[readonly] > input:placeholder-shown {\n opacity: 1;\n }\n vaadin-text-field::part(input-field)::after {\n border: none;\n }\n\n vaadin-text-field[label-type="floating"]:not([focused])[readonly] input:placeholder-shown {\n opacity: 0;\n }\n vaadin-text-field[label-type="floating"]:not([focused])[disabled] input:placeholder-shown {\n opacity: 0;\n }\n\n ${(0,u.$J)("vaadin-text-field")}\n ${(0,u.Kl)()}\n\t\t`,excludeAttrsSync:["tabindex","style"],componentName:h}))},9035(e,t,i){i.d(t,{A:()=>c,T:()=>p});var n=i(25964),r=i(10473),o=i(23530),s=i(3393),a=i(97810),l=i(92259);const p=(0,a.xE)("phone-field-internal-input-box"),u=["disabled","size","readonly","phone-input-placeholder","name","maxlength","autocomplete","label-type","phone-input-type"],d={"phone-input-placeholder":"placeholder","phone-input-type":"type"},h=(0,s.y)({componentName:p,baseSelector:"div"}),c=class extends h{static get observedAttributes(){return[].concat(h.observedAttributes||[],u)}#n;constructor(){super(),this.innerHTML='\n <div>\n <descope-text-field tabindex="1" type="tel" bordered="false"></descope-text-field>\n </div>\n ',this.textField=this.querySelector("descope-text-field")}get phoneNumberInputEle(){return this.textField.shadowRoot.querySelector("input")}get defaultDialCode(){return(0,l.Q)(this.getAttribute("default-code"))}get defaultCode(){return this.getAttribute("default-code")}get allowAlphanumericInput(){return"true"===this.getAttribute("allow-alphanumeric-input")}get minLength(){return parseInt(this.getAttribute("minlength"),10)||0}get maxLength(){return parseInt(this.getAttribute("maxlength"),10)||50}get restrictCountries(){return this.getAttribute("restrict-countries")?.split(",").filter(Boolean)||[]}get isFormatValue(){return"true"===this.getAttribute("format-value")}get isStrictValidation(){return"true"===this.getAttribute("strict-validation")}get value(){if(!this.textField.value)return"";if(!this.isStrictValidation)return this.#r();const e=this.#o();return e?.country&&e?.countryCallingCode&&e?.nationalNumber?`+${[e?.countryCallingCode,e?.nationalNumber].join("-")}`:this.textField.value}set value(e){this.textField.value=e}init(){this.addEventListener("focus",e=>{e.isTrusted&&this.textField.focus()}),super.init?.(),this.textField.addEventListener("input",this.#s.bind(this)),this.handleFocusEventsDispatching([this.textField]),(0,n.EA)(this.textField,this,{includeAttrs:["has-value"]}),(0,n.EA)(this,this.textField,{includeAttrs:["phone-input-type"],mapAttrs:{"phone-input-type":"type"}})}getValidity(){const e=/^\+?\d{1,4}-?(?:\d-?){1,15}$/,t=this.#a(this.textField.value||"");if(this.isRequired&&!this.textField.value)return{valueMissing:!0};if(this.textField.value){if(t.length<this.minLength)return{tooShort:!0};if(this.isStrictValidation&&this.textField.value&&!this.#l()||!this.isStrictValidation&&this.textField.value&&!e.test(this.value))return{patternMismatch:!0}}return{}}setSelectionRange(...e){this.textField.setSelectionRange(...e)}attributeChangedCallback(e,t,i){if(super.attributeChangedCallback(e,t,i),t!==i&&u.includes(e)){const t=d[e]||e;this.textField.setAttribute(t,i)}}#s(e){let t=this.#p(e.target.value);this.isFormatValue&&this.#u(t)&&(t=this.#d(t)),e.target.value=t}#r(){if(!this.defaultDialCode)return this.textField.value;const e=this.#h(this.textField.value),t=this.#a(e);return[this.defaultDialCode,t].join("-")}#o(){return this.defaultDialCode?(0,r.l)([this.defaultDialCode,this.#a(this.textField.value)].filter(Boolean).join("")):(0,r.l)(this.textField.value)}#a(e){return e.replace(/\D/g,"")}#h(e){if("+"===this.textField.value?.[0]){const t=new RegExp(`^\\${this.defaultDialCode}`);return e.replace(t,"")}return e}#l(){const e=(0,r.l)(this.value);return!(!e||!e.isValid?.()||!e.country||!this.#c(e.country)||this.defaultCode&&this.defaultCode!==e.country)}#c(e){return!this.restrictCountries.length||this.restrictCountries.includes(e)}#p(e){if(e=e.replace(/^-+/,"").replace(/(?!^)\+/g,"").replace("--","-").replace("+-","+"),!this.allowAlphanumericInput){const t=/^[+\d-\(\)]+$/;e=e.split("").filter(e=>t.test(e)).join("")}return e}#d(e=""){const t=this.defaultCode||this.#m(e);return t?(this.#n&&this.#n.country===t||(this.#n=new o.Q(t)),this.#n.reset(),this.#n.input(e)||e):e}#m(e){const t=(0,r.l)(e);return t?.country||""}#u(e){return!!(0,l.W)(e)}}},78343(e,t,i){i.r(t),i(64014);var n=i(9035);customElements.define(n.T,n.A)},30057(e,t,i){i.r(t),i.d(t,{PhoneFieldInputBoxClass:()=>n.Ul,componentName:()=>n.TQ}),i(78343),i(64014);var n=i(16306);customElements.define(n.TQ,n.Ul)},92259(e,t,i){i.d(t,{Q:()=>r,W:()=>o});var n=i(51680);const r=e=>n.A.find(t=>t.code===e)?.dialCode,o=e=>{const t=e.match(/\(/g),i=e.match(/\)/g);return t?.length===i?.length}}}]);
|
|
19
|
+
`;(0,r.SF)("vaadin-email-field",l,{moduleId:"vaadin-email-field-styles"});class p extends a.A{static get is(){return"vaadin-email-field"}constructor(){super(),this._setType("email"),this.pattern="^([a-zA-Z0-9_\\.\\-+])+@[a-zA-Z0-9\\-.]+\\.[a-zA-Z0-9\\-]{2,}$"}ready(){super.ready(),this.inputElement&&(this.inputElement.autocapitalize="off")}}(0,s.X)(p);var u=i(47656),d=i(79365),h=i(9696),c=i(97810),m=i(73551);const g=(0,c.xE)("email-field"),y=(0,h.Zz)((0,d.RF)({mappings:u.A}),d.VO,(0,d.RV)({inputType:"email",inputName:"email",autocompleteType:"username",includeAttrs:["disabled","readonly","pattern"]}),(0,d.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),d.tQ,e=>class extends e{init(){super.init?.(),this.baseElement.setAttribute("pattern","^[\\w\\.\\%\\+\\-']+@[\\w\\.\\-]+\\.[A-Za-z]{2,}$"),this.getAttribute("autocomplete")||this.setAttribute("autocomplete","username"),this.createExternalInput()}})((0,d.tz)({slots:["","suffix"],wrappedEleName:"vaadin-email-field",style:()=>`\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tpadding: calc(var(${y.cssVarList.inputOutlineWidth}) + var(${y.cssVarList.inputOutlineOffset}));\n box-sizing: border-box;\n\t\t\t}\n ${(0,m.$J)("vaadin-email-field")}\n\t\t\t${(0,m.cy)(y.cssVarList)}\n\t\t\t${(0,m.LJ)("vaadin-email-field",y.cssVarList)}\n ${(0,m.Kl)()}\n\n vaadin-email-field[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n opacity: 0;\n }\n vaadin-email-field[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n opacity: 0;\n }\n\n :host ::slotted(*) {\n -webkit-mask-image: none;\n }\n\n vaadin-email-field[external-input="true"] > input:not(:placeholder-shown) {\n opacity: 0;\n }\n\t\t`,excludeAttrsSync:["tabindex","style"],componentName:g}));customElements.define(g,y)},44966(e,t,i){i.r(t),i.d(t,{HybridFieldClass:()=>y,componentName:()=>d}),i(54316),i(98136),i(30057);var n=i(25964),r=i(79365),o=i(81365),s=i(9696),a=i(97810);const l=/[^\d\s+\-()]/;var p=i(81808),u=i(16306);const d=(0,a.xE)("hybrid-field"),h={shared:["label","bordered","full-width","label-type","size","disabled","readonly","required","st-host-direction","st-error-message-icon","st-error-message-icon-size","st-error-message-icon-padding"],email:["placeholder","data-errormessage-value-missing-email","data-errormessage-pattern-mismatch-email","external-input"],phone:{countryCode:["phone-input-label","country-input-label","country-input-placeholder","restrict-countries","default-code","phone-minlength","phone-format-value","phone-strict-validation","phone-input-type","data-errormessage-value-missing-phone"],inputBox:["restrict-countries","default-code","phone-minlength","phone-format-value","phone-strict-validation","phone-input-type","data-errormessage-value-missing-phone"]}},c={email:{"data-errormessage-value-missing-email":"data-errormessage-value-missing","data-errormessage-pattern-mismatch-email":"data-errormessage-pattern-mismatch"},phone:{"phone-input-label":"label","phone-minlength":"minlength","phone-format-value":"format-value","phone-strict-validation":"strict-validation","data-errormessage-value-missing-phone":"data-errormessage-value-missing"}},m="descope-phone-field",g=(0,o.q)({componentName:d,baseSelector:"div"}),y=(0,s.Zz)((0,r.RF)({componentNameOverride:(0,a.xE)("input-wrapper")}),(0,r.RF)({mappings:{hostWidth:{selector:()=>":host",property:"width"},hostDirection:[{selector:()=>"descope-email-field",property:"direction"},{selector:()=>"descope-phone-field",property:"direction"},{selector:()=>"descope-phone-input-box-field",property:"direction"}],errorMessageIcon:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIcon},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIcon}],errorMessageIconSize:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIconSize},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIconSize}],errorMessageIconPadding:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIconPadding},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIconPadding}],errorMessageIconRepeat:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIconRepeat},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIconRepeat}],errorMessageIconPosition:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageIconPosition},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageIconPosition}],errorMessageFontSize:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageFontSize},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageFontSize}],labelFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.labelFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.labelFontWeight}],inputValueFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.inputValueFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.inputValueFontWeight}],inputPlaceholderFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.inputPlaceholderFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.inputPlaceholderFontWeight}],helperTextFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.helperTextFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.helperTextFontWeight}],errorMessageFontWeight:[{selector:()=>p.NF.componentName,property:p.NF.cssVarList.errorMessageFontWeight},{selector:()=>u.Ul.componentName,property:u.Ul.cssVarList.errorMessageFontWeight}]}}),r.VO,r.tQ)(class extends g{#e=!1;#t;constructor(){super(),this.attachShadow({mode:"open"}).innerHTML=`\n <div class="wrapper">\n <descope-email-field external-input="${this.isExternalInput}"></descope-email-field>\n <descope-phone-field allow-alphanumeric-input="true" phone-input-type="text"></descope-phone-field>\n <descope-phone-input-box-field allow-alphanumeric-input="true" phone-input-type="text"></descope-phone-input-box-field>\n </div>\n\t\t`,(0,n.fz)("\n :host {\n display: inline-flex;\n box-sizing: border-box;\n padding: 0;\n gap: 0;\n }\n .wrapper {\n display: grid;\n width: 100%;\n }\n descope-email-field,\n descope-phone-field,\n descope-phone-input-box-field {\n grid-area: 1/1;\n width: 100%;\n height: 100%;\n }\n .hidden {\n visibility: hidden;\n }\n ",this)}get isExternalInput(){return"true"===this.getAttribute("external-input")}get emailInputEle(){return this.isExternalInput?this.emailInput.externalInput:this.emailInput.inputElement}get phoneVariant(){return"inputBox"===this.getAttribute("phone-variant")?this.phoneInputBoxInput:this.phoneCountryCodeInput}get defaultCode(){const e=this.phoneCountryCodeInput.countryCodes?.[0]||"";return this.getAttribute("default-code")||e}get activeInputEle(){return this.activeInput===this.emailInput?this.emailInputEle:this.phoneVariant.phoneNumberInputEle}get value(){return this.activeInput?.value||""}set value(e){this.handleActiveInput(e),setTimeout(()=>{this.activeInput.value=e})}async init(){super.init?.(),this.initInputs(),this.updateAttrs(),this.toggleInputVisibility(),await this.waitForInputs(),this.initInputEles(),this.overrideEmailInputType(),this.overrideEmailSetAttribute()}waitForInputs(){return new Promise(e=>{const t=setInterval(()=>{this.emailInputEle&&(clearInterval(t),e())})})}initInputs(){this.emailInput=this.shadowRoot.querySelector("descope-email-field"),this.phoneCountryCodeInput=this.shadowRoot.querySelector(m),this.phoneInputBoxInput=this.shadowRoot.querySelector("descope-phone-input-box-field"),this.inputs=[this.emailInput,this.phoneCountryCodeInput,this.phoneInputBoxInput],this.activeInput=this.emailInput}initInputEles(){[this.emailInputEle,this.phoneCountryCodeInput.phoneNumberInputEle,this.phoneInputBoxInput.phoneNumberInputEle].forEach(e=>{e.addEventListener("input",this.onValueChange.bind(this))})}overrideEmailInputType(){this.emailInputEle.addEventListener("focus",()=>{this.emailInputEle.setAttribute("type","text")}),this.emailInputEle.addEventListener("blur",()=>{setTimeout(()=>{this.emailInputEle.setAttribute("type","email")})})}overrideEmailSetAttribute(){const e=this.emailInput.setAttribute.bind(this.emailInputEle);this.emailInputEle.setAttribute=(t,i)=>("type"!==t||"email"!==i||!this.emailInput.hasAttribute("focused"))&&e(t,i)}updateAttrs(){(0,a.EA)(this,this.emailInput,{includeAttrs:h.email,mapAttrs:c.email}),(0,a.EA)(this,this.phoneCountryCodeInput,{includeAttrs:h.phone.countryCode,mapAttrs:c.phone}),(0,a.EA)(this,this.phoneInputBoxInput,{includeAttrs:h.phone.inputBox,mapAttrs:c.phone}),this.inputs.forEach(e=>(0,a.EA)(this,e,{includeAttrs:h.shared})),setTimeout(()=>this.phoneCountryCodeInput.setAttribute("default-code",this.defaultCode))}onValueChange(){this.#t=this.activeInputEle.selectionStart,this.handleActiveInput(this.activeInputEle.value||this.activeInput.value)}handleActiveInput(e){const t=(e=>!!e&&!l.test(e))(e)?this.phoneVariant:this.emailInput;this.activeInput!==t&&this.setActiveInput(t)}setActiveInput(e){const t=this.activeInputEle.value||this.activeInput.value;this.activeInput=e,this.setActiveInputValue(t),this.#e&&this.activeInput.reportValidity(),this.setActiveInputSelectionStart(),this.toggleInputVisibility()}setActiveInputSelectionStart(){setTimeout(()=>{const e=this.activeInputEle;e.focus();try{e.setSelectionRange?.(this.#t,this.#t)}catch{}})}#i(){const e=this.getAttribute("default-code"),t=e&&p.NF.CountryCodes.find(t=>t.code===e);return t?.dialCode||p.NF.CountryCodes[0]?.dialCode||""}setActiveInputValue(e){const t=(e=>e.replace(/\+\d+-/,""))(e);if(this.activeInput.localName===m){const e=this.phoneCountryCodeInput.countryCodeItems||this.#i();this.activeInput.value=`${e}-${t}`}else this.activeInput.value=t}toggleInputVisibility(){this.inputs.forEach(e=>{e!==this.activeInput?e.classList.add("hidden"):e.classList.remove("hidden")})}reportValidity(){this.#e=!0;const e=this.activeInputEle,t=e.type;return e.setAttribute("type","text"),setTimeout(()=>{e.setSelectionRange?.(e.value.length,e.value.length),e.setAttribute("type",t)}),this.activeInput.reportValidity()}checkValidity(){return this.activeInput.checkValidity()}});customElements.define(d,y)},16306(e,t,i){i.d(t,{TQ:()=>h,Ul:()=>C});var n=i(25964),r=i(28027),o=i(9035),s=i(97810),a=i(9696),l=i(79365),p=i(51680),u=i(73551);const d=r.w.cssVarList,h=(0,s.xE)("phone-input-box-field"),{host:c,label:m,inputElement:g,requiredIndicator:y,inputField:f,internalComponent:v,internalComponentAfter:b,phoneInput:I,errorMessage:x,helperText:F}={host:{selector:()=>":host"},label:{selector:"::part(label)"},placeholder:{selector:"> input:placeholder-shown"},inputElement:{selector:"input"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},inputField:{selector:()=>"vaadin-text-field::part(input-field)"},internalComponent:{selector:"descope-phone-field-internal-input-box"},internalComponentAfter:{selector:"descope-phone-field-internal-input-box::after"},phoneInput:{selector:()=>"descope-text-field"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},C=(0,a.Zz)((0,l.RF)({mappings:{fontSize:[c,f,{selector:r.w.componentName,property:r.w.cssVarList.fontSize}],fontFamily:[m,x,F],hostWidth:{...c,property:"width"},hostMinWidth:{...c,property:"min-width"},hostDirection:{...c,property:"direction"},inputHorizontalPadding:[{...I,property:"padding-left"},{...I,property:"padding-right"}],labelFontSize:{...m,property:"font-size"},labelFontWeight:{...m,property:"font-weight"},inputValueFontWeight:{...I,property:d.inputValueFontWeight},inputPlaceholderFontWeight:{...I,property:d.inputPlaceholderFontWeight},helperTextFontWeight:{...F,property:"font-weight"},errorMessageFontWeight:{...x,property:"font-weight"},labelTextColor:[{...m,property:"color"},{...m,property:"-webkit-text-fill-color"},{...y,property:"color"}],labelRequiredIndicator:{...y,property:"content"},errorMessageTextColor:{...x,property:"color"},errorMessageIcon:{...x,property:"background-image"},errorMessageIconSize:{...x,property:"background-size"},errorMessageIconPadding:{...x,property:"padding-inline-start"},errorMessageIconRepeat:{...x,property:"background-repeat"},errorMessageIconPosition:{...x,property:"background-position"},errorMessageFontSize:{...x,property:"font-size"},inputValueTextColor:{...I,property:d.inputValueTextColor},inputPlaceholderTextColor:{...I,property:d.inputPlaceholderColor},inputBorderStyle:{...b,property:"border-style"},inputBorderWidth:{...b,property:"border-width"},inputBorderColor:{...b,property:"border-color"},inputBorderRadius:[{...v,property:"border-radius"},{...b,property:"border-radius"}],inputOutlineStyle:{...v,property:"outline-style"},inputOutlineColor:{...v,property:"outline-color"},inputOutlineWidth:{...v,property:"outline-width"},inputOutlineOffset:{...v,property:"outline-offset"},labelPosition:{...m,property:"position"},labelTopPosition:{...m,property:"top"},labelHorizontalPosition:[{...m,property:"left"},{...m,property:"right"}],inputTransformY:{...m,property:"transform"},inputTransition:{...m,property:"transition"},marginInlineStart:{...m,property:"margin-inline-start"},valueInputHeight:{...g,property:"height"},valueInputMarginBottom:{selector:r.w.componentName,property:d.valueInputMarginBottom}}}),l.VO,l.Yg,(0,l.OZ)({proxyProps:["value","selectionStart"]}),e=>class extends e{static get CountryCodes(){return p.A}init(){super.init?.();const e=document.createElement("template");e.innerHTML=`\n\t\t\t\t<${o.T}\n\t\t\t\t\ttabindex="-1"\n\t\t\t\t\tslot="input"\n\t\t\t\t></${o.T}>\n `,this.baseElement.appendChild(e.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(o.T),(0,n.Gh)(this,this.inputElement,{includeAttrs:["has-value"]}),(0,s.EA)(this.shadowRoot.host,this.inputElement,{includeAttrs:["size","minlength","maxlength","default-code","disabled","phone-input-placeholder","label","label-type","allow-alphanumeric-input","restrict-countries","format-value","strict-validation","data-errormessage-type-mismatch","phone-input-type"]})}get phoneNumberInputEle(){return this.inputElement?.phoneNumberInputEle}})((0,l.tz)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n :host {\n display: inline-flex;\n max-width: 100%;\n box-sizing: border-box;\n }\n ${(0,u.cy)(C.cssVarList)}\n ${(0,u.I4)("vaadin-text-field")}\n ${(0,u.kG)("vaadin-text-field")}\n ${(0,u.X6)()}\n\n vaadin-text-field {\n width: 100%;\n box-sizing: border-box;\n padding: 0;\n }\n vaadin-text-field[focus-ring]::part(input-field) {\n box-shadow: none;\n }\n vaadin-text-field::before {\n height: 0;\n }\n vaadin-text-field::part(input-field) {\n padding: 0;\n background: transparent;\n -webkit-mask-image: none;\n }\n descope-phone-field-internal-input-box {\n -webkit-mask-image: none;\n padding: 0;\n width: 100%;\n }\n descope-phone-field-internal-input-box > div {\n width: 100%;\n }\n descope-phone-field-internal-input-box descope-text-field {\n ${d.inputOutlineWidth}: 0;\n ${d.inputOutlineOffset}: 0;\n }\n descope-phone-field-internal-input-box::after {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n box-sizing: border-box;\n pointer-events: none;\n }\n descope-text-field {\n flex-grow: 1;\n width: 100%;\n direction: ltr;\n }\n vaadin-text-field[readonly] > input:placeholder-shown {\n opacity: 1;\n }\n vaadin-text-field::part(input-field)::after {\n border: none;\n }\n\n vaadin-text-field[label-type="floating"]:not([focused])[readonly] input:placeholder-shown {\n opacity: 0;\n }\n vaadin-text-field[label-type="floating"]:not([focused])[disabled] input:placeholder-shown {\n opacity: 0;\n }\n\n ${(0,u.$J)("vaadin-text-field")}\n ${(0,u.Kl)()}\n\t\t`,excludeAttrsSync:["tabindex","style"],componentName:h}))},9035(e,t,i){i.d(t,{A:()=>c,T:()=>p});var n=i(25964),r=i(10473),o=i(23530),s=i(3393),a=i(97810),l=i(92259);const p=(0,a.xE)("phone-field-internal-input-box"),u=["disabled","size","readonly","phone-input-placeholder","name","maxlength","autocomplete","label-type","phone-input-type"],d={"phone-input-placeholder":"placeholder","phone-input-type":"type"},h=(0,s.y)({componentName:p,baseSelector:"div"}),c=class extends h{static get observedAttributes(){return[].concat(h.observedAttributes||[],u)}#n;constructor(){super(),this.innerHTML='\n <div>\n <descope-text-field tabindex="1" type="tel" bordered="false"></descope-text-field>\n </div>\n ',this.textField=this.querySelector("descope-text-field")}get phoneNumberInputEle(){return this.textField.shadowRoot.querySelector("input")}get defaultDialCode(){return(0,l.Q)(this.getAttribute("default-code"))}get defaultCode(){return this.getAttribute("default-code")}get allowAlphanumericInput(){return"true"===this.getAttribute("allow-alphanumeric-input")}get minLength(){return parseInt(this.getAttribute("minlength"),10)||0}get maxLength(){return parseInt(this.getAttribute("maxlength"),10)||50}get restrictCountries(){return this.getAttribute("restrict-countries")?.split(",").filter(Boolean)||[]}get isFormatValue(){return"true"===this.getAttribute("format-value")}get isStrictValidation(){return"true"===this.getAttribute("strict-validation")}get value(){if(!this.textField.value)return"";if(!this.isStrictValidation)return this.#r();const e=this.#o();return e?.country&&e?.countryCallingCode&&e?.nationalNumber?`+${[e?.countryCallingCode,e?.nationalNumber].join("-")}`:this.textField.value}set value(e){this.textField.value=e}init(){this.addEventListener("focus",e=>{e.isTrusted&&this.textField.focus()}),super.init?.(),this.textField.addEventListener("input",this.#s.bind(this)),this.handleFocusEventsDispatching([this.textField]),(0,n.EA)(this.textField,this,{includeAttrs:["has-value"]}),(0,n.EA)(this,this.textField,{includeAttrs:["phone-input-type"],mapAttrs:{"phone-input-type":"type"}})}getValidity(){const e=/^\+?\d{1,4}-?(?:\d-?){1,15}$/,t=this.#a(this.textField.value||"");if(this.isRequired&&!this.textField.value)return{valueMissing:!0};if(this.textField.value){if(t.length<this.minLength)return{tooShort:!0};if(this.isStrictValidation&&this.textField.value&&!this.#l()||!this.isStrictValidation&&this.textField.value&&!e.test(this.value))return{patternMismatch:!0}}return{}}setSelectionRange(...e){this.textField.setSelectionRange(...e)}attributeChangedCallback(e,t,i){if(super.attributeChangedCallback(e,t,i),t!==i&&u.includes(e)){const t=d[e]||e;this.textField.setAttribute(t,i)}}#s(e){let t=this.#p(e.target.value);this.isFormatValue&&this.#u(t)&&(t=this.#d(t)),e.target.value=t}#r(){if(!this.defaultDialCode)return this.textField.value;const e=this.#h(this.textField.value),t=this.#a(e);return[this.defaultDialCode,t].join("-")}#o(){return this.defaultDialCode?(0,r.l)([this.defaultDialCode,this.#a(this.textField.value)].filter(Boolean).join("")):(0,r.l)(this.textField.value)}#a(e){return e.replace(/\D/g,"")}#h(e){if("+"===this.textField.value?.[0]){const t=new RegExp(`^\\${this.defaultDialCode}`);return e.replace(t,"")}return e}#l(){const e=(0,r.l)(this.value);return!(!e||!e.isValid?.()||!e.country||!this.#c(e.country)||this.defaultCode&&this.defaultCode!==e.country)}#c(e){return!this.restrictCountries.length||this.restrictCountries.includes(e)}#p(e){if(e=e.replace(/^-+/,"").replace(/(?!^)\+/g,"").replace("--","-").replace("+-","+"),!this.allowAlphanumericInput){const t=/^[+\d-\(\)]+$/;e=e.split("").filter(e=>t.test(e)).join("")}return e}#d(e=""){const t=this.defaultCode||this.#m(e);return t?(this.#n&&this.#n.country===t||(this.#n=new o.Q(t)),this.#n.reset(),this.#n.input(e)||e):e}#m(e){const t=(0,r.l)(e);return t?.country||""}#u(e){return!!(0,l.W)(e)}}},78343(e,t,i){i.r(t),i(64014);var n=i(9035);customElements.define(n.T,n.A)},30057(e,t,i){i.r(t),i.d(t,{PhoneFieldInputBoxClass:()=>n.Ul,componentName:()=>n.TQ}),i(78343),i(64014);var n=i(16306);customElements.define(n.TQ,n.Ul)},92259(e,t,i){i.d(t,{Q:()=>r,W:()=>o});var n=i(51680);const r=e=>n.A.find(t=>t.code===e)?.dialCode,o=e=>{const t=e.match(/\(/g),i=e.match(/\)/g);return t?.length===i?.length}}}]);
|
|
20
20
|
//# sourceMappingURL=descope-hybrid-field-index-js.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"descope-hybrid-field-index-js.js","mappings":"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","sources":["webpack://@descope/web-components-ui/../../../node_modules/@vaadin/email-field/theme/lumo/vaadin-email-field-styles.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/email-field/src/vaadin-email-field-styles.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/email-field/src/vaadin-email-field.js","webpack://@descope/web-components-ui/./src/components/descope-email-field/EmailFieldClass.js","webpack://@descope/web-components-ui/./src/components/descope-email-field/index.js","webpack://@descope/web-components-ui/./src/components/descope-hybrid-field/helpers.js","webpack://@descope/web-components-ui/./src/components/descope-hybrid-field/HybridFieldClass.js","webpack://@descope/web-components-ui/./src/components/descope-hybrid-field/index.js","webpack://@descope/web-components-ui/./src/components/phone-fields/descope-phone-input-box-field/PhoneFieldInputBoxClass.js","webpack://@descope/web-components-ui/./src/components/phone-fields/descope-phone-input-box-field/descope-phone-input-box-internal/PhoneFieldInternalInputBox.js","webpack://@descope/web-components-ui/./src/components/phone-fields/descope-phone-input-box-field/descope-phone-input-box-internal/index.js","webpack://@descope/web-components-ui/./src/components/phone-fields/descope-phone-input-box-field/index.js","webpack://@descope/web-components-ui/./src/components/phone-fields/helpers.js"],"sourcesContent":["/**\n * @license\n * Copyright (c) 2021 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { inputFieldShared } from '@vaadin/vaadin-lumo-styles/mixins/input-field-shared.js';\nimport { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\n\nconst emailField = css`\n :host([dir='rtl']) [part='input-field'] ::slotted(input) {\n --_lumo-text-field-overflow-mask-image: linear-gradient(to left, transparent, #000 1.25em);\n }\n\n :host([dir='rtl']) [part='input-field'] ::slotted(input:placeholder-shown) {\n --_lumo-text-field-overflow-mask-image: none;\n }\n`;\n\nregisterStyles('vaadin-email-field', [inputFieldShared, emailField], {\n moduleId: 'lumo-email-field',\n});\n","/**\n * @license\n * Copyright (c) 2021 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { css } from 'lit';\n\n// See https://github.com/vaadin/vaadin-text-field/issues/466\nexport const emailFieldStyles = css`\n :host([dir='rtl']) [part='input-field'] {\n direction: ltr;\n }\n\n :host([dir='rtl']) [part='input-field'] ::slotted(input)::placeholder {\n direction: rtl;\n text-align: left;\n }\n`;\n","/**\n * @license\n * Copyright (c) 2021 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { TextField } from '@vaadin/text-field/src/vaadin-text-field.js';\nimport { registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { emailFieldStyles } from './vaadin-email-field-styles.js';\n\nregisterStyles('vaadin-email-field', emailFieldStyles, { moduleId: 'vaadin-email-field-styles' });\n\n/**\n * `<vaadin-email-field>` is a Web Component for email field control in forms.\n *\n * ```html\n * <vaadin-email-field label=\"Email\"></vaadin-email-field>\n * ```\n *\n * ### Styling\n *\n * `<vaadin-email-field>` provides the same set of shadow DOM parts and state attributes as `<vaadin-text-field>`.\n * See [`<vaadin-text-field>`](#/elements/vaadin-text-field) for the styling documentation.\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @fires {Event} input - Fired when the value is changed by the user: on every typing keystroke, and the value is cleared using the clear button.\n * @fires {Event} change - Fired when the user commits a value change.\n * @fires {CustomEvent} invalid-changed - Fired when the `invalid` property changes.\n * @fires {CustomEvent} value-changed - Fired when the `value` property changes.\n * @fires {CustomEvent} validated - Fired whenever the field is validated.\n *\n * @customElement\n * @extends TextField\n */\nexport class EmailField extends TextField {\n static get is() {\n return 'vaadin-email-field';\n }\n\n constructor() {\n super();\n this._setType('email');\n this.pattern = '^([a-zA-Z0-9_\\\\.\\\\-+])+@[a-zA-Z0-9\\\\-.]+\\\\.[a-zA-Z0-9\\\\-]{2,}$';\n }\n\n /** @protected */\n ready() {\n super.ready();\n\n if (this.inputElement) {\n this.inputElement.autocapitalize = 'off';\n }\n }\n}\n\ndefineCustomElement(EmailField);\n","import textFieldMappings from '@descope-ui/descope-text-field/mappings';\nimport {\n createStyleMixin,\n draggableMixin,\n createProxy,\n proxyInputMixin,\n componentNameValidationMixin,\n externalInputMixin,\n} from '../../mixins';\nimport { compose } from '../../helpers';\nimport { getComponentName } from '../../helpers/componentHelpers';\nimport {\n inputFloatingLabelStyle,\n resetInputLabelPosition,\n resetInputOverrides,\n useHostExternalPadding,\n} from '../../helpers/themeHelpers/resetHelpers';\n\nexport const componentName = getComponentName('email-field');\n\nconst defaultPattern = \"^[\\\\w\\\\.\\\\%\\\\+\\\\-']+@[\\\\w\\\\.\\\\-]+\\\\.[A-Za-z]{2,}$\";\nconst defaultAutocomplete = 'username';\n\nconst customMixin = (superclass) =>\n class EmailFieldMixinClass extends superclass {\n init() {\n super.init?.();\n\n // we need to set the pattern on the base element because vaadin-email-field is overriding it\n this.baseElement.setAttribute('pattern', defaultPattern);\n\n if (!this.getAttribute('autocomplete')) {\n this.setAttribute('autocomplete', defaultAutocomplete);\n }\n\n this.createExternalInput();\n }\n };\n\nexport const EmailFieldClass = compose(\n createStyleMixin({\n mappings: textFieldMappings,\n }),\n draggableMixin,\n externalInputMixin({\n inputType: 'email',\n inputName: 'email',\n autocompleteType: 'username',\n includeAttrs: ['disabled', 'readonly', 'pattern'],\n }),\n proxyInputMixin({ proxyProps: ['value', 'selectionStart'], useProxyTargets: true }),\n componentNameValidationMixin,\n customMixin\n)(\n createProxy({\n slots: ['', 'suffix'],\n wrappedEleName: 'vaadin-email-field',\n style: () => `\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tpadding: calc(var(${EmailFieldClass.cssVarList.inputOutlineWidth}) + var(${\n EmailFieldClass.cssVarList.inputOutlineOffset\n }));\n box-sizing: border-box;\n\t\t\t}\n ${resetInputLabelPosition('vaadin-email-field')}\n\t\t\t${useHostExternalPadding(EmailFieldClass.cssVarList)}\n\t\t\t${resetInputOverrides('vaadin-email-field', EmailFieldClass.cssVarList)}\n ${inputFloatingLabelStyle()}\n\n vaadin-email-field[label-type=\"floating\"]:not([focused])[readonly] > input:placeholder-shown {\n opacity: 0;\n }\n vaadin-email-field[label-type=\"floating\"]:not([focused])[disabled] > input:placeholder-shown {\n opacity: 0;\n }\n\n :host ::slotted(*) {\n -webkit-mask-image: none;\n }\n\n vaadin-email-field[external-input=\"true\"] > input:not(:placeholder-shown) {\n opacity: 0;\n }\n\t\t`,\n excludeAttrsSync: ['tabindex', 'style'],\n componentName,\n })\n);\n","import '@vaadin/email-field';\nimport { componentName, EmailFieldClass } from './EmailFieldClass';\n\ncustomElements.define(componentName, EmailFieldClass);\n\nexport { EmailFieldClass, componentName };\n","// Matches any character that is not a digit, whitespace, or phone formatting character (+, -, (, ))\nconst INVALID_PHONE_CHARS_RE = /[^\\d\\s+\\-()]/;\n\nexport const isNumericValue = (val) => !!val && !INVALID_PHONE_CHARS_RE.test(val);\n\nexport const sanitizeCountryCodePrefix = (val) => val.replace(/\\+\\d+-/, '');\n","import { injectStyle } from '@descope-ui/common/components-helpers';\nimport { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../mixins';\nimport { createBaseClass } from '../../baseClasses/createBaseClass';\nimport { compose } from '../../helpers';\nimport { forwardAttrs, getComponentName } from '../../helpers/componentHelpers';\nimport { isNumericValue, sanitizeCountryCodePrefix as sanitizeValue } from './helpers';\nimport { PhoneFieldClass } from '../phone-fields/descope-phone-field/PhoneFieldClass';\nimport { PhoneFieldInputBoxClass } from '../phone-fields/descope-phone-input-box-field/PhoneFieldInputBoxClass';\n\nexport const componentName = getComponentName('hybrid-field');\n\nconst attrs = {\n shared: [\n 'label',\n 'bordered',\n 'full-width',\n 'label-type',\n 'size',\n 'disabled',\n 'readonly',\n 'required',\n 'st-host-direction',\n 'st-error-message-icon',\n 'st-error-message-icon-size',\n 'st-error-message-icon-padding',\n ],\n email: [\n 'placeholder',\n 'data-errormessage-value-missing-email',\n 'data-errormessage-pattern-mismatch-email',\n 'external-input',\n ],\n phone: {\n countryCode: [\n 'phone-input-label',\n 'country-input-label',\n 'country-input-placeholder',\n 'restrict-countries',\n 'default-code',\n 'phone-minlength',\n 'phone-format-value',\n 'phone-strict-validation',\n 'phone-input-type',\n 'data-errormessage-value-missing-phone',\n ],\n inputBox: [\n 'restrict-countries',\n 'default-code',\n 'phone-minlength',\n 'phone-format-value',\n 'phone-strict-validation',\n 'phone-input-type',\n 'data-errormessage-value-missing-phone',\n ],\n },\n};\n\nconst attrMap = {\n email: {\n 'data-errormessage-value-missing-email': 'data-errormessage-value-missing',\n 'data-errormessage-pattern-mismatch-email': 'data-errormessage-pattern-mismatch',\n },\n phone: {\n 'phone-input-label': 'label',\n 'phone-minlength': 'minlength',\n 'phone-format-value': 'format-value',\n 'phone-strict-validation': 'strict-validation',\n 'data-errormessage-value-missing-phone': 'data-errormessage-value-missing',\n },\n};\n\nconst EMAIL_FIELD = 'descope-email-field';\nconst PHONE_FIELD = 'descope-phone-field';\nconst PHONE_INPUT_BOX_FIELD = 'descope-phone-input-box-field';\n\nconst BaseClass = createBaseClass({\n componentName,\n baseSelector: 'div',\n});\n\nclass RawHybridField extends BaseClass {\n #isReportedValidity = false;\n\n #selectionStart;\n\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\n <div class=\"wrapper\">\n <descope-email-field external-input=\"${this.isExternalInput}\"></descope-email-field>\n <descope-phone-field allow-alphanumeric-input=\"true\" phone-input-type=\"text\"></descope-phone-field>\n <descope-phone-input-box-field allow-alphanumeric-input=\"true\" phone-input-type=\"text\"></descope-phone-input-box-field>\n </div>\n\t\t`;\n\n injectStyle(\n `\n :host {\n display: inline-flex;\n box-sizing: border-box;\n padding: 0;\n gap: 0;\n }\n .wrapper {\n display: grid;\n width: 100%;\n }\n descope-email-field,\n descope-phone-field,\n descope-phone-input-box-field {\n grid-area: 1/1;\n width: 100%;\n height: 100%;\n }\n .hidden {\n visibility: hidden;\n }\n `,\n this\n );\n }\n\n get isExternalInput() {\n return this.getAttribute('external-input') === 'true';\n }\n\n get emailInputEle() {\n return this.isExternalInput ? this.emailInput.externalInput : this.emailInput.inputElement;\n }\n\n get phoneVariant() {\n const isInputBox = this.getAttribute('phone-variant') === 'inputBox';\n return isInputBox ? this.phoneInputBoxInput : this.phoneCountryCodeInput;\n }\n\n get defaultCode() {\n const firstItem = this.phoneCountryCodeInput.countryCodes?.[0] || '';\n return this.getAttribute('default-code') || firstItem;\n }\n\n get activeInputEle() {\n if (this.activeInput === this.emailInput) {\n return this.emailInputEle;\n }\n return this.phoneVariant.phoneNumberInputEle;\n }\n\n get value() {\n return this.activeInput?.value || '';\n }\n\n set value(val) {\n this.handleActiveInput(val);\n setTimeout(() => {\n this.activeInput.value = val;\n });\n }\n\n async init() {\n super.init?.();\n\n this.initInputs();\n this.updateAttrs();\n this.toggleInputVisibility();\n\n await this.waitForInputs();\n\n this.initInputEles();\n this.overrideEmailInputType();\n this.overrideEmailSetAttribute();\n }\n\n waitForInputs() {\n return new Promise((resolve) => {\n const check = setInterval(() => {\n if (this.emailInputEle) {\n clearInterval(check);\n resolve();\n }\n });\n });\n }\n\n initInputs() {\n this.emailInput = this.shadowRoot.querySelector(EMAIL_FIELD);\n this.phoneCountryCodeInput = this.shadowRoot.querySelector(PHONE_FIELD);\n this.phoneInputBoxInput = this.shadowRoot.querySelector(PHONE_INPUT_BOX_FIELD);\n\n this.inputs = [this.emailInput, this.phoneCountryCodeInput, this.phoneInputBoxInput];\n\n this.activeInput = this.emailInput;\n }\n\n // we need to listen on the inner `input` element itself, otherwise we don't always get an `input` event\n initInputEles() {\n const inputEles = [\n this.emailInputEle,\n this.phoneCountryCodeInput.phoneNumberInputEle,\n this.phoneInputBoxInput.phoneNumberInputEle,\n ];\n\n inputEles.forEach((ele) => {\n ele.addEventListener('input', this.onValueChange.bind(this));\n });\n }\n\n overrideEmailInputType() {\n this.emailInputEle.addEventListener('focus', () => {\n this.emailInputEle.setAttribute('type', 'text');\n });\n this.emailInputEle.addEventListener('blur', () => {\n setTimeout(() => {\n this.emailInputEle.setAttribute('type', 'email');\n });\n });\n }\n\n // We want to prevent Vaadin from changing the input type to `email`\n // otherwise, we cannot get the selectionStart from the input.\n overrideEmailSetAttribute() {\n const origEmailSetAttr = this.emailInput.setAttribute.bind(this.emailInputEle);\n this.emailInputEle.setAttribute = (name, value) => {\n if (name !== 'type' || value !== 'email' || !this.emailInput.hasAttribute('focused')) {\n return origEmailSetAttr(name, value);\n }\n return false;\n };\n }\n\n updateAttrs() {\n forwardAttrs(this, this.emailInput, { includeAttrs: attrs.email, mapAttrs: attrMap.email });\n\n forwardAttrs(this, this.phoneCountryCodeInput, {\n includeAttrs: attrs.phone.countryCode,\n mapAttrs: attrMap.phone,\n });\n\n forwardAttrs(this, this.phoneInputBoxInput, {\n includeAttrs: attrs.phone.inputBox,\n mapAttrs: attrMap.phone,\n });\n\n this.inputs.forEach((input) => forwardAttrs(this, input, { includeAttrs: attrs.shared }));\n\n setTimeout(() => this.phoneCountryCodeInput.setAttribute('default-code', this.defaultCode));\n }\n\n onValueChange() {\n this.#selectionStart = this.activeInputEle.selectionStart;\n // phone components expose an API to their inputElement; in case of phone variants like\n // phone-input-box-field, we want to make sure that the value being passed\n // is raw value from input, and not the value with a dial-code prefix, or other decorations\n // applied behind the scenes by the phone components\n this.handleActiveInput(this.activeInputEle.value || this.activeInput.value);\n }\n\n handleActiveInput(val) {\n const expectedActiveInput = isNumericValue(val) ? this.phoneVariant : this.emailInput;\n\n if (this.activeInput !== expectedActiveInput) {\n this.setActiveInput(expectedActiveInput);\n }\n }\n\n setActiveInput(expectedActiveInput) {\n // phone components expose an API to their inputElement; in case of phone variants like\n // phone-input-box-field, we want to make sure that the value being passed\n // is raw value from input, and not the value with a dial-code prefix, or other decorations\n // applied behind the scenes by the phone components\n const val = this.activeInputEle.value || this.activeInput.value;\n\n this.activeInput = expectedActiveInput;\n this.setActiveInputValue(val);\n if (this.#isReportedValidity) this.activeInput.reportValidity();\n this.setActiveInputSelectionStart();\n this.toggleInputVisibility();\n }\n\n setActiveInputSelectionStart() {\n setTimeout(() => {\n this.activeInputEle.focus();\n this.activeInputEle.setSelectionRange?.(this.#selectionStart, this.#selectionStart);\n });\n }\n\n #getDefaultDialCode() {\n const code = this.getAttribute('default-code');\n const match = code && PhoneFieldClass.CountryCodes.find((c) => c.code === code);\n return match?.dialCode || PhoneFieldClass.CountryCodes[0]?.dialCode || '';\n }\n\n setActiveInputValue(val) {\n const sanitizedVal = sanitizeValue(val);\n const isPhoneField = this.activeInput.localName === PHONE_FIELD;\n if (isPhoneField) {\n const dialCode = this.phoneCountryCodeInput.countryCodeItems || this.#getDefaultDialCode();\n this.activeInput.value = `${dialCode}-${sanitizedVal}`;\n } else {\n this.activeInput.value = sanitizedVal;\n }\n }\n\n toggleInputVisibility() {\n this.inputs.forEach((input) => {\n input !== this.activeInput ? input.classList.add('hidden') : input.classList.remove('hidden');\n });\n }\n\n reportValidity() {\n this.#isReportedValidity = true;\n\n const ele = this.activeInputEle;\n\n // On reportValidity we want to set the caret at the end of the input value.\n // Since checkValidity triggers `focus` on the input, it sets the caret at the start of the input,\n // regardless the existing value.\n const origInputType = ele.type;\n ele.setAttribute('type', 'text');\n setTimeout(() => {\n ele.setSelectionRange?.(ele.value.length, ele.value.length);\n ele.setAttribute('type', origInputType);\n });\n\n return this.activeInput.reportValidity();\n }\n\n checkValidity() {\n return this.activeInput.checkValidity();\n }\n}\n\nexport const HybridFieldClass = compose(\n createStyleMixin({ componentNameOverride: getComponentName('input-wrapper') }),\n createStyleMixin({\n mappings: {\n hostWidth: { selector: () => ':host', property: 'width' },\n hostDirection: [\n { selector: () => 'descope-email-field', property: 'direction' },\n { selector: () => 'descope-phone-field', property: 'direction' },\n { selector: () => 'descope-phone-input-box-field', property: 'direction' },\n ],\n errorMessageIcon: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.errorMessageIcon,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.errorMessageIcon,\n },\n ],\n errorMessageIconSize: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.errorMessageIconSize,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.errorMessageIconSize,\n },\n ],\n errorMessageIconPadding: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.errorMessageIconPadding,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.errorMessageIconPadding,\n },\n ],\n errorMessageIconRepeat: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.errorMessageIconRepeat,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.errorMessageIconRepeat,\n },\n ],\n errorMessageIconPosition: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.errorMessageIconPosition,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.errorMessageIconPosition,\n },\n ],\n errorMessageFontSize: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.errorMessageFontSize,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.errorMessageFontSize,\n },\n ],\n labelFontWeight: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.labelFontWeight,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.labelFontWeight,\n },\n ],\n inputValueFontWeight: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.inputValueFontWeight,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.inputValueFontWeight,\n },\n ],\n inputPlaceholderFontWeight: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.inputPlaceholderFontWeight,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.inputPlaceholderFontWeight,\n },\n ],\n helperTextFontWeight: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.helperTextFontWeight,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.helperTextFontWeight,\n },\n ],\n errorMessageFontWeight: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.errorMessageFontWeight,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.errorMessageFontWeight,\n },\n ],\n },\n }),\n draggableMixin,\n componentNameValidationMixin\n)(RawHybridField);\n","import '../descope-email-field';\nimport '../phone-fields/descope-phone-field';\nimport '../phone-fields/descope-phone-input-box-field';\n\nimport { componentName, HybridFieldClass } from './HybridFieldClass';\n\ncustomElements.define(componentName, HybridFieldClass);\n\nexport { HybridFieldClass, componentName };\n","import { syncAttrs } from '@descope-ui/common/components-helpers';\nimport { TextFieldClass } from '@descope-ui/descope-text-field/class';\nimport { componentName as descopeInternalComponentName } from './descope-phone-input-box-internal/PhoneFieldInternalInputBox';\nimport { forwardAttrs, getComponentName } from '../../../helpers/componentHelpers';\nimport { compose } from '../../../helpers';\nimport {\n createProxy,\n createStyleMixin,\n draggableMixin,\n inputOverrideValidConstraintsMixin,\n proxyInputMixin,\n} from '../../../mixins';\nimport CountryCodes from '../CountryCodes';\nimport {\n resetInputLabelPosition,\n resetInputCursor,\n resetInputFieldDefaultWidth,\n resetInputFieldInvalidBackgroundColor,\n useHostExternalPadding,\n inputFloatingLabelStyle,\n} from '../../../helpers/themeHelpers/resetHelpers';\n\nconst textVars = TextFieldClass.cssVarList;\n\nexport const componentName = getComponentName('phone-input-box-field');\n\nconst customMixin = (superclass) =>\n class PhoneFieldInputBoxMixinClass extends superclass {\n static get CountryCodes() {\n return CountryCodes;\n }\n\n init() {\n super.init?.();\n\n const template = document.createElement('template');\n\n template.innerHTML = `\n\t\t\t\t<${descopeInternalComponentName}\n\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\tslot=\"input\"\n\t\t\t\t></${descopeInternalComponentName}>\n `;\n\n this.baseElement.appendChild(template.content.cloneNode(true));\n\n this.inputElement = this.shadowRoot.querySelector(descopeInternalComponentName);\n\n syncAttrs(this, this.inputElement, { includeAttrs: ['has-value'] });\n\n forwardAttrs(this.shadowRoot.host, this.inputElement, {\n includeAttrs: [\n 'size',\n 'minlength',\n 'maxlength',\n 'default-code',\n 'disabled',\n 'phone-input-placeholder',\n 'label',\n 'label-type',\n 'allow-alphanumeric-input',\n 'restrict-countries',\n 'format-value',\n 'strict-validation',\n 'data-errormessage-type-mismatch',\n 'phone-input-type',\n ],\n });\n }\n\n get phoneNumberInputEle() {\n return this.inputElement?.phoneNumberInputEle;\n }\n };\n\nconst {\n host,\n label,\n inputElement,\n requiredIndicator,\n inputField,\n internalComponent,\n internalComponentAfter,\n phoneInput,\n errorMessage,\n helperText,\n} = {\n host: { selector: () => ':host' },\n label: { selector: '::part(label)' },\n placeholder: { selector: '> input:placeholder-shown' },\n inputElement: { selector: 'input' },\n requiredIndicator: { selector: '[required]::part(required-indicator)::after' },\n inputField: { selector: () => 'vaadin-text-field::part(input-field)' },\n internalComponent: {\n selector: 'descope-phone-field-internal-input-box',\n },\n internalComponentAfter: {\n selector: 'descope-phone-field-internal-input-box::after',\n },\n phoneInput: { selector: () => 'descope-text-field' },\n helperText: { selector: '::part(helper-text)' },\n errorMessage: { selector: '::part(error-message)' },\n};\n\nexport const PhoneFieldInputBoxClass = compose(\n createStyleMixin({\n mappings: {\n fontSize: [\n host,\n inputField,\n {\n selector: TextFieldClass.componentName,\n property: TextFieldClass.cssVarList.fontSize,\n },\n ],\n fontFamily: [label, errorMessage, helperText],\n hostWidth: { ...host, property: 'width' },\n hostMinWidth: { ...host, property: 'min-width' },\n hostDirection: { ...host, property: 'direction' },\n\n inputHorizontalPadding: [\n { ...phoneInput, property: 'padding-left' },\n { ...phoneInput, property: 'padding-right' },\n ],\n\n labelFontSize: { ...label, property: 'font-size' },\n labelFontWeight: { ...label, property: 'font-weight' },\n inputValueFontWeight: { ...phoneInput, property: textVars.inputValueFontWeight },\n inputPlaceholderFontWeight: { ...phoneInput, property: textVars.inputPlaceholderFontWeight },\n helperTextFontWeight: { ...helperText, property: 'font-weight' },\n errorMessageFontWeight: { ...errorMessage, property: 'font-weight' },\n labelTextColor: [\n { ...label, property: 'color' },\n { ...label, property: '-webkit-text-fill-color' },\n { ...requiredIndicator, property: 'color' },\n ],\n labelRequiredIndicator: { ...requiredIndicator, property: 'content' },\n errorMessageTextColor: { ...errorMessage, property: 'color' },\n\n errorMessageIcon: { ...errorMessage, property: 'background-image' },\n errorMessageIconSize: { ...errorMessage, property: 'background-size' },\n errorMessageIconPadding: { ...errorMessage, property: 'padding-inline-start' },\n errorMessageIconRepeat: { ...errorMessage, property: 'background-repeat' },\n errorMessageIconPosition: { ...errorMessage, property: 'background-position' },\n errorMessageFontSize: { ...errorMessage, property: 'font-size' },\n\n inputValueTextColor: { ...phoneInput, property: textVars.inputValueTextColor },\n\n inputPlaceholderTextColor: { ...phoneInput, property: textVars.inputPlaceholderColor },\n\n inputBorderStyle: { ...internalComponentAfter, property: 'border-style' },\n inputBorderWidth: { ...internalComponentAfter, property: 'border-width' },\n inputBorderColor: { ...internalComponentAfter, property: 'border-color' },\n inputBorderRadius: [\n { ...internalComponent, property: 'border-radius' },\n { ...internalComponentAfter, property: 'border-radius' },\n ],\n\n inputOutlineStyle: { ...internalComponent, property: 'outline-style' },\n inputOutlineColor: { ...internalComponent, property: 'outline-color' },\n inputOutlineWidth: { ...internalComponent, property: 'outline-width' },\n inputOutlineOffset: { ...internalComponent, property: 'outline-offset' },\n\n labelPosition: { ...label, property: 'position' },\n labelTopPosition: { ...label, property: 'top' },\n labelHorizontalPosition: [\n { ...label, property: 'left' },\n { ...label, property: 'right' },\n ],\n inputTransformY: { ...label, property: 'transform' },\n inputTransition: { ...label, property: 'transition' },\n marginInlineStart: { ...label, property: 'margin-inline-start' },\n valueInputHeight: { ...inputElement, property: 'height' },\n valueInputMarginBottom: {\n selector: TextFieldClass.componentName,\n property: textVars.valueInputMarginBottom,\n },\n },\n }),\n draggableMixin,\n inputOverrideValidConstraintsMixin,\n proxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),\n customMixin\n)(\n createProxy({\n slots: [],\n wrappedEleName: 'vaadin-text-field',\n style: () => `\n :host {\n display: inline-flex;\n max-width: 100%;\n box-sizing: border-box;\n }\n ${useHostExternalPadding(PhoneFieldInputBoxClass.cssVarList)}\n ${resetInputCursor('vaadin-text-field')}\n ${resetInputFieldInvalidBackgroundColor('vaadin-text-field')}\n ${resetInputFieldDefaultWidth()}\n\n vaadin-text-field {\n width: 100%;\n box-sizing: border-box;\n padding: 0;\n }\n vaadin-text-field[focus-ring]::part(input-field) {\n box-shadow: none;\n }\n vaadin-text-field::before {\n height: 0;\n }\n vaadin-text-field::part(input-field) {\n padding: 0;\n background: transparent;\n -webkit-mask-image: none;\n }\n descope-phone-field-internal-input-box {\n -webkit-mask-image: none;\n padding: 0;\n width: 100%;\n }\n descope-phone-field-internal-input-box > div {\n width: 100%;\n }\n descope-phone-field-internal-input-box descope-text-field {\n ${textVars.inputOutlineWidth}: 0;\n ${textVars.inputOutlineOffset}: 0;\n }\n descope-phone-field-internal-input-box::after {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n box-sizing: border-box;\n pointer-events: none;\n }\n descope-text-field {\n flex-grow: 1;\n width: 100%;\n direction: ltr;\n }\n vaadin-text-field[readonly] > input:placeholder-shown {\n opacity: 1;\n }\n vaadin-text-field::part(input-field)::after {\n border: none;\n }\n\n vaadin-text-field[label-type=\"floating\"]:not([focused])[readonly] input:placeholder-shown {\n opacity: 0;\n }\n vaadin-text-field[label-type=\"floating\"]:not([focused])[disabled] input:placeholder-shown {\n opacity: 0;\n }\n\n ${resetInputLabelPosition('vaadin-text-field')}\n ${inputFloatingLabelStyle()}\n\t\t`,\n excludeAttrsSync: ['tabindex', 'style'],\n componentName,\n })\n);\n\nexport default PhoneFieldInputBoxClass;\n","import { forwardAttrs } from '@descope-ui/common/components-helpers';\nimport parsePhoneNumberFromString, { AsYouType } from 'libphonenumber-js/min';\nimport { createBaseInputClass } from '../../../../baseClasses/createBaseInputClass';\nimport { getComponentName } from '../../../../helpers/componentHelpers';\nimport { getCountryByCodeId, matchingParenthesis } from '../../helpers';\n\nexport const componentName = getComponentName('phone-field-internal-input-box');\n\nconst observedAttributes = [\n 'disabled',\n 'size',\n 'readonly',\n 'phone-input-placeholder',\n 'name',\n 'maxlength',\n 'autocomplete',\n 'label-type',\n 'phone-input-type',\n];\nconst mapAttrs = {\n 'phone-input-placeholder': 'placeholder',\n 'phone-input-type': 'type',\n};\n\nconst BaseInputClass = createBaseInputClass({ componentName, baseSelector: 'div' });\n\nclass PhoneFieldInternal extends BaseInputClass {\n static get observedAttributes() {\n return [].concat(BaseInputClass.observedAttributes || [], observedAttributes);\n }\n\n #ayt;\n\n constructor() {\n super();\n\n this.innerHTML = `\n <div>\n <descope-text-field tabindex=\"1\" type=\"tel\" bordered=\"false\"></descope-text-field>\n </div>\n `;\n\n this.textField = this.querySelector('descope-text-field');\n }\n\n // notice: this function is exposed in parent component\n get phoneNumberInputEle() {\n return this.textField.shadowRoot.querySelector('input');\n }\n\n get defaultDialCode() {\n return getCountryByCodeId(this.getAttribute('default-code'));\n }\n\n get defaultCode() {\n return this.getAttribute('default-code');\n }\n\n get allowAlphanumericInput() {\n return this.getAttribute('allow-alphanumeric-input') === 'true';\n }\n\n get minLength() {\n return parseInt(this.getAttribute('minlength'), 10) || 0;\n }\n\n get maxLength() {\n return parseInt(this.getAttribute('maxlength'), 10) || 50;\n }\n\n get restrictCountries() {\n return this.getAttribute('restrict-countries')?.split(',').filter(Boolean) || [];\n }\n\n get isFormatValue() {\n return this.getAttribute('format-value') === 'true';\n }\n\n get isStrictValidation() {\n return this.getAttribute('strict-validation') === 'true';\n }\n\n get value() {\n if (!this.textField.value) return '';\n\n if (!this.isStrictValidation) {\n return this.#nonParsedValue();\n }\n\n const parsedVal = this.#parseWithCountryCode();\n\n if (parsedVal?.country && parsedVal?.countryCallingCode && parsedVal?.nationalNumber) {\n return `+${[parsedVal?.countryCallingCode, parsedVal?.nationalNumber].join('-')}`;\n }\n\n // if failed to parse or to find country code return text field value\n return this.textField.value;\n }\n\n set value(val) {\n this.textField.value = val;\n }\n\n init() {\n this.addEventListener('focus', (e) => {\n // We want to ignore focus events we are dispatching\n if (e.isTrusted) this.textField.focus();\n });\n\n super.init?.();\n\n this.textField.addEventListener('input', this.#onInput.bind(this));\n this.handleFocusEventsDispatching([this.textField]);\n\n forwardAttrs(this.textField, this, { includeAttrs: ['has-value'] });\n\n forwardAttrs(this, this.textField, {\n includeAttrs: ['phone-input-type'],\n mapAttrs: { 'phone-input-type': 'type' },\n });\n }\n\n getValidity() {\n const validPhonePattern = /^\\+?\\d{1,4}-?(?:\\d-?){1,15}$/;\n const stripValue = this.#sanitizeVal(this.textField.value || '');\n\n if (this.isRequired && !this.textField.value) {\n return { valueMissing: true };\n }\n\n if (this.textField.value) {\n if (stripValue.length < this.minLength) {\n return { tooShort: true };\n }\n\n if (\n // has `strict-validation` and not properly parsed\n (this.isStrictValidation && this.textField.value && !this.#isValidParsedValue()) ||\n // if no `strict-validation` then conform with naive pattern\n (!this.isStrictValidation && this.textField.value && !validPhonePattern.test(this.value))\n ) {\n return { patternMismatch: true };\n }\n }\n\n return {};\n }\n\n setSelectionRange(...args) {\n this.textField.setSelectionRange(...args);\n }\n\n attributeChangedCallback(attrName, oldValue, newValue) {\n super.attributeChangedCallback(attrName, oldValue, newValue);\n\n if (oldValue !== newValue && observedAttributes.includes(attrName)) {\n const attr = mapAttrs[attrName] || attrName;\n this.textField.setAttribute(attr, newValue);\n }\n }\n\n #onInput(e) {\n let sanitizedInput = this.#sanitizeInput(e.target.value);\n\n if (this.isFormatValue && this.#canFormat(sanitizedInput)) {\n sanitizedInput = this.#formatPhoneNumber(sanitizedInput);\n }\n\n e.target.value = sanitizedInput;\n }\n\n #nonParsedValue() {\n if (!this.defaultDialCode) {\n return this.textField.value;\n }\n\n const nationalNumber = this.#trimDuplicateCountryCode(this.textField.value);\n const sanitizedVal = this.#sanitizeVal(nationalNumber);\n\n return [this.defaultDialCode, sanitizedVal].join('-');\n }\n\n #parseWithCountryCode() {\n if (this.defaultDialCode) {\n return parsePhoneNumberFromString(\n [this.defaultDialCode, this.#sanitizeVal(this.textField.value)].filter(Boolean).join('')\n );\n }\n\n // if default-code or not parsed - try to extract country code from value\n return parsePhoneNumberFromString(this.textField.value);\n }\n\n #sanitizeVal(val) {\n return val.replace(/\\D/g, '');\n }\n\n #trimDuplicateCountryCode(val) {\n if (this.textField.value?.[0] === '+') {\n const dialCodePrefixPattern = new RegExp(`^\\\\${this.defaultDialCode}`);\n const trimmed = val.replace(dialCodePrefixPattern, '');\n return trimmed;\n }\n return val;\n }\n\n #isValidParsedValue() {\n const parsed = parsePhoneNumberFromString(this.value);\n return (\n !!parsed && // parsed successfully (not undefined)\n !!parsed.isValid?.() && // Parsed object is valid\n !!parsed.country && // Parsed object with a country code\n !!this.#isAllowedCountry(parsed.country) && // Parsed with allowed country code\n (this.defaultCode ? this.defaultCode === parsed.country : true) // In case default country code is set validate parsed country matches it\n );\n }\n\n #isAllowedCountry(countryCode) {\n if (!this.restrictCountries.length) {\n return true;\n }\n\n return this.restrictCountries.includes(countryCode);\n }\n\n #sanitizeInput(val) {\n val = val\n .replace(/^-+/, '') // dash as first char\n .replace(/(?!^)\\+/g, '') // multiple plus symbols\n .replace('--', '-') // consecutive dashes\n .replace('+-', '+'); // dash following plus symbol\n\n if (!this.allowAlphanumericInput) {\n const telDigitsRegExp = /^[+\\d-\\(\\)]+$/;\n val = val\n .split('')\n .filter((char) => telDigitsRegExp.test(char))\n .join('');\n }\n\n return val;\n }\n\n #formatPhoneNumber(phoneNumber = '') {\n // Get country code from `default-code or` from phone number\n const countryCode = this.defaultCode || this.#getCountryCodeFromValue(phoneNumber);\n\n // Skip formatting if no country code is available\n if (!countryCode) {\n return phoneNumber;\n }\n\n // Update AsYouType country code if needed\n if (!this.#ayt || this.#ayt.country !== countryCode) {\n this.#ayt = new AsYouType(countryCode);\n }\n\n // We need to reset AsYouType instance before setting new input\n this.#ayt.reset();\n\n // Set AsYouType input\n const formattedVal = this.#ayt.input(phoneNumber) || phoneNumber;\n\n return formattedVal;\n }\n\n #getCountryCodeFromValue(val) {\n const parsed = parsePhoneNumberFromString(val);\n return parsed?.country || '';\n }\n\n #canFormat(val) {\n if (!matchingParenthesis(val)) return false;\n return true;\n }\n}\n\nexport default PhoneFieldInternal;\n","import '@descope-ui/descope-text-field';\n\nimport PhoneFieldInternalInputBox, { componentName } from './PhoneFieldInternalInputBox';\n\ncustomElements.define(componentName, PhoneFieldInternalInputBox);\n","import './descope-phone-input-box-internal';\nimport '@descope-ui/descope-text-field';\n\nimport { componentName, PhoneFieldInputBoxClass } from './PhoneFieldInputBoxClass';\n\ncustomElements.define(componentName, PhoneFieldInputBoxClass);\n\nexport { PhoneFieldInputBoxClass, componentName };\n","import parsePhoneNumberFromString from 'libphonenumber-js/min';\nimport CountryCodes from './CountryCodes';\n\nexport const getCountryByCodeId = (countryCode) =>\n CountryCodes.find((c) => c.code === countryCode)?.dialCode;\n\nexport const matchingParenthesis = (val) => {\n const openParenMatches = val.match(/\\(/g);\n const closeParenMatches = val.match(/\\)/g);\n return openParenMatches?.length === closeParenMatches?.length;\n};\n"],"names":["emailField","moduleId","emailFieldStyles","EmailField","is","constructor","super","this","_setType","pattern","ready","inputElement","autocapitalize","componentName","EmailFieldClass","mappings","textFieldMappings","inputType","inputName","autocompleteType","includeAttrs","proxyProps","useProxyTargets","superclass","init","baseElement","setAttribute","getAttribute","createExternalInput","slots","wrappedEleName","style","cssVarList","inputOutlineWidth","inputOutlineOffset","excludeAttrsSync","customElements","define","INVALID_PHONE_CHARS_RE","attrs","shared","email","phone","countryCode","inputBox","attrMap","PHONE_FIELD","BaseClass","createBaseClass","baseSelector","HybridFieldClass","componentNameOverride","hostWidth","selector","property","hostDirection","errorMessageIcon","PhoneFieldClass","PhoneFieldInputBoxClass","errorMessageIconSize","errorMessageIconPadding","errorMessageIconRepeat","errorMessageIconPosition","errorMessageFontSize","labelFontWeight","inputValueFontWeight","inputPlaceholderFontWeight","helperTextFontWeight","errorMessageFontWeight","attachShadow","mode","innerHTML","isExternalInput","emailInputEle","emailInput","externalInput","phoneVariant","phoneInputBoxInput","phoneCountryCodeInput","defaultCode","firstItem","countryCodes","activeInputEle","activeInput","phoneNumberInputEle","value","val","handleActiveInput","setTimeout","initInputs","updateAttrs","toggleInputVisibility","waitForInputs","initInputEles","overrideEmailInputType","overrideEmailSetAttribute","Promise","resolve","check","setInterval","clearInterval","shadowRoot","querySelector","inputs","forEach","ele","addEventListener","onValueChange","bind","origEmailSetAttr","name","hasAttribute","mapAttrs","input","selectionStart","expectedActiveInput","test","isNumericValue","setActiveInput","setActiveInputValue","reportValidity","setActiveInputSelectionStart","focus","setSelectionRange","code","match","CountryCodes","find","c","dialCode","sanitizedVal","replace","localName","countryCodeItems","classList","add","remove","origInputType","type","length","checkValidity","textVars","host","label","requiredIndicator","inputField","internalComponent","internalComponentAfter","phoneInput","errorMessage","helperText","placeholder","fontSize","fontFamily","hostMinWidth","inputHorizontalPadding","labelFontSize","labelTextColor","labelRequiredIndicator","errorMessageTextColor","inputValueTextColor","inputPlaceholderTextColor","inputPlaceholderColor","inputBorderStyle","inputBorderWidth","inputBorderColor","inputBorderRadius","inputOutlineStyle","inputOutlineColor","labelPosition","labelTopPosition","labelHorizontalPosition","inputTransformY","inputTransition","marginInlineStart","valueInputHeight","valueInputMarginBottom","template","document","createElement","appendChild","content","cloneNode","observedAttributes","BaseInputClass","concat","textField","defaultDialCode","allowAlphanumericInput","minLength","parseInt","maxLength","restrictCountries","split","filter","Boolean","isFormatValue","isStrictValidation","parsedVal","country","countryCallingCode","nationalNumber","join","e","isTrusted","handleFocusEventsDispatching","getValidity","validPhonePattern","stripValue","isRequired","valueMissing","tooShort","patternMismatch","args","attributeChangedCallback","attrName","oldValue","newValue","includes","attr","sanitizedInput","target","dialCodePrefixPattern","RegExp","parsed","isValid","telDigitsRegExp","char","phoneNumber","reset","getCountryByCodeId","matchingParenthesis","openParenMatches","closeParenMatches"],"sourceRoot":""}
|
|
1
|
+
{"version":3,"file":"descope-hybrid-field-index-js.js","mappings":"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","sources":["webpack://@descope/web-components-ui/../../../node_modules/@vaadin/email-field/theme/lumo/vaadin-email-field-styles.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/email-field/src/vaadin-email-field-styles.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/email-field/src/vaadin-email-field.js","webpack://@descope/web-components-ui/./src/components/descope-email-field/EmailFieldClass.js","webpack://@descope/web-components-ui/./src/components/descope-email-field/index.js","webpack://@descope/web-components-ui/./src/components/descope-hybrid-field/helpers.js","webpack://@descope/web-components-ui/./src/components/descope-hybrid-field/HybridFieldClass.js","webpack://@descope/web-components-ui/./src/components/descope-hybrid-field/index.js","webpack://@descope/web-components-ui/./src/components/phone-fields/descope-phone-input-box-field/PhoneFieldInputBoxClass.js","webpack://@descope/web-components-ui/./src/components/phone-fields/descope-phone-input-box-field/descope-phone-input-box-internal/PhoneFieldInternalInputBox.js","webpack://@descope/web-components-ui/./src/components/phone-fields/descope-phone-input-box-field/descope-phone-input-box-internal/index.js","webpack://@descope/web-components-ui/./src/components/phone-fields/descope-phone-input-box-field/index.js","webpack://@descope/web-components-ui/./src/components/phone-fields/helpers.js"],"sourcesContent":["/**\n * @license\n * Copyright (c) 2021 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { inputFieldShared } from '@vaadin/vaadin-lumo-styles/mixins/input-field-shared.js';\nimport { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\n\nconst emailField = css`\n :host([dir='rtl']) [part='input-field'] ::slotted(input) {\n --_lumo-text-field-overflow-mask-image: linear-gradient(to left, transparent, #000 1.25em);\n }\n\n :host([dir='rtl']) [part='input-field'] ::slotted(input:placeholder-shown) {\n --_lumo-text-field-overflow-mask-image: none;\n }\n`;\n\nregisterStyles('vaadin-email-field', [inputFieldShared, emailField], {\n moduleId: 'lumo-email-field',\n});\n","/**\n * @license\n * Copyright (c) 2021 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { css } from 'lit';\n\n// See https://github.com/vaadin/vaadin-text-field/issues/466\nexport const emailFieldStyles = css`\n :host([dir='rtl']) [part='input-field'] {\n direction: ltr;\n }\n\n :host([dir='rtl']) [part='input-field'] ::slotted(input)::placeholder {\n direction: rtl;\n text-align: left;\n }\n`;\n","/**\n * @license\n * Copyright (c) 2021 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { TextField } from '@vaadin/text-field/src/vaadin-text-field.js';\nimport { registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { emailFieldStyles } from './vaadin-email-field-styles.js';\n\nregisterStyles('vaadin-email-field', emailFieldStyles, { moduleId: 'vaadin-email-field-styles' });\n\n/**\n * `<vaadin-email-field>` is a Web Component for email field control in forms.\n *\n * ```html\n * <vaadin-email-field label=\"Email\"></vaadin-email-field>\n * ```\n *\n * ### Styling\n *\n * `<vaadin-email-field>` provides the same set of shadow DOM parts and state attributes as `<vaadin-text-field>`.\n * See [`<vaadin-text-field>`](#/elements/vaadin-text-field) for the styling documentation.\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @fires {Event} input - Fired when the value is changed by the user: on every typing keystroke, and the value is cleared using the clear button.\n * @fires {Event} change - Fired when the user commits a value change.\n * @fires {CustomEvent} invalid-changed - Fired when the `invalid` property changes.\n * @fires {CustomEvent} value-changed - Fired when the `value` property changes.\n * @fires {CustomEvent} validated - Fired whenever the field is validated.\n *\n * @customElement\n * @extends TextField\n */\nexport class EmailField extends TextField {\n static get is() {\n return 'vaadin-email-field';\n }\n\n constructor() {\n super();\n this._setType('email');\n this.pattern = '^([a-zA-Z0-9_\\\\.\\\\-+])+@[a-zA-Z0-9\\\\-.]+\\\\.[a-zA-Z0-9\\\\-]{2,}$';\n }\n\n /** @protected */\n ready() {\n super.ready();\n\n if (this.inputElement) {\n this.inputElement.autocapitalize = 'off';\n }\n }\n}\n\ndefineCustomElement(EmailField);\n","import textFieldMappings from '@descope-ui/descope-text-field/mappings';\nimport {\n createStyleMixin,\n draggableMixin,\n createProxy,\n proxyInputMixin,\n componentNameValidationMixin,\n externalInputMixin,\n} from '../../mixins';\nimport { compose } from '../../helpers';\nimport { getComponentName } from '../../helpers/componentHelpers';\nimport {\n inputFloatingLabelStyle,\n resetInputLabelPosition,\n resetInputOverrides,\n useHostExternalPadding,\n} from '../../helpers/themeHelpers/resetHelpers';\n\nexport const componentName = getComponentName('email-field');\n\nconst defaultPattern = \"^[\\\\w\\\\.\\\\%\\\\+\\\\-']+@[\\\\w\\\\.\\\\-]+\\\\.[A-Za-z]{2,}$\";\nconst defaultAutocomplete = 'username';\n\nconst customMixin = (superclass) =>\n class EmailFieldMixinClass extends superclass {\n init() {\n super.init?.();\n\n // we need to set the pattern on the base element because vaadin-email-field is overriding it\n this.baseElement.setAttribute('pattern', defaultPattern);\n\n if (!this.getAttribute('autocomplete')) {\n this.setAttribute('autocomplete', defaultAutocomplete);\n }\n\n this.createExternalInput();\n }\n };\n\nexport const EmailFieldClass = compose(\n createStyleMixin({\n mappings: textFieldMappings,\n }),\n draggableMixin,\n externalInputMixin({\n inputType: 'email',\n inputName: 'email',\n autocompleteType: 'username',\n includeAttrs: ['disabled', 'readonly', 'pattern'],\n }),\n proxyInputMixin({ proxyProps: ['value', 'selectionStart'], useProxyTargets: true }),\n componentNameValidationMixin,\n customMixin\n)(\n createProxy({\n slots: ['', 'suffix'],\n wrappedEleName: 'vaadin-email-field',\n style: () => `\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tpadding: calc(var(${EmailFieldClass.cssVarList.inputOutlineWidth}) + var(${\n EmailFieldClass.cssVarList.inputOutlineOffset\n }));\n box-sizing: border-box;\n\t\t\t}\n ${resetInputLabelPosition('vaadin-email-field')}\n\t\t\t${useHostExternalPadding(EmailFieldClass.cssVarList)}\n\t\t\t${resetInputOverrides('vaadin-email-field', EmailFieldClass.cssVarList)}\n ${inputFloatingLabelStyle()}\n\n vaadin-email-field[label-type=\"floating\"]:not([focused])[readonly] > input:placeholder-shown {\n opacity: 0;\n }\n vaadin-email-field[label-type=\"floating\"]:not([focused])[disabled] > input:placeholder-shown {\n opacity: 0;\n }\n\n :host ::slotted(*) {\n -webkit-mask-image: none;\n }\n\n vaadin-email-field[external-input=\"true\"] > input:not(:placeholder-shown) {\n opacity: 0;\n }\n\t\t`,\n excludeAttrsSync: ['tabindex', 'style'],\n componentName,\n })\n);\n","import '@vaadin/email-field';\nimport { componentName, EmailFieldClass } from './EmailFieldClass';\n\ncustomElements.define(componentName, EmailFieldClass);\n\nexport { EmailFieldClass, componentName };\n","// Matches any character that is not a digit, whitespace, or phone formatting character (+, -, (, ))\nconst INVALID_PHONE_CHARS_RE = /[^\\d\\s+\\-()]/;\n\nexport const isNumericValue = (val) => !!val && !INVALID_PHONE_CHARS_RE.test(val);\n\nexport const sanitizeCountryCodePrefix = (val) => val.replace(/\\+\\d+-/, '');\n","import { injectStyle } from '@descope-ui/common/components-helpers';\nimport { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../mixins';\nimport { createBaseClass } from '../../baseClasses/createBaseClass';\nimport { compose } from '../../helpers';\nimport { forwardAttrs, getComponentName } from '../../helpers/componentHelpers';\nimport { isNumericValue, sanitizeCountryCodePrefix as sanitizeValue } from './helpers';\nimport { PhoneFieldClass } from '../phone-fields/descope-phone-field/PhoneFieldClass';\nimport { PhoneFieldInputBoxClass } from '../phone-fields/descope-phone-input-box-field/PhoneFieldInputBoxClass';\n\nexport const componentName = getComponentName('hybrid-field');\n\nconst attrs = {\n shared: [\n 'label',\n 'bordered',\n 'full-width',\n 'label-type',\n 'size',\n 'disabled',\n 'readonly',\n 'required',\n 'st-host-direction',\n 'st-error-message-icon',\n 'st-error-message-icon-size',\n 'st-error-message-icon-padding',\n ],\n email: [\n 'placeholder',\n 'data-errormessage-value-missing-email',\n 'data-errormessage-pattern-mismatch-email',\n 'external-input',\n ],\n phone: {\n countryCode: [\n 'phone-input-label',\n 'country-input-label',\n 'country-input-placeholder',\n 'restrict-countries',\n 'default-code',\n 'phone-minlength',\n 'phone-format-value',\n 'phone-strict-validation',\n 'phone-input-type',\n 'data-errormessage-value-missing-phone',\n ],\n inputBox: [\n 'restrict-countries',\n 'default-code',\n 'phone-minlength',\n 'phone-format-value',\n 'phone-strict-validation',\n 'phone-input-type',\n 'data-errormessage-value-missing-phone',\n ],\n },\n};\n\nconst attrMap = {\n email: {\n 'data-errormessage-value-missing-email': 'data-errormessage-value-missing',\n 'data-errormessage-pattern-mismatch-email': 'data-errormessage-pattern-mismatch',\n },\n phone: {\n 'phone-input-label': 'label',\n 'phone-minlength': 'minlength',\n 'phone-format-value': 'format-value',\n 'phone-strict-validation': 'strict-validation',\n 'data-errormessage-value-missing-phone': 'data-errormessage-value-missing',\n },\n};\n\nconst EMAIL_FIELD = 'descope-email-field';\nconst PHONE_FIELD = 'descope-phone-field';\nconst PHONE_INPUT_BOX_FIELD = 'descope-phone-input-box-field';\n\nconst BaseClass = createBaseClass({\n componentName,\n baseSelector: 'div',\n});\n\nclass RawHybridField extends BaseClass {\n #isReportedValidity = false;\n\n #selectionStart;\n\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\n <div class=\"wrapper\">\n <descope-email-field external-input=\"${this.isExternalInput}\"></descope-email-field>\n <descope-phone-field allow-alphanumeric-input=\"true\" phone-input-type=\"text\"></descope-phone-field>\n <descope-phone-input-box-field allow-alphanumeric-input=\"true\" phone-input-type=\"text\"></descope-phone-input-box-field>\n </div>\n\t\t`;\n\n injectStyle(\n `\n :host {\n display: inline-flex;\n box-sizing: border-box;\n padding: 0;\n gap: 0;\n }\n .wrapper {\n display: grid;\n width: 100%;\n }\n descope-email-field,\n descope-phone-field,\n descope-phone-input-box-field {\n grid-area: 1/1;\n width: 100%;\n height: 100%;\n }\n .hidden {\n visibility: hidden;\n }\n `,\n this\n );\n }\n\n get isExternalInput() {\n return this.getAttribute('external-input') === 'true';\n }\n\n get emailInputEle() {\n return this.isExternalInput ? this.emailInput.externalInput : this.emailInput.inputElement;\n }\n\n get phoneVariant() {\n const isInputBox = this.getAttribute('phone-variant') === 'inputBox';\n return isInputBox ? this.phoneInputBoxInput : this.phoneCountryCodeInput;\n }\n\n get defaultCode() {\n const firstItem = this.phoneCountryCodeInput.countryCodes?.[0] || '';\n return this.getAttribute('default-code') || firstItem;\n }\n\n get activeInputEle() {\n if (this.activeInput === this.emailInput) {\n return this.emailInputEle;\n }\n return this.phoneVariant.phoneNumberInputEle;\n }\n\n get value() {\n return this.activeInput?.value || '';\n }\n\n set value(val) {\n this.handleActiveInput(val);\n setTimeout(() => {\n this.activeInput.value = val;\n });\n }\n\n async init() {\n super.init?.();\n\n this.initInputs();\n this.updateAttrs();\n this.toggleInputVisibility();\n\n await this.waitForInputs();\n\n this.initInputEles();\n this.overrideEmailInputType();\n this.overrideEmailSetAttribute();\n }\n\n waitForInputs() {\n return new Promise((resolve) => {\n const check = setInterval(() => {\n if (this.emailInputEle) {\n clearInterval(check);\n resolve();\n }\n });\n });\n }\n\n initInputs() {\n this.emailInput = this.shadowRoot.querySelector(EMAIL_FIELD);\n this.phoneCountryCodeInput = this.shadowRoot.querySelector(PHONE_FIELD);\n this.phoneInputBoxInput = this.shadowRoot.querySelector(PHONE_INPUT_BOX_FIELD);\n\n this.inputs = [this.emailInput, this.phoneCountryCodeInput, this.phoneInputBoxInput];\n\n this.activeInput = this.emailInput;\n }\n\n // we need to listen on the inner `input` element itself, otherwise we don't always get an `input` event\n initInputEles() {\n const inputEles = [\n this.emailInputEle,\n this.phoneCountryCodeInput.phoneNumberInputEle,\n this.phoneInputBoxInput.phoneNumberInputEle,\n ];\n\n inputEles.forEach((ele) => {\n ele.addEventListener('input', this.onValueChange.bind(this));\n });\n }\n\n overrideEmailInputType() {\n this.emailInputEle.addEventListener('focus', () => {\n this.emailInputEle.setAttribute('type', 'text');\n });\n this.emailInputEle.addEventListener('blur', () => {\n setTimeout(() => {\n this.emailInputEle.setAttribute('type', 'email');\n });\n });\n }\n\n // We want to prevent Vaadin from changing the input type to `email`\n // otherwise, we cannot get the selectionStart from the input.\n overrideEmailSetAttribute() {\n const origEmailSetAttr = this.emailInput.setAttribute.bind(this.emailInputEle);\n this.emailInputEle.setAttribute = (name, value) => {\n if (name !== 'type' || value !== 'email' || !this.emailInput.hasAttribute('focused')) {\n return origEmailSetAttr(name, value);\n }\n return false;\n };\n }\n\n updateAttrs() {\n forwardAttrs(this, this.emailInput, { includeAttrs: attrs.email, mapAttrs: attrMap.email });\n\n forwardAttrs(this, this.phoneCountryCodeInput, {\n includeAttrs: attrs.phone.countryCode,\n mapAttrs: attrMap.phone,\n });\n\n forwardAttrs(this, this.phoneInputBoxInput, {\n includeAttrs: attrs.phone.inputBox,\n mapAttrs: attrMap.phone,\n });\n\n this.inputs.forEach((input) => forwardAttrs(this, input, { includeAttrs: attrs.shared }));\n\n setTimeout(() => this.phoneCountryCodeInput.setAttribute('default-code', this.defaultCode));\n }\n\n onValueChange() {\n this.#selectionStart = this.activeInputEle.selectionStart;\n // phone components expose an API to their inputElement; in case of phone variants like\n // phone-input-box-field, we want to make sure that the value being passed\n // is raw value from input, and not the value with a dial-code prefix, or other decorations\n // applied behind the scenes by the phone components\n this.handleActiveInput(this.activeInputEle.value || this.activeInput.value);\n }\n\n handleActiveInput(val) {\n const expectedActiveInput = isNumericValue(val) ? this.phoneVariant : this.emailInput;\n\n if (this.activeInput !== expectedActiveInput) {\n this.setActiveInput(expectedActiveInput);\n }\n }\n\n setActiveInput(expectedActiveInput) {\n // phone components expose an API to their inputElement; in case of phone variants like\n // phone-input-box-field, we want to make sure that the value being passed\n // is raw value from input, and not the value with a dial-code prefix, or other decorations\n // applied behind the scenes by the phone components\n const val = this.activeInputEle.value || this.activeInput.value;\n\n this.activeInput = expectedActiveInput;\n this.setActiveInputValue(val);\n if (this.#isReportedValidity) this.activeInput.reportValidity();\n this.setActiveInputSelectionStart();\n this.toggleInputVisibility();\n }\n\n setActiveInputSelectionStart() {\n setTimeout(() => {\n const ele = this.activeInputEle;\n ele.focus();\n // setSelectionRange throws InvalidStateError on input types that do not\n // support selection (e.g. `email`). The focus handler usually switches\n // type to `text` first, but that can race with the blur timer or fail\n // to fire (e.g. background tab). Restoring the caret is best-effort.\n try {\n ele.setSelectionRange?.(this.#selectionStart, this.#selectionStart);\n } catch {\n /* noop */\n }\n });\n }\n\n #getDefaultDialCode() {\n const code = this.getAttribute('default-code');\n const match = code && PhoneFieldClass.CountryCodes.find((c) => c.code === code);\n return match?.dialCode || PhoneFieldClass.CountryCodes[0]?.dialCode || '';\n }\n\n setActiveInputValue(val) {\n const sanitizedVal = sanitizeValue(val);\n const isPhoneField = this.activeInput.localName === PHONE_FIELD;\n if (isPhoneField) {\n const dialCode = this.phoneCountryCodeInput.countryCodeItems || this.#getDefaultDialCode();\n this.activeInput.value = `${dialCode}-${sanitizedVal}`;\n } else {\n this.activeInput.value = sanitizedVal;\n }\n }\n\n toggleInputVisibility() {\n this.inputs.forEach((input) => {\n input !== this.activeInput ? input.classList.add('hidden') : input.classList.remove('hidden');\n });\n }\n\n reportValidity() {\n this.#isReportedValidity = true;\n\n const ele = this.activeInputEle;\n\n // On reportValidity we want to set the caret at the end of the input value.\n // Since checkValidity triggers `focus` on the input, it sets the caret at the start of the input,\n // regardless the existing value.\n const origInputType = ele.type;\n ele.setAttribute('type', 'text');\n setTimeout(() => {\n ele.setSelectionRange?.(ele.value.length, ele.value.length);\n ele.setAttribute('type', origInputType);\n });\n\n return this.activeInput.reportValidity();\n }\n\n checkValidity() {\n return this.activeInput.checkValidity();\n }\n}\n\nexport const HybridFieldClass = compose(\n createStyleMixin({ componentNameOverride: getComponentName('input-wrapper') }),\n createStyleMixin({\n mappings: {\n hostWidth: { selector: () => ':host', property: 'width' },\n hostDirection: [\n { selector: () => 'descope-email-field', property: 'direction' },\n { selector: () => 'descope-phone-field', property: 'direction' },\n { selector: () => 'descope-phone-input-box-field', property: 'direction' },\n ],\n errorMessageIcon: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.errorMessageIcon,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.errorMessageIcon,\n },\n ],\n errorMessageIconSize: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.errorMessageIconSize,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.errorMessageIconSize,\n },\n ],\n errorMessageIconPadding: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.errorMessageIconPadding,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.errorMessageIconPadding,\n },\n ],\n errorMessageIconRepeat: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.errorMessageIconRepeat,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.errorMessageIconRepeat,\n },\n ],\n errorMessageIconPosition: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.errorMessageIconPosition,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.errorMessageIconPosition,\n },\n ],\n errorMessageFontSize: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.errorMessageFontSize,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.errorMessageFontSize,\n },\n ],\n labelFontWeight: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.labelFontWeight,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.labelFontWeight,\n },\n ],\n inputValueFontWeight: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.inputValueFontWeight,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.inputValueFontWeight,\n },\n ],\n inputPlaceholderFontWeight: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.inputPlaceholderFontWeight,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.inputPlaceholderFontWeight,\n },\n ],\n helperTextFontWeight: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.helperTextFontWeight,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.helperTextFontWeight,\n },\n ],\n errorMessageFontWeight: [\n {\n selector: () => PhoneFieldClass.componentName,\n property: PhoneFieldClass.cssVarList.errorMessageFontWeight,\n },\n {\n selector: () => PhoneFieldInputBoxClass.componentName,\n property: PhoneFieldInputBoxClass.cssVarList.errorMessageFontWeight,\n },\n ],\n },\n }),\n draggableMixin,\n componentNameValidationMixin\n)(RawHybridField);\n","import '../descope-email-field';\nimport '../phone-fields/descope-phone-field';\nimport '../phone-fields/descope-phone-input-box-field';\n\nimport { componentName, HybridFieldClass } from './HybridFieldClass';\n\ncustomElements.define(componentName, HybridFieldClass);\n\nexport { HybridFieldClass, componentName };\n","import { syncAttrs } from '@descope-ui/common/components-helpers';\nimport { TextFieldClass } from '@descope-ui/descope-text-field/class';\nimport { componentName as descopeInternalComponentName } from './descope-phone-input-box-internal/PhoneFieldInternalInputBox';\nimport { forwardAttrs, getComponentName } from '../../../helpers/componentHelpers';\nimport { compose } from '../../../helpers';\nimport {\n createProxy,\n createStyleMixin,\n draggableMixin,\n inputOverrideValidConstraintsMixin,\n proxyInputMixin,\n} from '../../../mixins';\nimport CountryCodes from '../CountryCodes';\nimport {\n resetInputLabelPosition,\n resetInputCursor,\n resetInputFieldDefaultWidth,\n resetInputFieldInvalidBackgroundColor,\n useHostExternalPadding,\n inputFloatingLabelStyle,\n} from '../../../helpers/themeHelpers/resetHelpers';\n\nconst textVars = TextFieldClass.cssVarList;\n\nexport const componentName = getComponentName('phone-input-box-field');\n\nconst customMixin = (superclass) =>\n class PhoneFieldInputBoxMixinClass extends superclass {\n static get CountryCodes() {\n return CountryCodes;\n }\n\n init() {\n super.init?.();\n\n const template = document.createElement('template');\n\n template.innerHTML = `\n\t\t\t\t<${descopeInternalComponentName}\n\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\tslot=\"input\"\n\t\t\t\t></${descopeInternalComponentName}>\n `;\n\n this.baseElement.appendChild(template.content.cloneNode(true));\n\n this.inputElement = this.shadowRoot.querySelector(descopeInternalComponentName);\n\n syncAttrs(this, this.inputElement, { includeAttrs: ['has-value'] });\n\n forwardAttrs(this.shadowRoot.host, this.inputElement, {\n includeAttrs: [\n 'size',\n 'minlength',\n 'maxlength',\n 'default-code',\n 'disabled',\n 'phone-input-placeholder',\n 'label',\n 'label-type',\n 'allow-alphanumeric-input',\n 'restrict-countries',\n 'format-value',\n 'strict-validation',\n 'data-errormessage-type-mismatch',\n 'phone-input-type',\n ],\n });\n }\n\n get phoneNumberInputEle() {\n return this.inputElement?.phoneNumberInputEle;\n }\n };\n\nconst {\n host,\n label,\n inputElement,\n requiredIndicator,\n inputField,\n internalComponent,\n internalComponentAfter,\n phoneInput,\n errorMessage,\n helperText,\n} = {\n host: { selector: () => ':host' },\n label: { selector: '::part(label)' },\n placeholder: { selector: '> input:placeholder-shown' },\n inputElement: { selector: 'input' },\n requiredIndicator: { selector: '[required]::part(required-indicator)::after' },\n inputField: { selector: () => 'vaadin-text-field::part(input-field)' },\n internalComponent: {\n selector: 'descope-phone-field-internal-input-box',\n },\n internalComponentAfter: {\n selector: 'descope-phone-field-internal-input-box::after',\n },\n phoneInput: { selector: () => 'descope-text-field' },\n helperText: { selector: '::part(helper-text)' },\n errorMessage: { selector: '::part(error-message)' },\n};\n\nexport const PhoneFieldInputBoxClass = compose(\n createStyleMixin({\n mappings: {\n fontSize: [\n host,\n inputField,\n {\n selector: TextFieldClass.componentName,\n property: TextFieldClass.cssVarList.fontSize,\n },\n ],\n fontFamily: [label, errorMessage, helperText],\n hostWidth: { ...host, property: 'width' },\n hostMinWidth: { ...host, property: 'min-width' },\n hostDirection: { ...host, property: 'direction' },\n\n inputHorizontalPadding: [\n { ...phoneInput, property: 'padding-left' },\n { ...phoneInput, property: 'padding-right' },\n ],\n\n labelFontSize: { ...label, property: 'font-size' },\n labelFontWeight: { ...label, property: 'font-weight' },\n inputValueFontWeight: { ...phoneInput, property: textVars.inputValueFontWeight },\n inputPlaceholderFontWeight: { ...phoneInput, property: textVars.inputPlaceholderFontWeight },\n helperTextFontWeight: { ...helperText, property: 'font-weight' },\n errorMessageFontWeight: { ...errorMessage, property: 'font-weight' },\n labelTextColor: [\n { ...label, property: 'color' },\n { ...label, property: '-webkit-text-fill-color' },\n { ...requiredIndicator, property: 'color' },\n ],\n labelRequiredIndicator: { ...requiredIndicator, property: 'content' },\n errorMessageTextColor: { ...errorMessage, property: 'color' },\n\n errorMessageIcon: { ...errorMessage, property: 'background-image' },\n errorMessageIconSize: { ...errorMessage, property: 'background-size' },\n errorMessageIconPadding: { ...errorMessage, property: 'padding-inline-start' },\n errorMessageIconRepeat: { ...errorMessage, property: 'background-repeat' },\n errorMessageIconPosition: { ...errorMessage, property: 'background-position' },\n errorMessageFontSize: { ...errorMessage, property: 'font-size' },\n\n inputValueTextColor: { ...phoneInput, property: textVars.inputValueTextColor },\n\n inputPlaceholderTextColor: { ...phoneInput, property: textVars.inputPlaceholderColor },\n\n inputBorderStyle: { ...internalComponentAfter, property: 'border-style' },\n inputBorderWidth: { ...internalComponentAfter, property: 'border-width' },\n inputBorderColor: { ...internalComponentAfter, property: 'border-color' },\n inputBorderRadius: [\n { ...internalComponent, property: 'border-radius' },\n { ...internalComponentAfter, property: 'border-radius' },\n ],\n\n inputOutlineStyle: { ...internalComponent, property: 'outline-style' },\n inputOutlineColor: { ...internalComponent, property: 'outline-color' },\n inputOutlineWidth: { ...internalComponent, property: 'outline-width' },\n inputOutlineOffset: { ...internalComponent, property: 'outline-offset' },\n\n labelPosition: { ...label, property: 'position' },\n labelTopPosition: { ...label, property: 'top' },\n labelHorizontalPosition: [\n { ...label, property: 'left' },\n { ...label, property: 'right' },\n ],\n inputTransformY: { ...label, property: 'transform' },\n inputTransition: { ...label, property: 'transition' },\n marginInlineStart: { ...label, property: 'margin-inline-start' },\n valueInputHeight: { ...inputElement, property: 'height' },\n valueInputMarginBottom: {\n selector: TextFieldClass.componentName,\n property: textVars.valueInputMarginBottom,\n },\n },\n }),\n draggableMixin,\n inputOverrideValidConstraintsMixin,\n proxyInputMixin({ proxyProps: ['value', 'selectionStart'] }),\n customMixin\n)(\n createProxy({\n slots: [],\n wrappedEleName: 'vaadin-text-field',\n style: () => `\n :host {\n display: inline-flex;\n max-width: 100%;\n box-sizing: border-box;\n }\n ${useHostExternalPadding(PhoneFieldInputBoxClass.cssVarList)}\n ${resetInputCursor('vaadin-text-field')}\n ${resetInputFieldInvalidBackgroundColor('vaadin-text-field')}\n ${resetInputFieldDefaultWidth()}\n\n vaadin-text-field {\n width: 100%;\n box-sizing: border-box;\n padding: 0;\n }\n vaadin-text-field[focus-ring]::part(input-field) {\n box-shadow: none;\n }\n vaadin-text-field::before {\n height: 0;\n }\n vaadin-text-field::part(input-field) {\n padding: 0;\n background: transparent;\n -webkit-mask-image: none;\n }\n descope-phone-field-internal-input-box {\n -webkit-mask-image: none;\n padding: 0;\n width: 100%;\n }\n descope-phone-field-internal-input-box > div {\n width: 100%;\n }\n descope-phone-field-internal-input-box descope-text-field {\n ${textVars.inputOutlineWidth}: 0;\n ${textVars.inputOutlineOffset}: 0;\n }\n descope-phone-field-internal-input-box::after {\n content: '';\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n box-sizing: border-box;\n pointer-events: none;\n }\n descope-text-field {\n flex-grow: 1;\n width: 100%;\n direction: ltr;\n }\n vaadin-text-field[readonly] > input:placeholder-shown {\n opacity: 1;\n }\n vaadin-text-field::part(input-field)::after {\n border: none;\n }\n\n vaadin-text-field[label-type=\"floating\"]:not([focused])[readonly] input:placeholder-shown {\n opacity: 0;\n }\n vaadin-text-field[label-type=\"floating\"]:not([focused])[disabled] input:placeholder-shown {\n opacity: 0;\n }\n\n ${resetInputLabelPosition('vaadin-text-field')}\n ${inputFloatingLabelStyle()}\n\t\t`,\n excludeAttrsSync: ['tabindex', 'style'],\n componentName,\n })\n);\n\nexport default PhoneFieldInputBoxClass;\n","import { forwardAttrs } from '@descope-ui/common/components-helpers';\nimport parsePhoneNumberFromString, { AsYouType } from 'libphonenumber-js/min';\nimport { createBaseInputClass } from '../../../../baseClasses/createBaseInputClass';\nimport { getComponentName } from '../../../../helpers/componentHelpers';\nimport { getCountryByCodeId, matchingParenthesis } from '../../helpers';\n\nexport const componentName = getComponentName('phone-field-internal-input-box');\n\nconst observedAttributes = [\n 'disabled',\n 'size',\n 'readonly',\n 'phone-input-placeholder',\n 'name',\n 'maxlength',\n 'autocomplete',\n 'label-type',\n 'phone-input-type',\n];\nconst mapAttrs = {\n 'phone-input-placeholder': 'placeholder',\n 'phone-input-type': 'type',\n};\n\nconst BaseInputClass = createBaseInputClass({ componentName, baseSelector: 'div' });\n\nclass PhoneFieldInternal extends BaseInputClass {\n static get observedAttributes() {\n return [].concat(BaseInputClass.observedAttributes || [], observedAttributes);\n }\n\n #ayt;\n\n constructor() {\n super();\n\n this.innerHTML = `\n <div>\n <descope-text-field tabindex=\"1\" type=\"tel\" bordered=\"false\"></descope-text-field>\n </div>\n `;\n\n this.textField = this.querySelector('descope-text-field');\n }\n\n // notice: this function is exposed in parent component\n get phoneNumberInputEle() {\n return this.textField.shadowRoot.querySelector('input');\n }\n\n get defaultDialCode() {\n return getCountryByCodeId(this.getAttribute('default-code'));\n }\n\n get defaultCode() {\n return this.getAttribute('default-code');\n }\n\n get allowAlphanumericInput() {\n return this.getAttribute('allow-alphanumeric-input') === 'true';\n }\n\n get minLength() {\n return parseInt(this.getAttribute('minlength'), 10) || 0;\n }\n\n get maxLength() {\n return parseInt(this.getAttribute('maxlength'), 10) || 50;\n }\n\n get restrictCountries() {\n return this.getAttribute('restrict-countries')?.split(',').filter(Boolean) || [];\n }\n\n get isFormatValue() {\n return this.getAttribute('format-value') === 'true';\n }\n\n get isStrictValidation() {\n return this.getAttribute('strict-validation') === 'true';\n }\n\n get value() {\n if (!this.textField.value) return '';\n\n if (!this.isStrictValidation) {\n return this.#nonParsedValue();\n }\n\n const parsedVal = this.#parseWithCountryCode();\n\n if (parsedVal?.country && parsedVal?.countryCallingCode && parsedVal?.nationalNumber) {\n return `+${[parsedVal?.countryCallingCode, parsedVal?.nationalNumber].join('-')}`;\n }\n\n // if failed to parse or to find country code return text field value\n return this.textField.value;\n }\n\n set value(val) {\n this.textField.value = val;\n }\n\n init() {\n this.addEventListener('focus', (e) => {\n // We want to ignore focus events we are dispatching\n if (e.isTrusted) this.textField.focus();\n });\n\n super.init?.();\n\n this.textField.addEventListener('input', this.#onInput.bind(this));\n this.handleFocusEventsDispatching([this.textField]);\n\n forwardAttrs(this.textField, this, { includeAttrs: ['has-value'] });\n\n forwardAttrs(this, this.textField, {\n includeAttrs: ['phone-input-type'],\n mapAttrs: { 'phone-input-type': 'type' },\n });\n }\n\n getValidity() {\n const validPhonePattern = /^\\+?\\d{1,4}-?(?:\\d-?){1,15}$/;\n const stripValue = this.#sanitizeVal(this.textField.value || '');\n\n if (this.isRequired && !this.textField.value) {\n return { valueMissing: true };\n }\n\n if (this.textField.value) {\n if (stripValue.length < this.minLength) {\n return { tooShort: true };\n }\n\n if (\n // has `strict-validation` and not properly parsed\n (this.isStrictValidation && this.textField.value && !this.#isValidParsedValue()) ||\n // if no `strict-validation` then conform with naive pattern\n (!this.isStrictValidation && this.textField.value && !validPhonePattern.test(this.value))\n ) {\n return { patternMismatch: true };\n }\n }\n\n return {};\n }\n\n setSelectionRange(...args) {\n this.textField.setSelectionRange(...args);\n }\n\n attributeChangedCallback(attrName, oldValue, newValue) {\n super.attributeChangedCallback(attrName, oldValue, newValue);\n\n if (oldValue !== newValue && observedAttributes.includes(attrName)) {\n const attr = mapAttrs[attrName] || attrName;\n this.textField.setAttribute(attr, newValue);\n }\n }\n\n #onInput(e) {\n let sanitizedInput = this.#sanitizeInput(e.target.value);\n\n if (this.isFormatValue && this.#canFormat(sanitizedInput)) {\n sanitizedInput = this.#formatPhoneNumber(sanitizedInput);\n }\n\n e.target.value = sanitizedInput;\n }\n\n #nonParsedValue() {\n if (!this.defaultDialCode) {\n return this.textField.value;\n }\n\n const nationalNumber = this.#trimDuplicateCountryCode(this.textField.value);\n const sanitizedVal = this.#sanitizeVal(nationalNumber);\n\n return [this.defaultDialCode, sanitizedVal].join('-');\n }\n\n #parseWithCountryCode() {\n if (this.defaultDialCode) {\n return parsePhoneNumberFromString(\n [this.defaultDialCode, this.#sanitizeVal(this.textField.value)].filter(Boolean).join('')\n );\n }\n\n // if default-code or not parsed - try to extract country code from value\n return parsePhoneNumberFromString(this.textField.value);\n }\n\n #sanitizeVal(val) {\n return val.replace(/\\D/g, '');\n }\n\n #trimDuplicateCountryCode(val) {\n if (this.textField.value?.[0] === '+') {\n const dialCodePrefixPattern = new RegExp(`^\\\\${this.defaultDialCode}`);\n const trimmed = val.replace(dialCodePrefixPattern, '');\n return trimmed;\n }\n return val;\n }\n\n #isValidParsedValue() {\n const parsed = parsePhoneNumberFromString(this.value);\n return (\n !!parsed && // parsed successfully (not undefined)\n !!parsed.isValid?.() && // Parsed object is valid\n !!parsed.country && // Parsed object with a country code\n !!this.#isAllowedCountry(parsed.country) && // Parsed with allowed country code\n (this.defaultCode ? this.defaultCode === parsed.country : true) // In case default country code is set validate parsed country matches it\n );\n }\n\n #isAllowedCountry(countryCode) {\n if (!this.restrictCountries.length) {\n return true;\n }\n\n return this.restrictCountries.includes(countryCode);\n }\n\n #sanitizeInput(val) {\n val = val\n .replace(/^-+/, '') // dash as first char\n .replace(/(?!^)\\+/g, '') // multiple plus symbols\n .replace('--', '-') // consecutive dashes\n .replace('+-', '+'); // dash following plus symbol\n\n if (!this.allowAlphanumericInput) {\n const telDigitsRegExp = /^[+\\d-\\(\\)]+$/;\n val = val\n .split('')\n .filter((char) => telDigitsRegExp.test(char))\n .join('');\n }\n\n return val;\n }\n\n #formatPhoneNumber(phoneNumber = '') {\n // Get country code from `default-code or` from phone number\n const countryCode = this.defaultCode || this.#getCountryCodeFromValue(phoneNumber);\n\n // Skip formatting if no country code is available\n if (!countryCode) {\n return phoneNumber;\n }\n\n // Update AsYouType country code if needed\n if (!this.#ayt || this.#ayt.country !== countryCode) {\n this.#ayt = new AsYouType(countryCode);\n }\n\n // We need to reset AsYouType instance before setting new input\n this.#ayt.reset();\n\n // Set AsYouType input\n const formattedVal = this.#ayt.input(phoneNumber) || phoneNumber;\n\n return formattedVal;\n }\n\n #getCountryCodeFromValue(val) {\n const parsed = parsePhoneNumberFromString(val);\n return parsed?.country || '';\n }\n\n #canFormat(val) {\n if (!matchingParenthesis(val)) return false;\n return true;\n }\n}\n\nexport default PhoneFieldInternal;\n","import '@descope-ui/descope-text-field';\n\nimport PhoneFieldInternalInputBox, { componentName } from './PhoneFieldInternalInputBox';\n\ncustomElements.define(componentName, PhoneFieldInternalInputBox);\n","import './descope-phone-input-box-internal';\nimport '@descope-ui/descope-text-field';\n\nimport { componentName, PhoneFieldInputBoxClass } from './PhoneFieldInputBoxClass';\n\ncustomElements.define(componentName, PhoneFieldInputBoxClass);\n\nexport { PhoneFieldInputBoxClass, componentName };\n","import parsePhoneNumberFromString from 'libphonenumber-js/min';\nimport CountryCodes from './CountryCodes';\n\nexport const getCountryByCodeId = (countryCode) =>\n CountryCodes.find((c) => c.code === countryCode)?.dialCode;\n\nexport const matchingParenthesis = (val) => {\n const openParenMatches = val.match(/\\(/g);\n const closeParenMatches = val.match(/\\)/g);\n return openParenMatches?.length === closeParenMatches?.length;\n};\n"],"names":["emailField","moduleId","emailFieldStyles","EmailField","is","constructor","super","this","_setType","pattern","ready","inputElement","autocapitalize","componentName","EmailFieldClass","mappings","textFieldMappings","inputType","inputName","autocompleteType","includeAttrs","proxyProps","useProxyTargets","superclass","init","baseElement","setAttribute","getAttribute","createExternalInput","slots","wrappedEleName","style","cssVarList","inputOutlineWidth","inputOutlineOffset","excludeAttrsSync","customElements","define","INVALID_PHONE_CHARS_RE","attrs","shared","email","phone","countryCode","inputBox","attrMap","PHONE_FIELD","BaseClass","createBaseClass","baseSelector","HybridFieldClass","componentNameOverride","hostWidth","selector","property","hostDirection","errorMessageIcon","PhoneFieldClass","PhoneFieldInputBoxClass","errorMessageIconSize","errorMessageIconPadding","errorMessageIconRepeat","errorMessageIconPosition","errorMessageFontSize","labelFontWeight","inputValueFontWeight","inputPlaceholderFontWeight","helperTextFontWeight","errorMessageFontWeight","attachShadow","mode","innerHTML","isExternalInput","emailInputEle","emailInput","externalInput","phoneVariant","phoneInputBoxInput","phoneCountryCodeInput","defaultCode","firstItem","countryCodes","activeInputEle","activeInput","phoneNumberInputEle","value","val","handleActiveInput","setTimeout","initInputs","updateAttrs","toggleInputVisibility","waitForInputs","initInputEles","overrideEmailInputType","overrideEmailSetAttribute","Promise","resolve","check","setInterval","clearInterval","shadowRoot","querySelector","inputs","forEach","ele","addEventListener","onValueChange","bind","origEmailSetAttr","name","hasAttribute","mapAttrs","input","selectionStart","expectedActiveInput","test","isNumericValue","setActiveInput","setActiveInputValue","reportValidity","setActiveInputSelectionStart","focus","setSelectionRange","code","match","CountryCodes","find","c","dialCode","sanitizedVal","replace","localName","countryCodeItems","classList","add","remove","origInputType","type","length","checkValidity","textVars","host","label","requiredIndicator","inputField","internalComponent","internalComponentAfter","phoneInput","errorMessage","helperText","placeholder","fontSize","fontFamily","hostMinWidth","inputHorizontalPadding","labelFontSize","labelTextColor","labelRequiredIndicator","errorMessageTextColor","inputValueTextColor","inputPlaceholderTextColor","inputPlaceholderColor","inputBorderStyle","inputBorderWidth","inputBorderColor","inputBorderRadius","inputOutlineStyle","inputOutlineColor","labelPosition","labelTopPosition","labelHorizontalPosition","inputTransformY","inputTransition","marginInlineStart","valueInputHeight","valueInputMarginBottom","template","document","createElement","appendChild","content","cloneNode","observedAttributes","BaseInputClass","concat","textField","defaultDialCode","allowAlphanumericInput","minLength","parseInt","maxLength","restrictCountries","split","filter","Boolean","isFormatValue","isStrictValidation","parsedVal","country","countryCallingCode","nationalNumber","join","e","isTrusted","handleFocusEventsDispatching","getValidity","validPhonePattern","stripValue","isRequired","valueMissing","tooShort","patternMismatch","args","attributeChangedCallback","attrName","oldValue","newValue","includes","attr","sanitizedInput","target","dialCodePrefixPattern","RegExp","parsed","isValid","telDigitsRegExp","char","phoneNumber","reset","getCountryByCodeId","matchingParenthesis","openParenMatches","closeParenMatches"],"sourceRoot":""}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*! For license information please see descope-user-attribute-index-js.js.LICENSE.txt */
|
|
2
|
-
(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[1202,1578,2294,4188,5087,6724],{76368(t){t.exports="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxNCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gPHBhdGggZD0iTTEgMTZDMSAxNy4xIDEuOSAxOCAzIDE4SDExQzEyLjEgMTggMTMgMTcuMSAxMyAxNlY0SDFWMTZaTTMgNkgxMVYxNkgzVjZaTTEwLjUgMUw5LjUgMEg0LjVMMy41IDFIMFYzSDE0VjFIMTAuNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPiA8L3N2Zz4="},65725(t){t.exports="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gPHBhdGggZD0iTTEwLjAwMDIgMC45OTIxNDlDMTAuMDAwMiAxLjAxNjE1IDEwLjAwMDIgMS4wMTYxNSAxMC4wMDAyIDEuMDE2MTVMOC4yMjQxOSAzLjAwODE1SDIuOTkyMTlDMi40NjQxOSAzLjAwODE1IDIuMDA4MTkgMy40NDAxNSAyLjAwODE5IDMuOTkyMTVWMTIuMDA4MkMyLjAwODE5IDEyLjUzNjIgMi40NDAxOSAxMi45OTIyIDIuOTkyMTkgMTIuOTkyMkg1LjUzNjE5QzUuODQ4MTkgMTMuMDQwMiA2LjE2MDE5IDEzLjA0MDIgNi40NzIxOSAxMi45OTIySDExLjAwODJDMTEuNTM2MiAxMi45OTIyIDExLjk5MjIgMTIuNTYwMiAxMS45OTIyIDEyLjAwODJWNy43ODQxNkwxMy45MzYyIDUuNjI0MTVMMTQuMDA4MiA1LjY3MjE1VjExLjk4NDJDMTQuMDA4MiAxMy42NjQyIDEyLjY2NDIgMTUuMDA4MiAxMS4wMDgyIDE1LjAwODJIMy4wMTYxOUMxLjMzNjE5IDE1LjAwODIgLTAuMDA3ODEyNSAxMy42NjQyIC0wLjAwNzgxMjUgMTEuOTg0MlYzLjk5MjE1Qy0wLjAwNzgxMjUgMi4zMzYxNSAxLjMzNjE5IDAuOTkyMTQ5IDMuMDE2MTkgMC45OTIxNDlIMTAuMDAwMlpNMTEuMjcyMiAyLjYyNDE1TDEyLjYxNjIgNC4xMTIxNUw3LjcyMDE5IDkuNjgwMTZDNy41MDQxOSA5LjkyMDE2IDYuODMyMTkgMTAuMjMyMiA1LjY4MDE5IDEwLjYxNjJDNS42NTYxOSAxMC42NDAyIDUuNjA4MTkgMTAuNjQwMiA1LjU2MDE5IDEwLjYxNjJDNS40NjQxOSAxMC41OTIyIDUuMzkyMTkgMTAuNDcyMiA1LjQ0MDE5IDEwLjM3NjJDNS43NTIxOSA5LjI0ODE2IDYuMDQwMTkgOC41NTIxNiA2LjI1NjE5IDguMzEyMTZMMTEuMjcyMiAyLjYyNDE1Wk0xMS45MjAyIDEuODU2MTVMMTMuMjg4MiAwLjMyMDE0OUMxMy42NDgyIC0wLjA4Nzg1MTYgMTQuMjcyMiAtMC4xMTE4NTIgMTQuNjgwMiAwLjI3MjE0OUMxNS4wODgyIDAuNjMyMTQ5IDE1LjExMjIgMS4yODAxNSAxNC43NTIyIDEuNjg4MTVMMTMuMjY0MiAzLjM2ODE1TDExLjkyMDIgMS44NTYxNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPiA8L3N2Zz4g"},77888(t,e,i){"use strict";i.d(e,{T:()=>s,e:()=>d});var o=i(88961),n=i(72270),r=i(25964),a=i(63200);const s=(0,r.xE)("badge");class l extends((0,n.qu)({componentName:s,baseSelector:":host > div"})){static get observedAttributes(){return["data-attachment-size","shrink-to-indicator-threshold"]}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<div>\n <slot></slot>\n\t\t</div>\n\t\t",(0,r.fz)("\n :host {\n display: inline-flex;\n }\n :host > div {\n position: relative;\n width: 100%;\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n }\n ",this)}get shrinkToIndicatorThreshold(){return this.getAttribute("shrink-to-indicator-threshold")||65}#t(t){this.toggleAttribute("shrink-to-indicator",parseFloat(t)<this.shrinkToIndicatorThreshold)}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i),"data-attachment-size"===t&&e!==i&&this.#t(i)}}const d=(0,a.Zz)((0,o.RF)({mappings:{hostWidth:[{selector:()=>":host",property:"width"}],hostHeight:[{selector:()=>":host",property:"height"}],hostDirection:{property:"direction"},fontFamily:{},fontSize:{},fontWeight:{},textTransform:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-left"},{property:"padding-right"}],borderWidth:{},borderStyle:{},borderColor:{},borderRadius:{},backgroundColor:{},textColor:{property:"color"},textAlign:{},boxShadow:{},textIndent:{}}}),o.VO,o.tQ)(l)},11065(t,e,i){"use strict";i.r(e),i.d(e,{BadgeClass:()=>o.e,componentName:()=>o.T});var o=i(77888);customElements.define(o.T,o.e)},19624(t,e,i){"use strict";i.d(e,{J:()=>p,T:()=>l});var o=i(63200),n=i(25964),r=i(88961),a=i(98538),s=i(10767);const l=(0,n.xE)("button"),{host:d,label:h,slottedIcon:c}={host:{selector:()=>":host"},label:{selector:"::part(label)"},slottedIcon:{selector:()=>"::slotted(descope-icon)"}};let u;const p=(0,o.Zz)((0,r.DM)({triggers:[{attr:"full-width",value:"true"}]}),(0,r.RF)({mappings:{hostWidth:{property:"width"},hostMaxWidth:{...d,property:"max-width"},hostHeight:{property:"height"},hostDirection:{...d,property:"direction"},fontSize:{},fontFamily:{},fontWeight:{},cursor:{},backgroundColor:{},outlineOffset:{},outlineColor:{},outlineStyle:{},outlineWidth:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-right",fallback:"0.875em"},{property:"padding-left",fallback:"0.875em"}],labelTextColor:{property:"color"},iconColor:{selector:()=>"::slotted(*)",property:a.S.cssVarList.fill},labelTextDecoration:{...h,property:"text-decoration"},labelSpacing:{...h,property:"gap"},textAlign:{...h,property:"justify-content",fallback:"center"},iconSize:[{...c,property:"width"},{...c,property:"height"}]}}),s.G,r.VO,r.tQ)((0,r.tz)({slots:["","prefix","label","suffix"],wrappedEleName:"vaadin-button",style:()=>`\n\t\t\t\n\t:host {\n\t\tdisplay: inline-block;\n\t\tbox-sizing: border-box;\n\t}\n\tvaadin-button::before,\n\tvaadin-button::after {\n\t\topacity: 0;\n\t}\n\tvaadin-button {\n\t\tmargin: 0;\n\t\tmin-width: 0;\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tbox-shadow: none;\n\t}\n\tvaadin-button::part(label) {\n\t\tpadding: 0;\n width: 100%;\n\t}\n\tvaadin-button::part(prefix) {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n\n\t\t\t\n\tvaadin-button::part(prefix),\n\tvaadin-button::part(label) {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n\n\t\t\t${u}\n\t\t\tvaadin-button::part(label) { pointer-events: none; }\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${p.cssVarList.outlineWidth}) + var(${p.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width="true"]) {\n width: var(${p.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${p.cssVarList.hostHeight}) - var(${p.cssVarList.outlineWidth}) - var(${p.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square="true"]:not([full-width="true"]) {\n\t\t\t\twidth: calc(var(${p.cssVarList.hostWidth}) - var(${p.cssVarList.outlineWidth}) - var(${p.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex","class","style"],componentName:l})),{color:b,fontSize:g}=p.cssVarList;u=`\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading="true"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${b});\n\t\ttop: calc(50% - (var(${g}) / 2));\n\t\tleft: calc(50% - (var(${g}) / 2));\n\t\tborder-width: calc(var(${g}) / 10);\n\t\twidth: var(${g});\n\t\theight: var(${g});\n\t}\n\t:host([disabled="true"]),\n\t:host([loading="true"]) {\n\t\tpointer-events: none;\n\t}\n\t:host([loading="true"]) ::part(prefix),\n\t:host([loading="true"]) ::part(label) {\n\t\tvisibility: hidden;\n\t}\n`},10767(t,e,i){"use strict";i.d(e,{G:()=>o});const o=t=>class extends t{get isLoading(){return"true"===this.getAttribute("loading")}click(){this.isLoading||super.click()}}},30576(t,e,i){"use strict";i.r(e),i.d(e,{ButtonClass:()=>o.J,componentName:()=>o.T});var o=i(19624);i(83799),customElements.define(o.T,o.J)},98538(t,e,i){"use strict";i.d(e,{S:()=>l,T:()=>s});var o=i(88961),n=i(25964),r=i(8512),a=i(63200);const s=(0,n.xE)("icon"),l=(0,a.Zz)((0,o.RF)({mappings:{fill:[{},{property:r.q.cssVarList.fill}],height:{selector:()=>":host"},width:{selector:()=>":host"}}}),o.VO,o.tQ)((0,o.tz)({slots:[],wrappedEleName:"descope-image",style:()=>"\n :host {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n max-height: 100%;\n }\n ",excludeAttrsSync:["tabindex","class","style","st-height","st-width"],componentName:s}))},56737(t,e,i){"use strict";i.r(e),i.d(e,{IconClass:()=>o.S,componentName:()=>o.T}),i(53455);var o=i(98538);customElements.define(o.T,o.S)},8512(t,e,i){"use strict";i.d(e,{T:()=>l,q:()=>c});var o=i(88961),n=i(72270),r=i(63200),a=i(25964),s=i(18782);const l=(0,a.xE)("image"),d=["src","src-dark"];class h extends((0,n.qu)({componentName:l,baseSelector:"slot"})){static get observedAttributes(){return d}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<slot></slot>\n\t",(0,a.fz)("\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n :host > slot {\n width: 100%;\n height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n ::slotted(*) {\n width: 100%;\n\t\t\t}\n\n .hidden {\n display: none;\n }\n ",this)}init(){super.init?.(),this.toggleVisibility(this.getSrc)}onThemeChange(){this.renderImage()}toggleVisibility(t){t?this.classList.remove("hidden"):this.classList.add("hidden")}get altText(){return this.getAttribute("alt")||""}get legacySrc(){return this.getAttribute("src")}get themeSrc(){return this.getAttribute(`src-${this.currentThemeName}`)}get getSrc(){return this.themeSrc||this.legacySrc}updateFillColor(t){[t,...t.querySelectorAll("*[fill]")].forEach(t=>{t.setAttribute("fill",`var(${c.cssVarList.fill}, ${t.getAttribute("fill")||"''"})`)})}renderImage(){this.toggleVisibility(this.getSrc),(0,s.m)(this.getSrc,this.altText).then(t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))})}shouldRender(t){const e=this.getAttribute(t);return this.getSrc===e}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i),e!==i&&this.shouldRender(t)&&this.renderImage()}}const c=(0,r.Zz)((0,o.RF)({mappings:{fill:{},height:{selector:()=>":host"},width:{selector:()=>":host"}}}),o.VO,o.tQ)(h)},18782(t,e,i){"use strict";i.d(e,{m:()=>r});var o=i(25414);const n=t=>{const e=o.A.sanitize(t,{USE_PROFILES:{svg:!0,svgFilters:!0},ADD_TAGS:["image"],FORBID_TAGS:["defs"]});return(new DOMParser).parseFromString(e,"image/svg+xml").querySelector("svg")},r=async(t,e)=>{try{let i;if((t=>t.startsWith("data:image/svg+xml;base64,"))(t)){const e=atob(t.slice(26));i=n(e)}else if("svg"===(t=>{const e=t.match(/\.([0-9a-z]+)(?:[\\?#]|$)/i);return e?e[1]:null})(t)){const e=await fetch(t),o=await e.text();i=n(o)}else i=((t,e)=>{const i=document.createElement("img");return i.setAttribute("src",t),i.setAttribute("alt",e),i})(t,e);return i.style.setProperty("max-width","100%"),i.style.setProperty("max-height","100%"),i}catch{return null}}},53455(t,e,i){"use strict";i.r(e),i.d(e,{ImageClass:()=>o.q,componentName:()=>o.T});var o=i(8512);customElements.define(o.T,o.q)},66434(t,e,i){"use strict";i.d(e,{T:()=>s,s:()=>h});var o=i(88961),n=i(63200),r=i(25964),a=i(72270);const s=(0,r.xE)("text");class l extends((0,a.qu)({componentName:s,baseSelector:":host > slot"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <slot part="text-wrapper"></slot>\n ',(0,r.fz)("\n :host {\n display: inline-block;\n line-height: 1em;\n }\n :host > slot {\n width: 100%;\n display: inline-block;\n }\n ",this)}get hideWhenEmpty(){return"true"===this.getAttribute("hide-when-empty")}init(){super.init(),(0,r.Ge)(this,()=>{const t=!!this.childNodes.length;this.style.display=!t&&this.hideWhenEmpty?"none":""})}}const{host:d}={host:{selector:()=>":host"}},h=(0,n.Zz)((0,o.RF)({mappings:{hostWidth:{...d,property:"width"},hostDirection:{...d,property:"direction"},fontSize:{},textColor:[{property:"color"}],textLineHeight:{property:"line-height"},textLetterSpacing:{property:"letter-spacing"},textShadow:{},textAlign:{},textTransform:{},fontFamily:{},fontStyle:{},fontWeight:{},borderWidth:{},borderStyle:{},borderColor:{}}}),(0,o.DM)({triggers:[{attr:"full-width",value:"true"}]}),o.VO,o.tQ)(l)},63595(t,e,i){"use strict";i.r(e),i.d(e,{TextClass:()=>o.s,componentName:()=>o.T});var o=i(66434);customElements.define(o.T,o.s)},45554(t,e,i){"use strict";i.r(e),i.d(e,{UserAttributeClass:()=>A,componentName:()=>m});var o=i(66434),n=i(19624),r=i(77888),a=i(98538),s=i(25964),l=i(79365),d=i(81365),h=i(9696),c=i(97810),u=i(76368),p=i.n(u),b=i(65725),g=i.n(b);const m=(0,c.xE)("user-attribute");class y extends((0,d.q)({componentName:m,baseSelector:":host > .root"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <div class="root">\n <descope-text st-text-align="auto" data-id="label-text" variant="body1" mode="secondary" class="label"></descope-text>\n <div class="content-wrapper">\n <descope-text st-text-align="auto" data-id="value-text" variant="body1" mode="primary" class="value"></descope-text>\n <div class="btn-wrapper">\n <descope-badge mode="default" bordered="true" size="xs"></descope-badge>\n <descope-button size="sm" data-id="delete-btn" variant="link" mode="primary">\n <slot name="delete-icon"></slot>\n </descope-button>\n <descope-button size="sm" data-id="edit-btn" variant="link" mode="primary">\n <slot name="edit-icon"></slot>\n </descope-button>\n </div>\n </div>\n </div>\n\t\t',(0,s.fz)(`\n :host {\n\t\t\t\t\tdisplay: inline-flex;\n container-type: inline-size;\n\t\t\t\t}\n\n .root {\n display: flex;\n width: 100%;\n height: 100%;\n align-items: center;\n }\n\n ::slotted(*) {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n @container (max-width: 529px) {\n .root {\n flex-wrap: wrap;\n }\n }\n\n .btn-wrapper {\n display: flex;\n justify-content: space-between;\n align-items: center;\n flex-grow: 0;\n flex-shrink: 0;\n }\n\n slot[name="edit-icon"],\n slot[name="delete-icon"] {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n }\n\n .content-wrapper {\n display: flex;\n flex-grow: 1;\n align-items: center;\n }\n\n descope-text::part(text-wrapper) {\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n width: initial;\n }\n\n descope-text {\n display: inline-flex;\n max-width: 100%;\n min-width: 0;\n }\n\n .label {\n flex-grow: 1;\n width: 100%;\n }\n\n .value {\n flex-grow: 1;\n }\n\n descope-badge {\n margin-inline-end: 10px;\n }\n\n .hidden {\n visibility: hidden;\n width: 0;\n }\n\n descope-text[data-id="label-text"].required:after {\n content: '*';\n color: var(${o.s.cssVarList.textColor});\n }\n\n :host([readonly="true"]) descope-button {\n visibility: hidden;\n width: 0;\n }\n `,this),this.deleteButton=this.shadowRoot.querySelector('descope-button[data-id="delete-btn"]'),this.editButton=this.shadowRoot.querySelector('descope-button[data-id="edit-btn"]'),this.badge=this.shadowRoot.querySelector("descope-badge"),this.labelText=this.shadowRoot.querySelector('descope-text[data-id="label-text"]'),this.valueText=this.shadowRoot.querySelector('descope-text[data-id="value-text"]')}onLabelChange(){this.labelText.innerText=this.label,this.labelText.setAttribute("title",this.label)}onValueOrPlaceholderChange(){const t=this.value||this.placeholder,e=this.value?"primary":"secondary";this.valueText.innerText=t,this.valueText.setAttribute("title",t),this.valueText.setAttribute("mode",e)}onBadgeLabelChange(){this.badgeLabel?(this.badge.innerText=this.badgeLabel,this.badge.style.display=""):this.badge.style.display="none"}onBadgeTooltipTextChange(){this.badge.setAttribute("title",this.badgeTooltipText||this.badgeLabel)}updateButtonLabel(t,e){let i=t.querySelector("span.btn-label");e?(i||(i=document.createElement("span"),i.classList.add("btn-label"),t.appendChild(i)),i.innerText=e):i?.remove()}onIsRequiredChange(){this.labelText.classList.toggle("required",this.isRequired)}get label(){return this.getAttribute("label")||""}get value(){return this.getAttribute("value")||""}get placeholder(){return this.getAttribute("placeholder")||""}get isRequired(){return"true"===this.getAttribute("required")}get badgeLabel(){return this.getAttribute("badge-label")||""}get badgeTooltipText(){return this.getAttribute("badge-tooltip-text")||""}get editButtonLabel(){return this.getAttribute("edit-button-label")||""}get deleteButtonLabel(){return this.getAttribute("delete-button-label")||""}get isDeleteHidden(){return"true"===this.getAttribute("hide-delete")}init(){this.onLabelChange(),this.onValueOrPlaceholderChange(),this.onIsRequiredChange(),this.onBadgeLabelChange(),this.onBadgeTooltipTextChange(),this.updateButtonLabel(this.editButton,this.editButtonLabel),this.updateButtonLabel(this.deleteButton,this.deleteButtonLabel),this.handleDeleteButtonVisibility(),this.deleteButton.addEventListener("click",()=>this.dispatchEvent(new CustomEvent("delete-clicked",{bubbles:!0,composed:!0}))),this.editButton.addEventListener("click",()=>this.dispatchEvent(new CustomEvent("edit-clicked",{bubbles:!0,composed:!0}))),this.setDefaultChildren()}#e(t,e){const i=document.createElement("descope-icon");i.setAttribute("src",t),i.setAttribute("src-dark",t),i.setAttribute("slot",e),this.appendChild(i)}setDefaultChildren(){this.children.length||(this.#e(p(),"delete-icon"),this.#e(g(),"edit-icon"))}static get observedAttributes(){return["label","value","placeholder","required","badge-label","badge-tooltip-text","edit-button-label","delete-button-label","hide-delete"].concat(super.observedAttributes)}handleDeleteButtonVisibility(){this.deleteButton.classList.toggle("hidden",this.isRequired||!this.value||this.isDeleteHidden)}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i),e!==i&&("label"===t?this.onLabelChange():"value"===t||"placeholder"===t?this.onValueOrPlaceholderChange():"required"===t?this.onIsRequiredChange():"badge-label"===t?this.onBadgeLabelChange():"badge-tooltip-text"===t?this.onBadgeTooltipTextChange():"edit-button-label"===t?this.updateButtonLabel(this.editButton,this.editButtonLabel):"delete-button-label"===t&&this.updateButtonLabel(this.deleteButton,this.deleteButtonLabel),"value"!==t&&"required"!==t&&"hide-delete"!==t||this.handleDeleteButtonVisibility())}}const{host:x,textFields:v,buttons:f,badge:M,labelText:w,contentWrapper:T}={host:{selector:()=>":host"},textFields:{selector:"descope-text"},labelText:{selector:'descope-text[data-id="label-text"]'},buttons:{selector:"descope-button"},badge:{selector:"descope-badge"},contentWrapper:{selector:" .content-wrapper"}},A=(0,h.Zz)((0,l.RF)({mappings:{hostWidth:{...x,property:"width"},hostMinWidth:{...x,property:"min-width"},hostMaxWidth:{...x,property:"max-width"},hostDirection:[{...x,property:"direction"},{...v,property:o.s.cssVarList.hostDirection},{...f,property:n.J.cssVarList.hostDirection},{...M,property:r.e.cssVarList.hostDirection}],labelMinWidth:{...w,property:"min-width"},contentMinWidth:{...T,property:"min-width"},badgeMaxWidth:{...M,property:"max-width"},itemsGap:[{property:"gap"},{...T,property:"gap"}],iconColor:[{selector:()=>"::slotted(*)",property:a.S.cssVarList.fill}]}}),l.VO,l.tQ)(y);i(63595),i(30576),i(11065),i(56737),customElements.define(m,A)},89389(t,e,i){"use strict";i.d(e,{$:()=>b});var o=i(13256),n=i(55774),r=i(82901),a=i(72562),s=i(81488),l=i(87550);const d=i(51450).AH`
|
|
2
|
+
(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[1202,1578,2294,4188,5087,6724],{78159(t){t.exports="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gPHBhdGggZD0iTTkgMTYuMTcgNC44MyAxMmwtMS40MiAxLjQxTDkgMTkgMjEgN2wtMS40MS0xLjQxeiIgZmlsbD0iY3VycmVudGNvbG9yIi8+IDwvc3ZnPiA="},22966(t){t.exports="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gPHBhdGggZD0iTTE2IDFINGMtMS4xIDAtMiAuOS0yIDJ2MTRoMlYzaDEyVjF6bTMgNEg4Yy0xLjEgMC0yIC45LTIgMnYxNGMwIDEuMS45IDIgMiAyaDExYzEuMSAwIDItLjkgMi0yVjdjMC0xLjEtLjktMi0yLTJ6bTAgMTZIOFY3aDExdjE0eiIgZmlsbD0iY3VycmVudGNvbG9yIi8+IDwvc3ZnPiA="},76368(t){t.exports="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxNCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gPHBhdGggZD0iTTEgMTZDMSAxNy4xIDEuOSAxOCAzIDE4SDExQzEyLjEgMTggMTMgMTcuMSAxMyAxNlY0SDFWMTZaTTMgNkgxMVYxNkgzVjZaTTEwLjUgMUw5LjUgMEg0LjVMMy41IDFIMFYzSDE0VjFIMTAuNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPiA8L3N2Zz4="},65725(t){t.exports="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxNSAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gPHBhdGggZD0iTTEwLjAwMDIgMC45OTIxNDlDMTAuMDAwMiAxLjAxNjE1IDEwLjAwMDIgMS4wMTYxNSAxMC4wMDAyIDEuMDE2MTVMOC4yMjQxOSAzLjAwODE1SDIuOTkyMTlDMi40NjQxOSAzLjAwODE1IDIuMDA4MTkgMy40NDAxNSAyLjAwODE5IDMuOTkyMTVWMTIuMDA4MkMyLjAwODE5IDEyLjUzNjIgMi40NDAxOSAxMi45OTIyIDIuOTkyMTkgMTIuOTkyMkg1LjUzNjE5QzUuODQ4MTkgMTMuMDQwMiA2LjE2MDE5IDEzLjA0MDIgNi40NzIxOSAxMi45OTIySDExLjAwODJDMTEuNTM2MiAxMi45OTIyIDExLjk5MjIgMTIuNTYwMiAxMS45OTIyIDEyLjAwODJWNy43ODQxNkwxMy45MzYyIDUuNjI0MTVMMTQuMDA4MiA1LjY3MjE1VjExLjk4NDJDMTQuMDA4MiAxMy42NjQyIDEyLjY2NDIgMTUuMDA4MiAxMS4wMDgyIDE1LjAwODJIMy4wMTYxOUMxLjMzNjE5IDE1LjAwODIgLTAuMDA3ODEyNSAxMy42NjQyIC0wLjAwNzgxMjUgMTEuOTg0MlYzLjk5MjE1Qy0wLjAwNzgxMjUgMi4zMzYxNSAxLjMzNjE5IDAuOTkyMTQ5IDMuMDE2MTkgMC45OTIxNDlIMTAuMDAwMlpNMTEuMjcyMiAyLjYyNDE1TDEyLjYxNjIgNC4xMTIxNUw3LjcyMDE5IDkuNjgwMTZDNy41MDQxOSA5LjkyMDE2IDYuODMyMTkgMTAuMjMyMiA1LjY4MDE5IDEwLjYxNjJDNS42NTYxOSAxMC42NDAyIDUuNjA4MTkgMTAuNjQwMiA1LjU2MDE5IDEwLjYxNjJDNS40NjQxOSAxMC41OTIyIDUuMzkyMTkgMTAuNDcyMiA1LjQ0MDE5IDEwLjM3NjJDNS43NTIxOSA5LjI0ODE2IDYuMDQwMTkgOC41NTIxNiA2LjI1NjE5IDguMzEyMTZMMTEuMjcyMiAyLjYyNDE1Wk0xMS45MjAyIDEuODU2MTVMMTMuMjg4MiAwLjMyMDE0OUMxMy42NDgyIC0wLjA4Nzg1MTYgMTQuMjcyMiAtMC4xMTE4NTIgMTQuNjgwMiAwLjI3MjE0OUMxNS4wODgyIDAuNjMyMTQ5IDE1LjExMjIgMS4yODAxNSAxNC43NTIyIDEuNjg4MTVMMTMuMjY0MiAzLjM2ODE1TDExLjkyMDIgMS44NTYxNVoiIGZpbGw9ImN1cnJlbnRjb2xvciIvPiA8L3N2Zz4g"},77888(t,e,i){"use strict";i.d(e,{T:()=>s,e:()=>d});var o=i(88961),n=i(72270),r=i(25964),a=i(63200);const s=(0,r.xE)("badge");class l extends((0,n.qu)({componentName:s,baseSelector:":host > div"})){static get observedAttributes(){return["data-attachment-size","shrink-to-indicator-threshold"]}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<div>\n <slot></slot>\n\t\t</div>\n\t\t",(0,r.fz)("\n :host {\n display: inline-flex;\n }\n :host > div {\n position: relative;\n width: 100%;\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n }\n ",this)}get shrinkToIndicatorThreshold(){return this.getAttribute("shrink-to-indicator-threshold")||65}#t(t){this.toggleAttribute("shrink-to-indicator",parseFloat(t)<this.shrinkToIndicatorThreshold)}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i),"data-attachment-size"===t&&e!==i&&this.#t(i)}}const d=(0,a.Zz)((0,o.RF)({mappings:{hostWidth:[{selector:()=>":host",property:"width"}],hostHeight:[{selector:()=>":host",property:"height"}],hostDirection:{property:"direction"},fontFamily:{},fontSize:{},fontWeight:{},textTransform:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-left"},{property:"padding-right"}],borderWidth:{},borderStyle:{},borderColor:{},borderRadius:{},backgroundColor:{},textColor:{property:"color"},textAlign:{},boxShadow:{},textIndent:{}}}),o.VO,o.tQ)(l)},11065(t,e,i){"use strict";i.r(e),i.d(e,{BadgeClass:()=>o.e,componentName:()=>o.T});var o=i(77888);customElements.define(o.T,o.e)},19624(t,e,i){"use strict";i.d(e,{J:()=>p,T:()=>l});var o=i(63200),n=i(25964),r=i(88961),a=i(98538),s=i(10767);const l=(0,n.xE)("button"),{host:d,label:c,slottedIcon:h}={host:{selector:()=>":host"},label:{selector:"::part(label)"},slottedIcon:{selector:()=>"::slotted(descope-icon)"}};let u;const p=(0,o.Zz)((0,r.DM)({triggers:[{attr:"full-width",value:"true"}]}),(0,r.RF)({mappings:{hostWidth:{property:"width"},hostMaxWidth:{...d,property:"max-width"},hostHeight:{property:"height"},hostDirection:{...d,property:"direction"},fontSize:{},fontFamily:{},fontWeight:{},cursor:{},backgroundColor:{},outlineOffset:{},outlineColor:{},outlineStyle:{},outlineWidth:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-right",fallback:"0.875em"},{property:"padding-left",fallback:"0.875em"}],labelTextColor:{property:"color"},iconColor:{selector:()=>"::slotted(*)",property:a.S.cssVarList.fill},labelTextDecoration:{...c,property:"text-decoration"},labelSpacing:{...c,property:"gap"},textAlign:{...c,property:"justify-content",fallback:"center"},iconSize:[{...h,property:"width"},{...h,property:"height"}]}}),s.G,r.VO,r.tQ)((0,r.tz)({slots:["","prefix","label","suffix"],wrappedEleName:"vaadin-button",style:()=>`\n\t\t\t\n\t:host {\n\t\tdisplay: inline-block;\n\t\tbox-sizing: border-box;\n\t}\n\tvaadin-button::before,\n\tvaadin-button::after {\n\t\topacity: 0;\n\t}\n\tvaadin-button {\n\t\tmargin: 0;\n\t\tmin-width: 0;\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tbox-shadow: none;\n\t}\n\tvaadin-button::part(label) {\n\t\tpadding: 0;\n width: 100%;\n\t}\n\tvaadin-button::part(prefix) {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n\n\t\t\t\n\tvaadin-button::part(prefix),\n\tvaadin-button::part(label) {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n\n\t\t\t${u}\n\t\t\tvaadin-button::part(label) { pointer-events: none; }\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${p.cssVarList.outlineWidth}) + var(${p.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width="true"]) {\n width: var(${p.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${p.cssVarList.hostHeight}) - var(${p.cssVarList.outlineWidth}) - var(${p.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square="true"]:not([full-width="true"]) {\n\t\t\t\twidth: calc(var(${p.cssVarList.hostWidth}) - var(${p.cssVarList.outlineWidth}) - var(${p.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex","class","style"],componentName:l})),{color:b,fontSize:g}=p.cssVarList;u=`\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading="true"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${b});\n\t\ttop: calc(50% - (var(${g}) / 2));\n\t\tleft: calc(50% - (var(${g}) / 2));\n\t\tborder-width: calc(var(${g}) / 10);\n\t\twidth: var(${g});\n\t\theight: var(${g});\n\t}\n\t:host([disabled="true"]),\n\t:host([loading="true"]) {\n\t\tpointer-events: none;\n\t}\n\t:host([loading="true"]) ::part(prefix),\n\t:host([loading="true"]) ::part(label) {\n\t\tvisibility: hidden;\n\t}\n`},10767(t,e,i){"use strict";i.d(e,{G:()=>o});const o=t=>class extends t{get isLoading(){return"true"===this.getAttribute("loading")}click(){this.isLoading||super.click()}}},30576(t,e,i){"use strict";i.r(e),i.d(e,{ButtonClass:()=>o.J,componentName:()=>o.T});var o=i(19624);i(83799),customElements.define(o.T,o.J)},98538(t,e,i){"use strict";i.d(e,{S:()=>l,T:()=>s});var o=i(88961),n=i(25964),r=i(8512),a=i(63200);const s=(0,n.xE)("icon"),l=(0,a.Zz)((0,o.RF)({mappings:{fill:[{},{property:r.q.cssVarList.fill}],height:{selector:()=>":host"},width:{selector:()=>":host"}}}),o.VO,o.tQ)((0,o.tz)({slots:[],wrappedEleName:"descope-image",style:()=>"\n :host {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n max-height: 100%;\n }\n ",excludeAttrsSync:["tabindex","class","style","st-height","st-width"],componentName:s}))},56737(t,e,i){"use strict";i.r(e),i.d(e,{IconClass:()=>o.S,componentName:()=>o.T}),i(53455);var o=i(98538);customElements.define(o.T,o.S)},8512(t,e,i){"use strict";i.d(e,{T:()=>l,q:()=>h});var o=i(88961),n=i(72270),r=i(63200),a=i(25964),s=i(18782);const l=(0,a.xE)("image"),d=["src","src-dark"];class c extends((0,n.qu)({componentName:l,baseSelector:"slot"})){static get observedAttributes(){return d}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<slot></slot>\n\t",(0,a.fz)("\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n :host > slot {\n width: 100%;\n height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n ::slotted(*) {\n width: 100%;\n\t\t\t}\n\n .hidden {\n display: none;\n }\n ",this)}init(){super.init?.(),this.toggleVisibility(this.getSrc)}onThemeChange(){this.renderImage()}toggleVisibility(t){t?this.classList.remove("hidden"):this.classList.add("hidden")}get altText(){return this.getAttribute("alt")||""}get legacySrc(){return this.getAttribute("src")}get themeSrc(){return this.getAttribute(`src-${this.currentThemeName}`)}get getSrc(){return this.themeSrc||this.legacySrc}updateFillColor(t){[t,...t.querySelectorAll("*[fill]")].forEach(t=>{t.setAttribute("fill",`var(${h.cssVarList.fill}, ${t.getAttribute("fill")||"''"})`)})}renderImage(){this.toggleVisibility(this.getSrc),(0,s.m)(this.getSrc,this.altText).then(t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))})}shouldRender(t){const e=this.getAttribute(t);return this.getSrc===e}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i),e!==i&&this.shouldRender(t)&&this.renderImage()}}const h=(0,r.Zz)((0,o.RF)({mappings:{fill:{},height:{selector:()=>":host"},width:{selector:()=>":host"}}}),o.VO,o.tQ)(c)},18782(t,e,i){"use strict";i.d(e,{m:()=>r});var o=i(25414);const n=t=>{const e=o.A.sanitize(t,{USE_PROFILES:{svg:!0,svgFilters:!0},ADD_TAGS:["image"],FORBID_TAGS:["defs"]});return(new DOMParser).parseFromString(e,"image/svg+xml").querySelector("svg")},r=async(t,e)=>{try{let i;if((t=>t.startsWith("data:image/svg+xml;base64,"))(t)){const e=atob(t.slice(26));i=n(e)}else if("svg"===(t=>{const e=t.match(/\.([0-9a-z]+)(?:[\\?#]|$)/i);return e?e[1]:null})(t)){const e=await fetch(t),o=await e.text();i=n(o)}else i=((t,e)=>{const i=document.createElement("img");return i.setAttribute("src",t),i.setAttribute("alt",e),i})(t,e);return i.style.setProperty("max-width","100%"),i.style.setProperty("max-height","100%"),i}catch{return null}}},53455(t,e,i){"use strict";i.r(e),i.d(e,{ImageClass:()=>o.q,componentName:()=>o.T});var o=i(8512);customElements.define(o.T,o.q)},66434(t,e,i){"use strict";i.d(e,{T:()=>s,s:()=>c});var o=i(88961),n=i(63200),r=i(25964),a=i(72270);const s=(0,r.xE)("text");class l extends((0,a.qu)({componentName:s,baseSelector:":host > slot"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <slot part="text-wrapper"></slot>\n ',(0,r.fz)("\n :host {\n display: inline-block;\n line-height: 1em;\n }\n :host > slot {\n width: 100%;\n display: inline-block;\n }\n ",this)}get hideWhenEmpty(){return"true"===this.getAttribute("hide-when-empty")}init(){super.init(),(0,r.Ge)(this,()=>{const t=!!this.childNodes.length;this.style.display=!t&&this.hideWhenEmpty?"none":""})}}const{host:d}={host:{selector:()=>":host"}},c=(0,n.Zz)((0,o.RF)({mappings:{hostWidth:{...d,property:"width"},hostDirection:{...d,property:"direction"},fontSize:{},textColor:[{property:"color"}],textLineHeight:{property:"line-height"},textLetterSpacing:{property:"letter-spacing"},textShadow:{},textAlign:{},textTransform:{},fontFamily:{},fontStyle:{},fontWeight:{},borderWidth:{},borderStyle:{},borderColor:{}}}),(0,o.DM)({triggers:[{attr:"full-width",value:"true"}]}),o.VO,o.tQ)(l)},63595(t,e,i){"use strict";i.r(e),i.d(e,{TextClass:()=>o.s,componentName:()=>o.T});var o=i(66434);customElements.define(o.T,o.s)},45554(t,e,i){"use strict";i.r(e),i.d(e,{UserAttributeClass:()=>k,componentName:()=>M});var o=i(66434),n=i(19624),r=i(77888),a=i(98538),s=i(25964),l=i(79365),d=i(81365),c=i(9696),h=i(97810),u=i(76368),p=i.n(u),b=i(65725),g=i.n(b),m=i(22966),y=i.n(m),x=i(78159),v=i.n(x);const M=(0,h.xE)("user-attribute");class f extends((0,d.q)({componentName:M,baseSelector:":host > .root"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML=`\n <div class="root">\n <descope-text st-text-align="auto" data-id="label-text" variant="body1" mode="secondary" class="label"></descope-text>\n <div class="content-wrapper">\n <descope-text st-text-align="auto" data-id="value-text" variant="body1" mode="primary" class="value"></descope-text>\n <div class="btn-wrapper">\n <descope-badge mode="default" bordered="true" size="xs"></descope-badge>\n <descope-button size="sm" data-id="copy-btn" variant="link" mode="primary">\n <slot name="copy-icon"></slot>\n <descope-icon class="check-icon" src="${v()}" src-dark="${v()}"></descope-icon>\n </descope-button>\n <descope-button size="sm" data-id="delete-btn" variant="link" mode="primary">\n <slot name="delete-icon"></slot>\n </descope-button>\n <descope-button size="sm" data-id="edit-btn" variant="link" mode="primary">\n <slot name="edit-icon"></slot>\n </descope-button>\n </div>\n </div>\n </div>\n\t\t`,(0,s.fz)(`\n :host {\n\t\t\t\t\tdisplay: inline-flex;\n container-type: inline-size;\n\t\t\t\t}\n\n .root {\n display: flex;\n width: 100%;\n height: 100%;\n align-items: center;\n }\n\n ::slotted(*) {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n @container (max-width: 529px) {\n .root {\n flex-wrap: wrap;\n }\n }\n\n .btn-wrapper {\n display: flex;\n justify-content: space-between;\n align-items: center;\n flex-grow: 0;\n flex-shrink: 0;\n }\n\n slot[name="edit-icon"],\n slot[name="delete-icon"],\n slot[name="copy-icon"] {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n }\n\n descope-button[data-id="copy-btn"].hidden {\n display: none;\n }\n\n descope-button[data-id="copy-btn"] .check-icon {\n display: none;\n }\n\n descope-button[data-id="copy-btn"].copied slot[name="copy-icon"] {\n display: none;\n }\n\n descope-button[data-id="copy-btn"].copied .check-icon {\n display: inline-flex;\n }\n\n .content-wrapper {\n display: flex;\n flex-grow: 1;\n align-items: center;\n }\n\n descope-text::part(text-wrapper) {\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n width: initial;\n }\n\n descope-text {\n display: inline-flex;\n max-width: 100%;\n min-width: 0;\n }\n\n .label {\n flex-grow: 1;\n width: 100%;\n }\n\n .value {\n flex-grow: 1;\n }\n\n descope-badge {\n margin-inline-end: 10px;\n }\n\n .hidden {\n visibility: hidden;\n width: 0;\n }\n\n descope-text[data-id="label-text"].required:after {\n content: '*';\n color: var(${o.s.cssVarList.textColor});\n }\n\n :host([readonly="true"]) descope-button:not([data-id="copy-btn"]) {\n visibility: hidden;\n width: 0;\n }\n `,this),this.copyButton=this.shadowRoot.querySelector('descope-button[data-id="copy-btn"]'),this.deleteButton=this.shadowRoot.querySelector('descope-button[data-id="delete-btn"]'),this.editButton=this.shadowRoot.querySelector('descope-button[data-id="edit-btn"]'),this.badge=this.shadowRoot.querySelector("descope-badge"),this.labelText=this.shadowRoot.querySelector('descope-text[data-id="label-text"]'),this.valueText=this.shadowRoot.querySelector('descope-text[data-id="value-text"]')}onLabelChange(){this.labelText.innerText=this.label,this.labelText.setAttribute("title",this.label)}onValueOrPlaceholderChange(){const t=this.value||this.placeholder,e=this.value?"primary":"secondary";this.valueText.innerText=t,this.valueText.setAttribute("title",t),this.valueText.setAttribute("mode",e)}onBadgeLabelChange(){this.badgeLabel?(this.badge.innerText=this.badgeLabel,this.badge.style.display=""):this.badge.style.display="none"}onBadgeTooltipTextChange(){this.badge.setAttribute("title",this.badgeTooltipText||this.badgeLabel)}updateButtonLabel(t,e){let i=t.querySelector("span.btn-label");e?(i||(i=document.createElement("span"),i.classList.add("btn-label"),t.appendChild(i)),i.innerText=e):i?.remove()}onIsRequiredChange(){this.labelText.classList.toggle("required",this.isRequired)}get label(){return this.getAttribute("label")||""}get value(){return this.getAttribute("value")||""}get placeholder(){return this.getAttribute("placeholder")||""}get isRequired(){return"true"===this.getAttribute("required")}get badgeLabel(){return this.getAttribute("badge-label")||""}get badgeTooltipText(){return this.getAttribute("badge-tooltip-text")||""}get editButtonLabel(){return this.getAttribute("edit-button-label")||""}get deleteButtonLabel(){return this.getAttribute("delete-button-label")||""}get isDeleteHidden(){return"true"===this.getAttribute("hide-delete")}get isCopyEnabled(){return"true"===this.getAttribute("show-copy")}get copyButtonLabel(){return this.getAttribute("copy-button-label")||""}init(){this.onLabelChange(),this.onValueOrPlaceholderChange(),this.onIsRequiredChange(),this.onBadgeLabelChange(),this.onBadgeTooltipTextChange(),this.updateButtonLabel(this.editButton,this.editButtonLabel),this.updateButtonLabel(this.deleteButton,this.deleteButtonLabel),this.updateButtonLabel(this.copyButton,this.copyButtonLabel),this.handleDeleteButtonVisibility(),this.handleCopyButtonState(),this.deleteButton.addEventListener("click",()=>this.dispatchEvent(new CustomEvent("delete-clicked",{bubbles:!0,composed:!0}))),this.editButton.addEventListener("click",()=>this.dispatchEvent(new CustomEvent("edit-clicked",{bubbles:!0,composed:!0}))),this.copyButton.addEventListener("click",()=>this.#e()),this.setDefaultChildren()}#e(){this.value&&!this.isDraggable&&navigator.clipboard&&navigator.clipboard.writeText(this.value).then(()=>{this.copyButton.classList.add("copied"),setTimeout(()=>this.copyButton.classList.remove("copied"),2e3)}).catch(()=>{})}handleCopyButtonState(){this.copyButton.classList.toggle("hidden",!this.isCopyEnabled),this.value?this.copyButton.removeAttribute("disabled"):this.copyButton.setAttribute("disabled","true")}#i(t,e){const i=document.createElement("descope-icon");i.setAttribute("src",t),i.setAttribute("src-dark",t),i.setAttribute("slot",e),this.appendChild(i)}setDefaultChildren(){this.querySelector('[slot="delete-icon"]')||this.#i(p(),"delete-icon"),this.querySelector('[slot="edit-icon"]')||this.#i(g(),"edit-icon"),this.setDefaultCopyIcon()}setDefaultCopyIcon(){this.isCopyEnabled&&!this.querySelector('[slot="copy-icon"]')&&this.#i(y(),"copy-icon")}static get observedAttributes(){return["label","value","placeholder","required","badge-label","badge-tooltip-text","edit-button-label","delete-button-label","copy-button-label","hide-delete","show-copy"].concat(super.observedAttributes)}handleDeleteButtonVisibility(){this.deleteButton.classList.toggle("hidden",this.isRequired||!this.value||this.isDeleteHidden)}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i),e!==i&&("label"===t?this.onLabelChange():"value"===t||"placeholder"===t?this.onValueOrPlaceholderChange():"required"===t?this.onIsRequiredChange():"badge-label"===t?this.onBadgeLabelChange():"badge-tooltip-text"===t?this.onBadgeTooltipTextChange():"edit-button-label"===t?this.updateButtonLabel(this.editButton,this.editButtonLabel):"delete-button-label"===t?this.updateButtonLabel(this.deleteButton,this.deleteButtonLabel):"copy-button-label"===t?this.updateButtonLabel(this.copyButton,this.copyButtonLabel):"show-copy"===t&&this.setDefaultCopyIcon(),"value"!==t&&"required"!==t&&"hide-delete"!==t||this.handleDeleteButtonVisibility(),"value"!==t&&"show-copy"!==t||this.handleCopyButtonState())}}const{host:w,textFields:T,buttons:D,badge:A,labelText:I,contentWrapper:L}={host:{selector:()=>":host"},textFields:{selector:"descope-text"},labelText:{selector:'descope-text[data-id="label-text"]'},buttons:{selector:"descope-button"},badge:{selector:"descope-badge"},contentWrapper:{selector:" .content-wrapper"}},k=(0,c.Zz)((0,l.RF)({mappings:{hostWidth:{...w,property:"width"},hostMinWidth:{...w,property:"min-width"},hostMaxWidth:{...w,property:"max-width"},hostDirection:[{...w,property:"direction"},{...T,property:o.s.cssVarList.hostDirection},{...D,property:n.J.cssVarList.hostDirection},{...A,property:r.e.cssVarList.hostDirection}],labelMinWidth:{...I,property:"min-width"},contentMinWidth:{...L,property:"min-width"},badgeMaxWidth:{...A,property:"max-width"},itemsGap:[{property:"gap"},{...L,property:"gap"}],iconColor:[{selector:()=>"::slotted(*)",property:a.S.cssVarList.fill},{selector:()=>".check-icon",property:a.S.cssVarList.fill}]}}),l.VO,l.tQ)(f);i(63595),i(30576),i(11065),i(56737),customElements.define(M,k)},89389(t,e,i){"use strict";i.d(e,{$:()=>b});var o=i(13256),n=i(55774),r=i(82901),a=i(72562),s=i(81488),l=i(87550);const d=i(51450).AH`
|
|
3
3
|
:host {
|
|
4
4
|
display: inline-block;
|
|
5
5
|
position: relative;
|
|
@@ -59,7 +59,7 @@
|
|
|
59
59
|
outline-color: GrayText;
|
|
60
60
|
}
|
|
61
61
|
}
|
|
62
|
-
`;var
|
|
62
|
+
`;var c=i(84467),h=i(53149),u=i(36176);const p=t=>class extends((0,c.e)((0,u.l)((0,h.y)(t)))){static get properties(){return{tabindex:{type:Number,value:0,reflectToAttribute:!0}}}get _activeKeys(){return["Enter"," "]}ready(){super.ready(),this.hasAttribute("role")||this.setAttribute("role","button")}_onKeyDown(t){super._onKeyDown(t),t.altKey||t.shiftKey||t.ctrlKey||t.metaKey||this._activeKeys.includes(t.key)&&(t.preventDefault(),this.click())}};(0,l.SF)("vaadin-button",d,{moduleId:"vaadin-button-styles"});class b extends(p((0,a.q)((0,l.cp)((0,n.w)(o.Pu))))){static get is(){return"vaadin-button"}static get template(){return o.qy`
|
|
63
63
|
<div class="vaadin-button-container">
|
|
64
64
|
<span part="prefix" aria-hidden="true">
|
|
65
65
|
<slot name="prefix"></slot>
|