@descope/web-components-ui 1.111.0 → 1.112.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.cjs.js +73 -19
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +73 -19
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/DescopeDev.js +1 -1
- package/dist/umd/DescopeDev.js.map +1 -1
- package/dist/umd/button-selection-group-fields-descope-button-selection-group-item-index-js.js +1 -1
- package/dist/umd/button-selection-group-fields-descope-button-selection-group-item-index-js.js.map +1 -1
- package/dist/umd/descope-button.js +1 -1
- package/dist/umd/descope-button.js.map +1 -1
- package/dist/umd/descope-date-field-descope-calendar-index-js.js +1 -1
- package/dist/umd/descope-date-field-descope-calendar-index-js.js.map +1 -1
- package/dist/umd/descope-outbound-apps.js +1 -1
- package/dist/umd/descope-outbound-apps.js.map +1 -1
- package/dist/umd/descope-timer-button.js +1 -1
- package/dist/umd/descope-timer-button.js.map +1 -1
- package/dist/umd/descope-upload-file-index-js.js +1 -1
- package/dist/umd/descope-upload-file-index-js.js.map +1 -1
- package/dist/umd/descope-user-attribute-index-js.js +1 -1
- package/dist/umd/descope-user-attribute-index-js.js.map +1 -1
- package/dist/umd/descope-user-auth-method-index-js.js +4 -4
- package/dist/umd/descope-user-auth-method-index-js.js.map +1 -1
- package/dist/umd/mapping-fields-descope-mappings-field-index-js.js +1 -1
- package/dist/umd/mapping-fields-descope-mappings-field-index-js.js.map +1 -1
- package/dist/umd/mapping-fields-descope-saml-group-mappings-index-js.js +1 -1
- package/dist/umd/mapping-fields-descope-saml-group-mappings-index-js.js.map +1 -1
- package/package.json +4 -4
- package/src/components/descope-user-auth-method/UserAuthMethodClass.js +72 -18
package/dist/umd/button-selection-group-fields-descope-button-selection-group-item-index-js.js
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
/*! For license information please see button-selection-group-fields-descope-button-selection-group-item-index-js.js.LICENSE.txt */
|
2
|
-
"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[1837,5087],{8512:(t,e,o)=>{o.d(e,{T:()=>l,q:()=>h});var r=o(88961),n=o(72270),i=o(63200),a=o(25964),s=o(18782);const l=(0,a.xE)("image"),c=["src","src-dark"];class d extends((0,n.qu)({componentName:l,baseSelector:"slot"})){static get observedAttributes(){return c}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<slot></slot>\n\t",(0,a.fz)("\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n :host > slot {\n width: 100%;\n height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n ::slotted(*) {\n width: 100%;\n\t\t\t}\n\n .hidden {\n display: none;\n }\n ",this)}init(){super.init?.(),this.toggleVisibility(this.src)}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 src(){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.src),(0,s.m)(this.src,this.altText).then((t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))}))}shouldRender(t){const e=this.getAttribute(t);return this.src===e}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),e!==o&&this.shouldRender(t)&&this.renderImage()}}const h=(0,i.Zz)((0,r.RF)({mappings:{fill:{},height:{selector:()=>":host"},width:{selector:()=>":host"}}}),r.VO,r.tQ)(d)},10767:(t,e,o)=>{o.d(e,{G:()=>r});const r=t=>class extends t{get isLoading(){return"true"===this.getAttribute("loading")}click(){this.isLoading||super.click()}}},15450:(t,e,o)=>{o.r(e),o.d(e,{ButtonSelectionGroupItemClass:()=>h});var r=o(79365),n=o(81365),i=o(9696),a=o(97810),s=o(19624),l=o(25964);const c=(0,a.xE)("button-selection-group-item");class d extends((0,n.q)({componentName:c,baseSelector:":host > descope-button"})){get size(){return this.getAttribute("size")||"md"}get variant(){return this.getAttribute("variant")||"contained"}get value(){return this.getAttribute("value")||""}set value(t){this.setAttribute("value",t)}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML=`\n <descope-button variant="${this.variant}" size="${this.size}" mode="primary">\n <slot></slot>\n </descope-button>\n\t`,(0,l.fz)("\n descope-button {\n max-width: 100%;\n }\n\t\t\tdescope-button > slot {\n\t\t\t\twidth: 100%;\n\t\t\t\toverflow: hidden;\n text-overflow: ellipsis;\n display: inline-block;\n\t\t\t}\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n max-width: 100%\n\t\t\t}\n ",this),(0,a.EA)(this,this.baseElement,{includeAttrs:["size","variant"]}),(0,a.EA)(this.baseElement,this,{includeAttrs:["focused","active"]})}handleFocus(){this.shadowRoot.querySelector("descope-button")?.focus()}focus(){this.handleFocus()}init(){super.init(),this.addEventListener("focus",(t=>{t.isTrusted&&this.handleFocus()}))}}const h=(0,i.Zz)((0,r.RF)({mappings:{hostDirection:{selector:()=>s.J.componentName,property:s.J.cssVarList.hostDirection},backgroundColor:{selector:()=>s.J.componentName,property:s.J.cssVarList.backgroundColor},labelTextColor:{selector:()=>s.J.componentName,property:s.J.cssVarList.labelTextColor},borderColor:{selector:()=>s.J.componentName,property:s.J.cssVarList.borderColor},borderWidth:{selector:()=>s.J.componentName,property:s.J.cssVarList.borderWidth},borderStyle:{selector:()=>s.J.componentName,property:s.J.cssVarList.borderStyle},borderRadius:{selector:()=>s.J.componentName,property:s.J.cssVarList.borderRadius},outlineColor:{selector:()=>s.J.componentName,property:s.J.cssVarList.outlineColor}}}),r.VO,r.tQ)(d);o(30576),customElements.define(c,h)},18782:(t,e,o)=>{o.d(e,{m:()=>i});var r=o(25414);const n=t=>{const e=r.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=n(e)}else if("svg"===(t=>{const e=t.match(/\.([0-9a-z]+)(?:[\\?#]|$)/i);return e?e[1]:null})(t)){const e=await fetch(t),r=await e.text();o=n(r)}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}}},19624:(t,e,o)=>{o.d(e,{J:()=>p,T:()=>l});var r=o(63200),n=o(25964),i=o(88961),a=o(98538),s=o(10767);const l=(0,n.xE)("button"),{host:c,label:d,slottedIcon:h}={host:{selector:()=>":host"},label:{selector:"::part(label)"},slottedIcon:{selector:()=>"::slotted(descope-icon)"}};let u;const p=(0,r.Zz)((0,i.RF)({mappings:{hostWidth:{property:"width"},hostHeight:{property:"height"},hostDirection:{...c,property:"direction"},fontSize:{},fontFamily:{},cursor:{},backgroundColor:{},outlineOffset:{},outlineColor:{},outlineStyle:{},outlineWidth:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-right",fallback:"0.875em"},{property:"padding-left",fallback:"0.875em"}],labelTextColor:{property:"color"},iconColor:{selector:()=>"::slotted(*)",property:a.S.cssVarList.fill},labelTextDecoration:{...d,property:"text-decoration"},labelSpacing:{...d,property:"gap"},textAlign:{...d,property:"justify-content",fallback:"center"},iconSize:[{...h,property:"width"},{...h,property:"height"}]}}),s.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${u}\n\t\t\tvaadin-button::part(label) { pointer-events: none; }\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${p.cssVarList.outlineWidth}) + var(${p.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width="true"]) {\n width: var(${p.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${p.cssVarList.hostHeight}) - var(${p.cssVarList.outlineWidth}) - var(${p.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square="true"]:not([full-width="true"]) {\n\t\t\t\twidth: calc(var(${p.cssVarList.hostWidth}) - var(${p.cssVarList.outlineWidth}) - var(${p.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:l})),{color:m,fontSize:b}=p.cssVarList;u=`\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading="true"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${m});\n\t\ttop: calc(50% - (var(${b}) / 2));\n\t\tleft: calc(50% - (var(${b}) / 2));\n\t\tborder-width: calc(var(${b}) / 10);\n\t\twidth: var(${b});\n\t\theight: var(${b});\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`},30576:(t,e,o)=>{o.r(e),o.d(e,{ButtonClass:()=>r.J,componentName:()=>r.T});var r=o(19624);o(83799),customElements.define(r.T,r.J)},83799:(t,e,o)=>{o(93555),o(89389)},89389:(t,e,o)=>{o.d(e,{$:()=>m});var r=o(13256),n=o(55774),i=o(82901),a=o(90676),s=o(81488),l=o(87550);const c=o(51450).AH`
|
2
|
+
"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[1837,5087],{8512:(t,e,o)=>{o.d(e,{T:()=>l,q:()=>h});var r=o(88961),n=o(72270),i=o(63200),a=o(25964),s=o(18782);const l=(0,a.xE)("image"),c=["src","src-dark"];class d extends((0,n.qu)({componentName:l,baseSelector:"slot"})){static get observedAttributes(){return c}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<slot></slot>\n\t",(0,a.fz)("\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n :host > slot {\n width: 100%;\n height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n ::slotted(*) {\n width: 100%;\n\t\t\t}\n\n .hidden {\n display: none;\n }\n ",this)}init(){super.init?.(),this.toggleVisibility(this.src)}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 src(){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.src),(0,s.m)(this.src,this.altText).then((t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))}))}shouldRender(t){const e=this.getAttribute(t);return this.src===e}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),e!==o&&this.shouldRender(t)&&this.renderImage()}}const h=(0,i.Zz)((0,r.RF)({mappings:{fill:{},height:{selector:()=>":host"},width:{selector:()=>":host"}}}),r.VO,r.tQ)(d)},10767:(t,e,o)=>{o.d(e,{G:()=>r});const r=t=>class extends t{get isLoading(){return"true"===this.getAttribute("loading")}click(){this.isLoading||super.click()}}},15450:(t,e,o)=>{o.r(e),o.d(e,{ButtonSelectionGroupItemClass:()=>h});var r=o(79365),n=o(81365),i=o(9696),a=o(97810),s=o(19624),l=o(25964);const c=(0,a.xE)("button-selection-group-item");class d extends((0,n.q)({componentName:c,baseSelector:":host > descope-button"})){get size(){return this.getAttribute("size")||"md"}get variant(){return this.getAttribute("variant")||"contained"}get value(){return this.getAttribute("value")||""}set value(t){this.setAttribute("value",t)}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML=`\n <descope-button variant="${this.variant}" size="${this.size}" mode="primary">\n <slot></slot>\n </descope-button>\n\t`,(0,l.fz)("\n descope-button {\n max-width: 100%;\n }\n\t\t\tdescope-button > slot {\n\t\t\t\twidth: 100%;\n\t\t\t\toverflow: hidden;\n text-overflow: ellipsis;\n display: inline-block;\n\t\t\t}\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n max-width: 100%\n\t\t\t}\n ",this),(0,a.EA)(this,this.baseElement,{includeAttrs:["size","variant"]}),(0,a.EA)(this.baseElement,this,{includeAttrs:["focused","active"]})}handleFocus(){this.shadowRoot.querySelector("descope-button")?.focus()}focus(){this.handleFocus()}init(){super.init(),this.addEventListener("focus",(t=>{t.isTrusted&&this.handleFocus()}))}}const h=(0,i.Zz)((0,r.RF)({mappings:{hostDirection:{selector:()=>s.J.componentName,property:s.J.cssVarList.hostDirection},backgroundColor:{selector:()=>s.J.componentName,property:s.J.cssVarList.backgroundColor},labelTextColor:{selector:()=>s.J.componentName,property:s.J.cssVarList.labelTextColor},borderColor:{selector:()=>s.J.componentName,property:s.J.cssVarList.borderColor},borderWidth:{selector:()=>s.J.componentName,property:s.J.cssVarList.borderWidth},borderStyle:{selector:()=>s.J.componentName,property:s.J.cssVarList.borderStyle},borderRadius:{selector:()=>s.J.componentName,property:s.J.cssVarList.borderRadius},outlineColor:{selector:()=>s.J.componentName,property:s.J.cssVarList.outlineColor}}}),r.VO,r.tQ)(d);o(30576),customElements.define(c,h)},18782:(t,e,o)=>{o.d(e,{m:()=>i});var r=o(25414);const n=t=>{const e=r.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=n(e)}else if("svg"===(t=>{const e=t.match(/\.([0-9a-z]+)(?:[\\?#]|$)/i);return e?e[1]:null})(t)){const e=await fetch(t),r=await e.text();o=n(r)}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}}},19624:(t,e,o)=>{o.d(e,{J:()=>p,T:()=>l});var r=o(63200),n=o(25964),i=o(88961),a=o(98538),s=o(10767);const l=(0,n.xE)("button"),{host:c,label:d,slottedIcon:h}={host:{selector:()=>":host"},label:{selector:"::part(label)"},slottedIcon:{selector:()=>"::slotted(descope-icon)"}};let u;const p=(0,r.Zz)((0,i.RF)({mappings:{hostWidth:{property:"width"},hostHeight:{property:"height"},hostDirection:{...c,property:"direction"},fontSize:{},fontFamily:{},cursor:{},backgroundColor:{},outlineOffset:{},outlineColor:{},outlineStyle:{},outlineWidth:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-right",fallback:"0.875em"},{property:"padding-left",fallback:"0.875em"}],labelTextColor:{property:"color"},iconColor:{selector:()=>"::slotted(*)",property:a.S.cssVarList.fill},labelTextDecoration:{...d,property:"text-decoration"},labelSpacing:{...d,property:"gap"},textAlign:{...d,property:"justify-content",fallback:"center"},iconSize:[{...h,property:"width"},{...h,property:"height"}]}}),s.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${u}\n\t\t\tvaadin-button::part(label) { pointer-events: none; }\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${p.cssVarList.outlineWidth}) + var(${p.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width="true"]) {\n width: var(${p.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${p.cssVarList.hostHeight}) - var(${p.cssVarList.outlineWidth}) - var(${p.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square="true"]:not([full-width="true"]) {\n\t\t\t\twidth: calc(var(${p.cssVarList.hostWidth}) - var(${p.cssVarList.outlineWidth}) - var(${p.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex","class"],componentName:l})),{color:m,fontSize:b}=p.cssVarList;u=`\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading="true"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${m});\n\t\ttop: calc(50% - (var(${b}) / 2));\n\t\tleft: calc(50% - (var(${b}) / 2));\n\t\tborder-width: calc(var(${b}) / 10);\n\t\twidth: var(${b});\n\t\theight: var(${b});\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`},30576:(t,e,o)=>{o.r(e),o.d(e,{ButtonClass:()=>r.J,componentName:()=>r.T});var r=o(19624);o(83799),customElements.define(r.T,r.J)},83799:(t,e,o)=>{o(93555),o(89389)},89389:(t,e,o)=>{o.d(e,{$:()=>m});var r=o(13256),n=o(55774),i=o(82901),a=o(90676),s=o(81488),l=o(87550);const c=o(51450).AH`
|
3
3
|
:host {
|
4
4
|
display: inline-block;
|
5
5
|
position: relative;
|
package/dist/umd/button-selection-group-fields-descope-button-selection-group-item-index-js.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"button-selection-group-fields-descope-button-selection-group-item-index-js.js","mappings":"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","sources":["webpack://@descope/web-components-ui/../components/descope-image/src/component/ImageClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/clickableMixin.js","webpack://@descope/web-components-ui/./src/components/button-selection-group-fields/descope-button-selection-group-item/ButtonSelectionGroupItemClass.js","webpack://@descope/web-components-ui/./src/components/button-selection-group-fields/descope-button-selection-group-item/index.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/helpers.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/ButtonClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/index.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button-base.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button-mixin.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/theme/lumo/vaadin-button-styles.js","webpack://@descope/web-components-ui/../components/descope-icon/src/component/IconClass.js"],"sourcesContent":["/* eslint-disable no-use-before-define */\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.src);\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 src() {\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 // eslint-disable-next-line class-methods-use-this\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.src);\n\n createImage(this.src, 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.src === 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","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 { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../../mixins';\nimport { createBaseClass } from '../../../baseClasses/createBaseClass';\nimport { compose } from '../../../helpers';\nimport { forwardAttrs, getComponentName } from '../../../helpers/componentHelpers';\nimport { ButtonClass } from '@descope-ui/descope-button/class';\nimport { injectStyle } from '@descope-ui/common/components-helpers';\n\nexport const componentName = getComponentName('button-selection-group-item');\n\nclass RawSelectItem extends createBaseClass({\n componentName,\n baseSelector: ':host > descope-button',\n}) {\n get size() {\n return this.getAttribute('size') || 'md';\n }\n\n get variant() {\n return this.getAttribute('variant') || 'contained';\n }\n\n get value() {\n return this.getAttribute('value') || '';\n }\n\n set value(value) {\n this.setAttribute('value', value);\n }\n\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\n <descope-button variant=\"${this.variant}\" size=\"${this.size}\" mode=\"primary\">\n <slot></slot>\n </descope-button>\n\t`;\n\n injectStyle(\n `\n descope-button {\n max-width: 100%;\n }\n\t\t\tdescope-button > slot {\n\t\t\t\twidth: 100%;\n\t\t\t\toverflow: hidden;\n text-overflow: ellipsis;\n display: inline-block;\n\t\t\t}\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n max-width: 100%\n\t\t\t}\n `,\n this\n );\n\n forwardAttrs(this, this.baseElement, { includeAttrs: ['size', 'variant'] });\n forwardAttrs(this.baseElement, this, { includeAttrs: ['focused', 'active'] });\n }\n\n handleFocus() {\n this.shadowRoot.querySelector('descope-button')?.focus();\n }\n\n focus() {\n this.handleFocus();\n }\n\n init() {\n super.init();\n this.addEventListener('focus', (e) => {\n // we want to ignore focus events we are dispatching\n if (e.isTrusted) {\n this.handleFocus();\n }\n });\n }\n}\n\nexport const ButtonSelectionGroupItemClass = compose(\n createStyleMixin({\n mappings: {\n hostDirection: {\n selector: () => ButtonClass.componentName,\n property: ButtonClass.cssVarList.hostDirection,\n },\n backgroundColor: {\n selector: () => ButtonClass.componentName,\n property: ButtonClass.cssVarList.backgroundColor,\n },\n labelTextColor: {\n selector: () => ButtonClass.componentName,\n property: ButtonClass.cssVarList.labelTextColor,\n },\n borderColor: {\n selector: () => ButtonClass.componentName,\n property: ButtonClass.cssVarList.borderColor,\n },\n borderWidth: {\n selector: () => ButtonClass.componentName,\n property: ButtonClass.cssVarList.borderWidth,\n },\n borderStyle: {\n selector: () => ButtonClass.componentName,\n property: ButtonClass.cssVarList.borderStyle,\n },\n borderRadius: {\n selector: () => ButtonClass.componentName,\n property: ButtonClass.cssVarList.borderRadius,\n },\n outlineColor: {\n selector: () => ButtonClass.componentName,\n property: ButtonClass.cssVarList.outlineColor,\n },\n },\n }),\n draggableMixin,\n componentNameValidationMixin\n)(RawSelectItem);\n","import { componentName, ButtonSelectionGroupItemClass } from './ButtonSelectionGroupItemClass';\nimport '@descope-ui/descope-button';\n\ncustomElements.define(componentName, ButtonSelectionGroupItemClass);\n\nexport { ButtonSelectionGroupItemClass };\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 { compose } from '@descope-ui/common/utils';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport {\n createStyleMixin,\n draggableMixin,\n createProxy,\n componentNameValidationMixin,\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 createStyleMixin({\n mappings: {\n hostWidth: { property: 'width' },\n hostHeight: { property: 'height' },\n hostDirection: { ...host, property: 'direction' },\n fontSize: {},\n fontFamily: {},\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: [{ property: 'padding-top' }, { property: 'padding-bottom' }],\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\t\tselector: () => `::slotted(*)`,\n\t\tproperty: IconClass.cssVarList.fill\n\t },\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'],\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","import { componentName, ButtonClass } from './ButtonClass';\nimport '@vaadin/button';\n\ncustomElements.define(componentName, ButtonClass);\n\nexport { ButtonClass, componentName };\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { css } from 'lit';\n\nexport const buttonStyles = css`\n :host {\n display: inline-block;\n position: relative;\n outline: none;\n white-space: nowrap;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n }\n\n :host([hidden]) {\n display: none !important;\n }\n\n /* Aligns the button with form fields when placed on the same line.\n Note, to make it work, the form fields should have the same \"::before\" pseudo-element. */\n .vaadin-button-container::before {\n content: '\\\\2003';\n display: inline-block;\n width: 0;\n max-height: 100%;\n }\n\n .vaadin-button-container {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n width: 100%;\n height: 100%;\n min-height: inherit;\n text-shadow: inherit;\n }\n\n [part='prefix'],\n [part='suffix'] {\n flex: none;\n }\n\n [part='label'] {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n @media (forced-colors: active) {\n :host {\n outline: 1px solid;\n outline-offset: -1px;\n }\n\n :host([focused]) {\n outline-width: 2px;\n }\n\n :host([disabled]) {\n outline-color: GrayText;\n }\n }\n`;\n\nexport const buttonTemplate = (html) => html`\n <div class=\"vaadin-button-container\">\n <span part=\"prefix\" aria-hidden=\"true\">\n <slot name=\"prefix\"></slot>\n </span>\n <span part=\"label\">\n <slot></slot>\n </span>\n <span part=\"suffix\" aria-hidden=\"true\">\n <slot name=\"suffix\"></slot>\n </span>\n </div>\n <slot name=\"tooltip\"></slot>\n`;\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { ActiveMixin } from '@vaadin/a11y-base/src/active-mixin.js';\nimport { FocusMixin } from '@vaadin/a11y-base/src/focus-mixin.js';\nimport { TabindexMixin } from '@vaadin/a11y-base/src/tabindex-mixin.js';\n\n/**\n * A mixin providing common button functionality.\n *\n * @polymerMixin\n * @mixes ActiveMixin\n * @mixes FocusMixin\n * @mixes TabindexMixin\n */\nexport const ButtonMixin = (superClass) =>\n class ButtonMixinClass extends ActiveMixin(TabindexMixin(FocusMixin(superClass))) {\n static get properties() {\n return {\n /**\n * Indicates whether the element can be focused and where it participates in sequential keyboard navigation.\n *\n * @override\n * @protected\n */\n tabindex: {\n type: Number,\n value: 0,\n reflectToAttribute: true,\n },\n };\n }\n\n /**\n * By default, `Space` is the only possible activation key for a focusable HTML element.\n * Nonetheless, the button is an exception as it can be also activated by pressing `Enter`.\n * See the \"Keyboard Support\" section in https://www.w3.org/TR/wai-aria-practices/examples/button/button.html.\n *\n * @protected\n * @override\n */\n get _activeKeys() {\n return ['Enter', ' '];\n }\n\n /** @protected */\n ready() {\n super.ready();\n\n // By default, if the user hasn't provided a custom role,\n // the role attribute is set to \"button\".\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'button');\n }\n }\n\n /**\n * Since the button component is designed on the base of the `[role=button]` attribute,\n * and doesn't have a native <button> inside, in order to be fully accessible from the keyboard,\n * it should manually fire the `click` event once an activation key is pressed,\n * as it follows from the WAI-ARIA specifications:\n * https://www.w3.org/TR/wai-aria-practices-1.1/#button\n *\n * According to the UI Events specifications,\n * the `click` event should be fired exactly on `keydown`:\n * https://www.w3.org/TR/uievents/#event-type-keydown\n *\n * @param {KeyboardEvent} event\n * @protected\n * @override\n */\n _onKeyDown(event) {\n super._onKeyDown(event);\n\n if (event.altKey || event.shiftKey || event.ctrlKey || event.metaKey) {\n return;\n }\n\n if (this._activeKeys.includes(event.key)) {\n event.preventDefault();\n\n // `DisabledMixin` overrides the standard `click()` method\n // so that it doesn't fire the `click` event when the element is disabled.\n this.click();\n }\n }\n };\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { ControllerMixin } from '@vaadin/component-base/src/controller-mixin.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';\nimport { TooltipController } from '@vaadin/component-base/src/tooltip-controller.js';\nimport { registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { buttonStyles, buttonTemplate } from './vaadin-button-base.js';\nimport { ButtonMixin } from './vaadin-button-mixin.js';\n\nregisterStyles('vaadin-button', buttonStyles, { moduleId: 'vaadin-button-styles' });\n\n/**\n * `<vaadin-button>` is an accessible and customizable button that allows users to perform actions.\n *\n * ```html\n * <vaadin-button>Press me</vaadin-button>\n * ```\n *\n * ### Styling\n *\n * The following shadow DOM parts are available for styling:\n *\n * Part name | Description\n * ----------|-------------\n * `label` | The label (text) inside the button.\n * `prefix` | A slot for content before the label (e.g. an icon).\n * `suffix` | A slot for content after the label (e.g. an icon).\n *\n * The following attributes are available for styling:\n *\n * Attribute | Description\n * -------------|-------------\n * `active` | Set when the button is pressed down, either with mouse, touch or the keyboard.\n * `disabled` | Set when the button is disabled.\n * `focus-ring` | Set when the button is focused using the keyboard.\n * `focused` | Set when the button is focused.\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ButtonMixin\n * @mixes ControllerMixin\n * @mixes ElementMixin\n * @mixes ThemableMixin\n */\nclass Button extends ButtonMixin(ElementMixin(ThemableMixin(ControllerMixin(PolymerElement)))) {\n static get is() {\n return 'vaadin-button';\n }\n\n static get template() {\n return buttonTemplate(html);\n }\n\n /** @protected */\n ready() {\n super.ready();\n\n this._tooltipController = new TooltipController(this);\n this.addController(this._tooltipController);\n }\n}\n\ndefineCustomElement(Button);\n\nexport { Button };\n","import '@vaadin/vaadin-lumo-styles/color.js';\nimport '@vaadin/vaadin-lumo-styles/sizing.js';\nimport '@vaadin/vaadin-lumo-styles/spacing.js';\nimport '@vaadin/vaadin-lumo-styles/style.js';\nimport '@vaadin/vaadin-lumo-styles/typography.js';\nimport { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\n\nconst button = css`\n :host {\n /* Sizing */\n --lumo-button-size: var(--lumo-size-m);\n min-width: var(--vaadin-button-min-width, calc(var(--_button-size) * 2));\n height: var(--_button-size);\n padding: var(--vaadin-button-padding, 0 calc(var(--_button-size) / 3 + var(--lumo-border-radius-m) / 2));\n margin: var(--vaadin-button-margin, var(--lumo-space-xs) 0);\n box-sizing: border-box;\n /* Style */\n font-family: var(--lumo-font-family);\n font-size: var(--vaadin-button-font-size, var(--lumo-font-size-m));\n font-weight: var(--vaadin-button-font-weight, 500);\n color: var(--_lumo-button-text-color);\n background: var(--_lumo-button-background);\n border: var(--vaadin-button-border, none);\n border-radius: var(--vaadin-button-border-radius, var(--lumo-border-radius-m));\n cursor: var(--lumo-clickable-cursor);\n -webkit-tap-highlight-color: transparent;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n flex-shrink: 0;\n --_button-size: var(--vaadin-button-height, var(--lumo-button-size));\n --_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-primary-color-50pct));\n --_focus-ring-width: var(--vaadin-focus-ring-width, 2px);\n /* Used by notification */\n --_lumo-button-background: var(--vaadin-button-background, var(--lumo-contrast-5pct));\n --_lumo-button-text-color: var(--vaadin-button-text-color, var(--lumo-primary-text-color));\n --_lumo-button-primary-background: var(--vaadin-button-primary-background, var(--lumo-primary-color));\n --_lumo-button-primary-text-color: var(--vaadin-button-primary-text-color, var(--lumo-primary-contrast-color));\n }\n\n /* Set only for the internal parts so we don't affect the host vertical alignment */\n [part='label'],\n [part='prefix'],\n [part='suffix'] {\n line-height: var(--lumo-line-height-xs);\n }\n\n [part='label'] {\n padding: calc(var(--lumo-button-size) / 6) 0;\n }\n\n :host([theme~='small']) {\n font-size: var(--lumo-font-size-s);\n --lumo-button-size: var(--lumo-size-s);\n }\n\n :host([theme~='large']) {\n font-size: var(--lumo-font-size-l);\n --lumo-button-size: var(--lumo-size-l);\n }\n\n /* For interaction states */\n :host::before,\n :host::after {\n content: '';\n /* We rely on the host always being relative */\n position: absolute;\n z-index: 1;\n inset: 0;\n background-color: currentColor;\n border-radius: inherit;\n opacity: 0;\n pointer-events: none;\n }\n\n /* Hover */\n\n @media (any-hover: hover) {\n :host(:hover)::before {\n opacity: 0.02;\n }\n }\n\n /* Active */\n\n :host::after {\n transition: opacity 1.4s, transform 0.1s;\n filter: blur(8px);\n }\n\n :host([active])::before {\n opacity: 0.05;\n transition-duration: 0s;\n }\n\n :host([active])::after {\n opacity: 0.1;\n transition-duration: 0s, 0s;\n transform: scale(0);\n }\n\n /* Keyboard focus */\n\n :host([focus-ring]) {\n box-shadow: 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);\n }\n\n :host([theme~='primary'][focus-ring]) {\n box-shadow: 0 0 0 1px var(--lumo-base-color), 0 0 0 3px var(--lumo-primary-color-50pct);\n }\n\n /* Types (primary, tertiary, tertiary-inline */\n\n :host([theme~='tertiary']),\n :host([theme~='tertiary-inline']) {\n --_background: transparent !important;\n background: var(--vaadin-button-tertiary-background, var(--_background));\n min-width: 0;\n }\n\n :host([theme~='tertiary']) {\n border: var(--vaadin-button-tertiary-border, none);\n color: var(--vaadin-button-tertiary-text-color, var(--lumo-primary-text-color));\n font-weight: var(--vaadin-button-tertiary-font-weight, 500);\n padding: var(--vaadin-button-tertiary-padding, 0 calc(var(--_button-size) / 6));\n }\n\n :host([theme~='tertiary-inline'])::before {\n display: none;\n }\n\n :host([theme~='tertiary-inline']) {\n margin: 0;\n height: auto;\n padding: 0;\n line-height: inherit;\n font-size: inherit;\n }\n\n :host([theme~='tertiary-inline']) [part='label'] {\n padding: 0;\n overflow: visible;\n line-height: inherit;\n }\n\n :host([theme~='primary']) {\n background: var(--_lumo-button-primary-background);\n border: var(--vaadin-button-primary-border, none);\n color: var(--_lumo-button-primary-text-color);\n font-weight: var(--vaadin-button-primary-font-weight, 600);\n min-width: calc(var(--lumo-button-size) * 2.5);\n }\n\n :host([theme~='primary'])::before {\n background-color: black;\n }\n\n @media (any-hover: hover) {\n :host([theme~='primary']:hover)::before {\n opacity: 0.05;\n }\n }\n\n :host([theme~='primary'][active])::before {\n opacity: 0.1;\n }\n\n :host([theme~='primary'][active])::after {\n opacity: 0.2;\n }\n\n /* Colors (success, error, contrast) */\n\n :host([theme~='success']) {\n color: var(--lumo-success-text-color);\n }\n\n :host([theme~='success'][theme~='primary']) {\n background-color: var(--lumo-success-color);\n color: var(--lumo-success-contrast-color);\n }\n\n :host([theme~='error']) {\n color: var(--lumo-error-text-color);\n }\n\n :host([theme~='error'][theme~='primary']) {\n background-color: var(--lumo-error-color);\n color: var(--lumo-error-contrast-color);\n }\n\n :host([theme~='contrast']) {\n color: var(--lumo-contrast);\n }\n\n :host([theme~='contrast'][theme~='primary']) {\n background-color: var(--lumo-contrast);\n color: var(--lumo-base-color);\n }\n\n /* Disabled state. Keep selectors after other color variants. */\n\n :host([disabled]) {\n pointer-events: none;\n color: var(--lumo-disabled-text-color);\n }\n\n :host([theme~='primary'][disabled]) {\n background-color: var(--lumo-contrast-30pct);\n color: var(--lumo-base-color);\n }\n\n :host([theme~='primary'][disabled]) [part] {\n opacity: 0.7;\n }\n\n /* Icons */\n\n [part] ::slotted(vaadin-icon) {\n display: inline-block;\n width: var(--lumo-icon-size-m);\n height: var(--lumo-icon-size-m);\n }\n\n /* Vaadin icons are based on a 16x16 grid (unlike Lumo and Material icons with 24x24), so they look too big by default */\n [part] ::slotted(vaadin-icon[icon^='vaadin:']) {\n padding: 0.25em;\n box-sizing: border-box !important;\n }\n\n [part='prefix'] {\n margin-left: -0.25em;\n margin-right: 0.25em;\n }\n\n [part='suffix'] {\n margin-left: 0.25em;\n margin-right: -0.25em;\n }\n\n /* Icon-only */\n\n :host([theme~='icon']:not([theme~='tertiary-inline'])) {\n min-width: var(--lumo-button-size);\n padding-left: calc(var(--lumo-button-size) / 4);\n padding-right: calc(var(--lumo-button-size) / 4);\n }\n\n :host([theme~='icon']) [part='prefix'],\n :host([theme~='icon']) [part='suffix'] {\n margin-left: 0;\n margin-right: 0;\n }\n\n /* RTL specific styles */\n\n :host([dir='rtl']) [part='prefix'] {\n margin-left: 0.25em;\n margin-right: -0.25em;\n }\n\n :host([dir='rtl']) [part='suffix'] {\n margin-left: -0.25em;\n margin-right: 0.25em;\n }\n\n :host([dir='rtl'][theme~='icon']) [part='prefix'],\n :host([dir='rtl'][theme~='icon']) [part='suffix'] {\n margin-left: 0;\n margin-right: 0;\n }\n`;\n\nregisterStyles('vaadin-button', button, { moduleId: 'lumo-button' });\n\nexport { button };\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 },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(\n createProxy({\n slots: [],\n wrappedEleName: 'descope-image',\n style: () => `\n :host {\n display: inline-flex;\n }\n `,\n excludeAttrsSync: ['tabindex', 'class'],\n componentName,\n }),\n);\n"],"names":["componentName","srcAttrs","RawImage","baseSelector","observedAttributes","constructor","super","this","attachShadow","mode","innerHTML","init","toggleVisibility","src","onThemeChange","renderImage","isVisible","classList","remove","add","altText","getAttribute","legacySrc","themeSrc","currentThemeName","updateFillColor","node","querySelectorAll","forEach","ele","setAttribute","ImageClass","cssVarList","fill","then","res","appendChild","shouldRender","srcVal","attributeChangedCallback","attrName","oldValue","newValue","mappings","height","selector","width","clickableMixin","superclass","isLoading","click","RawSelectItem","createBaseClass","size","variant","value","baseElement","includeAttrs","handleFocus","shadowRoot","querySelector","focus","addEventListener","e","isTrusted","ButtonSelectionGroupItemClass","hostDirection","ButtonClass","property","backgroundColor","labelTextColor","borderColor","borderWidth","borderStyle","borderRadius","outlineColor","customElements","define","createSvgEle","text","clean","sanitize","USE_PROFILES","svg","svgFilters","ADD_TAGS","FORBID_TAGS","DOMParser","parseFromString","createImage","async","startsWith","isBase64Svg","svgXml","atob","slice","base64Prefix","path","match","getFileExtension","fetchedSrc","fetch","document","createElement","createImgEle","style","setProperty","host","label","slottedIcon","loadingIndicatorStyles","hostWidth","hostHeight","fontSize","fontFamily","cursor","outlineOffset","outlineStyle","outlineWidth","verticalPadding","horizontalPadding","fallback","iconColor","labelTextDecoration","labelSpacing","textAlign","iconSize","slots","wrappedEleName","excludeAttrsSync","color","buttonStyles","ButtonMixin","superClass","properties","tabindex","type","Number","reflectToAttribute","_activeKeys","ready","hasAttribute","_onKeyDown","event","altKey","shiftKey","ctrlKey","metaKey","includes","key","preventDefault","moduleId","Button","is","template","_tooltipController","addController","button","IconClass"],"sourceRoot":""}
|
1
|
+
{"version":3,"file":"button-selection-group-fields-descope-button-selection-group-item-index-js.js","mappings":"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","sources":["webpack://@descope/web-components-ui/../components/descope-image/src/component/ImageClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/clickableMixin.js","webpack://@descope/web-components-ui/./src/components/button-selection-group-fields/descope-button-selection-group-item/ButtonSelectionGroupItemClass.js","webpack://@descope/web-components-ui/./src/components/button-selection-group-fields/descope-button-selection-group-item/index.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/helpers.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/ButtonClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/index.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button-base.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button-mixin.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/theme/lumo/vaadin-button-styles.js","webpack://@descope/web-components-ui/../components/descope-icon/src/component/IconClass.js"],"sourcesContent":["/* eslint-disable no-use-before-define */\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.src);\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 src() {\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 // eslint-disable-next-line class-methods-use-this\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.src);\n\n createImage(this.src, 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.src === 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","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 { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../../mixins';\nimport { createBaseClass } from '../../../baseClasses/createBaseClass';\nimport { compose } from '../../../helpers';\nimport { forwardAttrs, getComponentName } from '../../../helpers/componentHelpers';\nimport { ButtonClass } from '@descope-ui/descope-button/class';\nimport { injectStyle } from '@descope-ui/common/components-helpers';\n\nexport const componentName = getComponentName('button-selection-group-item');\n\nclass RawSelectItem extends createBaseClass({\n componentName,\n baseSelector: ':host > descope-button',\n}) {\n get size() {\n return this.getAttribute('size') || 'md';\n }\n\n get variant() {\n return this.getAttribute('variant') || 'contained';\n }\n\n get value() {\n return this.getAttribute('value') || '';\n }\n\n set value(value) {\n this.setAttribute('value', value);\n }\n\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\n <descope-button variant=\"${this.variant}\" size=\"${this.size}\" mode=\"primary\">\n <slot></slot>\n </descope-button>\n\t`;\n\n injectStyle(\n `\n descope-button {\n max-width: 100%;\n }\n\t\t\tdescope-button > slot {\n\t\t\t\twidth: 100%;\n\t\t\t\toverflow: hidden;\n text-overflow: ellipsis;\n display: inline-block;\n\t\t\t}\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n max-width: 100%\n\t\t\t}\n `,\n this\n );\n\n forwardAttrs(this, this.baseElement, { includeAttrs: ['size', 'variant'] });\n forwardAttrs(this.baseElement, this, { includeAttrs: ['focused', 'active'] });\n }\n\n handleFocus() {\n this.shadowRoot.querySelector('descope-button')?.focus();\n }\n\n focus() {\n this.handleFocus();\n }\n\n init() {\n super.init();\n this.addEventListener('focus', (e) => {\n // we want to ignore focus events we are dispatching\n if (e.isTrusted) {\n this.handleFocus();\n }\n });\n }\n}\n\nexport const ButtonSelectionGroupItemClass = compose(\n createStyleMixin({\n mappings: {\n hostDirection: {\n selector: () => ButtonClass.componentName,\n property: ButtonClass.cssVarList.hostDirection,\n },\n backgroundColor: {\n selector: () => ButtonClass.componentName,\n property: ButtonClass.cssVarList.backgroundColor,\n },\n labelTextColor: {\n selector: () => ButtonClass.componentName,\n property: ButtonClass.cssVarList.labelTextColor,\n },\n borderColor: {\n selector: () => ButtonClass.componentName,\n property: ButtonClass.cssVarList.borderColor,\n },\n borderWidth: {\n selector: () => ButtonClass.componentName,\n property: ButtonClass.cssVarList.borderWidth,\n },\n borderStyle: {\n selector: () => ButtonClass.componentName,\n property: ButtonClass.cssVarList.borderStyle,\n },\n borderRadius: {\n selector: () => ButtonClass.componentName,\n property: ButtonClass.cssVarList.borderRadius,\n },\n outlineColor: {\n selector: () => ButtonClass.componentName,\n property: ButtonClass.cssVarList.outlineColor,\n },\n },\n }),\n draggableMixin,\n componentNameValidationMixin\n)(RawSelectItem);\n","import { componentName, ButtonSelectionGroupItemClass } from './ButtonSelectionGroupItemClass';\nimport '@descope-ui/descope-button';\n\ncustomElements.define(componentName, ButtonSelectionGroupItemClass);\n\nexport { ButtonSelectionGroupItemClass };\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 { compose } from '@descope-ui/common/utils';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport {\n createStyleMixin,\n draggableMixin,\n createProxy,\n componentNameValidationMixin,\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 createStyleMixin({\n mappings: {\n hostWidth: { property: 'width' },\n hostHeight: { property: 'height' },\n hostDirection: { ...host, property: 'direction' },\n fontSize: {},\n fontFamily: {},\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: [{ property: 'padding-top' }, { property: 'padding-bottom' }],\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\t\tselector: () => `::slotted(*)`,\n\t\tproperty: IconClass.cssVarList.fill\n\t },\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'],\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","import { componentName, ButtonClass } from './ButtonClass';\nimport '@vaadin/button';\n\ncustomElements.define(componentName, ButtonClass);\n\nexport { ButtonClass, componentName };\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { css } from 'lit';\n\nexport const buttonStyles = css`\n :host {\n display: inline-block;\n position: relative;\n outline: none;\n white-space: nowrap;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n }\n\n :host([hidden]) {\n display: none !important;\n }\n\n /* Aligns the button with form fields when placed on the same line.\n Note, to make it work, the form fields should have the same \"::before\" pseudo-element. */\n .vaadin-button-container::before {\n content: '\\\\2003';\n display: inline-block;\n width: 0;\n max-height: 100%;\n }\n\n .vaadin-button-container {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n width: 100%;\n height: 100%;\n min-height: inherit;\n text-shadow: inherit;\n }\n\n [part='prefix'],\n [part='suffix'] {\n flex: none;\n }\n\n [part='label'] {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n @media (forced-colors: active) {\n :host {\n outline: 1px solid;\n outline-offset: -1px;\n }\n\n :host([focused]) {\n outline-width: 2px;\n }\n\n :host([disabled]) {\n outline-color: GrayText;\n }\n }\n`;\n\nexport const buttonTemplate = (html) => html`\n <div class=\"vaadin-button-container\">\n <span part=\"prefix\" aria-hidden=\"true\">\n <slot name=\"prefix\"></slot>\n </span>\n <span part=\"label\">\n <slot></slot>\n </span>\n <span part=\"suffix\" aria-hidden=\"true\">\n <slot name=\"suffix\"></slot>\n </span>\n </div>\n <slot name=\"tooltip\"></slot>\n`;\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { ActiveMixin } from '@vaadin/a11y-base/src/active-mixin.js';\nimport { FocusMixin } from '@vaadin/a11y-base/src/focus-mixin.js';\nimport { TabindexMixin } from '@vaadin/a11y-base/src/tabindex-mixin.js';\n\n/**\n * A mixin providing common button functionality.\n *\n * @polymerMixin\n * @mixes ActiveMixin\n * @mixes FocusMixin\n * @mixes TabindexMixin\n */\nexport const ButtonMixin = (superClass) =>\n class ButtonMixinClass extends ActiveMixin(TabindexMixin(FocusMixin(superClass))) {\n static get properties() {\n return {\n /**\n * Indicates whether the element can be focused and where it participates in sequential keyboard navigation.\n *\n * @override\n * @protected\n */\n tabindex: {\n type: Number,\n value: 0,\n reflectToAttribute: true,\n },\n };\n }\n\n /**\n * By default, `Space` is the only possible activation key for a focusable HTML element.\n * Nonetheless, the button is an exception as it can be also activated by pressing `Enter`.\n * See the \"Keyboard Support\" section in https://www.w3.org/TR/wai-aria-practices/examples/button/button.html.\n *\n * @protected\n * @override\n */\n get _activeKeys() {\n return ['Enter', ' '];\n }\n\n /** @protected */\n ready() {\n super.ready();\n\n // By default, if the user hasn't provided a custom role,\n // the role attribute is set to \"button\".\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'button');\n }\n }\n\n /**\n * Since the button component is designed on the base of the `[role=button]` attribute,\n * and doesn't have a native <button> inside, in order to be fully accessible from the keyboard,\n * it should manually fire the `click` event once an activation key is pressed,\n * as it follows from the WAI-ARIA specifications:\n * https://www.w3.org/TR/wai-aria-practices-1.1/#button\n *\n * According to the UI Events specifications,\n * the `click` event should be fired exactly on `keydown`:\n * https://www.w3.org/TR/uievents/#event-type-keydown\n *\n * @param {KeyboardEvent} event\n * @protected\n * @override\n */\n _onKeyDown(event) {\n super._onKeyDown(event);\n\n if (event.altKey || event.shiftKey || event.ctrlKey || event.metaKey) {\n return;\n }\n\n if (this._activeKeys.includes(event.key)) {\n event.preventDefault();\n\n // `DisabledMixin` overrides the standard `click()` method\n // so that it doesn't fire the `click` event when the element is disabled.\n this.click();\n }\n }\n };\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { ControllerMixin } from '@vaadin/component-base/src/controller-mixin.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';\nimport { TooltipController } from '@vaadin/component-base/src/tooltip-controller.js';\nimport { registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { buttonStyles, buttonTemplate } from './vaadin-button-base.js';\nimport { ButtonMixin } from './vaadin-button-mixin.js';\n\nregisterStyles('vaadin-button', buttonStyles, { moduleId: 'vaadin-button-styles' });\n\n/**\n * `<vaadin-button>` is an accessible and customizable button that allows users to perform actions.\n *\n * ```html\n * <vaadin-button>Press me</vaadin-button>\n * ```\n *\n * ### Styling\n *\n * The following shadow DOM parts are available for styling:\n *\n * Part name | Description\n * ----------|-------------\n * `label` | The label (text) inside the button.\n * `prefix` | A slot for content before the label (e.g. an icon).\n * `suffix` | A slot for content after the label (e.g. an icon).\n *\n * The following attributes are available for styling:\n *\n * Attribute | Description\n * -------------|-------------\n * `active` | Set when the button is pressed down, either with mouse, touch or the keyboard.\n * `disabled` | Set when the button is disabled.\n * `focus-ring` | Set when the button is focused using the keyboard.\n * `focused` | Set when the button is focused.\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ButtonMixin\n * @mixes ControllerMixin\n * @mixes ElementMixin\n * @mixes ThemableMixin\n */\nclass Button extends ButtonMixin(ElementMixin(ThemableMixin(ControllerMixin(PolymerElement)))) {\n static get is() {\n return 'vaadin-button';\n }\n\n static get template() {\n return buttonTemplate(html);\n }\n\n /** @protected */\n ready() {\n super.ready();\n\n this._tooltipController = new TooltipController(this);\n this.addController(this._tooltipController);\n }\n}\n\ndefineCustomElement(Button);\n\nexport { Button };\n","import '@vaadin/vaadin-lumo-styles/color.js';\nimport '@vaadin/vaadin-lumo-styles/sizing.js';\nimport '@vaadin/vaadin-lumo-styles/spacing.js';\nimport '@vaadin/vaadin-lumo-styles/style.js';\nimport '@vaadin/vaadin-lumo-styles/typography.js';\nimport { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\n\nconst button = css`\n :host {\n /* Sizing */\n --lumo-button-size: var(--lumo-size-m);\n min-width: var(--vaadin-button-min-width, calc(var(--_button-size) * 2));\n height: var(--_button-size);\n padding: var(--vaadin-button-padding, 0 calc(var(--_button-size) / 3 + var(--lumo-border-radius-m) / 2));\n margin: var(--vaadin-button-margin, var(--lumo-space-xs) 0);\n box-sizing: border-box;\n /* Style */\n font-family: var(--lumo-font-family);\n font-size: var(--vaadin-button-font-size, var(--lumo-font-size-m));\n font-weight: var(--vaadin-button-font-weight, 500);\n color: var(--_lumo-button-text-color);\n background: var(--_lumo-button-background);\n border: var(--vaadin-button-border, none);\n border-radius: var(--vaadin-button-border-radius, var(--lumo-border-radius-m));\n cursor: var(--lumo-clickable-cursor);\n -webkit-tap-highlight-color: transparent;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n flex-shrink: 0;\n --_button-size: var(--vaadin-button-height, var(--lumo-button-size));\n --_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-primary-color-50pct));\n --_focus-ring-width: var(--vaadin-focus-ring-width, 2px);\n /* Used by notification */\n --_lumo-button-background: var(--vaadin-button-background, var(--lumo-contrast-5pct));\n --_lumo-button-text-color: var(--vaadin-button-text-color, var(--lumo-primary-text-color));\n --_lumo-button-primary-background: var(--vaadin-button-primary-background, var(--lumo-primary-color));\n --_lumo-button-primary-text-color: var(--vaadin-button-primary-text-color, var(--lumo-primary-contrast-color));\n }\n\n /* Set only for the internal parts so we don't affect the host vertical alignment */\n [part='label'],\n [part='prefix'],\n [part='suffix'] {\n line-height: var(--lumo-line-height-xs);\n }\n\n [part='label'] {\n padding: calc(var(--lumo-button-size) / 6) 0;\n }\n\n :host([theme~='small']) {\n font-size: var(--lumo-font-size-s);\n --lumo-button-size: var(--lumo-size-s);\n }\n\n :host([theme~='large']) {\n font-size: var(--lumo-font-size-l);\n --lumo-button-size: var(--lumo-size-l);\n }\n\n /* For interaction states */\n :host::before,\n :host::after {\n content: '';\n /* We rely on the host always being relative */\n position: absolute;\n z-index: 1;\n inset: 0;\n background-color: currentColor;\n border-radius: inherit;\n opacity: 0;\n pointer-events: none;\n }\n\n /* Hover */\n\n @media (any-hover: hover) {\n :host(:hover)::before {\n opacity: 0.02;\n }\n }\n\n /* Active */\n\n :host::after {\n transition: opacity 1.4s, transform 0.1s;\n filter: blur(8px);\n }\n\n :host([active])::before {\n opacity: 0.05;\n transition-duration: 0s;\n }\n\n :host([active])::after {\n opacity: 0.1;\n transition-duration: 0s, 0s;\n transform: scale(0);\n }\n\n /* Keyboard focus */\n\n :host([focus-ring]) {\n box-shadow: 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);\n }\n\n :host([theme~='primary'][focus-ring]) {\n box-shadow: 0 0 0 1px var(--lumo-base-color), 0 0 0 3px var(--lumo-primary-color-50pct);\n }\n\n /* Types (primary, tertiary, tertiary-inline */\n\n :host([theme~='tertiary']),\n :host([theme~='tertiary-inline']) {\n --_background: transparent !important;\n background: var(--vaadin-button-tertiary-background, var(--_background));\n min-width: 0;\n }\n\n :host([theme~='tertiary']) {\n border: var(--vaadin-button-tertiary-border, none);\n color: var(--vaadin-button-tertiary-text-color, var(--lumo-primary-text-color));\n font-weight: var(--vaadin-button-tertiary-font-weight, 500);\n padding: var(--vaadin-button-tertiary-padding, 0 calc(var(--_button-size) / 6));\n }\n\n :host([theme~='tertiary-inline'])::before {\n display: none;\n }\n\n :host([theme~='tertiary-inline']) {\n margin: 0;\n height: auto;\n padding: 0;\n line-height: inherit;\n font-size: inherit;\n }\n\n :host([theme~='tertiary-inline']) [part='label'] {\n padding: 0;\n overflow: visible;\n line-height: inherit;\n }\n\n :host([theme~='primary']) {\n background: var(--_lumo-button-primary-background);\n border: var(--vaadin-button-primary-border, none);\n color: var(--_lumo-button-primary-text-color);\n font-weight: var(--vaadin-button-primary-font-weight, 600);\n min-width: calc(var(--lumo-button-size) * 2.5);\n }\n\n :host([theme~='primary'])::before {\n background-color: black;\n }\n\n @media (any-hover: hover) {\n :host([theme~='primary']:hover)::before {\n opacity: 0.05;\n }\n }\n\n :host([theme~='primary'][active])::before {\n opacity: 0.1;\n }\n\n :host([theme~='primary'][active])::after {\n opacity: 0.2;\n }\n\n /* Colors (success, error, contrast) */\n\n :host([theme~='success']) {\n color: var(--lumo-success-text-color);\n }\n\n :host([theme~='success'][theme~='primary']) {\n background-color: var(--lumo-success-color);\n color: var(--lumo-success-contrast-color);\n }\n\n :host([theme~='error']) {\n color: var(--lumo-error-text-color);\n }\n\n :host([theme~='error'][theme~='primary']) {\n background-color: var(--lumo-error-color);\n color: var(--lumo-error-contrast-color);\n }\n\n :host([theme~='contrast']) {\n color: var(--lumo-contrast);\n }\n\n :host([theme~='contrast'][theme~='primary']) {\n background-color: var(--lumo-contrast);\n color: var(--lumo-base-color);\n }\n\n /* Disabled state. Keep selectors after other color variants. */\n\n :host([disabled]) {\n pointer-events: none;\n color: var(--lumo-disabled-text-color);\n }\n\n :host([theme~='primary'][disabled]) {\n background-color: var(--lumo-contrast-30pct);\n color: var(--lumo-base-color);\n }\n\n :host([theme~='primary'][disabled]) [part] {\n opacity: 0.7;\n }\n\n /* Icons */\n\n [part] ::slotted(vaadin-icon) {\n display: inline-block;\n width: var(--lumo-icon-size-m);\n height: var(--lumo-icon-size-m);\n }\n\n /* Vaadin icons are based on a 16x16 grid (unlike Lumo and Material icons with 24x24), so they look too big by default */\n [part] ::slotted(vaadin-icon[icon^='vaadin:']) {\n padding: 0.25em;\n box-sizing: border-box !important;\n }\n\n [part='prefix'] {\n margin-left: -0.25em;\n margin-right: 0.25em;\n }\n\n [part='suffix'] {\n margin-left: 0.25em;\n margin-right: -0.25em;\n }\n\n /* Icon-only */\n\n :host([theme~='icon']:not([theme~='tertiary-inline'])) {\n min-width: var(--lumo-button-size);\n padding-left: calc(var(--lumo-button-size) / 4);\n padding-right: calc(var(--lumo-button-size) / 4);\n }\n\n :host([theme~='icon']) [part='prefix'],\n :host([theme~='icon']) [part='suffix'] {\n margin-left: 0;\n margin-right: 0;\n }\n\n /* RTL specific styles */\n\n :host([dir='rtl']) [part='prefix'] {\n margin-left: 0.25em;\n margin-right: -0.25em;\n }\n\n :host([dir='rtl']) [part='suffix'] {\n margin-left: -0.25em;\n margin-right: 0.25em;\n }\n\n :host([dir='rtl'][theme~='icon']) [part='prefix'],\n :host([dir='rtl'][theme~='icon']) [part='suffix'] {\n margin-left: 0;\n margin-right: 0;\n }\n`;\n\nregisterStyles('vaadin-button', button, { moduleId: 'lumo-button' });\n\nexport { button };\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 },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(\n createProxy({\n slots: [],\n wrappedEleName: 'descope-image',\n style: () => `\n :host {\n display: inline-flex;\n }\n `,\n excludeAttrsSync: ['tabindex', 'class'],\n componentName,\n }),\n);\n"],"names":["componentName","srcAttrs","RawImage","baseSelector","observedAttributes","constructor","super","this","attachShadow","mode","innerHTML","init","toggleVisibility","src","onThemeChange","renderImage","isVisible","classList","remove","add","altText","getAttribute","legacySrc","themeSrc","currentThemeName","updateFillColor","node","querySelectorAll","forEach","ele","setAttribute","ImageClass","cssVarList","fill","then","res","appendChild","shouldRender","srcVal","attributeChangedCallback","attrName","oldValue","newValue","mappings","height","selector","width","clickableMixin","superclass","isLoading","click","RawSelectItem","createBaseClass","size","variant","value","baseElement","includeAttrs","handleFocus","shadowRoot","querySelector","focus","addEventListener","e","isTrusted","ButtonSelectionGroupItemClass","hostDirection","ButtonClass","property","backgroundColor","labelTextColor","borderColor","borderWidth","borderStyle","borderRadius","outlineColor","customElements","define","createSvgEle","text","clean","sanitize","USE_PROFILES","svg","svgFilters","ADD_TAGS","FORBID_TAGS","DOMParser","parseFromString","createImage","async","startsWith","isBase64Svg","svgXml","atob","slice","base64Prefix","path","match","getFileExtension","fetchedSrc","fetch","document","createElement","createImgEle","style","setProperty","host","label","slottedIcon","loadingIndicatorStyles","hostWidth","hostHeight","fontSize","fontFamily","cursor","outlineOffset","outlineStyle","outlineWidth","verticalPadding","horizontalPadding","fallback","iconColor","labelTextDecoration","labelSpacing","textAlign","iconSize","slots","wrappedEleName","excludeAttrsSync","color","buttonStyles","ButtonMixin","superClass","properties","tabindex","type","Number","reflectToAttribute","_activeKeys","ready","hasAttribute","_onKeyDown","event","altKey","shiftKey","ctrlKey","metaKey","includes","key","preventDefault","moduleId","Button","is","template","_tooltipController","addController","button","IconClass"],"sourceRoot":""}
|
@@ -1,5 +1,5 @@
|
|
1
1
|
/*! For license information please see descope-button.js.LICENSE.txt */
|
2
|
-
"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[5087],{8512:(t,e,r)=>{r.d(e,{T:()=>l,q:()=>h});var o=r(88961),i=r(72270),n=r(63200),a=r(25964),s=r(18782);const l=(0,a.xE)("image"),c=["src","src-dark"];class d extends((0,i.qu)({componentName:l,baseSelector:"slot"})){static get observedAttributes(){return c}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<slot></slot>\n\t",(0,a.fz)("\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n :host > slot {\n width: 100%;\n height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n ::slotted(*) {\n width: 100%;\n\t\t\t}\n\n .hidden {\n display: none;\n }\n ",this)}init(){super.init?.(),this.toggleVisibility(this.src)}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 src(){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.src),(0,s.m)(this.src,this.altText).then((t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))}))}shouldRender(t){const e=this.getAttribute(t);return this.src===e}attributeChangedCallback(t,e,r){super.attributeChangedCallback?.(t,e,r),e!==r&&this.shouldRender(t)&&this.renderImage()}}const h=(0,n.Zz)((0,o.RF)({mappings:{fill:{},height:{selector:()=>":host"},width:{selector:()=>":host"}}}),o.VO,o.tQ)(d)},10767:(t,e,r)=>{r.d(e,{G:()=>o});const o=t=>class extends t{get isLoading(){return"true"===this.getAttribute("loading")}click(){this.isLoading||super.click()}}},18782:(t,e,r)=>{r.d(e,{m:()=>n});var o=r(25414);const i=t=>{const e=o.A.sanitize(t,{USE_PROFILES:{svg:!0,svgFilters:!0},ADD_TAGS:["image"],FORBID_TAGS:["defs"]});return(new DOMParser).parseFromString(e,"image/svg+xml").querySelector("svg")},n=async(t,e)=>{try{let r;if((t=>t.startsWith("data:image/svg+xml;base64,"))(t)){const e=atob(t.slice(26));r=i(e)}else if("svg"===(t=>{const e=t.match(/\.([0-9a-z]+)(?:[\\?#]|$)/i);return e?e[1]:null})(t)){const e=await fetch(t),o=await e.text();r=i(o)}else r=((t,e)=>{const r=document.createElement("img");return r.setAttribute("src",t),r.setAttribute("alt",e),r})(t,e);return r.style.setProperty("max-width","100%"),r.style.setProperty("max-height","100%"),r}catch{return null}}},19624:(t,e,r)=>{r.d(e,{J:()=>m,T:()=>l});var o=r(63200),i=r(25964),n=r(88961),a=r(98538),s=r(10767);const l=(0,i.xE)("button"),{host:c,label:d,slottedIcon:h}={host:{selector:()=>":host"},label:{selector:"::part(label)"},slottedIcon:{selector:()=>"::slotted(descope-icon)"}};let u;const m=(0,o.Zz)((0,n.RF)({mappings:{hostWidth:{property:"width"},hostHeight:{property:"height"},hostDirection:{...c,property:"direction"},fontSize:{},fontFamily:{},cursor:{},backgroundColor:{},outlineOffset:{},outlineColor:{},outlineStyle:{},outlineWidth:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-right",fallback:"0.875em"},{property:"padding-left",fallback:"0.875em"}],labelTextColor:{property:"color"},iconColor:{selector:()=>"::slotted(*)",property:a.S.cssVarList.fill},labelTextDecoration:{...d,property:"text-decoration"},labelSpacing:{...d,property:"gap"},textAlign:{...d,property:"justify-content",fallback:"center"},iconSize:[{...h,property:"width"},{...h,property:"height"}]}}),s.G,n.VO,n.tQ)((0,n.tz)({slots:["","prefix","label","suffix"],wrappedEleName:"vaadin-button",style:()=>`\n\t\t\t\n\t:host {\n\t\tdisplay: inline-block;\n\t\tbox-sizing: border-box;\n\t}\n\tvaadin-button::before,\n\tvaadin-button::after {\n\t\topacity: 0;\n\t}\n\tvaadin-button {\n\t\tmargin: 0;\n\t\tmin-width: 0;\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tbox-shadow: none;\n\t}\n\tvaadin-button::part(label) {\n\t\tpadding: 0;\n width: 100%;\n\t}\n\tvaadin-button::part(prefix) {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n\n\t\t\t\n\tvaadin-button::part(prefix),\n\tvaadin-button::part(label) {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n\n\t\t\t${u}\n\t\t\tvaadin-button::part(label) { pointer-events: none; }\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${m.cssVarList.outlineWidth}) + var(${m.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width="true"]) {\n width: var(${m.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${m.cssVarList.hostHeight}) - var(${m.cssVarList.outlineWidth}) - var(${m.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square="true"]:not([full-width="true"]) {\n\t\t\t\twidth: calc(var(${m.cssVarList.hostWidth}) - var(${m.cssVarList.outlineWidth}) - var(${m.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:l})),{color:p,fontSize:b}=m.cssVarList;u=`\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading="true"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${p});\n\t\ttop: calc(50% - (var(${b}) / 2));\n\t\tleft: calc(50% - (var(${b}) / 2));\n\t\tborder-width: calc(var(${b}) / 10);\n\t\twidth: var(${b});\n\t\theight: var(${b});\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`},30576:(t,e,r)=>{r.r(e),r.d(e,{ButtonClass:()=>o.J,componentName:()=>o.T});var o=r(19624);r(83799),customElements.define(o.T,o.J)},83799:(t,e,r)=>{r(93555),r(89389)},89389:(t,e,r)=>{r.d(e,{$:()=>p});var o=r(13256),i=r(55774),n=r(82901),a=r(90676),s=r(81488),l=r(87550);const c=r(51450).AH`
|
2
|
+
"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[5087],{8512:(t,e,r)=>{r.d(e,{T:()=>l,q:()=>h});var o=r(88961),i=r(72270),n=r(63200),a=r(25964),s=r(18782);const l=(0,a.xE)("image"),c=["src","src-dark"];class d extends((0,i.qu)({componentName:l,baseSelector:"slot"})){static get observedAttributes(){return c}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<slot></slot>\n\t",(0,a.fz)("\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n :host > slot {\n width: 100%;\n height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n ::slotted(*) {\n width: 100%;\n\t\t\t}\n\n .hidden {\n display: none;\n }\n ",this)}init(){super.init?.(),this.toggleVisibility(this.src)}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 src(){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.src),(0,s.m)(this.src,this.altText).then((t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))}))}shouldRender(t){const e=this.getAttribute(t);return this.src===e}attributeChangedCallback(t,e,r){super.attributeChangedCallback?.(t,e,r),e!==r&&this.shouldRender(t)&&this.renderImage()}}const h=(0,n.Zz)((0,o.RF)({mappings:{fill:{},height:{selector:()=>":host"},width:{selector:()=>":host"}}}),o.VO,o.tQ)(d)},10767:(t,e,r)=>{r.d(e,{G:()=>o});const o=t=>class extends t{get isLoading(){return"true"===this.getAttribute("loading")}click(){this.isLoading||super.click()}}},18782:(t,e,r)=>{r.d(e,{m:()=>n});var o=r(25414);const i=t=>{const e=o.A.sanitize(t,{USE_PROFILES:{svg:!0,svgFilters:!0},ADD_TAGS:["image"],FORBID_TAGS:["defs"]});return(new DOMParser).parseFromString(e,"image/svg+xml").querySelector("svg")},n=async(t,e)=>{try{let r;if((t=>t.startsWith("data:image/svg+xml;base64,"))(t)){const e=atob(t.slice(26));r=i(e)}else if("svg"===(t=>{const e=t.match(/\.([0-9a-z]+)(?:[\\?#]|$)/i);return e?e[1]:null})(t)){const e=await fetch(t),o=await e.text();r=i(o)}else r=((t,e)=>{const r=document.createElement("img");return r.setAttribute("src",t),r.setAttribute("alt",e),r})(t,e);return r.style.setProperty("max-width","100%"),r.style.setProperty("max-height","100%"),r}catch{return null}}},19624:(t,e,r)=>{r.d(e,{J:()=>m,T:()=>l});var o=r(63200),i=r(25964),n=r(88961),a=r(98538),s=r(10767);const l=(0,i.xE)("button"),{host:c,label:d,slottedIcon:h}={host:{selector:()=>":host"},label:{selector:"::part(label)"},slottedIcon:{selector:()=>"::slotted(descope-icon)"}};let u;const m=(0,o.Zz)((0,n.RF)({mappings:{hostWidth:{property:"width"},hostHeight:{property:"height"},hostDirection:{...c,property:"direction"},fontSize:{},fontFamily:{},cursor:{},backgroundColor:{},outlineOffset:{},outlineColor:{},outlineStyle:{},outlineWidth:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-right",fallback:"0.875em"},{property:"padding-left",fallback:"0.875em"}],labelTextColor:{property:"color"},iconColor:{selector:()=>"::slotted(*)",property:a.S.cssVarList.fill},labelTextDecoration:{...d,property:"text-decoration"},labelSpacing:{...d,property:"gap"},textAlign:{...d,property:"justify-content",fallback:"center"},iconSize:[{...h,property:"width"},{...h,property:"height"}]}}),s.G,n.VO,n.tQ)((0,n.tz)({slots:["","prefix","label","suffix"],wrappedEleName:"vaadin-button",style:()=>`\n\t\t\t\n\t:host {\n\t\tdisplay: inline-block;\n\t\tbox-sizing: border-box;\n\t}\n\tvaadin-button::before,\n\tvaadin-button::after {\n\t\topacity: 0;\n\t}\n\tvaadin-button {\n\t\tmargin: 0;\n\t\tmin-width: 0;\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tbox-shadow: none;\n\t}\n\tvaadin-button::part(label) {\n\t\tpadding: 0;\n width: 100%;\n\t}\n\tvaadin-button::part(prefix) {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n\n\t\t\t\n\tvaadin-button::part(prefix),\n\tvaadin-button::part(label) {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n\n\t\t\t${u}\n\t\t\tvaadin-button::part(label) { pointer-events: none; }\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${m.cssVarList.outlineWidth}) + var(${m.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width="true"]) {\n width: var(${m.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${m.cssVarList.hostHeight}) - var(${m.cssVarList.outlineWidth}) - var(${m.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square="true"]:not([full-width="true"]) {\n\t\t\t\twidth: calc(var(${m.cssVarList.hostWidth}) - var(${m.cssVarList.outlineWidth}) - var(${m.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex","class"],componentName:l})),{color:p,fontSize:b}=m.cssVarList;u=`\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading="true"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${p});\n\t\ttop: calc(50% - (var(${b}) / 2));\n\t\tleft: calc(50% - (var(${b}) / 2));\n\t\tborder-width: calc(var(${b}) / 10);\n\t\twidth: var(${b});\n\t\theight: var(${b});\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`},30576:(t,e,r)=>{r.r(e),r.d(e,{ButtonClass:()=>o.J,componentName:()=>o.T});var o=r(19624);r(83799),customElements.define(o.T,o.J)},83799:(t,e,r)=>{r(93555),r(89389)},89389:(t,e,r)=>{r.d(e,{$:()=>p});var o=r(13256),i=r(55774),n=r(82901),a=r(90676),s=r(81488),l=r(87550);const c=r(51450).AH`
|
3
3
|
:host {
|
4
4
|
display: inline-block;
|
5
5
|
position: relative;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"descope-button.js","mappings":"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","sources":["webpack://@descope/web-components-ui/../components/descope-image/src/component/ImageClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/clickableMixin.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/helpers.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/ButtonClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/index.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button-base.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button-mixin.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/theme/lumo/vaadin-button-styles.js","webpack://@descope/web-components-ui/../components/descope-icon/src/component/IconClass.js"],"sourcesContent":["/* eslint-disable no-use-before-define */\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.src);\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 src() {\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 // eslint-disable-next-line class-methods-use-this\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.src);\n\n createImage(this.src, 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.src === 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","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 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 { compose } from '@descope-ui/common/utils';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport {\n createStyleMixin,\n draggableMixin,\n createProxy,\n componentNameValidationMixin,\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 createStyleMixin({\n mappings: {\n hostWidth: { property: 'width' },\n hostHeight: { property: 'height' },\n hostDirection: { ...host, property: 'direction' },\n fontSize: {},\n fontFamily: {},\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: [{ property: 'padding-top' }, { property: 'padding-bottom' }],\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\t\tselector: () => `::slotted(*)`,\n\t\tproperty: IconClass.cssVarList.fill\n\t },\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'],\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","import { componentName, ButtonClass } from './ButtonClass';\nimport '@vaadin/button';\n\ncustomElements.define(componentName, ButtonClass);\n\nexport { ButtonClass, componentName };\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { css } from 'lit';\n\nexport const buttonStyles = css`\n :host {\n display: inline-block;\n position: relative;\n outline: none;\n white-space: nowrap;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n }\n\n :host([hidden]) {\n display: none !important;\n }\n\n /* Aligns the button with form fields when placed on the same line.\n Note, to make it work, the form fields should have the same \"::before\" pseudo-element. */\n .vaadin-button-container::before {\n content: '\\\\2003';\n display: inline-block;\n width: 0;\n max-height: 100%;\n }\n\n .vaadin-button-container {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n width: 100%;\n height: 100%;\n min-height: inherit;\n text-shadow: inherit;\n }\n\n [part='prefix'],\n [part='suffix'] {\n flex: none;\n }\n\n [part='label'] {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n @media (forced-colors: active) {\n :host {\n outline: 1px solid;\n outline-offset: -1px;\n }\n\n :host([focused]) {\n outline-width: 2px;\n }\n\n :host([disabled]) {\n outline-color: GrayText;\n }\n }\n`;\n\nexport const buttonTemplate = (html) => html`\n <div class=\"vaadin-button-container\">\n <span part=\"prefix\" aria-hidden=\"true\">\n <slot name=\"prefix\"></slot>\n </span>\n <span part=\"label\">\n <slot></slot>\n </span>\n <span part=\"suffix\" aria-hidden=\"true\">\n <slot name=\"suffix\"></slot>\n </span>\n </div>\n <slot name=\"tooltip\"></slot>\n`;\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { ActiveMixin } from '@vaadin/a11y-base/src/active-mixin.js';\nimport { FocusMixin } from '@vaadin/a11y-base/src/focus-mixin.js';\nimport { TabindexMixin } from '@vaadin/a11y-base/src/tabindex-mixin.js';\n\n/**\n * A mixin providing common button functionality.\n *\n * @polymerMixin\n * @mixes ActiveMixin\n * @mixes FocusMixin\n * @mixes TabindexMixin\n */\nexport const ButtonMixin = (superClass) =>\n class ButtonMixinClass extends ActiveMixin(TabindexMixin(FocusMixin(superClass))) {\n static get properties() {\n return {\n /**\n * Indicates whether the element can be focused and where it participates in sequential keyboard navigation.\n *\n * @override\n * @protected\n */\n tabindex: {\n type: Number,\n value: 0,\n reflectToAttribute: true,\n },\n };\n }\n\n /**\n * By default, `Space` is the only possible activation key for a focusable HTML element.\n * Nonetheless, the button is an exception as it can be also activated by pressing `Enter`.\n * See the \"Keyboard Support\" section in https://www.w3.org/TR/wai-aria-practices/examples/button/button.html.\n *\n * @protected\n * @override\n */\n get _activeKeys() {\n return ['Enter', ' '];\n }\n\n /** @protected */\n ready() {\n super.ready();\n\n // By default, if the user hasn't provided a custom role,\n // the role attribute is set to \"button\".\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'button');\n }\n }\n\n /**\n * Since the button component is designed on the base of the `[role=button]` attribute,\n * and doesn't have a native <button> inside, in order to be fully accessible from the keyboard,\n * it should manually fire the `click` event once an activation key is pressed,\n * as it follows from the WAI-ARIA specifications:\n * https://www.w3.org/TR/wai-aria-practices-1.1/#button\n *\n * According to the UI Events specifications,\n * the `click` event should be fired exactly on `keydown`:\n * https://www.w3.org/TR/uievents/#event-type-keydown\n *\n * @param {KeyboardEvent} event\n * @protected\n * @override\n */\n _onKeyDown(event) {\n super._onKeyDown(event);\n\n if (event.altKey || event.shiftKey || event.ctrlKey || event.metaKey) {\n return;\n }\n\n if (this._activeKeys.includes(event.key)) {\n event.preventDefault();\n\n // `DisabledMixin` overrides the standard `click()` method\n // so that it doesn't fire the `click` event when the element is disabled.\n this.click();\n }\n }\n };\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { ControllerMixin } from '@vaadin/component-base/src/controller-mixin.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';\nimport { TooltipController } from '@vaadin/component-base/src/tooltip-controller.js';\nimport { registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { buttonStyles, buttonTemplate } from './vaadin-button-base.js';\nimport { ButtonMixin } from './vaadin-button-mixin.js';\n\nregisterStyles('vaadin-button', buttonStyles, { moduleId: 'vaadin-button-styles' });\n\n/**\n * `<vaadin-button>` is an accessible and customizable button that allows users to perform actions.\n *\n * ```html\n * <vaadin-button>Press me</vaadin-button>\n * ```\n *\n * ### Styling\n *\n * The following shadow DOM parts are available for styling:\n *\n * Part name | Description\n * ----------|-------------\n * `label` | The label (text) inside the button.\n * `prefix` | A slot for content before the label (e.g. an icon).\n * `suffix` | A slot for content after the label (e.g. an icon).\n *\n * The following attributes are available for styling:\n *\n * Attribute | Description\n * -------------|-------------\n * `active` | Set when the button is pressed down, either with mouse, touch or the keyboard.\n * `disabled` | Set when the button is disabled.\n * `focus-ring` | Set when the button is focused using the keyboard.\n * `focused` | Set when the button is focused.\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ButtonMixin\n * @mixes ControllerMixin\n * @mixes ElementMixin\n * @mixes ThemableMixin\n */\nclass Button extends ButtonMixin(ElementMixin(ThemableMixin(ControllerMixin(PolymerElement)))) {\n static get is() {\n return 'vaadin-button';\n }\n\n static get template() {\n return buttonTemplate(html);\n }\n\n /** @protected */\n ready() {\n super.ready();\n\n this._tooltipController = new TooltipController(this);\n this.addController(this._tooltipController);\n }\n}\n\ndefineCustomElement(Button);\n\nexport { Button };\n","import '@vaadin/vaadin-lumo-styles/color.js';\nimport '@vaadin/vaadin-lumo-styles/sizing.js';\nimport '@vaadin/vaadin-lumo-styles/spacing.js';\nimport '@vaadin/vaadin-lumo-styles/style.js';\nimport '@vaadin/vaadin-lumo-styles/typography.js';\nimport { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\n\nconst button = css`\n :host {\n /* Sizing */\n --lumo-button-size: var(--lumo-size-m);\n min-width: var(--vaadin-button-min-width, calc(var(--_button-size) * 2));\n height: var(--_button-size);\n padding: var(--vaadin-button-padding, 0 calc(var(--_button-size) / 3 + var(--lumo-border-radius-m) / 2));\n margin: var(--vaadin-button-margin, var(--lumo-space-xs) 0);\n box-sizing: border-box;\n /* Style */\n font-family: var(--lumo-font-family);\n font-size: var(--vaadin-button-font-size, var(--lumo-font-size-m));\n font-weight: var(--vaadin-button-font-weight, 500);\n color: var(--_lumo-button-text-color);\n background: var(--_lumo-button-background);\n border: var(--vaadin-button-border, none);\n border-radius: var(--vaadin-button-border-radius, var(--lumo-border-radius-m));\n cursor: var(--lumo-clickable-cursor);\n -webkit-tap-highlight-color: transparent;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n flex-shrink: 0;\n --_button-size: var(--vaadin-button-height, var(--lumo-button-size));\n --_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-primary-color-50pct));\n --_focus-ring-width: var(--vaadin-focus-ring-width, 2px);\n /* Used by notification */\n --_lumo-button-background: var(--vaadin-button-background, var(--lumo-contrast-5pct));\n --_lumo-button-text-color: var(--vaadin-button-text-color, var(--lumo-primary-text-color));\n --_lumo-button-primary-background: var(--vaadin-button-primary-background, var(--lumo-primary-color));\n --_lumo-button-primary-text-color: var(--vaadin-button-primary-text-color, var(--lumo-primary-contrast-color));\n }\n\n /* Set only for the internal parts so we don't affect the host vertical alignment */\n [part='label'],\n [part='prefix'],\n [part='suffix'] {\n line-height: var(--lumo-line-height-xs);\n }\n\n [part='label'] {\n padding: calc(var(--lumo-button-size) / 6) 0;\n }\n\n :host([theme~='small']) {\n font-size: var(--lumo-font-size-s);\n --lumo-button-size: var(--lumo-size-s);\n }\n\n :host([theme~='large']) {\n font-size: var(--lumo-font-size-l);\n --lumo-button-size: var(--lumo-size-l);\n }\n\n /* For interaction states */\n :host::before,\n :host::after {\n content: '';\n /* We rely on the host always being relative */\n position: absolute;\n z-index: 1;\n inset: 0;\n background-color: currentColor;\n border-radius: inherit;\n opacity: 0;\n pointer-events: none;\n }\n\n /* Hover */\n\n @media (any-hover: hover) {\n :host(:hover)::before {\n opacity: 0.02;\n }\n }\n\n /* Active */\n\n :host::after {\n transition: opacity 1.4s, transform 0.1s;\n filter: blur(8px);\n }\n\n :host([active])::before {\n opacity: 0.05;\n transition-duration: 0s;\n }\n\n :host([active])::after {\n opacity: 0.1;\n transition-duration: 0s, 0s;\n transform: scale(0);\n }\n\n /* Keyboard focus */\n\n :host([focus-ring]) {\n box-shadow: 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);\n }\n\n :host([theme~='primary'][focus-ring]) {\n box-shadow: 0 0 0 1px var(--lumo-base-color), 0 0 0 3px var(--lumo-primary-color-50pct);\n }\n\n /* Types (primary, tertiary, tertiary-inline */\n\n :host([theme~='tertiary']),\n :host([theme~='tertiary-inline']) {\n --_background: transparent !important;\n background: var(--vaadin-button-tertiary-background, var(--_background));\n min-width: 0;\n }\n\n :host([theme~='tertiary']) {\n border: var(--vaadin-button-tertiary-border, none);\n color: var(--vaadin-button-tertiary-text-color, var(--lumo-primary-text-color));\n font-weight: var(--vaadin-button-tertiary-font-weight, 500);\n padding: var(--vaadin-button-tertiary-padding, 0 calc(var(--_button-size) / 6));\n }\n\n :host([theme~='tertiary-inline'])::before {\n display: none;\n }\n\n :host([theme~='tertiary-inline']) {\n margin: 0;\n height: auto;\n padding: 0;\n line-height: inherit;\n font-size: inherit;\n }\n\n :host([theme~='tertiary-inline']) [part='label'] {\n padding: 0;\n overflow: visible;\n line-height: inherit;\n }\n\n :host([theme~='primary']) {\n background: var(--_lumo-button-primary-background);\n border: var(--vaadin-button-primary-border, none);\n color: var(--_lumo-button-primary-text-color);\n font-weight: var(--vaadin-button-primary-font-weight, 600);\n min-width: calc(var(--lumo-button-size) * 2.5);\n }\n\n :host([theme~='primary'])::before {\n background-color: black;\n }\n\n @media (any-hover: hover) {\n :host([theme~='primary']:hover)::before {\n opacity: 0.05;\n }\n }\n\n :host([theme~='primary'][active])::before {\n opacity: 0.1;\n }\n\n :host([theme~='primary'][active])::after {\n opacity: 0.2;\n }\n\n /* Colors (success, error, contrast) */\n\n :host([theme~='success']) {\n color: var(--lumo-success-text-color);\n }\n\n :host([theme~='success'][theme~='primary']) {\n background-color: var(--lumo-success-color);\n color: var(--lumo-success-contrast-color);\n }\n\n :host([theme~='error']) {\n color: var(--lumo-error-text-color);\n }\n\n :host([theme~='error'][theme~='primary']) {\n background-color: var(--lumo-error-color);\n color: var(--lumo-error-contrast-color);\n }\n\n :host([theme~='contrast']) {\n color: var(--lumo-contrast);\n }\n\n :host([theme~='contrast'][theme~='primary']) {\n background-color: var(--lumo-contrast);\n color: var(--lumo-base-color);\n }\n\n /* Disabled state. Keep selectors after other color variants. */\n\n :host([disabled]) {\n pointer-events: none;\n color: var(--lumo-disabled-text-color);\n }\n\n :host([theme~='primary'][disabled]) {\n background-color: var(--lumo-contrast-30pct);\n color: var(--lumo-base-color);\n }\n\n :host([theme~='primary'][disabled]) [part] {\n opacity: 0.7;\n }\n\n /* Icons */\n\n [part] ::slotted(vaadin-icon) {\n display: inline-block;\n width: var(--lumo-icon-size-m);\n height: var(--lumo-icon-size-m);\n }\n\n /* Vaadin icons are based on a 16x16 grid (unlike Lumo and Material icons with 24x24), so they look too big by default */\n [part] ::slotted(vaadin-icon[icon^='vaadin:']) {\n padding: 0.25em;\n box-sizing: border-box !important;\n }\n\n [part='prefix'] {\n margin-left: -0.25em;\n margin-right: 0.25em;\n }\n\n [part='suffix'] {\n margin-left: 0.25em;\n margin-right: -0.25em;\n }\n\n /* Icon-only */\n\n :host([theme~='icon']:not([theme~='tertiary-inline'])) {\n min-width: var(--lumo-button-size);\n padding-left: calc(var(--lumo-button-size) / 4);\n padding-right: calc(var(--lumo-button-size) / 4);\n }\n\n :host([theme~='icon']) [part='prefix'],\n :host([theme~='icon']) [part='suffix'] {\n margin-left: 0;\n margin-right: 0;\n }\n\n /* RTL specific styles */\n\n :host([dir='rtl']) [part='prefix'] {\n margin-left: 0.25em;\n margin-right: -0.25em;\n }\n\n :host([dir='rtl']) [part='suffix'] {\n margin-left: -0.25em;\n margin-right: 0.25em;\n }\n\n :host([dir='rtl'][theme~='icon']) [part='prefix'],\n :host([dir='rtl'][theme~='icon']) [part='suffix'] {\n margin-left: 0;\n margin-right: 0;\n }\n`;\n\nregisterStyles('vaadin-button', button, { moduleId: 'lumo-button' });\n\nexport { button };\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 },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(\n createProxy({\n slots: [],\n wrappedEleName: 'descope-image',\n style: () => `\n :host {\n display: inline-flex;\n }\n `,\n excludeAttrsSync: ['tabindex', 'class'],\n componentName,\n }),\n);\n"],"names":["componentName","srcAttrs","RawImage","baseSelector","observedAttributes","constructor","super","this","attachShadow","mode","innerHTML","init","toggleVisibility","src","onThemeChange","renderImage","isVisible","classList","remove","add","altText","getAttribute","legacySrc","themeSrc","currentThemeName","updateFillColor","node","querySelectorAll","forEach","ele","setAttribute","ImageClass","cssVarList","fill","then","res","appendChild","shouldRender","srcVal","attributeChangedCallback","attrName","oldValue","newValue","mappings","height","selector","width","clickableMixin","superclass","isLoading","click","createSvgEle","text","clean","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","style","setProperty","host","label","slottedIcon","loadingIndicatorStyles","ButtonClass","hostWidth","property","hostHeight","hostDirection","fontSize","fontFamily","cursor","backgroundColor","outlineOffset","outlineColor","outlineStyle","outlineWidth","borderRadius","borderColor","borderStyle","borderWidth","verticalPadding","horizontalPadding","fallback","labelTextColor","iconColor","labelTextDecoration","labelSpacing","textAlign","iconSize","slots","wrappedEleName","excludeAttrsSync","color","customElements","define","buttonStyles","ButtonMixin","superClass","properties","tabindex","type","Number","value","reflectToAttribute","_activeKeys","ready","hasAttribute","_onKeyDown","event","altKey","shiftKey","ctrlKey","metaKey","includes","key","preventDefault","moduleId","Button","is","template","_tooltipController","addController","button","IconClass"],"sourceRoot":""}
|
1
|
+
{"version":3,"file":"descope-button.js","mappings":"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","sources":["webpack://@descope/web-components-ui/../components/descope-image/src/component/ImageClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/clickableMixin.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/helpers.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/ButtonClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/index.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button-base.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button-mixin.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/src/vaadin-button.js","webpack://@descope/web-components-ui/../../../node_modules/@vaadin/button/theme/lumo/vaadin-button-styles.js","webpack://@descope/web-components-ui/../components/descope-icon/src/component/IconClass.js"],"sourcesContent":["/* eslint-disable no-use-before-define */\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.src);\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 src() {\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 // eslint-disable-next-line class-methods-use-this\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.src);\n\n createImage(this.src, 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.src === 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","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 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 { compose } from '@descope-ui/common/utils';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport {\n createStyleMixin,\n draggableMixin,\n createProxy,\n componentNameValidationMixin,\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 createStyleMixin({\n mappings: {\n hostWidth: { property: 'width' },\n hostHeight: { property: 'height' },\n hostDirection: { ...host, property: 'direction' },\n fontSize: {},\n fontFamily: {},\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: [{ property: 'padding-top' }, { property: 'padding-bottom' }],\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\t\tselector: () => `::slotted(*)`,\n\t\tproperty: IconClass.cssVarList.fill\n\t },\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'],\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","import { componentName, ButtonClass } from './ButtonClass';\nimport '@vaadin/button';\n\ncustomElements.define(componentName, ButtonClass);\n\nexport { ButtonClass, componentName };\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { css } from 'lit';\n\nexport const buttonStyles = css`\n :host {\n display: inline-block;\n position: relative;\n outline: none;\n white-space: nowrap;\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n }\n\n :host([hidden]) {\n display: none !important;\n }\n\n /* Aligns the button with form fields when placed on the same line.\n Note, to make it work, the form fields should have the same \"::before\" pseudo-element. */\n .vaadin-button-container::before {\n content: '\\\\2003';\n display: inline-block;\n width: 0;\n max-height: 100%;\n }\n\n .vaadin-button-container {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n width: 100%;\n height: 100%;\n min-height: inherit;\n text-shadow: inherit;\n }\n\n [part='prefix'],\n [part='suffix'] {\n flex: none;\n }\n\n [part='label'] {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n @media (forced-colors: active) {\n :host {\n outline: 1px solid;\n outline-offset: -1px;\n }\n\n :host([focused]) {\n outline-width: 2px;\n }\n\n :host([disabled]) {\n outline-color: GrayText;\n }\n }\n`;\n\nexport const buttonTemplate = (html) => html`\n <div class=\"vaadin-button-container\">\n <span part=\"prefix\" aria-hidden=\"true\">\n <slot name=\"prefix\"></slot>\n </span>\n <span part=\"label\">\n <slot></slot>\n </span>\n <span part=\"suffix\" aria-hidden=\"true\">\n <slot name=\"suffix\"></slot>\n </span>\n </div>\n <slot name=\"tooltip\"></slot>\n`;\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { ActiveMixin } from '@vaadin/a11y-base/src/active-mixin.js';\nimport { FocusMixin } from '@vaadin/a11y-base/src/focus-mixin.js';\nimport { TabindexMixin } from '@vaadin/a11y-base/src/tabindex-mixin.js';\n\n/**\n * A mixin providing common button functionality.\n *\n * @polymerMixin\n * @mixes ActiveMixin\n * @mixes FocusMixin\n * @mixes TabindexMixin\n */\nexport const ButtonMixin = (superClass) =>\n class ButtonMixinClass extends ActiveMixin(TabindexMixin(FocusMixin(superClass))) {\n static get properties() {\n return {\n /**\n * Indicates whether the element can be focused and where it participates in sequential keyboard navigation.\n *\n * @override\n * @protected\n */\n tabindex: {\n type: Number,\n value: 0,\n reflectToAttribute: true,\n },\n };\n }\n\n /**\n * By default, `Space` is the only possible activation key for a focusable HTML element.\n * Nonetheless, the button is an exception as it can be also activated by pressing `Enter`.\n * See the \"Keyboard Support\" section in https://www.w3.org/TR/wai-aria-practices/examples/button/button.html.\n *\n * @protected\n * @override\n */\n get _activeKeys() {\n return ['Enter', ' '];\n }\n\n /** @protected */\n ready() {\n super.ready();\n\n // By default, if the user hasn't provided a custom role,\n // the role attribute is set to \"button\".\n if (!this.hasAttribute('role')) {\n this.setAttribute('role', 'button');\n }\n }\n\n /**\n * Since the button component is designed on the base of the `[role=button]` attribute,\n * and doesn't have a native <button> inside, in order to be fully accessible from the keyboard,\n * it should manually fire the `click` event once an activation key is pressed,\n * as it follows from the WAI-ARIA specifications:\n * https://www.w3.org/TR/wai-aria-practices-1.1/#button\n *\n * According to the UI Events specifications,\n * the `click` event should be fired exactly on `keydown`:\n * https://www.w3.org/TR/uievents/#event-type-keydown\n *\n * @param {KeyboardEvent} event\n * @protected\n * @override\n */\n _onKeyDown(event) {\n super._onKeyDown(event);\n\n if (event.altKey || event.shiftKey || event.ctrlKey || event.metaKey) {\n return;\n }\n\n if (this._activeKeys.includes(event.key)) {\n event.preventDefault();\n\n // `DisabledMixin` overrides the standard `click()` method\n // so that it doesn't fire the `click` event when the element is disabled.\n this.click();\n }\n }\n };\n","/**\n * @license\n * Copyright (c) 2017 - 2023 Vaadin Ltd.\n * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/\n */\nimport { html, PolymerElement } from '@polymer/polymer/polymer-element.js';\nimport { ControllerMixin } from '@vaadin/component-base/src/controller-mixin.js';\nimport { defineCustomElement } from '@vaadin/component-base/src/define.js';\nimport { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';\nimport { TooltipController } from '@vaadin/component-base/src/tooltip-controller.js';\nimport { registerStyles, ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\nimport { buttonStyles, buttonTemplate } from './vaadin-button-base.js';\nimport { ButtonMixin } from './vaadin-button-mixin.js';\n\nregisterStyles('vaadin-button', buttonStyles, { moduleId: 'vaadin-button-styles' });\n\n/**\n * `<vaadin-button>` is an accessible and customizable button that allows users to perform actions.\n *\n * ```html\n * <vaadin-button>Press me</vaadin-button>\n * ```\n *\n * ### Styling\n *\n * The following shadow DOM parts are available for styling:\n *\n * Part name | Description\n * ----------|-------------\n * `label` | The label (text) inside the button.\n * `prefix` | A slot for content before the label (e.g. an icon).\n * `suffix` | A slot for content after the label (e.g. an icon).\n *\n * The following attributes are available for styling:\n *\n * Attribute | Description\n * -------------|-------------\n * `active` | Set when the button is pressed down, either with mouse, touch or the keyboard.\n * `disabled` | Set when the button is disabled.\n * `focus-ring` | Set when the button is focused using the keyboard.\n * `focused` | Set when the button is focused.\n *\n * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.\n *\n * @customElement\n * @extends HTMLElement\n * @mixes ButtonMixin\n * @mixes ControllerMixin\n * @mixes ElementMixin\n * @mixes ThemableMixin\n */\nclass Button extends ButtonMixin(ElementMixin(ThemableMixin(ControllerMixin(PolymerElement)))) {\n static get is() {\n return 'vaadin-button';\n }\n\n static get template() {\n return buttonTemplate(html);\n }\n\n /** @protected */\n ready() {\n super.ready();\n\n this._tooltipController = new TooltipController(this);\n this.addController(this._tooltipController);\n }\n}\n\ndefineCustomElement(Button);\n\nexport { Button };\n","import '@vaadin/vaadin-lumo-styles/color.js';\nimport '@vaadin/vaadin-lumo-styles/sizing.js';\nimport '@vaadin/vaadin-lumo-styles/spacing.js';\nimport '@vaadin/vaadin-lumo-styles/style.js';\nimport '@vaadin/vaadin-lumo-styles/typography.js';\nimport { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';\n\nconst button = css`\n :host {\n /* Sizing */\n --lumo-button-size: var(--lumo-size-m);\n min-width: var(--vaadin-button-min-width, calc(var(--_button-size) * 2));\n height: var(--_button-size);\n padding: var(--vaadin-button-padding, 0 calc(var(--_button-size) / 3 + var(--lumo-border-radius-m) / 2));\n margin: var(--vaadin-button-margin, var(--lumo-space-xs) 0);\n box-sizing: border-box;\n /* Style */\n font-family: var(--lumo-font-family);\n font-size: var(--vaadin-button-font-size, var(--lumo-font-size-m));\n font-weight: var(--vaadin-button-font-weight, 500);\n color: var(--_lumo-button-text-color);\n background: var(--_lumo-button-background);\n border: var(--vaadin-button-border, none);\n border-radius: var(--vaadin-button-border-radius, var(--lumo-border-radius-m));\n cursor: var(--lumo-clickable-cursor);\n -webkit-tap-highlight-color: transparent;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n flex-shrink: 0;\n --_button-size: var(--vaadin-button-height, var(--lumo-button-size));\n --_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-primary-color-50pct));\n --_focus-ring-width: var(--vaadin-focus-ring-width, 2px);\n /* Used by notification */\n --_lumo-button-background: var(--vaadin-button-background, var(--lumo-contrast-5pct));\n --_lumo-button-text-color: var(--vaadin-button-text-color, var(--lumo-primary-text-color));\n --_lumo-button-primary-background: var(--vaadin-button-primary-background, var(--lumo-primary-color));\n --_lumo-button-primary-text-color: var(--vaadin-button-primary-text-color, var(--lumo-primary-contrast-color));\n }\n\n /* Set only for the internal parts so we don't affect the host vertical alignment */\n [part='label'],\n [part='prefix'],\n [part='suffix'] {\n line-height: var(--lumo-line-height-xs);\n }\n\n [part='label'] {\n padding: calc(var(--lumo-button-size) / 6) 0;\n }\n\n :host([theme~='small']) {\n font-size: var(--lumo-font-size-s);\n --lumo-button-size: var(--lumo-size-s);\n }\n\n :host([theme~='large']) {\n font-size: var(--lumo-font-size-l);\n --lumo-button-size: var(--lumo-size-l);\n }\n\n /* For interaction states */\n :host::before,\n :host::after {\n content: '';\n /* We rely on the host always being relative */\n position: absolute;\n z-index: 1;\n inset: 0;\n background-color: currentColor;\n border-radius: inherit;\n opacity: 0;\n pointer-events: none;\n }\n\n /* Hover */\n\n @media (any-hover: hover) {\n :host(:hover)::before {\n opacity: 0.02;\n }\n }\n\n /* Active */\n\n :host::after {\n transition: opacity 1.4s, transform 0.1s;\n filter: blur(8px);\n }\n\n :host([active])::before {\n opacity: 0.05;\n transition-duration: 0s;\n }\n\n :host([active])::after {\n opacity: 0.1;\n transition-duration: 0s, 0s;\n transform: scale(0);\n }\n\n /* Keyboard focus */\n\n :host([focus-ring]) {\n box-shadow: 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);\n }\n\n :host([theme~='primary'][focus-ring]) {\n box-shadow: 0 0 0 1px var(--lumo-base-color), 0 0 0 3px var(--lumo-primary-color-50pct);\n }\n\n /* Types (primary, tertiary, tertiary-inline */\n\n :host([theme~='tertiary']),\n :host([theme~='tertiary-inline']) {\n --_background: transparent !important;\n background: var(--vaadin-button-tertiary-background, var(--_background));\n min-width: 0;\n }\n\n :host([theme~='tertiary']) {\n border: var(--vaadin-button-tertiary-border, none);\n color: var(--vaadin-button-tertiary-text-color, var(--lumo-primary-text-color));\n font-weight: var(--vaadin-button-tertiary-font-weight, 500);\n padding: var(--vaadin-button-tertiary-padding, 0 calc(var(--_button-size) / 6));\n }\n\n :host([theme~='tertiary-inline'])::before {\n display: none;\n }\n\n :host([theme~='tertiary-inline']) {\n margin: 0;\n height: auto;\n padding: 0;\n line-height: inherit;\n font-size: inherit;\n }\n\n :host([theme~='tertiary-inline']) [part='label'] {\n padding: 0;\n overflow: visible;\n line-height: inherit;\n }\n\n :host([theme~='primary']) {\n background: var(--_lumo-button-primary-background);\n border: var(--vaadin-button-primary-border, none);\n color: var(--_lumo-button-primary-text-color);\n font-weight: var(--vaadin-button-primary-font-weight, 600);\n min-width: calc(var(--lumo-button-size) * 2.5);\n }\n\n :host([theme~='primary'])::before {\n background-color: black;\n }\n\n @media (any-hover: hover) {\n :host([theme~='primary']:hover)::before {\n opacity: 0.05;\n }\n }\n\n :host([theme~='primary'][active])::before {\n opacity: 0.1;\n }\n\n :host([theme~='primary'][active])::after {\n opacity: 0.2;\n }\n\n /* Colors (success, error, contrast) */\n\n :host([theme~='success']) {\n color: var(--lumo-success-text-color);\n }\n\n :host([theme~='success'][theme~='primary']) {\n background-color: var(--lumo-success-color);\n color: var(--lumo-success-contrast-color);\n }\n\n :host([theme~='error']) {\n color: var(--lumo-error-text-color);\n }\n\n :host([theme~='error'][theme~='primary']) {\n background-color: var(--lumo-error-color);\n color: var(--lumo-error-contrast-color);\n }\n\n :host([theme~='contrast']) {\n color: var(--lumo-contrast);\n }\n\n :host([theme~='contrast'][theme~='primary']) {\n background-color: var(--lumo-contrast);\n color: var(--lumo-base-color);\n }\n\n /* Disabled state. Keep selectors after other color variants. */\n\n :host([disabled]) {\n pointer-events: none;\n color: var(--lumo-disabled-text-color);\n }\n\n :host([theme~='primary'][disabled]) {\n background-color: var(--lumo-contrast-30pct);\n color: var(--lumo-base-color);\n }\n\n :host([theme~='primary'][disabled]) [part] {\n opacity: 0.7;\n }\n\n /* Icons */\n\n [part] ::slotted(vaadin-icon) {\n display: inline-block;\n width: var(--lumo-icon-size-m);\n height: var(--lumo-icon-size-m);\n }\n\n /* Vaadin icons are based on a 16x16 grid (unlike Lumo and Material icons with 24x24), so they look too big by default */\n [part] ::slotted(vaadin-icon[icon^='vaadin:']) {\n padding: 0.25em;\n box-sizing: border-box !important;\n }\n\n [part='prefix'] {\n margin-left: -0.25em;\n margin-right: 0.25em;\n }\n\n [part='suffix'] {\n margin-left: 0.25em;\n margin-right: -0.25em;\n }\n\n /* Icon-only */\n\n :host([theme~='icon']:not([theme~='tertiary-inline'])) {\n min-width: var(--lumo-button-size);\n padding-left: calc(var(--lumo-button-size) / 4);\n padding-right: calc(var(--lumo-button-size) / 4);\n }\n\n :host([theme~='icon']) [part='prefix'],\n :host([theme~='icon']) [part='suffix'] {\n margin-left: 0;\n margin-right: 0;\n }\n\n /* RTL specific styles */\n\n :host([dir='rtl']) [part='prefix'] {\n margin-left: 0.25em;\n margin-right: -0.25em;\n }\n\n :host([dir='rtl']) [part='suffix'] {\n margin-left: -0.25em;\n margin-right: 0.25em;\n }\n\n :host([dir='rtl'][theme~='icon']) [part='prefix'],\n :host([dir='rtl'][theme~='icon']) [part='suffix'] {\n margin-left: 0;\n margin-right: 0;\n }\n`;\n\nregisterStyles('vaadin-button', button, { moduleId: 'lumo-button' });\n\nexport { button };\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 },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(\n createProxy({\n slots: [],\n wrappedEleName: 'descope-image',\n style: () => `\n :host {\n display: inline-flex;\n }\n `,\n excludeAttrsSync: ['tabindex', 'class'],\n componentName,\n }),\n);\n"],"names":["componentName","srcAttrs","RawImage","baseSelector","observedAttributes","constructor","super","this","attachShadow","mode","innerHTML","init","toggleVisibility","src","onThemeChange","renderImage","isVisible","classList","remove","add","altText","getAttribute","legacySrc","themeSrc","currentThemeName","updateFillColor","node","querySelectorAll","forEach","ele","setAttribute","ImageClass","cssVarList","fill","then","res","appendChild","shouldRender","srcVal","attributeChangedCallback","attrName","oldValue","newValue","mappings","height","selector","width","clickableMixin","superclass","isLoading","click","createSvgEle","text","clean","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","style","setProperty","host","label","slottedIcon","loadingIndicatorStyles","ButtonClass","hostWidth","property","hostHeight","hostDirection","fontSize","fontFamily","cursor","backgroundColor","outlineOffset","outlineColor","outlineStyle","outlineWidth","borderRadius","borderColor","borderStyle","borderWidth","verticalPadding","horizontalPadding","fallback","labelTextColor","iconColor","labelTextDecoration","labelSpacing","textAlign","iconSize","slots","wrappedEleName","excludeAttrsSync","color","customElements","define","buttonStyles","ButtonMixin","superClass","properties","tabindex","type","Number","value","reflectToAttribute","_activeKeys","ready","hasAttribute","_onKeyDown","event","altKey","shiftKey","ctrlKey","metaKey","includes","key","preventDefault","moduleId","Button","is","template","_tooltipController","addController","button","IconClass"],"sourceRoot":""}
|