@descope/web-components-ui 3.6.0 → 3.7.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.cjs.js +689 -344
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +791 -445
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/8961.js +1 -1
- package/dist/umd/8961.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-anchored.js +2 -0
- package/dist/umd/descope-anchored.js.map +1 -0
- package/dist/umd/descope-attachment.js +1 -1
- package/dist/umd/descope-attachment.js.map +1 -1
- package/dist/umd/descope-badge.js +1 -1
- package/dist/umd/descope-badge.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-app-button.js +1 -1
- package/dist/umd/descope-outbound-app-button.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-tooltip.js +1 -1
- package/dist/umd/descope-tooltip.js.map +1 -1
- package/dist/umd/descope-trusted-devices.js +1 -1
- package/dist/umd/descope-trusted-devices.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 +4 -4
- 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/index.js +1 -1
- package/dist/umd/index.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 +33 -32
- package/src/components/descope-user-attribute/UserAttributeClass.js +58 -7
- package/src/theme/components/userAttribute.js +1 -0
- package/stories/descope-user-attribute.stories.js +18 -0
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],{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:{},fontWeight:{},cursor:{},backgroundColor:{},outlineOffset:{},outlineColor:{},outlineStyle:{},outlineWidth:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-right",fallback:"0.875em"},{property:"padding-left",fallback:"0.875em"}],labelTextColor:{property:"color"},iconColor:{selector:()=>"::slotted(*)",property:a.S.cssVarList.fill},labelTextDecoration:{...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","style"],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`},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()}}},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)},98538(t,e,o){o.d(e,{S:()=>l,T:()=>s});var r=o(88961),n=o(25964),i=o(8512),a=o(63200);const s=(0,n.xE)("icon"),l=(0,a.Zz)((0,r.RF)({mappings:{fill:[{},{property:i.q.cssVarList.fill}]}}),r.VO,r.tQ)((0,r.tz)({slots:[],wrappedEleName:"descope-image",style:()=>"\n :host {\n display: inline-flex;\n max-height: 100%;\n }\n ",excludeAttrsSync:["tabindex","class","style"],componentName:s}))},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.getSrc)}onThemeChange(){this.renderImage()}toggleVisibility(t){t?this.classList.remove("hidden"):this.classList.add("hidden")}get altText(){return this.getAttribute("alt")||""}get legacySrc(){return this.getAttribute("src")}get themeSrc(){return this.getAttribute(`src-${this.currentThemeName}`)}get getSrc(){return this.themeSrc||this.legacySrc}updateFillColor(t){[t,...t.querySelectorAll("*[fill]")].forEach(t=>{t.setAttribute("fill",`var(${h.cssVarList.fill}, ${t.getAttribute("fill")||"''"})`)})}renderImage(){this.toggleVisibility(this.getSrc),(0,s.m)(this.getSrc,this.altText).then(t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))})}shouldRender(t){const e=this.getAttribute(t);return this.getSrc===e}attributeChangedCallback(t,e,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)},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}}},15450(t,e,o){o.r(e),o.d(e,{ButtonSelectionGroupItemClass:()=>h});var r=o(19624),n=o(25964),i=o(79365),a=o(81365),s=o(9696),l=o(97810);const c=(0,l.xE)("button-selection-group-item");class d extends((0,a.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,n.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,l.EA)(this,this.baseElement,{includeAttrs:["size","variant"]}),(0,l.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,s.Zz)((0,i.RF)({mappings:{hostDirection:{selector:()=>r.J.componentName,property:r.J.cssVarList.hostDirection},backgroundColor:{selector:()=>r.J.componentName,property:r.J.cssVarList.backgroundColor},labelTextColor:{selector:()=>r.J.componentName,property:r.J.cssVarList.labelTextColor},borderColor:{selector:()=>r.J.componentName,property:r.J.cssVarList.borderColor},borderWidth:{selector:()=>r.J.componentName,property:r.J.cssVarList.borderWidth},borderStyle:{selector:()=>r.J.componentName,property:r.J.cssVarList.borderStyle},borderRadius:{selector:()=>r.J.componentName,property:r.J.cssVarList.borderRadius},outlineColor:{selector:()=>r.J.componentName,property:r.J.cssVarList.outlineColor}}}),i.VO,i.tQ)(d);o(30576),customElements.define(c,h)},89389(t,e,o){o.d(e,{$:()=>m});var r=o(13256),n=o(55774),i=o(82901),a=o(72562),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],{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.DM)({triggers:[{attr:"full-width",value:"true"}]}),(0,i.RF)({mappings:{hostWidth:{property:"width"},hostHeight:{property:"height"},hostDirection:{...c,property:"direction"},fontSize:{},fontFamily:{},fontWeight:{},cursor:{},backgroundColor:{},outlineOffset:{},outlineColor:{},outlineStyle:{},outlineWidth:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-right",fallback:"0.875em"},{property:"padding-left",fallback:"0.875em"}],labelTextColor:{property:"color"},iconColor:{selector:()=>"::slotted(*)",property:a.S.cssVarList.fill},labelTextDecoration:{...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","style"],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`},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()}}},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)},98538(t,e,o){o.d(e,{S:()=>l,T:()=>s});var r=o(88961),n=o(25964),i=o(8512),a=o(63200);const s=(0,n.xE)("icon"),l=(0,a.Zz)((0,r.RF)({mappings:{fill:[{},{property:i.q.cssVarList.fill}]}}),r.VO,r.tQ)((0,r.tz)({slots:[],wrappedEleName:"descope-image",style:()=>"\n :host {\n display: inline-flex;\n max-height: 100%;\n }\n ",excludeAttrsSync:["tabindex","class","style"],componentName:s}))},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.getSrc)}onThemeChange(){this.renderImage()}toggleVisibility(t){t?this.classList.remove("hidden"):this.classList.add("hidden")}get altText(){return this.getAttribute("alt")||""}get legacySrc(){return this.getAttribute("src")}get themeSrc(){return this.getAttribute(`src-${this.currentThemeName}`)}get getSrc(){return this.themeSrc||this.legacySrc}updateFillColor(t){[t,...t.querySelectorAll("*[fill]")].forEach(t=>{t.setAttribute("fill",`var(${h.cssVarList.fill}, ${t.getAttribute("fill")||"''"})`)})}renderImage(){this.toggleVisibility(this.getSrc),(0,s.m)(this.getSrc,this.altText).then(t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))})}shouldRender(t){const e=this.getAttribute(t);return this.getSrc===e}attributeChangedCallback(t,e,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)},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}}},15450(t,e,o){o.r(e),o.d(e,{ButtonSelectionGroupItemClass:()=>h});var r=o(19624),n=o(25964),i=o(79365),a=o(81365),s=o(9696),l=o(97810);const c=(0,l.xE)("button-selection-group-item");class d extends((0,a.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,n.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,l.EA)(this,this.baseElement,{includeAttrs:["size","variant"]}),(0,l.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,s.Zz)((0,i.RF)({mappings:{hostDirection:{selector:()=>r.J.componentName,property:r.J.cssVarList.hostDirection},backgroundColor:{selector:()=>r.J.componentName,property:r.J.cssVarList.backgroundColor},labelTextColor:{selector:()=>r.J.componentName,property:r.J.cssVarList.labelTextColor},borderColor:{selector:()=>r.J.componentName,property:r.J.cssVarList.borderColor},borderWidth:{selector:()=>r.J.componentName,property:r.J.cssVarList.borderWidth},borderStyle:{selector:()=>r.J.componentName,property:r.J.cssVarList.borderStyle},borderRadius:{selector:()=>r.J.componentName,property:r.J.cssVarList.borderRadius},outlineColor:{selector:()=>r.J.componentName,property:r.J.cssVarList.outlineColor}}}),i.VO,i.tQ)(d);o(30576),customElements.define(c,h)},89389(t,e,o){o.d(e,{$:()=>m});var r=o(13256),n=o(55774),i=o(82901),a=o(72562),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-button/src/component/ButtonClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/clickableMixin.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-icon/src/component/IconClass.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/ImageClass.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/helpers.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/../../../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"],"sourcesContent":["import { compose } from '@descope-ui/common/utils';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport {\n createStyleMixin,\n draggableMixin,\n createProxy,\n componentNameValidationMixin,\n} 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 fontWeight: {},\n\n cursor: {},\n backgroundColor: {},\n\n outlineOffset: {},\n outlineColor: {},\n outlineStyle: {},\n outlineWidth: {},\n\n borderRadius: {},\n borderColor: {},\n borderStyle: {},\n borderWidth: {},\n\n verticalPadding: [\n { property: 'padding-top' },\n { property: 'padding-bottom' },\n ],\n horizontalPadding: [\n { property: 'padding-right', fallback: '0.875em' },\n { property: 'padding-left', fallback: '0.875em' },\n ],\n\n labelTextColor: { property: 'color' },\n iconColor: {\n selector: () => `::slotted(*)`,\n property: IconClass.cssVarList.fill,\n },\n labelTextDecoration: { ...label, property: 'text-decoration' },\n labelSpacing: { ...label, property: 'gap' },\n textAlign: { ...label, property: 'justify-content', fallback: 'center' },\n\n iconSize: [\n { ...slottedIcon, property: 'width' },\n { ...slottedIcon, property: 'height' },\n ],\n },\n }),\n clickableMixin,\n draggableMixin,\n componentNameValidationMixin,\n)(\n createProxy({\n slots: ['', 'prefix', 'label', 'suffix'],\n wrappedEleName: 'vaadin-button',\n style: () => `\n\t\t\t${resetStyles}\n\t\t\t${iconStyles}\n\t\t\t${loadingIndicatorStyles}\n\t\t\t${editorOverrides}\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${ButtonClass.cssVarList.outlineWidth}) + var(${ButtonClass.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width=\"true\"]) {\n width: var(${ButtonClass.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${ButtonClass.cssVarList.hostHeight}) - var(${ButtonClass.cssVarList.outlineWidth}) - var(${ButtonClass.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square=\"true\"]:not([full-width=\"true\"]) {\n\t\t\t\twidth: calc(var(${ButtonClass.cssVarList.hostWidth}) - var(${ButtonClass.cssVarList.outlineWidth}) - var(${ButtonClass.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,\n excludeAttrsSync: ['tabindex', 'class', 'style'],\n componentName,\n }),\n);\n\nconst { color, fontSize } = ButtonClass.cssVarList;\nloadingIndicatorStyles = `\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading=\"true\"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${color});\n\t\ttop: calc(50% - (var(${fontSize}) / 2));\n\t\tleft: calc(50% - (var(${fontSize}) / 2));\n\t\tborder-width: calc(var(${fontSize}) / 10);\n\t\twidth: var(${fontSize});\n\t\theight: var(${fontSize});\n\t}\n\t:host([disabled=\"true\"]),\n\t:host([loading=\"true\"]) {\n\t\tpointer-events: none;\n\t}\n\t:host([loading=\"true\"]) ::part(prefix),\n\t:host([loading=\"true\"]) ::part(label) {\n\t\tvisibility: hidden;\n\t}\n`;\n","export const clickableMixin = (superclass) =>\n class ClickableMixinClass extends superclass {\n get isLoading() {\n return this.getAttribute('loading') === 'true';\n }\n\n click() {\n this.isLoading || super.click();\n }\n };\n","import { componentName, ButtonClass } from './ButtonClass';\nimport '@vaadin/button';\n\ncustomElements.define(componentName, ButtonClass);\n\nexport { ButtonClass, componentName };\n","import {\n componentNameValidationMixin,\n createProxy,\n createStyleMixin,\n draggableMixin,\n} from '@descope-ui/common/components-mixins';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport { ImageClass } from '@descope-ui/descope-image/class';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('icon');\n\nexport const IconClass = compose(\n createStyleMixin({\n mappings: {\n fill: [{}, { property: ImageClass.cssVarList.fill }],\n },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(\n createProxy({\n slots: [],\n wrappedEleName: 'descope-image',\n style: () => `\n :host {\n display: inline-flex;\n max-height: 100%;\n }\n `,\n excludeAttrsSync: ['tabindex', 'class', 'style'],\n componentName,\n }),\n);\n","/* 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.getSrc);\n }\n\n onThemeChange() {\n this.renderImage();\n }\n\n toggleVisibility(isVisible) {\n if (isVisible) {\n this.classList.remove('hidden');\n } else {\n this.classList.add('hidden');\n }\n }\n\n get altText() {\n return this.getAttribute('alt') || '';\n }\n\n get legacySrc() {\n return this.getAttribute('src');\n }\n\n get themeSrc() {\n return this.getAttribute(`src-${this.currentThemeName}`);\n }\n\n get getSrc() {\n return this.themeSrc || this.legacySrc;\n }\n\n // in order to fill an SVG with `currentColor` override all of its `fill` and `path` nodes\n // with the value from the `st-fill` attribute\n // 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.getSrc);\n\n createImage(this.getSrc, this.altText).then((res) => {\n this.innerHTML = '';\n if (res) {\n this.updateFillColor(res);\n this.appendChild(res);\n }\n });\n }\n\n // render only when src attribute matches current theme\n shouldRender(src) {\n const srcVal = this.getAttribute(src);\n return this.getSrc === srcVal;\n }\n\n attributeChangedCallback(attrName, oldValue, newValue) {\n super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n if (oldValue === newValue) return;\n\n if (this.shouldRender(attrName)) {\n this.renderImage();\n }\n }\n}\n\nexport const ImageClass = compose(\n createStyleMixin({\n mappings: {\n fill: {},\n height: { selector: () => ':host' },\n width: { selector: () => ':host' },\n },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(RawImage);\n","import DOMPurify from 'dompurify';\n\nconst getFileExtension = (path) => {\n const match = path.match(/\\.([0-9a-z]+)(?:[\\\\?#]|$)/i);\n return match ? match[1] : null;\n};\n\nconst base64Prefix = 'data:image/svg+xml;base64,';\n\nconst isBase64Svg = (src) => src.startsWith(base64Prefix);\n\nconst createImgEle = (src, altText) => {\n const ele = document.createElement('img');\n ele.setAttribute('src', src);\n ele.setAttribute('alt', altText);\n return ele;\n};\n\nconst createSvgEle = (text) => {\n // we want to purify the SVG to avoid XSS attacks\n const clean = DOMPurify.sanitize(text, {\n USE_PROFILES: { svg: true, svgFilters: true },\n // allow image to render\n ADD_TAGS: ['image'],\n // forbid interactiviy via `use` tags (which are sanitized by default)\n FORBID_TAGS: ['defs']\n });\n\n const parser = new DOMParser();\n const ele = parser\n .parseFromString(clean, 'image/svg+xml')\n .querySelector('svg');\n return ele;\n};\n\nexport const createImage = async (src, altText) => {\n try {\n let ele;\n if (isBase64Svg(src)) {\n // handle base64 source\n const svgXml = atob(src.slice(base64Prefix.length));\n ele = createSvgEle(svgXml);\n } else if (getFileExtension(src) === 'svg') {\n // handle urls\n const fetchedSrc = await fetch(src);\n const text = await fetchedSrc.text();\n ele = createSvgEle(text);\n } else {\n // handle binary\n ele = createImgEle(src, altText);\n }\n\n ele.style.setProperty('max-width', '100%');\n ele.style.setProperty('max-height', '100%');\n\n return ele;\n } catch {\n return null;\n }\n};\n","import { ButtonClass } from '@descope-ui/descope-button/class';\nimport { injectStyle } from '@descope-ui/common/components-helpers';\nimport { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../../mixins';\nimport { createBaseClass } from '../../../baseClasses/createBaseClass';\nimport { compose } from '../../../helpers';\nimport { forwardAttrs, getComponentName } from '../../../helpers/componentHelpers';\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","/**\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"],"names":["componentName","host","label","slottedIcon","selector","loadingIndicatorStyles","ButtonClass","mappings","hostWidth","property","hostHeight","hostDirection","fontSize","fontFamily","fontWeight","cursor","backgroundColor","outlineOffset","outlineColor","outlineStyle","outlineWidth","borderRadius","borderColor","borderStyle","borderWidth","verticalPadding","horizontalPadding","fallback","labelTextColor","iconColor","cssVarList","fill","labelTextDecoration","labelSpacing","textAlign","iconSize","slots","wrappedEleName","style","excludeAttrsSync","color","clickableMixin","superclass","isLoading","this","getAttribute","click","super","customElements","define","IconClass","srcAttrs","RawImage","baseSelector","observedAttributes","constructor","attachShadow","mode","innerHTML","init","toggleVisibility","getSrc","onThemeChange","renderImage","isVisible","classList","remove","add","altText","legacySrc","themeSrc","currentThemeName","updateFillColor","node","querySelectorAll","forEach","ele","setAttribute","ImageClass","then","res","appendChild","shouldRender","src","srcVal","attributeChangedCallback","attrName","oldValue","newValue","height","width","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","setProperty","RawSelectItem","createBaseClass","size","variant","value","baseElement","includeAttrs","handleFocus","shadowRoot","focus","addEventListener","e","isTrusted","ButtonSelectionGroupItemClass","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"],"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-button/src/component/ButtonClass.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/clickableMixin.js","webpack://@descope/web-components-ui/../components/descope-button/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-icon/src/component/IconClass.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/ImageClass.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/helpers.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/../../../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"],"sourcesContent":["import { compose } from '@descope-ui/common/utils';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport {\n createStyleMixin,\n draggableMixin,\n createProxy,\n componentNameValidationMixin,\n stretchMixin,\n} from '@descope-ui/common/components-mixins';\nimport { IconClass } from '@descope-ui/descope-icon/class';\nimport { clickableMixin } from './clickableMixin';\n\nexport const componentName = getComponentName('button');\n\nconst resetStyles = `\n\t:host {\n\t\tdisplay: inline-block;\n\t\tbox-sizing: border-box;\n\t}\n\tvaadin-button::before,\n\tvaadin-button::after {\n\t\topacity: 0;\n\t}\n\tvaadin-button {\n\t\tmargin: 0;\n\t\tmin-width: 0;\n\t\twidth: 100%;\n\t\theight: auto;\n\t\tbox-shadow: none;\n\t}\n\tvaadin-button::part(label) {\n\t\tpadding: 0;\n width: 100%;\n\t}\n\tvaadin-button::part(prefix) {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n`;\n\nconst iconStyles = `\n\tvaadin-button::part(prefix),\n\tvaadin-button::part(label) {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n`;\n\nconst editorOverrides = `vaadin-button::part(label) { pointer-events: none; }`;\n\nconst { host, label, slottedIcon } = {\n host: { selector: () => ':host' },\n label: { selector: '::part(label)' },\n slottedIcon: { selector: () => '::slotted(descope-icon)' },\n};\n\nlet loadingIndicatorStyles;\n\nexport const ButtonClass = compose(\n stretchMixin({ triggers: [{ attr: 'full-width', value: 'true' }] }),\n createStyleMixin({\n mappings: {\n hostWidth: { property: 'width' },\n hostHeight: { property: 'height' },\n hostDirection: { ...host, property: 'direction' },\n fontSize: {},\n fontFamily: {},\n fontWeight: {},\n\n cursor: {},\n backgroundColor: {},\n\n outlineOffset: {},\n outlineColor: {},\n outlineStyle: {},\n outlineWidth: {},\n\n borderRadius: {},\n borderColor: {},\n borderStyle: {},\n borderWidth: {},\n\n verticalPadding: [\n { property: 'padding-top' },\n { property: 'padding-bottom' },\n ],\n horizontalPadding: [\n { property: 'padding-right', fallback: '0.875em' },\n { property: 'padding-left', fallback: '0.875em' },\n ],\n\n labelTextColor: { property: 'color' },\n iconColor: {\n selector: () => `::slotted(*)`,\n property: IconClass.cssVarList.fill,\n },\n labelTextDecoration: { ...label, property: 'text-decoration' },\n labelSpacing: { ...label, property: 'gap' },\n textAlign: { ...label, property: 'justify-content', fallback: 'center' },\n\n iconSize: [\n { ...slottedIcon, property: 'width' },\n { ...slottedIcon, property: 'height' },\n ],\n },\n }),\n clickableMixin,\n draggableMixin,\n componentNameValidationMixin,\n)(\n createProxy({\n slots: ['', 'prefix', 'label', 'suffix'],\n wrappedEleName: 'vaadin-button',\n style: () => `\n\t\t\t${resetStyles}\n\t\t\t${iconStyles}\n\t\t\t${loadingIndicatorStyles}\n\t\t\t${editorOverrides}\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${ButtonClass.cssVarList.outlineWidth}) + var(${ButtonClass.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width=\"true\"]) {\n width: var(${ButtonClass.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${ButtonClass.cssVarList.hostHeight}) - var(${ButtonClass.cssVarList.outlineWidth}) - var(${ButtonClass.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square=\"true\"]:not([full-width=\"true\"]) {\n\t\t\t\twidth: calc(var(${ButtonClass.cssVarList.hostWidth}) - var(${ButtonClass.cssVarList.outlineWidth}) - var(${ButtonClass.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,\n excludeAttrsSync: ['tabindex', 'class', 'style'],\n componentName,\n }),\n);\n\nconst { color, fontSize } = ButtonClass.cssVarList;\nloadingIndicatorStyles = `\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading=\"true\"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${color});\n\t\ttop: calc(50% - (var(${fontSize}) / 2));\n\t\tleft: calc(50% - (var(${fontSize}) / 2));\n\t\tborder-width: calc(var(${fontSize}) / 10);\n\t\twidth: var(${fontSize});\n\t\theight: var(${fontSize});\n\t}\n\t:host([disabled=\"true\"]),\n\t:host([loading=\"true\"]) {\n\t\tpointer-events: none;\n\t}\n\t:host([loading=\"true\"]) ::part(prefix),\n\t:host([loading=\"true\"]) ::part(label) {\n\t\tvisibility: hidden;\n\t}\n`;\n","export const clickableMixin = (superclass) =>\n class ClickableMixinClass extends superclass {\n get isLoading() {\n return this.getAttribute('loading') === 'true';\n }\n\n click() {\n this.isLoading || super.click();\n }\n };\n","import { componentName, ButtonClass } from './ButtonClass';\nimport '@vaadin/button';\n\ncustomElements.define(componentName, ButtonClass);\n\nexport { ButtonClass, componentName };\n","import {\n componentNameValidationMixin,\n createProxy,\n createStyleMixin,\n draggableMixin,\n} from '@descope-ui/common/components-mixins';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport { ImageClass } from '@descope-ui/descope-image/class';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('icon');\n\nexport const IconClass = compose(\n createStyleMixin({\n mappings: {\n fill: [{}, { property: ImageClass.cssVarList.fill }],\n },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(\n createProxy({\n slots: [],\n wrappedEleName: 'descope-image',\n style: () => `\n :host {\n display: inline-flex;\n max-height: 100%;\n }\n `,\n excludeAttrsSync: ['tabindex', 'class', 'style'],\n componentName,\n }),\n);\n","/* 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.getSrc);\n }\n\n onThemeChange() {\n this.renderImage();\n }\n\n toggleVisibility(isVisible) {\n if (isVisible) {\n this.classList.remove('hidden');\n } else {\n this.classList.add('hidden');\n }\n }\n\n get altText() {\n return this.getAttribute('alt') || '';\n }\n\n get legacySrc() {\n return this.getAttribute('src');\n }\n\n get themeSrc() {\n return this.getAttribute(`src-${this.currentThemeName}`);\n }\n\n get getSrc() {\n return this.themeSrc || this.legacySrc;\n }\n\n // in order to fill an SVG with `currentColor` override all of its `fill` and `path` nodes\n // with the value from the `st-fill` attribute\n // 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.getSrc);\n\n createImage(this.getSrc, this.altText).then((res) => {\n this.innerHTML = '';\n if (res) {\n this.updateFillColor(res);\n this.appendChild(res);\n }\n });\n }\n\n // render only when src attribute matches current theme\n shouldRender(src) {\n const srcVal = this.getAttribute(src);\n return this.getSrc === srcVal;\n }\n\n attributeChangedCallback(attrName, oldValue, newValue) {\n super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n if (oldValue === newValue) return;\n\n if (this.shouldRender(attrName)) {\n this.renderImage();\n }\n }\n}\n\nexport const ImageClass = compose(\n createStyleMixin({\n mappings: {\n fill: {},\n height: { selector: () => ':host' },\n width: { selector: () => ':host' },\n },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(RawImage);\n","import DOMPurify from 'dompurify';\n\nconst getFileExtension = (path) => {\n const match = path.match(/\\.([0-9a-z]+)(?:[\\\\?#]|$)/i);\n return match ? match[1] : null;\n};\n\nconst base64Prefix = 'data:image/svg+xml;base64,';\n\nconst isBase64Svg = (src) => src.startsWith(base64Prefix);\n\nconst createImgEle = (src, altText) => {\n const ele = document.createElement('img');\n ele.setAttribute('src', src);\n ele.setAttribute('alt', altText);\n return ele;\n};\n\nconst createSvgEle = (text) => {\n // we want to purify the SVG to avoid XSS attacks\n const clean = DOMPurify.sanitize(text, {\n USE_PROFILES: { svg: true, svgFilters: true },\n // allow image to render\n ADD_TAGS: ['image'],\n // forbid interactiviy via `use` tags (which are sanitized by default)\n FORBID_TAGS: ['defs']\n });\n\n const parser = new DOMParser();\n const ele = parser\n .parseFromString(clean, 'image/svg+xml')\n .querySelector('svg');\n return ele;\n};\n\nexport const createImage = async (src, altText) => {\n try {\n let ele;\n if (isBase64Svg(src)) {\n // handle base64 source\n const svgXml = atob(src.slice(base64Prefix.length));\n ele = createSvgEle(svgXml);\n } else if (getFileExtension(src) === 'svg') {\n // handle urls\n const fetchedSrc = await fetch(src);\n const text = await fetchedSrc.text();\n ele = createSvgEle(text);\n } else {\n // handle binary\n ele = createImgEle(src, altText);\n }\n\n ele.style.setProperty('max-width', '100%');\n ele.style.setProperty('max-height', '100%');\n\n return ele;\n } catch {\n return null;\n }\n};\n","import { ButtonClass } from '@descope-ui/descope-button/class';\nimport { injectStyle } from '@descope-ui/common/components-helpers';\nimport { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../../mixins';\nimport { createBaseClass } from '../../../baseClasses/createBaseClass';\nimport { compose } from '../../../helpers';\nimport { forwardAttrs, getComponentName } from '../../../helpers/componentHelpers';\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","/**\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"],"names":["componentName","host","label","slottedIcon","selector","loadingIndicatorStyles","ButtonClass","triggers","attr","value","mappings","hostWidth","property","hostHeight","hostDirection","fontSize","fontFamily","fontWeight","cursor","backgroundColor","outlineOffset","outlineColor","outlineStyle","outlineWidth","borderRadius","borderColor","borderStyle","borderWidth","verticalPadding","horizontalPadding","fallback","labelTextColor","iconColor","cssVarList","fill","labelTextDecoration","labelSpacing","textAlign","iconSize","slots","wrappedEleName","style","excludeAttrsSync","color","clickableMixin","superclass","isLoading","this","getAttribute","click","super","customElements","define","IconClass","srcAttrs","RawImage","baseSelector","observedAttributes","constructor","attachShadow","mode","innerHTML","init","toggleVisibility","getSrc","onThemeChange","renderImage","isVisible","classList","remove","add","altText","legacySrc","themeSrc","currentThemeName","updateFillColor","node","querySelectorAll","forEach","ele","setAttribute","ImageClass","then","res","appendChild","shouldRender","src","srcVal","attributeChangedCallback","attrName","oldValue","newValue","height","width","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","setProperty","RawSelectItem","createBaseClass","size","variant","baseElement","includeAttrs","handleFocus","shadowRoot","focus","addEventListener","e","isTrusted","ButtonSelectionGroupItemClass","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"],"sourceRoot":""}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[3267],{13094(t,e,n){n.r(e),n.d(e,{AnchoredClass:()=>l,componentName:()=>h});var o=n(88961),s=n(72270),r=n(25964),i=n(63200);const h=(0,r.xE)("anchored");class c extends((0,s.qu)({componentName:h,baseSelector:".anchored-root"})){#t=null;#e=null;#n=null;get#o(){return this.defaultSlot.assignedElements({flatten:!0})[0]}get#s(){return this.shadowRoot.querySelector('slot[name="anchored"]')?.assignedElements()[0]}get#r(){return this.getRootNode().host}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <div class="anchored-root" part="root">\n <slot></slot>\n <div class="anchored-host" part="anchored">\n <slot name="anchored"></slot>\n </div>\n </div>\n ',this.defaultSlot=this.shadowRoot.querySelector("slot:not([name])")}init(){super.init?.(),(0,r.fz)("\n :host {\n display: inline-flex;\n position: relative;\n box-sizing: border-box;\n }\n\n :host(:not([has-anchor])) {\n display: none;\n }\n\n .anchored-root {\n position: relative;\n display: flex;\n width: 100%;\n min-width: 0;\n }\n\n /* Make anchor fill the flex row and allow it to shrink. */\n ::slotted(*:not([slot])) {\n flex-grow: 1; /* fill the flex row */\n flex-shrink: 1; /* compress when constrained */\n flex-basis: auto; /* start from the anchor's natural size */\n min-width: 0; /* flex items won't shrink below content size without this */\n }\n\n /* Anchored container covers the anchor but is invisible to pointer events. */\n .anchored-host {\n position: absolute;\n inset: 0;\n pointer-events: none;\n }\n\n /* Restore interactivity for actual anchored content. */\n ::slotted([slot=\"anchored\"]) {\n pointer-events: auto;\n }\n ",this),this.#i(),this.defaultSlot.addEventListener("slotchange",()=>this.#h()),this.#h()}#h(){this.#c(),this.#t=this.#l(this.#t,this.#r,"stretch"),this.#e=this.#l(this.#e,this.#s,"st-host-direction")}#i(){const t="\n descope-anchored {\n width: 100%; /* fill the outer host so the anchored element spans the full anchor width */\n }\n :host([stretch]) {\n display: inline-flex; /* switch from inline-block so internal children are flex items */\n width: 100%; /* fill non-flex parents */\n flex-grow: 1; /* absorb extra space in flex parents */\n flex-shrink: 0; /* hold full width — shrink:1 would let siblings squeeze it below 100% */\n flex-basis: 100%; /* start at full width before grow/shrink */\n min-width: 0; /* prevent overflow when the outer host is itself inside a constrained flex row */\n }\n ";this.#n?this.#n.replaceSync(t):this.#r&&(this.#n=(0,r.fz)(t,this.#r))}#l(t,e,n){return t?.disconnect(),e?.removeAttribute(n),this.#o&&e?(0,r.EA)(this.#o,e,{includeAttrs:[n]}):null}disconnectedCallback(){super.disconnectedCallback?.(),this.#t?.disconnect(),this.#e?.disconnect()}#c(){this.toggleAttribute("has-anchor",!!this.#o)}}const l=(0,i.Zz)(o.tQ)(c);customElements.define(h,l)}}]);
|
|
2
|
+
//# sourceMappingURL=descope-anchored.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"descope-anchored.js","mappings":"8OASO,MAAMA,GAAgB,QAAiB,YAE9C,MAAMC,WAAoB,QAAgB,CACxCD,gBACAE,aAAc,oBAEd,GAAmB,KAEnB,GAAqB,KAErB,GAAoB,KAEpB,KAAI,GACF,OAAOC,KAAKC,YAAYC,iBAAiB,CAAEC,SAAS,IAAQ,EAC9D,CAEA,KAAI,GACF,OAAOH,KAAKI,WACTC,cAAc,0BACbH,mBAAmB,EACzB,CAEA,KAAI,GACF,OAAOF,KAAKM,cAAcC,IAC5B,CAEA,WAAAC,GACEC,QAEAT,KAAKU,aAAa,CAAEC,KAAM,SAAUC,UAAY,2MAShDZ,KAAKC,YAAcD,KAAKI,WAAWC,cAAc,mBACnD,CAEA,IAAAQ,GACEJ,MAAMI,UAEN,QACE,0iCAsCAb,MAGFA,MAAK,IAELA,KAAKC,YAAYa,iBAAiB,aAAc,IAAMd,MAAK,KAE3DA,MAAK,GACP,CAEA,KACEA,MAAK,IAELA,MAAK,EAAmBA,MAAK,EAC3BA,MAAK,EACLA,MAAK,EACL,WAGFA,MAAK,EAAqBA,MAAK,EAC7BA,MAAK,EACLA,MAAK,EACL,oBAEJ,CAIA,KACE,MAAMe,EAAM,wsBAcRf,MAAK,EACPA,MAAK,EAAkBgB,YAAYD,GAC1Bf,MAAK,IACdA,MAAK,GAAoB,QAAYe,EAAKf,MAAK,GAEnD,CAKA,GAAaiB,EAAUC,EAAQC,GAG7B,OAFAF,GAAUG,aACVF,GAAQG,gBAAgBF,GACnBnB,MAAK,GAAYkB,GACf,QAAalB,MAAK,EAASkB,EAAQ,CAAEI,aAAc,CAACH,KADtB,IAEvC,CAGA,oBAAAI,GACEd,MAAMc,yBACNvB,MAAK,GAAkBoB,aACvBpB,MAAK,GAAoBoB,YAC3B,CAIA,KACEpB,KAAKwB,gBAAgB,eAAgBxB,MAAK,EAC5C,EAGK,MAAMyB,GAAgB,QAAQ,KAAR,CAAsC3B,GCpKnE4B,eAAeC,OAAO9B,EAAe4B,E","sources":["webpack://@descope/web-components-ui/../components/descope-anchored/src/component/AnchoredClass.js","webpack://@descope/web-components-ui/../components/descope-anchored/src/component/index.js"],"sourcesContent":["import { componentNameValidationMixin } from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport {\n forwardAttrs,\n getComponentName,\n injectStyle,\n} from '@descope-ui/common/components-helpers';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('anchored');\n\nclass RawAnchored extends createBaseClass({\n componentName,\n baseSelector: '.anchored-root',\n}) {\n #stretchObserver = null;\n\n #directionObserver = null;\n\n #hostStretchSheet = null;\n\n get #anchor() {\n return this.defaultSlot.assignedElements({ flatten: true })[0];\n }\n\n get #anchored() {\n return this.shadowRoot\n .querySelector('slot[name=\"anchored\"]')\n ?.assignedElements()[0];\n }\n\n get #outerHost() {\n return this.getRootNode().host;\n }\n\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\n <div class=\"anchored-root\" part=\"root\">\n <slot></slot>\n <div class=\"anchored-host\" part=\"anchored\">\n <slot name=\"anchored\"></slot>\n </div>\n </div>\n `;\n\n this.defaultSlot = this.shadowRoot.querySelector('slot:not([name])');\n }\n\n init() {\n super.init?.();\n\n injectStyle(\n `\n :host {\n display: inline-flex;\n position: relative;\n box-sizing: border-box;\n }\n\n :host(:not([has-anchor])) {\n display: none;\n }\n\n .anchored-root {\n position: relative;\n display: flex;\n width: 100%;\n min-width: 0;\n }\n\n /* Make anchor fill the flex row and allow it to shrink. */\n ::slotted(*:not([slot])) {\n flex-grow: 1; /* fill the flex row */\n flex-shrink: 1; /* compress when constrained */\n flex-basis: auto; /* start from the anchor's natural size */\n min-width: 0; /* flex items won't shrink below content size without this */\n }\n\n /* Anchored container covers the anchor but is invisible to pointer events. */\n .anchored-host {\n position: absolute;\n inset: 0;\n pointer-events: none;\n }\n\n /* Restore interactivity for actual anchored content. */\n ::slotted([slot=\"anchored\"]) {\n pointer-events: auto;\n }\n `,\n this,\n );\n\n this.#syncStretchCSS();\n\n this.defaultSlot.addEventListener('slotchange', () => this.#syncAnchor());\n\n this.#syncAnchor();\n }\n\n #syncAnchor() {\n this.#onAnchorChanged();\n\n this.#stretchObserver = this.#forwardAttr(\n this.#stretchObserver,\n this.#outerHost,\n 'stretch',\n );\n\n this.#directionObserver = this.#forwardAttr(\n this.#directionObserver,\n this.#anchored,\n 'st-host-direction',\n );\n }\n\n // Injects [stretch] layout rules into the containing component's shadow root (e.g. descope-attachment)\n // so it stretches when the anchor has [stretch]. Replaces the existing rules on subsequent calls.\n #syncStretchCSS() {\n const css = `\n descope-anchored {\n width: 100%; /* fill the outer host so the anchored element spans the full anchor width */\n }\n :host([stretch]) {\n display: inline-flex; /* switch from inline-block so internal children are flex items */\n width: 100%; /* fill non-flex parents */\n flex-grow: 1; /* absorb extra space in flex parents */\n flex-shrink: 0; /* hold full width — shrink:1 would let siblings squeeze it below 100% */\n flex-basis: 100%; /* start at full width before grow/shrink */\n min-width: 0; /* prevent overflow when the outer host is itself inside a constrained flex row */\n }\n `;\n\n if (this.#hostStretchSheet) {\n this.#hostStretchSheet.replaceSync(css);\n } else if (this.#outerHost) {\n this.#hostStretchSheet = injectStyle(css, this.#outerHost);\n }\n }\n\n // Reconnects forwarding to the current anchor. Disconnects the old observer and\n // removes the stale attr from target first — forwardAttrs only sets attrs present\n // on the source, so absent attrs won't be removed automatically.\n #forwardAttr(observer, target, attr) {\n observer?.disconnect();\n target?.removeAttribute(attr);\n if (!this.#anchor || !target) return null;\n return forwardAttrs(this.#anchor, target, { includeAttrs: [attr] });\n }\n\n // Prevent stale callbacks from firing on a detached anchor after removal.\n disconnectedCallback() {\n super.disconnectedCallback?.();\n this.#stretchObserver?.disconnect();\n this.#directionObserver?.disconnect();\n }\n\n // Track whether anything is slotted, so the host display rule can hide an\n // empty host rather than reserving its layout box.\n #onAnchorChanged() {\n this.toggleAttribute('has-anchor', !!this.#anchor);\n }\n}\n\nexport const AnchoredClass = compose(componentNameValidationMixin)(RawAnchored);\n","import { componentName, AnchoredClass } from './AnchoredClass';\n\ncustomElements.define(componentName, AnchoredClass);\n\nexport { AnchoredClass, componentName };\n"],"names":["componentName","RawAnchored","baseSelector","this","defaultSlot","assignedElements","flatten","shadowRoot","querySelector","getRootNode","host","constructor","super","attachShadow","mode","innerHTML","init","addEventListener","css","replaceSync","observer","target","attr","disconnect","removeAttribute","includeAttrs","disconnectedCallback","toggleAttribute","AnchoredClass","customElements","define"],"sourceRoot":""}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[7164],{44050(t,e,n){n.r(e),n.d(e,{AttachmentClass:()=>
|
|
1
|
+
"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[3267,7164],{13094(t,e,n){n.r(e),n.d(e,{AnchoredClass:()=>c,componentName:()=>h});var s=n(88961),o=n(72270),i=n(25964),r=n(63200);const h=(0,i.xE)("anchored");class a extends((0,o.qu)({componentName:h,baseSelector:".anchored-root"})){#t=null;#e=null;#n=null;get#s(){return this.defaultSlot.assignedElements({flatten:!0})[0]}get#o(){return this.shadowRoot.querySelector('slot[name="anchored"]')?.assignedElements()[0]}get#i(){return this.getRootNode().host}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <div class="anchored-root" part="root">\n <slot></slot>\n <div class="anchored-host" part="anchored">\n <slot name="anchored"></slot>\n </div>\n </div>\n ',this.defaultSlot=this.shadowRoot.querySelector("slot:not([name])")}init(){super.init?.(),(0,i.fz)("\n :host {\n display: inline-flex;\n position: relative;\n box-sizing: border-box;\n }\n\n :host(:not([has-anchor])) {\n display: none;\n }\n\n .anchored-root {\n position: relative;\n display: flex;\n width: 100%;\n min-width: 0;\n }\n\n /* Make anchor fill the flex row and allow it to shrink. */\n ::slotted(*:not([slot])) {\n flex-grow: 1; /* fill the flex row */\n flex-shrink: 1; /* compress when constrained */\n flex-basis: auto; /* start from the anchor's natural size */\n min-width: 0; /* flex items won't shrink below content size without this */\n }\n\n /* Anchored container covers the anchor but is invisible to pointer events. */\n .anchored-host {\n position: absolute;\n inset: 0;\n pointer-events: none;\n }\n\n /* Restore interactivity for actual anchored content. */\n ::slotted([slot=\"anchored\"]) {\n pointer-events: auto;\n }\n ",this),this.#r(),this.defaultSlot.addEventListener("slotchange",()=>this.#h()),this.#h()}#h(){this.#a(),this.#t=this.#c(this.#t,this.#i,"stretch"),this.#e=this.#c(this.#e,this.#o,"st-host-direction")}#r(){const t="\n descope-anchored {\n width: 100%; /* fill the outer host so the anchored element spans the full anchor width */\n }\n :host([stretch]) {\n display: inline-flex; /* switch from inline-block so internal children are flex items */\n width: 100%; /* fill non-flex parents */\n flex-grow: 1; /* absorb extra space in flex parents */\n flex-shrink: 0; /* hold full width — shrink:1 would let siblings squeeze it below 100% */\n flex-basis: 100%; /* start at full width before grow/shrink */\n min-width: 0; /* prevent overflow when the outer host is itself inside a constrained flex row */\n }\n ";this.#n?this.#n.replaceSync(t):this.#i&&(this.#n=(0,i.fz)(t,this.#i))}#c(t,e,n){return t?.disconnect(),e?.removeAttribute(n),this.#s&&e?(0,i.EA)(this.#s,e,{includeAttrs:[n]}):null}disconnectedCallback(){super.disconnectedCallback?.(),this.#t?.disconnect(),this.#e?.disconnect()}#a(){this.toggleAttribute("has-anchor",!!this.#s)}}const c=(0,r.Zz)(s.tQ)(a);customElements.define(h,c)},44050(t,e,n){n.r(e),n.d(e,{AttachmentClass:()=>u,componentName:()=>h}),n(13094);var s=n(88961),o=n(72270),i=n(25964),r=n(63200);const h=(0,i.xE)("attachment"),a=["top-end","top-start","top-center","bottom-start","bottom-end","bottom-center"],c=a[0];class l extends((0,o.qu)({componentName:h,baseSelector:"descope-anchored"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <descope-anchored>\n <slot></slot>\n <div slot="anchored" class="attachment-container">\n <slot name="attachment"></slot>\n </div>\n </descope-anchored>\n ',this.defaultSlot=this.shadowRoot.querySelector("slot:not([name])"),this.attachmentSlot=this.shadowRoot.querySelector('slot[name="attachment"]')}get#l(){return this.attachmentSlot?.assignedElements()[0]}static get observedAttributes(){return[...super.observedAttributes||[],"position"]}attributeChangedCallback(t,e,n){super.attributeChangedCallback?.(t,e,n),"position"===t&&e!==n&&this.#d()}init(){super.init?.(),(0,i.fz)("\n :host {\n display: inline-block;\n }\n :host(.hidden) {\n display: none;\n }\n .attachment-container {\n position: absolute;\n z-index: 1;\n pointer-events: none;\n width: 100%;\n display: flex;\n align-items: center;\n container-type: inline-size;\n }\n",this),this.#d();const t=this.shadowRoot.querySelector(".attachment-container");(0,i.mx)(t,()=>this.#u(),{includeAttrs:["st-host-direction"]}),this.attachmentSlot.addEventListener("slotchange",()=>this.#u()),this.defaultSlot.addEventListener("slotchange",()=>{this.#m(),window.requestAnimationFrame(()=>this.#f())}),window.requestAnimationFrame(()=>this.#m())}#f(){const t=this.defaultSlot?.assignedElements()?.[0],e=t?.getBoundingClientRect();if(e){const t=e.width;this.#l?.setAttribute("data-attachment-size",Number(t))}}#m(){const t=this.defaultSlot?.assignedElements()?.length>0;this.classList.toggle("hidden",!t)}#u(){const t=this.shadowRoot.querySelector(".attachment-container")?.getAttribute("st-host-direction");t&&this.#l?.setAttribute("st-host-direction",t)}get offsetX(){return this.getAttribute("offset-x")||"0px"}get offsetY(){return this.getAttribute("offset-y")||"0px"}#d(){const t=this.getAttribute("position");a.includes(t)||this.setAttribute("position",c)}}const d={selector:()=>".attachment-container"},u=(0,r.Zz)((0,s.RF)({mappings:{transform:{...d},justifyContent:{...d},maxWidth:{...d},top:{...d},bottom:{...d},left:{...d},right:{...d},offsetX:{},offsetY:{}}}),s.VO,s.tQ)(l);customElements.define(h,u)}}]);
|
|
2
2
|
//# sourceMappingURL=descope-attachment.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"descope-attachment.js","mappings":"gPAYO,MAAMA,GAAgB,QAAiB,cAExCC,EAAuB,CAC3B,UACA,YACA,aACA,eACA,aACA,iBAGIC,EAAmBD,EAAqB,GAE9C,MAAME,WAAsB,QAAgB,CAC1CH,gBACAI,aAAc,sBAEd,WAAAC,GACEC,QAEAC,KAAKC,aAAa,CAAEC,KAAM,SAAUC,UAAY,kLAShDH,KAAKI,YAAcJ,KAAKK,WAAWC,cAAc,oBACjDN,KAAKO,eAAiBP,KAAKK,WAAWC,cACpC,0BAEJ,CAEA,6BAAWE,GACT,MAAO,IAAKT,MAAMS,oBAAsB,GAAK,WAC/C,CAEA,wBAAAC,CAAyBC,EAAMC,EAAQC,GACrCb,MAAMU,2BAA2BC,EAAMC,EAAQC,GAClC,aAATF,GAAuBC,IAAWC,GACpCZ,MAAK,GAET,CAEA,IAAAa,GACEd,MAAMc,UAEN,QACE,8bAqBAb,MAGFA,MAAK,IAELA,KAAKI,YAAYU,iBAAiB,aAAc,KAC9Cd,MAAK,IACLA,MAAK,MAGPe,OAAOC,sBAAsB,KAC3BhB,MAAK,IACLA,MAAK,KAET,CAEA,KACE,MAAMiB,EAAYjB,KAAKI,aAAac,oBAAoBC,OAAS,EACjEnB,KAAKoB,UAAUC,OAAO,UAAWJ,EACnC,CAEA,KACE,MAAMK,EAAQtB,KAAKI,aAAac,qBAAqB,GACrD,IAAKI,EAAO,OAEZ,MAAM,UAAEC,GAAcR,OAAOS,iBAAiBF,GAI9CtB,KAAKO,gBAAgBW,mBAAmBO,QAASC,IAC/CA,EAAGC,aAAa,oBAAqBJ,IAEzC,CAEA,WAAIK,GACF,OAAO5B,KAAK6B,aAAa,aAAe,KAC1C,CAEA,WAAIC,GACF,OAAO9B,KAAK6B,aAAa,aAAe,KAC1C,CAEA,KACE,MAAME,EAAM/B,KAAK6B,aAAa,YACzBnC,EAAqBsC,SAASD,IACjC/B,KAAK2B,aAAa,WAAYhC,EAElC,EAGF,MAAMsC,EAAsB,CAAEC,SAAU,IAAM,yBAEjCC,GAAkB,SAC7B,QAAiB,CACfC,SAAU,CACRC,UAAW,IAAKJ,GAChBK,eAAgB,IAAKL,GACrBM,SAAU,IAAKN,GACfO,IAAK,IAAKP,GACVQ,OAAQ,IAAKR,GACbS,KAAM,IAAKT,GACXU,MAAO,IAAKV,GACZL,QAAS,CAAC,EACVE,QAAS,CAAC,KAGd,KACA,KAf6B,CAgB7BlC,GCrJFgD,eAAeC,OAAOpD,EAAe0C,E","sources":["webpack://@descope/web-components-ui/../components/descope-attachment/src/component/AttachmentClass.js","webpack://@descope/web-components-ui/../components/descope-attachment/src/component/index.js"],"sourcesContent":["import {\n componentNameValidationMixin,\n createStyleMixin,\n draggableMixin,\n} from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport {\n getComponentName,\n injectStyle,\n} from '@descope-ui/common/components-helpers';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('attachment');\n\nconst ATTACHMENT_POSITIONS = [\n 'top-end',\n 'top-start',\n 'top-center',\n 'bottom-start',\n 'bottom-end',\n 'bottom-center',\n];\n\nconst DEFAULT_POSITION = ATTACHMENT_POSITIONS[0];\n\nclass RawAttachment extends createBaseClass({\n componentName,\n baseSelector: ':host > .wrapper',\n}) {\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\n <div class=\"wrapper\">\n <slot></slot>\n <div class=\"attachment-container\">\n <slot name=\"attachment\"></slot>\n </div>\n </div>\n `;\n\n this.defaultSlot = this.shadowRoot.querySelector('slot:not([name])');\n this.attachmentSlot = this.shadowRoot.querySelector(\n 'slot[name=\"attachment\"]',\n );\n }\n\n static get observedAttributes() {\n return [...(super.observedAttributes || []), 'position'];\n }\n\n attributeChangedCallback(name, oldVal, newVal) {\n super.attributeChangedCallback?.(name, oldVal, newVal);\n if (name === 'position' && oldVal !== newVal) {\n this.#handlePositionChange();\n }\n }\n\n init() {\n super.init?.();\n\n injectStyle(\n `\n :host {\n display: inline-block;\n }\n .wrapper {\n position: relative;\n display: inline-flex;\n }\n .attachment-container {\n position: absolute;\n z-index: 1;\n pointer-events: none;\n width: 100%;\n display: flex;\n align-items: center;\n container-type: inline-size;\n }\n :host(.hidden) {\n display: none;\n }\n `,\n this,\n );\n\n this.#handlePositionChange();\n\n this.defaultSlot.addEventListener('slotchange', () => {\n this.#setVisibility();\n this.#syncDirection();\n });\n\n window.requestAnimationFrame(() => {\n this.#setVisibility();\n this.#syncDirection();\n });\n }\n\n #setVisibility() {\n const hasAnchor = this.defaultSlot?.assignedElements()?.length > 0;\n this.classList.toggle('hidden', !hasAnchor);\n }\n\n #syncDirection() {\n const child = this.defaultSlot?.assignedElements()?.[0];\n if (!child) return;\n\n const { direction } = window.getComputedStyle(child);\n\n // currently we support direction sync only for web-components-ui\n // elements, which support st-host-direction attribute.\n this.attachmentSlot?.assignedElements().forEach((el) => {\n el.setAttribute('st-host-direction', direction);\n });\n }\n\n get offsetX() {\n return this.getAttribute('offset-x') || '0px';\n }\n\n get offsetY() {\n return this.getAttribute('offset-y') || '0px';\n }\n\n #handlePositionChange() {\n const pos = this.getAttribute('position');\n if (!ATTACHMENT_POSITIONS.includes(pos)) {\n this.setAttribute('position', DEFAULT_POSITION);\n }\n }\n}\n\nconst attachmentContainer = { selector: () => '.attachment-container' };\n\nexport const AttachmentClass = compose(\n createStyleMixin({\n mappings: {\n transform: { ...attachmentContainer },\n justifyContent: { ...attachmentContainer },\n maxWidth: { ...attachmentContainer },\n top: { ...attachmentContainer },\n bottom: { ...attachmentContainer },\n left: { ...attachmentContainer },\n right: { ...attachmentContainer },\n offsetX: {},\n offsetY: {},\n },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(RawAttachment);\n","import { componentName, AttachmentClass } from './AttachmentClass';\n\ncustomElements.define(componentName, AttachmentClass);\n\nexport { AttachmentClass, componentName };\n"],"names":["componentName","ATTACHMENT_POSITIONS","DEFAULT_POSITION","RawAttachment","baseSelector","constructor","super","this","attachShadow","mode","innerHTML","defaultSlot","shadowRoot","querySelector","attachmentSlot","observedAttributes","attributeChangedCallback","name","oldVal","newVal","init","addEventListener","window","requestAnimationFrame","hasAnchor","assignedElements","length","classList","toggle","child","direction","getComputedStyle","forEach","el","setAttribute","offsetX","getAttribute","offsetY","pos","includes","attachmentContainer","selector","AttachmentClass","mappings","transform","justifyContent","maxWidth","top","bottom","left","right","customElements","define"],"sourceRoot":""}
|
|
1
|
+
{"version":3,"file":"descope-attachment.js","mappings":"mPASO,MAAMA,GAAgB,QAAiB,YAE9C,MAAMC,WAAoB,QAAgB,CACxCD,gBACAE,aAAc,oBAEd,GAAmB,KAEnB,GAAqB,KAErB,GAAoB,KAEpB,KAAI,GACF,OAAOC,KAAKC,YAAYC,iBAAiB,CAAEC,SAAS,IAAQ,EAC9D,CAEA,KAAI,GACF,OAAOH,KAAKI,WACTC,cAAc,0BACbH,mBAAmB,EACzB,CAEA,KAAI,GACF,OAAOF,KAAKM,cAAcC,IAC5B,CAEA,WAAAC,GACEC,QAEAT,KAAKU,aAAa,CAAEC,KAAM,SAAUC,UAAY,2MAShDZ,KAAKC,YAAcD,KAAKI,WAAWC,cAAc,mBACnD,CAEA,IAAAQ,GACEJ,MAAMI,UAEN,QACE,0iCAsCAb,MAGFA,MAAK,IAELA,KAAKC,YAAYa,iBAAiB,aAAc,IAAMd,MAAK,KAE3DA,MAAK,GACP,CAEA,KACEA,MAAK,IAELA,MAAK,EAAmBA,MAAK,EAC3BA,MAAK,EACLA,MAAK,EACL,WAGFA,MAAK,EAAqBA,MAAK,EAC7BA,MAAK,EACLA,MAAK,EACL,oBAEJ,CAIA,KACE,MAAMe,EAAM,wsBAcRf,MAAK,EACPA,MAAK,EAAkBgB,YAAYD,GAC1Bf,MAAK,IACdA,MAAK,GAAoB,QAAYe,EAAKf,MAAK,GAEnD,CAKA,GAAaiB,EAAUC,EAAQC,GAG7B,OAFAF,GAAUG,aACVF,GAAQG,gBAAgBF,GACnBnB,MAAK,GAAYkB,GACf,QAAalB,MAAK,EAASkB,EAAQ,CAAEI,aAAc,CAACH,KADtB,IAEvC,CAGA,oBAAAI,GACEd,MAAMc,yBACNvB,MAAK,GAAkBoB,aACvBpB,MAAK,GAAoBoB,YAC3B,CAIA,KACEpB,KAAKwB,gBAAgB,eAAgBxB,MAAK,EAC5C,EAGK,MAAMyB,GAAgB,QAAQ,KAAR,CAAsC3B,GCpKnE4B,eAAeC,OAAO9B,EAAe4B,E,kICW9B,MAAM5B,GAAgB,QAAiB,cAExC+B,EAAuB,CAC3B,UACA,YACA,aACA,eACA,aACA,iBAGIC,EAAmBD,EAAqB,GAE9C,MAAME,WAAsB,QAAgB,CAC1CjC,gBACAE,aAAc,sBAEd,WAAAS,GACEC,QAEAT,KAAKU,aAAa,CAAEC,KAAM,SAAUC,UAAY,4MAShDZ,KAAKC,YAAcD,KAAKI,WAAWC,cAAc,oBACjDL,KAAK+B,eAAiB/B,KAAKI,WAAWC,cACpC,0BAEJ,CAEA,KAAI,GACF,OAAOL,KAAK+B,gBAAgB7B,mBAAmB,EACjD,CAEA,6BAAW8B,GACT,MAAO,IAAKvB,MAAMuB,oBAAsB,GAAK,WAC/C,CAEA,wBAAAC,CAAyBC,EAAMC,EAAQC,GACrC3B,MAAMwB,2BAA2BC,EAAMC,EAAQC,GAClC,aAATF,GAAuBC,IAAWC,GACpCpC,MAAK,GAET,CAEA,IAAAa,GACEJ,MAAMI,UAEN,QACE,iWAiBAb,MAGFA,MAAK,IAIL,MAAMqC,EAAYrC,KAAKI,WAAWC,cAAc,0BAChD,QAAkBgC,EAAW,IAAMrC,MAAK,IAAkB,CACxDsB,aAAc,CAAC,uBAIjBtB,KAAK+B,eAAejB,iBAAiB,aAAc,IACjDd,MAAK,KAGPA,KAAKC,YAAYa,iBAAiB,aAAc,KAC9Cd,MAAK,IACLsC,OAAOC,sBAAsB,IAAMvC,MAAK,OAG1CsC,OAAOC,sBAAsB,IAAMvC,MAAK,IAC1C,CAEA,KACE,MAAMwC,EAASxC,KAAKC,aAAaC,qBAAqB,GAEhDuC,EAAaD,GAAQE,wBAC3B,GAAID,EAAY,CACd,MAAME,EAAiBF,EAAWG,MAClC5C,MAAK,GAAa6C,aAChB,uBACAC,OAAOH,GAEX,CACF,CAEA,KACE,MAAMI,EAAY/C,KAAKC,aAAaC,oBAAoB8C,OAAS,EACjEhD,KAAKiD,UAAUC,OAAO,UAAWH,EACnC,CAEA,KACE,MAAMI,EAAYnD,KAAKI,WACpBC,cAAc,0BACb+C,aAAa,qBAEZD,GAGLnD,MAAK,GAAa6C,aAAa,oBAAqBM,EACtD,CAEA,WAAIE,GACF,OAAOrD,KAAKoD,aAAa,aAAe,KAC1C,CAEA,WAAIE,GACF,OAAOtD,KAAKoD,aAAa,aAAe,KAC1C,CAEA,KACE,MAAMG,EAAMvD,KAAKoD,aAAa,YACzBxB,EAAqB4B,SAASD,IACjCvD,KAAK6C,aAAa,WAAYhB,EAElC,EAGF,MAAM4B,EAAsB,CAAEC,SAAU,IAAM,yBAEjCC,GAAkB,SAC7B,QAAiB,CACfC,SAAU,CACRC,UAAW,IAAKJ,GAChBK,eAAgB,IAAKL,GACrBM,SAAU,IAAKN,GACfO,IAAK,IAAKP,GACVQ,OAAQ,IAAKR,GACbS,KAAM,IAAKT,GACXU,MAAO,IAAKV,GACZJ,QAAS,CAAC,EACVC,QAAS,CAAC,KAGd,KACA,KAf6B,CAgB7BxB,GCzKFJ,eAAeC,OAAO9B,EAAe8D,E","sources":["webpack://@descope/web-components-ui/../components/descope-anchored/src/component/AnchoredClass.js","webpack://@descope/web-components-ui/../components/descope-anchored/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-attachment/src/component/AttachmentClass.js","webpack://@descope/web-components-ui/../components/descope-attachment/src/component/index.js"],"sourcesContent":["import { componentNameValidationMixin } from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport {\n forwardAttrs,\n getComponentName,\n injectStyle,\n} from '@descope-ui/common/components-helpers';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('anchored');\n\nclass RawAnchored extends createBaseClass({\n componentName,\n baseSelector: '.anchored-root',\n}) {\n #stretchObserver = null;\n\n #directionObserver = null;\n\n #hostStretchSheet = null;\n\n get #anchor() {\n return this.defaultSlot.assignedElements({ flatten: true })[0];\n }\n\n get #anchored() {\n return this.shadowRoot\n .querySelector('slot[name=\"anchored\"]')\n ?.assignedElements()[0];\n }\n\n get #outerHost() {\n return this.getRootNode().host;\n }\n\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\n <div class=\"anchored-root\" part=\"root\">\n <slot></slot>\n <div class=\"anchored-host\" part=\"anchored\">\n <slot name=\"anchored\"></slot>\n </div>\n </div>\n `;\n\n this.defaultSlot = this.shadowRoot.querySelector('slot:not([name])');\n }\n\n init() {\n super.init?.();\n\n injectStyle(\n `\n :host {\n display: inline-flex;\n position: relative;\n box-sizing: border-box;\n }\n\n :host(:not([has-anchor])) {\n display: none;\n }\n\n .anchored-root {\n position: relative;\n display: flex;\n width: 100%;\n min-width: 0;\n }\n\n /* Make anchor fill the flex row and allow it to shrink. */\n ::slotted(*:not([slot])) {\n flex-grow: 1; /* fill the flex row */\n flex-shrink: 1; /* compress when constrained */\n flex-basis: auto; /* start from the anchor's natural size */\n min-width: 0; /* flex items won't shrink below content size without this */\n }\n\n /* Anchored container covers the anchor but is invisible to pointer events. */\n .anchored-host {\n position: absolute;\n inset: 0;\n pointer-events: none;\n }\n\n /* Restore interactivity for actual anchored content. */\n ::slotted([slot=\"anchored\"]) {\n pointer-events: auto;\n }\n `,\n this,\n );\n\n this.#syncStretchCSS();\n\n this.defaultSlot.addEventListener('slotchange', () => this.#syncAnchor());\n\n this.#syncAnchor();\n }\n\n #syncAnchor() {\n this.#onAnchorChanged();\n\n this.#stretchObserver = this.#forwardAttr(\n this.#stretchObserver,\n this.#outerHost,\n 'stretch',\n );\n\n this.#directionObserver = this.#forwardAttr(\n this.#directionObserver,\n this.#anchored,\n 'st-host-direction',\n );\n }\n\n // Injects [stretch] layout rules into the containing component's shadow root (e.g. descope-attachment)\n // so it stretches when the anchor has [stretch]. Replaces the existing rules on subsequent calls.\n #syncStretchCSS() {\n const css = `\n descope-anchored {\n width: 100%; /* fill the outer host so the anchored element spans the full anchor width */\n }\n :host([stretch]) {\n display: inline-flex; /* switch from inline-block so internal children are flex items */\n width: 100%; /* fill non-flex parents */\n flex-grow: 1; /* absorb extra space in flex parents */\n flex-shrink: 0; /* hold full width — shrink:1 would let siblings squeeze it below 100% */\n flex-basis: 100%; /* start at full width before grow/shrink */\n min-width: 0; /* prevent overflow when the outer host is itself inside a constrained flex row */\n }\n `;\n\n if (this.#hostStretchSheet) {\n this.#hostStretchSheet.replaceSync(css);\n } else if (this.#outerHost) {\n this.#hostStretchSheet = injectStyle(css, this.#outerHost);\n }\n }\n\n // Reconnects forwarding to the current anchor. Disconnects the old observer and\n // removes the stale attr from target first — forwardAttrs only sets attrs present\n // on the source, so absent attrs won't be removed automatically.\n #forwardAttr(observer, target, attr) {\n observer?.disconnect();\n target?.removeAttribute(attr);\n if (!this.#anchor || !target) return null;\n return forwardAttrs(this.#anchor, target, { includeAttrs: [attr] });\n }\n\n // Prevent stale callbacks from firing on a detached anchor after removal.\n disconnectedCallback() {\n super.disconnectedCallback?.();\n this.#stretchObserver?.disconnect();\n this.#directionObserver?.disconnect();\n }\n\n // Track whether anything is slotted, so the host display rule can hide an\n // empty host rather than reserving its layout box.\n #onAnchorChanged() {\n this.toggleAttribute('has-anchor', !!this.#anchor);\n }\n}\n\nexport const AnchoredClass = compose(componentNameValidationMixin)(RawAnchored);\n","import { componentName, AnchoredClass } from './AnchoredClass';\n\ncustomElements.define(componentName, AnchoredClass);\n\nexport { AnchoredClass, componentName };\n","import {\n componentNameValidationMixin,\n createStyleMixin,\n draggableMixin,\n} from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport {\n getComponentName,\n injectStyle,\n observeAttributes,\n} from '@descope-ui/common/components-helpers';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('attachment');\n\nconst ATTACHMENT_POSITIONS = [\n 'top-end',\n 'top-start',\n 'top-center',\n 'bottom-start',\n 'bottom-end',\n 'bottom-center',\n];\n\nconst DEFAULT_POSITION = ATTACHMENT_POSITIONS[0];\n\nclass RawAttachment extends createBaseClass({\n componentName,\n baseSelector: 'descope-anchored',\n}) {\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\n <descope-anchored>\n <slot></slot>\n <div slot=\"anchored\" class=\"attachment-container\">\n <slot name=\"attachment\"></slot>\n </div>\n </descope-anchored>\n `;\n\n this.defaultSlot = this.shadowRoot.querySelector('slot:not([name])');\n this.attachmentSlot = this.shadowRoot.querySelector(\n 'slot[name=\"attachment\"]',\n );\n }\n\n get #attachment() {\n return this.attachmentSlot?.assignedElements()[0];\n }\n\n static get observedAttributes() {\n return [...(super.observedAttributes || []), 'position'];\n }\n\n attributeChangedCallback(name, oldVal, newVal) {\n super.attributeChangedCallback?.(name, oldVal, newVal);\n if (name === 'position' && oldVal !== newVal) {\n this.#handlePositionChange();\n }\n }\n\n init() {\n super.init?.();\n\n injectStyle(\n `\n :host {\n display: inline-block;\n }\n :host(.hidden) {\n display: none;\n }\n .attachment-container {\n position: absolute;\n z-index: 1;\n pointer-events: none;\n width: 100%;\n display: flex;\n align-items: center;\n container-type: inline-size;\n }\n`,\n this,\n );\n\n this.#handlePositionChange();\n\n // When descope-anchored forwards st-host-direction from the anchor to this container,\n // propagate it to the attachment elements.\n const container = this.shadowRoot.querySelector('.attachment-container');\n observeAttributes(container, () => this.#syncDirection(), {\n includeAttrs: ['st-host-direction'],\n });\n\n // Re-sync direction when new elements are slotted into the attachment slot.\n this.attachmentSlot.addEventListener('slotchange', () =>\n this.#syncDirection(),\n );\n\n this.defaultSlot.addEventListener('slotchange', () => {\n this.#setVisibility();\n window.requestAnimationFrame(() => this.#syncAvailableSizeAttr());\n });\n\n window.requestAnimationFrame(() => this.#setVisibility());\n }\n\n #syncAvailableSizeAttr() {\n const anchor = this.defaultSlot?.assignedElements()?.[0];\n\n const anchorRect = anchor?.getBoundingClientRect();\n if (anchorRect) {\n const availableWidth = anchorRect.width;\n this.#attachment?.setAttribute(\n 'data-attachment-size',\n Number(availableWidth),\n );\n }\n }\n\n #setVisibility() {\n const hasAnchor = this.defaultSlot?.assignedElements()?.length > 0;\n this.classList.toggle('hidden', !hasAnchor);\n }\n\n #syncDirection() {\n const direction = this.shadowRoot\n .querySelector('.attachment-container')\n ?.getAttribute('st-host-direction');\n\n if (!direction) return;\n // currently we support direction sync only for web-components-ui\n // elements, which support st-host-direction attribute.\n this.#attachment?.setAttribute('st-host-direction', direction);\n }\n\n get offsetX() {\n return this.getAttribute('offset-x') || '0px';\n }\n\n get offsetY() {\n return this.getAttribute('offset-y') || '0px';\n }\n\n #handlePositionChange() {\n const pos = this.getAttribute('position');\n if (!ATTACHMENT_POSITIONS.includes(pos)) {\n this.setAttribute('position', DEFAULT_POSITION);\n }\n }\n}\n\nconst attachmentContainer = { selector: () => '.attachment-container' };\n\nexport const AttachmentClass = compose(\n createStyleMixin({\n mappings: {\n transform: { ...attachmentContainer },\n justifyContent: { ...attachmentContainer },\n maxWidth: { ...attachmentContainer },\n top: { ...attachmentContainer },\n bottom: { ...attachmentContainer },\n left: { ...attachmentContainer },\n right: { ...attachmentContainer },\n offsetX: {},\n offsetY: {},\n },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(RawAttachment);\n","import '@descope-ui/descope-anchored';\nimport { componentName, AttachmentClass } from './AttachmentClass';\n\ncustomElements.define(componentName, AttachmentClass);\n\nexport { AttachmentClass, componentName };\n"],"names":["componentName","RawAnchored","baseSelector","this","defaultSlot","assignedElements","flatten","shadowRoot","querySelector","getRootNode","host","constructor","super","attachShadow","mode","innerHTML","init","addEventListener","css","replaceSync","observer","target","attr","disconnect","removeAttribute","includeAttrs","disconnectedCallback","toggleAttribute","AnchoredClass","customElements","define","ATTACHMENT_POSITIONS","DEFAULT_POSITION","RawAttachment","attachmentSlot","observedAttributes","attributeChangedCallback","name","oldVal","newVal","container","window","requestAnimationFrame","anchor","anchorRect","getBoundingClientRect","availableWidth","width","setAttribute","Number","hasAnchor","length","classList","toggle","direction","getAttribute","offsetX","offsetY","pos","includes","attachmentContainer","selector","AttachmentClass","mappings","transform","justifyContent","maxWidth","top","bottom","left","right"],"sourceRoot":""}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[4188],{77888(t,e,o){o.d(e,{T:()=>
|
|
1
|
+
"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[4188],{77888(t,e,o){o.d(e,{T:()=>a,e:()=>h});var r=o(88961),n=o(72270),i=o(25964),s=o(63200);const a=(0,i.xE)("badge");class d extends((0,n.qu)({componentName:a,baseSelector:":host > div"})){static get observedAttributes(){return["data-attachment-size","shrink-to-indicator-threshold"]}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<div>\n <slot></slot>\n\t\t</div>\n\t\t",(0,i.fz)("\n :host {\n display: inline-flex;\n }\n :host > div {\n position: relative;\n width: 100%;\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n }\n ",this)}get shrinkToIndicatorThreshold(){return this.getAttribute("shrink-to-indicator-threshold")||65}#t(t){this.toggleAttribute("shrink-to-indicator",parseFloat(t)<this.shrinkToIndicatorThreshold)}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),"data-attachment-size"===t&&e!==o&&this.#t(o)}}const h=(0,s.Zz)((0,r.RF)({mappings:{hostWidth:[{selector:()=>":host",property:"width"}],hostHeight:[{selector:()=>":host",property:"height"}],hostDirection:{property:"direction"},fontFamily:{},fontSize:{},fontWeight:{},textTransform:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-left"},{property:"padding-right"}],borderWidth:{},borderStyle:{},borderColor:{},borderRadius:{},backgroundColor:{},textColor:{property:"color"},textAlign:{},boxShadow:{},textIndent:{}}}),r.VO,r.tQ)(d)},11065(t,e,o){o.r(e),o.d(e,{BadgeClass:()=>r.e,componentName:()=>r.T});var r=o(77888);customElements.define(r.T,r.e)}}]);
|
|
2
2
|
//# sourceMappingURL=descope-badge.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"descope-badge.js","mappings":"+MAYO,MAAMA,GAAgB,QAAiB,SAE9C,MAAMC,WAAiB,QAAgB,CACrCD,gBACAE,aAAc,iBAEd,WAAAC,GACEC,QAEAC,KAAKC,aAAa,CAAEC,KAAM,SAAUC,UAAY,sDAMhD,QACE,8OAYAH,KAEJ,EAGK,
|
|
1
|
+
{"version":3,"file":"descope-badge.js","mappings":"+MAYO,MAAMA,GAAgB,QAAiB,SAE9C,MAAMC,WAAiB,QAAgB,CACrCD,gBACAE,aAAc,iBAEd,6BAAWC,GACT,MAAO,CAAC,uBAAwB,gCAClC,CAEA,WAAAC,GACEC,QAEAC,KAAKC,aAAa,CAAEC,KAAM,SAAUC,UAAY,sDAMhD,QACE,8OAYAH,KAEJ,CAEA,8BAAII,GACF,OAAOJ,KAAKK,aAAa,kCAAoC,EAC/D,CAEA,GAAyBC,GACvBN,KAAKO,gBACH,sBACAC,WAAWF,GAASN,KAAKI,2BAE7B,CAEA,wBAAAK,CAAyBC,EAAMC,EAAQC,GACrCb,MAAMU,2BAA2BC,EAAMC,EAAQC,GAClC,yBAATF,GAAmCC,IAAWC,GAChDZ,MAAK,EAAyBY,EAElC,EAGK,MAAMC,GAAa,SACxB,QAAiB,CACfC,SAAU,CACRC,UAAW,CAAC,CAAEC,SAAU,IAAM,QAASC,SAAU,UACjDC,WAAY,CAAC,CAAEF,SAAU,IAAM,QAASC,SAAU,WAClDE,cAAe,CAAEF,SAAU,aAE3BG,WAAY,CAAC,EACbC,SAAU,CAAC,EACXC,WAAY,CAAC,EACbC,cAAe,CAAC,EAChBC,gBAAiB,CACf,CAAEP,SAAU,eACZ,CAAEA,SAAU,mBAEdQ,kBAAmB,CACjB,CAAER,SAAU,gBACZ,CAAEA,SAAU,kBAGdS,YAAa,CAAC,EACdC,YAAa,CAAC,EACdC,YAAa,CAAC,EACdC,aAAc,CAAC,EAEfC,gBAAiB,CAAC,EAElBC,UAAW,CAAEd,SAAU,SACvBe,UAAW,CAAC,EACZC,UAAW,CAAC,EACZC,WAAY,CAAC,KAGjB,KACA,KAlCwB,CAmCxBvC,E,uFCpGFwC,eAAeC,OAAO,IAAe,I","sources":["webpack://@descope/web-components-ui/../components/descope-badge/src/component/BadgeClass.js","webpack://@descope/web-components-ui/../components/descope-badge/src/component/index.js"],"sourcesContent":["import {\n componentNameValidationMixin,\n createStyleMixin,\n draggableMixin,\n} from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport {\n getComponentName,\n injectStyle,\n} from '@descope-ui/common/components-helpers';\nimport { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('badge');\n\nclass RawBadge extends createBaseClass({\n componentName,\n baseSelector: ':host > div',\n}) {\n static get observedAttributes() {\n return ['data-attachment-size', 'shrink-to-indicator-threshold'];\n }\n\n constructor() {\n super();\n\n this.attachShadow({ mode: 'open' }).innerHTML = `\n\t\t<div>\n <slot></slot>\n\t\t</div>\n\t\t`;\n\n injectStyle(\n `\n :host {\n display: inline-flex;\n }\n :host > div {\n position: relative;\n width: 100%;\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n }\n `,\n this,\n );\n }\n\n get shrinkToIndicatorThreshold() {\n return this.getAttribute('shrink-to-indicator-threshold') || 65;\n }\n\n #handleShrinkToIndicator(value) {\n this.toggleAttribute(\n 'shrink-to-indicator',\n parseFloat(value) < this.shrinkToIndicatorThreshold,\n );\n }\n\n attributeChangedCallback(name, oldVal, newVal) {\n super.attributeChangedCallback?.(name, oldVal, newVal);\n if (name === 'data-attachment-size' && oldVal !== newVal) {\n this.#handleShrinkToIndicator(newVal);\n }\n }\n}\n\nexport const BadgeClass = compose(\n createStyleMixin({\n mappings: {\n hostWidth: [{ selector: () => ':host', property: 'width' }],\n hostHeight: [{ selector: () => ':host', property: 'height' }],\n hostDirection: { property: 'direction' },\n\n fontFamily: {},\n fontSize: {},\n fontWeight: {},\n textTransform: {},\n verticalPadding: [\n { property: 'padding-top' },\n { property: 'padding-bottom' },\n ],\n horizontalPadding: [\n { property: 'padding-left' },\n { property: 'padding-right' },\n ],\n\n borderWidth: {},\n borderStyle: {},\n borderColor: {},\n borderRadius: {},\n\n backgroundColor: {},\n\n textColor: { property: 'color' },\n textAlign: {},\n boxShadow: {},\n textIndent: {},\n },\n }),\n draggableMixin,\n componentNameValidationMixin,\n)(RawBadge);\n","import { componentName, BadgeClass } from './BadgeClass';\n\ncustomElements.define(componentName, BadgeClass);\n\nexport { BadgeClass, componentName };\n"],"names":["componentName","RawBadge","baseSelector","observedAttributes","constructor","super","this","attachShadow","mode","innerHTML","shrinkToIndicatorThreshold","getAttribute","value","toggleAttribute","parseFloat","attributeChangedCallback","name","oldVal","newVal","BadgeClass","mappings","hostWidth","selector","property","hostHeight","hostDirection","fontFamily","fontSize","fontWeight","textTransform","verticalPadding","horizontalPadding","borderWidth","borderStyle","borderColor","borderRadius","backgroundColor","textColor","textAlign","boxShadow","textIndent","customElements","define"],"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],{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:{},fontWeight:{},cursor:{},backgroundColor:{},outlineOffset:{},outlineColor:{},outlineStyle:{},outlineWidth:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-right",fallback:"0.875em"},{property:"padding-left",fallback:"0.875em"}],labelTextColor:{property:"color"},iconColor:{selector:()=>"::slotted(*)",property:a.S.cssVarList.fill},labelTextDecoration:{...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","style"],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`},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()}}},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)},98538(t,e,r){r.d(e,{S:()=>l,T:()=>s});var o=r(88961),i=r(25964),n=r(8512),a=r(63200);const s=(0,i.xE)("icon"),l=(0,a.Zz)((0,o.RF)({mappings:{fill:[{},{property:n.q.cssVarList.fill}]}}),o.VO,o.tQ)((0,o.tz)({slots:[],wrappedEleName:"descope-image",style:()=>"\n :host {\n display: inline-flex;\n max-height: 100%;\n }\n ",excludeAttrsSync:["tabindex","class","style"],componentName:s}))},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.getSrc)}onThemeChange(){this.renderImage()}toggleVisibility(t){t?this.classList.remove("hidden"):this.classList.add("hidden")}get altText(){return this.getAttribute("alt")||""}get legacySrc(){return this.getAttribute("src")}get themeSrc(){return this.getAttribute(`src-${this.currentThemeName}`)}get getSrc(){return this.themeSrc||this.legacySrc}updateFillColor(t){[t,...t.querySelectorAll("*[fill]")].forEach(t=>{t.setAttribute("fill",`var(${h.cssVarList.fill}, ${t.getAttribute("fill")||"''"})`)})}renderImage(){this.toggleVisibility(this.getSrc),(0,s.m)(this.getSrc,this.altText).then(t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))})}shouldRender(t){const e=this.getAttribute(t);return this.getSrc===e}attributeChangedCallback(t,e,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)},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}}},89389(t,e,r){r.d(e,{$:()=>p});var o=r(13256),i=r(55774),n=r(82901),a=r(72562),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],{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.DM)({triggers:[{attr:"full-width",value:"true"}]}),(0,n.RF)({mappings:{hostWidth:{property:"width"},hostHeight:{property:"height"},hostDirection:{...c,property:"direction"},fontSize:{},fontFamily:{},fontWeight:{},cursor:{},backgroundColor:{},outlineOffset:{},outlineColor:{},outlineStyle:{},outlineWidth:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-right",fallback:"0.875em"},{property:"padding-left",fallback:"0.875em"}],labelTextColor:{property:"color"},iconColor:{selector:()=>"::slotted(*)",property:a.S.cssVarList.fill},labelTextDecoration:{...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","style"],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`},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()}}},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)},98538(t,e,r){r.d(e,{S:()=>l,T:()=>s});var o=r(88961),i=r(25964),n=r(8512),a=r(63200);const s=(0,i.xE)("icon"),l=(0,a.Zz)((0,o.RF)({mappings:{fill:[{},{property:n.q.cssVarList.fill}]}}),o.VO,o.tQ)((0,o.tz)({slots:[],wrappedEleName:"descope-image",style:()=>"\n :host {\n display: inline-flex;\n max-height: 100%;\n }\n ",excludeAttrsSync:["tabindex","class","style"],componentName:s}))},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.getSrc)}onThemeChange(){this.renderImage()}toggleVisibility(t){t?this.classList.remove("hidden"):this.classList.add("hidden")}get altText(){return this.getAttribute("alt")||""}get legacySrc(){return this.getAttribute("src")}get themeSrc(){return this.getAttribute(`src-${this.currentThemeName}`)}get getSrc(){return this.themeSrc||this.legacySrc}updateFillColor(t){[t,...t.querySelectorAll("*[fill]")].forEach(t=>{t.setAttribute("fill",`var(${h.cssVarList.fill}, ${t.getAttribute("fill")||"''"})`)})}renderImage(){this.toggleVisibility(this.getSrc),(0,s.m)(this.getSrc,this.altText).then(t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))})}shouldRender(t){const e=this.getAttribute(t);return this.getSrc===e}attributeChangedCallback(t,e,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)},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}}},89389(t,e,r){r.d(e,{$:()=>p});var o=r(13256),i=r(55774),n=r(82901),a=r(72562),s=r(81488),l=r(87550);const c=r(51450).AH`
|
|
3
3
|
:host {
|
|
4
4
|
display: inline-block;
|
|
5
5
|
position: relative;
|