@descope/web-components-ui 1.0.395 → 1.0.396

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.
@@ -1,5 +1,5 @@
1
1
  /*! For license information please see descope-email-field-index-js.js.LICENSE.txt */
2
- "use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[5695],{91046:(t,e,n)=>{n.r(e),n.d(e,{EmailFieldClass:()=>m}),n(70297);var r=n(90500),i=n(6052);const o=i.AH`
2
+ "use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[5695],{91046:(t,e,n)=>{n.r(e),n.d(e,{EmailFieldClass:()=>m}),n(70297);var i=n(90500),r=n(6052);const o=r.AH`
3
3
  :host([dir='rtl']) [part='input-field'] ::slotted(input) {
4
4
  --_lumo-text-field-overflow-mask-image: linear-gradient(to left, transparent, #000 1.25em);
5
5
  }
@@ -7,7 +7,7 @@
7
7
  :host([dir='rtl']) [part='input-field'] ::slotted(input:placeholder-shown) {
8
8
  --_lumo-text-field-overflow-mask-image: none;
9
9
  }
10
- `;(0,i.SF)("vaadin-email-field",[r.k,o],{moduleId:"lumo-email-field"});var l=n(38735),a=n(34068);const p=n(16684).AH`
10
+ `;(0,r.SF)("vaadin-email-field",[i.k,o],{moduleId:"lumo-email-field"});var l=n(38735),a=n(34068);const p=n(16684).AH`
11
11
  :host([dir='rtl']) [part='input-field'] {
12
12
  direction: ltr;
13
13
  }
@@ -16,7 +16,7 @@
16
16
  direction: rtl;
17
17
  text-align: left;
18
18
  }
19
- `;(0,i.SF)("vaadin-email-field",p,{moduleId:"vaadin-email-field-styles"});class s 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,l.X)(s);var d=n(94619),u=n(93826),c=n(7138),h=n(14944),y=n(33177);const f=(0,h.xE)("email-field"),m=(0,c.Zz)((0,d.RF)({mappings:u.A}),d.VO,(0,d.RV)({inputType:"email",autocompleteType:"username",includeAttrs:["disabled","readonly","pattern"]}),(0,d.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),d.tQ,(t=>class extends t{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(${m.cssVarList.inputOutlineWidth}) + var(${m.cssVarList.inputOutlineOffset}));\n box-sizing: border-box;\n\t\t\t}\n ${(0,y.$J)("vaadin-email-field")}\n\t\t\t${(0,y.cy)(m.cssVarList)}\n\t\t\t${(0,y.LJ)("vaadin-email-field",m.cssVarList)}\n ${(0,y.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"],componentName:f}));customElements.define(f,m)},93826:(t,e,n)=>{n.d(e,{A:()=>x});const{host:r,label:i,placeholder:o,requiredIndicator:l,inputField:a,input:p,inputMask:s,helperText:d,errorMessage:u,disabledPlaceholder:c,inputDisabled:h,inputIcon:y,externalInput:f,externalInputDisabled:m,externalPlaceholder:g,externalDisabledPlaceholder:b}={host:{selector:()=>":host"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},placeholder:[{selector:"> input:placeholder-shown"},{selector:()=>":host::slotted(input:placeholder-shown)"}],disabledPlaceholder:{selector:"> input:disabled::placeholder"},inputField:{selector:"::part(input-field)"},input:{selector:"input"},inputMask:{selector:"::part(input-field)::before"},inputDisabled:{selector:"input:disabled"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"},inputIcon:{selector:"vaadin-icon"},externalInput:{selector:()=>"::slotted(input)"},externalInputDisabled:{selector:()=>"::slotted(input:disabled)"},externalPlaceholder:{selector:()=>"::slotted(input:placeholder-shown)"},externalDisabledPlaceholder:{selector:()=>"::slotted(input:disabled::placeholder)"}},x={fontSize:[{},r],fontFamily:[i,a,d,u],labelFontSize:{...i,property:"font-size"},labelFontWeight:{...i,property:"font-weight"},labelTextColor:[{...i,property:"color"},{...l,property:"color"},{...i,property:"-webkit-text-fill-color"},{...l,property:"-webkit-text-fill-color"}],hostWidth:{...r,property:"width"},hostMinWidth:{...r,property:"min-width"},hostDirection:{...r,property:"direction"},inputDirection:{...p,property:"direction"},inputBackgroundColor:[{...a,property:"background-color"},{...s,property:"background-color"}],errorMessageTextColor:{...u,property:"color"},helperTextColor:{...d,property:"-webkit-text-fill-color"},inputValueTextColor:[{...a,property:"color"},{...h,property:"-webkit-text-fill-color"},{...m,property:"-webkit-text-fill-color"}],inputCaretTextColor:[{...p,property:"caret-color"},{...f,property:"caret-color"}],labelRequiredIndicator:{...l,property:"content"},inputBorderColor:{...a,property:"border-color"},inputBorderWidth:{...a,property:"border-width"},inputBorderStyle:{...a,property:"border-style"},inputBorderRadius:{...a,property:"border-radius"},inputHeight:{...a,property:"height"},inputHorizontalPadding:[{...p,property:"padding-left"},{...p,property:"padding-right"},{...f,property:"padding-left"},{...f,property:"padding-right"}],inputOutlineColor:{...a,property:"outline-color"},inputOutlineStyle:{...a,property:"outline-style"},inputOutlineWidth:{...a,property:"outline-width"},inputOutlineOffset:{...a,property:"outline-offset"},textAlign:{},inputTextAlign:[{...p,property:"text-align"},{...f,property:"text-align"}],inputPlaceholderColor:[{selector:()=>":host input:placeholder-shown",property:"color"},{...g,property:"color"},{...o,property:"color"},{...c,property:"-webkit-text-fill-color"},{...b,property:"-webkit-text-fill-color"}],labelPosition:{...i,property:"position"},labelTopPosition:{...i,property:"top"},labelHorizontalPosition:[{...i,property:"left"},{...i,property:"right"}],inputTransformY:{...i,property:"transform"},inputTransition:{...i,property:"transition"},marginInlineStart:{...i,property:"margin-inline-start"},placeholderOpacity:[{selector:"> input:placeholder-shown",property:"opacity"},{...g,property:"opacity"}],inputVerticalAlignment:[{...a,property:"align-items"},{...f,property:"align-items"}],valueInputHeight:[{...p,property:"height"},{...f,property:"height"}],valueInputMarginBottom:[{...p,property:"margin-bottom"},{...f,property:"margin-bottom"}],inputIconOffset:[{...y,property:"margin-right"},{...y,property:"margin-left"}],inputIconSize:{...y,property:"font-size"},inputIconColor:{...y,property:"color"}}},33177:(t,e,n)=>{n.d(e,{$J:()=>c,I4:()=>l,Kl:()=>h,LJ:()=>u,Qv:()=>o,X6:()=>p,cy:()=>r,fu:()=>s,kG:()=>d,lS:()=>a,zm:()=>i});const r=t=>`\n :host {\n padding: calc(var(${t.inputOutlineWidth}) + var(${t.inputOutlineOffset}))\n }\n`,i=t=>`\n ${t} {\n margin: 0;\n padding: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n }\n`,o=t=>`\n ${t}::part(input-field) {\n overflow: hidden;\n padding: 0;\n box-shadow: none;\n }\n`,l=t=>`\n ${t} > label,\n ${t}::part(label),\n ${t}::part(required-indicator) {\n cursor: pointer;\n }\n`,a=(t,e="input")=>`\n ${t}[disabled] > ${e}:placeholder-shown,\n\t${t}[readonly] > ${e}:placeholder-shown {\n\t\topacity: 1;\n\t}\n`,p=()=>"\n :host {\n --vaadin-field-default-width: auto;\n box-sizing: border-box;\n }\n",s=t=>`\n ${t}::part(input-field)::after {\n opacity: 0;\n }\n`,d=t=>`\n ${t}::part(input-field)::after {\n background: none;\n }\n`,u=(t,e)=>`\n ${i(t)}\n ${l(t)}\n ${a(t)}\n ${o(t)}\n ${((t,e)=>`\n ${t} input:-webkit-autofill,\n ${t} input:-webkit-autofill::first-line,\n ${t} input:-webkit-autofill:hover,\n ${t} input:-webkit-autofill:active,\n ${t} input:-webkit-autofill:focus {\n -webkit-text-fill-color: var(${e.inputValueTextColor});\n box-shadow: 0 0 0 var(${e.inputHeight}) var(${e.inputBackgroundColor}) inset;\n }\n`)(t,e)}\n ${d(t)}\n ${(t=>`\n ${t}::before {\n\t\theight: unset;\n\t}\n`)(t)}\n ${(t=>`\n ${t} > input {\n -webkit-mask-image: none;\n min-height: 0;\n box-sizing: border-box;\n }\n`)(t)}\n ${(t=>`\n ${t}::part(input-field)::after {\n border: none;\n }\n`)(t)}\n`,c=t=>`\n :host ::part(error-message) {\n direction: ltr;\n }\n :host([required]) ::part(required-indicator) {\n width: 1em;\n display: inline-flex;\n }\n :host([required]) ::part(required-indicator)::after {\n position: static;\n }\n :host([has-label]) ::part(label) {\n padding-right: 0;\n padding-bottom: 0;\n display: flex;\n width: 100%;\n }\n ${t} [slot="label"] {\n max-width: calc(100% - 1em);\n overflow: hidden;\n text-overflow: ellipsis;\n padding-bottom: 0.5em;\n }\n`,h=()=>'\n :host([label-type="floating"]) {\n position: relative;\n }\n :host([label-type="floating"][has-label]) [slot="label"] {\n padding: 0;\n }\n :host([label-type="floating"][has-label]) > ::part(label) {\n z-index: 1;\n padding: 0;\n width: auto;\n }\n '},15408:(t,e,n)=>{n.d(e,{f:()=>i});var r=n(32065);class i extends r.r{constructor(t,e){super(t,"input","input",{initializer:(t,n)=>{n.value&&(t.value=n.value),n.type&&t.setAttribute("type",n.type),t.id=this.defaultId,"function"==typeof e&&e(t)},useUniqueId:!0})}}},53430:(t,e,n)=>{n.d(e,{a:()=>i});var r=n(32318);const i=t=>class extends((0,r.R)(t)){static get properties(){return{autocomplete:{type:String},autocorrect:{type:String},autocapitalize:{type:String,reflectToAttribute:!0}}}static get delegateAttrs(){return[...super.delegateAttrs,"autocapitalize","autocomplete","autocorrect"]}get __data(){return this.__dataValue||{}}set __data(t){this.__dataValue=t}_inputElementChanged(t){super._inputElementChanged(t),t&&(t.value&&t.value!==this.value&&(console.warn(`Please define value on the <${this.localName}> component!`),t.value=""),this.value&&(t.value=this.value))}_setFocused(t){super._setFocused(t),!t&&document.hasFocus()&&this.validate()}_onInput(t){super._onInput(t),this.invalid&&this.validate()}_valueChanged(t,e){super._valueChanged(t,e),void 0!==e&&this.invalid&&this.validate()}}},34068:(t,e,n)=>{n.d(e,{A:()=>h}),n(9077);var r=n(33791),i=n(38735),o=n(31846),l=n(58074),a=n(89385),p=n(6052),s=n(15408),d=n(53430),u=n(3550);const c=t=>class extends((0,d.a)(t)){static get properties(){return{maxlength:{type:Number},minlength:{type:Number},pattern:{type:String}}}static get delegateAttrs(){return[...super.delegateAttrs,"maxlength","minlength","pattern"]}static get constraints(){return[...super.constraints,"maxlength","minlength","pattern"]}constructor(){super(),this._setType("text")}get clearElement(){return this.$.clearButton}ready(){super.ready(),this.addController(new s.f(this,(t=>{this._setInputElement(t),this._setFocusElement(t),this.stateTarget=t,this.ariaTarget=t}))),this.addController(new u.q(this.inputElement,this._labelController))}};(0,p.SF)("vaadin-text-field",a.k,{moduleId:"vaadin-text-field-styles"});class h extends(c((0,p.cp)((0,o.q)(r.Pu)))){static get is(){return"vaadin-text-field"}static get template(){return r.qy`
19
+ `;(0,r.SF)("vaadin-email-field",p,{moduleId:"vaadin-email-field-styles"});class s 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,l.X)(s);var d=n(94619),u=n(93826),c=n(7138),h=n(14944),y=n(33177);const f=(0,h.xE)("email-field"),m=(0,c.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,(t=>class extends t{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(${m.cssVarList.inputOutlineWidth}) + var(${m.cssVarList.inputOutlineOffset}));\n box-sizing: border-box;\n\t\t\t}\n ${(0,y.$J)("vaadin-email-field")}\n\t\t\t${(0,y.cy)(m.cssVarList)}\n\t\t\t${(0,y.LJ)("vaadin-email-field",m.cssVarList)}\n ${(0,y.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"],componentName:f}));customElements.define(f,m)},93826:(t,e,n)=>{n.d(e,{A:()=>x});const{host:i,label:r,placeholder:o,requiredIndicator:l,inputField:a,input:p,inputMask:s,helperText:d,errorMessage:u,disabledPlaceholder:c,inputDisabled:h,inputIcon:y,externalInput:f,externalInputDisabled:m,externalPlaceholder:g,externalDisabledPlaceholder:b}={host:{selector:()=>":host"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},placeholder:[{selector:"> input:placeholder-shown"},{selector:()=>":host::slotted(input:placeholder-shown)"}],disabledPlaceholder:{selector:"> input:disabled::placeholder"},inputField:{selector:"::part(input-field)"},input:{selector:"input"},inputMask:{selector:"::part(input-field)::before"},inputDisabled:{selector:"input:disabled"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"},inputIcon:{selector:"vaadin-icon"},externalInput:{selector:()=>"::slotted(input)"},externalInputDisabled:{selector:()=>"::slotted(input:disabled)"},externalPlaceholder:{selector:()=>"::slotted(input:placeholder-shown)"},externalDisabledPlaceholder:{selector:()=>"::slotted(input:disabled::placeholder)"}},x={fontSize:[{},i],fontFamily:[r,a,d,u],labelFontSize:{...r,property:"font-size"},labelFontWeight:{...r,property:"font-weight"},labelTextColor:[{...r,property:"color"},{...l,property:"color"},{...r,property:"-webkit-text-fill-color"},{...l,property:"-webkit-text-fill-color"}],hostWidth:{...i,property:"width"},hostMinWidth:{...i,property:"min-width"},hostDirection:{...i,property:"direction"},inputDirection:{...p,property:"direction"},inputBackgroundColor:[{...a,property:"background-color"},{...s,property:"background-color"}],errorMessageTextColor:{...u,property:"color"},helperTextColor:{...d,property:"-webkit-text-fill-color"},inputValueTextColor:[{...a,property:"color"},{...h,property:"-webkit-text-fill-color"},{...m,property:"-webkit-text-fill-color"}],inputCaretTextColor:[{...p,property:"caret-color"},{...f,property:"caret-color"}],labelRequiredIndicator:{...l,property:"content"},inputBorderColor:{...a,property:"border-color"},inputBorderWidth:{...a,property:"border-width"},inputBorderStyle:{...a,property:"border-style"},inputBorderRadius:{...a,property:"border-radius"},inputHeight:{...a,property:"height"},inputHorizontalPadding:[{...p,property:"padding-left"},{...p,property:"padding-right"},{...f,property:"padding-left"},{...f,property:"padding-right"}],inputOutlineColor:{...a,property:"outline-color"},inputOutlineStyle:{...a,property:"outline-style"},inputOutlineWidth:{...a,property:"outline-width"},inputOutlineOffset:{...a,property:"outline-offset"},textAlign:{},inputTextAlign:[{...p,property:"text-align"},{...f,property:"text-align"}],inputPlaceholderColor:[{selector:()=>":host input:placeholder-shown",property:"color"},{...g,property:"color"},{...o,property:"color"},{...c,property:"-webkit-text-fill-color"},{...b,property:"-webkit-text-fill-color"}],labelPosition:{...r,property:"position"},labelTopPosition:{...r,property:"top"},labelHorizontalPosition:[{...r,property:"left"},{...r,property:"right"}],inputTransformY:{...r,property:"transform"},inputTransition:{...r,property:"transition"},marginInlineStart:{...r,property:"margin-inline-start"},placeholderOpacity:[{selector:"> input:placeholder-shown",property:"opacity"},{...g,property:"opacity"}],inputVerticalAlignment:[{...a,property:"align-items"},{...f,property:"align-items"}],valueInputHeight:[{...p,property:"height"},{...f,property:"height"}],valueInputMarginBottom:[{...p,property:"margin-bottom"},{...f,property:"margin-bottom"}],inputIconOffset:[{...y,property:"margin-right"},{...y,property:"margin-left"}],inputIconSize:{...y,property:"font-size"},inputIconColor:{...y,property:"color"}}},33177:(t,e,n)=>{n.d(e,{$J:()=>c,I4:()=>l,Kl:()=>h,LJ:()=>u,Qv:()=>o,X6:()=>p,cy:()=>i,fu:()=>s,kG:()=>d,lS:()=>a,zm:()=>r});const i=t=>`\n :host {\n padding: calc(var(${t.inputOutlineWidth}) + var(${t.inputOutlineOffset}))\n }\n`,r=t=>`\n ${t} {\n margin: 0;\n padding: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n }\n`,o=t=>`\n ${t}::part(input-field) {\n overflow: hidden;\n padding: 0;\n box-shadow: none;\n }\n`,l=t=>`\n ${t} > label,\n ${t}::part(label),\n ${t}::part(required-indicator) {\n cursor: pointer;\n }\n`,a=(t,e="input")=>`\n ${t}[disabled] > ${e}:placeholder-shown,\n\t${t}[readonly] > ${e}:placeholder-shown {\n\t\topacity: 1;\n\t}\n`,p=()=>"\n :host {\n --vaadin-field-default-width: auto;\n box-sizing: border-box;\n }\n",s=t=>`\n ${t}::part(input-field)::after {\n opacity: 0;\n }\n`,d=t=>`\n ${t}::part(input-field)::after {\n background: none;\n }\n`,u=(t,e)=>`\n ${r(t)}\n ${l(t)}\n ${a(t)}\n ${o(t)}\n ${((t,e)=>`\n ${t} input:-webkit-autofill,\n ${t} input:-webkit-autofill::first-line,\n ${t} input:-webkit-autofill:hover,\n ${t} input:-webkit-autofill:active,\n ${t} input:-webkit-autofill:focus {\n -webkit-text-fill-color: var(${e.inputValueTextColor});\n box-shadow: 0 0 0 var(${e.inputHeight}) var(${e.inputBackgroundColor}) inset;\n }\n`)(t,e)}\n ${d(t)}\n ${(t=>`\n ${t}::before {\n\t\theight: unset;\n\t}\n`)(t)}\n ${(t=>`\n ${t} > input {\n -webkit-mask-image: none;\n min-height: 0;\n box-sizing: border-box;\n }\n`)(t)}\n ${(t=>`\n ${t}::part(input-field)::after {\n border: none;\n }\n`)(t)}\n`,c=t=>`\n :host ::part(error-message) {\n direction: ltr;\n }\n :host([required]) ::part(required-indicator) {\n width: 1em;\n display: inline-flex;\n }\n :host([required]) ::part(required-indicator)::after {\n position: static;\n }\n :host([has-label]) ::part(label) {\n padding-right: 0;\n padding-bottom: 0;\n display: flex;\n width: 100%;\n }\n ${t} [slot="label"] {\n max-width: calc(100% - 1em);\n overflow: hidden;\n text-overflow: ellipsis;\n padding-bottom: 0.5em;\n }\n`,h=()=>'\n :host([label-type="floating"]) {\n position: relative;\n }\n :host([label-type="floating"][has-label]) [slot="label"] {\n padding: 0;\n }\n :host([label-type="floating"][has-label]) > ::part(label) {\n z-index: 1;\n padding: 0;\n width: auto;\n }\n '},15408:(t,e,n)=>{n.d(e,{f:()=>r});var i=n(32065);class r extends i.r{constructor(t,e){super(t,"input","input",{initializer:(t,n)=>{n.value&&(t.value=n.value),n.type&&t.setAttribute("type",n.type),t.id=this.defaultId,"function"==typeof e&&e(t)},useUniqueId:!0})}}},53430:(t,e,n)=>{n.d(e,{a:()=>r});var i=n(32318);const r=t=>class extends((0,i.R)(t)){static get properties(){return{autocomplete:{type:String},autocorrect:{type:String},autocapitalize:{type:String,reflectToAttribute:!0}}}static get delegateAttrs(){return[...super.delegateAttrs,"autocapitalize","autocomplete","autocorrect"]}get __data(){return this.__dataValue||{}}set __data(t){this.__dataValue=t}_inputElementChanged(t){super._inputElementChanged(t),t&&(t.value&&t.value!==this.value&&(console.warn(`Please define value on the <${this.localName}> component!`),t.value=""),this.value&&(t.value=this.value))}_setFocused(t){super._setFocused(t),!t&&document.hasFocus()&&this.validate()}_onInput(t){super._onInput(t),this.invalid&&this.validate()}_valueChanged(t,e){super._valueChanged(t,e),void 0!==e&&this.invalid&&this.validate()}}},34068:(t,e,n)=>{n.d(e,{A:()=>h}),n(9077);var i=n(33791),r=n(38735),o=n(31846),l=n(58074),a=n(89385),p=n(6052),s=n(15408),d=n(53430),u=n(3550);const c=t=>class extends((0,d.a)(t)){static get properties(){return{maxlength:{type:Number},minlength:{type:Number},pattern:{type:String}}}static get delegateAttrs(){return[...super.delegateAttrs,"maxlength","minlength","pattern"]}static get constraints(){return[...super.constraints,"maxlength","minlength","pattern"]}constructor(){super(),this._setType("text")}get clearElement(){return this.$.clearButton}ready(){super.ready(),this.addController(new s.f(this,(t=>{this._setInputElement(t),this._setFocusElement(t),this.stateTarget=t,this.ariaTarget=t}))),this.addController(new u.q(this.inputElement,this._labelController))}};(0,p.SF)("vaadin-text-field",a.k,{moduleId:"vaadin-text-field-styles"});class h extends(c((0,p.cp)((0,o.q)(i.Pu)))){static get is(){return"vaadin-text-field"}static get template(){return i.qy`
20
20
  <style>
