@descope/web-components-ui 3.21.0 → 3.21.1

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.
Files changed (10) hide show
  1. package/dist/cjs/index.cjs.js +2 -1
  2. package/dist/cjs/index.cjs.js.map +1 -1
  3. package/dist/index.esm.js +2 -1
  4. package/dist/index.esm.js.map +1 -1
  5. package/dist/umd/DescopeDev.js +1 -1
  6. package/dist/umd/DescopeDev.js.map +1 -1
  7. package/dist/umd/descope-recovery-codes.js +1 -1
  8. package/dist/umd/descope-recovery-codes.js.map +1 -1
  9. package/dist/umd/index.js +1 -1
  10. package/package.json +42 -42
package/dist/umd/descope-recovery-codes.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[1202,2294,6724,9175],{19624(t,e,o){o.d(e,{J:()=>u,T:()=>l});var n=o(63200),r=o(25964),i=o(88961),s=o(98538),a=o(10767);const l=(0,r.xE)("button"),{host:d,label:c,slottedIcon:h}={host:{selector:()=>":host"},label:{selector:"::part(label)"},slottedIcon:{selector:()=>"::slotted(descope-icon)"}};let p;const u=(0,n.Zz)((0,i.DM)({triggers:[{attr:"full-width",value:"true"}]}),(0,i.RF)({mappings:{hostWidth:{property:"width"},hostMaxWidth:{...d,property:"max-width"},hostHeight:{property:"height"},hostDirection:{...d,property:"direction"},fontSize:{},fontFamily:{},fontWeight:{},cursor:{},backgroundColor:{},outlineOffset:{},outlineColor:{},outlineStyle:{},outlineWidth:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-right",fallback:"0.875em"},{property:"padding-left",fallback:"0.875em"}],labelTextColor:{property:"color"},iconColor:{selector:()=>"::slotted(*)",property:s.S.cssVarList.fill},labelTextDecoration:{...c,property:"text-decoration"},labelSpacing:{...c,property:"gap"},textAlign:{...c,property:"justify-content",fallback:"center"},iconSize:[{...h,property:"width"},{...h,property:"height"}]}}),a.G,i.VO,i.tQ)((0,i.tz)({slots:["","prefix","label","suffix"],wrappedEleName:"vaadin-button",style:()=>`\n\t\t\t\n\t:host {\n\t\tdisplay: inline-block;\n\t\tbox-sizing: border-box;\n\t}\n\tvaadin-button::before,\n\tvaadin-button::after {\n\t\topacity: 0;\n\t}\n\tvaadin-button {\n\t\tmargin: 0;\n\t\tmin-width: 0;\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tbox-shadow: none;\n\t}\n\tvaadin-button::part(label) {\n\t\tpadding: 0;\n width: 100%;\n\t}\n\tvaadin-button::part(prefix) {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n\n\t\t\t\n\tvaadin-button::part(prefix),\n\tvaadin-button::part(label) {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n\n\t\t\t${p}\n\t\t\tvaadin-button::part(label) { pointer-events: none; }\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${u.cssVarList.outlineWidth}) + var(${u.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width="true"]) {\n width: var(${u.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${u.cssVarList.hostHeight}) - var(${u.cssVarList.outlineWidth}) - var(${u.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square="true"]:not([full-width="true"]) {\n\t\t\t\twidth: calc(var(${u.cssVarList.hostWidth}) - var(${u.cssVarList.outlineWidth}) - var(${u.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex","class","style"],componentName:l})),{color:b,fontSize:g}=u.cssVarList;p=`\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading="true"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${b});\n\t\ttop: calc(50% - (var(${g}) / 2));\n\t\tleft: calc(50% - (var(${g}) / 2));\n\t\tborder-width: calc(var(${g}) / 10);\n\t\twidth: var(${g});\n\t\theight: var(${g});\n\t}\n\t:host([disabled="true"]),\n\t:host([loading="true"]) {\n\t\tpointer-events: none;\n\t}\n\t:host([loading="true"]) ::part(prefix),\n\t:host([loading="true"]) ::part(label) {\n\t\tvisibility: hidden;\n\t}\n`},10767(t,e,o){o.d(e,{G:()=>n});const n=t=>class extends t{get isLoading(){return"true"===this.getAttribute("loading")}click(){this.isLoading||super.click()}}},30576(t,e,o){o.r(e),o.d(e,{ButtonClass:()=>n.J,componentName:()=>n.T});var n=o(19624);o(83799),customElements.define(n.T,n.J)},98538(t,e,o){o.d(e,{S:()=>l,T:()=>a});var n=o(88961),r=o(25964),i=o(8512),s=o(63200);const a=(0,r.xE)("icon"),l=(0,s.Zz)((0,n.RF)({mappings:{fill:[{},{property:i.q.cssVarList.fill}],height:{selector:()=>":host"},width:{selector:()=>":host"}}}),n.VO,n.tQ)((0,n.tz)({slots:[],wrappedEleName:"descope-image",style:()=>"\n :host {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n max-height: 100%;\n }\n ",excludeAttrsSync:["tabindex","class","style","st-height","st-width"],componentName:a}))},56737(t,e,o){o.r(e),o.d(e,{IconClass:()=>n.S,componentName:()=>n.T}),o(53455);var n=o(98538);customElements.define(n.T,n.S)},8512(t,e,o){o.d(e,{T:()=>l,q:()=>h});var n=o(88961),r=o(72270),i=o(63200),s=o(25964),a=o(18782);const l=(0,s.xE)("image"),d=["src","src-dark"];class c extends((0,r.qu)({componentName:l,baseSelector:"slot"})){static get observedAttributes(){return d}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<slot></slot>\n\t",(0,s.fz)("\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n :host > slot {\n width: 100%;\n height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n ::slotted(*) {\n width: 100%;\n\t\t\t}\n\n .hidden {\n display: none;\n }\n ",this)}init(){super.init?.(),this.toggleVisibility(this.getSrc)}onThemeChange(){this.renderImage()}toggleVisibility(t){t?this.classList.remove("hidden"):this.classList.add("hidden")}get altText(){return this.getAttribute("alt")||""}get legacySrc(){return this.getAttribute("src")}get themeSrc(){return this.getAttribute(`src-${this.currentThemeName}`)}get getSrc(){return this.themeSrc||this.legacySrc}updateFillColor(t){[t,...t.querySelectorAll("*[fill]")].forEach(t=>{t.setAttribute("fill",`var(${h.cssVarList.fill}, ${t.getAttribute("fill")||"''"})`)})}renderImage(){this.toggleVisibility(this.getSrc),(0,a.m)(this.getSrc,this.altText).then(t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))})}shouldRender(t){const e=this.getAttribute(t);return this.getSrc===e}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),e!==o&&this.shouldRender(t)&&this.renderImage()}}const h=(0,i.Zz)((0,n.RF)({mappings:{fill:{},height:{selector:()=>":host"},width:{selector:()=>":host"}}}),n.VO,n.tQ)(c)},18782(t,e,o){o.d(e,{m:()=>i});var n=o(25414);const r=t=>{const e=n.A.sanitize(t,{USE_PROFILES:{svg:!0,svgFilters:!0},ADD_TAGS:["image"],FORBID_TAGS:["defs"]});return(new DOMParser).parseFromString(e,"image/svg+xml").querySelector("svg")},i=async(t,e)=>{try{let o;if((t=>t.startsWith("data:image/svg+xml;base64,"))(t)){const e=atob(t.slice(26));o=r(e)}else if("svg"===(t=>{const e=t.match(/\.([0-9a-z]+)(?:[\\?#]|$)/i);return e?e[1]:null})(t)){const e=await fetch(t),n=await e.text();o=r(n)}else o=((t,e)=>{const o=document.createElement("img");return o.setAttribute("src",t),o.setAttribute("alt",e),o})(t,e);return o.style.setProperty("max-width","100%"),o.style.setProperty("max-height","100%"),o}catch{return null}}},53455(t,e,o){o.r(e),o.d(e,{ImageClass:()=>n.q,componentName:()=>n.T});var n=o(8512);customElements.define(n.T,n.q)},88568(t,e,o){o.r(e),o.d(e,{RecoveryCodesClass:()=>b,componentName:()=>l}),o(63595),o(30576),o(56737),o(37182),o(95260);var n=o(88961),r=o(63200),i=o(25964),s=o(72270),a=o(66434);const l=(0,i.xE)("recovery-codes"),d="none",c={copy:{defaultText:"Copy"},download:{defaultText:"Download"}},h=["text","variant","color","size","icon","icon-dark"],p=["show-download",...Object.keys(c).flatMap(t=>h.map(e=>`${t}-${e}`))];class u extends((0,s.qu)({componentName:l,baseSelector:":host > div"})){static get observedAttributes(){return["readonly","required",...p]}#t=d;#e=!1;#o=!1;constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <div class="wrapper">\n <div class="codes-box">\n <div class="list"></div>\n <descope-text class="icon-wrapper">\n <div class="icons">\n <vaadin-icon class="icon copy-icon" icon="vaadin:copy-o" title="Copy"></vaadin-icon>\n <vaadin-icon class="icon download-icon" icon="vaadin:download-alt" title="Download"></vaadin-icon>\n </div>\n </descope-text>\n </div>\n <div class="error-message"></div>\n <div class="buttons-row"></div>\n </div>\n ',this.list=this.shadowRoot.querySelector(".list"),this.copyIcon=this.shadowRoot.querySelector(".copy-icon"),this.downloadIcon=this.shadowRoot.querySelector(".download-icon"),this.iconWrapper=this.shadowRoot.querySelector(".icon-wrapper"),this.errorMessageEle=this.shadowRoot.querySelector(".error-message"),this.buttonsRow=this.shadowRoot.querySelector(".buttons-row"),(0,i.fz)('\n :host {\n display: inline-block;\n position: relative;\n }\n .wrapper {\n display: flex;\n flex-direction: column;\n }\n .codes-box {\n display: flex;\n justify-content: space-between;\n box-sizing: border-box;\n /* border shows the error ring inside the box; style/width/color/radius come from theme */\n }\n .list {\n display: flex;\n flex-grow: 1;\n flex-direction: column;\n }\n descope-text span {\n display: inline-flex;\n align-items: center;\n width: fit-content;\n }\n descope-text span::before {\n content: \'\\02022\';\n transform: translateY(-0.06em);\n }\n .icon-wrapper {\n align-self: flex-start;\n }\n .icons {\n display: flex;\n flex-direction: column;\n }\n .icon {\n cursor: pointer;\n }\n .icon.copied {\n cursor: initial;\n /* block re-clicks while the checkmark shows, so rapid clicks cannot repeat the action */\n pointer-events: none;\n }\n /* readonly is a host attribute, so disable pointer events from one place */\n :host([readonly="true"]) .icon,\n :host([readonly="true"]) .buttons-row {\n pointer-events: none;\n }\n .download-icon {\n display: none;\n }\n :host([show-download="true"]) .download-icon {\n display: inline-flex;\n }\n .error-message {\n display: none;\n /* width:0 + min-width:100% lets the message wrap to the component width without\n its text expanding the (shrink-to-fit) component; full-width still fills the parent */\n width: 0;\n min-width: 100%;\n box-sizing: border-box;\n line-height: 1.2;\n overflow-wrap: break-word;\n }\n :host([invalid]) .error-message {\n display: block;\n }\n .buttons-row {\n display: none;\n }\n :host([display-variant="buttons"]) .icon-wrapper {\n display: none;\n }\n :host([display-variant="buttons"]) .buttons-row {\n display: flex;\n flex-wrap: wrap;\n }\n /* grow to fill equally; don\'t shrink below content, so they wrap to a new line\n when they don\'t fit (like a container with auto-fit items) */\n .buttons-row > descope-button {\n flex: 1 0 auto;\n }\n ',this)}get variant(){return this.getAttribute("variant")}get mode(){return this.getAttribute("mode")}get value(){return this.#t}#n(t){return this.hasAttribute(t)&&"false"!==this.getAttribute(t)}get isRequired(){return this.#n("required")}get isReadOnly(){return this.#n("readonly")}get errorMessage(){return this.getAttribute("data-errormessage-value-missing")||"Please save your recovery codes to continue"}get codesText(){return String((this.data||[]).map(t=>t.value).join("\n"))}init(){super.init(),this.copyIcon.addEventListener("click",this.onCopy.bind(this)),this.downloadIcon.addEventListener("click",this.onDownload.bind(this)),(0,i.EA)(this,this.iconWrapper,{includeAttrs:["variant","mode"]}),this.renderButtons(),this.#o=!0}get isDownloadEnabled(){return"true"===this.getAttribute("show-download")}renderButtons(){if(!this.buttonsRow)return;const t=[this.buildButton("copy")];this.isDownloadEnabled&&t.push(this.buildButton("download")),this.buttonsRow.replaceChildren(...t)}buildButton(t){const{defaultText:e}=c[t],o=(e,o)=>this.getAttribute(`${t}-${e}`)||o,n=document.createElement("descope-button");n.setAttribute("data-action",t),n.setAttribute("variant",o("variant","outline")),n.setAttribute("mode",o("color","primary")),n.setAttribute("size",o("size","md"));const r=this.getAttribute(`${t}-icon`);if(r){const e=document.createElement("descope-icon");e.setAttribute("src",r);const o=this.getAttribute(`${t}-icon-dark`);o&&e.setAttribute("src-dark",o),n.appendChild(e)}return n.appendChild(document.createTextNode(o("text",e))),n.addEventListener("click",()=>"copy"===t?this.onCopy():this.onDownload()),n}onCopy(){this.isReadOnly||(navigator.clipboard.writeText(this.codesText),this.showActionFeedback(this.copyIcon,"Copied"),this.recordAction("copied"))}onDownload(){if(this.isReadOnly)return;const t=new Blob([this.codesText],{type:"text/plain"}),e=URL.createObjectURL(t),o=document.createElement("a");o.href=e,o.download="recovery-codes.txt",o.click(),URL.revokeObjectURL(e),this.showActionFeedback(this.downloadIcon,"Downloaded"),this.recordAction("downloaded")}recordAction(t){this.#t=t,this.dispatchEvent(new Event("change",{bubbles:!0})),this.checkValidity()&&(this.#e=!1),this.syncValidityUI()}showActionFeedback(t,e){t.feedbackTimer?clearTimeout(t.feedbackTimer):(t.originalIcon=t.getAttribute("icon"),t.originalTitle=t.getAttribute("title")),t.setAttribute("icon","vaadin:check-circle-o"),t.setAttribute("title",e),t.classList.add("copied"),t.feedbackTimer=setTimeout(()=>{t.setAttribute("icon",t.originalIcon),t.setAttribute("title",t.originalTitle),t.classList.remove("copied"),t.feedbackTimer=null},5e3)}checkValidity(){return this.isReadOnly||!this.isRequired||this.value!==d}reportValidity(){const t=this.checkValidity();return this.#e=!t,this.syncValidityUI(),t}syncValidityUI(){this.toggleAttribute("invalid",this.#e),this.errorMessageEle&&(this.errorMessageEle.textContent=this.#e?this.errorMessage:"")}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),o!==e&&("required"!==t||this.isRequired||(this.#e=!1,this.syncValidityUI()),this.#o&&p.includes(t)&&this.renderButtons())}}const b=(0,r.Zz)((0,n.RF)({mappings:{hostWidth:{selector:()=>":host",property:"width"},hostMinWidth:{selector:()=>":host",property:"min-width"},hostDirection:[{selector:()=>":host",property:"direction"},{selector:()=>a.s.componentName,property:a.s.cssVarList.hostDirection}],textAlign:{selector:()=>".list",property:"align-items"},iconColor:{selector:()=>"vaadin-icon",property:"color"},iconSize:{selector:()=>"vaadin-icon",property:"font-size"},iconGap:{selector:()=>".codes-box",property:"gap"},iconStackGap:{selector:()=>".icons",property:"gap"},buttonsGap:{selector:()=>".buttons-row",property:"gap"},sectionsGap:{selector:()=>".wrapper",property:"gap"},bulletGap:{selector:()=>"descope-text span",property:"gap"},verticalPadding:[{selector:()=>".codes-box",property:"padding-top"},{selector:()=>".codes-box",property:"padding-bottom"},{selector:()=>".buttons-row",property:"padding-bottom"}],horizontalPadding:[{selector:()=>".codes-box",property:"padding-left"},{selector:()=>".codes-box",property:"padding-right"},{selector:()=>".buttons-row",property:"padding-left"},{selector:()=>".buttons-row",property:"padding-right"}],errorBorderColor:{selector:()=>".codes-box",property:"border-color"},errorMessageColor:{selector:()=>".error-message",property:"color"},errorMessageFontSize:{selector:()=>".error-message",property:"font-size"},errorMessageFontWeight:{selector:()=>".error-message",property:"font-weight"},errorMessageFontFamily:{selector:()=>".error-message",property:"font-family"},boxBorderRadius:{selector:()=>".codes-box",property:"border-radius"},errorBorderWidth:{selector:()=>".codes-box",property:"border-width"},boxBorderStyle:{selector:()=>".codes-box",property:"border-style"}}}),(0,n.RF)({componentNameOverride:(0,i.xE)("input-wrapper")}),(0,n.t$)({itemRenderer:({value:t},e,o)=>`\n <descope-text variant="${o.variant}" mode="${o.mode}">\n <span>${t}</span>\n </descope-text>\n `,rerenderAttrsList:["variant","mode"],targetSelector:".list"}),n.VO,n.tQ)(u);customElements.define(l,b)},66434(t,e,o){o.d(e,{T:()=>a,s:()=>c});var n=o(88961),r=o(63200),i=o(25964),s=o(72270);const a=(0,i.xE)("text");class l extends((0,s.qu)({componentName:a,baseSelector:":host > slot"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <slot part="text-wrapper"></slot>\n ',(0,i.fz)("\n :host {\n display: inline-block;\n line-height: 1em;\n }\n :host > slot {\n width: 100%;\n display: inline-block;\n }\n ",this)}get hideWhenEmpty(){return"true"===this.getAttribute("hide-when-empty")}init(){super.init(),(0,i.Ge)(this,()=>{const t=!!this.childNodes.length;this.style.display=!t&&this.hideWhenEmpty?"none":""})}}const{host:d}={host:{selector:()=>":host"}},c=(0,r.Zz)((0,n.RF)({mappings:{hostWidth:{...d,property:"width"},hostDirection:{...d,property:"direction"},fontSize:{},textColor:[{property:"color"}],textLineHeight:{property:"line-height"},textLetterSpacing:{property:"letter-spacing"},textShadow:{},textAlign:{},textTransform:{},fontFamily:{},fontStyle:{},fontWeight:{},borderWidth:{},borderStyle:{},borderColor:{}}}),(0,n.DM)({triggers:[{attr:"full-width",value:"true"}]}),n.VO,n.tQ)(l)},63595(t,e,o){o.r(e),o.d(e,{TextClass:()=>n.s,componentName:()=>n.T});var n=o(66434);customElements.define(n.T,n.s)}}]);
1
+ "use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[1202,2294,6724,9175],{19624(t,e,o){o.d(e,{J:()=>u,T:()=>l});var n=o(63200),r=o(25964),i=o(88961),s=o(98538),a=o(10767);const l=(0,r.xE)("button"),{host:d,label:c,slottedIcon:h}={host:{selector:()=>":host"},label:{selector:"::part(label)"},slottedIcon:{selector:()=>"::slotted(descope-icon)"}};let p;const u=(0,n.Zz)((0,i.DM)({triggers:[{attr:"full-width",value:"true"}]}),(0,i.RF)({mappings:{hostWidth:{property:"width"},hostMaxWidth:{...d,property:"max-width"},hostHeight:{property:"height"},hostDirection:{...d,property:"direction"},fontSize:{},fontFamily:{},fontWeight:{},cursor:{},backgroundColor:{},outlineOffset:{},outlineColor:{},outlineStyle:{},outlineWidth:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-right",fallback:"0.875em"},{property:"padding-left",fallback:"0.875em"}],labelTextColor:{property:"color"},iconColor:{selector:()=>"::slotted(*)",property:s.S.cssVarList.fill},labelTextDecoration:{...c,property:"text-decoration"},labelSpacing:{...c,property:"gap"},textAlign:{...c,property:"justify-content",fallback:"center"},iconSize:[{...h,property:"width"},{...h,property:"height"}]}}),a.G,i.VO,i.tQ)((0,i.tz)({slots:["","prefix","label","suffix"],wrappedEleName:"vaadin-button",style:()=>`\n\t\t\t\n\t:host {\n\t\tdisplay: inline-block;\n\t\tbox-sizing: border-box;\n\t}\n\tvaadin-button::before,\n\tvaadin-button::after {\n\t\topacity: 0;\n\t}\n\tvaadin-button {\n\t\tmargin: 0;\n\t\tmin-width: 0;\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tbox-shadow: none;\n\t}\n\tvaadin-button::part(label) {\n\t\tpadding: 0;\n width: 100%;\n\t}\n\tvaadin-button::part(prefix) {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n\n\t\t\t\n\tvaadin-button::part(prefix),\n\tvaadin-button::part(label) {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n\n\t\t\t${p}\n\t\t\tvaadin-button::part(label) { pointer-events: none; }\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${u.cssVarList.outlineWidth}) + var(${u.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width="true"]) {\n width: var(${u.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${u.cssVarList.hostHeight}) - var(${u.cssVarList.outlineWidth}) - var(${u.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square="true"]:not([full-width="true"]) {\n\t\t\t\twidth: calc(var(${u.cssVarList.hostWidth}) - var(${u.cssVarList.outlineWidth}) - var(${u.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex","class","style"],componentName:l})),{color:b,fontSize:g}=u.cssVarList;p=`\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading="true"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${b});\n\t\ttop: calc(50% - (var(${g}) / 2));\n\t\tleft: calc(50% - (var(${g}) / 2));\n\t\tborder-width: calc(var(${g}) / 10);\n\t\twidth: var(${g});\n\t\theight: var(${g});\n\t}\n\t:host([disabled="true"]),\n\t:host([loading="true"]) {\n\t\tpointer-events: none;\n\t}\n\t:host([loading="true"]) ::part(prefix),\n\t:host([loading="true"]) ::part(label) {\n\t\tvisibility: hidden;\n\t}\n`},10767(t,e,o){o.d(e,{G:()=>n});const n=t=>class extends t{get isLoading(){return"true"===this.getAttribute("loading")}click(){this.isLoading||super.click()}}},30576(t,e,o){o.r(e),o.d(e,{ButtonClass:()=>n.J,componentName:()=>n.T});var n=o(19624);o(83799),customElements.define(n.T,n.J)},98538(t,e,o){o.d(e,{S:()=>l,T:()=>a});var n=o(88961),r=o(25964),i=o(8512),s=o(63200);const a=(0,r.xE)("icon"),l=(0,s.Zz)((0,n.RF)({mappings:{fill:[{},{property:i.q.cssVarList.fill}],height:{selector:()=>":host"},width:{selector:()=>":host"}}}),n.VO,n.tQ)((0,n.tz)({slots:[],wrappedEleName:"descope-image",style:()=>"\n :host {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n max-height: 100%;\n }\n ",excludeAttrsSync:["tabindex","class","style","st-height","st-width"],componentName:a}))},56737(t,e,o){o.r(e),o.d(e,{IconClass:()=>n.S,componentName:()=>n.T}),o(53455);var n=o(98538);customElements.define(n.T,n.S)},8512(t,e,o){o.d(e,{T:()=>l,q:()=>h});var n=o(88961),r=o(72270),i=o(63200),s=o(25964),a=o(18782);const l=(0,s.xE)("image"),d=["src","src-dark"];class c extends((0,r.qu)({componentName:l,baseSelector:"slot"})){static get observedAttributes(){return d}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<slot></slot>\n\t",(0,s.fz)("\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n :host > slot {\n width: 100%;\n height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n ::slotted(*) {\n width: 100%;\n\t\t\t}\n\n .hidden {\n display: none;\n }\n ",this)}init(){super.init?.(),this.toggleVisibility(this.getSrc)}onThemeChange(){this.renderImage()}toggleVisibility(t){t?this.classList.remove("hidden"):this.classList.add("hidden")}get altText(){return this.getAttribute("alt")||""}get legacySrc(){return this.getAttribute("src")}get themeSrc(){return this.getAttribute(`src-${this.currentThemeName}`)}get getSrc(){return this.themeSrc||this.legacySrc}updateFillColor(t){[t,...t.querySelectorAll("*[fill]")].forEach(t=>{t.setAttribute("fill",`var(${h.cssVarList.fill}, ${t.getAttribute("fill")||"''"})`)})}renderImage(){this.toggleVisibility(this.getSrc),(0,a.m)(this.getSrc,this.altText).then(t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))})}shouldRender(t){const e=this.getAttribute(t);return this.getSrc===e}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),e!==o&&this.shouldRender(t)&&this.renderImage()}}const h=(0,i.Zz)((0,n.RF)({mappings:{fill:{},height:{selector:()=>":host"},width:{selector:()=>":host"}}}),n.VO,n.tQ)(c)},18782(t,e,o){o.d(e,{m:()=>i});var n=o(25414);const r=t=>{const e=n.A.sanitize(t,{USE_PROFILES:{svg:!0,svgFilters:!0},ADD_TAGS:["image"],FORBID_TAGS:["defs"]});return(new DOMParser).parseFromString(e,"image/svg+xml").querySelector("svg")},i=async(t,e)=>{try{let o;if((t=>t.startsWith("data:image/svg+xml;base64,"))(t)){const e=atob(t.slice(26));o=r(e)}else if("svg"===(t=>{const e=t.match(/\.([0-9a-z]+)(?:[\\?#]|$)/i);return e?e[1]:null})(t)){const e=await fetch(t),n=await e.text();o=r(n)}else o=((t,e)=>{const o=document.createElement("img");return o.setAttribute("src",t),o.setAttribute("alt",e),o})(t,e);return o.style.setProperty("max-width","100%"),o.style.setProperty("max-height","100%"),o}catch{return null}}},53455(t,e,o){o.r(e),o.d(e,{ImageClass:()=>n.q,componentName:()=>n.T});var n=o(8512);customElements.define(n.T,n.q)},88568(t,e,o){o.r(e),o.d(e,{RecoveryCodesClass:()=>b,componentName:()=>l}),o(63595),o(30576),o(56737),o(37182),o(95260);var n=o(88961),r=o(63200),i=o(25964),s=o(72270),a=o(66434);const l=(0,i.xE)("recovery-codes"),d="none",c={copy:{defaultText:"Copy"},download:{defaultText:"Download"}},h=["text","variant","color","size","icon","icon-dark"],p=["show-download",...Object.keys(c).flatMap(t=>h.map(e=>`${t}-${e}`))];class u extends((0,s.qu)({componentName:l,baseSelector:":host > div"})){static get observedAttributes(){return["readonly","required",...p]}#t=d;#e=!1;#o=!1;constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <div class="wrapper">\n <div class="codes-box">\n <div class="list"></div>\n <descope-text class="icon-wrapper">\n <div class="icons">\n <vaadin-icon class="icon copy-icon" icon="vaadin:copy-o" title="Copy"></vaadin-icon>\n <vaadin-icon class="icon download-icon" icon="vaadin:download-alt" title="Download"></vaadin-icon>\n </div>\n </descope-text>\n </div>\n <div class="error-message"></div>\n <div class="buttons-row"></div>\n </div>\n ',this.list=this.shadowRoot.querySelector(".list"),this.copyIcon=this.shadowRoot.querySelector(".copy-icon"),this.downloadIcon=this.shadowRoot.querySelector(".download-icon"),this.iconWrapper=this.shadowRoot.querySelector(".icon-wrapper"),this.errorMessageEle=this.shadowRoot.querySelector(".error-message"),this.buttonsRow=this.shadowRoot.querySelector(".buttons-row"),(0,i.fz)('\n :host {\n display: inline-block;\n position: relative;\n }\n .wrapper {\n display: flex;\n flex-direction: column;\n }\n .codes-box {\n display: flex;\n justify-content: space-between;\n box-sizing: border-box;\n /* border shows the error ring inside the box; style/width/color/radius come from theme */\n }\n .list {\n display: flex;\n flex-grow: 1;\n flex-direction: column;\n }\n descope-text span {\n display: inline-flex;\n align-items: center;\n width: fit-content;\n }\n descope-text span::before {\n content: \'\\02022\';\n transform: translateY(-0.06em);\n }\n .icon-wrapper {\n align-self: flex-start;\n }\n .icons {\n display: flex;\n flex-direction: column;\n }\n .icon {\n cursor: pointer;\n }\n .icon.copied {\n cursor: initial;\n /* block re-clicks while the checkmark shows, so rapid clicks cannot repeat the action */\n pointer-events: none;\n }\n /* readonly is a host attribute, so disable pointer events from one place */\n :host([readonly="true"]) .icon,\n :host([readonly="true"]) .buttons-row {\n pointer-events: none;\n }\n .download-icon {\n display: none;\n }\n :host([show-download="true"]) .download-icon {\n display: inline-flex;\n }\n .error-message {\n display: none;\n /* width:0 + min-width:100% lets the message wrap to the component width without\n its text expanding the (shrink-to-fit) component; full-width still fills the parent */\n width: 0;\n min-width: 100%;\n box-sizing: border-box;\n line-height: 1.2;\n overflow-wrap: break-word;\n }\n :host([invalid]) .error-message {\n display: block;\n }\n .buttons-row {\n display: none;\n }\n :host([display-variant="buttons"]) .icon-wrapper {\n display: none;\n }\n :host([display-variant="buttons"]) .buttons-row {\n display: flex;\n flex-wrap: wrap;\n }\n /* grow to fill equally; don\'t shrink below content, so they wrap to a new line\n when they don\'t fit (like a container with auto-fit items) */\n .buttons-row > descope-button {\n flex: 1 0 auto;\n }\n ',this)}get variant(){return this.getAttribute("variant")}get mode(){return this.getAttribute("mode")}get value(){return this.#t}#n(t){return this.hasAttribute(t)&&"false"!==this.getAttribute(t)}get isRequired(){return this.#n("required")}get isReadOnly(){return this.#n("readonly")}get errorMessage(){return this.getAttribute("data-errormessage-value-missing")||"Copy or download your recovery codes to continue."}get codesText(){return String((this.data||[]).map(t=>t.value).join("\n"))}init(){super.init(),this.copyIcon.addEventListener("click",this.onCopy.bind(this)),this.downloadIcon.addEventListener("click",this.onDownload.bind(this)),(0,i.EA)(this,this.iconWrapper,{includeAttrs:["variant","mode"]}),this.renderButtons(),this.#o=!0}get isDownloadEnabled(){return"true"===this.getAttribute("show-download")}renderButtons(){if(!this.buttonsRow)return;const t=[this.buildButton("copy")];this.isDownloadEnabled&&t.push(this.buildButton("download")),this.buttonsRow.replaceChildren(...t)}buildButton(t){const{defaultText:e}=c[t],o=(e,o)=>this.getAttribute(`${t}-${e}`)||o,n=document.createElement("descope-button");n.setAttribute("data-action",t),n.setAttribute("variant",o("variant","outline")),n.setAttribute("mode",o("color","primary")),n.setAttribute("size",o("size","md"));const r=this.getAttribute(`${t}-icon`);if(r){const e=document.createElement("descope-icon");e.setAttribute("src",r);const o=this.getAttribute(`${t}-icon-dark`);o&&e.setAttribute("src-dark",o),n.appendChild(e)}return n.appendChild(document.createTextNode(o("text",e))),n.addEventListener("click",()=>"copy"===t?this.onCopy():this.onDownload()),n}onCopy(){this.isReadOnly||(navigator.clipboard.writeText(this.codesText),this.showActionFeedback(this.copyIcon,"Copied"),this.recordAction("copied"))}onDownload(){if(this.isReadOnly)return;const t=new Blob([this.codesText],{type:"text/plain"}),e=URL.createObjectURL(t),o=document.createElement("a");o.href=e,o.download="recovery-codes.txt",o.click(),URL.revokeObjectURL(e),this.showActionFeedback(this.downloadIcon,"Downloaded"),this.recordAction("downloaded")}recordAction(t){this.#t=t,this.dispatchEvent(new Event("change",{bubbles:!0})),this.checkValidity()&&(this.#e=!1),this.syncValidityUI()}showActionFeedback(t,e){t.feedbackTimer?clearTimeout(t.feedbackTimer):(t.originalIcon=t.getAttribute("icon"),t.originalTitle=t.getAttribute("title")),t.setAttribute("icon","vaadin:check-circle-o"),t.setAttribute("title",e),t.classList.add("copied"),t.feedbackTimer=setTimeout(()=>{t.setAttribute("icon",t.originalIcon),t.setAttribute("title",t.originalTitle),t.classList.remove("copied"),t.feedbackTimer=null},5e3)}checkValidity(){return this.isReadOnly||!this.isRequired||this.value!==d}reportValidity(){const t=this.checkValidity();return this.#e=!t,this.syncValidityUI(),t}syncValidityUI(){this.toggleAttribute("invalid",this.#e),this.errorMessageEle&&(this.errorMessageEle.textContent=this.#e?this.errorMessage:"")}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),o!==e&&("required"!==t||this.isRequired||(this.#e=!1,this.syncValidityUI()),this.#o&&p.includes(t)&&this.renderButtons())}}const b=(0,r.Zz)((0,n.RF)({mappings:{hostWidth:{selector:()=>":host",property:"width"},hostMinWidth:{selector:()=>":host",property:"min-width"},hostDirection:[{selector:()=>":host",property:"direction"},{selector:()=>a.s.componentName,property:a.s.cssVarList.hostDirection}],textAlign:{selector:()=>".list",property:"align-items"},iconColor:{selector:()=>"vaadin-icon",property:"color"},iconSize:{selector:()=>"vaadin-icon",property:"font-size"},iconGap:{selector:()=>".codes-box",property:"gap"},iconStackGap:{selector:()=>".icons",property:"gap"},buttonsGap:{selector:()=>".buttons-row",property:"gap"},sectionsGap:{selector:()=>".wrapper",property:"gap"},bulletGap:{selector:()=>"descope-text span",property:"gap"},verticalPadding:[{selector:()=>".codes-box",property:"padding-top"},{selector:()=>".codes-box",property:"padding-bottom"},{selector:()=>".buttons-row",property:"padding-bottom"}],horizontalPadding:[{selector:()=>".codes-box",property:"padding-left"},{selector:()=>".codes-box",property:"padding-right"},{selector:()=>".buttons-row",property:"padding-left"},{selector:()=>".buttons-row",property:"padding-right"}],errorBorderColor:{selector:()=>".codes-box",property:"border-color"},errorMessageColor:{selector:()=>".error-message",property:"color"},errorMessageFontSize:{selector:()=>".error-message",property:"font-size"},errorMessageFontWeight:{selector:()=>".error-message",property:"font-weight"},errorMessageFontFamily:{selector:()=>".error-message",property:"font-family"},boxBorderRadius:{selector:()=>".codes-box",property:"border-radius"},errorBorderWidth:{selector:()=>".codes-box",property:"border-width"},boxBorderStyle:{selector:()=>".codes-box",property:"border-style"}}}),(0,n.RF)({componentNameOverride:(0,i.xE)("input-wrapper")}),(0,n.t$)({itemRenderer:({value:t},e,o)=>`\n <descope-text variant="${o.variant}" mode="${o.mode}">\n <span>${t}</span>\n </descope-text>\n `,rerenderAttrsList:["variant","mode"],targetSelector:".list"}),n.VO,n.tQ)(u);customElements.define(l,b)},66434(t,e,o){o.d(e,{T:()=>a,s:()=>c});var n=o(88961),r=o(63200),i=o(25964),s=o(72270);const a=(0,i.xE)("text");class l extends((0,s.qu)({componentName:a,baseSelector:":host > slot"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <slot part="text-wrapper"></slot>\n ',(0,i.fz)("\n :host {\n display: inline-block;\n line-height: 1em;\n }\n :host > slot {\n width: 100%;\n display: inline-block;\n }\n ",this)}get hideWhenEmpty(){return"true"===this.getAttribute("hide-when-empty")}init(){super.init(),(0,i.Ge)(this,()=>{const t=!!this.childNodes.length;this.style.display=!t&&this.hideWhenEmpty?"none":""})}}const{host:d}={host:{selector:()=>":host"}},c=(0,r.Zz)((0,n.RF)({mappings:{hostWidth:{...d,property:"width"},hostDirection:{...d,property:"direction"},fontSize:{},textColor:[{property:"color"}],textLineHeight:{property:"line-height"},textLetterSpacing:{property:"letter-spacing"},textShadow:{},textAlign:{},textTransform:{},fontFamily:{},fontStyle:{},fontWeight:{},borderWidth:{},borderStyle:{},borderColor:{}}}),(0,n.DM)({triggers:[{attr:"full-width",value:"true"}]}),n.VO,n.tQ)(l)},63595(t,e,o){o.r(e),o.d(e,{TextClass:()=>n.s,componentName:()=>n.T});var n=o(66434);customElements.define(n.T,n.s)}}]);
2
2
  //# sourceMappingURL=descope-recovery-codes.js.map
package/dist/umd/descope-recovery-codes.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"descope-recovery-codes.js","mappings":"yOAYO,MAAAA,GAAsB,EAAAC,EAAAC,IAAgB,WAsC7CC,KAAQA,EAAAC,MAAAA,EAAAC,YAAAA,GAA2B,CACnCF,KAAA,CAAUG,SAAA,aACVF,MAAA,CAAWE,SAAA,iBACXD,YAAA,CAAiBC,SAAA,gCAGjB,IAAAC,EAEO,MAAAC,GAAoB,EAAAC,EAAAC,KACzB,EAAAC,EAAAC,IAAY,CAAGC,SAAA,EAAaC,KAAA,aAAAC,MAAA,YAC5B,EAAAJ,EAAAK,IAAgB,CAClBC,SAAA,CACAC,UAAA,CAAmBC,SAAA,SACnBC,aAAA,IAAsBjB,EAAAgB,SAAA,aACtBE,WAAA,CAAoBF,SAAA,UACpBG,cAAA,IAAuBnB,EAAAgB,SAAA,aACvBI,SAAA,GACAC,WAAA,GACAC,WAAA,GAEAC,OAAA,GACAC,gBAAA,GAEAC,cAAA,GACAC,aAAA,GACAC,aAAA,GACAC,aAAA,GAEAC,aAAA,GACAC,YAAA,GACAC,YAAA,GACAC,YAAA,GAEAC,gBAAA,CACA,CAAUjB,SAAA,eACV,CAAUA,SAAA,mBAEVkB,kBAAA,CACA,CAAUlB,SAAA,gBAAAmB,SAAA,WACV,CAAUnB,SAAA,eAAAmB,SAAA,YAGVC,eAAA,CAAwBpB,SAAA,SACxBqB,UAAA,CACAlC,SAAA,mBACAa,SAAkBsB,EAAAC,EAASC,WAAAC,MAE3BC,oBAAA,IAA6BzC,EAAAe,SAAA,mBAC7B2B,aAAA,IAAsB1C,EAAAe,SAAA,OACtB4B,UAAA,IAAmB3C,EAAAe,SAAA,kBAAAmB,SAAA,UAEnBU,SAAA,CACA,IAAU3C,EAAAc,SAAA,SACV,IAAUd,EAAAc,SAAA,cAIR8B,EAAAC,EACAvC,EAAAwC,GACAxC,EAAAyC,GAnDyB,EAqDzB,EAAAzC,EAAA0C,IAAW,CACbC,MAAA,+BACAC,eAAA,gBACAC,MAAA,yjBAGKjD,2GAGmBC,EAAAmC,WAAAZ,uBAA8CvB,EAAAmC,WAAAf,qFAGjDpB,EAAAmC,WAAAzB,yEAGEV,EAAAmC,WAAAtB,qBAA4Cb,EAAAmC,WAAAZ,uBAA8CvB,EAAAmC,WAAAf,wGAG3FpB,EAAAmC,WAAAzB,oBAA2CV,EAAAmC,WAAAZ,uBAA8CvB,EAAAmC,WAAAf,uDAI/G6B,iBAAA,6BACAzD,oBAIA0D,MAAQA,EAAAnC,SAAAA,GAAkBf,EAAAmC,WAC1BpC,EAAA,mbAeemD,iCACUnC,wCACCA,yCACCA,6BACZA,wBACCA,0PC/JT,MAAAoC,EAAAC,GACP,cAAAA,EACA,aAAAC,GACA,eAAAC,KAAAC,aAAA,UACA,CAEA,KAAAC,GACAF,KAAAD,WAAAI,MAAAD,OACA,mGCLAE,eAAAC,OAAsBC,EAAAC,EAAeD,EAAAE,yFCO9B,MAAAtE,GAAsB,EAAAC,EAAAC,IAAgB,QAEtCqE,GAAkB,EAAAC,EAAA9D,KACvB,EAAA+D,EAAAzD,IAAgB,CAClBC,SAAA,CACA2B,KAAA,IAAe,CAAIzB,SAAUuD,EAAAC,EAAUhC,WAAAC,OACvCgC,OAAA,CAAgBtE,SAAA,aAChBuE,MAAA,CAAevE,SAAA,gBAGbmE,EAAAtB,GACAsB,EAAArB,GATuB,EAWvB,EAAAqB,EAAApB,IAAW,CACbC,MAAA,GACAC,eAAA,gBACAC,MAAA,iKAQAC,iBAAA,oDACAzD,iHC/BAkE,eAAAC,OAAsBW,EAAAT,EAAeS,EAAApC,oGCQ9B,MAAA1C,GAAsB,EAAA+E,EAAA7E,IAAgB,SAE7C8E,EAAA,mBAEA,MAAAC,WAAuB,EAAAC,EAAAC,IAAe,CACtCnF,gBACAoF,aAAA,UAEA,6BAAAC,GACA,OAAAL,CACA,CAEA,WAAAM,GACArB,QAEAH,KAAAyB,aAAA,CAAwBC,KAAA,SAAcC,UAAA,2BAIlC,EAAAV,EAAAW,IACJ,6UAoBA5B,KAEA,CAEA,IAAA6B,GACA1B,MAAA0B,SACA7B,KAAA8B,iBAAA9B,KAAA+B,OACA,CAEA,aAAAC,GACAhC,KAAAiC,aACA,CAEA,gBAAAH,CAAAI,GACAA,EACAlC,KAAAmC,UAAAC,OAAA,UAEApC,KAAAmC,UAAAE,IAAA,SAEA,CAEA,WAAAC,GACA,OAAAtC,KAAAC,aAAA,UACA,CAEA,aAAAsC,GACA,OAAAvC,KAAAC,aAAA,MACA,CAEA,YAAAuC,GACA,OAAAxC,KAAAC,aAAA,OAAoCD,KAAAyC,mBACpC,CAEA,UAAAV,GACA,OAAA/B,KAAAwC,UAAAxC,KAAAuC,SACA,CAKA,eAAAG,CAAAC,GAEA,CAAAA,KAAAA,EAAAC,iBAAA,YAEAC,QAAAC,IACAA,EAAAC,aACA,OACA,OAAeC,EAAAnE,WAAAC,SAA+BgE,EAAA7C,aAAA,mBAG9C,CAEA,WAAAgC,GACAjC,KAAA8B,iBAAA9B,KAAA+B,SAEI,EAAAkB,EAAAC,GAAWlD,KAAA+B,OAAA/B,KAAAsC,SAAAa,KAAAC,IACfpD,KAAA2B,UAAA,GACAyB,IACApD,KAAA0C,gBAAAU,GACApD,KAAAqD,YAAAD,KAGA,CAGA,YAAAE,CAAAC,GACA,MAAAC,EAAAxD,KAAAC,aAAAsD,GACA,OAAAvD,KAAA+B,SAAAyB,CACA,CAEA,wBAAAC,CAAAC,EAAAC,EAAAC,GACAzD,MAAAsD,2BAAAC,EAAAC,EAAAC,GAEAD,IAAAC,GAEA5D,KAAAsD,aAAAI,IACA1D,KAAAiC,aAEA,EAGO,MAAAe,GAAmB,EAAAa,EAAAjH,KACxB,EAAA+D,EAAAzD,IAAgB,CAClBC,SAAA,CACA2B,KAAA,GACAgC,OAAA,CAAgBtE,SAAA,aAChBuE,MAAA,CAAevE,SAAA,gBAGbmE,EAAAtB,GACAsB,EAAArB,GATwB,CAU1B6B,iDC7IA,MAgBA2C,EAAAC,IAEA,MAAAC,EAAgBC,EAAAC,EAASC,SAAAJ,EAAA,CACzBK,aAAA,CAAoBC,KAAA,EAAAC,YAAA,GAEpBC,SAAA,UAEAC,YAAA,WAOA,OAJA,IAAAC,WAEAC,gBAAAV,EAAA,iBACAW,cAAA,QAIOC,EAAAC,MAAAtB,EAAAjB,KACP,IACA,IAAAQ,EACA,GA7BA,CAAAS,GAAAA,EAAAuB,WAFA,8BA+BAC,CAAAxB,GAAA,CAEA,MAAAyB,EAAAC,KAAA1B,EAAA2B,MAAAC,KACArC,EAAAgB,EAAAkB,EACA,MAAM,WAxCN,CAAAI,IACA,MAAAC,EAAAD,EAAAC,MAAA,8BACA,OAAAA,EAAAA,EAAA,SAsCMC,CAAA/B,GAAA,CAEN,MAAAgC,QAAAC,MAAAjC,GACAQ,QAAAwB,EAAAxB,OACAjB,EAAAgB,EAAAC,EACA,MAEAjB,EAtCA,EAAAS,EAAAjB,KACA,MAAAQ,EAAA2C,SAAAC,cAAA,OAGA,OAFA5C,EAAAC,aAAA,MAAAQ,GACAT,EAAAC,aAAA,MAAAT,GACAQ,GAkCA6C,CAAApC,EAAAjB,GAMA,OAHAQ,EAAApD,MAAAkG,YAAA,oBACA9C,EAAApD,MAAAkG,YAAA,qBAEA9C,CACA,CAAI,MACJ,WACA,wFCxDA1C,eAAAC,OAAsBwF,EAAAtF,EAAesF,EAAAhF,sLCa9B,MAAA3E,GAAsB,EAAA4J,EAAA1J,IAAgB,kBAE7C2J,EAAA,OAKAC,EAAA,CACAC,KAAA,CAAUC,YAAA,QACVC,SAAA,CAAcD,YAAA,aAMdE,EAAA,CACA,OACA,UACA,QACA,OACA,OACA,aAIAC,EAAA,CACA,mBACAC,OAAAC,KAAAP,GAAAQ,QAAAC,GACAL,EAAAM,IAAAC,GAAA,GAAuCF,KAAUE,OAYjD,MAAAC,WAA+B,EAAAC,EAAAxF,IAAe,CAC9CnF,gBACAoF,aAAA,iBAEA,6BAAAC,GACA,gCAAA8E,EACA,CAGAI,GAAAV,EAGAe,IAAA,EAIAC,IAAA,EAEA,WAAAvF,GACArB,QAEAH,KAAAyB,aAAA,CAAwBC,KAAA,SAAcC,UAAA,kjBAgBtC3B,KAAAgH,KAAAhH,KAAAiH,WAAAtC,cAAA,SACA3E,KAAAkH,SAAAlH,KAAAiH,WAAAtC,cAAA,cACA3E,KAAAmH,aAAAnH,KAAAiH,WAAAtC,cAAA,kBACA3E,KAAAoH,YAAApH,KAAAiH,WAAAtC,cAAA,iBACA3E,KAAAqH,gBAAArH,KAAAiH,WAAAtC,cAAA,kBACA3E,KAAAsH,WAAAtH,KAAAiH,WAAAtC,cAAA,iBAEI,EAAAmB,EAAAlE,IACJ,s5EAoFA5B,KAEA,CAEA,WAAAuH,GACA,OAAAvH,KAAAC,aAAA,UACA,CAEA,QAAAyB,GACA,OAAA1B,KAAAC,aAAA,OACA,CAGA,SAAAhD,GACA,OAAA+C,MAAAyG,CACA,CAGA,EAAAe,CAAAC,GACA,OAAAzH,KAAA0H,aAAAD,IAAA,UAAAzH,KAAAC,aAAAwH,EACA,CAEA,cAAAE,GACA,OAAA3H,MAAAwH,EAAA,WACA,CAEA,cAAAI,GACA,OAAA5H,MAAAwH,EAAA,WACA,CAEA,gBAAAK,GACA,OACA7H,KAAAC,aAAA,oCAtMA,6CAyMA,CAEA,aAAA6H,GACA,OAAAC,QAAA/H,KAAAgI,MAAA,IAAAtB,IAAAuB,GAAAA,EAAAhL,OAAAiL,KAAA,MACA,CAEA,IAAArG,GACA1B,MAAA0B,OAEA7B,KAAAkH,SAAAiB,iBAAA,QAAAnI,KAAAoI,OAAAC,KAAArI,OACAA,KAAAmH,aAAAgB,iBAAA,QAAAnI,KAAAsI,WAAAD,KAAArI,QAEI,EAAA8F,EAAAyC,IAAYvI,KAAAA,KAAAoH,YAAA,CAA2BoB,aAAA,qBAE3CxI,KAAAyI,gBACAzI,MAAA+G,GAAA,CACA,CAEA,qBAAA2B,GACA,eAAA1I,KAAAC,aAAA,gBACA,CAIA,aAAAwI,GACA,IAAAzI,KAAAsH,WAAA,OAEA,MAAAqB,EAAA,CAAA3I,KAAA4I,YAAA,SACA5I,KAAA0I,mBACAC,EAAAE,KAAA7I,KAAA4I,YAAA,aAEA5I,KAAAsH,WAAAwB,mBAAAH,EACA,CAEA,WAAAC,CAAAnC,GACA,MAAAP,YAAYA,GAAcF,EAAAS,GAC1BzJ,EAAA,CAAAyK,EAAAjJ,IACAwB,KAAAC,aAAA,GAA2BwG,KAAUgB,MAAKjJ,EAE1CuK,EAAAtD,SAAAC,cAAA,kBACAqD,EAAAhG,aAAA,cAAA0D,GACAsC,EAAAhG,aAAA,UAAA/F,EAAA,sBACA+L,EAAAhG,aAAA,OAAA/F,EAAA,oBACA+L,EAAAhG,aAAA,OAAA/F,EAAA,cAQA,MAAAgM,EAAAhJ,KAAAC,aAAA,GAAyCwG,UACzC,GAAAuC,EAAA,CACA,MAAAC,EAAAxD,SAAAC,cAAA,gBACAuD,EAAAlG,aAAA,MAAAiG,GACA,MAAAE,EAAAlJ,KAAAC,aAAA,GAA4CwG,eAC5CyC,GAAAD,EAAAlG,aAAA,WAAAmG,GACAH,EAAA1F,YAAA4F,EACA,CAMA,OAJAF,EAAA1F,YAAAoC,SAAA0D,eAAAnM,EAAA,OAAAkJ,KACA6C,EAAAZ,iBAAA,YACA,SAAA1B,EAAAzG,KAAAoI,SAAApI,KAAAsI,cAEAS,CACA,CAEA,MAAAX,GACApI,KAAA4H,aACAwB,UAAAC,UAAAC,UAAAtJ,KAAA8H,WACA9H,KAAAuJ,mBAAAvJ,KAAAkH,SAAA,UACAlH,KAAAwJ,aAAA,UACA,CAEA,UAAAlB,GACA,GAAAtI,KAAA4H,WAAA,OACA,MAAA6B,EAAA,IAAAC,KAAA,CAAA1J,KAAA8H,WAAA,CAA8C6B,KAAA,eAC9CC,EAAAC,IAAAC,gBAAAL,GACAM,EAAAtE,SAAAC,cAAA,KACAqE,EAAAC,KAAAJ,EACAG,EAAA5D,SAAA,qBACA4D,EAAA7J,QACA2J,IAAAI,gBAAAL,GAEA5J,KAAAuJ,mBAAAvJ,KAAAmH,aAAA,cACAnH,KAAAwJ,aAAA,aACA,CAGA,YAAAA,CAAA/C,GACAzG,MAAAyG,EAAAA,EAEAzG,KAAAkK,cAAA,IAAAC,MAAA,UAA6CC,SAAA,KAE7CpK,KAAAqK,kBACArK,MAAA8G,GAAA,GAEA9G,KAAAsK,gBACA,CAGA,kBAAAf,CAAAgB,EAAAC,GAGAD,EAAAE,cACAC,aAAAH,EAAAE,gBAEAF,EAAAI,aAAAJ,EAAAtK,aAAA,QACAsK,EAAAK,cAAAL,EAAAtK,aAAA,UAGAsK,EAAAxH,aAAA,gCACAwH,EAAAxH,aAAA,QAAAyH,GACAD,EAAApI,UAAAE,IAAA,UAEAkI,EAAAE,cAAAI,WAAA,KACAN,EAAAxH,aAAA,OAAAwH,EAAAI,cACAJ,EAAAxH,aAAA,QAAAwH,EAAAK,eACAL,EAAApI,UAAAC,OAAA,UACAmI,EAAAE,cAAA,MACK,IACL,CAGA,aAAAJ,GACA,OAAArK,KAAA4H,aAAA5H,KAAA2H,YAAA3H,KAAA/C,QAAA8I,CACA,CAEA,cAAA+E,GACA,MAAAC,EAAA/K,KAAAqK,gBAGA,OAFArK,MAAA8G,GAAAiE,EACA/K,KAAAsK,iBACAS,CACA,CAIA,cAAAT,GACAtK,KAAAgL,gBAAA,UAAAhL,MAAA8G,GACA9G,KAAAqH,kBACArH,KAAAqH,gBAAA4D,YAAAjL,MAAA8G,EACA9G,KAAA6H,aACA,GAEA,CAEA,wBAAApE,CAAAC,EAAAC,EAAAC,GACAzD,MAAAsD,2BAAAC,EAAAC,EAAAC,GAEAA,IAAAD,IAGA,aAAAD,GAAA1D,KAAA2H,aACA3H,MAAA8G,GAAA,EACA9G,KAAAsK,kBAKAtK,MAAA+G,GAAAV,EAAA6E,SAAAxH,IACA1D,KAAAyI,gBAEA,EAGO,MAAA0C,GAA2B,EAAAC,EAAAxO,KAChC,EAAAyO,EAAAnO,IAAgB,CAClBC,SAAA,CACAC,UAAA,CAAmBZ,SAAA,YAAAa,SAAA,SACnBiO,aAAA,CAAsB9O,SAAA,YAAAa,SAAA,aACtBG,cAAA,CACA,CAAUhB,SAAA,YAAAa,SAAA,aACV,CACAb,SAAA,IAA0B+O,EAAAC,EAAStP,cACnCmB,SAAoBkO,EAAAC,EAAS3M,WAAArB,gBAG7ByB,UAAA,CAAmBzC,SAAA,YAAAa,SAAA,eACnBqB,UAAA,CAAmBlC,SAAA,kBAAAa,SAAA,SACnB6B,SAAA,CAAkB1C,SAAA,kBAAAa,SAAA,aAClBoO,QAAA,CAAiBjP,SAAA,iBAAAa,SAAA,OACjBqO,aAAA,CAAsBlP,SAAA,aAAAa,SAAA,OACtBsO,WAAA,CAAoBnP,SAAA,mBAAAa,SAAA,OACpBuO,YAAA,CAAqBpP,SAAA,eAAAa,SAAA,OACrBwO,UAAA,CAAmBrP,SAAA,wBAAAa,SAAA,OAInBiB,gBAAA,CACA,CAAU9B,SAAA,iBAAAa,SAAA,eACV,CAAUb,SAAA,iBAAAa,SAAA,kBACV,CAAUb,SAAA,mBAAAa,SAAA,mBAIVkB,kBAAA,CACA,CAAU/B,SAAA,iBAAAa,SAAA,gBACV,CAAUb,SAAA,iBAAAa,SAAA,iBACV,CAAUb,SAAA,mBAAAa,SAAA,gBACV,CAAUb,SAAA,mBAAAa,SAAA,kBAEVyO,iBAAA,CACAtP,SAAA,iBACAa,SAAA,gBAEA0O,kBAAA,CACAvP,SAAA,qBACAa,SAAA,SAEA2O,qBAAA,CACAxP,SAAA,qBACAa,SAAA,aAEA4O,uBAAA,CACAzP,SAAA,qBACAa,SAAA,eAEA6O,uBAAA,CACA1P,SAAA,qBACAa,SAAA,eAEA8O,gBAAA,CACA3P,SAAA,iBACAa,SAAA,iBAEA+O,iBAAA,CACA5P,SAAA,iBACAa,SAAA,gBAEAgP,eAAA,CACA7P,SAAA,iBACAa,SAAA,oBAME,EAAAgO,EAAAnO,IAAgB,CAClBoP,uBAA2B,EAAAxG,EAAA1J,IAAgB,oBAEzC,EAAAiP,EAAAkB,IAAsB,CACxBC,aA7ZA,EAAwBvP,SAAOwP,EAAAC,IAC/B,gCAC6BA,EAAAnF,kBAAsBmF,EAAAhL,uBACrCzE,oCA2Zd0P,kBAAA,mBACAC,eAAA,UAEEvB,EAAAhM,GACAgM,EAAA/L,GAjFgC,CAkFlCsH,GC1cAxG,eAAAC,OAAsBnE,EAAeiP,0FCM9B,MAAAjP,GAAsB,EAAA2Q,EAAAzQ,IAAgB,QAE7C,MAAA0Q,WAAsB,EAAAC,EAAA1L,IAAe,CACrCnF,gBACAoF,aAAA,kBAEA,WAAAE,GACArB,QAEAH,KAAAyB,aAAA,CAAwBC,KAAA,SAAcC,UAAA,iDAIlC,EAAAkL,EAAAjL,IACJ,iLAUA5B,KAEA,CAEA,iBAAAgN,GACA,eAAAhN,KAAAC,aAAA,kBACA,CAEA,IAAA4B,GACA1B,MAAA0B,QAEI,EAAAgL,EAAAI,IAAejN,KAAA,KACnB,MAAAkN,IAAAlN,KAAAmN,WAAAC,OACApN,KAAAN,MAAA2N,SAAAH,GAAAlN,KAAAgN,cAAA,WAEA,EAGA,MAAA3Q,KAAQA,GAAO,CACfA,KAAA,CAAUG,SAAA,cAGH+O,GAAkB,EAAA+B,EAAA1Q,KACvB,EAAA+D,EAAAzD,IAAgB,CAClBC,SAAA,CACAC,UAAA,IAAmBf,EAAAgB,SAAA,SACnBG,cAAA,IAAuBnB,EAAAgB,SAAA,aACvBI,SAAA,GACA8P,UAAA,EAAoBlQ,SAAA,UACpBmQ,eAAA,CAAwBnQ,SAAA,eACxBoQ,kBAAA,CAA2BpQ,SAAA,kBAC3BqQ,WAAA,GACAzO,UAAA,GACA0O,cAAA,GACAjQ,WAAA,GACAkQ,UAAA,GACAjQ,WAAA,GACAU,YAAA,GACAD,YAAA,GACAD,YAAA,OAGE,EAAAwC,EAAA7D,IAAY,CAAGC,SAAA,EAAaC,KAAA,aAAAC,MAAA,WAC5B0D,EAAAtB,GACAsB,EAAArB,GAtBuB,CAuBzBwN,wFCjFA1M,eAAAC,OAAsBwN,EAAAtN,EAAesN,EAAArC","sources":["webpack://@descope/web-components-ui/../components/descope-button/src/component/ButtonClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/clickableMixin.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-icon/src/component/IconClass.js","webpack://@descope/web-components-ui/../components/descope-icon/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/ImageClass.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/helpers.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-recovery-codes/src/component/RecoveryCodesClass.js","webpack://@descope/web-components-ui/../components/descope-recovery-codes/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-text/src/component/TextClass.js","webpack://@descope/web-components-ui/../components/descope-text/src/component/index.js"],"sourcesContent":["import { compose } from '@descope-ui/common/utils';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport {\n createStyleMixin,\n draggableMixin,\n createProxy,\n componentNameValidationMixin,\n stretchMixin,\n} from '@descope-ui/common/components-mixins';\nimport { IconClass } from '@descope-ui/descope-icon/class';\nimport { clickableMixin } from './clickableMixin';\n\nexport const componentName = getComponentName('button');\n\nconst resetStyles = `\n\t:host {\n\t\tdisplay: inline-block;\n\t\tbox-sizing: border-box;\n\t}\n\tvaadin-button::before,\n\tvaadin-button::after {\n\t\topacity: 0;\n\t}\n\tvaadin-button {\n\t\tmargin: 0;\n\t\tmin-width: 0;\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tbox-shadow: none;\n\t}\n\tvaadin-button::part(label) {\n\t\tpadding: 0;\n width: 100%;\n\t}\n\tvaadin-button::part(prefix) {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n`;\n\nconst iconStyles = `\n\tvaadin-button::part(prefix),\n\tvaadin-button::part(label) {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n`;\n\nconst editorOverrides = `vaadin-button::part(label) { pointer-events: none; }`;\n\nconst { host, label, slottedIcon } = {\n host: { selector: () => ':host' },\n label: { selector: '::part(label)' },\n slottedIcon: { selector: () => '::slotted(descope-icon)' },\n};\n\nlet loadingIndicatorStyles;\n\nexport const ButtonClass = compose(\n stretchMixin({ triggers: [{ attr: 'full-width', value: 'true' }] }),\n createStyleMixin({\n mappings: {\n hostWidth: { property: 'width' },\n hostMaxWidth: { ...host, property: 'max-width' },\n hostHeight: { property: 'height' },\n hostDirection: { ...host, property: 'direction' },\n fontSize: {},\n fontFamily: {},\n fontWeight: {},\n\n cursor: {},\n backgroundColor: {},\n\n outlineOffset: {},\n outlineColor: {},\n outlineStyle: {},\n outlineWidth: {},\n\n borderRadius: {},\n borderColor: {},\n borderStyle: {},\n borderWidth: {},\n\n verticalPadding: [\n { property: 'padding-top' },\n { property: 'padding-bottom' },\n ],\n horizontalPadding: [\n { property: 'padding-right', fallback: '0.875em' },\n { property: 'padding-left', fallback: '0.875em' },\n ],\n\n labelTextColor: { property: 'color' },\n iconColor: {\n selector: () => `::slotted(*)`,\n property: IconClass.cssVarList.fill,\n },\n labelTextDecoration: { ...label, property: 'text-decoration' },\n labelSpacing: { ...label, property: 'gap' },\n textAlign: { ...label, property: 'justify-content', fallback: 'center' },\n\n iconSize: [\n { ...slottedIcon, property: 'width' },\n { ...slottedIcon, property: 'height' },\n ],\n },\n }),\n clickableMixin,\n draggableMixin,\n componentNameValidationMixin,\n)(\n createProxy({\n slots: ['', 'prefix', 'label', 'suffix'],\n wrappedEleName: 'vaadin-button',\n style: () => `\n\t\t\t${resetStyles}\n\t\t\t${iconStyles}\n\t\t\t${loadingIndicatorStyles}\n\t\t\t${editorOverrides}\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${ButtonClass.cssVarList.outlineWidth}) + var(${ButtonClass.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width=\"true\"]) {\n width: var(${ButtonClass.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${ButtonClass.cssVarList.hostHeight}) - var(${ButtonClass.cssVarList.outlineWidth}) - var(${ButtonClass.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square=\"true\"]:not([full-width=\"true\"]) {\n\t\t\t\twidth: calc(var(${ButtonClass.cssVarList.hostWidth}) - var(${ButtonClass.cssVarList.outlineWidth}) - var(${ButtonClass.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,\n excludeAttrsSync: ['tabindex', 'class', 'style'],\n componentName,\n }),\n);\n\nconst { color, fontSize } = ButtonClass.cssVarList;\nloadingIndicatorStyles = `\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading=\"true\"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${color});\n\t\ttop: calc(50% - (var(${fontSize}) / 2));\n\t\tleft: calc(50% - (var(${fontSize}) / 2));\n\t\tborder-width: calc(var(${fontSize}) / 10);\n\t\twidth: var(${fontSize});\n\t\theight: var(${fontSize});\n\t}\n\t:host([disabled=\"true\"]),\n\t:host([loading=\"true\"]) {\n\t\tpointer-events: none;\n\t}\n\t:host([loading=\"true\"]) ::part(prefix),\n\t:host([loading=\"true\"]) ::part(label) {\n\t\tvisibility: hidden;\n\t}\n`;\n","export const clickableMixin = (superclass) =>\n class ClickableMixinClass extends superclass {\n get isLoading() {\n return this.getAttribute('loading') === 'true';\n }\n\n click() {\n this.isLoading || super.click();\n }\n };\n","import { componentName, ButtonClass } from './ButtonClass';\nimport '@vaadin/button';\n\ncustomElements.define(componentName, ButtonClass);\n\nexport { ButtonClass, componentName };\n","import {\n componentNameValidationMixin,\n createProxy,\n createStyleMixin,\n draggableMixin,\n} from '@descope-ui/common/components-mixins';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport { ImageClass } from '@descope-ui/descope-image/class';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('icon');\n\nexport const IconClass = compose(\n createStyleMixin({\n mappings: {\n fill: [{}, { property: ImageClass.cssVarList.fill }],\n height: { selector: () => ':host' },\n width: { selector: () => ':host' },\n },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(\n createProxy({\n slots: [],\n wrappedEleName: 'descope-image',\n style: () => `\n :host {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n max-height: 100%;\n }\n `,\n excludeAttrsSync: ['tabindex', 'class', 'style', 'st-height', 'st-width'],\n componentName,\n }),\n);\n","import '@descope-ui/descope-image';\n\nimport { componentName, IconClass } from './IconClass';\n\ncustomElements.define(componentName, IconClass);\n\nexport { IconClass, componentName };\n"," \nimport {\n createStyleMixin,\n draggableMixin,\n componentNameValidationMixin,\n} from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport { compose } from '@descope-ui/common/utils';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport { createImage } from './helpers';\nimport { injectStyle } from '@descope-ui/common/components-helpers';\n\nexport const componentName = getComponentName('image');\n\nconst srcAttrs = ['src', 'src-dark'];\n\nclass RawImage extends createBaseClass({\n componentName,\n baseSelector: 'slot',\n}) {\n static get observedAttributes() {\n return srcAttrs;\n }\n\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\n\t\t<slot></slot>\n\t`;\n\n injectStyle(\n `\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n :host > slot {\n width: 100%;\n height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n ::slotted(*) {\n width: 100%;\n\t\t\t}\n\n .hidden {\n display: none;\n }\n `,\n this,\n );\n }\n\n init() {\n super.init?.();\n this.toggleVisibility(this.getSrc);\n }\n\n onThemeChange() {\n this.renderImage();\n }\n\n toggleVisibility(isVisible) {\n if (isVisible) {\n this.classList.remove('hidden');\n } else {\n this.classList.add('hidden');\n }\n }\n\n get altText() {\n return this.getAttribute('alt') || '';\n }\n\n get legacySrc() {\n return this.getAttribute('src');\n }\n\n get themeSrc() {\n return this.getAttribute(`src-${this.currentThemeName}`);\n }\n\n get getSrc() {\n return this.themeSrc || this.legacySrc;\n }\n\n // in order to fill an SVG with `currentColor` override all of its `fill` and `path` nodes\n // with the value from the `st-fill` attribute\n \n updateFillColor(node) {\n // set fill to root node and all its relevant selectors\n const elementsToReplace = [node, ...node.querySelectorAll('*[fill]')];\n\n elementsToReplace.forEach((ele) => {\n ele.setAttribute(\n 'fill',\n `var(${ImageClass.cssVarList.fill}, ${ele.getAttribute('fill') || \"''\"})`,\n );\n });\n }\n\n renderImage() {\n this.toggleVisibility(this.getSrc);\n\n createImage(this.getSrc, this.altText).then((res) => {\n this.innerHTML = '';\n if (res) {\n this.updateFillColor(res);\n this.appendChild(res);\n }\n });\n }\n\n // render only when src attribute matches current theme\n shouldRender(src) {\n const srcVal = this.getAttribute(src);\n return this.getSrc === srcVal;\n }\n\n attributeChangedCallback(attrName, oldValue, newValue) {\n super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n if (oldValue === newValue) return;\n\n if (this.shouldRender(attrName)) {\n this.renderImage();\n }\n }\n}\n\nexport const ImageClass = compose(\n createStyleMixin({\n mappings: {\n fill: {},\n height: { selector: () => ':host' },\n width: { selector: () => ':host' },\n },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(RawImage);\n","import DOMPurify from 'dompurify';\n\nconst getFileExtension = (path) => {\n const match = path.match(/\\.([0-9a-z]+)(?:[\\\\?#]|$)/i);\n return match ? match[1] : null;\n};\n\nconst base64Prefix = 'data:image/svg+xml;base64,';\n\nconst isBase64Svg = (src) => src.startsWith(base64Prefix);\n\nconst createImgEle = (src, altText) => {\n const ele = document.createElement('img');\n ele.setAttribute('src', src);\n ele.setAttribute('alt', altText);\n return ele;\n};\n\nconst createSvgEle = (text) => {\n // we want to purify the SVG to avoid XSS attacks\n const clean = DOMPurify.sanitize(text, {\n USE_PROFILES: { svg: true, svgFilters: true },\n // allow image to render\n ADD_TAGS: ['image'],\n // forbid interactiviy via `use` tags (which are sanitized by default)\n FORBID_TAGS: ['defs']\n });\n\n const parser = new DOMParser();\n const ele = parser\n .parseFromString(clean, 'image/svg+xml')\n .querySelector('svg');\n return ele;\n};\n\nexport const createImage = async (src, altText) => {\n try {\n let ele;\n if (isBase64Svg(src)) {\n // handle base64 source\n const svgXml = atob(src.slice(base64Prefix.length));\n ele = createSvgEle(svgXml);\n } else if (getFileExtension(src) === 'svg') {\n // handle urls\n const fetchedSrc = await fetch(src);\n const text = await fetchedSrc.text();\n ele = createSvgEle(text);\n } else {\n // handle binary\n ele = createImgEle(src, altText);\n }\n\n ele.style.setProperty('max-width', '100%');\n ele.style.setProperty('max-height', '100%');\n\n return ele;\n } catch {\n return null;\n }\n};\n","import { componentName, ImageClass } from './ImageClass';\n\ncustomElements.define(componentName, ImageClass);\n\nexport { ImageClass, componentName };\n","import {\n createStyleMixin,\n draggableMixin,\n componentNameValidationMixin,\n createDynamicDataMixin,\n} from '@descope-ui/common/components-mixins';\nimport { compose } from '@descope-ui/common/utils';\nimport {\n forwardAttrs,\n getComponentName,\n injectStyle,\n} from '@descope-ui/common/components-helpers';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport { TextClass } from '@descope-ui/descope-text/class';\n\nexport const componentName = getComponentName('recovery-codes');\n\nconst NO_ACTION = 'none';\nconst DEFAULT_ERROR_MESSAGE = 'Please save your recovery codes to continue';\n\n// default button label per action (buttons variant). the icons variant uses the vaadin\n// glyphs hardcoded in the shadow-DOM template below; the buttons variant uses image srcs.\nconst ACTIONS = {\n copy: { defaultText: 'Copy' },\n download: { defaultText: 'Download' },\n};\n\n// per-button config suffixes; the full attribute is `${action}-${suffix}`.\n// `icon`/`icon-dark` are image srcs (the seeded glyph or a custom upload), matching\n// the standard button's start-icon (light/dark), not a boolean.\nconst BUTTON_SUFFIXES = [\n 'text',\n 'variant',\n 'color',\n 'size',\n 'icon',\n 'icon-dark',\n];\n\n// changing any of these rebuilds the buttons (so the editor preview stays live)\nconst BUTTON_ATTRS = [\n 'show-download',\n ...Object.keys(ACTIONS).flatMap((action) =>\n BUTTON_SUFFIXES.map((suffix) => `${action}-${suffix}`),\n ),\n];\n\nconst itemRenderer = ({ value }, _, ref) => {\n return `\n <descope-text variant=\"${ref.variant}\" mode=\"${ref.mode}\">\n <span>${value}</span>\n </descope-text>\n `;\n};\n\nclass RawRecoveryCodes extends createBaseClass({\n componentName,\n baseSelector: ':host > div',\n}) {\n static get observedAttributes() {\n return ['readonly', 'required', ...BUTTON_ATTRS];\n }\n\n // 'none' | 'copied' | 'downloaded' - the last action the user took on the codes\n #action = NO_ACTION;\n\n // the error is shown only after a submit attempt (reportValidity), like inputs\n #showError = false;\n\n // init() builds the buttons once with all seeded attrs; guards against rebuilding\n // on every per-attribute change fired during element upgrade (before init runs)\n #initialized = false;\n\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\n <div class=\"wrapper\">\n <div class=\"codes-box\">\n <div class=\"list\"></div>\n <descope-text class=\"icon-wrapper\">\n <div class=\"icons\">\n <vaadin-icon class=\"icon copy-icon\" icon=\"vaadin:copy-o\" title=\"Copy\"></vaadin-icon>\n <vaadin-icon class=\"icon download-icon\" icon=\"vaadin:download-alt\" title=\"Download\"></vaadin-icon>\n </div>\n </descope-text>\n </div>\n <div class=\"error-message\"></div>\n <div class=\"buttons-row\"></div>\n </div>\n `;\n\n this.list = this.shadowRoot.querySelector('.list');\n this.copyIcon = this.shadowRoot.querySelector('.copy-icon');\n this.downloadIcon = this.shadowRoot.querySelector('.download-icon');\n this.iconWrapper = this.shadowRoot.querySelector('.icon-wrapper');\n this.errorMessageEle = this.shadowRoot.querySelector('.error-message');\n this.buttonsRow = this.shadowRoot.querySelector('.buttons-row');\n\n injectStyle(\n `\n :host {\n display: inline-block;\n position: relative;\n }\n .wrapper {\n display: flex;\n flex-direction: column;\n }\n .codes-box {\n display: flex;\n justify-content: space-between;\n box-sizing: border-box;\n /* border shows the error ring inside the box; style/width/color/radius come from theme */\n }\n .list {\n display: flex;\n flex-grow: 1;\n flex-direction: column;\n }\n descope-text span {\n display: inline-flex;\n align-items: center;\n width: fit-content;\n }\n descope-text span::before {\n content: '\\\\02022';\n transform: translateY(-0.06em);\n }\n .icon-wrapper {\n align-self: flex-start;\n }\n .icons {\n display: flex;\n flex-direction: column;\n }\n .icon {\n cursor: pointer;\n }\n .icon.copied {\n cursor: initial;\n /* block re-clicks while the checkmark shows, so rapid clicks cannot repeat the action */\n pointer-events: none;\n }\n /* readonly is a host attribute, so disable pointer events from one place */\n :host([readonly=\"true\"]) .icon,\n :host([readonly=\"true\"]) .buttons-row {\n pointer-events: none;\n }\n .download-icon {\n display: none;\n }\n :host([show-download=\"true\"]) .download-icon {\n display: inline-flex;\n }\n .error-message {\n display: none;\n /* width:0 + min-width:100% lets the message wrap to the component width without\n its text expanding the (shrink-to-fit) component; full-width still fills the parent */\n width: 0;\n min-width: 100%;\n box-sizing: border-box;\n line-height: 1.2;\n overflow-wrap: break-word;\n }\n :host([invalid]) .error-message {\n display: block;\n }\n .buttons-row {\n display: none;\n }\n :host([display-variant=\"buttons\"]) .icon-wrapper {\n display: none;\n }\n :host([display-variant=\"buttons\"]) .buttons-row {\n display: flex;\n flex-wrap: wrap;\n }\n /* grow to fill equally; don't shrink below content, so they wrap to a new line\n when they don't fit (like a container with auto-fit items) */\n .buttons-row > descope-button {\n flex: 1 0 auto;\n }\n `,\n this,\n );\n }\n\n get variant() {\n return this.getAttribute('variant');\n }\n\n get mode() {\n return this.getAttribute('mode');\n }\n\n // the form value read by the flow SDK (#getFormData reads `.value`)\n get value() {\n return this.#action;\n }\n\n // a boolean attribute is \"on\" when present and not explicitly \"false\"\n #boolAttr(name) {\n return this.hasAttribute(name) && this.getAttribute(name) !== 'false';\n }\n\n get isRequired() {\n return this.#boolAttr('required');\n }\n\n get isReadOnly() {\n return this.#boolAttr('readonly');\n }\n\n get errorMessage() {\n return (\n this.getAttribute('data-errormessage-value-missing') ||\n DEFAULT_ERROR_MESSAGE\n );\n }\n\n get codesText() {\n return String((this.data || []).map((rc) => rc.value).join('\\n'));\n }\n\n init() {\n super.init();\n\n this.copyIcon.addEventListener('click', this.onCopy.bind(this));\n this.downloadIcon.addEventListener('click', this.onDownload.bind(this));\n\n forwardAttrs(this, this.iconWrapper, { includeAttrs: ['variant', 'mode'] });\n\n this.renderButtons();\n this.#initialized = true;\n }\n\n get isDownloadEnabled() {\n return this.getAttribute('show-download') === 'true';\n }\n\n // buttons variant: copy (+ download when enabled) as descope-buttons, each independently\n // configurable. rendered even in the icons variant (CSS hides the row) so a variant switch is instant.\n renderButtons() {\n if (!this.buttonsRow) return;\n\n const buttons = [this.buildButton('copy')];\n if (this.isDownloadEnabled) {\n buttons.push(this.buildButton('download'));\n }\n this.buttonsRow.replaceChildren(...buttons);\n }\n\n buildButton(action) {\n const { defaultText } = ACTIONS[action];\n const attr = (name, fallback) =>\n this.getAttribute(`${action}-${name}`) || fallback;\n\n const button = document.createElement('descope-button');\n button.setAttribute('data-action', action);\n button.setAttribute('variant', attr('variant', 'outline'));\n button.setAttribute('mode', attr('color', 'primary'));\n button.setAttribute('size', attr('size', 'md'));\n\n // icon is an image src - the seeded glyph or a custom upload (light/dark),\n // same as the standard button's start icon. rendered via descope-icon in the\n // default slot (not slot=\"prefix\") so it centers with the label when the\n // button grows. descope-icon inlines SVGs, so the glyph (authored with\n // fill=\"currentColor\") tracks the button text color while an uploaded image\n // keeps its own colors.\n const iconSrc = this.getAttribute(`${action}-icon`);\n if (iconSrc) {\n const icon = document.createElement('descope-icon');\n icon.setAttribute('src', iconSrc);\n const iconDark = this.getAttribute(`${action}-icon-dark`);\n if (iconDark) icon.setAttribute('src-dark', iconDark);\n button.appendChild(icon);\n }\n\n button.appendChild(document.createTextNode(attr('text', defaultText)));\n button.addEventListener('click', () =>\n action === 'copy' ? this.onCopy() : this.onDownload(),\n );\n return button;\n }\n\n onCopy() {\n if (this.isReadOnly) return;\n navigator.clipboard.writeText(this.codesText);\n this.showActionFeedback(this.copyIcon, 'Copied');\n this.recordAction('copied');\n }\n\n onDownload() {\n if (this.isReadOnly) return;\n const blob = new Blob([this.codesText], { type: 'text/plain' });\n const url = URL.createObjectURL(blob);\n const anchor = document.createElement('a');\n anchor.href = url;\n anchor.download = 'recovery-codes.txt';\n anchor.click();\n URL.revokeObjectURL(url);\n\n this.showActionFeedback(this.downloadIcon, 'Downloaded');\n this.recordAction('downloaded');\n }\n\n // copy/download share this - only the visual feedback differs by variant\n recordAction(action) {\n this.#action = action;\n // let the flow re-evaluate real-time conditions and pick up the new value\n this.dispatchEvent(new Event('change', { bubbles: true }));\n // acting clears the mandatory error\n if (this.checkValidity()) {\n this.#showError = false;\n }\n this.syncValidityUI();\n }\n\n // icons variant: swap the icon to a checkmark for 5s (buttons variant is static)\n showActionFeedback(iconEle, doneTitle) {\n // on a rapid re-click the checkmark is already showing, so cancel the pending restore\n // and keep the glyph/title we saved the first time (never capture the checkmark itself)\n if (iconEle.feedbackTimer) {\n clearTimeout(iconEle.feedbackTimer);\n } else {\n iconEle.originalIcon = iconEle.getAttribute('icon');\n iconEle.originalTitle = iconEle.getAttribute('title');\n }\n\n iconEle.setAttribute('icon', 'vaadin:check-circle-o');\n iconEle.setAttribute('title', doneTitle);\n iconEle.classList.add('copied');\n\n iconEle.feedbackTimer = setTimeout(() => {\n iconEle.setAttribute('icon', iconEle.originalIcon);\n iconEle.setAttribute('title', iconEle.originalTitle);\n iconEle.classList.remove('copied');\n iconEle.feedbackTimer = null;\n }, 5000);\n }\n\n // the flow SDK's #validateInputs calls checkValidity/reportValidity on every *[name]\n checkValidity() {\n return this.isReadOnly || !this.isRequired || this.value !== NO_ACTION;\n }\n\n reportValidity() {\n const valid = this.checkValidity();\n this.#showError = !valid;\n this.syncValidityUI();\n return valid;\n }\n\n // single source of truth for the error UI - reflects `invalid` (theme `_invalid`\n // draws the outline) and fills the message. never toggled anywhere else.\n syncValidityUI() {\n this.toggleAttribute('invalid', this.#showError);\n if (this.errorMessageEle) {\n this.errorMessageEle.textContent = this.#showError\n ? this.errorMessage\n : '';\n }\n }\n\n attributeChangedCallback(attrName, oldValue, newValue) {\n super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n if (newValue === oldValue) return;\n\n // if it stops being required, drop any error already shown\n if (attrName === 'required' && !this.isRequired) {\n this.#showError = false;\n this.syncValidityUI();\n }\n\n // only rebuild for live edits after init (init already built once with all attrs);\n // avoids rebuilding once per attribute during the initial element upgrade\n if (this.#initialized && BUTTON_ATTRS.includes(attrName)) {\n this.renderButtons();\n }\n }\n}\n\nexport const RecoveryCodesClass = compose(\n createStyleMixin({\n mappings: {\n hostWidth: { selector: () => ':host', property: 'width' },\n hostMinWidth: { selector: () => ':host', property: 'min-width' },\n hostDirection: [\n { selector: () => ':host', property: 'direction' },\n {\n selector: () => TextClass.componentName,\n property: TextClass.cssVarList.hostDirection,\n },\n ],\n textAlign: { selector: () => '.list', property: 'align-items' },\n iconColor: { selector: () => 'vaadin-icon', property: 'color' },\n iconSize: { selector: () => 'vaadin-icon', property: 'font-size' },\n iconGap: { selector: () => '.codes-box', property: 'gap' },\n iconStackGap: { selector: () => '.icons', property: 'gap' },\n buttonsGap: { selector: () => '.buttons-row', property: 'gap' },\n sectionsGap: { selector: () => '.wrapper', property: 'gap' },\n bulletGap: { selector: () => 'descope-text span', property: 'gap' },\n // top + bottom padding sit inside the border (below the codes) in both variants; in the\n // buttons variant the bottom padding also repeats below the buttons (the buttons-row entry\n // is inert in the icons variant, where the row is display:none).\n verticalPadding: [\n { selector: () => '.codes-box', property: 'padding-top' },\n { selector: () => '.codes-box', property: 'padding-bottom' },\n { selector: () => '.buttons-row', property: 'padding-bottom' },\n ],\n // horizontal padding insets the codes (inside the border) and the buttons, but NOT the\n // error message, which stays aligned to the component edge (like the input error).\n horizontalPadding: [\n { selector: () => '.codes-box', property: 'padding-left' },\n { selector: () => '.codes-box', property: 'padding-right' },\n { selector: () => '.buttons-row', property: 'padding-left' },\n { selector: () => '.buttons-row', property: 'padding-right' },\n ],\n errorBorderColor: {\n selector: () => '.codes-box',\n property: 'border-color',\n },\n errorMessageColor: {\n selector: () => '.error-message',\n property: 'color',\n },\n errorMessageFontSize: {\n selector: () => '.error-message',\n property: 'font-size',\n },\n errorMessageFontWeight: {\n selector: () => '.error-message',\n property: 'font-weight',\n },\n errorMessageFontFamily: {\n selector: () => '.error-message',\n property: 'font-family',\n },\n boxBorderRadius: {\n selector: () => '.codes-box',\n property: 'border-radius',\n },\n errorBorderWidth: {\n selector: () => '.codes-box',\n property: 'border-width',\n },\n boxBorderStyle: {\n selector: () => '.codes-box',\n property: 'border-style',\n },\n },\n }),\n // also inject the shared input-wrapper theme onto our host (like the input components do),\n // so the error message + border track the console \"customize inputs\" tokens\n createStyleMixin({\n componentNameOverride: getComponentName('input-wrapper'),\n }),\n createDynamicDataMixin({\n itemRenderer,\n rerenderAttrsList: ['variant', 'mode'],\n targetSelector: '.list',\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(RawRecoveryCodes);\n","import '@descope-ui/descope-text';\nimport '@descope-ui/descope-button';\nimport '@descope-ui/descope-icon';\nimport '@vaadin/icons';\nimport '@vaadin/icon';\n\nimport { componentName, RecoveryCodesClass } from './RecoveryCodesClass';\n\ncustomElements.define(componentName, RecoveryCodesClass);\n\nexport { RecoveryCodesClass, componentName };\n","import {\n createStyleMixin,\n draggableMixin,\n componentNameValidationMixin,\n stretchMixin,\n} from '@descope-ui/common/components-mixins';\nimport { compose } from '@descope-ui/common/utils';\nimport {\n getComponentName,\n injectStyle,\n observeChildren,\n} from '@descope-ui/common/components-helpers';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\n\nexport const componentName = getComponentName('text');\n\nclass RawText extends createBaseClass({\n componentName,\n baseSelector: ':host > slot',\n}) {\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\n <slot part=\"text-wrapper\"></slot>\n `;\n\n injectStyle(\n `\n :host {\n display: inline-block;\n line-height: 1em;\n }\n :host > slot {\n width: 100%;\n display: inline-block;\n }\n `,\n this,\n );\n }\n\n get hideWhenEmpty() {\n return this.getAttribute('hide-when-empty') === 'true';\n }\n\n init() {\n super.init();\n\n observeChildren(this, () => {\n const hasChildren = !!this.childNodes.length;\n this.style.display = !hasChildren && this.hideWhenEmpty ? 'none' : '';\n });\n }\n}\n\nconst { host } = {\n host: { selector: () => ':host' },\n};\n\nexport const TextClass = compose(\n createStyleMixin({\n mappings: {\n hostWidth: { ...host, property: 'width' },\n hostDirection: { ...host, property: 'direction' },\n fontSize: {},\n textColor: [{ property: 'color' }],\n textLineHeight: { property: 'line-height' },\n textLetterSpacing: { property: 'letter-spacing' },\n textShadow: {},\n textAlign: {},\n textTransform: {},\n fontFamily: {},\n fontStyle: {},\n fontWeight: {},\n borderWidth: {},\n borderStyle: {},\n borderColor: {},\n },\n }),\n stretchMixin({ triggers: [{ attr: 'full-width', value: 'true' }] }),\n draggableMixin,\n componentNameValidationMixin,\n)(RawText);\n","import { componentName, TextClass } from './TextClass';\n\ncustomElements.define(componentName, TextClass);\n\nexport { TextClass, componentName };\n"],"names":["componentName","_descope_ui_common_components_helpers__WEBPACK_IMPORTED_MODULE_1__","xE","host","label","slottedIcon","selector","loadingIndicatorStyles","ButtonClass","_descope_ui_common_utils__WEBPACK_IMPORTED_MODULE_0__","Zz","_descope_ui_common_components_mixins__WEBPACK_IMPORTED_MODULE_2__","DM","triggers","attr","value","RF","mappings","hostWidth","property","hostMaxWidth","hostHeight","hostDirection","fontSize","fontFamily","fontWeight","cursor","backgroundColor","outlineOffset","outlineColor","outlineStyle","outlineWidth","borderRadius","borderColor","borderStyle","borderWidth","verticalPadding","horizontalPadding","fallback","labelTextColor","iconColor","_descope_ui_descope_icon_class__WEBPACK_IMPORTED_MODULE_3__","S","cssVarList","fill","labelTextDecoration","labelSpacing","textAlign","iconSize","_clickableMixin__WEBPACK_IMPORTED_MODULE_4__","G","VO","tQ","tz","slots","wrappedEleName","style","excludeAttrsSync","color","clickableMixin","superclass","isLoading","this","getAttribute","click","super","customElements","define","_ButtonClass__WEBPACK_IMPORTED_MODULE_0__","T","J","IconClass","_descope_ui_common_utils__WEBPACK_IMPORTED_MODULE_3__","_descope_ui_common_components_mixins__WEBPACK_IMPORTED_MODULE_0__","_descope_ui_descope_image_class__WEBPACK_IMPORTED_MODULE_2__","q","height","width","_IconClass__WEBPACK_IMPORTED_MODULE_1__","_descope_ui_common_components_helpers__WEBPACK_IMPORTED_MODULE_3__","srcAttrs","RawImage","_descope_ui_common_base_classes__WEBPACK_IMPORTED_MODULE_1__","qu","baseSelector","observedAttributes","constructor","attachShadow","mode","innerHTML","fz","init","toggleVisibility","getSrc","onThemeChange","renderImage","isVisible","classList","remove","add","altText","legacySrc","themeSrc","currentThemeName","updateFillColor","node","querySelectorAll","forEach","ele","setAttribute","ImageClass","_helpers__WEBPACK_IMPORTED_MODULE_4__","m","then","res","appendChild","shouldRender","src","srcVal","attributeChangedCallback","attrName","oldValue","newValue","_descope_ui_common_utils__WEBPACK_IMPORTED_MODULE_2__","createSvgEle","text","clean","dompurify__WEBPACK_IMPORTED_MODULE_0__","A","sanitize","USE_PROFILES","svg","svgFilters","ADD_TAGS","FORBID_TAGS","DOMParser","parseFromString","querySelector","createImage","async","startsWith","isBase64Svg","svgXml","atob","slice","base64Prefix","path","match","getFileExtension","fetchedSrc","fetch","document","createElement","createImgEle","setProperty","_ImageClass__WEBPACK_IMPORTED_MODULE_0__","componentsHelpers","NO_ACTION","ACTIONS","copy","defaultText","download","BUTTON_SUFFIXES","BUTTON_ATTRS","Object","keys","flatMap","action","map","suffix","RawRecoveryCodes","baseClasses","showError","initialized","list","shadowRoot","copyIcon","downloadIcon","iconWrapper","errorMessageEle","buttonsRow","variant","boolAttr","name","hasAttribute","isRequired","isReadOnly","errorMessage","codesText","String","data","rc","join","addEventListener","onCopy","bind","onDownload","EA","includeAttrs","renderButtons","isDownloadEnabled","buttons","buildButton","push","replaceChildren","button","iconSrc","icon","iconDark","createTextNode","navigator","clipboard","writeText","showActionFeedback","recordAction","blob","Blob","type","url","URL","createObjectURL","anchor","href","revokeObjectURL","dispatchEvent","Event","bubbles","checkValidity","syncValidityUI","iconEle","doneTitle","feedbackTimer","clearTimeout","originalIcon","originalTitle","setTimeout","reportValidity","valid","toggleAttribute","textContent","includes","RecoveryCodesClass","utils","componentsMixins","hostMinWidth","TextClass","s","iconGap","iconStackGap","buttonsGap","sectionsGap","bulletGap","errorBorderColor","errorMessageColor","errorMessageFontSize","errorMessageFontWeight","errorMessageFontFamily","boxBorderRadius","errorBorderWidth","boxBorderStyle","componentNameOverride","t$","itemRenderer","_","ref","rerenderAttrsList","targetSelector","_descope_ui_common_components_helpers__WEBPACK_IMPORTED_MODULE_2__","RawText","_descope_ui_common_base_classes__WEBPACK_IMPORTED_MODULE_3__","hideWhenEmpty","Ge","hasChildren","childNodes","length","display","_descope_ui_common_utils__WEBPACK_IMPORTED_MODULE_1__","textColor","textLineHeight","textLetterSpacing","textShadow","textTransform","fontStyle","_TextClass__WEBPACK_IMPORTED_MODULE_0__"],"sourceRoot":""}
1
+ {"version":3,"file":"descope-recovery-codes.js","mappings":"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","sources":["webpack://@descope/web-components-ui/../components/descope-button/src/component/ButtonClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/clickableMixin.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-icon/src/component/IconClass.js","webpack://@descope/web-components-ui/../components/descope-icon/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/ImageClass.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/helpers.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-recovery-codes/src/component/RecoveryCodesClass.js","webpack://@descope/web-components-ui/../components/descope-recovery-codes/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-text/src/component/TextClass.js","webpack://@descope/web-components-ui/../components/descope-text/src/component/index.js"],"sourcesContent":["import { compose } from '@descope-ui/common/utils';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport {\n createStyleMixin,\n draggableMixin,\n createProxy,\n componentNameValidationMixin,\n stretchMixin,\n} from '@descope-ui/common/components-mixins';\nimport { IconClass } from '@descope-ui/descope-icon/class';\nimport { clickableMixin } from './clickableMixin';\n\nexport const componentName = getComponentName('button');\n\nconst resetStyles = `\n\t:host {\n\t\tdisplay: inline-block;\n\t\tbox-sizing: border-box;\n\t}\n\tvaadin-button::before,\n\tvaadin-button::after {\n\t\topacity: 0;\n\t}\n\tvaadin-button {\n\t\tmargin: 0;\n\t\tmin-width: 0;\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tbox-shadow: none;\n\t}\n\tvaadin-button::part(label) {\n\t\tpadding: 0;\n width: 100%;\n\t}\n\tvaadin-button::part(prefix) {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n`;\n\nconst iconStyles = `\n\tvaadin-button::part(prefix),\n\tvaadin-button::part(label) {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n`;\n\nconst editorOverrides = `vaadin-button::part(label) { pointer-events: none; }`;\n\nconst { host, label, slottedIcon } = {\n host: { selector: () => ':host' },\n label: { selector: '::part(label)' },\n slottedIcon: { selector: () => '::slotted(descope-icon)' },\n};\n\nlet loadingIndicatorStyles;\n\nexport const ButtonClass = compose(\n stretchMixin({ triggers: [{ attr: 'full-width', value: 'true' }] }),\n createStyleMixin({\n mappings: {\n hostWidth: { property: 'width' },\n hostMaxWidth: { ...host, property: 'max-width' },\n hostHeight: { property: 'height' },\n hostDirection: { ...host, property: 'direction' },\n fontSize: {},\n fontFamily: {},\n fontWeight: {},\n\n cursor: {},\n backgroundColor: {},\n\n outlineOffset: {},\n outlineColor: {},\n outlineStyle: {},\n outlineWidth: {},\n\n borderRadius: {},\n borderColor: {},\n borderStyle: {},\n borderWidth: {},\n\n verticalPadding: [\n { property: 'padding-top' },\n { property: 'padding-bottom' },\n ],\n horizontalPadding: [\n { property: 'padding-right', fallback: '0.875em' },\n { property: 'padding-left', fallback: '0.875em' },\n ],\n\n labelTextColor: { property: 'color' },\n iconColor: {\n selector: () => `::slotted(*)`,\n property: IconClass.cssVarList.fill,\n },\n labelTextDecoration: { ...label, property: 'text-decoration' },\n labelSpacing: { ...label, property: 'gap' },\n textAlign: { ...label, property: 'justify-content', fallback: 'center' },\n\n iconSize: [\n { ...slottedIcon, property: 'width' },\n { ...slottedIcon, property: 'height' },\n ],\n },\n }),\n clickableMixin,\n draggableMixin,\n componentNameValidationMixin,\n)(\n createProxy({\n slots: ['', 'prefix', 'label', 'suffix'],\n wrappedEleName: 'vaadin-button',\n style: () => `\n\t\t\t${resetStyles}\n\t\t\t${iconStyles}\n\t\t\t${loadingIndicatorStyles}\n\t\t\t${editorOverrides}\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${ButtonClass.cssVarList.outlineWidth}) + var(${ButtonClass.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width=\"true\"]) {\n width: var(${ButtonClass.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${ButtonClass.cssVarList.hostHeight}) - var(${ButtonClass.cssVarList.outlineWidth}) - var(${ButtonClass.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square=\"true\"]:not([full-width=\"true\"]) {\n\t\t\t\twidth: calc(var(${ButtonClass.cssVarList.hostWidth}) - var(${ButtonClass.cssVarList.outlineWidth}) - var(${ButtonClass.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,\n excludeAttrsSync: ['tabindex', 'class', 'style'],\n componentName,\n }),\n);\n\nconst { color, fontSize } = ButtonClass.cssVarList;\nloadingIndicatorStyles = `\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading=\"true\"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${color});\n\t\ttop: calc(50% - (var(${fontSize}) / 2));\n\t\tleft: calc(50% - (var(${fontSize}) / 2));\n\t\tborder-width: calc(var(${fontSize}) / 10);\n\t\twidth: var(${fontSize});\n\t\theight: var(${fontSize});\n\t}\n\t:host([disabled=\"true\"]),\n\t:host([loading=\"true\"]) {\n\t\tpointer-events: none;\n\t}\n\t:host([loading=\"true\"]) ::part(prefix),\n\t:host([loading=\"true\"]) ::part(label) {\n\t\tvisibility: hidden;\n\t}\n`;\n","export const clickableMixin = (superclass) =>\n class ClickableMixinClass extends superclass {\n get isLoading() {\n return this.getAttribute('loading') === 'true';\n }\n\n click() {\n this.isLoading || super.click();\n }\n };\n","import { componentName, ButtonClass } from './ButtonClass';\nimport '@vaadin/button';\n\ncustomElements.define(componentName, ButtonClass);\n\nexport { ButtonClass, componentName };\n","import {\n componentNameValidationMixin,\n createProxy,\n createStyleMixin,\n draggableMixin,\n} from '@descope-ui/common/components-mixins';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport { ImageClass } from '@descope-ui/descope-image/class';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('icon');\n\nexport const IconClass = compose(\n createStyleMixin({\n mappings: {\n fill: [{}, { property: ImageClass.cssVarList.fill }],\n height: { selector: () => ':host' },\n width: { selector: () => ':host' },\n },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(\n createProxy({\n slots: [],\n wrappedEleName: 'descope-image',\n style: () => `\n :host {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n max-height: 100%;\n }\n `,\n excludeAttrsSync: ['tabindex', 'class', 'style', 'st-height', 'st-width'],\n componentName,\n }),\n);\n","import '@descope-ui/descope-image';\n\nimport { componentName, IconClass } from './IconClass';\n\ncustomElements.define(componentName, IconClass);\n\nexport { IconClass, componentName };\n"," \nimport {\n createStyleMixin,\n draggableMixin,\n componentNameValidationMixin,\n} from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport { compose } from '@descope-ui/common/utils';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport { createImage } from './helpers';\nimport { injectStyle } from '@descope-ui/common/components-helpers';\n\nexport const componentName = getComponentName('image');\n\nconst srcAttrs = ['src', 'src-dark'];\n\nclass RawImage extends createBaseClass({\n componentName,\n baseSelector: 'slot',\n}) {\n static get observedAttributes() {\n return srcAttrs;\n }\n\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\n\t\t<slot></slot>\n\t`;\n\n injectStyle(\n `\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n :host > slot {\n width: 100%;\n height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n ::slotted(*) {\n width: 100%;\n\t\t\t}\n\n .hidden {\n display: none;\n }\n `,\n this,\n );\n }\n\n init() {\n super.init?.();\n this.toggleVisibility(this.getSrc);\n }\n\n onThemeChange() {\n this.renderImage();\n }\n\n toggleVisibility(isVisible) {\n if (isVisible) {\n this.classList.remove('hidden');\n } else {\n this.classList.add('hidden');\n }\n }\n\n get altText() {\n return this.getAttribute('alt') || '';\n }\n\n get legacySrc() {\n return this.getAttribute('src');\n }\n\n get themeSrc() {\n return this.getAttribute(`src-${this.currentThemeName}`);\n }\n\n get getSrc() {\n return this.themeSrc || this.legacySrc;\n }\n\n // in order to fill an SVG with `currentColor` override all of its `fill` and `path` nodes\n // with the value from the `st-fill` attribute\n \n updateFillColor(node) {\n // set fill to root node and all its relevant selectors\n const elementsToReplace = [node, ...node.querySelectorAll('*[fill]')];\n\n elementsToReplace.forEach((ele) => {\n ele.setAttribute(\n 'fill',\n `var(${ImageClass.cssVarList.fill}, ${ele.getAttribute('fill') || \"''\"})`,\n );\n });\n }\n\n renderImage() {\n this.toggleVisibility(this.getSrc);\n\n createImage(this.getSrc, this.altText).then((res) => {\n this.innerHTML = '';\n if (res) {\n this.updateFillColor(res);\n this.appendChild(res);\n }\n });\n }\n\n // render only when src attribute matches current theme\n shouldRender(src) {\n const srcVal = this.getAttribute(src);\n return this.getSrc === srcVal;\n }\n\n attributeChangedCallback(attrName, oldValue, newValue) {\n super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n if (oldValue === newValue) return;\n\n if (this.shouldRender(attrName)) {\n this.renderImage();\n }\n }\n}\n\nexport const ImageClass = compose(\n createStyleMixin({\n mappings: {\n fill: {},\n height: { selector: () => ':host' },\n width: { selector: () => ':host' },\n },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(RawImage);\n","import DOMPurify from 'dompurify';\n\nconst getFileExtension = (path) => {\n const match = path.match(/\\.([0-9a-z]+)(?:[\\\\?#]|$)/i);\n return match ? match[1] : null;\n};\n\nconst base64Prefix = 'data:image/svg+xml;base64,';\n\nconst isBase64Svg = (src) => src.startsWith(base64Prefix);\n\nconst createImgEle = (src, altText) => {\n const ele = document.createElement('img');\n ele.setAttribute('src', src);\n ele.setAttribute('alt', altText);\n return ele;\n};\n\nconst createSvgEle = (text) => {\n // we want to purify the SVG to avoid XSS attacks\n const clean = DOMPurify.sanitize(text, {\n USE_PROFILES: { svg: true, svgFilters: true },\n // allow image to render\n ADD_TAGS: ['image'],\n // forbid interactiviy via `use` tags (which are sanitized by default)\n FORBID_TAGS: ['defs']\n });\n\n const parser = new DOMParser();\n const ele = parser\n .parseFromString(clean, 'image/svg+xml')\n .querySelector('svg');\n return ele;\n};\n\nexport const createImage = async (src, altText) => {\n try {\n let ele;\n if (isBase64Svg(src)) {\n // handle base64 source\n const svgXml = atob(src.slice(base64Prefix.length));\n ele = createSvgEle(svgXml);\n } else if (getFileExtension(src) === 'svg') {\n // handle urls\n const fetchedSrc = await fetch(src);\n const text = await fetchedSrc.text();\n ele = createSvgEle(text);\n } else {\n // handle binary\n ele = createImgEle(src, altText);\n }\n\n ele.style.setProperty('max-width', '100%');\n ele.style.setProperty('max-height', '100%');\n\n return ele;\n } catch {\n return null;\n }\n};\n","import { componentName, ImageClass } from './ImageClass';\n\ncustomElements.define(componentName, ImageClass);\n\nexport { ImageClass, componentName };\n","import {\n createStyleMixin,\n draggableMixin,\n componentNameValidationMixin,\n createDynamicDataMixin,\n} from '@descope-ui/common/components-mixins';\nimport { compose } from '@descope-ui/common/utils';\nimport {\n forwardAttrs,\n getComponentName,\n injectStyle,\n} from '@descope-ui/common/components-helpers';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport { TextClass } from '@descope-ui/descope-text/class';\n\nexport const componentName = getComponentName('recovery-codes');\n\nconst NO_ACTION = 'none';\nconst DEFAULT_ERROR_MESSAGE =\n 'Copy or download your recovery codes to continue.';\n\n// default button label per action (buttons variant). the icons variant uses the vaadin\n// glyphs hardcoded in the shadow-DOM template below; the buttons variant uses image srcs.\nconst ACTIONS = {\n copy: { defaultText: 'Copy' },\n download: { defaultText: 'Download' },\n};\n\n// per-button config suffixes; the full attribute is `${action}-${suffix}`.\n// `icon`/`icon-dark` are image srcs (the seeded glyph or a custom upload), matching\n// the standard button's start-icon (light/dark), not a boolean.\nconst BUTTON_SUFFIXES = [\n 'text',\n 'variant',\n 'color',\n 'size',\n 'icon',\n 'icon-dark',\n];\n\n// changing any of these rebuilds the buttons (so the editor preview stays live)\nconst BUTTON_ATTRS = [\n 'show-download',\n ...Object.keys(ACTIONS).flatMap((action) =>\n BUTTON_SUFFIXES.map((suffix) => `${action}-${suffix}`),\n ),\n];\n\nconst itemRenderer = ({ value }, _, ref) => {\n return `\n <descope-text variant=\"${ref.variant}\" mode=\"${ref.mode}\">\n <span>${value}</span>\n </descope-text>\n `;\n};\n\nclass RawRecoveryCodes extends createBaseClass({\n componentName,\n baseSelector: ':host > div',\n}) {\n static get observedAttributes() {\n return ['readonly', 'required', ...BUTTON_ATTRS];\n }\n\n // 'none' | 'copied' | 'downloaded' - the last action the user took on the codes\n #action = NO_ACTION;\n\n // the error is shown only after a submit attempt (reportValidity), like inputs\n #showError = false;\n\n // init() builds the buttons once with all seeded attrs; guards against rebuilding\n // on every per-attribute change fired during element upgrade (before init runs)\n #initialized = false;\n\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\n <div class=\"wrapper\">\n <div class=\"codes-box\">\n <div class=\"list\"></div>\n <descope-text class=\"icon-wrapper\">\n <div class=\"icons\">\n <vaadin-icon class=\"icon copy-icon\" icon=\"vaadin:copy-o\" title=\"Copy\"></vaadin-icon>\n <vaadin-icon class=\"icon download-icon\" icon=\"vaadin:download-alt\" title=\"Download\"></vaadin-icon>\n </div>\n </descope-text>\n </div>\n <div class=\"error-message\"></div>\n <div class=\"buttons-row\"></div>\n </div>\n `;\n\n this.list = this.shadowRoot.querySelector('.list');\n this.copyIcon = this.shadowRoot.querySelector('.copy-icon');\n this.downloadIcon = this.shadowRoot.querySelector('.download-icon');\n this.iconWrapper = this.shadowRoot.querySelector('.icon-wrapper');\n this.errorMessageEle = this.shadowRoot.querySelector('.error-message');\n this.buttonsRow = this.shadowRoot.querySelector('.buttons-row');\n\n injectStyle(\n `\n :host {\n display: inline-block;\n position: relative;\n }\n .wrapper {\n display: flex;\n flex-direction: column;\n }\n .codes-box {\n display: flex;\n justify-content: space-between;\n box-sizing: border-box;\n /* border shows the error ring inside the box; style/width/color/radius come from theme */\n }\n .list {\n display: flex;\n flex-grow: 1;\n flex-direction: column;\n }\n descope-text span {\n display: inline-flex;\n align-items: center;\n width: fit-content;\n }\n descope-text span::before {\n content: '\\\\02022';\n transform: translateY(-0.06em);\n }\n .icon-wrapper {\n align-self: flex-start;\n }\n .icons {\n display: flex;\n flex-direction: column;\n }\n .icon {\n cursor: pointer;\n }\n .icon.copied {\n cursor: initial;\n /* block re-clicks while the checkmark shows, so rapid clicks cannot repeat the action */\n pointer-events: none;\n }\n /* readonly is a host attribute, so disable pointer events from one place */\n :host([readonly=\"true\"]) .icon,\n :host([readonly=\"true\"]) .buttons-row {\n pointer-events: none;\n }\n .download-icon {\n display: none;\n }\n :host([show-download=\"true\"]) .download-icon {\n display: inline-flex;\n }\n .error-message {\n display: none;\n /* width:0 + min-width:100% lets the message wrap to the component width without\n its text expanding the (shrink-to-fit) component; full-width still fills the parent */\n width: 0;\n min-width: 100%;\n box-sizing: border-box;\n line-height: 1.2;\n overflow-wrap: break-word;\n }\n :host([invalid]) .error-message {\n display: block;\n }\n .buttons-row {\n display: none;\n }\n :host([display-variant=\"buttons\"]) .icon-wrapper {\n display: none;\n }\n :host([display-variant=\"buttons\"]) .buttons-row {\n display: flex;\n flex-wrap: wrap;\n }\n /* grow to fill equally; don't shrink below content, so they wrap to a new line\n when they don't fit (like a container with auto-fit items) */\n .buttons-row > descope-button {\n flex: 1 0 auto;\n }\n `,\n this,\n );\n }\n\n get variant() {\n return this.getAttribute('variant');\n }\n\n get mode() {\n return this.getAttribute('mode');\n }\n\n // the form value read by the flow SDK (#getFormData reads `.value`)\n get value() {\n return this.#action;\n }\n\n // a boolean attribute is \"on\" when present and not explicitly \"false\"\n #boolAttr(name) {\n return this.hasAttribute(name) && this.getAttribute(name) !== 'false';\n }\n\n get isRequired() {\n return this.#boolAttr('required');\n }\n\n get isReadOnly() {\n return this.#boolAttr('readonly');\n }\n\n get errorMessage() {\n return (\n this.getAttribute('data-errormessage-value-missing') ||\n DEFAULT_ERROR_MESSAGE\n );\n }\n\n get codesText() {\n return String((this.data || []).map((rc) => rc.value).join('\\n'));\n }\n\n init() {\n super.init();\n\n this.copyIcon.addEventListener('click', this.onCopy.bind(this));\n this.downloadIcon.addEventListener('click', this.onDownload.bind(this));\n\n forwardAttrs(this, this.iconWrapper, { includeAttrs: ['variant', 'mode'] });\n\n this.renderButtons();\n this.#initialized = true;\n }\n\n get isDownloadEnabled() {\n return this.getAttribute('show-download') === 'true';\n }\n\n // buttons variant: copy (+ download when enabled) as descope-buttons, each independently\n // configurable. rendered even in the icons variant (CSS hides the row) so a variant switch is instant.\n renderButtons() {\n if (!this.buttonsRow) return;\n\n const buttons = [this.buildButton('copy')];\n if (this.isDownloadEnabled) {\n buttons.push(this.buildButton('download'));\n }\n this.buttonsRow.replaceChildren(...buttons);\n }\n\n buildButton(action) {\n const { defaultText } = ACTIONS[action];\n const attr = (name, fallback) =>\n this.getAttribute(`${action}-${name}`) || fallback;\n\n const button = document.createElement('descope-button');\n button.setAttribute('data-action', action);\n button.setAttribute('variant', attr('variant', 'outline'));\n button.setAttribute('mode', attr('color', 'primary'));\n button.setAttribute('size', attr('size', 'md'));\n\n // icon is an image src - the seeded glyph or a custom upload (light/dark),\n // same as the standard button's start icon. rendered via descope-icon in the\n // default slot (not slot=\"prefix\") so it centers with the label when the\n // button grows. descope-icon inlines SVGs, so the glyph (authored with\n // fill=\"currentColor\") tracks the button text color while an uploaded image\n // keeps its own colors.\n const iconSrc = this.getAttribute(`${action}-icon`);\n if (iconSrc) {\n const icon = document.createElement('descope-icon');\n icon.setAttribute('src', iconSrc);\n const iconDark = this.getAttribute(`${action}-icon-dark`);\n if (iconDark) icon.setAttribute('src-dark', iconDark);\n button.appendChild(icon);\n }\n\n button.appendChild(document.createTextNode(attr('text', defaultText)));\n button.addEventListener('click', () =>\n action === 'copy' ? this.onCopy() : this.onDownload(),\n );\n return button;\n }\n\n onCopy() {\n if (this.isReadOnly) return;\n navigator.clipboard.writeText(this.codesText);\n this.showActionFeedback(this.copyIcon, 'Copied');\n this.recordAction('copied');\n }\n\n onDownload() {\n if (this.isReadOnly) return;\n const blob = new Blob([this.codesText], { type: 'text/plain' });\n const url = URL.createObjectURL(blob);\n const anchor = document.createElement('a');\n anchor.href = url;\n anchor.download = 'recovery-codes.txt';\n anchor.click();\n URL.revokeObjectURL(url);\n\n this.showActionFeedback(this.downloadIcon, 'Downloaded');\n this.recordAction('downloaded');\n }\n\n // copy/download share this - only the visual feedback differs by variant\n recordAction(action) {\n this.#action = action;\n // let the flow re-evaluate real-time conditions and pick up the new value\n this.dispatchEvent(new Event('change', { bubbles: true }));\n // acting clears the mandatory error\n if (this.checkValidity()) {\n this.#showError = false;\n }\n this.syncValidityUI();\n }\n\n // icons variant: swap the icon to a checkmark for 5s (buttons variant is static)\n showActionFeedback(iconEle, doneTitle) {\n // on a rapid re-click the checkmark is already showing, so cancel the pending restore\n // and keep the glyph/title we saved the first time (never capture the checkmark itself)\n if (iconEle.feedbackTimer) {\n clearTimeout(iconEle.feedbackTimer);\n } else {\n iconEle.originalIcon = iconEle.getAttribute('icon');\n iconEle.originalTitle = iconEle.getAttribute('title');\n }\n\n iconEle.setAttribute('icon', 'vaadin:check-circle-o');\n iconEle.setAttribute('title', doneTitle);\n iconEle.classList.add('copied');\n\n iconEle.feedbackTimer = setTimeout(() => {\n iconEle.setAttribute('icon', iconEle.originalIcon);\n iconEle.setAttribute('title', iconEle.originalTitle);\n iconEle.classList.remove('copied');\n iconEle.feedbackTimer = null;\n }, 5000);\n }\n\n // the flow SDK's #validateInputs calls checkValidity/reportValidity on every *[name]\n checkValidity() {\n return this.isReadOnly || !this.isRequired || this.value !== NO_ACTION;\n }\n\n reportValidity() {\n const valid = this.checkValidity();\n this.#showError = !valid;\n this.syncValidityUI();\n return valid;\n }\n\n // single source of truth for the error UI - reflects `invalid` (theme `_invalid`\n // draws the outline) and fills the message. never toggled anywhere else.\n syncValidityUI() {\n this.toggleAttribute('invalid', this.#showError);\n if (this.errorMessageEle) {\n this.errorMessageEle.textContent = this.#showError\n ? this.errorMessage\n : '';\n }\n }\n\n attributeChangedCallback(attrName, oldValue, newValue) {\n super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n if (newValue === oldValue) return;\n\n // if it stops being required, drop any error already shown\n if (attrName === 'required' && !this.isRequired) {\n this.#showError = false;\n this.syncValidityUI();\n }\n\n // only rebuild for live edits after init (init already built once with all attrs);\n // avoids rebuilding once per attribute during the initial element upgrade\n if (this.#initialized && BUTTON_ATTRS.includes(attrName)) {\n this.renderButtons();\n }\n }\n}\n\nexport const RecoveryCodesClass = compose(\n createStyleMixin({\n mappings: {\n hostWidth: { selector: () => ':host', property: 'width' },\n hostMinWidth: { selector: () => ':host', property: 'min-width' },\n hostDirection: [\n { selector: () => ':host', property: 'direction' },\n {\n selector: () => TextClass.componentName,\n property: TextClass.cssVarList.hostDirection,\n },\n ],\n textAlign: { selector: () => '.list', property: 'align-items' },\n iconColor: { selector: () => 'vaadin-icon', property: 'color' },\n iconSize: { selector: () => 'vaadin-icon', property: 'font-size' },\n iconGap: { selector: () => '.codes-box', property: 'gap' },\n iconStackGap: { selector: () => '.icons', property: 'gap' },\n buttonsGap: { selector: () => '.buttons-row', property: 'gap' },\n sectionsGap: { selector: () => '.wrapper', property: 'gap' },\n bulletGap: { selector: () => 'descope-text span', property: 'gap' },\n // top + bottom padding sit inside the border (below the codes) in both variants; in the\n // buttons variant the bottom padding also repeats below the buttons (the buttons-row entry\n // is inert in the icons variant, where the row is display:none).\n verticalPadding: [\n { selector: () => '.codes-box', property: 'padding-top' },\n { selector: () => '.codes-box', property: 'padding-bottom' },\n { selector: () => '.buttons-row', property: 'padding-bottom' },\n ],\n // horizontal padding insets the codes (inside the border) and the buttons, but NOT the\n // error message, which stays aligned to the component edge (like the input error).\n horizontalPadding: [\n { selector: () => '.codes-box', property: 'padding-left' },\n { selector: () => '.codes-box', property: 'padding-right' },\n { selector: () => '.buttons-row', property: 'padding-left' },\n { selector: () => '.buttons-row', property: 'padding-right' },\n ],\n errorBorderColor: {\n selector: () => '.codes-box',\n property: 'border-color',\n },\n errorMessageColor: {\n selector: () => '.error-message',\n property: 'color',\n },\n errorMessageFontSize: {\n selector: () => '.error-message',\n property: 'font-size',\n },\n errorMessageFontWeight: {\n selector: () => '.error-message',\n property: 'font-weight',\n },\n errorMessageFontFamily: {\n selector: () => '.error-message',\n property: 'font-family',\n },\n boxBorderRadius: {\n selector: () => '.codes-box',\n property: 'border-radius',\n },\n errorBorderWidth: {\n selector: () => '.codes-box',\n property: 'border-width',\n },\n boxBorderStyle: {\n selector: () => '.codes-box',\n property: 'border-style',\n },\n },\n }),\n // also inject the shared input-wrapper theme onto our host (like the input components do),\n // so the error message + border track the console \"customize inputs\" tokens\n createStyleMixin({\n componentNameOverride: getComponentName('input-wrapper'),\n }),\n createDynamicDataMixin({\n itemRenderer,\n rerenderAttrsList: ['variant', 'mode'],\n targetSelector: '.list',\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(RawRecoveryCodes);\n","import '@descope-ui/descope-text';\nimport '@descope-ui/descope-button';\nimport '@descope-ui/descope-icon';\nimport '@vaadin/icons';\nimport '@vaadin/icon';\n\nimport { componentName, RecoveryCodesClass } from './RecoveryCodesClass';\n\ncustomElements.define(componentName, RecoveryCodesClass);\n\nexport { RecoveryCodesClass, componentName };\n","import {\n createStyleMixin,\n draggableMixin,\n componentNameValidationMixin,\n stretchMixin,\n} from '@descope-ui/common/components-mixins';\nimport { compose } from '@descope-ui/common/utils';\nimport {\n getComponentName,\n injectStyle,\n observeChildren,\n} from '@descope-ui/common/components-helpers';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\n\nexport const componentName = getComponentName('text');\n\nclass RawText extends createBaseClass({\n componentName,\n baseSelector: ':host > slot',\n}) {\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\n <slot part=\"text-wrapper\"></slot>\n `;\n\n injectStyle(\n `\n :host {\n display: inline-block;\n line-height: 1em;\n }\n :host > slot {\n width: 100%;\n display: inline-block;\n }\n `,\n this,\n );\n }\n\n get hideWhenEmpty() {\n return this.getAttribute('hide-when-empty') === 'true';\n }\n\n init() {\n super.init();\n\n observeChildren(this, () => {\n const hasChildren = !!this.childNodes.length;\n this.style.display = !hasChildren && this.hideWhenEmpty ? 'none' : '';\n });\n }\n}\n\nconst { host } = {\n host: { selector: () => ':host' },\n};\n\nexport const TextClass = compose(\n createStyleMixin({\n mappings: {\n hostWidth: { ...host, property: 'width' },\n hostDirection: { ...host, property: 'direction' },\n fontSize: {},\n textColor: [{ property: 'color' }],\n textLineHeight: { property: 'line-height' },\n textLetterSpacing: { property: 'letter-spacing' },\n textShadow: {},\n textAlign: {},\n textTransform: {},\n fontFamily: {},\n fontStyle: {},\n fontWeight: {},\n borderWidth: {},\n borderStyle: {},\n borderColor: {},\n },\n }),\n stretchMixin({ triggers: [{ attr: 'full-width', value: 'true' }] }),\n draggableMixin,\n componentNameValidationMixin,\n)(RawText);\n","import { componentName, TextClass } from './TextClass';\n\ncustomElements.define(componentName, TextClass);\n\nexport { TextClass, componentName };\n"],"names":["componentName","_descope_ui_common_components_helpers__WEBPACK_IMPORTED_MODULE_1__","xE","host","label","slottedIcon","selector","loadingIndicatorStyles","ButtonClass","_descope_ui_common_utils__WEBPACK_IMPORTED_MODULE_0__","Zz","_descope_ui_common_components_mixins__WEBPACK_IMPORTED_MODULE_2__","DM","triggers","attr","value","RF","mappings","hostWidth","property","hostMaxWidth","hostHeight","hostDirection","fontSize","fontFamily","fontWeight","cursor","backgroundColor","outlineOffset","outlineColor","outlineStyle","outlineWidth","borderRadius","borderColor","borderStyle","borderWidth","verticalPadding","horizontalPadding","fallback","labelTextColor","iconColor","_descope_ui_descope_icon_class__WEBPACK_IMPORTED_MODULE_3__","S","cssVarList","fill","labelTextDecoration","labelSpacing","textAlign","iconSize","_clickableMixin__WEBPACK_IMPORTED_MODULE_4__","G","VO","tQ","tz","slots","wrappedEleName","style","excludeAttrsSync","color","clickableMixin","superclass","isLoading","this","getAttribute","click","super","customElements","define","_ButtonClass__WEBPACK_IMPORTED_MODULE_0__","T","J","IconClass","_descope_ui_common_utils__WEBPACK_IMPORTED_MODULE_3__","_descope_ui_common_components_mixins__WEBPACK_IMPORTED_MODULE_0__","_descope_ui_descope_image_class__WEBPACK_IMPORTED_MODULE_2__","q","height","width","_IconClass__WEBPACK_IMPORTED_MODULE_1__","_descope_ui_common_components_helpers__WEBPACK_IMPORTED_MODULE_3__","srcAttrs","RawImage","_descope_ui_common_base_classes__WEBPACK_IMPORTED_MODULE_1__","qu","baseSelector","observedAttributes","constructor","attachShadow","mode","innerHTML","fz","init","toggleVisibility","getSrc","onThemeChange","renderImage","isVisible","classList","remove","add","altText","legacySrc","themeSrc","currentThemeName","updateFillColor","node","querySelectorAll","forEach","ele","setAttribute","ImageClass","_helpers__WEBPACK_IMPORTED_MODULE_4__","m","then","res","appendChild","shouldRender","src","srcVal","attributeChangedCallback","attrName","oldValue","newValue","_descope_ui_common_utils__WEBPACK_IMPORTED_MODULE_2__","createSvgEle","text","clean","dompurify__WEBPACK_IMPORTED_MODULE_0__","A","sanitize","USE_PROFILES","svg","svgFilters","ADD_TAGS","FORBID_TAGS","DOMParser","parseFromString","querySelector","createImage","async","startsWith","isBase64Svg","svgXml","atob","slice","base64Prefix","path","match","getFileExtension","fetchedSrc","fetch","document","createElement","createImgEle","setProperty","_ImageClass__WEBPACK_IMPORTED_MODULE_0__","componentsHelpers","NO_ACTION","ACTIONS","copy","defaultText","download","BUTTON_SUFFIXES","BUTTON_ATTRS","Object","keys","flatMap","action","map","suffix","RawRecoveryCodes","baseClasses","showError","initialized","list","shadowRoot","copyIcon","downloadIcon","iconWrapper","errorMessageEle","buttonsRow","variant","boolAttr","name","hasAttribute","isRequired","isReadOnly","errorMessage","codesText","String","data","rc","join","addEventListener","onCopy","bind","onDownload","EA","includeAttrs","renderButtons","isDownloadEnabled","buttons","buildButton","push","replaceChildren","button","iconSrc","icon","iconDark","createTextNode","navigator","clipboard","writeText","showActionFeedback","recordAction","blob","Blob","type","url","URL","createObjectURL","anchor","href","revokeObjectURL","dispatchEvent","Event","bubbles","checkValidity","syncValidityUI","iconEle","doneTitle","feedbackTimer","clearTimeout","originalIcon","originalTitle","setTimeout","reportValidity","valid","toggleAttribute","textContent","includes","RecoveryCodesClass","utils","componentsMixins","hostMinWidth","TextClass","s","iconGap","iconStackGap","buttonsGap","sectionsGap","bulletGap","errorBorderColor","errorMessageColor","errorMessageFontSize","errorMessageFontWeight","errorMessageFontFamily","boxBorderRadius","errorBorderWidth","boxBorderStyle","componentNameOverride","t$","itemRenderer","_","ref","rerenderAttrsList","targetSelector","_descope_ui_common_components_helpers__WEBPACK_IMPORTED_MODULE_2__","RawText","_descope_ui_common_base_classes__WEBPACK_IMPORTED_MODULE_3__","hideWhenEmpty","Ge","hasChildren","childNodes","length","display","_descope_ui_common_utils__WEBPACK_IMPORTED_MODULE_1__","textColor","textLineHeight","textLetterSpacing","textShadow","textTransform","fontStyle","_TextClass__WEBPACK_IMPORTED_MODULE_0__"],"sourceRoot":""}