21
21
  [part='input-field'] {
22
22
  flex-grow: 0;
@@ -51,4 +51,4 @@
51
51
  </div>
52
52
  </div>
53
53
  <slot name="tooltip"></slot>
54
- `}static get properties(){return{maxlength:{type:Number},minlength:{type:Number}}}ready(){super.ready(),this._tooltipController=new l.I(this),this._tooltipController.setPosition("top"),this._tooltipController.setAriaTarget(this.inputElement),this.addController(this._tooltipController)}}(0,i.X)(h)},70297:(t,e,n)=>{n(37451);var r=n(90500);(0,n(6052).SF)("vaadin-text-field",r.k,{moduleId:"lumo-text-field-styles"}),n(34068)}}]);
54
+ `}static get properties(){return{maxlength:{type:Number},minlength:{type:Number}}}ready(){super.ready(),this._tooltipController=new l.I(this),this._tooltipController.setPosition("top"),this._tooltipController.setAriaTarget(this.inputElement),this.addController(this._tooltipController)}}(0,r.X)(h)},70297:(t,e,n)=>{n(37451);var i=n(90500);(0,n(6052).SF)("vaadin-text-field",i.k,{moduleId:"lumo-text-field-styles"}),n(34068)}}]);
@@ -1 +1 @@
1
- "use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[8603],{25827:(t,e,i)=>{i.d(e,{y:()=>s});var n=i(7138),r=i(94619),o=i(70263);const s=(...t)=>(0,n.Zz)(r.XX,r._$,r.yF,r.jd)((0,o.q)(...t))},41029:(t,e,i)=>{i.d(e,{M:()=>w,T:()=>d});var n=i(14944),r=i(7138),o=i(94619),s=i(83367),a=i(14372),l=i(33177),p=i(9775);const d=(0,n.xE)("new-password"),u=p.w.cssVarList,{host:c,label:h,internalInputsWrapper:b,errorMessage:g,helperText:y,passwordInput:m,policyPreview:v}={host:{selector:()=>":host"},label:{selector:"::part(label)"},internalInputsWrapper:{selector:"descope-new-password-internal .wrapper"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"},passwordInput:{selector:"descope-password"},policyPreview:{selector:"descope-policy-validation"}},w=(0,r.Zz)((0,o.RF)({mappings:{fontSize:[c,{},{selector:a.M.componentName,property:a.M.cssVarList.fontSize}],fontFamily:[h,g,y],labelFontSize:{...h,property:"font-size"},labelFontWeight:{...h,property:"font-weight"},labelTextColor:{...h,property:"color"},errorMessageTextColor:{...g,property:"color"},hostWidth:{...c,property:"width"},hostMinWidth:{...c,property:"min-width"},hostDirection:[{...c,property:"direction"},{...m,property:a.M.cssVarList.hostDirection}],inputsRequiredIndicator:{...c,property:"content"},spaceBetweenInputs:{...b,property:"gap"},policyPreviewBackgroundColor:{...v,property:u.backgroundColor},policyPreviewPadding:{...v,property:u.padding},valueInputHeight:{...m,property:a.M.cssVarList.valueInputHeight},valueInputMarginBottom:{...m,property:a.M.cssVarList.valueInputMarginBottom}}}),o.VO,(0,o.OZ)({proxyProps:["value","selectionStart"]}),(t=>class extends t{init(){super.init?.();const t=document.createElement("template"),e=this.getAttribute("external-input");t.innerHTML=`\n\t\t\t<${s.T}\n\t\t\t\tname="new-password"\n\t\t\t\ttabindex="-1"\n\t\t\t\tslot="input"\n external-input="${e}"\n\t\t\t>\n </${s.T}>\n\t\t\t`,this.baseElement.appendChild(t.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(s.T),"true"===this.getAttribute("external-input")&&this.initExternalInput(),(0,n.EA)(this,this.inputElement,{includeAttrs:["password-label","password-placeholder","confirm-label","confirm-placeholder","full-width","size","bordered","label","has-confirm","invalid","readonly","draggable","has-validation","policy-label","active-policies","available-policies","data-password-policy-value-minlength","label-type","manual-visibility-toggle"]})}createSlottedExternalInput(t,e){const i=t.querySelector("input"),n=document.createElement("slot"),r=i.getAttribute("slot");n.setAttribute("name",e),n.setAttribute("slot",r),t.appendChild(n),i.setAttribute("slot",e),i.setAttribute("data-hidden-input","true"),this.appendChild(i)}initExternalInput(){this.passwordInput=this.inputElement.querySelector('[data-id="password"]'),this.confirmInput=this.inputElement.querySelector('[data-id="confirm"]'),this.createSlottedExternalInput(this.passwordInput,"external-password-input"),this.createSlottedExternalInput(this.confirmInput,"external-confirm-input")}}))((0,o.tz)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t:host {\n\t\t\tdisplay: inline-block;\n\t\t\tmax-width: 100%;\n\t\t\tbox-sizing: border-box;\n\t\t}\n :host ::part(error-message) {\n direction: ltr;\n }\n\t\t${(0,l.cy)(a.M.cssVarList)}\n\t\tvaadin-text-field {\n\t\t\tpadding: 0;\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t}\n\t\tvaadin-text-field::part(input-field) {\n\t\t\tmin-height: 0;\n\t\t\tbackground: transparent;\n\t\t\tbox-shadow: none;\n\t\t\tpadding: 0;\n\t\t}\n\t\tvaadin-text-field::part(input-field)::after {\n\t\t\tbackground: transparent;\n\t\t\topacity: 0;\n\t\t}\n\t\tdescope-new-password-internal {\n\t\t\t-webkit-mask-image: none;\n\t\t\tmin-height: 0;\n\t\t\twidth: 100%;\n\t\t\tpadding: 0;\n\t\t}\n\t\tdescope-new-password-internal > .wrapper {\n -webkit-mask-image: none;\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t}\n\t\tdescope-password {\n\t\t\tdisplay: block;\n\t\t\twidth: 100%;\n\t\t}\n\t\tdescope-new-password-internal vaadin-password-field::before {\n\t\t\theight: initial;\n\t\t}\n descope-policy-validation {\n margin-top: 8px;\n display: flex;\n }\n descope-policy-validation.hidden {\n display: none;\n }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:d}))},83367:(t,e,i)=>{i.d(e,{T:()=>n});const n=(0,i(14944).xE)("new-password-internal")},32039:(t,e,i)=>{var n=i(25827),r=i(14944),o=i(41029),s=i(83367);const a=/^password-/,l=/^confirm-/,p=(t,e)=>t.replace(e,""),d=["password-label","password-placeholder"],u=["confirm-label","confirm-placeholder"],c=["has-confirm","disabled","bordered","size","full-width","maxlength","invalid","readonly","draggable","autocomplete","label-type","manual-visibility-toggle"],h=[].concat(c,d,u,["has-validation"]),b=(0,n.y)({componentName:s.T,baseSelector:"div"});customElements.define(s.T,class extends b{static get observedAttributes(){return[].concat(b.observedAttributes||[],h)}constructor(){super(),this.innerHTML='\n\t\t\t<div class="wrapper"></div>\n\t\t',this.wrapperEle=this.querySelector(".wrapper")}get value(){return this.passwordInput?.value||""}set value(t){t!==this.value&&(this.value=t)}get hasConfirm(){return"true"===this.getAttribute("has-confirm")}onHasConfirmChange(t){this.confirmInput.style.display=t?"":"none"}onHasValidationChange(t){this.policyPanel.style.display=t?"":"none"}get hasValidation(){return"true"===this.getAttribute("has-validation")}getValidity(){if(this.isRequired&&!this.value)return{valueMissing:!0};if(this.value&&!this.policyPanel.isValid)return{typeMismatch:!0};if(this.hasConfirm&&this.confirmInput&&this.value!==this.confirmInput.value)return{patternMismatch:!0};const t=this.getAttribute("minlength"),e=parseInt(t,10)||0;return this.value.length>=e?{}:{tooShort:!0}}init(){this.addEventListener("focus",(t=>{t.isTrusted&&this.passwordInput.focus()})),super.init?.(),this.renderInputs(this.hasConfirm,this.hasValidation)}renderInputs(){const t="true"===this.getAttribute("external-input"),e=`\n <div>\n <descope-password\n autocomplete="new-password"\n manual-visibility-toggle="true"\n data-id="password"\n external-input="${t}"\n ></descope-password>\n <descope-policy-validation></descope-policy-validation>\n </div>\n <descope-password\n autocomplete="new-password"\n manual-visibility-toggle="true"\n external-input="${t}"\n data-id="confirm"\n ></descope-password>\n `;this.wrapperEle.innerHTML=e,this.passwordInput=this.querySelector('[data-id="password"]'),this.confirmInput=this.querySelector('[data-id="confirm"]'),this.policyPanel=this.querySelector("descope-policy-validation"),this.inputs=[this.passwordInput,this.confirmInput],this.initInputs(),this.passwordInput.addEventListener("input",(t=>{this.policyPanel.setAttribute("value",t.target.value)})),(0,r.EA)(this,this.policyPanel,{includeAttrs:["policy-label","available-policies","active-policies","data-password-policy-value-minlength","manual-visibility-toggle"],mapAttrs:{"policy-label":"label","available-policies":"data"}})}handleIndicatorStyle(){this.inputs.forEach((t=>{const e=document.createElement("style");e.innerHTML=`\n\t\t\t\t:host ::part(required-indicator)::after {\n\t\t\t\t\tcontent: var(${o.M.cssVarList.inputsRequiredIndicator});\n width: 1em;\n text-align: center;\n\t\t\t\t}\n :host ::part(required-indicator) {\n display: inline-flex;\n }\n\t\t\t\t`,t?.shadowRoot.appendChild(e)}))}get isInvalid(){return this.hasAttribute("invalid")&&"false"!==this.getAttribute("invalid")}handleInputsInvalidAttribute(){this.inputs.forEach((t=>{t&&(0,r.mx)(t,(e=>{if(e.includes("invalid")){const e=t.getAttribute("invalid"),i=this.getAttribute("invalid");this.isInvalid&&i!==e&&t.setAttribute("invalid","true")}}),{})}))}initInputs(){this.handleIndicatorStyle(),this.handleInputsInvalidAttribute(),this.handleFocusEventsDispatching(this.inputs)}toggleBooleanAttribute(t,e,i){null===i?t?.removeAttribute(e):t?.setAttribute(e,i)}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i),e!==i&&("has-validation"===t?this.onHasValidationChange("true"===i):"has-confirm"===t?this.onHasConfirmChange("true"===i):c.includes(t)?this.inputs.forEach((e=>this.toggleBooleanAttribute(e,t,i))):d.includes(t)?this.toggleBooleanAttribute(this.passwordInput,p(t,a),i):u.includes(t)&&this.toggleBooleanAttribute(this.confirmInput,p(t,l),i))}})},14372:(t,e,i)=>{i.d(e,{M:()=>w,T:()=>l});var n=i(94619),r=i(7138),o=i(14944),s=i(43686),a=i(33177);const l=(0,o.xE)("password"),{host:p,inputField:d,inputElement:u,inputElementPlaceholder:c,revealButtonContainer:h,revealButtonIcon:b,label:g,requiredIndicator:y,errorMessage:m,helperText:v}={host:{selector:()=>":host"},inputField:{selector:"::part(input-field)"},inputElement:{selector:"> input"},inputElementPlaceholder:{selector:()=>":host input:placeholder-shown"},revealButtonContainer:{selector:"::part(reveal-button)"},revealButtonIcon:{selector:"::part(reveal-button)::before"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},w=(0,r.Zz)((0,n.RF)({mappings:{hostWidth:{...p,property:"width"},hostMinWidth:{...p,property:"min-width"},hostDirection:{...p,property:"direction"},fontSize:[{},p],fontFamily:[g,d,m,v],inputHeight:{...d,property:"height"},inputHorizontalPadding:[{...u,property:"padding-left"},{...u,property:"padding-right"}],inputBackgroundColor:{...d,property:"background-color"},inputBorderStyle:{...d,property:"border-style"},inputBorderWidth:{...d,property:"border-width"},inputBorderColor:{...d,property:"border-color"},inputBorderRadius:{...d,property:"border-radius"},inputOutlineColor:{...d,property:"outline-color"},inputOutlineStyle:{...d,property:"outline-style"},inputOutlineOffset:{...d,property:"outline-offset"},inputOutlineWidth:{...d,property:"outline-width"},labelFontSize:{...g,property:"font-size"},labelFontWeight:{...g,property:"font-weight"},labelTextColor:[{...g,property:"color"},{...y,property:"color"}],labelRequiredIndicator:{...y,property:"content"},errorMessageTextColor:{...m,property:"color"},inputPlaceholderTextColor:[{...c,property:"color"},{selector:()=>":host ::slotted(input:placeholder-shown)",property:"color"}],inputValueTextColor:[{...u,property:"color"},{selector:()=>":host ::slotted(input)",property:"color"}],revealButtonOffset:[{...h,property:"margin-right"},{...h,property:"margin-left"}],revealButtonSize:{...h,property:"font-size"},revealButtonColor:{...b,property:"color"},labelPosition:{...g,property:"position"},labelTopPosition:{...g,property:"top"},labelHorizontalPosition:[{...g,property:"left"},{...g,property:"right"}],inputTransformY:{...g,property:"transform"},inputTransition:{...g,property:"transition"},marginInlineStart:{...g,property:"margin-inline-start"},placeholderOpacity:[{selector:"> input:placeholder-shown",property:"opacity"},{...u,property:"opacity"}],inputVerticalAlignment:{...d,property:"align-items"},valueInputHeight:{...u,property:"height"}}}),n.VO,(0,n.RV)({inputType:"password",includeAttrs:["disabled","readonly","pattern","type","autocomplete"],noBlurDispatch:!0}),(0,n.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),n.tQ,s.A,(t=>class extends t{static get observedAttributes(){return["manual-visibility-toggle"]}get manualToggleVisibility(){return"true"===this.getAttribute("manual-visibility-toggle")}init(){super.init?.(),this.handleCaretOnVisibilityChange(),this.origSetPasswordVisible=this.baseElement._setPasswordVisible,this.origSetFocused=this.baseElement._setFocused,this.baseElement._setFocused=this.setFocus.bind(this),this.initExternalInput()}initExternalInput(){const t=this.createExternalInput();t&&this.handlePasswordVisibility(t)}get caretPosition(){return this.value?.length||0}handleCaretOnVisibilityChange(){const t=this.baseElement._togglePasswordVisibility.bind(this.baseElement);this.baseElement._togglePasswordVisibility=()=>{setTimeout((()=>(t(),this.inputElement.setSelectionRange(this.caretPosition,this.caretPosition),!1)))}}setFocus(t){this.manualToggleVisibility&&(this.baseElement._setPasswordVisible=()=>{}),this.origSetFocused.call(this.baseElement,t),this.baseElement._setPasswordVisible=this.origSetPasswordVisible.bind(this.baseElement)}resetPasswordVisibilityToggle(){this.baseElement._setPasswordVisible=this.origSetPasswordVisible,this.baseElement._setFocused=this.origSetFocus}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i)}handlePasswordVisibility(t){const e=this.baseElement.__boundRevealButtonMouseDown;this.baseElement.querySelector("vaadin-password-field-button").removeEventListener("mousedown",e),this.baseElement._passwordVisibleChanged=()=>{},this.baseElement._togglePasswordVisibility=()=>{"password"===t.getAttribute("type")?this.showPasswordVisibility(t):this.hidePasswordVisibility(t)}}showPasswordVisibility(t){t.setAttribute("type","text"),this.setAttribute("password-visible","true")}hidePasswordVisibility(t){t.setAttribute("type","password"),this.setAttribute("password-visible","false")}}))((0,n.tz)({slots:["","suffix"],wrappedEleName:"vaadin-password-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\tmin-width: 10em;\n box-sizing: border-box;\n position: relative;\n\t\t\t}\n\t\t\t${(0,a.cy)(w.cssVarList)}\n\t\t\t${(0,a.I4)("vaadin-password-field")}\n ${(0,a.$J)("vaadin-password-field")}\n\n\t\t\tvaadin-password-field {\n\t\t\t\twidth: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-password-field > input {\n -webkit-mask-image: none;\n\t\t\t\tbox-sizing: border-box;\n opacity: 1;\n\t\t\t}\n\t\t\tvaadin-password-field::part(input-field) {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-password-field[focus-ring]::part(input-field) {\n\t\t\t\tbox-shadow: none;\n\t\t\t}\n :host ::slotted(input) {\n\t\t\t\tmin-height: 0;\n }\n :host([readonly]) ::slotted(input:placeholder-shown) {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\tvaadin-password-field::before {\n\t\t\t\theight: initial;\n\t\t\t}\n\t\t\tvaadin-password-field::part(input-field)::after {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\tvaadin-password-field-button {\n\t\t\t\tcursor: pointer;\n\t\t\t}\n\t\t\t:host([readonly]) vaadin-password-field-button {\n\t\t\t\tpointer-events: none;\n\t\t\t}\n\t\t\tvaadin-password-field-button[focus-ring] {\n\t\t\t\tbox-shadow: 0 0 0 2px var(${w.cssVarList.inputOutlineColor});\n\t\t\t}\n\n ${(0,a.Kl)()}\n \n ::part(reveal-button) {\n align-self: center;\n }\n\n vaadin-password-field[external-input="true"] > input:not(:placeholder-shown) {\n opacity: 0;\n }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:l}))},43686:(t,e,i)=>{i.d(e,{A:()=>n});const n=t=>class extends t{get isReadOnly(){return this.hasAttribute("readonly")&&"false"!==this.getAttribute("readonly")}init(){super.init?.();const t=this.querySelector("input");t?.addEventListener("mousedown",(e=>{if(this.isDraggable&&this.isReadOnly){t.setAttribute("inert","true");const i=e.target,n=i.getAttribute("type");i.setAttribute("type","text"),setTimeout((()=>{i.focus()}));const r=e=>{i.setAttribute("type",n),t.removeAttribute("inert"),this.removeEventListener("mouseup",r),this.removeEventListener("dragend",r)};this.addEventListener("dragend",r,{once:!0}),this.addEventListener("mouseup",r,{once:!0})}}))}}},9775:(t,e,i)=>{i.d(e,{T:()=>l,w:()=>m});var n=i(94619),r=i(70263),o=i(7138),s=i(14944),a=i(38917);const l=(0,s.xE)("policy-validation"),p=["data","active-policies","overrides","data-password-policy-value-minlength"],d=["label","value",...p];class u extends((0,r.q)({componentName:l,baseSelector:":host > div"})){#t;#e=[];#i;static get observedAttributes(){return d}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <div>\n <div class="label"></div>\n <ul></ul>\n </div>\n <style>\n :host > div {\n width: 100%;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n }\n .label {\n max-width: 100%;\n text-wrap: wrap;\n overflow-wrap: break-word;\n }\n .hide-label .label {\n display: none;\n }\n ul {\n display: flex;\n flex-direction: column;\n padding: 0;\n margin: 0;\n }\n ul, li {\n margin: 0;\n padding: 0;\n list-style: none;\n }\n li::before {\n display: inline-block;\n width: 1em;\n text-align: center;\n }\n </style>\n\t\t',this.panel=this.shadowRoot.querySelector(":host > div"),this.label=this.shadowRoot.querySelector(".label"),this.list=this.shadowRoot.querySelector("ul")}attributeChangedCallback(t,e,i){if(super.attributeChangedCallback?.(t,e,i),e!==i){if("label"===t&&this.updateLabel(i),p.includes(t)){if("data"===t)try{this.availablePolicies=JSON.parse(i)}catch{console.error("Failed to set available policies")}if("active-policies"===t&&(this.#e=(i||"").split(",")),"data-password-policy-value-minlength"===t){const t=Number(i);!Number.isNaN(t)&&t>0&&(this.#i={...this.#i,minlength:{value:`${t}`}})}}this.renderItems(this.#t,this.#e,this.#i)}}get availablePolicies(){return this.#t||[]}set availablePolicies(t){this.#t=t}get value(){return this.getAttribute("value")||""}validate(){let t=this.#t;return this.#i&&(t=this.#t.map((t=>this.#i[t.id]?{...t,data:this.#i[t.id]}:t))),this.#e.reduce(((e,i)=>{const n=t.find((t=>t.id===i));if(!n)return e;const{pattern:r,message:o,data:s}=n;if(!r||!o)return e;const l={valid:new RegExp((0,a.z)(r,s)).test(this.value),message:(0,a.z)(o,s),id:i};return e.push(l),e}),[])}get isValid(){return!this.validate().some((({valid:t})=>!1===t))}getValidationItemTemplate({valid:t,message:e}){return`\n <li class="item" data-valid="${this.value?t:"none"}">\n <span class="message">${e}</span>\n </li>\n `}renderItems(t,e){t&&e.length&&(this.list.innerHTML=this.validate().map(this.getValidationItemTemplate.bind(this)).join(""))}updateLabel(t){t?(this.label.innerHTML=t,this.classList.remove("hide-label")):(this.classList.add("hide-label"),this.label.innerHTML="")}}const{host:c,item:h,symbolDefault:b,symbolSuccess:g,symbolError:y}={host:{selector:()=>":host > div"},item:{selector:()=>".item"},symbolDefault:{selector:()=>'.item[data-valid="none"]::before'},symbolSuccess:{selector:()=>'.item[data-valid="true"]::before'},symbolError:{selector:()=>'.item[data-valid="false"]::before'}},m=(0,o.Zz)((0,n.RF)({componentNameOverride:(0,s.xE)("input-wrapper")}),(0,n.RF)({mappings:{hostDirection:{selector:()=>":host",property:"direction"},fontSize:{},fontFamily:{},padding:{},borderWidth:{...c,property:"border-width"},borderStyle:{...c,property:"border-style"},borderColor:{...c,property:"border-color"},borderRadius:{...c,property:"border-radius"},backgroundColor:{...c,property:"background-color"},textColor:{property:"color"},labelMargin:{...c,property:"gap"},itemsSpacing:{...h,property:"line-height"},itemSymbolSuccessColor:{...g,property:"color"},itemSymbolErrorColor:{...y,property:"color"},itemSymbolDefault:{...b,property:"content"},itemSymbolSuccess:{...g,property:"content"},itemSymbolError:{...y,property:"content"}}}),n.VO,n.tQ)(u)},38917:(t,e,i)=>{i.d(e,{z:()=>n});const n=(t,e)=>t.replace(/{{(\w+)+}}/g,((t,i)=>e?.[i]||t))},33177:(t,e,i)=>{i.d(e,{$J:()=>c,I4:()=>s,Kl:()=>h,LJ:()=>u,Qv:()=>o,X6:()=>l,cy:()=>n,fu:()=>p,kG:()=>d,lS:()=>a,zm:()=>r});const n=t=>`\n :host {\n padding: calc(var(${t.inputOutlineWidth}) + var(${t.inputOutlineOffset}))\n }\n`,r=t=>`\n ${t} {\n margin: 0;\n padding: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n }\n`,o=t=>`\n ${t}::part(input-field) {\n overflow: hidden;\n padding: 0;\n box-shadow: none;\n }\n`,s=t=>`\n ${t} > label,\n ${t}::part(label),\n ${t}::part(required-indicator) {\n cursor: pointer;\n }\n`,a=(t,e="input")=>`\n ${t}[disabled] > ${e}:placeholder-shown,\n\t${t}[readonly] > ${e}:placeholder-shown {\n\t\topacity: 1;\n\t}\n`,l=()=>"\n :host {\n --vaadin-field-default-width: auto;\n box-sizing: border-box;\n }\n",p=t=>`\n ${t}::part(input-field)::after {\n opacity: 0;\n }\n`,d=t=>`\n ${t}::part(input-field)::after {\n background: none;\n }\n`,u=(t,e)=>`\n ${r(t)}\n ${s(t)}\n ${a(t)}\n ${o(t)}\n ${((t,e)=>`\n ${t} input:-webkit-autofill,\n ${t} input:-webkit-autofill::first-line,\n ${t} input:-webkit-autofill:hover,\n ${t} input:-webkit-autofill:active,\n ${t} input:-webkit-autofill:focus {\n -webkit-text-fill-color: var(${e.inputValueTextColor});\n box-shadow: 0 0 0 var(${e.inputHeight}) var(${e.inputBackgroundColor}) inset;\n }\n`)(t,e)}\n ${d(t)}\n ${(t=>`\n ${t}::before {\n\t\theight: unset;\n\t}\n`)(t)}\n ${(t=>`\n ${t} > input {\n -webkit-mask-image: none;\n min-height: 0;\n box-sizing: border-box;\n }\n`)(t)}\n ${(t=>`\n ${t}::part(input-field)::after {\n border: none;\n }\n`)(t)}\n`,c=t=>`\n :host ::part(error-message) {\n direction: ltr;\n }\n :host([required]) ::part(required-indicator) {\n width: 1em;\n display: inline-flex;\n }\n :host([required]) ::part(required-indicator)::after {\n position: static;\n }\n :host([has-label]) ::part(label) {\n padding-right: 0;\n padding-bottom: 0;\n display: flex;\n width: 100%;\n }\n ${t} [slot="label"] {\n max-width: calc(100% - 1em);\n overflow: hidden;\n text-overflow: ellipsis;\n padding-bottom: 0.5em;\n }\n`,h=()=>'\n :host([label-type="floating"]) {\n position: relative;\n }\n :host([label-type="floating"][has-label]) [slot="label"] {\n padding: 0;\n }\n :host([label-type="floating"][has-label]) > ::part(label) {\n z-index: 1;\n padding: 0;\n width: auto;\n }\n '}}]);
1
+ "use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[8603],{25827:(t,e,i)=>{i.d(e,{y:()=>s});var n=i(7138),r=i(94619),o=i(70263);const s=(...t)=>(0,n.Zz)(r.XX,r._$,r.yF,r.jd)((0,o.q)(...t))},41029:(t,e,i)=>{i.d(e,{M:()=>w,T:()=>d});var n=i(14944),r=i(7138),o=i(94619),s=i(83367),a=i(14372),l=i(33177),p=i(9775);const d=(0,n.xE)("new-password"),u=p.w.cssVarList,{host:h,label:c,internalInputsWrapper:b,errorMessage:g,helperText:y,passwordInput:m,policyPreview:v}={host:{selector:()=>":host"},label:{selector:"::part(label)"},internalInputsWrapper:{selector:"descope-new-password-internal .wrapper"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"},passwordInput:{selector:"descope-password"},policyPreview:{selector:"descope-policy-validation"}},w=(0,r.Zz)((0,o.RF)({mappings:{fontSize:[h,{},{selector:a.M.componentName,property:a.M.cssVarList.fontSize}],fontFamily:[c,g,y],labelFontSize:{...c,property:"font-size"},labelFontWeight:{...c,property:"font-weight"},labelTextColor:{...c,property:"color"},errorMessageTextColor:{...g,property:"color"},hostWidth:{...h,property:"width"},hostMinWidth:{...h,property:"min-width"},hostDirection:[{...h,property:"direction"},{...m,property:a.M.cssVarList.hostDirection}],inputsRequiredIndicator:{...h,property:"content"},spaceBetweenInputs:{...b,property:"gap"},policyPreviewBackgroundColor:{...v,property:u.backgroundColor},policyPreviewPadding:{...v,property:u.padding},valueInputHeight:{...m,property:a.M.cssVarList.valueInputHeight},valueInputMarginBottom:{...m,property:a.M.cssVarList.valueInputMarginBottom}}}),o.VO,(0,o.OZ)({proxyProps:["value","selectionStart"]}),(t=>class extends t{init(){super.init?.();const t=document.createElement("template"),e=this.getAttribute("external-input");t.innerHTML=`\n\t\t\t<${s.T}\n\t\t\t\tname="new-password"\n\t\t\t\ttabindex="-1"\n\t\t\t\tslot="input"\n external-input="${e}"\n\t\t\t>\n </${s.T}>\n\t\t\t`,this.baseElement.appendChild(t.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(s.T),"true"===this.getAttribute("external-input")&&this.initExternalInput(),(0,n.EA)(this,this.inputElement,{includeAttrs:["password-label","password-placeholder","confirm-label","confirm-placeholder","full-width","size","bordered","label","has-confirm","invalid","readonly","draggable","has-validation","policy-label","active-policies","available-policies","data-password-policy-value-minlength","label-type","manual-visibility-toggle"]})}createSlottedExternalInput(t,e){const i=t.querySelector("input"),n=document.createElement("slot"),r=i.getAttribute("slot");n.setAttribute("name",e),n.setAttribute("slot",r),t.appendChild(n),i.setAttribute("slot",e),i.setAttribute("name",this.getAttribute("name")),i.setAttribute("data-hidden-input","true"),this.appendChild(i)}initExternalInput(){this.passwordInput=this.inputElement.querySelector('[data-id="password"]'),this.confirmInput=this.inputElement.querySelector('[data-id="confirm"]'),this.createSlottedExternalInput(this.passwordInput,"external-password-input"),this.createSlottedExternalInput(this.confirmInput,"external-confirm-input")}}))((0,o.tz)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t:host {\n\t\t\tdisplay: inline-block;\n\t\t\tmax-width: 100%;\n\t\t\tbox-sizing: border-box;\n\t\t}\n :host ::part(error-message) {\n direction: ltr;\n }\n\t\t${(0,l.cy)(a.M.cssVarList)}\n\t\tvaadin-text-field {\n\t\t\tpadding: 0;\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t}\n\t\tvaadin-text-field::part(input-field) {\n\t\t\tmin-height: 0;\n\t\t\tbackground: transparent;\n\t\t\tbox-shadow: none;\n\t\t\tpadding: 0;\n\t\t}\n\t\tvaadin-text-field::part(input-field)::after {\n\t\t\tbackground: transparent;\n\t\t\topacity: 0;\n\t\t}\n\t\tdescope-new-password-internal {\n\t\t\t-webkit-mask-image: none;\n\t\t\tmin-height: 0;\n\t\t\twidth: 100%;\n\t\t\tpadding: 0;\n\t\t}\n\t\tdescope-new-password-internal > .wrapper {\n -webkit-mask-image: none;\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t}\n\t\tdescope-password {\n\t\t\tdisplay: block;\n\t\t\twidth: 100%;\n\t\t}\n\t\tdescope-new-password-internal vaadin-password-field::before {\n\t\t\theight: initial;\n\t\t}\n descope-policy-validation {\n margin-top: 8px;\n display: flex;\n }\n descope-policy-validation.hidden {\n display: none;\n }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:d}))},83367:(t,e,i)=>{i.d(e,{T:()=>n});const n=(0,i(14944).xE)("new-password-internal")},32039:(t,e,i)=>{var n=i(25827),r=i(14944),o=i(41029),s=i(83367);const a=/^password-/,l=/^confirm-/,p=(t,e)=>t.replace(e,""),d=["password-label","password-placeholder"],u=["confirm-label","confirm-placeholder"],h=["has-confirm","disabled","bordered","size","full-width","maxlength","invalid","readonly","draggable","autocomplete","label-type","manual-visibility-toggle"],c=[].concat(h,d,u,["has-validation"]),b=(0,n.y)({componentName:s.T,baseSelector:"div"});customElements.define(s.T,class extends b{static get observedAttributes(){return[].concat(b.observedAttributes||[],c)}constructor(){super(),this.innerHTML='\n\t\t\t<div class="wrapper"></div>\n\t\t',this.wrapperEle=this.querySelector(".wrapper")}get value(){return this.passwordInput?.value||""}set value(t){t!==this.value&&(this.value=t)}get hasConfirm(){return"true"===this.getAttribute("has-confirm")}onHasConfirmChange(t){this.confirmInput.style.display=t?"":"none"}onHasValidationChange(t){this.policyPanel.style.display=t?"":"none"}get hasValidation(){return"true"===this.getAttribute("has-validation")}getValidity(){if(this.isRequired&&!this.value)return{valueMissing:!0};if(this.value&&!this.policyPanel.isValid)return{typeMismatch:!0};if(this.hasConfirm&&this.confirmInput&&this.value!==this.confirmInput.value)return{patternMismatch:!0};const t=this.getAttribute("minlength"),e=parseInt(t,10)||0;return this.value.length>=e?{}:{tooShort:!0}}init(){this.addEventListener("focus",(t=>{t.isTrusted&&this.passwordInput.focus()})),super.init?.(),this.renderInputs(this.hasConfirm,this.hasValidation)}renderInputs(){const t="true"===this.getAttribute("external-input"),e=`\n <div>\n <descope-password\n autocomplete="new-password"\n manual-visibility-toggle="true"\n data-id="password"\n external-input="${t}"\n ></descope-password>\n <descope-policy-validation></descope-policy-validation>\n </div>\n <descope-password\n autocomplete="new-password"\n manual-visibility-toggle="true"\n external-input="${t}"\n data-id="confirm"\n ></descope-password>\n `;this.wrapperEle.innerHTML=e,this.passwordInput=this.querySelector('[data-id="password"]'),this.confirmInput=this.querySelector('[data-id="confirm"]'),this.policyPanel=this.querySelector("descope-policy-validation"),this.inputs=[this.passwordInput,this.confirmInput],this.initInputs(),this.passwordInput.addEventListener("input",(t=>{this.policyPanel.setAttribute("value",t.target.value)})),(0,r.EA)(this,this.policyPanel,{includeAttrs:["policy-label","available-policies","active-policies","data-password-policy-value-minlength","manual-visibility-toggle"],mapAttrs:{"policy-label":"label","available-policies":"data"}})}handleIndicatorStyle(){this.inputs.forEach((t=>{const e=document.createElement("style");e.innerHTML=`\n\t\t\t\t:host ::part(required-indicator)::after {\n\t\t\t\t\tcontent: var(${o.M.cssVarList.inputsRequiredIndicator});\n width: 1em;\n text-align: center;\n\t\t\t\t}\n :host ::part(required-indicator) {\n display: inline-flex;\n }\n\t\t\t\t`,t?.shadowRoot.appendChild(e)}))}get isInvalid(){return this.hasAttribute("invalid")&&"false"!==this.getAttribute("invalid")}handleInputsInvalidAttribute(){this.inputs.forEach((t=>{t&&(0,r.mx)(t,(e=>{if(e.includes("invalid")){const e=t.getAttribute("invalid"),i=this.getAttribute("invalid");this.isInvalid&&i!==e&&t.setAttribute("invalid","true")}}),{})}))}initInputs(){this.handleIndicatorStyle(),this.handleInputsInvalidAttribute(),this.handleFocusEventsDispatching(this.inputs)}toggleBooleanAttribute(t,e,i){null===i?t?.removeAttribute(e):t?.setAttribute(e,i)}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i),e!==i&&("has-validation"===t?this.onHasValidationChange("true"===i):"has-confirm"===t?this.onHasConfirmChange("true"===i):h.includes(t)?this.inputs.forEach((e=>this.toggleBooleanAttribute(e,t,i))):d.includes(t)?this.toggleBooleanAttribute(this.passwordInput,p(t,a),i):u.includes(t)&&this.toggleBooleanAttribute(this.confirmInput,p(t,l),i))}})},14372:(t,e,i)=>{i.d(e,{M:()=>w,T:()=>l});var n=i(94619),r=i(7138),o=i(14944),s=i(43686),a=i(33177);const l=(0,o.xE)("password"),{host:p,inputField:d,inputElement:u,inputElementPlaceholder:h,revealButtonContainer:c,revealButtonIcon:b,label:g,requiredIndicator:y,errorMessage:m,helperText:v}={host:{selector:()=>":host"},inputField:{selector:"::part(input-field)"},inputElement:{selector:"> input"},inputElementPlaceholder:{selector:()=>":host input:placeholder-shown"},revealButtonContainer:{selector:"::part(reveal-button)"},revealButtonIcon:{selector:"::part(reveal-button)::before"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},w=(0,r.Zz)((0,n.RF)({mappings:{hostWidth:{...p,property:"width"},hostMinWidth:{...p,property:"min-width"},hostDirection:{...p,property:"direction"},fontSize:[{},p],fontFamily:[g,d,m,v],inputHeight:{...d,property:"height"},inputHorizontalPadding:[{...u,property:"padding-left"},{...u,property:"padding-right"}],inputBackgroundColor:{...d,property:"background-color"},inputBorderStyle:{...d,property:"border-style"},inputBorderWidth:{...d,property:"border-width"},inputBorderColor:{...d,property:"border-color"},inputBorderRadius:{...d,property:"border-radius"},inputOutlineColor:{...d,property:"outline-color"},inputOutlineStyle:{...d,property:"outline-style"},inputOutlineOffset:{...d,property:"outline-offset"},inputOutlineWidth:{...d,property:"outline-width"},labelFontSize:{...g,property:"font-size"},labelFontWeight:{...g,property:"font-weight"},labelTextColor:[{...g,property:"color"},{...y,property:"color"}],labelRequiredIndicator:{...y,property:"content"},errorMessageTextColor:{...m,property:"color"},inputPlaceholderTextColor:[{...h,property:"color"},{selector:()=>":host ::slotted(input:placeholder-shown)",property:"color"}],inputValueTextColor:[{...u,property:"color"},{selector:()=>":host ::slotted(input)",property:"color"}],revealButtonOffset:[{...c,property:"margin-right"},{...c,property:"margin-left"}],revealButtonSize:{...c,property:"font-size"},revealButtonColor:{...b,property:"color"},labelPosition:{...g,property:"position"},labelTopPosition:{...g,property:"top"},labelHorizontalPosition:[{...g,property:"left"},{...g,property:"right"}],inputTransformY:{...g,property:"transform"},inputTransition:{...g,property:"transition"},marginInlineStart:{...g,property:"margin-inline-start"},placeholderOpacity:[{selector:"> input:placeholder-shown",property:"opacity"},{...u,property:"opacity"}],inputVerticalAlignment:{...d,property:"align-items"},valueInputHeight:{...u,property:"height"}}}),n.VO,(0,n.RV)({inputType:"password",inputName:"password",includeAttrs:["disabled","readonly","pattern","type","autocomplete"],noBlurDispatch:!0}),(0,n.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),n.tQ,s.A,(t=>class extends t{static get observedAttributes(){return["manual-visibility-toggle"]}get manualToggleVisibility(){return"true"===this.getAttribute("manual-visibility-toggle")}init(){super.init?.(),this.handleCaretOnVisibilityChange(),this.origSetPasswordVisible=this.baseElement._setPasswordVisible,this.origSetFocused=this.baseElement._setFocused,this.baseElement._setFocused=this.setFocus.bind(this),this.initExternalInput()}initExternalInput(){const t=this.createExternalInput();t&&this.handlePasswordVisibility(t)}get caretPosition(){return this.value?.length||0}handleCaretOnVisibilityChange(){const t=this.baseElement._togglePasswordVisibility.bind(this.baseElement);this.baseElement._togglePasswordVisibility=()=>{setTimeout((()=>(t(),this.inputElement.setSelectionRange(this.caretPosition,this.caretPosition),!1)))}}setFocus(t){this.manualToggleVisibility&&(this.baseElement._setPasswordVisible=()=>{}),this.origSetFocused.call(this.baseElement,t),this.baseElement._setPasswordVisible=this.origSetPasswordVisible.bind(this.baseElement)}resetPasswordVisibilityToggle(){this.baseElement._setPasswordVisible=this.origSetPasswordVisible,this.baseElement._setFocused=this.origSetFocus}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i)}handlePasswordVisibility(t){const e=this.baseElement.__boundRevealButtonMouseDown;this.baseElement.querySelector("vaadin-password-field-button").removeEventListener("mousedown",e),this.baseElement._passwordVisibleChanged=()=>{},this.baseElement._togglePasswordVisibility=()=>{"password"===t.getAttribute("type")?this.showPasswordVisibility(t):this.hidePasswordVisibility(t)}}showPasswordVisibility(t){t.setAttribute("type","text"),this.setAttribute("password-visible","true")}hidePasswordVisibility(t){t.setAttribute("type","password"),this.setAttribute("password-visible","false")}}))((0,n.tz)({slots:["","suffix"],wrappedEleName:"vaadin-password-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\tmin-width: 10em;\n box-sizing: border-box;\n position: relative;\n\t\t\t}\n\t\t\t${(0,a.cy)(w.cssVarList)}\n\t\t\t${(0,a.I4)("vaadin-password-field")}\n ${(0,a.$J)("vaadin-password-field")}\n\n\t\t\tvaadin-password-field {\n\t\t\t\twidth: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-password-field > input {\n -webkit-mask-image: none;\n\t\t\t\tbox-sizing: border-box;\n opacity: 1;\n\t\t\t}\n\t\t\tvaadin-password-field::part(input-field) {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-password-field[focus-ring]::part(input-field) {\n\t\t\t\tbox-shadow: none;\n\t\t\t}\n :host ::slotted(input) {\n\t\t\t\tmin-height: 0;\n }\n :host([readonly]) ::slotted(input:placeholder-shown) {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\tvaadin-password-field::before {\n\t\t\t\theight: initial;\n\t\t\t}\n\t\t\tvaadin-password-field::part(input-field)::after {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\tvaadin-password-field-button {\n\t\t\t\tcursor: pointer;\n\t\t\t}\n\t\t\t:host([readonly]) vaadin-password-field-button {\n\t\t\t\tpointer-events: none;\n\t\t\t}\n\t\t\tvaadin-password-field-button[focus-ring] {\n\t\t\t\tbox-shadow: 0 0 0 2px var(${w.cssVarList.inputOutlineColor});\n\t\t\t}\n\n ${(0,a.Kl)()}\n \n ::part(reveal-button) {\n align-self: center;\n }\n\n vaadin-password-field[external-input="true"] > input:not(:placeholder-shown) {\n opacity: 0;\n }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:l}))},43686:(t,e,i)=>{i.d(e,{A:()=>n});const n=t=>class extends t{get isReadOnly(){return this.hasAttribute("readonly")&&"false"!==this.getAttribute("readonly")}init(){super.init?.();const t=this.querySelector("input");t?.addEventListener("mousedown",(e=>{if(this.isDraggable&&this.isReadOnly){t.setAttribute("inert","true");const i=e.target,n=i.getAttribute("type");i.setAttribute("type","text"),setTimeout((()=>{i.focus()}));const r=e=>{i.setAttribute("type",n),t.removeAttribute("inert"),this.removeEventListener("mouseup",r),this.removeEventListener("dragend",r)};this.addEventListener("dragend",r,{once:!0}),this.addEventListener("mouseup",r,{once:!0})}}))}}},9775:(t,e,i)=>{i.d(e,{T:()=>l,w:()=>m});var n=i(94619),r=i(70263),o=i(7138),s=i(14944),a=i(38917);const l=(0,s.xE)("policy-validation"),p=["data","active-policies","overrides","data-password-policy-value-minlength"],d=["label","value",...p];class u extends((0,r.q)({componentName:l,baseSelector:":host > div"})){#t;#e=[];#i;static get observedAttributes(){return d}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <div>\n <div class="label"></div>\n <ul></ul>\n </div>\n <style>\n :host > div {\n width: 100%;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n }\n .label {\n max-width: 100%;\n text-wrap: wrap;\n overflow-wrap: break-word;\n }\n .hide-label .label {\n display: none;\n }\n ul {\n display: flex;\n flex-direction: column;\n padding: 0;\n margin: 0;\n }\n ul, li {\n margin: 0;\n padding: 0;\n list-style: none;\n }\n li::before {\n display: inline-block;\n width: 1em;\n text-align: center;\n }\n </style>\n\t\t',this.panel=this.shadowRoot.querySelector(":host > div"),this.label=this.shadowRoot.querySelector(".label"),this.list=this.shadowRoot.querySelector("ul")}attributeChangedCallback(t,e,i){if(super.attributeChangedCallback?.(t,e,i),e!==i){if("label"===t&&this.updateLabel(i),p.includes(t)){if("data"===t)try{this.availablePolicies=JSON.parse(i)}catch{console.error("Failed to set available policies")}if("active-policies"===t&&(this.#e=(i||"").split(",")),"data-password-policy-value-minlength"===t){const t=Number(i);!Number.isNaN(t)&&t>0&&(this.#i={...this.#i,minlength:{value:`${t}`}})}}this.renderItems(this.#t,this.#e,this.#i)}}get availablePolicies(){return this.#t||[]}set availablePolicies(t){this.#t=t}get value(){return this.getAttribute("value")||""}validate(){let t=this.#t;return this.#i&&(t=this.#t.map((t=>this.#i[t.id]?{...t,data:this.#i[t.id]}:t))),this.#e.reduce(((e,i)=>{const n=t.find((t=>t.id===i));if(!n)return e;const{pattern:r,message:o,data:s}=n;if(!r||!o)return e;const l={valid:new RegExp((0,a.z)(r,s)).test(this.value),message:(0,a.z)(o,s),id:i};return e.push(l),e}),[])}get isValid(){return!this.validate().some((({valid:t})=>!1===t))}getValidationItemTemplate({valid:t,message:e}){return`\n <li class="item" data-valid="${this.value?t:"none"}">\n <span class="message">${e}</span>\n </li>\n `}renderItems(t,e){t&&e.length&&(this.list.innerHTML=this.validate().map(this.getValidationItemTemplate.bind(this)).join(""))}updateLabel(t){t?(this.label.innerHTML=t,this.classList.remove("hide-label")):(this.classList.add("hide-label"),this.label.innerHTML="")}}const{host:h,item:c,symbolDefault:b,symbolSuccess:g,symbolError:y}={host:{selector:()=>":host > div"},item:{selector:()=>".item"},symbolDefault:{selector:()=>'.item[data-valid="none"]::before'},symbolSuccess:{selector:()=>'.item[data-valid="true"]::before'},symbolError:{selector:()=>'.item[data-valid="false"]::before'}},m=(0,o.Zz)((0,n.RF)({componentNameOverride:(0,s.xE)("input-wrapper")}),(0,n.RF)({mappings:{hostDirection:{selector:()=>":host",property:"direction"},fontSize:{},fontFamily:{},padding:{},borderWidth:{...h,property:"border-width"},borderStyle:{...h,property:"border-style"},borderColor:{...h,property:"border-color"},borderRadius:{...h,property:"border-radius"},backgroundColor:{...h,property:"background-color"},textColor:{property:"color"},labelMargin:{...h,property:"gap"},itemsSpacing:{...c,property:"line-height"},itemSymbolSuccessColor:{...g,property:"color"},itemSymbolErrorColor:{...y,property:"color"},itemSymbolDefault:{...b,property:"content"},itemSymbolSuccess:{...g,property:"content"},itemSymbolError:{...y,property:"content"}}}),n.VO,n.tQ)(u)},38917:(t,e,i)=>{i.d(e,{z:()=>n});const n=(t,e)=>t.replace(/{{(\w+)+}}/g,((t,i)=>e?.[i]||t))},33177:(t,e,i)=>{i.d(e,{$J:()=>h,I4:()=>s,Kl:()=>c,LJ:()=>u,Qv:()=>o,X6:()=>l,cy:()=>n,fu:()=>p,kG:()=>d,lS:()=>a,zm:()=>r});const n=t=>`\n :host {\n padding: calc(var(${t.inputOutlineWidth}) + var(${t.inputOutlineOffset}))\n }\n`,r=t=>`\n ${t} {\n margin: 0;\n padding: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n }\n`,o=t=>`\n ${t}::part(input-field) {\n overflow: hidden;\n padding: 0;\n box-shadow: none;\n }\n`,s=t=>`\n ${t} > label,\n ${t}::part(label),\n ${t}::part(required-indicator) {\n cursor: pointer;\n }\n`,a=(t,e="input")=>`\n ${t}[disabled] > ${e}:placeholder-shown,\n\t${t}[readonly] > ${e}:placeholder-shown {\n\t\topacity: 1;\n\t}\n`,l=()=>"\n :host {\n --vaadin-field-default-width: auto;\n box-sizing: border-box;\n }\n",p=t=>`\n ${t}::part(input-field)::after {\n opacity: 0;\n }\n`,d=t=>`\n ${t}::part(input-field)::after {\n background: none;\n }\n`,u=(t,e)=>`\n ${r(t)}\n ${s(t)}\n ${a(t)}\n ${o(t)}\n ${((t,e)=>`\n ${t} input:-webkit-autofill,\n ${t} input:-webkit-autofill::first-line,\n ${t} input:-webkit-autofill:hover,\n ${t} input:-webkit-autofill:active,\n ${t} input:-webkit-autofill:focus {\n -webkit-text-fill-color: var(${e.inputValueTextColor});\n box-shadow: 0 0 0 var(${e.inputHeight}) var(${e.inputBackgroundColor}) inset;\n }\n`)(t,e)}\n ${d(t)}\n ${(t=>`\n ${t}::before {\n\t\theight: unset;\n\t}\n`)(t)}\n ${(t=>`\n ${t} > input {\n -webkit-mask-image: none;\n min-height: 0;\n box-sizing: border-box;\n }\n`)(t)}\n ${(t=>`\n ${t}::part(input-field)::after {\n border: none;\n }\n`)(t)}\n`,h=t=>`\n :host ::part(error-message) {\n direction: ltr;\n }\n :host([required]) ::part(required-indicator) {\n width: 1em;\n display: inline-flex;\n }\n :host([required]) ::part(required-indicator)::after {\n position: static;\n }\n :host([has-label]) ::part(label) {\n padding-right: 0;\n padding-bottom: 0;\n display: flex;\n width: 100%;\n }\n ${t} [slot="label"] {\n max-width: calc(100% - 1em);\n overflow: hidden;\n text-overflow: ellipsis;\n padding-bottom: 0.5em;\n }\n`,c=()=>'\n :host([label-type="floating"]) {\n position: relative;\n }\n :host([label-type="floating"][has-label]) [slot="label"] {\n padding: 0;\n }\n :host([label-type="floating"][has-label]) > ::part(label) {\n z-index: 1;\n padding: 0;\n width: auto;\n }\n '}}]);
@@ -1 +1 @@
1
- "use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[4364,8603,6969,2996],{25827:(t,e,i)=>{i.d(e,{y:()=>s});var n=i(7138),r=i(94619),o=i(70263);const s=(...t)=>(0,n.Zz)(r.XX,r._$,r.yF,r.jd)((0,o.q)(...t))},41029:(t,e,i)=>{i.d(e,{M:()=>f,T:()=>d});var n=i(14944),r=i(7138),o=i(94619),s=i(83367),a=i(14372),l=i(33177),p=i(9775);const d=(0,n.xE)("new-password"),c=p.w.cssVarList,{host:u,label:h,internalInputsWrapper:b,errorMessage:y,helperText:g,passwordInput:m,policyPreview:v}={host:{selector:()=>":host"},label:{selector:"::part(label)"},internalInputsWrapper:{selector:"descope-new-password-internal .wrapper"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"},passwordInput:{selector:"descope-password"},policyPreview:{selector:"descope-policy-validation"}},f=(0,r.Zz)((0,o.RF)({mappings:{fontSize:[u,{},{selector:a.M.componentName,property:a.M.cssVarList.fontSize}],fontFamily:[h,y,g],labelFontSize:{...h,property:"font-size"},labelFontWeight:{...h,property:"font-weight"},labelTextColor:{...h,property:"color"},errorMessageTextColor:{...y,property:"color"},hostWidth:{...u,property:"width"},hostMinWidth:{...u,property:"min-width"},hostDirection:[{...u,property:"direction"},{...m,property:a.M.cssVarList.hostDirection}],inputsRequiredIndicator:{...u,property:"content"},spaceBetweenInputs:{...b,property:"gap"},policyPreviewBackgroundColor:{...v,property:c.backgroundColor},policyPreviewPadding:{...v,property:c.padding},valueInputHeight:{...m,property:a.M.cssVarList.valueInputHeight},valueInputMarginBottom:{...m,property:a.M.cssVarList.valueInputMarginBottom}}}),o.VO,(0,o.OZ)({proxyProps:["value","selectionStart"]}),(t=>class extends t{init(){super.init?.();const t=document.createElement("template"),e=this.getAttribute("external-input");t.innerHTML=`\n\t\t\t<${s.T}\n\t\t\t\tname="new-password"\n\t\t\t\ttabindex="-1"\n\t\t\t\tslot="input"\n external-input="${e}"\n\t\t\t>\n </${s.T}>\n\t\t\t`,this.baseElement.appendChild(t.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(s.T),"true"===this.getAttribute("external-input")&&this.initExternalInput(),(0,n.EA)(this,this.inputElement,{includeAttrs:["password-label","password-placeholder","confirm-label","confirm-placeholder","full-width","size","bordered","label","has-confirm","invalid","readonly","draggable","has-validation","policy-label","active-policies","available-policies","data-password-policy-value-minlength","label-type","manual-visibility-toggle"]})}createSlottedExternalInput(t,e){const i=t.querySelector("input"),n=document.createElement("slot"),r=i.getAttribute("slot");n.setAttribute("name",e),n.setAttribute("slot",r),t.appendChild(n),i.setAttribute("slot",e),i.setAttribute("data-hidden-input","true"),this.appendChild(i)}initExternalInput(){this.passwordInput=this.inputElement.querySelector('[data-id="password"]'),this.confirmInput=this.inputElement.querySelector('[data-id="confirm"]'),this.createSlottedExternalInput(this.passwordInput,"external-password-input"),this.createSlottedExternalInput(this.confirmInput,"external-confirm-input")}}))((0,o.tz)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t:host {\n\t\t\tdisplay: inline-block;\n\t\t\tmax-width: 100%;\n\t\t\tbox-sizing: border-box;\n\t\t}\n :host ::part(error-message) {\n direction: ltr;\n }\n\t\t${(0,l.cy)(a.M.cssVarList)}\n\t\tvaadin-text-field {\n\t\t\tpadding: 0;\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t}\n\t\tvaadin-text-field::part(input-field) {\n\t\t\tmin-height: 0;\n\t\t\tbackground: transparent;\n\t\t\tbox-shadow: none;\n\t\t\tpadding: 0;\n\t\t}\n\t\tvaadin-text-field::part(input-field)::after {\n\t\t\tbackground: transparent;\n\t\t\topacity: 0;\n\t\t}\n\t\tdescope-new-password-internal {\n\t\t\t-webkit-mask-image: none;\n\t\t\tmin-height: 0;\n\t\t\twidth: 100%;\n\t\t\tpadding: 0;\n\t\t}\n\t\tdescope-new-password-internal > .wrapper {\n -webkit-mask-image: none;\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t}\n\t\tdescope-password {\n\t\t\tdisplay: block;\n\t\t\twidth: 100%;\n\t\t}\n\t\tdescope-new-password-internal vaadin-password-field::before {\n\t\t\theight: initial;\n\t\t}\n descope-policy-validation {\n margin-top: 8px;\n display: flex;\n }\n descope-policy-validation.hidden {\n display: none;\n }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:d}))},83367:(t,e,i)=>{i.d(e,{T:()=>n});const n=(0,i(14944).xE)("new-password-internal")},32039:(t,e,i)=>{var n=i(25827),r=i(14944),o=i(41029),s=i(83367);const a=/^password-/,l=/^confirm-/,p=(t,e)=>t.replace(e,""),d=["password-label","password-placeholder"],c=["confirm-label","confirm-placeholder"],u=["has-confirm","disabled","bordered","size","full-width","maxlength","invalid","readonly","draggable","autocomplete","label-type","manual-visibility-toggle"],h=[].concat(u,d,c,["has-validation"]),b=(0,n.y)({componentName:s.T,baseSelector:"div"});customElements.define(s.T,class extends b{static get observedAttributes(){return[].concat(b.observedAttributes||[],h)}constructor(){super(),this.innerHTML='\n\t\t\t<div class="wrapper"></div>\n\t\t',this.wrapperEle=this.querySelector(".wrapper")}get value(){return this.passwordInput?.value||""}set value(t){t!==this.value&&(this.value=t)}get hasConfirm(){return"true"===this.getAttribute("has-confirm")}onHasConfirmChange(t){this.confirmInput.style.display=t?"":"none"}onHasValidationChange(t){this.policyPanel.style.display=t?"":"none"}get hasValidation(){return"true"===this.getAttribute("has-validation")}getValidity(){if(this.isRequired&&!this.value)return{valueMissing:!0};if(this.value&&!this.policyPanel.isValid)return{typeMismatch:!0};if(this.hasConfirm&&this.confirmInput&&this.value!==this.confirmInput.value)return{patternMismatch:!0};const t=this.getAttribute("minlength"),e=parseInt(t,10)||0;return this.value.length>=e?{}:{tooShort:!0}}init(){this.addEventListener("focus",(t=>{t.isTrusted&&this.passwordInput.focus()})),super.init?.(),this.renderInputs(this.hasConfirm,this.hasValidation)}renderInputs(){const t="true"===this.getAttribute("external-input"),e=`\n <div>\n <descope-password\n autocomplete="new-password"\n manual-visibility-toggle="true"\n data-id="password"\n external-input="${t}"\n ></descope-password>\n <descope-policy-validation></descope-policy-validation>\n </div>\n <descope-password\n autocomplete="new-password"\n manual-visibility-toggle="true"\n external-input="${t}"\n data-id="confirm"\n ></descope-password>\n `;this.wrapperEle.innerHTML=e,this.passwordInput=this.querySelector('[data-id="password"]'),this.confirmInput=this.querySelector('[data-id="confirm"]'),this.policyPanel=this.querySelector("descope-policy-validation"),this.inputs=[this.passwordInput,this.confirmInput],this.initInputs(),this.passwordInput.addEventListener("input",(t=>{this.policyPanel.setAttribute("value",t.target.value)})),(0,r.EA)(this,this.policyPanel,{includeAttrs:["policy-label","available-policies","active-policies","data-password-policy-value-minlength","manual-visibility-toggle"],mapAttrs:{"policy-label":"label","available-policies":"data"}})}handleIndicatorStyle(){this.inputs.forEach((t=>{const e=document.createElement("style");e.innerHTML=`\n\t\t\t\t:host ::part(required-indicator)::after {\n\t\t\t\t\tcontent: var(${o.M.cssVarList.inputsRequiredIndicator});\n width: 1em;\n text-align: center;\n\t\t\t\t}\n :host ::part(required-indicator) {\n display: inline-flex;\n }\n\t\t\t\t`,t?.shadowRoot.appendChild(e)}))}get isInvalid(){return this.hasAttribute("invalid")&&"false"!==this.getAttribute("invalid")}handleInputsInvalidAttribute(){this.inputs.forEach((t=>{t&&(0,r.mx)(t,(e=>{if(e.includes("invalid")){const e=t.getAttribute("invalid"),i=this.getAttribute("invalid");this.isInvalid&&i!==e&&t.setAttribute("invalid","true")}}),{})}))}initInputs(){this.handleIndicatorStyle(),this.handleInputsInvalidAttribute(),this.handleFocusEventsDispatching(this.inputs)}toggleBooleanAttribute(t,e,i){null===i?t?.removeAttribute(e):t?.setAttribute(e,i)}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i),e!==i&&("has-validation"===t?this.onHasValidationChange("true"===i):"has-confirm"===t?this.onHasConfirmChange("true"===i):u.includes(t)?this.inputs.forEach((e=>this.toggleBooleanAttribute(e,t,i))):d.includes(t)?this.toggleBooleanAttribute(this.passwordInput,p(t,a),i):c.includes(t)&&this.toggleBooleanAttribute(this.confirmInput,p(t,l),i))}})},26586:(t,e,i)=>{i.r(e),i.d(e,{NewPasswordClass:()=>n.M});var n=i(41029);i(89348),i(1279),i(28184),i(32039),customElements.define(n.T,n.M)},14372:(t,e,i)=>{i.d(e,{M:()=>f,T:()=>l});var n=i(94619),r=i(7138),o=i(14944),s=i(43686),a=i(33177);const l=(0,o.xE)("password"),{host:p,inputField:d,inputElement:c,inputElementPlaceholder:u,revealButtonContainer:h,revealButtonIcon:b,label:y,requiredIndicator:g,errorMessage:m,helperText:v}={host:{selector:()=>":host"},inputField:{selector:"::part(input-field)"},inputElement:{selector:"> input"},inputElementPlaceholder:{selector:()=>":host input:placeholder-shown"},revealButtonContainer:{selector:"::part(reveal-button)"},revealButtonIcon:{selector:"::part(reveal-button)::before"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},f=(0,r.Zz)((0,n.RF)({mappings:{hostWidth:{...p,property:"width"},hostMinWidth:{...p,property:"min-width"},hostDirection:{...p,property:"direction"},fontSize:[{},p],fontFamily:[y,d,m,v],inputHeight:{...d,property:"height"},inputHorizontalPadding:[{...c,property:"padding-left"},{...c,property:"padding-right"}],inputBackgroundColor:{...d,property:"background-color"},inputBorderStyle:{...d,property:"border-style"},inputBorderWidth:{...d,property:"border-width"},inputBorderColor:{...d,property:"border-color"},inputBorderRadius:{...d,property:"border-radius"},inputOutlineColor:{...d,property:"outline-color"},inputOutlineStyle:{...d,property:"outline-style"},inputOutlineOffset:{...d,property:"outline-offset"},inputOutlineWidth:{...d,property:"outline-width"},labelFontSize:{...y,property:"font-size"},labelFontWeight:{...y,property:"font-weight"},labelTextColor:[{...y,property:"color"},{...g,property:"color"}],labelRequiredIndicator:{...g,property:"content"},errorMessageTextColor:{...m,property:"color"},inputPlaceholderTextColor:[{...u,property:"color"},{selector:()=>":host ::slotted(input:placeholder-shown)",property:"color"}],inputValueTextColor:[{...c,property:"color"},{selector:()=>":host ::slotted(input)",property:"color"}],revealButtonOffset:[{...h,property:"margin-right"},{...h,property:"margin-left"}],revealButtonSize:{...h,property:"font-size"},revealButtonColor:{...b,property:"color"},labelPosition:{...y,property:"position"},labelTopPosition:{...y,property:"top"},labelHorizontalPosition:[{...y,property:"left"},{...y,property:"right"}],inputTransformY:{...y,property:"transform"},inputTransition:{...y,property:"transition"},marginInlineStart:{...y,property:"margin-inline-start"},placeholderOpacity:[{selector:"> input:placeholder-shown",property:"opacity"},{...c,property:"opacity"}],inputVerticalAlignment:{...d,property:"align-items"},valueInputHeight:{...c,property:"height"}}}),n.VO,(0,n.RV)({inputType:"password",includeAttrs:["disabled","readonly","pattern","type","autocomplete"],noBlurDispatch:!0}),(0,n.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),n.tQ,s.A,(t=>class extends t{static get observedAttributes(){return["manual-visibility-toggle"]}get manualToggleVisibility(){return"true"===this.getAttribute("manual-visibility-toggle")}init(){super.init?.(),this.handleCaretOnVisibilityChange(),this.origSetPasswordVisible=this.baseElement._setPasswordVisible,this.origSetFocused=this.baseElement._setFocused,this.baseElement._setFocused=this.setFocus.bind(this),this.initExternalInput()}initExternalInput(){const t=this.createExternalInput();t&&this.handlePasswordVisibility(t)}get caretPosition(){return this.value?.length||0}handleCaretOnVisibilityChange(){const t=this.baseElement._togglePasswordVisibility.bind(this.baseElement);this.baseElement._togglePasswordVisibility=()=>{setTimeout((()=>(t(),this.inputElement.setSelectionRange(this.caretPosition,this.caretPosition),!1)))}}setFocus(t){this.manualToggleVisibility&&(this.baseElement._setPasswordVisible=()=>{}),this.origSetFocused.call(this.baseElement,t),this.baseElement._setPasswordVisible=this.origSetPasswordVisible.bind(this.baseElement)}resetPasswordVisibilityToggle(){this.baseElement._setPasswordVisible=this.origSetPasswordVisible,this.baseElement._setFocused=this.origSetFocus}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i)}handlePasswordVisibility(t){const e=this.baseElement.__boundRevealButtonMouseDown;this.baseElement.querySelector("vaadin-password-field-button").removeEventListener("mousedown",e),this.baseElement._passwordVisibleChanged=()=>{},this.baseElement._togglePasswordVisibility=()=>{"password"===t.getAttribute("type")?this.showPasswordVisibility(t):this.hidePasswordVisibility(t)}}showPasswordVisibility(t){t.setAttribute("type","text"),this.setAttribute("password-visible","true")}hidePasswordVisibility(t){t.setAttribute("type","password"),this.setAttribute("password-visible","false")}}))((0,n.tz)({slots:["","suffix"],wrappedEleName:"vaadin-password-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\tmin-width: 10em;\n box-sizing: border-box;\n position: relative;\n\t\t\t}\n\t\t\t${(0,a.cy)(f.cssVarList)}\n\t\t\t${(0,a.I4)("vaadin-password-field")}\n ${(0,a.$J)("vaadin-password-field")}\n\n\t\t\tvaadin-password-field {\n\t\t\t\twidth: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-password-field > input {\n -webkit-mask-image: none;\n\t\t\t\tbox-sizing: border-box;\n opacity: 1;\n\t\t\t}\n\t\t\tvaadin-password-field::part(input-field) {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-password-field[focus-ring]::part(input-field) {\n\t\t\t\tbox-shadow: none;\n\t\t\t}\n :host ::slotted(input) {\n\t\t\t\tmin-height: 0;\n }\n :host([readonly]) ::slotted(input:placeholder-shown) {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\tvaadin-password-field::before {\n\t\t\t\theight: initial;\n\t\t\t}\n\t\t\tvaadin-password-field::part(input-field)::after {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\tvaadin-password-field-button {\n\t\t\t\tcursor: pointer;\n\t\t\t}\n\t\t\t:host([readonly]) vaadin-password-field-button {\n\t\t\t\tpointer-events: none;\n\t\t\t}\n\t\t\tvaadin-password-field-button[focus-ring] {\n\t\t\t\tbox-shadow: 0 0 0 2px var(${f.cssVarList.inputOutlineColor});\n\t\t\t}\n\n ${(0,a.Kl)()}\n \n ::part(reveal-button) {\n align-self: center;\n }\n\n vaadin-password-field[external-input="true"] > input:not(:placeholder-shown) {\n opacity: 0;\n }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:l}))},1279:(t,e,i)=>{i.r(e),i.d(e,{PasswordClass:()=>n.M}),i(40351);var n=i(14372);customElements.define(n.T,n.M)},43686:(t,e,i)=>{i.d(e,{A:()=>n});const n=t=>class extends t{get isReadOnly(){return this.hasAttribute("readonly")&&"false"!==this.getAttribute("readonly")}init(){super.init?.();const t=this.querySelector("input");t?.addEventListener("mousedown",(e=>{if(this.isDraggable&&this.isReadOnly){t.setAttribute("inert","true");const i=e.target,n=i.getAttribute("type");i.setAttribute("type","text"),setTimeout((()=>{i.focus()}));const r=e=>{i.setAttribute("type",n),t.removeAttribute("inert"),this.removeEventListener("mouseup",r),this.removeEventListener("dragend",r)};this.addEventListener("dragend",r,{once:!0}),this.addEventListener("mouseup",r,{once:!0})}}))}}},9775:(t,e,i)=>{i.d(e,{T:()=>l,w:()=>m});var n=i(94619),r=i(70263),o=i(7138),s=i(14944),a=i(38917);const l=(0,s.xE)("policy-validation"),p=["data","active-policies","overrides","data-password-policy-value-minlength"],d=["label","value",...p];class c extends((0,r.q)({componentName:l,baseSelector:":host > div"})){#t;#e=[];#i;static get observedAttributes(){return d}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <div>\n <div class="label"></div>\n <ul></ul>\n </div>\n <style>\n :host > div {\n width: 100%;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n }\n .label {\n max-width: 100%;\n text-wrap: wrap;\n overflow-wrap: break-word;\n }\n .hide-label .label {\n display: none;\n }\n ul {\n display: flex;\n flex-direction: column;\n padding: 0;\n margin: 0;\n }\n ul, li {\n margin: 0;\n padding: 0;\n list-style: none;\n }\n li::before {\n display: inline-block;\n width: 1em;\n text-align: center;\n }\n </style>\n\t\t',this.panel=this.shadowRoot.querySelector(":host > div"),this.label=this.shadowRoot.querySelector(".label"),this.list=this.shadowRoot.querySelector("ul")}attributeChangedCallback(t,e,i){if(super.attributeChangedCallback?.(t,e,i),e!==i){if("label"===t&&this.updateLabel(i),p.includes(t)){if("data"===t)try{this.availablePolicies=JSON.parse(i)}catch{console.error("Failed to set available policies")}if("active-policies"===t&&(this.#e=(i||"").split(",")),"data-password-policy-value-minlength"===t){const t=Number(i);!Number.isNaN(t)&&t>0&&(this.#i={...this.#i,minlength:{value:`${t}`}})}}this.renderItems(this.#t,this.#e,this.#i)}}get availablePolicies(){return this.#t||[]}set availablePolicies(t){this.#t=t}get value(){return this.getAttribute("value")||""}validate(){let t=this.#t;return this.#i&&(t=this.#t.map((t=>this.#i[t.id]?{...t,data:this.#i[t.id]}:t))),this.#e.reduce(((e,i)=>{const n=t.find((t=>t.id===i));if(!n)return e;const{pattern:r,message:o,data:s}=n;if(!r||!o)return e;const l={valid:new RegExp((0,a.z)(r,s)).test(this.value),message:(0,a.z)(o,s),id:i};return e.push(l),e}),[])}get isValid(){return!this.validate().some((({valid:t})=>!1===t))}getValidationItemTemplate({valid:t,message:e}){return`\n <li class="item" data-valid="${this.value?t:"none"}">\n <span class="message">${e}</span>\n </li>\n `}renderItems(t,e){t&&e.length&&(this.list.innerHTML=this.validate().map(this.getValidationItemTemplate.bind(this)).join(""))}updateLabel(t){t?(this.label.innerHTML=t,this.classList.remove("hide-label")):(this.classList.add("hide-label"),this.label.innerHTML="")}}const{host:u,item:h,symbolDefault:b,symbolSuccess:y,symbolError:g}={host:{selector:()=>":host > div"},item:{selector:()=>".item"},symbolDefault:{selector:()=>'.item[data-valid="none"]::before'},symbolSuccess:{selector:()=>'.item[data-valid="true"]::before'},symbolError:{selector:()=>'.item[data-valid="false"]::before'}},m=(0,o.Zz)((0,n.RF)({componentNameOverride:(0,s.xE)("input-wrapper")}),(0,n.RF)({mappings:{hostDirection:{selector:()=>":host",property:"direction"},fontSize:{},fontFamily:{},padding:{},borderWidth:{...u,property:"border-width"},borderStyle:{...u,property:"border-style"},borderColor:{...u,property:"border-color"},borderRadius:{...u,property:"border-radius"},backgroundColor:{...u,property:"background-color"},textColor:{property:"color"},labelMargin:{...u,property:"gap"},itemsSpacing:{...h,property:"line-height"},itemSymbolSuccessColor:{...y,property:"color"},itemSymbolErrorColor:{...g,property:"color"},itemSymbolDefault:{...b,property:"content"},itemSymbolSuccess:{...y,property:"content"},itemSymbolError:{...g,property:"content"}}}),n.VO,n.tQ)(c)},38917:(t,e,i)=>{i.d(e,{z:()=>n});const n=(t,e)=>t.replace(/{{(\w+)+}}/g,((t,i)=>e?.[i]||t))},28184:(t,e,i)=>{i.r(e),i.d(e,{PolicyValidationClass:()=>n.w});var n=i(9775);customElements.define(n.T,n.w)},69473:(t,e,i)=>{i.d(e,{T:()=>l,w:()=>d});var n=i(94619),r=i(93826),o=i(7138),s=i(14944),a=i(33177);const l=(0,s.xE)("text-field"),p=["type","label-type","copy-to-clipboard"],d=(0,o.Zz)((0,n.RF)({mappings:r.A}),n.VO,(0,n.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),n.tQ,(t=>class extends t{static get observedAttributes(){return p.concat(t.observedAttributes||[])}icon;init(){super.init?.()}renderCopyToClipboard(t){if(!t)return void this.icon?.remove();const e={icon:"vaadin:copy-o",title:"Copy",style:"cursor: pointer"},i={icon:"vaadin:check-circle-o",title:"Copied",style:"cursor: initial"};this.icon=Object.assign(document.createElement("vaadin-icon"),{slot:"suffix",...e}),this.baseElement.appendChild(this.icon),this.icon.addEventListener("click",(()=>{navigator.clipboard.writeText(this.value),Object.assign(this.icon,i),setTimeout((()=>{Object.assign(this.icon,e)}),5e3)}))}onLabelClick(){this.focus()}attributeChangedCallback(t,e,i){super.attributeChangeCallback?.(t,e,i),"type"===t&&this.baseElement._setType(i),e!==i&&("label-type"===t?"floating"===i?this.addEventListener("click",this.onLabelClick):this.removeEventListener("click",this.onLabelClick):"copy-to-clipboard"===t&&this.renderCopyToClipboard("true"===i))}}))((0,n.tz)({slots:["prefix","suffix"],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tpadding: calc(var(${d.cssVarList.inputOutlineWidth}) + var(${d.cssVarList.inputOutlineOffset}));\n box-sizing: border-box;\n\t\t\t}\n :host(:is([readonly], [disabled])) ::slotted(:is(input, textarea):placeholder-shown) {\n opacity: 1;\n }\n\n vaadin-text-field[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n opacity: 0;\n }\n vaadin-text-field[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n opacity: 0;\n }\n ${(0,a.$J)("vaadin-text-field")}\n\t\t\t${(0,a.cy)(d.cssVarList)}\n\t\t\t${(0,a.LJ)("vaadin-text-field",d.cssVarList)}\n ${(0,a.Kl)()}\n\n vaadin-text-field vaadin-icon {\n align-self: center;\n }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:l}))},89348:(t,e,i)=>{i.r(e),i.d(e,{TextFieldClass:()=>n.w}),i(39542),i(66418),i(56637);var n=i(69473);customElements.define(n.T,n.w)},93826:(t,e,i)=>{i.d(e,{A:()=>f});const{host:n,label:r,placeholder:o,requiredIndicator:s,inputField:a,input:l,inputMask:p,helperText:d,errorMessage:c,disabledPlaceholder:u,inputDisabled:h,inputIcon:b,externalInput:y,externalInputDisabled:g,externalPlaceholder:m,externalDisabledPlaceholder:v}={host:{selector:()=>":host"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},placeholder:[{selector:"> input:placeholder-shown"},{selector:()=>":host::slotted(input:placeholder-shown)"}],disabledPlaceholder:{selector:"> input:disabled::placeholder"},inputField:{selector:"::part(input-field)"},input:{selector:"input"},inputMask:{selector:"::part(input-field)::before"},inputDisabled:{selector:"input:disabled"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"},inputIcon:{selector:"vaadin-icon"},externalInput:{selector:()=>"::slotted(input)"},externalInputDisabled:{selector:()=>"::slotted(input:disabled)"},externalPlaceholder:{selector:()=>"::slotted(input:placeholder-shown)"},externalDisabledPlaceholder:{selector:()=>"::slotted(input:disabled::placeholder)"}},f={fontSize:[{},n],fontFamily:[r,a,d,c],labelFontSize:{...r,property:"font-size"},labelFontWeight:{...r,property:"font-weight"},labelTextColor:[{...r,property:"color"},{...s,property:"color"},{...r,property:"-webkit-text-fill-color"},{...s,property:"-webkit-text-fill-color"}],hostWidth:{...n,property:"width"},hostMinWidth:{...n,property:"min-width"},hostDirection:{...n,property:"direction"},inputDirection:{...l,property:"direction"},inputBackgroundColor:[{...a,property:"background-color"},{...p,property:"background-color"}],errorMessageTextColor:{...c,property:"color"},helperTextColor:{...d,property:"-webkit-text-fill-color"},inputValueTextColor:[{...a,property:"color"},{...h,property:"-webkit-text-fill-color"},{...g,property:"-webkit-text-fill-color"}],inputCaretTextColor:[{...l,property:"caret-color"},{...y,property:"caret-color"}],labelRequiredIndicator:{...s,property:"content"},inputBorderColor:{...a,property:"border-color"},inputBorderWidth:{...a,property:"border-width"},inputBorderStyle:{...a,property:"border-style"},inputBorderRadius:{...a,property:"border-radius"},inputHeight:{...a,property:"height"},inputHorizontalPadding:[{...l,property:"padding-left"},{...l,property:"padding-right"},{...y,property:"padding-left"},{...y,property:"padding-right"}],inputOutlineColor:{...a,property:"outline-color"},inputOutlineStyle:{...a,property:"outline-style"},inputOutlineWidth:{...a,property:"outline-width"},inputOutlineOffset:{...a,property:"outline-offset"},textAlign:{},inputTextAlign:[{...l,property:"text-align"},{...y,property:"text-align"}],inputPlaceholderColor:[{selector:()=>":host input:placeholder-shown",property:"color"},{...m,property:"color"},{...o,property:"color"},{...u,property:"-webkit-text-fill-color"},{...v,property:"-webkit-text-fill-color"}],labelPosition:{...r,property:"position"},labelTopPosition:{...r,property:"top"},labelHorizontalPosition:[{...r,property:"left"},{...r,property:"right"}],inputTransformY:{...r,property:"transform"},inputTransition:{...r,property:"transition"},marginInlineStart:{...r,property:"margin-inline-start"},placeholderOpacity:[{selector:"> input:placeholder-shown",property:"opacity"},{...m,property:"opacity"}],inputVerticalAlignment:[{...a,property:"align-items"},{...y,property:"align-items"}],valueInputHeight:[{...l,property:"height"},{...y,property:"height"}],valueInputMarginBottom:[{...l,property:"margin-bottom"},{...y,property:"margin-bottom"}],inputIconOffset:[{...b,property:"margin-right"},{...b,property:"margin-left"}],inputIconSize:{...b,property:"font-size"},inputIconColor:{...b,property:"color"}}},33177:(t,e,i)=>{i.d(e,{$J:()=>u,I4:()=>s,Kl:()=>h,LJ:()=>c,Qv:()=>o,X6:()=>l,cy:()=>n,fu:()=>p,kG:()=>d,lS:()=>a,zm:()=>r});const n=t=>`\n :host {\n padding: calc(var(${t.inputOutlineWidth}) + var(${t.inputOutlineOffset}))\n }\n`,r=t=>`\n ${t} {\n margin: 0;\n padding: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n }\n`,o=t=>`\n ${t}::part(input-field) {\n overflow: hidden;\n padding: 0;\n box-shadow: none;\n }\n`,s=t=>`\n ${t} > label,\n ${t}::part(label),\n ${t}::part(required-indicator) {\n cursor: pointer;\n }\n`,a=(t,e="input")=>`\n ${t}[disabled] > ${e}:placeholder-shown,\n\t${t}[readonly] > ${e}:placeholder-shown {\n\t\topacity: 1;\n\t}\n`,l=()=>"\n :host {\n --vaadin-field-default-width: auto;\n box-sizing: border-box;\n }\n",p=t=>`\n ${t}::part(input-field)::after {\n opacity: 0;\n }\n`,d=t=>`\n ${t}::part(input-field)::after {\n background: none;\n }\n`,c=(t,e)=>`\n ${r(t)}\n ${s(t)}\n ${a(t)}\n ${o(t)}\n ${((t,e)=>`\n ${t} input:-webkit-autofill,\n ${t} input:-webkit-autofill::first-line,\n ${t} input:-webkit-autofill:hover,\n ${t} input:-webkit-autofill:active,\n ${t} input:-webkit-autofill:focus {\n -webkit-text-fill-color: var(${e.inputValueTextColor});\n box-shadow: 0 0 0 var(${e.inputHeight}) var(${e.inputBackgroundColor}) inset;\n }\n`)(t,e)}\n ${d(t)}\n ${(t=>`\n ${t}::before {\n\t\theight: unset;\n\t}\n`)(t)}\n ${(t=>`\n ${t} > input {\n -webkit-mask-image: none;\n min-height: 0;\n box-sizing: border-box;\n }\n`)(t)}\n ${(t=>`\n ${t}::part(input-field)::after {\n border: none;\n }\n`)(t)}\n`,u=t=>`\n :host ::part(error-message) {\n direction: ltr;\n }\n :host([required]) ::part(required-indicator) {\n width: 1em;\n display: inline-flex;\n }\n :host([required]) ::part(required-indicator)::after {\n position: static;\n }\n :host([has-label]) ::part(label) {\n padding-right: 0;\n padding-bottom: 0;\n display: flex;\n width: 100%;\n }\n ${t} [slot="label"] {\n max-width: calc(100% - 1em);\n overflow: hidden;\n text-overflow: ellipsis;\n padding-bottom: 0.5em;\n }\n`,h=()=>'\n :host([label-type="floating"]) {\n position: relative;\n }\n :host([label-type="floating"][has-label]) [slot="label"] {\n padding: 0;\n }\n :host([label-type="floating"][has-label]) > ::part(label) {\n z-index: 1;\n padding: 0;\n width: auto;\n }\n '},39542:(t,e,i)=>{i(70297),i(34068)}}]);
1
+ "use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[4364,8603,6969,2996],{25827:(t,e,i)=>{i.d(e,{y:()=>s});var n=i(7138),r=i(94619),o=i(70263);const s=(...t)=>(0,n.Zz)(r.XX,r._$,r.yF,r.jd)((0,o.q)(...t))},41029:(t,e,i)=>{i.d(e,{M:()=>f,T:()=>d});var n=i(14944),r=i(7138),o=i(94619),s=i(83367),a=i(14372),l=i(33177),p=i(9775);const d=(0,n.xE)("new-password"),c=p.w.cssVarList,{host:u,label:h,internalInputsWrapper:b,errorMessage:y,helperText:g,passwordInput:m,policyPreview:v}={host:{selector:()=>":host"},label:{selector:"::part(label)"},internalInputsWrapper:{selector:"descope-new-password-internal .wrapper"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"},passwordInput:{selector:"descope-password"},policyPreview:{selector:"descope-policy-validation"}},f=(0,r.Zz)((0,o.RF)({mappings:{fontSize:[u,{},{selector:a.M.componentName,property:a.M.cssVarList.fontSize}],fontFamily:[h,y,g],labelFontSize:{...h,property:"font-size"},labelFontWeight:{...h,property:"font-weight"},labelTextColor:{...h,property:"color"},errorMessageTextColor:{...y,property:"color"},hostWidth:{...u,property:"width"},hostMinWidth:{...u,property:"min-width"},hostDirection:[{...u,property:"direction"},{...m,property:a.M.cssVarList.hostDirection}],inputsRequiredIndicator:{...u,property:"content"},spaceBetweenInputs:{...b,property:"gap"},policyPreviewBackgroundColor:{...v,property:c.backgroundColor},policyPreviewPadding:{...v,property:c.padding},valueInputHeight:{...m,property:a.M.cssVarList.valueInputHeight},valueInputMarginBottom:{...m,property:a.M.cssVarList.valueInputMarginBottom}}}),o.VO,(0,o.OZ)({proxyProps:["value","selectionStart"]}),(t=>class extends t{init(){super.init?.();const t=document.createElement("template"),e=this.getAttribute("external-input");t.innerHTML=`\n\t\t\t<${s.T}\n\t\t\t\tname="new-password"\n\t\t\t\ttabindex="-1"\n\t\t\t\tslot="input"\n external-input="${e}"\n\t\t\t>\n </${s.T}>\n\t\t\t`,this.baseElement.appendChild(t.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(s.T),"true"===this.getAttribute("external-input")&&this.initExternalInput(),(0,n.EA)(this,this.inputElement,{includeAttrs:["password-label","password-placeholder","confirm-label","confirm-placeholder","full-width","size","bordered","label","has-confirm","invalid","readonly","draggable","has-validation","policy-label","active-policies","available-policies","data-password-policy-value-minlength","label-type","manual-visibility-toggle"]})}createSlottedExternalInput(t,e){const i=t.querySelector("input"),n=document.createElement("slot"),r=i.getAttribute("slot");n.setAttribute("name",e),n.setAttribute("slot",r),t.appendChild(n),i.setAttribute("slot",e),i.setAttribute("name",this.getAttribute("name")),i.setAttribute("data-hidden-input","true"),this.appendChild(i)}initExternalInput(){this.passwordInput=this.inputElement.querySelector('[data-id="password"]'),this.confirmInput=this.inputElement.querySelector('[data-id="confirm"]'),this.createSlottedExternalInput(this.passwordInput,"external-password-input"),this.createSlottedExternalInput(this.confirmInput,"external-confirm-input")}}))((0,o.tz)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t:host {\n\t\t\tdisplay: inline-block;\n\t\t\tmax-width: 100%;\n\t\t\tbox-sizing: border-box;\n\t\t}\n :host ::part(error-message) {\n direction: ltr;\n }\n\t\t${(0,l.cy)(a.M.cssVarList)}\n\t\tvaadin-text-field {\n\t\t\tpadding: 0;\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t}\n\t\tvaadin-text-field::part(input-field) {\n\t\t\tmin-height: 0;\n\t\t\tbackground: transparent;\n\t\t\tbox-shadow: none;\n\t\t\tpadding: 0;\n\t\t}\n\t\tvaadin-text-field::part(input-field)::after {\n\t\t\tbackground: transparent;\n\t\t\topacity: 0;\n\t\t}\n\t\tdescope-new-password-internal {\n\t\t\t-webkit-mask-image: none;\n\t\t\tmin-height: 0;\n\t\t\twidth: 100%;\n\t\t\tpadding: 0;\n\t\t}\n\t\tdescope-new-password-internal > .wrapper {\n -webkit-mask-image: none;\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t}\n\t\tdescope-password {\n\t\t\tdisplay: block;\n\t\t\twidth: 100%;\n\t\t}\n\t\tdescope-new-password-internal vaadin-password-field::before {\n\t\t\theight: initial;\n\t\t}\n descope-policy-validation {\n margin-top: 8px;\n display: flex;\n }\n descope-policy-validation.hidden {\n display: none;\n }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:d}))},83367:(t,e,i)=>{i.d(e,{T:()=>n});const n=(0,i(14944).xE)("new-password-internal")},32039:(t,e,i)=>{var n=i(25827),r=i(14944),o=i(41029),s=i(83367);const a=/^password-/,l=/^confirm-/,p=(t,e)=>t.replace(e,""),d=["password-label","password-placeholder"],c=["confirm-label","confirm-placeholder"],u=["has-confirm","disabled","bordered","size","full-width","maxlength","invalid","readonly","draggable","autocomplete","label-type","manual-visibility-toggle"],h=[].concat(u,d,c,["has-validation"]),b=(0,n.y)({componentName:s.T,baseSelector:"div"});customElements.define(s.T,class extends b{static get observedAttributes(){return[].concat(b.observedAttributes||[],h)}constructor(){super(),this.innerHTML='\n\t\t\t<div class="wrapper"></div>\n\t\t',this.wrapperEle=this.querySelector(".wrapper")}get value(){return this.passwordInput?.value||""}set value(t){t!==this.value&&(this.value=t)}get hasConfirm(){return"true"===this.getAttribute("has-confirm")}onHasConfirmChange(t){this.confirmInput.style.display=t?"":"none"}onHasValidationChange(t){this.policyPanel.style.display=t?"":"none"}get hasValidation(){return"true"===this.getAttribute("has-validation")}getValidity(){if(this.isRequired&&!this.value)return{valueMissing:!0};if(this.value&&!this.policyPanel.isValid)return{typeMismatch:!0};if(this.hasConfirm&&this.confirmInput&&this.value!==this.confirmInput.value)return{patternMismatch:!0};const t=this.getAttribute("minlength"),e=parseInt(t,10)||0;return this.value.length>=e?{}:{tooShort:!0}}init(){this.addEventListener("focus",(t=>{t.isTrusted&&this.passwordInput.focus()})),super.init?.(),this.renderInputs(this.hasConfirm,this.hasValidation)}renderInputs(){const t="true"===this.getAttribute("external-input"),e=`\n <div>\n <descope-password\n autocomplete="new-password"\n manual-visibility-toggle="true"\n data-id="password"\n external-input="${t}"\n ></descope-password>\n <descope-policy-validation></descope-policy-validation>\n </div>\n <descope-password\n autocomplete="new-password"\n manual-visibility-toggle="true"\n external-input="${t}"\n data-id="confirm"\n ></descope-password>\n `;this.wrapperEle.innerHTML=e,this.passwordInput=this.querySelector('[data-id="password"]'),this.confirmInput=this.querySelector('[data-id="confirm"]'),this.policyPanel=this.querySelector("descope-policy-validation"),this.inputs=[this.passwordInput,this.confirmInput],this.initInputs(),this.passwordInput.addEventListener("input",(t=>{this.policyPanel.setAttribute("value",t.target.value)})),(0,r.EA)(this,this.policyPanel,{includeAttrs:["policy-label","available-policies","active-policies","data-password-policy-value-minlength","manual-visibility-toggle"],mapAttrs:{"policy-label":"label","available-policies":"data"}})}handleIndicatorStyle(){this.inputs.forEach((t=>{const e=document.createElement("style");e.innerHTML=`\n\t\t\t\t:host ::part(required-indicator)::after {\n\t\t\t\t\tcontent: var(${o.M.cssVarList.inputsRequiredIndicator});\n width: 1em;\n text-align: center;\n\t\t\t\t}\n :host ::part(required-indicator) {\n display: inline-flex;\n }\n\t\t\t\t`,t?.shadowRoot.appendChild(e)}))}get isInvalid(){return this.hasAttribute("invalid")&&"false"!==this.getAttribute("invalid")}handleInputsInvalidAttribute(){this.inputs.forEach((t=>{t&&(0,r.mx)(t,(e=>{if(e.includes("invalid")){const e=t.getAttribute("invalid"),i=this.getAttribute("invalid");this.isInvalid&&i!==e&&t.setAttribute("invalid","true")}}),{})}))}initInputs(){this.handleIndicatorStyle(),this.handleInputsInvalidAttribute(),this.handleFocusEventsDispatching(this.inputs)}toggleBooleanAttribute(t,e,i){null===i?t?.removeAttribute(e):t?.setAttribute(e,i)}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i),e!==i&&("has-validation"===t?this.onHasValidationChange("true"===i):"has-confirm"===t?this.onHasConfirmChange("true"===i):u.includes(t)?this.inputs.forEach((e=>this.toggleBooleanAttribute(e,t,i))):d.includes(t)?this.toggleBooleanAttribute(this.passwordInput,p(t,a),i):c.includes(t)&&this.toggleBooleanAttribute(this.confirmInput,p(t,l),i))}})},26586:(t,e,i)=>{i.r(e),i.d(e,{NewPasswordClass:()=>n.M});var n=i(41029);i(89348),i(1279),i(28184),i(32039),customElements.define(n.T,n.M)},14372:(t,e,i)=>{i.d(e,{M:()=>f,T:()=>l});var n=i(94619),r=i(7138),o=i(14944),s=i(43686),a=i(33177);const l=(0,o.xE)("password"),{host:p,inputField:d,inputElement:c,inputElementPlaceholder:u,revealButtonContainer:h,revealButtonIcon:b,label:y,requiredIndicator:g,errorMessage:m,helperText:v}={host:{selector:()=>":host"},inputField:{selector:"::part(input-field)"},inputElement:{selector:"> input"},inputElementPlaceholder:{selector:()=>":host input:placeholder-shown"},revealButtonContainer:{selector:"::part(reveal-button)"},revealButtonIcon:{selector:"::part(reveal-button)::before"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},f=(0,r.Zz)((0,n.RF)({mappings:{hostWidth:{...p,property:"width"},hostMinWidth:{...p,property:"min-width"},hostDirection:{...p,property:"direction"},fontSize:[{},p],fontFamily:[y,d,m,v],inputHeight:{...d,property:"height"},inputHorizontalPadding:[{...c,property:"padding-left"},{...c,property:"padding-right"}],inputBackgroundColor:{...d,property:"background-color"},inputBorderStyle:{...d,property:"border-style"},inputBorderWidth:{...d,property:"border-width"},inputBorderColor:{...d,property:"border-color"},inputBorderRadius:{...d,property:"border-radius"},inputOutlineColor:{...d,property:"outline-color"},inputOutlineStyle:{...d,property:"outline-style"},inputOutlineOffset:{...d,property:"outline-offset"},inputOutlineWidth:{...d,property:"outline-width"},labelFontSize:{...y,property:"font-size"},labelFontWeight:{...y,property:"font-weight"},labelTextColor:[{...y,property:"color"},{...g,property:"color"}],labelRequiredIndicator:{...g,property:"content"},errorMessageTextColor:{...m,property:"color"},inputPlaceholderTextColor:[{...u,property:"color"},{selector:()=>":host ::slotted(input:placeholder-shown)",property:"color"}],inputValueTextColor:[{...c,property:"color"},{selector:()=>":host ::slotted(input)",property:"color"}],revealButtonOffset:[{...h,property:"margin-right"},{...h,property:"margin-left"}],revealButtonSize:{...h,property:"font-size"},revealButtonColor:{...b,property:"color"},labelPosition:{...y,property:"position"},labelTopPosition:{...y,property:"top"},labelHorizontalPosition:[{...y,property:"left"},{...y,property:"right"}],inputTransformY:{...y,property:"transform"},inputTransition:{...y,property:"transition"},marginInlineStart:{...y,property:"margin-inline-start"},placeholderOpacity:[{selector:"> input:placeholder-shown",property:"opacity"},{...c,property:"opacity"}],inputVerticalAlignment:{...d,property:"align-items"},valueInputHeight:{...c,property:"height"}}}),n.VO,(0,n.RV)({inputType:"password",inputName:"password",includeAttrs:["disabled","readonly","pattern","type","autocomplete"],noBlurDispatch:!0}),(0,n.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),n.tQ,s.A,(t=>class extends t{static get observedAttributes(){return["manual-visibility-toggle"]}get manualToggleVisibility(){return"true"===this.getAttribute("manual-visibility-toggle")}init(){super.init?.(),this.handleCaretOnVisibilityChange(),this.origSetPasswordVisible=this.baseElement._setPasswordVisible,this.origSetFocused=this.baseElement._setFocused,this.baseElement._setFocused=this.setFocus.bind(this),this.initExternalInput()}initExternalInput(){const t=this.createExternalInput();t&&this.handlePasswordVisibility(t)}get caretPosition(){return this.value?.length||0}handleCaretOnVisibilityChange(){const t=this.baseElement._togglePasswordVisibility.bind(this.baseElement);this.baseElement._togglePasswordVisibility=()=>{setTimeout((()=>(t(),this.inputElement.setSelectionRange(this.caretPosition,this.caretPosition),!1)))}}setFocus(t){this.manualToggleVisibility&&(this.baseElement._setPasswordVisible=()=>{}),this.origSetFocused.call(this.baseElement,t),this.baseElement._setPasswordVisible=this.origSetPasswordVisible.bind(this.baseElement)}resetPasswordVisibilityToggle(){this.baseElement._setPasswordVisible=this.origSetPasswordVisible,this.baseElement._setFocused=this.origSetFocus}attributeChangedCallback(t,e,i){super.attributeChangedCallback?.(t,e,i)}handlePasswordVisibility(t){const e=this.baseElement.__boundRevealButtonMouseDown;this.baseElement.querySelector("vaadin-password-field-button").removeEventListener("mousedown",e),this.baseElement._passwordVisibleChanged=()=>{},this.baseElement._togglePasswordVisibility=()=>{"password"===t.getAttribute("type")?this.showPasswordVisibility(t):this.hidePasswordVisibility(t)}}showPasswordVisibility(t){t.setAttribute("type","text"),this.setAttribute("password-visible","true")}hidePasswordVisibility(t){t.setAttribute("type","password"),this.setAttribute("password-visible","false")}}))((0,n.tz)({slots:["","suffix"],wrappedEleName:"vaadin-password-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\tmin-width: 10em;\n box-sizing: border-box;\n position: relative;\n\t\t\t}\n\t\t\t${(0,a.cy)(f.cssVarList)}\n\t\t\t${(0,a.I4)("vaadin-password-field")}\n ${(0,a.$J)("vaadin-password-field")}\n\n\t\t\tvaadin-password-field {\n\t\t\t\twidth: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-password-field > input {\n -webkit-mask-image: none;\n\t\t\t\tbox-sizing: border-box;\n opacity: 1;\n\t\t\t}\n\t\t\tvaadin-password-field::part(input-field) {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-password-field[focus-ring]::part(input-field) {\n\t\t\t\tbox-shadow: none;\n\t\t\t}\n :host ::slotted(input) {\n\t\t\t\tmin-height: 0;\n }\n :host([readonly]) ::slotted(input:placeholder-shown) {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\tvaadin-password-field::before {\n\t\t\t\theight: initial;\n\t\t\t}\n\t\t\tvaadin-password-field::part(input-field)::after {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\tvaadin-password-field-button {\n\t\t\t\tcursor: pointer;\n\t\t\t}\n\t\t\t:host([readonly]) vaadin-password-field-button {\n\t\t\t\tpointer-events: none;\n\t\t\t}\n\t\t\tvaadin-password-field-button[focus-ring] {\n\t\t\t\tbox-shadow: 0 0 0 2px var(${f.cssVarList.inputOutlineColor});\n\t\t\t}\n\n ${(0,a.Kl)()}\n \n ::part(reveal-button) {\n align-self: center;\n }\n\n vaadin-password-field[external-input="true"] > input:not(:placeholder-shown) {\n opacity: 0;\n }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:l}))},1279:(t,e,i)=>{i.r(e),i.d(e,{PasswordClass:()=>n.M}),i(40351);var n=i(14372);customElements.define(n.T,n.M)},43686:(t,e,i)=>{i.d(e,{A:()=>n});const n=t=>class extends t{get isReadOnly(){return this.hasAttribute("readonly")&&"false"!==this.getAttribute("readonly")}init(){super.init?.();const t=this.querySelector("input");t?.addEventListener("mousedown",(e=>{if(this.isDraggable&&this.isReadOnly){t.setAttribute("inert","true");const i=e.target,n=i.getAttribute("type");i.setAttribute("type","text"),setTimeout((()=>{i.focus()}));const r=e=>{i.setAttribute("type",n),t.removeAttribute("inert"),this.removeEventListener("mouseup",r),this.removeEventListener("dragend",r)};this.addEventListener("dragend",r,{once:!0}),this.addEventListener("mouseup",r,{once:!0})}}))}}},9775:(t,e,i)=>{i.d(e,{T:()=>l,w:()=>m});var n=i(94619),r=i(70263),o=i(7138),s=i(14944),a=i(38917);const l=(0,s.xE)("policy-validation"),p=["data","active-policies","overrides","data-password-policy-value-minlength"],d=["label","value",...p];class c extends((0,r.q)({componentName:l,baseSelector:":host > div"})){#t;#e=[];#i;static get observedAttributes(){return d}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <div>\n <div class="label"></div>\n <ul></ul>\n </div>\n <style>\n :host > div {\n width: 100%;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n }\n .label {\n max-width: 100%;\n text-wrap: wrap;\n overflow-wrap: break-word;\n }\n .hide-label .label {\n display: none;\n }\n ul {\n display: flex;\n flex-direction: column;\n padding: 0;\n margin: 0;\n }\n ul, li {\n margin: 0;\n padding: 0;\n list-style: none;\n }\n li::before {\n display: inline-block;\n width: 1em;\n text-align: center;\n }\n </style>\n\t\t',this.panel=this.shadowRoot.querySelector(":host > div"),this.label=this.shadowRoot.querySelector(".label"),this.list=this.shadowRoot.querySelector("ul")}attributeChangedCallback(t,e,i){if(super.attributeChangedCallback?.(t,e,i),e!==i){if("label"===t&&this.updateLabel(i),p.includes(t)){if("data"===t)try{this.availablePolicies=JSON.parse(i)}catch{console.error("Failed to set available policies")}if("active-policies"===t&&(this.#e=(i||"").split(",")),"data-password-policy-value-minlength"===t){const t=Number(i);!Number.isNaN(t)&&t>0&&(this.#i={...this.#i,minlength:{value:`${t}`}})}}this.renderItems(this.#t,this.#e,this.#i)}}get availablePolicies(){return this.#t||[]}set availablePolicies(t){this.#t=t}get value(){return this.getAttribute("value")||""}validate(){let t=this.#t;return this.#i&&(t=this.#t.map((t=>this.#i[t.id]?{...t,data:this.#i[t.id]}:t))),this.#e.reduce(((e,i)=>{const n=t.find((t=>t.id===i));if(!n)return e;const{pattern:r,message:o,data:s}=n;if(!r||!o)return e;const l={valid:new RegExp((0,a.z)(r,s)).test(this.value),message:(0,a.z)(o,s),id:i};return e.push(l),e}),[])}get isValid(){return!this.validate().some((({valid:t})=>!1===t))}getValidationItemTemplate({valid:t,message:e}){return`\n <li class="item" data-valid="${this.value?t:"none"}">\n <span class="message">${e}</span>\n </li>\n `}renderItems(t,e){t&&e.length&&(this.list.innerHTML=this.validate().map(this.getValidationItemTemplate.bind(this)).join(""))}updateLabel(t){t?(this.label.innerHTML=t,this.classList.remove("hide-label")):(this.classList.add("hide-label"),this.label.innerHTML="")}}const{host:u,item:h,symbolDefault:b,symbolSuccess:y,symbolError:g}={host:{selector:()=>":host > div"},item:{selector:()=>".item"},symbolDefault:{selector:()=>'.item[data-valid="none"]::before'},symbolSuccess:{selector:()=>'.item[data-valid="true"]::before'},symbolError:{selector:()=>'.item[data-valid="false"]::before'}},m=(0,o.Zz)((0,n.RF)({componentNameOverride:(0,s.xE)("input-wrapper")}),(0,n.RF)({mappings:{hostDirection:{selector:()=>":host",property:"direction"},fontSize:{},fontFamily:{},padding:{},borderWidth:{...u,property:"border-width"},borderStyle:{...u,property:"border-style"},borderColor:{...u,property:"border-color"},borderRadius:{...u,property:"border-radius"},backgroundColor:{...u,property:"background-color"},textColor:{property:"color"},labelMargin:{...u,property:"gap"},itemsSpacing:{...h,property:"line-height"},itemSymbolSuccessColor:{...y,property:"color"},itemSymbolErrorColor:{...g,property:"color"},itemSymbolDefault:{...b,property:"content"},itemSymbolSuccess:{...y,property:"content"},itemSymbolError:{...g,property:"content"}}}),n.VO,n.tQ)(c)},38917:(t,e,i)=>{i.d(e,{z:()=>n});const n=(t,e)=>t.replace(/{{(\w+)+}}/g,((t,i)=>e?.[i]||t))},28184:(t,e,i)=>{i.r(e),i.d(e,{PolicyValidationClass:()=>n.w});var n=i(9775);customElements.define(n.T,n.w)},69473:(t,e,i)=>{i.d(e,{T:()=>l,w:()=>d});var n=i(94619),r=i(93826),o=i(7138),s=i(14944),a=i(33177);const l=(0,s.xE)("text-field"),p=["type","label-type","copy-to-clipboard"],d=(0,o.Zz)((0,n.RF)({mappings:r.A}),n.VO,(0,n.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),n.tQ,(t=>class extends t{static get observedAttributes(){return p.concat(t.observedAttributes||[])}icon;init(){super.init?.()}renderCopyToClipboard(t){if(!t)return void this.icon?.remove();const e={icon:"vaadin:copy-o",title:"Copy",style:"cursor: pointer"},i={icon:"vaadin:check-circle-o",title:"Copied",style:"cursor: initial"};this.icon=Object.assign(document.createElement("vaadin-icon"),{slot:"suffix",...e}),this.baseElement.appendChild(this.icon),this.icon.addEventListener("click",(()=>{navigator.clipboard.writeText(this.value),Object.assign(this.icon,i),setTimeout((()=>{Object.assign(this.icon,e)}),5e3)}))}onLabelClick(){this.focus()}attributeChangedCallback(t,e,i){super.attributeChangeCallback?.(t,e,i),"type"===t&&this.baseElement._setType(i),e!==i&&("label-type"===t?"floating"===i?this.addEventListener("click",this.onLabelClick):this.removeEventListener("click",this.onLabelClick):"copy-to-clipboard"===t&&this.renderCopyToClipboard("true"===i))}}))((0,n.tz)({slots:["prefix","suffix"],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tpadding: calc(var(${d.cssVarList.inputOutlineWidth}) + var(${d.cssVarList.inputOutlineOffset}));\n box-sizing: border-box;\n\t\t\t}\n :host(:is([readonly], [disabled])) ::slotted(:is(input, textarea):placeholder-shown) {\n opacity: 1;\n }\n\n vaadin-text-field[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n opacity: 0;\n }\n vaadin-text-field[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n opacity: 0;\n }\n ${(0,a.$J)("vaadin-text-field")}\n\t\t\t${(0,a.cy)(d.cssVarList)}\n\t\t\t${(0,a.LJ)("vaadin-text-field",d.cssVarList)}\n ${(0,a.Kl)()}\n\n vaadin-text-field vaadin-icon {\n align-self: center;\n }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:l}))},89348:(t,e,i)=>{i.r(e),i.d(e,{TextFieldClass:()=>n.w}),i(39542),i(66418),i(56637);var n=i(69473);customElements.define(n.T,n.w)},93826:(t,e,i)=>{i.d(e,{A:()=>f});const{host:n,label:r,placeholder:o,requiredIndicator:s,inputField:a,input:l,inputMask:p,helperText:d,errorMessage:c,disabledPlaceholder:u,inputDisabled:h,inputIcon:b,externalInput:y,externalInputDisabled:g,externalPlaceholder:m,externalDisabledPlaceholder:v}={host:{selector:()=>":host"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},placeholder:[{selector:"> input:placeholder-shown"},{selector:()=>":host::slotted(input:placeholder-shown)"}],disabledPlaceholder:{selector:"> input:disabled::placeholder"},inputField:{selector:"::part(input-field)"},input:{selector:"input"},inputMask:{selector:"::part(input-field)::before"},inputDisabled:{selector:"input:disabled"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"},inputIcon:{selector:"vaadin-icon"},externalInput:{selector:()=>"::slotted(input)"},externalInputDisabled:{selector:()=>"::slotted(input:disabled)"},externalPlaceholder:{selector:()=>"::slotted(input:placeholder-shown)"},externalDisabledPlaceholder:{selector:()=>"::slotted(input:disabled::placeholder)"}},f={fontSize:[{},n],fontFamily:[r,a,d,c],labelFontSize:{...r,property:"font-size"},labelFontWeight:{...r,property:"font-weight"},labelTextColor:[{...r,property:"color"},{...s,property:"color"},{...r,property:"-webkit-text-fill-color"},{...s,property:"-webkit-text-fill-color"}],hostWidth:{...n,property:"width"},hostMinWidth:{...n,property:"min-width"},hostDirection:{...n,property:"direction"},inputDirection:{...l,property:"direction"},inputBackgroundColor:[{...a,property:"background-color"},{...p,property:"background-color"}],errorMessageTextColor:{...c,property:"color"},helperTextColor:{...d,property:"-webkit-text-fill-color"},inputValueTextColor:[{...a,property:"color"},{...h,property:"-webkit-text-fill-color"},{...g,property:"-webkit-text-fill-color"}],inputCaretTextColor:[{...l,property:"caret-color"},{...y,property:"caret-color"}],labelRequiredIndicator:{...s,property:"content"},inputBorderColor:{...a,property:"border-color"},inputBorderWidth:{...a,property:"border-width"},inputBorderStyle:{...a,property:"border-style"},inputBorderRadius:{...a,property:"border-radius"},inputHeight:{...a,property:"height"},inputHorizontalPadding:[{...l,property:"padding-left"},{...l,property:"padding-right"},{...y,property:"padding-left"},{...y,property:"padding-right"}],inputOutlineColor:{...a,property:"outline-color"},inputOutlineStyle:{...a,property:"outline-style"},inputOutlineWidth:{...a,property:"outline-width"},inputOutlineOffset:{...a,property:"outline-offset"},textAlign:{},inputTextAlign:[{...l,property:"text-align"},{...y,property:"text-align"}],inputPlaceholderColor:[{selector:()=>":host input:placeholder-shown",property:"color"},{...m,property:"color"},{...o,property:"color"},{...u,property:"-webkit-text-fill-color"},{...v,property:"-webkit-text-fill-color"}],labelPosition:{...r,property:"position"},labelTopPosition:{...r,property:"top"},labelHorizontalPosition:[{...r,property:"left"},{...r,property:"right"}],inputTransformY:{...r,property:"transform"},inputTransition:{...r,property:"transition"},marginInlineStart:{...r,property:"margin-inline-start"},placeholderOpacity:[{selector:"> input:placeholder-shown",property:"opacity"},{...m,property:"opacity"}],inputVerticalAlignment:[{...a,property:"align-items"},{...y,property:"align-items"}],valueInputHeight:[{...l,property:"height"},{...y,property:"height"}],valueInputMarginBottom:[{...l,property:"margin-bottom"},{...y,property:"margin-bottom"}],inputIconOffset:[{...b,property:"margin-right"},{...b,property:"margin-left"}],inputIconSize:{...b,property:"font-size"},inputIconColor:{...b,property:"color"}}},33177:(t,e,i)=>{i.d(e,{$J:()=>u,I4:()=>s,Kl:()=>h,LJ:()=>c,Qv:()=>o,X6:()=>l,cy:()=>n,fu:()=>p,kG:()=>d,lS:()=>a,zm:()=>r});const n=t=>`\n :host {\n padding: calc(var(${t.inputOutlineWidth}) + var(${t.inputOutlineOffset}))\n }\n`,r=t=>`\n ${t} {\n margin: 0;\n padding: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n }\n`,o=t=>`\n ${t}::part(input-field) {\n overflow: hidden;\n padding: 0;\n box-shadow: none;\n }\n`,s=t=>`\n ${t} > label,\n ${t}::part(label),\n ${t}::part(required-indicator) {\n cursor: pointer;\n }\n`,a=(t,e="input")=>`\n ${t}[disabled] > ${e}:placeholder-shown,\n\t${t}[readonly] > ${e}:placeholder-shown {\n\t\topacity: 1;\n\t}\n`,l=()=>"\n :host {\n --vaadin-field-default-width: auto;\n box-sizing: border-box;\n }\n",p=t=>`\n ${t}::part(input-field)::after {\n opacity: 0;\n }\n`,d=t=>`\n ${t}::part(input-field)::after {\n background: none;\n }\n`,c=(t,e)=>`\n ${r(t)}\n ${s(t)}\n ${a(t)}\n ${o(t)}\n ${((t,e)=>`\n ${t} input:-webkit-autofill,\n ${t} input:-webkit-autofill::first-line,\n ${t} input:-webkit-autofill:hover,\n ${t} input:-webkit-autofill:active,\n ${t} input:-webkit-autofill:focus {\n -webkit-text-fill-color: var(${e.inputValueTextColor});\n box-shadow: 0 0 0 var(${e.inputHeight}) var(${e.inputBackgroundColor}) inset;\n }\n`)(t,e)}\n ${d(t)}\n ${(t=>`\n ${t}::before {\n\t\theight: unset;\n\t}\n`)(t)}\n ${(t=>`\n ${t} > input {\n -webkit-mask-image: none;\n min-height: 0;\n box-sizing: border-box;\n }\n`)(t)}\n ${(t=>`\n ${t}::part(input-field)::after {\n border: none;\n }\n`)(t)}\n`,u=t=>`\n :host ::part(error-message) {\n direction: ltr;\n }\n :host([required]) ::part(required-indicator) {\n width: 1em;\n display: inline-flex;\n }\n :host([required]) ::part(required-indicator)::after {\n position: static;\n }\n :host([has-label]) ::part(label) {\n padding-right: 0;\n padding-bottom: 0;\n display: flex;\n width: 100%;\n }\n ${t} [slot="label"] {\n max-width: calc(100% - 1em);\n overflow: hidden;\n text-overflow: ellipsis;\n padding-bottom: 0.5em;\n }\n`,h=()=>'\n :host([label-type="floating"]) {\n position: relative;\n }\n :host([label-type="floating"][has-label]) [slot="label"] {\n padding: 0;\n }\n :host([label-type="floating"][has-label]) > ::part(label) {\n z-index: 1;\n padding: 0;\n width: auto;\n }\n '},39542:(t,e,i)=>{i(70297),i(34068)}}]);
@@ -1 +1 @@
1
- "use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[6969],{14372:(t,e,n)=>{n.d(e,{M:()=>m,T:()=>l});var i=n(94619),o=n(7138),r=n(14944),s=n(43686),a=n(33177);const l=(0,r.xE)("password"),{host:p,inputField:d,inputElement:u,inputElementPlaceholder:h,revealButtonContainer:b,revealButtonIcon:c,label:g,requiredIndicator:y,errorMessage:w,helperText:f}={host:{selector:()=>":host"},inputField:{selector:"::part(input-field)"},inputElement:{selector:"> input"},inputElementPlaceholder:{selector:()=>":host input:placeholder-shown"},revealButtonContainer:{selector:"::part(reveal-button)"},revealButtonIcon:{selector:"::part(reveal-button)::before"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},m=(0,o.Zz)((0,i.RF)({mappings:{hostWidth:{...p,property:"width"},hostMinWidth:{...p,property:"min-width"},hostDirection:{...p,property:"direction"},fontSize:[{},p],fontFamily:[g,d,w,f],inputHeight:{...d,property:"height"},inputHorizontalPadding:[{...u,property:"padding-left"},{...u,property:"padding-right"}],inputBackgroundColor:{...d,property:"background-color"},inputBorderStyle:{...d,property:"border-style"},inputBorderWidth:{...d,property:"border-width"},inputBorderColor:{...d,property:"border-color"},inputBorderRadius:{...d,property:"border-radius"},inputOutlineColor:{...d,property:"outline-color"},inputOutlineStyle:{...d,property:"outline-style"},inputOutlineOffset:{...d,property:"outline-offset"},inputOutlineWidth:{...d,property:"outline-width"},labelFontSize:{...g,property:"font-size"},labelFontWeight:{...g,property:"font-weight"},labelTextColor:[{...g,property:"color"},{...y,property:"color"}],labelRequiredIndicator:{...y,property:"content"},errorMessageTextColor:{...w,property:"color"},inputPlaceholderTextColor:[{...h,property:"color"},{selector:()=>":host ::slotted(input:placeholder-shown)",property:"color"}],inputValueTextColor:[{...u,property:"color"},{selector:()=>":host ::slotted(input)",property:"color"}],revealButtonOffset:[{...b,property:"margin-right"},{...b,property:"margin-left"}],revealButtonSize:{...b,property:"font-size"},revealButtonColor:{...c,property:"color"},labelPosition:{...g,property:"position"},labelTopPosition:{...g,property:"top"},labelHorizontalPosition:[{...g,property:"left"},{...g,property:"right"}],inputTransformY:{...g,property:"transform"},inputTransition:{...g,property:"transition"},marginInlineStart:{...g,property:"margin-inline-start"},placeholderOpacity:[{selector:"> input:placeholder-shown",property:"opacity"},{...u,property:"opacity"}],inputVerticalAlignment:{...d,property:"align-items"},valueInputHeight:{...u,property:"height"}}}),i.VO,(0,i.RV)({inputType:"password",includeAttrs:["disabled","readonly","pattern","type","autocomplete"],noBlurDispatch:!0}),(0,i.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),i.tQ,s.A,(t=>class extends t{static get observedAttributes(){return["manual-visibility-toggle"]}get manualToggleVisibility(){return"true"===this.getAttribute("manual-visibility-toggle")}init(){super.init?.(),this.handleCaretOnVisibilityChange(),this.origSetPasswordVisible=this.baseElement._setPasswordVisible,this.origSetFocused=this.baseElement._setFocused,this.baseElement._setFocused=this.setFocus.bind(this),this.initExternalInput()}initExternalInput(){const t=this.createExternalInput();t&&this.handlePasswordVisibility(t)}get caretPosition(){return this.value?.length||0}handleCaretOnVisibilityChange(){const t=this.baseElement._togglePasswordVisibility.bind(this.baseElement);this.baseElement._togglePasswordVisibility=()=>{setTimeout((()=>(t(),this.inputElement.setSelectionRange(this.caretPosition,this.caretPosition),!1)))}}setFocus(t){this.manualToggleVisibility&&(this.baseElement._setPasswordVisible=()=>{}),this.origSetFocused.call(this.baseElement,t),this.baseElement._setPasswordVisible=this.origSetPasswordVisible.bind(this.baseElement)}resetPasswordVisibilityToggle(){this.baseElement._setPasswordVisible=this.origSetPasswordVisible,this.baseElement._setFocused=this.origSetFocus}attributeChangedCallback(t,e,n){super.attributeChangedCallback?.(t,e,n)}handlePasswordVisibility(t){const e=this.baseElement.__boundRevealButtonMouseDown;this.baseElement.querySelector("vaadin-password-field-button").removeEventListener("mousedown",e),this.baseElement._passwordVisibleChanged=()=>{},this.baseElement._togglePasswordVisibility=()=>{"password"===t.getAttribute("type")?this.showPasswordVisibility(t):this.hidePasswordVisibility(t)}}showPasswordVisibility(t){t.setAttribute("type","text"),this.setAttribute("password-visible","true")}hidePasswordVisibility(t){t.setAttribute("type","password"),this.setAttribute("password-visible","false")}}))((0,i.tz)({slots:["","suffix"],wrappedEleName:"vaadin-password-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\tmin-width: 10em;\n box-sizing: border-box;\n position: relative;\n\t\t\t}\n\t\t\t${(0,a.cy)(m.cssVarList)}\n\t\t\t${(0,a.I4)("vaadin-password-field")}\n ${(0,a.$J)("vaadin-password-field")}\n\n\t\t\tvaadin-password-field {\n\t\t\t\twidth: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-password-field > input {\n -webkit-mask-image: none;\n\t\t\t\tbox-sizing: border-box;\n opacity: 1;\n\t\t\t}\n\t\t\tvaadin-password-field::part(input-field) {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-password-field[focus-ring]::part(input-field) {\n\t\t\t\tbox-shadow: none;\n\t\t\t}\n :host ::slotted(input) {\n\t\t\t\tmin-height: 0;\n }\n :host([readonly]) ::slotted(input:placeholder-shown) {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\tvaadin-password-field::before {\n\t\t\t\theight: initial;\n\t\t\t}\n\t\t\tvaadin-password-field::part(input-field)::after {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\tvaadin-password-field-button {\n\t\t\t\tcursor: pointer;\n\t\t\t}\n\t\t\t:host([readonly]) vaadin-password-field-button {\n\t\t\t\tpointer-events: none;\n\t\t\t}\n\t\t\tvaadin-password-field-button[focus-ring] {\n\t\t\t\tbox-shadow: 0 0 0 2px var(${m.cssVarList.inputOutlineColor});\n\t\t\t}\n\n ${(0,a.Kl)()}\n \n ::part(reveal-button) {\n align-self: center;\n }\n\n vaadin-password-field[external-input="true"] > input:not(:placeholder-shown) {\n opacity: 0;\n }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:l}))},1279:(t,e,n)=>{n.r(e),n.d(e,{PasswordClass:()=>i.M}),n(40351);var i=n(14372);customElements.define(i.T,i.M)},43686:(t,e,n)=>{n.d(e,{A:()=>i});const i=t=>class extends t{get isReadOnly(){return this.hasAttribute("readonly")&&"false"!==this.getAttribute("readonly")}init(){super.init?.();const t=this.querySelector("input");t?.addEventListener("mousedown",(e=>{if(this.isDraggable&&this.isReadOnly){t.setAttribute("inert","true");const n=e.target,i=n.getAttribute("type");n.setAttribute("type","text"),setTimeout((()=>{n.focus()}));const o=e=>{n.setAttribute("type",i),t.removeAttribute("inert"),this.removeEventListener("mouseup",o),this.removeEventListener("dragend",o)};this.addEventListener("dragend",o,{once:!0}),this.addEventListener("mouseup",o,{once:!0})}}))}}},33177:(t,e,n)=>{n.d(e,{$J:()=>h,I4:()=>s,Kl:()=>b,LJ:()=>u,Qv:()=>r,X6:()=>l,cy:()=>i,fu:()=>p,kG:()=>d,lS:()=>a,zm:()=>o});const i=t=>`\n :host {\n padding: calc(var(${t.inputOutlineWidth}) + var(${t.inputOutlineOffset}))\n }\n`,o=t=>`\n ${t} {\n margin: 0;\n padding: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n }\n`,r=t=>`\n ${t}::part(input-field) {\n overflow: hidden;\n padding: 0;\n box-shadow: none;\n }\n`,s=t=>`\n ${t} > label,\n ${t}::part(label),\n ${t}::part(required-indicator) {\n cursor: pointer;\n }\n`,a=(t,e="input")=>`\n ${t}[disabled] > ${e}:placeholder-shown,\n\t${t}[readonly] > ${e}:placeholder-shown {\n\t\topacity: 1;\n\t}\n`,l=()=>"\n :host {\n --vaadin-field-default-width: auto;\n box-sizing: border-box;\n }\n",p=t=>`\n ${t}::part(input-field)::after {\n opacity: 0;\n }\n`,d=t=>`\n ${t}::part(input-field)::after {\n background: none;\n }\n`,u=(t,e)=>`\n ${o(t)}\n ${s(t)}\n ${a(t)}\n ${r(t)}\n ${((t,e)=>`\n ${t} input:-webkit-autofill,\n ${t} input:-webkit-autofill::first-line,\n ${t} input:-webkit-autofill:hover,\n ${t} input:-webkit-autofill:active,\n ${t} input:-webkit-autofill:focus {\n -webkit-text-fill-color: var(${e.inputValueTextColor});\n box-shadow: 0 0 0 var(${e.inputHeight}) var(${e.inputBackgroundColor}) inset;\n }\n`)(t,e)}\n ${d(t)}\n ${(t=>`\n ${t}::before {\n\t\theight: unset;\n\t}\n`)(t)}\n ${(t=>`\n ${t} > input {\n -webkit-mask-image: none;\n min-height: 0;\n box-sizing: border-box;\n }\n`)(t)}\n ${(t=>`\n ${t}::part(input-field)::after {\n border: none;\n }\n`)(t)}\n`,h=t=>`\n :host ::part(error-message) {\n direction: ltr;\n }\n :host([required]) ::part(required-indicator) {\n width: 1em;\n display: inline-flex;\n }\n :host([required]) ::part(required-indicator)::after {\n position: static;\n }\n :host([has-label]) ::part(label) {\n padding-right: 0;\n padding-bottom: 0;\n display: flex;\n width: 100%;\n }\n ${t} [slot="label"] {\n max-width: calc(100% - 1em);\n overflow: hidden;\n text-overflow: ellipsis;\n padding-bottom: 0.5em;\n }\n`,b=()=>'\n :host([label-type="floating"]) {\n position: relative;\n }\n :host([label-type="floating"][has-label]) [slot="label"] {\n padding: 0;\n }\n :host([label-type="floating"][has-label]) > ::part(label) {\n z-index: 1;\n padding: 0;\n width: auto;\n }\n '}}]);
1
+ "use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[6969],{14372:(t,e,n)=>{n.d(e,{M:()=>m,T:()=>l});var i=n(94619),o=n(7138),r=n(14944),s=n(43686),a=n(33177);const l=(0,r.xE)("password"),{host:p,inputField:d,inputElement:u,inputElementPlaceholder:h,revealButtonContainer:b,revealButtonIcon:c,label:g,requiredIndicator:y,errorMessage:w,helperText:f}={host:{selector:()=>":host"},inputField:{selector:"::part(input-field)"},inputElement:{selector:"> input"},inputElementPlaceholder:{selector:()=>":host input:placeholder-shown"},revealButtonContainer:{selector:"::part(reveal-button)"},revealButtonIcon:{selector:"::part(reveal-button)::before"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},m=(0,o.Zz)((0,i.RF)({mappings:{hostWidth:{...p,property:"width"},hostMinWidth:{...p,property:"min-width"},hostDirection:{...p,property:"direction"},fontSize:[{},p],fontFamily:[g,d,w,f],inputHeight:{...d,property:"height"},inputHorizontalPadding:[{...u,property:"padding-left"},{...u,property:"padding-right"}],inputBackgroundColor:{...d,property:"background-color"},inputBorderStyle:{...d,property:"border-style"},inputBorderWidth:{...d,property:"border-width"},inputBorderColor:{...d,property:"border-color"},inputBorderRadius:{...d,property:"border-radius"},inputOutlineColor:{...d,property:"outline-color"},inputOutlineStyle:{...d,property:"outline-style"},inputOutlineOffset:{...d,property:"outline-offset"},inputOutlineWidth:{...d,property:"outline-width"},labelFontSize:{...g,property:"font-size"},labelFontWeight:{...g,property:"font-weight"},labelTextColor:[{...g,property:"color"},{...y,property:"color"}],labelRequiredIndicator:{...y,property:"content"},errorMessageTextColor:{...w,property:"color"},inputPlaceholderTextColor:[{...h,property:"color"},{selector:()=>":host ::slotted(input:placeholder-shown)",property:"color"}],inputValueTextColor:[{...u,property:"color"},{selector:()=>":host ::slotted(input)",property:"color"}],revealButtonOffset:[{...b,property:"margin-right"},{...b,property:"margin-left"}],revealButtonSize:{...b,property:"font-size"},revealButtonColor:{...c,property:"color"},labelPosition:{...g,property:"position"},labelTopPosition:{...g,property:"top"},labelHorizontalPosition:[{...g,property:"left"},{...g,property:"right"}],inputTransformY:{...g,property:"transform"},inputTransition:{...g,property:"transition"},marginInlineStart:{...g,property:"margin-inline-start"},placeholderOpacity:[{selector:"> input:placeholder-shown",property:"opacity"},{...u,property:"opacity"}],inputVerticalAlignment:{...d,property:"align-items"},valueInputHeight:{...u,property:"height"}}}),i.VO,(0,i.RV)({inputType:"password",inputName:"password",includeAttrs:["disabled","readonly","pattern","type","autocomplete"],noBlurDispatch:!0}),(0,i.OZ)({proxyProps:["value","selectionStart"],useProxyTargets:!0}),i.tQ,s.A,(t=>class extends t{static get observedAttributes(){return["manual-visibility-toggle"]}get manualToggleVisibility(){return"true"===this.getAttribute("manual-visibility-toggle")}init(){super.init?.(),this.handleCaretOnVisibilityChange(),this.origSetPasswordVisible=this.baseElement._setPasswordVisible,this.origSetFocused=this.baseElement._setFocused,this.baseElement._setFocused=this.setFocus.bind(this),this.initExternalInput()}initExternalInput(){const t=this.createExternalInput();t&&this.handlePasswordVisibility(t)}get caretPosition(){return this.value?.length||0}handleCaretOnVisibilityChange(){const t=this.baseElement._togglePasswordVisibility.bind(this.baseElement);this.baseElement._togglePasswordVisibility=()=>{setTimeout((()=>(t(),this.inputElement.setSelectionRange(this.caretPosition,this.caretPosition),!1)))}}setFocus(t){this.manualToggleVisibility&&(this.baseElement._setPasswordVisible=()=>{}),this.origSetFocused.call(this.baseElement,t),this.baseElement._setPasswordVisible=this.origSetPasswordVisible.bind(this.baseElement)}resetPasswordVisibilityToggle(){this.baseElement._setPasswordVisible=this.origSetPasswordVisible,this.baseElement._setFocused=this.origSetFocus}attributeChangedCallback(t,e,n){super.attributeChangedCallback?.(t,e,n)}handlePasswordVisibility(t){const e=this.baseElement.__boundRevealButtonMouseDown;this.baseElement.querySelector("vaadin-password-field-button").removeEventListener("mousedown",e),this.baseElement._passwordVisibleChanged=()=>{},this.baseElement._togglePasswordVisibility=()=>{"password"===t.getAttribute("type")?this.showPasswordVisibility(t):this.hidePasswordVisibility(t)}}showPasswordVisibility(t){t.setAttribute("type","text"),this.setAttribute("password-visible","true")}hidePasswordVisibility(t){t.setAttribute("type","password"),this.setAttribute("password-visible","false")}}))((0,i.tz)({slots:["","suffix"],wrappedEleName:"vaadin-password-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\tmin-width: 10em;\n box-sizing: border-box;\n position: relative;\n\t\t\t}\n\t\t\t${(0,a.cy)(m.cssVarList)}\n\t\t\t${(0,a.I4)("vaadin-password-field")}\n ${(0,a.$J)("vaadin-password-field")}\n\n\t\t\tvaadin-password-field {\n\t\t\t\twidth: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-password-field > input {\n -webkit-mask-image: none;\n\t\t\t\tbox-sizing: border-box;\n opacity: 1;\n\t\t\t}\n\t\t\tvaadin-password-field::part(input-field) {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-password-field[focus-ring]::part(input-field) {\n\t\t\t\tbox-shadow: none;\n\t\t\t}\n :host ::slotted(input) {\n\t\t\t\tmin-height: 0;\n }\n :host([readonly]) ::slotted(input:placeholder-shown) {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\tvaadin-password-field::before {\n\t\t\t\theight: initial;\n\t\t\t}\n\t\t\tvaadin-password-field::part(input-field)::after {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\tvaadin-password-field-button {\n\t\t\t\tcursor: pointer;\n\t\t\t}\n\t\t\t:host([readonly]) vaadin-password-field-button {\n\t\t\t\tpointer-events: none;\n\t\t\t}\n\t\t\tvaadin-password-field-button[focus-ring] {\n\t\t\t\tbox-shadow: 0 0 0 2px var(${m.cssVarList.inputOutlineColor});\n\t\t\t}\n\n ${(0,a.Kl)()}\n \n ::part(reveal-button) {\n align-self: center;\n }\n\n vaadin-password-field[external-input="true"] > input:not(:placeholder-shown) {\n opacity: 0;\n }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:l}))},1279:(t,e,n)=>{n.r(e),n.d(e,{PasswordClass:()=>i.M}),n(40351);var i=n(14372);customElements.define(i.T,i.M)},43686:(t,e,n)=>{n.d(e,{A:()=>i});const i=t=>class extends t{get isReadOnly(){return this.hasAttribute("readonly")&&"false"!==this.getAttribute("readonly")}init(){super.init?.();const t=this.querySelector("input");t?.addEventListener("mousedown",(e=>{if(this.isDraggable&&this.isReadOnly){t.setAttribute("inert","true");const n=e.target,i=n.getAttribute("type");n.setAttribute("type","text"),setTimeout((()=>{n.focus()}));const o=e=>{n.setAttribute("type",i),t.removeAttribute("inert"),this.removeEventListener("mouseup",o),this.removeEventListener("dragend",o)};this.addEventListener("dragend",o,{once:!0}),this.addEventListener("mouseup",o,{once:!0})}}))}}},33177:(t,e,n)=>{n.d(e,{$J:()=>h,I4:()=>s,Kl:()=>b,LJ:()=>u,Qv:()=>r,X6:()=>l,cy:()=>i,fu:()=>p,kG:()=>d,lS:()=>a,zm:()=>o});const i=t=>`\n :host {\n padding: calc(var(${t.inputOutlineWidth}) + var(${t.inputOutlineOffset}))\n }\n`,o=t=>`\n ${t} {\n margin: 0;\n padding: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n }\n`,r=t=>`\n ${t}::part(input-field) {\n overflow: hidden;\n padding: 0;\n box-shadow: none;\n }\n`,s=t=>`\n ${t} > label,\n ${t}::part(label),\n ${t}::part(required-indicator) {\n cursor: pointer;\n }\n`,a=(t,e="input")=>`\n ${t}[disabled] > ${e}:placeholder-shown,\n\t${t}[readonly] > ${e}:placeholder-shown {\n\t\topacity: 1;\n\t}\n`,l=()=>"\n :host {\n --vaadin-field-default-width: auto;\n box-sizing: border-box;\n }\n",p=t=>`\n ${t}::part(input-field)::after {\n opacity: 0;\n }\n`,d=t=>`\n ${t}::part(input-field)::after {\n background: none;\n }\n`,u=(t,e)=>`\n ${o(t)}\n ${s(t)}\n ${a(t)}\n ${r(t)}\n ${((t,e)=>`\n ${t} input:-webkit-autofill,\n ${t} input:-webkit-autofill::first-line,\n ${t} input:-webkit-autofill:hover,\n ${t} input:-webkit-autofill:active,\n ${t} input:-webkit-autofill:focus {\n -webkit-text-fill-color: var(${e.inputValueTextColor});\n box-shadow: 0 0 0 var(${e.inputHeight}) var(${e.inputBackgroundColor}) inset;\n }\n`)(t,e)}\n ${d(t)}\n ${(t=>`\n ${t}::before {\n\t\theight: unset;\n\t}\n`)(t)}\n ${(t=>`\n ${t} > input {\n -webkit-mask-image: none;\n min-height: 0;\n box-sizing: border-box;\n }\n`)(t)}\n ${(t=>`\n ${t}::part(input-field)::after {\n border: none;\n }\n`)(t)}\n`,h=t=>`\n :host ::part(error-message) {\n direction: ltr;\n }\n :host([required]) ::part(required-indicator) {\n width: 1em;\n display: inline-flex;\n }\n :host([required]) ::part(required-indicator)::after {\n position: static;\n }\n :host([has-label]) ::part(label) {\n padding-right: 0;\n padding-bottom: 0;\n display: flex;\n width: 100%;\n }\n ${t} [slot="label"] {\n max-width: calc(100% - 1em);\n overflow: hidden;\n text-overflow: ellipsis;\n padding-bottom: 0.5em;\n }\n`,b=()=>'\n :host([label-type="floating"]) {\n position: relative;\n }\n :host([label-type="floating"][has-label]) [slot="label"] {\n padding: 0;\n }\n :host([label-type="floating"][has-label]) > ::part(label) {\n z-index: 1;\n padding: 0;\n width: auto;\n }\n '}}]);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@descope/web-components-ui",
3
- "version": "1.0.395",
3
+ "version": "1.0.396",
4
4
  "description": "",
5
5
  "main": "dist/cjs/index.cjs.js",
6
6
  "module": "dist/index.esm.js",
@@ -44,6 +44,7 @@ export const EmailFieldClass = compose(
44
44
  draggableMixin,
45
45
  externalInputMixin({
46
46
  inputType: 'email',
47
+ inputName: 'email',
47
48
  autocompleteType: 'username',
48
49
  includeAttrs: ['disabled', 'readonly', 'pattern'],
49
50
  }),
@@ -75,6 +75,7 @@ const customMixin = (superclass) =>
75
75
 
76
76
  // move external input
77
77
  externalInput.setAttribute('slot', slotName);
78
+ externalInput.setAttribute('name', this.getAttribute('name'));
78
79
  externalInput.setAttribute('data-hidden-input', 'true');
79
80
 
80
81
  this.appendChild(externalInput);
@@ -218,6 +218,7 @@ export const PasswordClass = compose(
218
218
  draggableMixin,
219
219
  externalInputMixin({
220
220
  inputType: 'password',
221
+ inputName: 'password',
221
222
  includeAttrs: ['disabled', 'readonly', 'pattern', 'type', 'autocomplete'],
222
223
  noBlurDispatch: true,
223
224
  }),
@@ -27,11 +27,12 @@ export const createExternalInputSlot = (slotName, targetSlotName) => {
27
27
  return slotEle;
28
28
  };
29
29
 
30
- export const createExternalInputEle = (targetSlotName, type, autocompleteType) => {
30
+ export const createExternalInputEle = (targetSlotName, type, autocompleteType, inputName) => {
31
31
  const inputEle = document.createElement('input');
32
32
 
33
33
  inputEle.setAttribute('slot', targetSlotName);
34
34
  inputEle.setAttribute('type', type);
35
+ inputEle.setAttribute('name', inputName);
35
36
  inputEle.setAttribute('data-hidden-input', 'true');
36
37
  inputEle.setAttribute('autocomplete', autocompleteType);
37
38
 
@@ -6,7 +6,7 @@ import {
6
6
  } from './externalInputHelpers';
7
7
 
8
8
  export const externalInputMixin =
9
- ({ inputType, autocompleteType, includeAttrs = [], noBlurDispatch = false }) =>
9
+ ({ inputType, inputName, autocompleteType, includeAttrs = [], noBlurDispatch = false }) =>
10
10
  (superclass) =>
11
11
  class ExternalInputMixinClass extends superclass {
12
12
  #timers = [];
@@ -37,7 +37,8 @@ export const externalInputMixin =
37
37
  this.externalInput = createExternalInputEle(
38
38
  'external-input',
39
39
  inputType,
40
- this.getAutocompleteType()
40
+ this.getAutocompleteType(),
41
+ inputName
41
42
  );
42
43
 
43
44
  // apply original input's styles to external input