@descope/web-components-ui 1.87.0 → 1.89.0

package/dist/umd/descope-collapsible-container.js

@@ -1,2 +1,2 @@
-(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[1202,2294,6367,6724],{6301:(t,e,n)=>{"use strict";n.r(e),n.d(e,{ImageClass:()=>h,componentName:()=>c});var s=n(88961),r=n(72270),i=n(63200),o=n(25964),a=n(25414);const l=t=>{const e=a.A.sanitize(t,{USE_PROFILES:{svg:!0,svgFilters:!0}});return(new DOMParser).parseFromString(e,"image/svg+xml").querySelector("svg")},c=(0,o.xE)("image"),p=["src","src-dark"];class d extends((0,r.qu)({componentName:c,baseSelector:"slot"})){static get observedAttributes(){return p}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<slot></slot>\n\t",(0,o.fz)("\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n      :host > slot {\n        width: 100%;\n        height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n      ::slotted(*) {\n        width: 100%;\n\t\t\t}\n\n      .hidden {\n        display: none;\n      }\n      ",this)}init(){super.init?.(),this.toggleVisibility(this.src)}onThemeChange(){this.renderImage()}toggleVisibility(t){t?this.classList.remove("hidden"):this.classList.add("hidden")}get legacySrc(){return this.getAttribute("src")}get themeSrc(){return this.getAttribute(`src-${this.currentThemeName}`)}get src(){return this.themeSrc||this.legacySrc}updateFillColor(t){[t,...t.querySelectorAll("*[fill]")].forEach((t=>{t.setAttribute("fill",`var(${h.cssVarList.fill}, ${t.getAttribute("fill")||"''"})`)}))}renderImage(){this.toggleVisibility(this.src),(async t=>{try{let e;if((t=>t.startsWith("data:image/svg+xml;base64,"))(t)){const n=atob(t.slice(26));e=l(n)}else if("svg"===(t=>{const e=t.match(/\.([0-9a-z]+)(?:[\\?#]|$)/i);return e?e[1]:null})(t)){const n=await fetch(t),s=await n.text();e=l(s)}else e=(t=>{const e=document.createElement("img");return e.setAttribute("src",t),e})(t);return e.style.setProperty("max-width","100%"),e.style.setProperty("max-height","100%"),e}catch{return null}})(this.src).then((t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))}))}shouldRender(t){const e=this.getAttribute(t);return this.src===e}attributeChangedCallback(t,e,n){super.attributeChangedCallback?.(t,e,n),e!==n&&this.shouldRender(t)&&this.renderImage()}}const h=(0,i.Zz)((0,s.RF)({mappings:{fill:{},height:{selector:()=>":host"},width:{selector:()=>":host"}}}),s.VO,s.tQ)(d);customElements.define(c,h)},56737:(t,e,n)=>{"use strict";n.r(e),n.d(e,{IconClass:()=>s.S,componentName:()=>s.T}),n(6301);var s=n(98538);customElements.define(s.T,s.S)},63595:(t,e,n)=>{"use strict";n.r(e),n.d(e,{TextClass:()=>s.s,componentName:()=>s.T});var s=n(66434);customElements.define(s.T,s.s)},66434:(t,e,n)=>{"use strict";n.d(e,{T:()=>a,s:()=>c});var s=n(88961),r=n(63200),i=n(25964),o=n(72270);const a=(0,i.xE)("text");class l extends((0,o.qu)({componentName:a,baseSelector:":host > slot"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n    <slot part="text-wrapper"></slot>\n    ',(0,i.fz)("\n      :host {\n        display: inline-block;\n        line-height: 1em;\n      }\n      :host > slot {\n        width: 100%;\n        display: inline-block;\n      }\n    ",this)}get hideWhenEmpty(){return"true"===this.getAttribute("hide-when-empty")}init(){super.init(),(0,i.Ge)(this,(()=>{const t=!!this.childNodes.length;this.style.display=!t&&this.hideWhenEmpty?"none":""}))}}const c=(0,r.Zz)((0,s.RF)({mappings:{hostWidth:{selector:()=>":host",property:"width"},hostDirection:{selector:()=>":host",property:"direction"},fontSize:{},textColor:{property:"color"},textLineHeight:{property:"line-height"},textLetterSpacing:{property:"letter-spacing"},textShadow:{},textAlign:{},textTransform:{},fontFamily:{},fontStyle:{},fontWeight:{},borderWidth:{},borderStyle:{},borderColor:{}}}),s.VO,s.tQ)(l)},96945:(t,e,n)=>{"use strict";n.r(e),n.d(e,{CollapsibleContainerClass:()=>u,componentName:()=>p}),n(63595),n(56737);var s=n(88961),r=n(72270),i=n(63200),o=n(25964),a=n(97376),l=n.n(a),c=n(66434);const p=(0,o.xE)("collapsible-container");class d extends((0,r.qu)({componentName:p,baseSelector:"slot"})){static get observedAttributes(){return["collapsed","collapsible","text"]}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML=`\n    <div class="wrapper">\n      <descope-text st-host-direction="ltr">\n        <div class="header">\n          <div class="icon">\n            <descope-icon st-fill="currentcolor" src=${l()}></descope-icon>\n          </div>\n          <span></span>\n        </div>\n      </descope-text>\n      <div class="content">\n        <slot></slot>\n      </div>\n    </div>\n\t`,(0,o.fz)(`\n      div.content {\n        transition-property: max-height;\n        overflow: auto;\n        height: auto;\n\t\t\t}\n\t\t\tslot {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\twidth: 100%;\n\t\t\t\tdisplay: flex;\n\t\t\t}\n      slot:focus-visible {\n        outline: none;\n      }\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n      .header {\n          user-select: none;\n          display: flex;\n          align-items: baseline;\n      }\n      .icon {\n          flex-shrink: 0;\n          height: var(${c.s.cssVarList.textLineHeight});\n          min-height: 24px;\n          display: flex;\n          align-items: center;\n      }\n      descope-icon {\n          transition-property: transform;\n      }\n      .rotate {\n          transform: rotate(-180deg);\n      }\n      descope-text {\n        width: 100%;\n        display: flex;\n      }\n      span {\n        align-self: center;\n        word-break: break-word;\n      }\n      span:empty {\n        display: none;\n      }\n      .wrapper {\n        overflow: hidden;\n        display: inline-flex;\n        width: 100%;\n        flex-direction: column;\n      }\n  `,this),this.header=this.shadowRoot.querySelector(".header"),this.content=this.shadowRoot.querySelector("div.content"),this.icon=this.header.querySelector("descope-icon"),this.headerText=this.header.querySelector("span"),this.textComponent=this.shadowRoot.querySelector("descope-text")}get isCollapsible(){return"true"===this.getAttribute("collapsible")}calcContentHeight(){return this.content.offsetHeight||this.content.scrollHeight}get isCollapsed(){return"true"===this.getAttribute("collapsed")}toggle(){this.setAttribute("collapsed",this.isCollapsed?"false":"true")}collapse(t=!1){const e=()=>{this.content.style.maxHeight="0px"};if(this.icon.classList.add("rotate"),!t)return e();this.content.style.maxHeight=this.calcContentHeight()+"px",setTimeout(e)}expand(t=!1){const e=()=>{this.content.style.maxHeight=""};if(this.icon.classList.remove("rotate"),!t)return e();this.content.addEventListener("transitionend",e,{once:!0}),this.content.style.maxHeight=this.calcContentHeight()+"px"}#t=!1;init(){super.init?.(),this.#t=!0,this.header.addEventListener("click",(()=>{this.isCollapsible&&this.toggle()})),(0,o.EA)(this,this.textComponent,{includeAttrs:["text-align","text-variant","text-mode"],mapAttrs:{"text-mode":"mode","text-variant":"variant"}})}updateHeaderText(){const t=this.getAttribute("text")||"";this.headerText.innerText=t}attributeChangedCallback(t,e,n){"text"!==t?this.isCollapsed&&this.isCollapsible?this.collapse(this.#t):this.expand(this.#t):this.updateHeaderText()}}const h={host:()=>":host",icon:()=>"descope-icon",iconWrapper:()=>".icon",header:()=>".header",text:()=>"span",wrapper:()=>".wrapper",content:()=>"div.content"},u=(0,i.Zz)((0,s.RF)({mappings:{hostWidth:{selector:h.host,property:"width"},hostDirection:{selector:h.host,property:"direction"},verticalPadding:[{selector:h.wrapper,property:"padding-top"},{selector:h.wrapper,property:"padding-bottom"}],horizontalPadding:[{selector:h.wrapper,property:"padding-left"},{selector:h.wrapper,property:"padding-right"}],flexDirection:{},justifyContent:{},alignItems:{},gap:[{},{property:"margin-top"}],backgroundColor:{selector:h.wrapper},backgroundImage:{selector:h.wrapper},backgroundPositionX:{selector:h.wrapper},backgroundPositionY:{selector:h.wrapper},backgroundSize:{selector:h.wrapper},backgroundRepeat:{selector:h.wrapper},borderRadius:{selector:h.wrapper},borderColor:{selector:h.wrapper},borderStyle:{selector:h.wrapper},borderWidth:{selector:h.wrapper},boxShadow:{selector:h.wrapper},headerIconOrder:{selector:h.iconWrapper,property:"order"},headerCursor:{selector:h.header,property:"cursor"},headerGap:{selector:h.header,property:"gap"},textGrow:{selector:h.text,property:"flex-grow"},textDirection:{selector:h.text,property:"direction"},iconAnimationDuration:{selector:h.icon,property:"transition-duration"},contentAnimationDuration:{selector:h.content,property:"transition-duration"}}}),s.VO,s.tQ)(d);customElements.define(p,u)},97376:t=>{t.exports="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iYmxhY2siIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+IDxwYXRoIGQ9Ik0xNy4yMTkzIDkuMjcyODNDMTcuNjU4NCA4Ljg3OTEyIDE4LjMzMzQgOC45MTU4NyAxOC43MjcyIDkuMzU0OTJDMTkuMTIwOSA5Ljc5Mzk3IDE5LjA4NDEgMTAuNDY5MSAxOC42NDUxIDEwLjg2MjhDMTguNjQ1MSAxMC44NjI4IDEzLjA0NTcgMTYuMDAyMiAxMi42NCAxNi4zNjZDMTIuMjM0MyAxNi43Mjk4IDExLjc2MDggMTYuNzI5OCAxMS4zNTUyIDE2LjM2Nkw1LjM1NDkyIDEwLjg2MjhDNC45MTU4NyAxMC40NjkxIDQuODc5MTIgOS43OTM5NyA1LjI3MjgzIDkuMzU0OTJDNS42NjY1NSA4LjkxNTg3IDYuMzQxNjQgOC44NzkxMiA2Ljc4MDY5IDkuMjcyODNMMTIgMTQuMTM2OEwxNy4yMTkzIDkuMjcyODNaIi8+IDwvc3ZnPiA="},98538:(t,e,n)=>{"use strict";n.d(e,{S:()=>a,T:()=>o});var s=n(88961),r=n(25964),i=n(63200);const o=(0,r.xE)("icon"),a=(0,i.Zz)((0,s.RF)({mappings:{fill:{}}}),s.VO,s.tQ)((0,s.tz)({slots:[],wrappedEleName:"descope-image",style:()=>"\n      :host {\n        display: inline-flex;\n      }\n      ",excludeAttrsSync:["tabindex","class"],componentName:o}))}}]);
+(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[1202,2294,6367,6724],{6301:(t,e,n)=>{"use strict";n.r(e),n.d(e,{ImageClass:()=>h,componentName:()=>c});var s=n(88961),r=n(72270),i=n(63200),o=n(25964),a=n(25414);const l=t=>{const e=a.A.sanitize(t,{USE_PROFILES:{svg:!0,svgFilters:!0}});return(new DOMParser).parseFromString(e,"image/svg+xml").querySelector("svg")},c=(0,o.xE)("image"),p=["src","src-dark"];class d extends((0,r.qu)({componentName:c,baseSelector:"slot"})){static get observedAttributes(){return p}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<slot></slot>\n\t",(0,o.fz)("\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n      :host > slot {\n        width: 100%;\n        height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n      ::slotted(*) {\n        width: 100%;\n\t\t\t}\n\n      .hidden {\n        display: none;\n      }\n      ",this)}init(){super.init?.(),this.toggleVisibility(this.src)}onThemeChange(){this.renderImage()}toggleVisibility(t){t?this.classList.remove("hidden"):this.classList.add("hidden")}get altText(){return this.getAttribute("alt")||""}get legacySrc(){return this.getAttribute("src")}get themeSrc(){return this.getAttribute(`src-${this.currentThemeName}`)}get src(){return this.themeSrc||this.legacySrc}updateFillColor(t){[t,...t.querySelectorAll("*[fill]")].forEach((t=>{t.setAttribute("fill",`var(${h.cssVarList.fill}, ${t.getAttribute("fill")||"''"})`)}))}renderImage(){this.toggleVisibility(this.src),(async(t,e)=>{try{let n;if((t=>t.startsWith("data:image/svg+xml;base64,"))(t)){const e=atob(t.slice(26));n=l(e)}else if("svg"===(t=>{const e=t.match(/\.([0-9a-z]+)(?:[\\?#]|$)/i);return e?e[1]:null})(t)){const e=await fetch(t),s=await e.text();n=l(s)}else n=((t,e)=>{const n=document.createElement("img");return n.setAttribute("src",t),n.setAttribute("alt",e),n})(t,e);return n.style.setProperty("max-width","100%"),n.style.setProperty("max-height","100%"),n}catch{return null}})(this.src,this.altText).then((t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))}))}shouldRender(t){const e=this.getAttribute(t);return this.src===e}attributeChangedCallback(t,e,n){super.attributeChangedCallback?.(t,e,n),e!==n&&this.shouldRender(t)&&this.renderImage()}}const h=(0,i.Zz)((0,s.RF)({mappings:{fill:{},height:{selector:()=>":host"},width:{selector:()=>":host"}}}),s.VO,s.tQ)(d);customElements.define(c,h)},56737:(t,e,n)=>{"use strict";n.r(e),n.d(e,{IconClass:()=>s.S,componentName:()=>s.T}),n(6301);var s=n(98538);customElements.define(s.T,s.S)},63595:(t,e,n)=>{"use strict";n.r(e),n.d(e,{TextClass:()=>s.s,componentName:()=>s.T});var s=n(66434);customElements.define(s.T,s.s)},66434:(t,e,n)=>{"use strict";n.d(e,{T:()=>a,s:()=>c});var s=n(88961),r=n(63200),i=n(25964),o=n(72270);const a=(0,i.xE)("text");class l extends((0,o.qu)({componentName:a,baseSelector:":host > slot"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n    <slot part="text-wrapper"></slot>\n    ',(0,i.fz)("\n      :host {\n        display: inline-block;\n        line-height: 1em;\n      }\n      :host > slot {\n        width: 100%;\n        display: inline-block;\n      }\n    ",this)}get hideWhenEmpty(){return"true"===this.getAttribute("hide-when-empty")}init(){super.init(),(0,i.Ge)(this,(()=>{const t=!!this.childNodes.length;this.style.display=!t&&this.hideWhenEmpty?"none":""}))}}const c=(0,r.Zz)((0,s.RF)({mappings:{hostWidth:{selector:()=>":host",property:"width"},hostDirection:{selector:()=>":host",property:"direction"},fontSize:{},textColor:{property:"color"},textLineHeight:{property:"line-height"},textLetterSpacing:{property:"letter-spacing"},textShadow:{},textAlign:{},textTransform:{},fontFamily:{},fontStyle:{},fontWeight:{},borderWidth:{},borderStyle:{},borderColor:{}}}),s.VO,s.tQ)(l)},96945:(t,e,n)=>{"use strict";n.r(e),n.d(e,{CollapsibleContainerClass:()=>u,componentName:()=>p}),n(63595),n(56737);var s=n(88961),r=n(72270),i=n(63200),o=n(25964),a=n(97376),l=n.n(a),c=n(66434);const p=(0,o.xE)("collapsible-container");class d extends((0,r.qu)({componentName:p,baseSelector:"slot"})){static get observedAttributes(){return["collapsed","collapsible","text"]}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML=`\n    <div class="wrapper">\n      <descope-text st-host-direction="ltr">\n        <div class="header">\n          <div class="icon">\n            <descope-icon st-fill="currentcolor" src=${l()}></descope-icon>\n          </div>\n          <span></span>\n        </div>\n      </descope-text>\n      <div class="content">\n        <slot></slot>\n      </div>\n    </div>\n\t`,(0,o.fz)(`\n      div.content {\n        transition-property: max-height;\n        overflow: auto;\n        height: auto;\n\t\t\t}\n\t\t\tslot {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\twidth: 100%;\n\t\t\t\tdisplay: flex;\n\t\t\t}\n      slot:focus-visible {\n        outline: none;\n      }\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n      .header {\n          user-select: none;\n          display: flex;\n          align-items: baseline;\n      }\n      .icon {\n          flex-shrink: 0;\n          height: var(${c.s.cssVarList.textLineHeight});\n          min-height: 24px;\n          display: flex;\n          align-items: center;\n      }\n      descope-icon {\n          transition-property: transform;\n      }\n      .rotate {\n          transform: rotate(-180deg);\n      }\n      descope-text {\n        width: 100%;\n        display: flex;\n      }\n      span {\n        align-self: center;\n        word-break: break-word;\n      }\n      span:empty {\n        display: none;\n      }\n      .wrapper {\n        overflow: hidden;\n        display: inline-flex;\n        width: 100%;\n        flex-direction: column;\n      }\n  `,this),this.header=this.shadowRoot.querySelector(".header"),this.content=this.shadowRoot.querySelector("div.content"),this.icon=this.header.querySelector("descope-icon"),this.headerText=this.header.querySelector("span"),this.textComponent=this.shadowRoot.querySelector("descope-text")}get isCollapsible(){return"true"===this.getAttribute("collapsible")}calcContentHeight(){return this.content.offsetHeight||this.content.scrollHeight}get isCollapsed(){return"true"===this.getAttribute("collapsed")}toggle(){this.setAttribute("collapsed",this.isCollapsed?"false":"true")}collapse(t=!1){const e=()=>{this.content.style.maxHeight="0px"};if(this.icon.classList.add("rotate"),!t)return e();this.content.style.maxHeight=this.calcContentHeight()+"px",setTimeout(e)}expand(t=!1){const e=()=>{this.content.style.maxHeight=""};if(this.icon.classList.remove("rotate"),!t)return e();this.content.addEventListener("transitionend",e,{once:!0}),this.content.style.maxHeight=this.calcContentHeight()+"px"}#t=!1;init(){super.init?.(),this.#t=!0,this.header.addEventListener("click",(()=>{this.isCollapsible&&this.toggle()})),(0,o.EA)(this,this.textComponent,{includeAttrs:["text-align","text-variant","text-mode"],mapAttrs:{"text-mode":"mode","text-variant":"variant"}})}updateHeaderText(){const t=this.getAttribute("text")||"";this.headerText.innerText=t}attributeChangedCallback(t,e,n){"text"!==t?this.isCollapsed&&this.isCollapsible?this.collapse(this.#t):this.expand(this.#t):this.updateHeaderText()}}const h={host:()=>":host",icon:()=>"descope-icon",iconWrapper:()=>".icon",header:()=>".header",text:()=>"span",wrapper:()=>".wrapper",content:()=>"div.content"},u=(0,i.Zz)((0,s.RF)({mappings:{hostWidth:{selector:h.host,property:"width"},hostDirection:{selector:h.host,property:"direction"},verticalPadding:[{selector:h.wrapper,property:"padding-top"},{selector:h.wrapper,property:"padding-bottom"}],horizontalPadding:[{selector:h.wrapper,property:"padding-left"},{selector:h.wrapper,property:"padding-right"}],flexDirection:{},justifyContent:{},alignItems:{},gap:[{},{property:"margin-top"}],backgroundColor:{selector:h.wrapper},backgroundImage:{selector:h.wrapper},backgroundPositionX:{selector:h.wrapper},backgroundPositionY:{selector:h.wrapper},backgroundSize:{selector:h.wrapper},backgroundRepeat:{selector:h.wrapper},borderRadius:{selector:h.wrapper},borderColor:{selector:h.wrapper},borderStyle:{selector:h.wrapper},borderWidth:{selector:h.wrapper},boxShadow:{selector:h.wrapper},headerIconOrder:{selector:h.iconWrapper,property:"order"},headerCursor:{selector:h.header,property:"cursor"},headerGap:{selector:h.header,property:"gap"},textGrow:{selector:h.text,property:"flex-grow"},textDirection:{selector:h.text,property:"direction"},iconAnimationDuration:{selector:h.icon,property:"transition-duration"},contentAnimationDuration:{selector:h.content,property:"transition-duration"}}}),s.VO,s.tQ)(d);customElements.define(p,u)},97376:t=>{t.exports="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iYmxhY2siIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+IDxwYXRoIGQ9Ik0xNy4yMTkzIDkuMjcyODNDMTcuNjU4NCA4Ljg3OTEyIDE4LjMzMzQgOC45MTU4NyAxOC43MjcyIDkuMzU0OTJDMTkuMTIwOSA5Ljc5Mzk3IDE5LjA4NDEgMTAuNDY5MSAxOC42NDUxIDEwLjg2MjhDMTguNjQ1MSAxMC44NjI4IDEzLjA0NTcgMTYuMDAyMiAxMi42NCAxNi4zNjZDMTIuMjM0MyAxNi43Mjk4IDExLjc2MDggMTYuNzI5OCAxMS4zNTUyIDE2LjM2Nkw1LjM1NDkyIDEwLjg2MjhDNC45MTU4NyAxMC40NjkxIDQuODc5MTIgOS43OTM5NyA1LjI3MjgzIDkuMzU0OTJDNS42NjY1NSA4LjkxNTg3IDYuMzQxNjQgOC44NzkxMiA2Ljc4MDY5IDkuMjcyODNMMTIgMTQuMTM2OEwxNy4yMTkzIDkuMjcyODNaIi8+IDwvc3ZnPiA="},98538:(t,e,n)=>{"use strict";n.d(e,{S:()=>a,T:()=>o});var s=n(88961),r=n(25964),i=n(63200);const o=(0,r.xE)("icon"),a=(0,i.Zz)((0,s.RF)({mappings:{fill:{}}}),s.VO,s.tQ)((0,s.tz)({slots:[],wrappedEleName:"descope-image",style:()=>"\n      :host {\n        display: inline-flex;\n      }\n      ",excludeAttrsSync:["tabindex","class"],componentName:o}))}}]);
 //# sourceMappingURL=descope-collapsible-container.js.map

package/dist/umd/descope-collapsible-container.js.map

@@ -1 +1 @@
-{"version":3,"file":"descope-collapsible-container.js","mappings":"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","sources":["webpack://@descope/web-components-ui/../components/descope-image/src/component/helpers.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/ImageClass.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-icon/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-text/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-text/src/component/TextClass.js","webpack://@descope/web-components-ui/../components/descope-collapsible-container/src/component/CollapsibleContainerClass.js","webpack://@descope/web-components-ui/../components/descope-collapsible-container/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-collapsible-container/src/component/chevron.svg","webpack://@descope/web-components-ui/../components/descope-icon/src/component/IconClass.js"],"sourcesContent":["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) => {\n  const ele = document.createElement('img');\n  ele.setAttribute('src', src);\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  });\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) => {\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);\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","/* eslint-disable no-use-before-define */\nimport {\n  createStyleMixin,\n  draggableMixin,\n  componentNameValidationMixin,\n} from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport { compose } from '@descope-ui/common/utils';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport { createImage } from './helpers';\nimport { injectStyle } from '@descope-ui/common/components-helpers';\n\nexport const componentName = getComponentName('image');\n\nconst srcAttrs = ['src', 'src-dark'];\n\nclass RawImage extends createBaseClass({\n  componentName,\n  baseSelector: 'slot',\n}) {\n  static get observedAttributes() {\n    return srcAttrs;\n  }\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n\t\t<slot></slot>\n\t`;\n\n    injectStyle(\n      `\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n      :host > slot {\n        width: 100%;\n        height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n      ::slotted(*) {\n        width: 100%;\n\t\t\t}\n\n      .hidden {\n        display: none;\n      }\n      `,\n      this,\n    );\n  }\n\n  init() {\n    super.init?.();\n    this.toggleVisibility(this.src);\n  }\n\n  onThemeChange() {\n    this.renderImage();\n  }\n\n  toggleVisibility(isVisible) {\n    if (isVisible) {\n      this.classList.remove('hidden');\n    } else {\n      this.classList.add('hidden');\n    }\n  }\n\n  get legacySrc() {\n    return this.getAttribute('src');\n  }\n\n  get themeSrc() {\n    return this.getAttribute(`src-${this.currentThemeName}`);\n  }\n\n  get src() {\n    return this.themeSrc || this.legacySrc;\n  }\n\n  // in order to fill an SVG with `currentColor` override all of its `fill` and `path` nodes\n  // with the value from the `st-fill` attribute\n  // eslint-disable-next-line class-methods-use-this\n  updateFillColor(node) {\n    // set fill to root node and all its relevant selectors\n    const elementsToReplace = [node, ...node.querySelectorAll('*[fill]')];\n\n    elementsToReplace.forEach((ele) => {\n      ele.setAttribute(\n        'fill',\n        `var(${ImageClass.cssVarList.fill}, ${ele.getAttribute('fill') || \"''\"})`,\n      );\n    });\n  }\n\n  renderImage() {\n    this.toggleVisibility(this.src);\n\n    createImage(this.src).then((res) => {\n      this.innerHTML = '';\n      if (res) {\n        this.updateFillColor(res);\n        this.appendChild(res);\n      }\n    });\n  }\n\n  // render only when src attribute matches current theme\n  shouldRender(src) {\n    const srcVal = this.getAttribute(src);\n    return this.src === srcVal;\n  }\n\n  attributeChangedCallback(attrName, oldValue, newValue) {\n    super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n    if (oldValue === newValue) return;\n\n    if (this.shouldRender(attrName)) {\n      this.renderImage();\n    }\n  }\n}\n\nexport const ImageClass = compose(\n  createStyleMixin({\n    mappings: {\n      fill: {},\n      height: { selector: () => ':host' },\n      width: { selector: () => ':host' },\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawImage);\n","import { componentName, ImageClass } from './ImageClass';\n\ncustomElements.define(componentName, ImageClass);\n\nexport { ImageClass, componentName };\n","import '@descope-ui/descope-image';\n\nimport { componentName, IconClass } from './IconClass';\n\ncustomElements.define(componentName, IconClass);\n\nexport { IconClass, componentName };\n","import { componentName, TextClass } from './TextClass';\n\ncustomElements.define(componentName, TextClass);\n\nexport { TextClass, componentName };\n","import {\n  createStyleMixin,\n  draggableMixin,\n  componentNameValidationMixin,\n} from '@descope-ui/common/components-mixins';\nimport { compose } from '@descope-ui/common/utils';\nimport {\n  getComponentName,\n  injectStyle,\n  observeChildren,\n} from '@descope-ui/common/components-helpers';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\n\nexport const componentName = getComponentName('text');\n\nclass RawText extends createBaseClass({\n  componentName,\n  baseSelector: ':host > slot',\n}) {\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n    <slot part=\"text-wrapper\"></slot>\n    `;\n\n    injectStyle(`\n      :host {\n        display: inline-block;\n        line-height: 1em;\n      }\n      :host > slot {\n        width: 100%;\n        display: inline-block;\n      }\n    `, this);\n  }\n\n  get hideWhenEmpty() {\n    return this.getAttribute('hide-when-empty') === 'true';\n  }\n\n  init() {\n    super.init();\n\n    observeChildren(this, () => {\n      const hasChildren = !!this.childNodes.length;\n      this.style.display = !hasChildren && this.hideWhenEmpty ? 'none' : '';\n    });\n  }\n}\n\nexport const TextClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: { selector: () => ':host', property: 'width' },\n      hostDirection: { selector: () => ':host', property: 'direction' },\n      fontSize: {},\n      textColor: { property: 'color' },\n      textLineHeight: { property: 'line-height' },\n      textLetterSpacing: { property: 'letter-spacing' },\n      textShadow: {},\n      textAlign: {},\n      textTransform: {},\n      fontFamily: {},\n      fontStyle: {},\n      fontWeight: {},\n      borderWidth: {},\n      borderStyle: {},\n      borderColor: {},\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawText);\n","import {\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 {\n  forwardAttrs,\n  getComponentName,\n  injectStyle,\n} from '@descope-ui/common/components-helpers';\nimport chevronIcon from './chevron.svg';\nimport { TextClass } from '@descope-ui/descope-text/class';\n\nexport const componentName = getComponentName('collapsible-container');\n\nclass RawCollapsibleContainer extends createBaseClass({\n  componentName,\n  baseSelector: 'slot',\n}) {\n  static get observedAttributes() {\n    return ['collapsed', 'collapsible', 'text'];\n  }\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n    <div class=\"wrapper\">\n      <descope-text st-host-direction=\"ltr\">\n        <div class=\"header\">\n          <div class=\"icon\">\n            <descope-icon st-fill=\"currentcolor\" src=${chevronIcon}></descope-icon>\n          </div>\n          <span></span>\n        </div>\n      </descope-text>\n      <div class=\"content\">\n        <slot></slot>\n      </div>\n    </div>\n\t`;\n\n    injectStyle(\n      `\n      div.content {\n        transition-property: max-height;\n        overflow: auto;\n        height: auto;\n\t\t\t}\n\t\t\tslot {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\twidth: 100%;\n\t\t\t\tdisplay: flex;\n\t\t\t}\n      slot:focus-visible {\n        outline: none;\n      }\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n      .header {\n          user-select: none;\n          display: flex;\n          align-items: baseline;\n      }\n      .icon {\n          flex-shrink: 0;\n          height: var(${TextClass.cssVarList.textLineHeight});\n          min-height: 24px;\n          display: flex;\n          align-items: center;\n      }\n      descope-icon {\n          transition-property: transform;\n      }\n      .rotate {\n          transform: rotate(-180deg);\n      }\n      descope-text {\n        width: 100%;\n        display: flex;\n      }\n      span {\n        align-self: center;\n        word-break: break-word;\n      }\n      span:empty {\n        display: none;\n      }\n      .wrapper {\n        overflow: hidden;\n        display: inline-flex;\n        width: 100%;\n        flex-direction: column;\n      }\n  `,\n      this,\n    );\n\n    this.header = this.shadowRoot.querySelector('.header');\n    this.content = this.shadowRoot.querySelector('div.content');\n    this.icon = this.header.querySelector('descope-icon');\n    this.headerText = this.header.querySelector('span');\n    this.textComponent = this.shadowRoot.querySelector('descope-text');\n  }\n\n  get isCollapsible() {\n    return this.getAttribute('collapsible') === 'true';\n  }\n\n  calcContentHeight() {\n    return this.content.offsetHeight || this.content.scrollHeight;\n  }\n\n  get isCollapsed() {\n    return this.getAttribute('collapsed') === 'true';\n  }\n\n  toggle() {\n    this.setAttribute('collapsed', this.isCollapsed ? 'false' : 'true');\n  }\n\n  collapse(animated = false) {\n    const final = () => {\n      this.content.style.maxHeight = '0px';\n    };\n    this.icon.classList.add('rotate');\n    if (!animated) return final();\n\n    this.content.style.maxHeight = this.calcContentHeight() + 'px';\n    setTimeout(final);\n  }\n\n  expand(animated = false) {\n    const final = () => {\n      this.content.style.maxHeight = '';\n    };\n    this.icon.classList.remove('rotate');\n    if (!animated) return final();\n\n    this.content.addEventListener('transitionend', final, { once: true });\n    this.content.style.maxHeight = this.calcContentHeight() + 'px';\n  }\n\n  #isComponentMounted = false;\n\n  init() {\n    super.init?.();\n    // we want to animate the collapse/expand only after the first time the component is connected\n    // so when setting a default value for the collapsed attribute, it will not animate\n    this.#isComponentMounted = true;\n\n    this.header.addEventListener('click', () => {\n      if (!this.isCollapsible) return;\n      this.toggle();\n    });\n    forwardAttrs(this, this.textComponent, {\n      includeAttrs: ['text-align', 'text-variant', 'text-mode'],\n      mapAttrs: { 'text-mode': 'mode', 'text-variant': 'variant' },\n    });\n  }\n\n  updateHeaderText() {\n    const text = this.getAttribute('text') || '';\n    this.headerText.innerText = text;\n  }\n\n  attributeChangedCallback(name, oldValue, newValue) {\n    if (name === 'text') {\n      this.updateHeaderText();\n      return;\n    }\n    const collapsed = this.isCollapsed && this.isCollapsible;\n    if (collapsed) {\n      this.collapse(this.#isComponentMounted);\n    } else {\n      this.expand(this.#isComponentMounted);\n    }\n  }\n}\n\nconst selectors = {\n  host: () => ':host',\n  icon: () => 'descope-icon',\n  iconWrapper: () => '.icon',\n  header: () => '.header',\n  text: () => 'span',\n  wrapper: () => '.wrapper',\n  content: () => 'div.content',\n};\n\nexport const CollapsibleContainerClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: { selector: selectors.host, property: 'width' },\n      hostDirection: { selector: selectors.host, property: 'direction' },\n      verticalPadding: [\n        { selector: selectors.wrapper, property: 'padding-top' },\n        { selector: selectors.wrapper, property: 'padding-bottom' },\n      ],\n      horizontalPadding: [\n        { selector: selectors.wrapper, property: 'padding-left' },\n        { selector: selectors.wrapper, property: 'padding-right' },\n      ],\n\n      flexDirection: {},\n      justifyContent: {},\n      alignItems: {},\n      gap: [{}, { property: 'margin-top' }],\n\n      backgroundColor: { selector: selectors.wrapper },\n      backgroundImage: { selector: selectors.wrapper },\n      backgroundPositionX: { selector: selectors.wrapper },\n      backgroundPositionY: { selector: selectors.wrapper },\n      backgroundSize: { selector: selectors.wrapper },\n      backgroundRepeat: { selector: selectors.wrapper },\n\n      borderRadius: { selector: selectors.wrapper },\n      borderColor: { selector: selectors.wrapper },\n      borderStyle: { selector: selectors.wrapper },\n      borderWidth: { selector: selectors.wrapper },\n\n      boxShadow: { selector: selectors.wrapper },\n\n      headerIconOrder: { selector: selectors.iconWrapper, property: 'order' },\n      headerCursor: { selector: selectors.header, property: 'cursor' },\n      headerGap: { selector: selectors.header, property: 'gap' },\n      textGrow: { selector: selectors.text, property: 'flex-grow' },\n      textDirection: { selector: selectors.text, property: 'direction' },\n      iconAnimationDuration: {\n        selector: selectors.icon,\n        property: 'transition-duration',\n      },\n      contentAnimationDuration: {\n        selector: selectors.content,\n        property: 'transition-duration',\n      },\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawCollapsibleContainer);\n","import '@descope-ui/descope-text'\nimport '@descope-ui/descope-icon'\nimport { componentName, CollapsibleContainerClass } from './CollapsibleContainerClass';\n\ncustomElements.define(componentName, CollapsibleContainerClass);\n\nexport { CollapsibleContainerClass, componentName };\n","module.exports = \"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iYmxhY2siIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+IDxwYXRoIGQ9Ik0xNy4yMTkzIDkuMjcyODNDMTcuNjU4NCA4Ljg3OTEyIDE4LjMzMzQgOC45MTU4NyAxOC43MjcyIDkuMzU0OTJDMTkuMTIwOSA5Ljc5Mzk3IDE5LjA4NDEgMTAuNDY5MSAxOC42NDUxIDEwLjg2MjhDMTguNjQ1MSAxMC44NjI4IDEzLjA0NTcgMTYuMDAyMiAxMi42NCAxNi4zNjZDMTIuMjM0MyAxNi43Mjk4IDExLjc2MDggMTYuNzI5OCAxMS4zNTUyIDE2LjM2Nkw1LjM1NDkyIDEwLjg2MjhDNC45MTU4NyAxMC40NjkxIDQuODc5MTIgOS43OTM5NyA1LjI3MjgzIDkuMzU0OTJDNS42NjY1NSA4LjkxNTg3IDYuMzQxNjQgOC44NzkxMiA2Ljc4MDY5IDkuMjcyODNMMTIgMTQuMTM2OEwxNy4yMTkzIDkuMjcyODNaIi8+IDwvc3ZnPiA=\"","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 { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('icon');\n\nexport const IconClass = compose(\n  createStyleMixin({\n    mappings: {\n      fill: {},\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(\n  createProxy({\n    slots: [],\n    wrappedEleName: 'descope-image',\n    style: () => `\n      :host {\n        display: inline-flex;\n      }\n      `,\n    excludeAttrsSync: ['tabindex', 'class'],\n    componentName,\n  }),\n);\n"],"names":["createSvgEle","text","clean","sanitize","USE_PROFILES","svg","svgFilters","DOMParser","parseFromString","querySelector","componentName","srcAttrs","RawImage","baseSelector","observedAttributes","constructor","super","this","attachShadow","mode","innerHTML","init","toggleVisibility","src","onThemeChange","renderImage","isVisible","classList","remove","add","legacySrc","getAttribute","themeSrc","currentThemeName","updateFillColor","node","querySelectorAll","forEach","ele","setAttribute","ImageClass","cssVarList","fill","async","startsWith","isBase64Svg","svgXml","atob","slice","base64Prefix","path","match","getFileExtension","fetchedSrc","fetch","document","createElement","createImgEle","style","setProperty","createImage","then","res","appendChild","shouldRender","srcVal","attributeChangedCallback","attrName","oldValue","newValue","mappings","height","selector","width","customElements","define","RawText","hideWhenEmpty","hasChildren","childNodes","length","display","TextClass","hostWidth","property","hostDirection","fontSize","textColor","textLineHeight","textLetterSpacing","textShadow","textAlign","textTransform","fontFamily","fontStyle","fontWeight","borderWidth","borderStyle","borderColor","RawCollapsibleContainer","header","shadowRoot","content","icon","headerText","textComponent","isCollapsible","calcContentHeight","offsetHeight","scrollHeight","isCollapsed","toggle","collapse","animated","final","maxHeight","setTimeout","expand","addEventListener","once","includeAttrs","mapAttrs","updateHeaderText","innerText","name","selectors","host","iconWrapper","wrapper","CollapsibleContainerClass","verticalPadding","horizontalPadding","flexDirection","justifyContent","alignItems","gap","backgroundColor","backgroundImage","backgroundPositionX","backgroundPositionY","backgroundSize","backgroundRepeat","borderRadius","boxShadow","headerIconOrder","headerCursor","headerGap","textGrow","textDirection","iconAnimationDuration","contentAnimationDuration","module","exports","IconClass","slots","wrappedEleName","excludeAttrsSync"],"sourceRoot":""}
+{"version":3,"file":"descope-collapsible-container.js","mappings":"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","sources":["webpack://@descope/web-components-ui/../components/descope-image/src/component/helpers.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/ImageClass.js","webpack://@descope/web-components-ui/../components/descope-image/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-icon/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-text/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-text/src/component/TextClass.js","webpack://@descope/web-components-ui/../components/descope-collapsible-container/src/component/CollapsibleContainerClass.js","webpack://@descope/web-components-ui/../components/descope-collapsible-container/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-collapsible-container/src/component/chevron.svg","webpack://@descope/web-components-ui/../components/descope-icon/src/component/IconClass.js"],"sourcesContent":["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  });\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","/* eslint-disable no-use-before-define */\nimport {\n  createStyleMixin,\n  draggableMixin,\n  componentNameValidationMixin,\n} from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport { compose } from '@descope-ui/common/utils';\nimport { getComponentName } from '@descope-ui/common/components-helpers';\nimport { createImage } from './helpers';\nimport { injectStyle } from '@descope-ui/common/components-helpers';\n\nexport const componentName = getComponentName('image');\n\nconst srcAttrs = ['src', 'src-dark'];\n\nclass RawImage extends createBaseClass({\n  componentName,\n  baseSelector: 'slot',\n}) {\n  static get observedAttributes() {\n    return srcAttrs;\n  }\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n\t\t<slot></slot>\n\t`;\n\n    injectStyle(\n      `\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n      :host > slot {\n        width: 100%;\n        height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n      ::slotted(*) {\n        width: 100%;\n\t\t\t}\n\n      .hidden {\n        display: none;\n      }\n      `,\n      this,\n    );\n  }\n\n  init() {\n    super.init?.();\n    this.toggleVisibility(this.src);\n  }\n\n  onThemeChange() {\n    this.renderImage();\n  }\n\n  toggleVisibility(isVisible) {\n    if (isVisible) {\n      this.classList.remove('hidden');\n    } else {\n      this.classList.add('hidden');\n    }\n  }\n\n  get altText() {\n    return this.getAttribute('alt') || '';\n  }\n\n  get legacySrc() {\n    return this.getAttribute('src');\n  }\n\n  get themeSrc() {\n    return this.getAttribute(`src-${this.currentThemeName}`);\n  }\n\n  get src() {\n    return this.themeSrc || this.legacySrc;\n  }\n\n  // in order to fill an SVG with `currentColor` override all of its `fill` and `path` nodes\n  // with the value from the `st-fill` attribute\n  // eslint-disable-next-line class-methods-use-this\n  updateFillColor(node) {\n    // set fill to root node and all its relevant selectors\n    const elementsToReplace = [node, ...node.querySelectorAll('*[fill]')];\n\n    elementsToReplace.forEach((ele) => {\n      ele.setAttribute(\n        'fill',\n        `var(${ImageClass.cssVarList.fill}, ${ele.getAttribute('fill') || \"''\"})`,\n      );\n    });\n  }\n\n  renderImage() {\n    this.toggleVisibility(this.src);\n\n    createImage(this.src, this.altText).then((res) => {\n      this.innerHTML = '';\n      if (res) {\n        this.updateFillColor(res);\n        this.appendChild(res);\n      }\n    });\n  }\n\n  // render only when src attribute matches current theme\n  shouldRender(src) {\n    const srcVal = this.getAttribute(src);\n    return this.src === srcVal;\n  }\n\n  attributeChangedCallback(attrName, oldValue, newValue) {\n    super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n    if (oldValue === newValue) return;\n\n    if (this.shouldRender(attrName)) {\n      this.renderImage();\n    }\n  }\n}\n\nexport const ImageClass = compose(\n  createStyleMixin({\n    mappings: {\n      fill: {},\n      height: { selector: () => ':host' },\n      width: { selector: () => ':host' },\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawImage);\n","import { componentName, ImageClass } from './ImageClass';\n\ncustomElements.define(componentName, ImageClass);\n\nexport { ImageClass, componentName };\n","import '@descope-ui/descope-image';\n\nimport { componentName, IconClass } from './IconClass';\n\ncustomElements.define(componentName, IconClass);\n\nexport { IconClass, componentName };\n","import { componentName, TextClass } from './TextClass';\n\ncustomElements.define(componentName, TextClass);\n\nexport { TextClass, componentName };\n","import {\n  createStyleMixin,\n  draggableMixin,\n  componentNameValidationMixin,\n} from '@descope-ui/common/components-mixins';\nimport { compose } from '@descope-ui/common/utils';\nimport {\n  getComponentName,\n  injectStyle,\n  observeChildren,\n} from '@descope-ui/common/components-helpers';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\n\nexport const componentName = getComponentName('text');\n\nclass RawText extends createBaseClass({\n  componentName,\n  baseSelector: ':host > slot',\n}) {\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n    <slot part=\"text-wrapper\"></slot>\n    `;\n\n    injectStyle(`\n      :host {\n        display: inline-block;\n        line-height: 1em;\n      }\n      :host > slot {\n        width: 100%;\n        display: inline-block;\n      }\n    `, this);\n  }\n\n  get hideWhenEmpty() {\n    return this.getAttribute('hide-when-empty') === 'true';\n  }\n\n  init() {\n    super.init();\n\n    observeChildren(this, () => {\n      const hasChildren = !!this.childNodes.length;\n      this.style.display = !hasChildren && this.hideWhenEmpty ? 'none' : '';\n    });\n  }\n}\n\nexport const TextClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: { selector: () => ':host', property: 'width' },\n      hostDirection: { selector: () => ':host', property: 'direction' },\n      fontSize: {},\n      textColor: { property: 'color' },\n      textLineHeight: { property: 'line-height' },\n      textLetterSpacing: { property: 'letter-spacing' },\n      textShadow: {},\n      textAlign: {},\n      textTransform: {},\n      fontFamily: {},\n      fontStyle: {},\n      fontWeight: {},\n      borderWidth: {},\n      borderStyle: {},\n      borderColor: {},\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawText);\n","import {\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 {\n  forwardAttrs,\n  getComponentName,\n  injectStyle,\n} from '@descope-ui/common/components-helpers';\nimport chevronIcon from './chevron.svg';\nimport { TextClass } from '@descope-ui/descope-text/class';\n\nexport const componentName = getComponentName('collapsible-container');\n\nclass RawCollapsibleContainer extends createBaseClass({\n  componentName,\n  baseSelector: 'slot',\n}) {\n  static get observedAttributes() {\n    return ['collapsed', 'collapsible', 'text'];\n  }\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n    <div class=\"wrapper\">\n      <descope-text st-host-direction=\"ltr\">\n        <div class=\"header\">\n          <div class=\"icon\">\n            <descope-icon st-fill=\"currentcolor\" src=${chevronIcon}></descope-icon>\n          </div>\n          <span></span>\n        </div>\n      </descope-text>\n      <div class=\"content\">\n        <slot></slot>\n      </div>\n    </div>\n\t`;\n\n    injectStyle(\n      `\n      div.content {\n        transition-property: max-height;\n        overflow: auto;\n        height: auto;\n\t\t\t}\n\t\t\tslot {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\twidth: 100%;\n\t\t\t\tdisplay: flex;\n\t\t\t}\n      slot:focus-visible {\n        outline: none;\n      }\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n      .header {\n          user-select: none;\n          display: flex;\n          align-items: baseline;\n      }\n      .icon {\n          flex-shrink: 0;\n          height: var(${TextClass.cssVarList.textLineHeight});\n          min-height: 24px;\n          display: flex;\n          align-items: center;\n      }\n      descope-icon {\n          transition-property: transform;\n      }\n      .rotate {\n          transform: rotate(-180deg);\n      }\n      descope-text {\n        width: 100%;\n        display: flex;\n      }\n      span {\n        align-self: center;\n        word-break: break-word;\n      }\n      span:empty {\n        display: none;\n      }\n      .wrapper {\n        overflow: hidden;\n        display: inline-flex;\n        width: 100%;\n        flex-direction: column;\n      }\n  `,\n      this,\n    );\n\n    this.header = this.shadowRoot.querySelector('.header');\n    this.content = this.shadowRoot.querySelector('div.content');\n    this.icon = this.header.querySelector('descope-icon');\n    this.headerText = this.header.querySelector('span');\n    this.textComponent = this.shadowRoot.querySelector('descope-text');\n  }\n\n  get isCollapsible() {\n    return this.getAttribute('collapsible') === 'true';\n  }\n\n  calcContentHeight() {\n    return this.content.offsetHeight || this.content.scrollHeight;\n  }\n\n  get isCollapsed() {\n    return this.getAttribute('collapsed') === 'true';\n  }\n\n  toggle() {\n    this.setAttribute('collapsed', this.isCollapsed ? 'false' : 'true');\n  }\n\n  collapse(animated = false) {\n    const final = () => {\n      this.content.style.maxHeight = '0px';\n    };\n    this.icon.classList.add('rotate');\n    if (!animated) return final();\n\n    this.content.style.maxHeight = this.calcContentHeight() + 'px';\n    setTimeout(final);\n  }\n\n  expand(animated = false) {\n    const final = () => {\n      this.content.style.maxHeight = '';\n    };\n    this.icon.classList.remove('rotate');\n    if (!animated) return final();\n\n    this.content.addEventListener('transitionend', final, { once: true });\n    this.content.style.maxHeight = this.calcContentHeight() + 'px';\n  }\n\n  #isComponentMounted = false;\n\n  init() {\n    super.init?.();\n    // we want to animate the collapse/expand only after the first time the component is connected\n    // so when setting a default value for the collapsed attribute, it will not animate\n    this.#isComponentMounted = true;\n\n    this.header.addEventListener('click', () => {\n      if (!this.isCollapsible) return;\n      this.toggle();\n    });\n    forwardAttrs(this, this.textComponent, {\n      includeAttrs: ['text-align', 'text-variant', 'text-mode'],\n      mapAttrs: { 'text-mode': 'mode', 'text-variant': 'variant' },\n    });\n  }\n\n  updateHeaderText() {\n    const text = this.getAttribute('text') || '';\n    this.headerText.innerText = text;\n  }\n\n  attributeChangedCallback(name, oldValue, newValue) {\n    if (name === 'text') {\n      this.updateHeaderText();\n      return;\n    }\n    const collapsed = this.isCollapsed && this.isCollapsible;\n    if (collapsed) {\n      this.collapse(this.#isComponentMounted);\n    } else {\n      this.expand(this.#isComponentMounted);\n    }\n  }\n}\n\nconst selectors = {\n  host: () => ':host',\n  icon: () => 'descope-icon',\n  iconWrapper: () => '.icon',\n  header: () => '.header',\n  text: () => 'span',\n  wrapper: () => '.wrapper',\n  content: () => 'div.content',\n};\n\nexport const CollapsibleContainerClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: { selector: selectors.host, property: 'width' },\n      hostDirection: { selector: selectors.host, property: 'direction' },\n      verticalPadding: [\n        { selector: selectors.wrapper, property: 'padding-top' },\n        { selector: selectors.wrapper, property: 'padding-bottom' },\n      ],\n      horizontalPadding: [\n        { selector: selectors.wrapper, property: 'padding-left' },\n        { selector: selectors.wrapper, property: 'padding-right' },\n      ],\n\n      flexDirection: {},\n      justifyContent: {},\n      alignItems: {},\n      gap: [{}, { property: 'margin-top' }],\n\n      backgroundColor: { selector: selectors.wrapper },\n      backgroundImage: { selector: selectors.wrapper },\n      backgroundPositionX: { selector: selectors.wrapper },\n      backgroundPositionY: { selector: selectors.wrapper },\n      backgroundSize: { selector: selectors.wrapper },\n      backgroundRepeat: { selector: selectors.wrapper },\n\n      borderRadius: { selector: selectors.wrapper },\n      borderColor: { selector: selectors.wrapper },\n      borderStyle: { selector: selectors.wrapper },\n      borderWidth: { selector: selectors.wrapper },\n\n      boxShadow: { selector: selectors.wrapper },\n\n      headerIconOrder: { selector: selectors.iconWrapper, property: 'order' },\n      headerCursor: { selector: selectors.header, property: 'cursor' },\n      headerGap: { selector: selectors.header, property: 'gap' },\n      textGrow: { selector: selectors.text, property: 'flex-grow' },\n      textDirection: { selector: selectors.text, property: 'direction' },\n      iconAnimationDuration: {\n        selector: selectors.icon,\n        property: 'transition-duration',\n      },\n      contentAnimationDuration: {\n        selector: selectors.content,\n        property: 'transition-duration',\n      },\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawCollapsibleContainer);\n","import '@descope-ui/descope-text'\nimport '@descope-ui/descope-icon'\nimport { componentName, CollapsibleContainerClass } from './CollapsibleContainerClass';\n\ncustomElements.define(componentName, CollapsibleContainerClass);\n\nexport { CollapsibleContainerClass, componentName };\n","module.exports = \"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0iYmxhY2siIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+IDxwYXRoIGQ9Ik0xNy4yMTkzIDkuMjcyODNDMTcuNjU4NCA4Ljg3OTEyIDE4LjMzMzQgOC45MTU4NyAxOC43MjcyIDkuMzU0OTJDMTkuMTIwOSA5Ljc5Mzk3IDE5LjA4NDEgMTAuNDY5MSAxOC42NDUxIDEwLjg2MjhDMTguNjQ1MSAxMC44NjI4IDEzLjA0NTcgMTYuMDAyMiAxMi42NCAxNi4zNjZDMTIuMjM0MyAxNi43Mjk4IDExLjc2MDggMTYuNzI5OCAxMS4zNTUyIDE2LjM2Nkw1LjM1NDkyIDEwLjg2MjhDNC45MTU4NyAxMC40NjkxIDQuODc5MTIgOS43OTM5NyA1LjI3MjgzIDkuMzU0OTJDNS42NjY1NSA4LjkxNTg3IDYuMzQxNjQgOC44NzkxMiA2Ljc4MDY5IDkuMjcyODNMMTIgMTQuMTM2OEwxNy4yMTkzIDkuMjcyODNaIi8+IDwvc3ZnPiA=\"","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 { compose } from '@descope-ui/common/utils';\n\nexport const componentName = getComponentName('icon');\n\nexport const IconClass = compose(\n  createStyleMixin({\n    mappings: {\n      fill: {},\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(\n  createProxy({\n    slots: [],\n    wrappedEleName: 'descope-image',\n    style: () => `\n      :host {\n        display: inline-flex;\n      }\n      `,\n    excludeAttrsSync: ['tabindex', 'class'],\n    componentName,\n  }),\n);\n"],"names":["createSvgEle","text","clean","sanitize","USE_PROFILES","svg","svgFilters","DOMParser","parseFromString","querySelector","componentName","srcAttrs","RawImage","baseSelector","observedAttributes","constructor","super","this","attachShadow","mode","innerHTML","init","toggleVisibility","src","onThemeChange","renderImage","isVisible","classList","remove","add","altText","getAttribute","legacySrc","themeSrc","currentThemeName","updateFillColor","node","querySelectorAll","forEach","ele","setAttribute","ImageClass","cssVarList","fill","async","startsWith","isBase64Svg","svgXml","atob","slice","base64Prefix","path","match","getFileExtension","fetchedSrc","fetch","document","createElement","createImgEle","style","setProperty","createImage","then","res","appendChild","shouldRender","srcVal","attributeChangedCallback","attrName","oldValue","newValue","mappings","height","selector","width","customElements","define","RawText","hideWhenEmpty","hasChildren","childNodes","length","display","TextClass","hostWidth","property","hostDirection","fontSize","textColor","textLineHeight","textLetterSpacing","textShadow","textAlign","textTransform","fontFamily","fontStyle","fontWeight","borderWidth","borderStyle","borderColor","RawCollapsibleContainer","header","shadowRoot","content","icon","headerText","textComponent","isCollapsible","calcContentHeight","offsetHeight","scrollHeight","isCollapsed","toggle","collapse","animated","final","maxHeight","setTimeout","expand","addEventListener","once","includeAttrs","mapAttrs","updateHeaderText","innerText","name","selectors","host","iconWrapper","wrapper","CollapsibleContainerClass","verticalPadding","horizontalPadding","flexDirection","justifyContent","alignItems","gap","backgroundColor","backgroundImage","backgroundPositionX","backgroundPositionY","backgroundSize","backgroundRepeat","borderRadius","boxShadow","headerIconOrder","headerCursor","headerGap","textGrow","textDirection","iconAnimationDuration","contentAnimationDuration","module","exports","IconClass","slots","wrappedEleName","excludeAttrsSync"],"sourceRoot":""}

package/dist/umd/descope-date-field-descope-calendar-index-js.js

@@ -1,2 +1,2 @@
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[6028],{3393:(t,e,n)=>{n.d(e,{y:()=>o});var a=n(9696),r=n(79365),i=n(81365);const o=(...t)=>(0,a.Zz)(r.XX,r._$,r.yF,r.jd)((0,i.q)(...t))},10767:(t,e,n)=>{n.d(e,{G:()=>a});const a=t=>class extends t{get isLoading(){return"true"===this.getAttribute("loading")}click(){this.isLoading||super.click()}}},19624:(t,e,n)=>{n.d(e,{J:()=>u,T:()=>l});var a=n(63200),r=n(25964),i=n(88961),o=n(98538),s=n(10767);const l=(0,r.xE)("button"),{host:d,label:p,slottedIcon:h}={host:{selector:()=>":host"},label:{selector:"::part(label)"},slottedIcon:{selector:()=>"::slotted(descope-icon)"}};let c;const u=(0,a.Zz)((0,i.RF)({mappings:{hostWidth:{property:"width"},hostHeight:{property:"height"},hostDirection:{...d,property:"direction"},fontSize:{},fontFamily:{},cursor:{},backgroundColor:{},outlineOffset:{},outlineColor:{},outlineStyle:{},outlineWidth:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-right",fallback:"0.875em"},{property:"padding-left",fallback:"0.875em"}],labelTextColor:{property:"color"},iconColor:{selector:()=>"::slotted(*)",property:o.S.cssVarList.fill},labelTextDecoration:{...p,property:"text-decoration"},labelSpacing:{...p,property:"gap"},textAlign:{...p,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${c}\n\t\t\tvaadin-button::part(label) { pointer-events: none; }\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${u.cssVarList.outlineWidth}) + var(${u.cssVarList.outlineOffset}));\n\t\t\t}\n      :host([full-width="true"]) {\n        width: var(${u.cssVarList.hostWidth});\n      }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${u.cssVarList.hostHeight}) - var(${u.cssVarList.outlineWidth}) - var(${u.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square="true"]:not([full-width="true"]) {\n\t\t\t\twidth: calc(var(${u.cssVarList.hostWidth}) - var(${u.cssVarList.outlineWidth}) - var(${u.cssVarList.outlineOffset}));\n        padding: 0;\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:l})),{color:y,fontSize:b}=u.cssVarList;c=`\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(${y});\n\t\ttop: calc(50% - (var(${b}) / 2));\n\t\tleft: calc(50% - (var(${b}) / 2));\n\t\tborder-width: calc(var(${b}) / 10);\n\t\twidth: var(${b});\n\t\theight: var(${b});\n\t}\n\t:host([disabled="true"]),\n\t:host([loading="true"]) {\n\t\tpointer-events: none;\n\t}\n\t:host([loading="true"]) ::part(prefix),\n\t:host([loading="true"]) ::part(label) {\n\t\tvisibility: hidden;\n\t}\n`},30576:(t,e,n)=>{n.r(e),n.d(e,{ButtonClass:()=>a.J,componentName:()=>a.T});var a=n(19624);n(83799),customElements.define(a.T,a.J)},49224:(t,e,n)=>{n.d(e,{Bl:()=>c,Et:()=>i,Ey:()=>s,KQ:()=>d,Ln:()=>h,Nq:()=>l,Pj:()=>o,Xs:()=>b,_B:()=>y,tj:()=>u,xP:()=>r,y4:()=>p});var a=n(64101);const r=t=>!Number.isNaN(Number(t)),i=t=>!Number.isNaN(Number(t)),o=t=>{const e=new Date(t);return[e.getFullYear(),e.getMonth()+1,e.getDate()]},s=(t,e)=>{const[n,a,r]=o(t),i={DD:String(r).padStart(2,"0"),MM:String(a).padStart(2,"0"),YYYY:String(n)};return e.replace(/DD|MM|YYYY/g,(t=>i[t]))},l=t=>"number"==typeof t?new Date(t):"string"==typeof t?new Date(t.replace(/-/g,"/")):new Date,d=t=>a.xr.includes(t),p=(t,e,n)=>({refresh:n&&"r"===t.toLowerCase(),tab:"Tab"===t,shiftTab:e&&"Tab"===t,backspace:"Backspace"===t,arrowUp:!e&&"ArrowUp"===t,arrowDown:!e&&"ArrowDown"===t,arrowLeft:!e&&"ArrowLeft"===t,arrowRight:!e&&"ArrowRight"===t,pageUp:!e&&"PageUp"===t,pageDown:!e&&"PageDown"===t,shiftArrowUp:e&&"ArrowUp"===t,shiftArrowDown:e&&"ArrowDown"===t,shiftPageUp:e&&"PageUp"===t,shiftPageDown:e&&"PageDown"===t}),h=()=>l().getTime(),c=t=>l(t).getFullYear().toString(),u=t=>(l(t).getMonth()+1).toString(),y=()=>l().getDate(),b=t=>{const e=new CSSStyleSheet;e.insertRule(":host{display:block!important;}"),t?.shadowRoot?.adoptedStyleSheets?.push(e)}},64101:(t,e,n)=>{n.d(e,{QF:()=>y,SP:()=>a,Tv:()=>c,US:()=>d,V$:()=>o,eT:()=>s,lv:()=>u,mx:()=>p,rR:()=>h,ui:()=>r,wJ:()=>i,xr:()=>l});const a=["MM/DD/YYYY","DD/MM/YYYY","YYYY/MM/DD"],r=a[0],i="YYYY-MM-DD",o=100,s="/",l=["Backspace","ArrowLeft","ArrowRight","ArrowDown","ArrowUp","PageUp","PageDown","Meta"],d=["January","February","March","April","May","June","July","August","September","October","November","December"],p=["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],h={MONTH:{id:"month",min:1,max:12,placeholder:"MM",count:5,shiftCount:10},DAY:{id:"day",min:1,max:31,placeholder:"DD",count:5,shiftCount:10},YEAR:{id:"year",min:0,max:9999,placeholder:"YYYY",count:10,shiftCount:100}},c="Done",u="Cancel",y="Today"},73551:(t,e,n)=>{n.d(e,{$J:()=>c,I4:()=>o,Kl:()=>u,LJ:()=>h,Qv:()=>i,X6:()=>l,cy:()=>a,fu:()=>d,kG:()=>p,lS:()=>s,zm:()=>r});const a=t=>`\n    :host {\n        padding: calc(var(${t.inputOutlineWidth}) + var(${t.inputOutlineOffset}))\n    }\n`,r=t=>`\n    ${t} {\n        margin: 0;\n        padding: 0;\n        width: 100%;\n        height: 100%;\n        box-sizing: border-box;\n    }\n`,i=t=>`\n    ${t}::part(input-field) {\n        overflow: hidden;\n        padding: 0;\n        box-shadow: none;\n    }\n`,o=t=>`\n    ${t} > label,\n    ${t}::part(label),\n    ${t}::part(required-indicator) {\n        cursor: pointer;\n    }\n`,s=(t,e="input")=>`\n    ${t}[disabled] > ${e}:placeholder-shown,\n\t${t}[readonly] > ${e}:placeholder-shown {\n\t\topacity: 1;\n\t}\n`,l=()=>"\n    :host {\n        --vaadin-field-default-width: auto;\n        box-sizing: border-box;\n    }\n",d=t=>`\n    ${t}::part(input-field)::after {\n        opacity: 0;\n    }\n`,p=t=>`\n    ${t}::part(input-field)::after {\n        background: none;\n    }\n`,h=(t,e)=>`\n    ${r(t)}\n    ${o(t)}\n    ${s(t)}\n    ${i(t)}\n    ${((t,e)=>`\n    ${t} input:-webkit-autofill,\n    ${t} input:-webkit-autofill::first-line,\n    ${t} input:-webkit-autofill:hover,\n    ${t} input:-webkit-autofill:active,\n    ${t} input:-webkit-autofill:focus {\n        -webkit-text-fill-color: var(${e.inputValueTextColor});\n        box-shadow: 0 0 0 var(${e.inputHeight}) var(${e.inputBackgroundColor}) inset;\n    }\n`)(t,e)}\n    ${p(t)}\n    ${(t=>`\n    ${t}::before {\n\t\theight: unset;\n\t}\n`)(t)}\n    ${(t=>`\n    ${t} > input {\n        -webkit-mask-image: none;\n        min-height: 0;\n        box-sizing: border-box;\n    }\n`)(t)}\n    ${(t=>`\n    ${t}::part(input-field)::after {\n        border: none;\n    }\n`)(t)}\n`,c=t=>`\n    :host ::part(error-message) {\n      direction: ltr;\n    }\n    :host([required]) ::part(required-indicator) {\n      width: 1em;\n      display: inline-flex;\n    }\n    :host([required]) ::part(required-indicator)::after {\n      position: static;\n    }\n    :host([has-label]) ::part(label) {\n      padding-right: 0;\n      padding-bottom: 0;\n      display: flex;\n      width: 100%;\n    }\n    ${t} [slot="label"] {\n      max-width: calc(100% - 1em);\n      overflow: hidden;\n      text-overflow: ellipsis;\n      padding-bottom: 0.5em;\n    }\n`,u=()=>'\n  :host([label-type="floating"]) {\n    position: relative;\n  }\n  :host([label-type="floating"][has-label]) [slot="label"] {\n    padding: 0;\n  }\n  :host([label-type="floating"][has-label]) > ::part(label) {\n    z-index: 1;\n    padding: 0;\n    width: auto;\n  }\n  '},80071:(t,e,n)=>{n.d(e,{ZM:()=>r,i1:()=>i,ki:()=>a});const a='\n<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path fill-rule="evenodd" clip-rule="evenodd" d="M9 5H15V4.50468C15 4.21404 15.226 4 15.5047 4H16.4953C16.786 4 17 4.22595 17 4.50468V5H18.7568C19.3028 5 19.75 5.44725 19.75 5.99896V7.00104C19.75 7.55734 19.3053 8 18.7568 8H5.24317C4.69717 8 4.25 7.55275 4.25 7.00104V5.99896C4.25 5.44266 4.69466 5 5.24317 5H7V4.50468C7 4.21404 7.22596 4 7.50468 4H8.49532C8.78596 4 9 4.22595 9 4.50468V5ZM5.50468 9H6.49532C6.78596 9 7 9.22596 7 9.50468V10.4953C7 10.786 6.77404 11 6.49532 11H5.50468C5.21404 11 5 10.774 5 10.4953V9.50468C5 9.21404 5.22595 9 5.50468 9ZM8.50468 9H9.49532C9.78596 9 10 9.22596 10 9.50468V10.4953C10 10.786 9.77404 11 9.49532 11H8.50468C8.21404 11 8 10.774 8 10.4953V9.50468C8 9.21404 8.22596 9 8.50468 9ZM11.5047 9H12.4953C12.786 9 13 9.22596 13 9.50468V10.4953C13 10.786 12.774 11 12.4953 11H11.5047C11.214 11 11 10.774 11 10.4953V9.50468C11 9.21404 11.226 9 11.5047 9ZM5.50468 12H6.49532C6.78596 12 7 12.226 7 12.5047V13.4953C7 13.786 6.77404 14 6.49532 14H5.50468C5.21404 14 5 13.774 5 13.4953V12.5047C5 12.214 5.22595 12 5.50468 12ZM8.50468 12H9.49532C9.78596 12 10 12.226 10 12.5047V13.4953C10 13.786 9.77404 14 9.49532 14H8.50468C8.21404 14 8 13.774 8 13.4953V12.5047C8 12.214 8.22596 12 8.50468 12ZM11.5047 12H12.4953C12.786 12 13 12.226 13 12.5047V13.4953C13 13.786 12.774 14 12.4953 14H11.5047C11.214 14 11 13.774 11 13.4953V12.5047C11 12.214 11.226 12 11.5047 12ZM5.50468 15H6.49532C6.78596 15 7 15.226 7 15.5047V16.4953C7 16.786 6.77404 17 6.49532 17H5.50468C5.21404 17 5 16.774 5 16.4953V15.5047C5 15.214 5.22595 15 5.50468 15ZM8.50468 15H9.49532C9.78596 15 10 15.226 10 15.5047V16.4953C10 16.786 9.77404 17 9.49532 17H8.50468C8.21404 17 8 16.774 8 16.4953V15.5047C8 15.214 8.22596 15 8.50468 15ZM11.5047 15H12.4953C12.786 15 13 15.226 13 15.5047V16.4953C13 16.786 12.774 17 12.4953 17H11.5047C11.214 17 11 16.774 11 16.4953V15.5047C11 15.214 11.226 15 11.5047 15ZM14.5047 9H15.4953C15.786 9 16 9.22596 16 9.50468V10.4953C16 10.786 15.774 11 15.4953 11H14.5047C14.214 11 14 10.774 14 10.4953V9.50468C14 9.21404 14.226 9 14.5047 9ZM14.5047 12H15.4953C15.786 12 16 12.226 16 12.5047V13.4953C16 13.786 15.774 14 15.4953 14H14.5047C14.214 14 14 13.774 14 13.4953V12.5047C14 12.214 14.226 12 14.5047 12ZM14.5047 15H15.4953C15.786 15 16 15.226 16 15.5047V16.4953C16 16.786 15.774 17 15.4953 17H14.5047C14.214 17 14 16.774 14 16.4953V15.5047C14 15.214 14.226 15 14.5047 15ZM17.5047 15H18.4953C18.786 15 19 15.226 19 15.5047V16.4953C19 16.786 18.774 17 18.4953 17H17.5047C17.214 17 17 16.774 17 16.4953V15.5047C17 15.214 17.226 15 17.5047 15ZM5.50468 18H6.49532C6.78596 18 7 18.226 7 18.5047V19.4953C7 19.786 6.77404 20 6.49532 20H5.50468C5.21404 20 5 19.774 5 19.4953V18.5047C5 18.214 5.22595 18 5.50468 18ZM8.50468 18H9.49532C9.78596 18 10 18.226 10 18.5047V19.4953C10 19.786 9.77404 20 9.49532 20H8.50468C8.21404 20 8 19.774 8 19.4953V18.5047C8 18.214 8.22596 18 8.50468 18ZM11.5047 18H12.4953C12.786 18 13 18.226 13 18.5047V19.4953C13 19.786 12.774 20 12.4953 20H11.5047C11.214 20 11 19.774 11 19.4953V18.5047C11 18.214 11.226 18 11.5047 18ZM14.5047 18H15.4953C15.786 18 16 18.226 16 18.5047V19.4953C16 19.786 15.774 20 15.4953 20H14.5047C14.214 20 14 19.774 14 19.4953V18.5047C14 18.214 14.226 18 14.5047 18ZM17.5047 18H18.4953C18.786 18 19 18.226 19 18.5047V19.4953C19 19.786 18.774 20 18.4953 20H17.5047C17.214 20 17 19.774 17 19.4953V18.5047C17 18.214 17.226 18 17.5047 18ZM17.5047 12H18.4953C18.786 12 19 12.226 19 12.5047V13.4953C19 13.786 18.774 14 18.4953 14H17.5047C17.214 14 17 13.774 17 13.4953V12.5047C17 12.214 17.226 12 17.5047 12ZM17.5047 9H18.4953C18.786 9 19 9.22596 19 9.50468V10.4953C19 10.786 18.774 11 18.4953 11H17.5047C17.214 11 17 10.774 17 10.4953V9.50468C17 9.21404 17.226 9 17.5047 9Z" fill="#808080"/>\n</svg>\n',r='\n<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M9.27283 6.78069C8.87912 6.34164 8.91587 5.66655 9.35492 5.27283C9.79397 4.87912 10.4691 4.91587 10.8628 5.35492C10.8628 5.35492 16.0022 10.9543 16.366 11.36C16.7298 11.7657 16.7298 12.2392 16.366 12.6448L10.8628 18.6451C10.4691 19.0841 9.79397 19.1209 9.35492 18.7272C8.91587 18.3334 8.87912 17.6584 9.27283 17.2193L14.1368 12L9.27283 6.78069Z" fill="#808080"/>\n</svg>',i='<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M14.7272 17.2193C15.1209 17.6584 15.0841 18.3334 14.6451 18.7272C14.206 19.1209 13.5309 19.0841 13.1372 18.6451C13.1372 18.6451 7.99776 13.0457 7.63399 12.64C7.27023 12.2343 7.27023 11.7608 7.63399 11.3552L13.1372 5.35492C13.5309 4.91587 14.206 4.87912 14.6451 5.27283C15.0841 5.66655 15.1209 6.34164 14.7272 6.78069L9.86322 12L14.7272 17.2193Z" fill="#808080"/>\n</svg>'},88350:(t,e,n)=>{n.r(e),n.d(e,{CalendarClass:()=>q,componentName:()=>m}),n(27092),n(30576);var a=n(3393),r=n(9696),i=n(97810),o=n(73551),s=n(79365),l=n(49224),d=n(80071),p=n(64101);const h=(t,e)=>Array.isArray(t)&&t.length===e&&t.filter(Boolean).length===e,c=({label:t,dataId:e,dataName:n})=>`\n\t<div class="combo-box-item"\n\t\tdata-id="${e}"\n\t\tdata-name="${n}"\n\t>\n\t\t\t${t}\n\t</div>\n`,u=(t=p.US)=>t.map(((t,e)=>c({label:t,dataId:e+1,dataName:t}))).join(""),y=(t,e)=>{const[n,a]=(0,l.Pj)(e),[r,i]=(0,l.Pj)(t);return r===n&&i===a},b=(t,e,n)=>(t.addEventListener("input",e),t.addEventListener("focusout",n),t);var g=n(19624),v=n(25964);const m=(0,i.xE)("calendar"),C=["initial-value","initial-year","initial-month","years-range","calendar-months","calendar-weekdays","calendar-label-today","st-host-direction","disabled","full-width"],w=["calendar-label-submit","calendar-label-cancel"],f=(0,a.y)({componentName:m,baseSelector:"div"}),{calendar:x,day:V,dayEntry:M,currentDay:S,selectedDay:D,disabledDay:$,weekday:N,topNav:H,topNavSelectors:k,bottomNav:E,navPrev:L,navNext:A,navPrevRTL:B,navNextRTL:T,yearInput:Y,monthInput:I}={calendar:{selector:()=>".calendar"},topNav:{selector:()=>".nav.top-nav"},topNavSelectors:{selector:()=>".nav.top-nav .selectors > span"},bottomNav:{selector:()=>".nav.bottom-nav"},day:{selector:()=>".day"},dayEntry:{selector:()=>".day-entry"},currentDay:{selector:()=>".day-entry[data-current-day] .day"},selectedDay:{selector:()=>".day-entry[data-selected] .day"},disabledDay:{selector:()=>'.day-entry[data-disabled="true"] .day'},weekday:{selector:()=>".weekday"},navPrev:{selector:()=>".nav-prev"},navNext:{selector:()=>".nav-next"},navPrevRTL:{selector:()=>':host([st-host-direction="rtl"]) .nav-prev'},navNextRTL:{selector:()=>':host([st-host-direction="rtl"]) .nav-next'},yearInput:{selector:()=>".year-input"},monthInput:{selector:()=>".month-input"}},q=(0,r.Zz)((0,s.RF)({componentNameOverride:(0,i.xE)("input-wrapper")}),(0,s.RF)({mappings:{fontSize:{},fontFamily:{},hostWidth:[{selector:()=>":host",property:"width"},{selector:"table",property:"width"}],hostDirection:{property:"direction"},topNavVerticalPadding:[{...H,property:"padding-top"},{...H,property:"padding-bottom"}],topNavHorizointalPadding:[{...H,property:"padding-right"},{...H,property:"padding-left"}],topNavAlignment:{...H,property:"justify-content"},topNavGap:{...H,property:"gap"},topNavSelectorsGap:{...k,property:"gap"},bottomNavVerticalPadding:[{...E,property:"padding-top"},{...E,property:"padding-bottom"}],bottomNavHorizontalPadding:[{...E,property:"padding-right"},{...E,property:"padding-left"}],bottomNavAlignment:{...E,property:"justify-content"},bottomNavGap:{...E,property:"gap"},navMarginBottom:{...H,property:"margin-bottom"},calendarPadding:[{...x,property:"padding-bottom"},{...x,property:"padding-right"},{...x,property:"padding-left"}],navBorderBottomWidth:{...H,property:"border-bottom-width"},navBorderBottomColor:{...H,property:"border-bottom-color"},navBorderBottomStyle:{...H,property:"border-bottom-style"},weekdayFontSize:{...N,property:"font-size"},weekdayFontWeight:{...N,property:"font-weight"},currentDayBorderColor:{...S,property:"border-color"},currentDayBorderWidth:{...S,property:"border-width"},currentDayBorderStyle:{...S,property:"border-style"},dayHeight:{...M,property:"height"},daySize:[{...V,property:"height"},{...V,property:"width"}],dayPadding:{...V,property:"padding"},dayRadius:{...V,property:"border-radius"},dayTextAlign:{...V,property:"text-align"},dayBlockAlign:{...V,property:"margin"},dayTextColor:{...V,property:"color"},dayFontWeight:{...V,property:"font-weight"},dayBackgroundColor:{...V,property:"background-color"},dayCursor:{...V,property:"cursor"},dayFontSize:{...V,property:"font-size"},dayBackgroundColorHover:{selector:()=>".day:hover",property:"background-color"},daySelectedTextdColor:{...D,property:"color"},daySelectedBackgroundColor:{...D,property:"background-color"},dayDisabledTextdColor:{...$,property:"color"},yearInputWidth:{...Y,property:"width"},monthInputWidth:{...I,property:"width"},navButtonSize:[{...L,property:"width"},{...L,property:"height"},{...A,property:"width"},{...A,property:"height"}],navButtonCursor:[{...L,property:"cursor"},{...A,property:"cursor"}],navButtonRotation:[{...B,property:"transform"},{...T,property:"transform"}],navButtonOpacity:[{...L,property:"opacity"},{...A,property:"opacity"}]}}),s.VO,s.tQ)(class extends f{static get observedAttributes(){return[].concat(f.observedAttributes||[],C,w)}preview;timestamp;constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n    <div>\n      <nav class="nav top-nav">\n        <div class="nav-prev">\n        </div>\n        <div class="selectors"></div>\n        <div class="nav-next">\n        </div>\n      </nav>\n      <div class="calendar"></div>\n      <nav class="nav bottom-nav">\n        <descope-button class="cancel-button" variant="link" mode="primary">Cancel</descope-button>\n        <descope-button class="submit-button" variant="link" mode="primary" disabled="true">Done</descope-button>\n      </nav>\n    </div>\n  ',(0,v.fz)(`\n      :host {\n        display: inline-block;\n        box-sizing: border-box;\n        max-width: 100%;\n        user-select: none;\n        -webkit-user-select: none;\n      }\n\n      :host ::slotted {\n        padding: 0;\n      }\n\n      [data-toggle-calendar] {\n        cursor: pointer;\n        display: flex;\n        align-self: center;\n        z-index: 1;\n      }\n\n      [data-disabled="true"] {\n        pointer-events: none;\n      }\n\n      .calendar .day {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n      }\n\n      .nav {\n        display: flex;\n        align-items: center;\n        box-sizing: border-box;\n      }\n\n      .selectors,\n      .selectors span {\n        display: flex;\n        justify-content: center;\n      }\n\n      descope-button {\n        padding: 0;\n        ${g.J.cssVarList.horizontalPadding}: 0;\n        ${g.J.cssVarList.verticalPadding}: 0;\n        ${g.J.cssVarList.outlineWidth}: 0;\n      }\n\n      .combo-box-item {\n        display:flex;\n        flex-direction: column;\n      }\n\n      ${(0,o.Kl)()}\n      `,this)}set value(t){if(!t)return;const e=(0,l.Nq)(t).getTime();(0,l.xP)(e)&&e!==this.timestmap&&(this.timestamp=e,this.renderCalendar())}get value(){return this.timestamp?(0,l.Ey)(this.timestamp,p.wJ):""}get isSelectedView(){return y(this.preview,this.timestamp)}get isTodayView(){return y((0,l.Ln)(),this.preview)}get monthNames(){return(t=>{const e=t?.split(",");return h(e,12)?e:p.US})(this.getAttribute("calendar-months"))}get weekdayNames(){return(t=>{const e=t?.split?.(",");return h(e,7)?e:p.mx})(this.getAttribute("calendar-weekdays"))}get hasYearValue(){return!!this.yearInput.value}get hasMonthValue(){return!!this.monthInput.value}get yearsRange(){const t=this.getAttribute("years-range")?.split("-");if(2===t?.length){const[e,n]=t.map(Number);if(e<=n)return[e,n]}const e=(0,l.Nq)().getFullYear();return[e,e+p.V$]}init(){super.init?.(),this.initCalendar(),this.renderCalendar()}initCalendar(){this.calendar=this.shadowRoot.querySelector(".calendar"),this.navPrevEle=this.shadowRoot.querySelector(".nav-prev"),this.navNextEle=this.shadowRoot.querySelector(".nav-next"),this.submitButton=this.shadowRoot.querySelector(".submit-button"),this.cancelButton=this.shadowRoot.querySelector(".cancel-button"),this.initInputs(),this.initNav(),this.addEventListener("day-changed",(()=>this.submitButton.removeAttribute("disabled"))),this.submitButton.shadowRoot.querySelector("vaadin-button").setAttribute("disabled","true")}initInputs(){const t=(()=>{const t=document.createElement("span");return t.innerHTML=`\n    <descope-combo-box\n      label-type="static"\n      bordered="true"\n      item-label-path="data-name"\n      item-value-path="data-id"\n      class="month-input"\n    >\n    ${u()}\n    </descope-combo-box>\n    <descope-combo-box\n      allow-custom-value="true"\n      label-type="static"\n      bordered="true"\n      item-label-path="data-name"\n      item-value-path="data-id"\n      class="year-input"\n      no-empty-value="true"\n    >\n    </descope-combo-box>\n  `,t})(this.monthNames,this.yearsRange);this.shadowRoot.querySelector(".selectors").appendChild(t),this.monthInput=b(this.shadowRoot.querySelector(".month-input"),this.onMonthChange.bind(this),this.onMonthInputBlur.bind(this)),this.yearInput=b(this.shadowRoot.querySelector(".year-input"),this.onYearChange.bind(this),this.onYearInputBlur.bind(this)),[this.monthInput,this.yearInput].forEach((t=>(0,i.EA)(this,t,{includeAttrs:["disabled","size","st-host-direction"]})))}initNav(){this.navPrevEle.addEventListener("click",this.navPrevMonth.bind(this)),this.navNextEle.addEventListener("click",this.navNextMonth.bind(this)),this.cancelButton.addEventListener("click",this.onCancel.bind(this)),this.submitButton.addEventListener("click",this.onSubmit.bind(this)),[this.navPrevEle,this.navNextEle].forEach((t=>(0,i.EA)(this,t,{includeAttrs:["size"]}))),this.shadowRoot.querySelector(".nav-next").innerHTML=d.ZM,this.shadowRoot.querySelector(".nav-prev").innerHTML=d.i1}onSubmit(){this.isDisabled||this.value&&this.dispatchEvent(new CustomEvent("date-submit",{detail:(0,l.Nq)(this.preview)}))}onCancel(){this.isDisabled||(this.dispatchEvent(new CustomEvent("cancel")),this.dispatchEvent(new CustomEvent("date-cancel")),this.clearSelectedDay())}clearSelectedDay(){this.getSelectedDayEle()?.removeAttribute("data-selected"),this.submitButton.setAttribute("disabled","true"),this.timestamp=""}updateInputs(){if(this.yearInput&&this.monthInput){const t=this.preview||(0,l.Ln)(),e=(0,l.Bl)(t),n=(0,l.tj)(t);this.monthInput.value=n,setTimeout((()=>{this.yearInput.baseElement.value=e}))}}renderCalendar(){const t=(0,l.Nq)(this.preview||(0,l.Ln)()).getTime(),[e,n]=(0,l.Pj)(t);this.calendar&&(this.calendar.innerHTML=((t,e,n)=>{const a=((t,e)=>new Date(t,e,0).getDate())(t,e),r=new Date(t,e-1,1).getDay();let i="<table>";i+=`<thead><tr>${n.reduce(((t,e)=>`${t}<th><span class="weekday">${e}</span></th>`),"")}</tr></thead>`,i+="<tbody>",i+="<tr>";for(let t=0;t<r;t++)i+="<td></td>";let o=r;for(let t=1;t<=a;t++)7===o&&(o=0,i+="</tr><tr>"),i+=`\n      <td\n        data-date-day="${t}"\n        class="day-entry">\n        <span class="day" data-date-day=${t}>\n          ${t}\n        </span>\n      </td>\n    `,o++;for(;o<7;)i+="<td></td>",o++;return i+="</tr></tbody></table>",i})(e,n,this.weekdayNames.map((t=>t.substring(0,3))))),Array.from(this.calendar?.querySelectorAll(".day-entry .day")||[]).forEach((t=>t.addEventListener("click",this.onDayChange.bind(this)))),this.updateInputs(),this.setSelectedDay(),this.setCurrentDay()}onDayChange(t){if(this.isDisabled)return;const e=(0,l.Nq)(this.preview);e.setDate(Number(t.target.getAttribute("data-date-day"))),this.value=(0,l.Ey)(e.getTime(),p.wJ),this.dispatchEvent(new CustomEvent("day-changed",{detail:e}))}onYearChange(t){if(!t.target.value)return;const e=(0,l.Nq)(this.preview);e.setFullYear(Number(t.target.value.trim())),this.preview=e.getTime(),this.renderCalendar(),this.dispatchEvent(new CustomEvent("year-changed",{detail:e}))}onMonthChange(t){if(!t.target.value)return;const e=(0,l.Nq)(this.preview);e.setMonth(Number(t.target.value)-1),this.preview=e.getTime(),this.renderCalendar(),this.dispatchEvent(new CustomEvent("month-changed",{detail:e}))}onYearInputBlur(t){this.yearInput.baseElement.value=t.target.value||(0,l.Bl)(this.preview)}onMonthInputBlur(t){this.monthInput.baseElement.value=t.target.value||(0,l.tj)(this.preview)}getSelectedDayEle(){const t=(0,l.Nq)(this.timestamp).getDate();return this.calendar?.querySelector(`[data-date-day="${t}"]`)}getCurrentDayEle(){return this.calendar?.querySelector(`[data-date-day="${(0,l._B)()}"]`)}clearSelectedDays(){const t=this.calendar?.querySelectorAll("[data-selected]");t&&t.forEach((t=>t.removeAttribute("data-selected")))}setSelectedDay(){this.clearSelectedDays(),this.value&&this.isSelectedView&&this.getSelectedDayEle().setAttribute("data-selected","true")}setCurrentDay(){if(this.isTodayView){const t=this.getCurrentDayEle(),e=this.getAttribute("calendar-label-today")||p.QF;t.setAttribute("data-current-day","true"),t.setAttribute("title",e)}}navPrevMonth(){if(this.isDisabled)return;const t=(t=>{const e=(0,l.Nq)(t),n=e.getMonth();if(0===n){const t=e.getFullYear();e.setFullYear(t-1),e.setMonth(11)}else e.setMonth(n-1);return e})(this.preview);this.preview=t.getTime(),this.renderCalendar()}navNextMonth(){if(this.isDisabled)return;const t=(t=>{const e=(0,l.Nq)(t),n=e.getMonth();if(11===n){const t=e.getFullYear();e.setFullYear(t+1),e.setMonth(0)}else e.setMonth(n+1);return e})(this.preview);this.preview=t.getTime(),this.renderCalendar()}clearValue(){this.timestamp="",this.value="",this.removeAttribute("preview"),this.submitButton.setAttribute("disabled","true")}onInitialValueChange(t){if(this.value)return;const e=(0,l.Nq)(t).getTime();(0,l.xP)(e)?(this.timestamp=e,this.preview=e):this.clearValue()}onYearsRangeChange(){setTimeout((()=>{this.yearInput&&(this.yearInput.innerHTML=(t=>{const[e,n]=t,a=[];for(let t=e;t<=n;t++)a.push(t);return a})(this.yearsRange).map((t=>c({label:t,dataId:t,dataName:t}))).join(""))}))}onMonthNamesChange(){setTimeout((()=>{this.monthInput&&(this.monthInput.innerHTML=u(this.monthNames))}))}onSubmitLabelChange(t){this.submitButton&&(this.submitButton.textContent=t||p.Tv)}onCancelLabelChange(t){this.cancelButton&&(this.cancelButton.textContent=t||p.lv)}onInitialMonthChange(t){const e=(0,l.Bl)(this.preview);this.preview=(0,l.Nq)(`${e}/${t}/1`).getTime()}onInitialYearChange(t){const e=(0,l.tj)(this.preview);this.preview=(0,l.Nq)(`${t}/${e}/1`).getTime()}attributeChangedCallback(t,e,n){super.attributeChangedCallback(t,e,n),e!==n&&(w.includes(t)?("calendar-label-submit"===t&&this.onSubmitLabelChange(n),"calendar-label-cancel"===t&&this.onCancelLabelChange(n)):(n&&"initial-value"===t&&this.onInitialValueChange(n),n&&"initial-month"===t&&this.onInitialMonthChange(n),n&&"initial-year"===t&&this.onInitialYearChange(n),"years-range"===t&&this.onYearsRangeChange(Number(n)),"calendar-months"===t&&this.onMonthNamesChange(),"calendar-label-today"===t&&this.setCurrentDay(n),"disabled"===t&&setTimeout((()=>{this.cancelButton?.setAttribute("disabled","true"===n)})),this.renderCalendar()))}getValidity(){return this.isRequired&&!this.value?{valueMissing:!0}:{}}});customElements.define(m,q)},98538:(t,e,n)=>{n.d(e,{S:()=>s,T:()=>o});var a=n(88961),r=n(25964),i=n(63200);const o=(0,r.xE)("icon"),s=(0,i.Zz)((0,a.RF)({mappings:{fill:{}}}),a.VO,a.tQ)((0,a.tz)({slots:[],wrappedEleName:"descope-image",style:()=>"\n      :host {\n        display: inline-flex;\n      }\n      ",excludeAttrsSync:["tabindex","class"],componentName:o}))}}]);
+"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[6028],{3393:(t,e,n)=>{n.d(e,{y:()=>o});var a=n(9696),r=n(79365),i=n(81365);const o=(...t)=>(0,a.Zz)(r.XX,r._$,r.yF,r.jd)((0,i.q)(...t))},10767:(t,e,n)=>{n.d(e,{G:()=>a});const a=t=>class extends t{get isLoading(){return"true"===this.getAttribute("loading")}click(){this.isLoading||super.click()}}},19624:(t,e,n)=>{n.d(e,{J:()=>u,T:()=>l});var a=n(63200),r=n(25964),i=n(88961),o=n(98538),s=n(10767);const l=(0,r.xE)("button"),{host:d,label:p,slottedIcon:h}={host:{selector:()=>":host"},label:{selector:"::part(label)"},slottedIcon:{selector:()=>"::slotted(descope-icon)"}};let c;const u=(0,a.Zz)((0,i.RF)({mappings:{hostWidth:{property:"width"},hostHeight:{property:"height"},hostDirection:{...d,property:"direction"},fontSize:{},fontFamily:{},cursor:{},backgroundColor:{},outlineOffset:{},outlineColor:{},outlineStyle:{},outlineWidth:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-right",fallback:"0.875em"},{property:"padding-left",fallback:"0.875em"}],labelTextColor:{property:"color"},iconColor:{selector:()=>"::slotted(*)",property:o.S.cssVarList.fill},labelTextDecoration:{...p,property:"text-decoration"},labelSpacing:{...p,property:"gap"},textAlign:{...p,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${c}\n\t\t\tvaadin-button::part(label) { pointer-events: none; }\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${u.cssVarList.outlineWidth}) + var(${u.cssVarList.outlineOffset}));\n\t\t\t}\n      :host([full-width="true"]) {\n        width: var(${u.cssVarList.hostWidth});\n      }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${u.cssVarList.hostHeight}) - var(${u.cssVarList.outlineWidth}) - var(${u.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square="true"]:not([full-width="true"]) {\n\t\t\t\twidth: calc(var(${u.cssVarList.hostWidth}) - var(${u.cssVarList.outlineWidth}) - var(${u.cssVarList.outlineOffset}));\n        padding: 0;\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:l})),{color:y,fontSize:b}=u.cssVarList;c=`\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(${y});\n\t\ttop: calc(50% - (var(${b}) / 2));\n\t\tleft: calc(50% - (var(${b}) / 2));\n\t\tborder-width: calc(var(${b}) / 10);\n\t\twidth: var(${b});\n\t\theight: var(${b});\n\t}\n\t:host([disabled="true"]),\n\t:host([loading="true"]) {\n\t\tpointer-events: none;\n\t}\n\t:host([loading="true"]) ::part(prefix),\n\t:host([loading="true"]) ::part(label) {\n\t\tvisibility: hidden;\n\t}\n`},30576:(t,e,n)=>{n.r(e),n.d(e,{ButtonClass:()=>a.J,componentName:()=>a.T});var a=n(19624);n(83799),customElements.define(a.T,a.J)},49224:(t,e,n)=>{n.d(e,{Bl:()=>c,Et:()=>i,Ey:()=>s,KQ:()=>d,Ln:()=>h,Nq:()=>l,Pj:()=>o,Xs:()=>b,_B:()=>y,tj:()=>u,xP:()=>r,y4:()=>p});var a=n(64101);const r=t=>!Number.isNaN(Number(t)),i=t=>!Number.isNaN(Number(t)),o=t=>{const e=l(t);return[e.getFullYear(),e.getMonth()+1,e.getDate()]},s=(t,e)=>{const[n,a,r]=o(t),i={DD:String(r).padStart(2,"0"),MM:String(a).padStart(2,"0"),YYYY:String(n)};return e.replace(/DD|MM|YYYY/g,(t=>i[t]))},l=t=>"number"==typeof t?new Date(t):"string"==typeof t?new Date(t.replace(/-/g,"/")):new Date,d=t=>a.xr.includes(t),p=(t,e,n)=>({refresh:n&&"r"===t.toLowerCase(),tab:"Tab"===t,shiftTab:e&&"Tab"===t,backspace:"Backspace"===t,arrowUp:!e&&"ArrowUp"===t,arrowDown:!e&&"ArrowDown"===t,arrowLeft:!e&&"ArrowLeft"===t,arrowRight:!e&&"ArrowRight"===t,pageUp:!e&&"PageUp"===t,pageDown:!e&&"PageDown"===t,shiftArrowUp:e&&"ArrowUp"===t,shiftArrowDown:e&&"ArrowDown"===t,shiftPageUp:e&&"PageUp"===t,shiftPageDown:e&&"PageDown"===t,enter:"Enter"===t}),h=()=>l().getTime(),c=t=>l(t).getFullYear().toString(),u=t=>(l(t).getMonth()+1).toString(),y=()=>l().getDate(),b=t=>{const e=new CSSStyleSheet;e.insertRule(":host{display:block!important;}"),t?.shadowRoot?.adoptedStyleSheets?.push(e)}},64101:(t,e,n)=>{n.d(e,{QF:()=>y,SP:()=>a,Tv:()=>c,US:()=>d,V$:()=>o,eT:()=>s,lv:()=>u,mx:()=>p,rR:()=>h,ui:()=>r,wJ:()=>i,xr:()=>l});const a=["MM/DD/YYYY","DD/MM/YYYY","YYYY/MM/DD"],r=a[0],i="YYYY-MM-DD",o=100,s="/",l=["Backspace","ArrowLeft","ArrowRight","ArrowDown","ArrowUp","PageUp","PageDown","Meta","Enter"],d=["January","February","March","April","May","June","July","August","September","October","November","December"],p=["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],h={MONTH:{id:"month",min:1,max:12,placeholder:"MM",count:5,shiftCount:10},DAY:{id:"day",min:1,max:31,placeholder:"DD",count:5,shiftCount:10},YEAR:{id:"year",min:1900,max:2099,placeholder:"YYYY",count:10,shiftCount:100}},c="Done",u="Cancel",y="Today"},73551:(t,e,n)=>{n.d(e,{$J:()=>c,I4:()=>o,Kl:()=>u,LJ:()=>h,Qv:()=>i,X6:()=>l,cy:()=>a,fu:()=>d,kG:()=>p,lS:()=>s,zm:()=>r});const a=t=>`\n    :host {\n        padding: calc(var(${t.inputOutlineWidth}) + var(${t.inputOutlineOffset}))\n    }\n`,r=t=>`\n    ${t} {\n        margin: 0;\n        padding: 0;\n        width: 100%;\n        height: 100%;\n        box-sizing: border-box;\n    }\n`,i=t=>`\n    ${t}::part(input-field) {\n        overflow: hidden;\n        padding: 0;\n        box-shadow: none;\n    }\n`,o=t=>`\n    ${t} > label,\n    ${t}::part(label),\n    ${t}::part(required-indicator) {\n        cursor: pointer;\n    }\n`,s=(t,e="input")=>`\n    ${t}[disabled] > ${e}:placeholder-shown,\n\t${t}[readonly] > ${e}:placeholder-shown {\n\t\topacity: 1;\n\t}\n`,l=()=>"\n    :host {\n        --vaadin-field-default-width: auto;\n        box-sizing: border-box;\n    }\n",d=t=>`\n    ${t}::part(input-field)::after {\n        opacity: 0;\n    }\n`,p=t=>`\n    ${t}::part(input-field)::after {\n        background: none;\n    }\n`,h=(t,e)=>`\n    ${r(t)}\n    ${o(t)}\n    ${s(t)}\n    ${i(t)}\n    ${((t,e)=>`\n    ${t} input:-webkit-autofill,\n    ${t} input:-webkit-autofill::first-line,\n    ${t} input:-webkit-autofill:hover,\n    ${t} input:-webkit-autofill:active,\n    ${t} input:-webkit-autofill:focus {\n        -webkit-text-fill-color: var(${e.inputValueTextColor});\n        box-shadow: 0 0 0 var(${e.inputHeight}) var(${e.inputBackgroundColor}) inset;\n    }\n`)(t,e)}\n    ${p(t)}\n    ${(t=>`\n    ${t}::before {\n\t\theight: unset;\n\t}\n`)(t)}\n    ${(t=>`\n    ${t} > input {\n        -webkit-mask-image: none;\n        min-height: 0;\n        box-sizing: border-box;\n    }\n`)(t)}\n    ${(t=>`\n    ${t}::part(input-field)::after {\n        border: none;\n    }\n`)(t)}\n`,c=t=>`\n    :host ::part(error-message) {\n      direction: ltr;\n    }\n    :host([required]) ::part(required-indicator) {\n      width: 1em;\n      display: inline-flex;\n    }\n    :host([required]) ::part(required-indicator)::after {\n      position: static;\n    }\n    :host([has-label]) ::part(label) {\n      padding-right: 0;\n      padding-bottom: 0;\n      display: flex;\n      width: 100%;\n    }\n    ${t} [slot="label"] {\n      max-width: calc(100% - 1em);\n      overflow: hidden;\n      text-overflow: ellipsis;\n      padding-bottom: 0.5em;\n    }\n`,u=()=>'\n  :host([label-type="floating"]) {\n    position: relative;\n  }\n  :host([label-type="floating"][has-label]) [slot="label"] {\n    padding: 0;\n  }\n  :host([label-type="floating"][has-label]) > ::part(label) {\n    z-index: 1;\n    padding: 0;\n    width: auto;\n  }\n  '},80071:(t,e,n)=>{n.d(e,{ZM:()=>r,i1:()=>i,ki:()=>a});const a='\n<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path fill-rule="evenodd" clip-rule="evenodd" d="M9 5H15V4.50468C15 4.21404 15.226 4 15.5047 4H16.4953C16.786 4 17 4.22595 17 4.50468V5H18.7568C19.3028 5 19.75 5.44725 19.75 5.99896V7.00104C19.75 7.55734 19.3053 8 18.7568 8H5.24317C4.69717 8 4.25 7.55275 4.25 7.00104V5.99896C4.25 5.44266 4.69466 5 5.24317 5H7V4.50468C7 4.21404 7.22596 4 7.50468 4H8.49532C8.78596 4 9 4.22595 9 4.50468V5ZM5.50468 9H6.49532C6.78596 9 7 9.22596 7 9.50468V10.4953C7 10.786 6.77404 11 6.49532 11H5.50468C5.21404 11 5 10.774 5 10.4953V9.50468C5 9.21404 5.22595 9 5.50468 9ZM8.50468 9H9.49532C9.78596 9 10 9.22596 10 9.50468V10.4953C10 10.786 9.77404 11 9.49532 11H8.50468C8.21404 11 8 10.774 8 10.4953V9.50468C8 9.21404 8.22596 9 8.50468 9ZM11.5047 9H12.4953C12.786 9 13 9.22596 13 9.50468V10.4953C13 10.786 12.774 11 12.4953 11H11.5047C11.214 11 11 10.774 11 10.4953V9.50468C11 9.21404 11.226 9 11.5047 9ZM5.50468 12H6.49532C6.78596 12 7 12.226 7 12.5047V13.4953C7 13.786 6.77404 14 6.49532 14H5.50468C5.21404 14 5 13.774 5 13.4953V12.5047C5 12.214 5.22595 12 5.50468 12ZM8.50468 12H9.49532C9.78596 12 10 12.226 10 12.5047V13.4953C10 13.786 9.77404 14 9.49532 14H8.50468C8.21404 14 8 13.774 8 13.4953V12.5047C8 12.214 8.22596 12 8.50468 12ZM11.5047 12H12.4953C12.786 12 13 12.226 13 12.5047V13.4953C13 13.786 12.774 14 12.4953 14H11.5047C11.214 14 11 13.774 11 13.4953V12.5047C11 12.214 11.226 12 11.5047 12ZM5.50468 15H6.49532C6.78596 15 7 15.226 7 15.5047V16.4953C7 16.786 6.77404 17 6.49532 17H5.50468C5.21404 17 5 16.774 5 16.4953V15.5047C5 15.214 5.22595 15 5.50468 15ZM8.50468 15H9.49532C9.78596 15 10 15.226 10 15.5047V16.4953C10 16.786 9.77404 17 9.49532 17H8.50468C8.21404 17 8 16.774 8 16.4953V15.5047C8 15.214 8.22596 15 8.50468 15ZM11.5047 15H12.4953C12.786 15 13 15.226 13 15.5047V16.4953C13 16.786 12.774 17 12.4953 17H11.5047C11.214 17 11 16.774 11 16.4953V15.5047C11 15.214 11.226 15 11.5047 15ZM14.5047 9H15.4953C15.786 9 16 9.22596 16 9.50468V10.4953C16 10.786 15.774 11 15.4953 11H14.5047C14.214 11 14 10.774 14 10.4953V9.50468C14 9.21404 14.226 9 14.5047 9ZM14.5047 12H15.4953C15.786 12 16 12.226 16 12.5047V13.4953C16 13.786 15.774 14 15.4953 14H14.5047C14.214 14 14 13.774 14 13.4953V12.5047C14 12.214 14.226 12 14.5047 12ZM14.5047 15H15.4953C15.786 15 16 15.226 16 15.5047V16.4953C16 16.786 15.774 17 15.4953 17H14.5047C14.214 17 14 16.774 14 16.4953V15.5047C14 15.214 14.226 15 14.5047 15ZM17.5047 15H18.4953C18.786 15 19 15.226 19 15.5047V16.4953C19 16.786 18.774 17 18.4953 17H17.5047C17.214 17 17 16.774 17 16.4953V15.5047C17 15.214 17.226 15 17.5047 15ZM5.50468 18H6.49532C6.78596 18 7 18.226 7 18.5047V19.4953C7 19.786 6.77404 20 6.49532 20H5.50468C5.21404 20 5 19.774 5 19.4953V18.5047C5 18.214 5.22595 18 5.50468 18ZM8.50468 18H9.49532C9.78596 18 10 18.226 10 18.5047V19.4953C10 19.786 9.77404 20 9.49532 20H8.50468C8.21404 20 8 19.774 8 19.4953V18.5047C8 18.214 8.22596 18 8.50468 18ZM11.5047 18H12.4953C12.786 18 13 18.226 13 18.5047V19.4953C13 19.786 12.774 20 12.4953 20H11.5047C11.214 20 11 19.774 11 19.4953V18.5047C11 18.214 11.226 18 11.5047 18ZM14.5047 18H15.4953C15.786 18 16 18.226 16 18.5047V19.4953C16 19.786 15.774 20 15.4953 20H14.5047C14.214 20 14 19.774 14 19.4953V18.5047C14 18.214 14.226 18 14.5047 18ZM17.5047 18H18.4953C18.786 18 19 18.226 19 18.5047V19.4953C19 19.786 18.774 20 18.4953 20H17.5047C17.214 20 17 19.774 17 19.4953V18.5047C17 18.214 17.226 18 17.5047 18ZM17.5047 12H18.4953C18.786 12 19 12.226 19 12.5047V13.4953C19 13.786 18.774 14 18.4953 14H17.5047C17.214 14 17 13.774 17 13.4953V12.5047C17 12.214 17.226 12 17.5047 12ZM17.5047 9H18.4953C18.786 9 19 9.22596 19 9.50468V10.4953C19 10.786 18.774 11 18.4953 11H17.5047C17.214 11 17 10.774 17 10.4953V9.50468C17 9.21404 17.226 9 17.5047 9Z" fill="#808080"/>\n</svg>\n',r='\n<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M9.27283 6.78069C8.87912 6.34164 8.91587 5.66655 9.35492 5.27283C9.79397 4.87912 10.4691 4.91587 10.8628 5.35492C10.8628 5.35492 16.0022 10.9543 16.366 11.36C16.7298 11.7657 16.7298 12.2392 16.366 12.6448L10.8628 18.6451C10.4691 19.0841 9.79397 19.1209 9.35492 18.7272C8.91587 18.3334 8.87912 17.6584 9.27283 17.2193L14.1368 12L9.27283 6.78069Z" fill="#808080"/>\n</svg>',i='<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M14.7272 17.2193C15.1209 17.6584 15.0841 18.3334 14.6451 18.7272C14.206 19.1209 13.5309 19.0841 13.1372 18.6451C13.1372 18.6451 7.99776 13.0457 7.63399 12.64C7.27023 12.2343 7.27023 11.7608 7.63399 11.3552L13.1372 5.35492C13.5309 4.91587 14.206 4.87912 14.6451 5.27283C15.0841 5.66655 15.1209 6.34164 14.7272 6.78069L9.86322 12L14.7272 17.2193Z" fill="#808080"/>\n</svg>'},88350:(t,e,n)=>{n.r(e),n.d(e,{CalendarClass:()=>q,componentName:()=>m}),n(27092),n(30576);var a=n(3393),r=n(9696),i=n(97810),o=n(73551),s=n(79365),l=n(49224),d=n(80071),p=n(64101);const h=(t,e)=>Array.isArray(t)&&t.length===e&&t.filter(Boolean).length===e,c=({label:t,dataId:e,dataName:n})=>`\n\t<div class="combo-box-item"\n\t\tdata-id="${e}"\n\t\tdata-name="${n}"\n\t>\n\t\t\t${t}\n\t</div>\n`,u=(t=p.US)=>t.map(((t,e)=>c({label:t,dataId:e+1,dataName:t}))).join(""),y=(t,e)=>{const[n,a]=(0,l.Pj)(e),[r,i]=(0,l.Pj)(t);return r===n&&i===a},b=(t,e,n)=>(t.addEventListener("input",e),t.addEventListener("focusout",n),t);var g=n(19624),v=n(25964);const m=(0,i.xE)("calendar"),C=["initial-value","initial-year","initial-month","years-range","calendar-months","calendar-weekdays","calendar-label-today","st-host-direction","disabled","full-width"],w=["calendar-label-submit","calendar-label-cancel"],f=(0,a.y)({componentName:m,baseSelector:"div"}),{calendar:x,day:V,dayEntry:M,currentDay:S,selectedDay:$,disabledDay:D,weekday:N,topNav:H,topNavSelectors:k,bottomNav:E,navPrev:L,navNext:A,navPrevRTL:B,navNextRTL:T,yearInput:Y,monthInput:I}={calendar:{selector:()=>".calendar"},topNav:{selector:()=>".nav.top-nav"},topNavSelectors:{selector:()=>".nav.top-nav .selectors > span"},bottomNav:{selector:()=>".nav.bottom-nav"},day:{selector:()=>".day"},dayEntry:{selector:()=>".day-entry"},currentDay:{selector:()=>".day-entry[data-current-day] .day"},selectedDay:{selector:()=>".day-entry[data-selected] .day"},disabledDay:{selector:()=>'.day-entry[data-disabled="true"] .day'},weekday:{selector:()=>".weekday"},navPrev:{selector:()=>".nav-prev"},navNext:{selector:()=>".nav-next"},navPrevRTL:{selector:()=>':host([st-host-direction="rtl"]) .nav-prev'},navNextRTL:{selector:()=>':host([st-host-direction="rtl"]) .nav-next'},yearInput:{selector:()=>".year-input"},monthInput:{selector:()=>".month-input"}},q=(0,r.Zz)((0,s.RF)({componentNameOverride:(0,i.xE)("input-wrapper")}),(0,s.RF)({mappings:{fontSize:{},fontFamily:{},hostWidth:[{selector:()=>":host",property:"width"},{selector:"table",property:"width"}],hostDirection:{property:"direction"},topNavVerticalPadding:[{...H,property:"padding-top"},{...H,property:"padding-bottom"}],topNavHorizointalPadding:[{...H,property:"padding-right"},{...H,property:"padding-left"}],topNavAlignment:{...H,property:"justify-content"},topNavGap:{...H,property:"gap"},topNavSelectorsGap:{...k,property:"gap"},bottomNavVerticalPadding:[{...E,property:"padding-top"},{...E,property:"padding-bottom"}],bottomNavHorizontalPadding:[{...E,property:"padding-right"},{...E,property:"padding-left"}],bottomNavAlignment:{...E,property:"justify-content"},bottomNavGap:{...E,property:"gap"},navMarginBottom:{...H,property:"margin-bottom"},calendarPadding:[{...x,property:"padding-bottom"},{...x,property:"padding-right"},{...x,property:"padding-left"}],navBorderBottomWidth:{...H,property:"border-bottom-width"},navBorderBottomColor:{...H,property:"border-bottom-color"},navBorderBottomStyle:{...H,property:"border-bottom-style"},weekdayFontSize:{...N,property:"font-size"},weekdayFontWeight:{...N,property:"font-weight"},currentDayBorderColor:{...S,property:"border-color"},currentDayBorderWidth:{...S,property:"border-width"},currentDayBorderStyle:{...S,property:"border-style"},dayHeight:{...M,property:"height"},daySize:[{...V,property:"height"},{...V,property:"width"}],dayPadding:{...V,property:"padding"},dayRadius:{...V,property:"border-radius"},dayTextAlign:{...V,property:"text-align"},dayBlockAlign:{...V,property:"margin"},dayTextColor:{...V,property:"color"},dayFontWeight:{...V,property:"font-weight"},dayBackgroundColor:{...V,property:"background-color"},dayCursor:{...V,property:"cursor"},dayFontSize:{...V,property:"font-size"},dayBackgroundColorHover:{selector:()=>".day:hover",property:"background-color"},daySelectedTextdColor:{...$,property:"color"},daySelectedBackgroundColor:{...$,property:"background-color"},dayDisabledTextdColor:{...D,property:"color"},yearInputWidth:{...Y,property:"width"},monthInputWidth:{...I,property:"width"},navButtonSize:[{...L,property:"width"},{...L,property:"height"},{...A,property:"width"},{...A,property:"height"}],navButtonCursor:[{...L,property:"cursor"},{...A,property:"cursor"}],navButtonRotation:[{...B,property:"transform"},{...T,property:"transform"}],navButtonOpacity:[{...L,property:"opacity"},{...A,property:"opacity"}]}}),s.VO,s.tQ)(class extends f{static get observedAttributes(){return[].concat(f.observedAttributes||[],C,w)}preview;timestamp;constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n    <div>\n      <nav class="nav top-nav">\n        <div class="nav-prev">\n        </div>\n        <div class="selectors"></div>\n        <div class="nav-next">\n        </div>\n      </nav>\n      <div class="calendar"></div>\n      <nav class="nav bottom-nav">\n        <descope-button class="cancel-button" variant="link" mode="primary">Cancel</descope-button>\n        <descope-button class="submit-button" variant="link" mode="primary" disabled="true">Done</descope-button>\n      </nav>\n    </div>\n  ',(0,v.fz)(`\n      :host {\n        display: inline-block;\n        box-sizing: border-box;\n        max-width: 100%;\n        user-select: none;\n        -webkit-user-select: none;\n      }\n\n      :host ::slotted {\n        padding: 0;\n      }\n\n      [data-toggle-calendar] {\n        cursor: pointer;\n        display: flex;\n        align-self: center;\n        z-index: 1;\n      }\n\n      [data-disabled="true"] {\n        pointer-events: none;\n      }\n\n      .calendar .day {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n      }\n\n      .nav {\n        display: flex;\n        align-items: center;\n        box-sizing: border-box;\n      }\n\n      .selectors,\n      .selectors span {\n        display: flex;\n        justify-content: center;\n      }\n\n      descope-button {\n        padding: 0;\n        ${g.J.cssVarList.horizontalPadding}: 0;\n        ${g.J.cssVarList.verticalPadding}: 0;\n        ${g.J.cssVarList.outlineWidth}: 0;\n      }\n\n      .combo-box-item {\n        display:flex;\n        flex-direction: column;\n      }\n\n      ${(0,o.Kl)()}\n      `,this)}set value(t){if(!t)return;const e=(0,l.Nq)(t).getTime();(0,l.xP)(e)&&e!==this.timestmap&&(this.timestamp=e,this.renderCalendar())}get value(){return this.timestamp?(0,l.Ey)(this.timestamp,p.wJ):""}get isSelectedView(){return y(this.preview,this.timestamp)}get isTodayView(){return y((0,l.Ln)(),this.preview)}get monthNames(){return(t=>{const e=t?.split(",");return h(e,12)?e:p.US})(this.getAttribute("calendar-months"))}get weekdayNames(){return(t=>{const e=t?.split?.(",");return h(e,7)?e:p.mx})(this.getAttribute("calendar-weekdays"))}get hasYearValue(){return!!this.yearInput.value}get hasMonthValue(){return!!this.monthInput.value}get yearsRange(){const t=this.getAttribute("years-range")?.split("-");if(2===t?.length){const[e,n]=t.map(Number);if(e<=n)return[e,n]}const e=(0,l.Nq)().getFullYear();return[e,e+p.V$]}init(){super.init?.(),this.initCalendar(),this.renderCalendar()}initCalendar(){this.calendar=this.shadowRoot.querySelector(".calendar"),this.navPrevEle=this.shadowRoot.querySelector(".nav-prev"),this.navNextEle=this.shadowRoot.querySelector(".nav-next"),this.submitButton=this.shadowRoot.querySelector(".submit-button"),this.cancelButton=this.shadowRoot.querySelector(".cancel-button"),this.initInputs(),this.initNav(),this.addEventListener("day-changed",(()=>this.submitButton.removeAttribute("disabled"))),this.submitButton.shadowRoot.querySelector("vaadin-button").setAttribute("disabled","true")}initInputs(){const t=(()=>{const t=document.createElement("span");return t.innerHTML=`\n    <descope-combo-box\n      label-type="static"\n      bordered="true"\n      item-label-path="data-name"\n      item-value-path="data-id"\n      class="month-input"\n    >\n    ${u()}\n    </descope-combo-box>\n    <descope-combo-box\n      allow-custom-value="true"\n      label-type="static"\n      bordered="true"\n      item-label-path="data-name"\n      item-value-path="data-id"\n      class="year-input"\n      no-empty-value="true"\n    >\n    </descope-combo-box>\n  `,t})(this.monthNames,this.yearsRange);this.shadowRoot.querySelector(".selectors").appendChild(t),this.monthInput=b(this.shadowRoot.querySelector(".month-input"),this.onMonthChange.bind(this),this.onMonthInputBlur.bind(this)),this.yearInput=b(this.shadowRoot.querySelector(".year-input"),this.onYearChange.bind(this),this.onYearInputBlur.bind(this)),[this.monthInput,this.yearInput].forEach((t=>(0,i.EA)(this,t,{includeAttrs:["disabled","size","st-host-direction"]})))}initNav(){this.navPrevEle.addEventListener("click",this.navPrevMonth.bind(this)),this.navNextEle.addEventListener("click",this.navNextMonth.bind(this)),this.cancelButton.addEventListener("click",this.onCancel.bind(this)),this.submitButton.addEventListener("click",this.onSubmit.bind(this)),[this.navPrevEle,this.navNextEle].forEach((t=>(0,i.EA)(this,t,{includeAttrs:["size"]}))),this.shadowRoot.querySelector(".nav-next").innerHTML=d.ZM,this.shadowRoot.querySelector(".nav-prev").innerHTML=d.i1}onSubmit(){this.isDisabled||this.value&&this.dispatchEvent(new CustomEvent("date-submit",{detail:(0,l.Nq)(this.preview)}))}onCancel(){this.isDisabled||(this.dispatchEvent(new CustomEvent("cancel")),this.dispatchEvent(new CustomEvent("date-cancel")),this.clearSelectedDay())}clearSelectedDay(){this.getSelectedDayEle()?.removeAttribute("data-selected"),this.submitButton.setAttribute("disabled","true"),this.timestamp=""}updateInputs(){if(this.yearInput&&this.monthInput){const t=this.preview||(0,l.Ln)(),e=(0,l.Bl)(t),n=(0,l.tj)(t);this.monthInput.value=n,setTimeout((()=>{this.yearInput.baseElement.value=e}))}}renderCalendar(){const t=(0,l.Nq)(this.preview||(0,l.Ln)()).getTime(),[e,n]=(0,l.Pj)(t);this.calendar&&(this.calendar.innerHTML=((t,e,n)=>{const a=((t,e)=>new Date(t,e,0).getDate())(t,e),r=new Date(t,e-1,1).getDay();let i="<table>";i+=`<thead><tr>${n.reduce(((t,e)=>`${t}<th><span class="weekday">${e}</span></th>`),"")}</tr></thead>`,i+="<tbody>",i+="<tr>";for(let t=0;t<r;t++)i+="<td></td>";let o=r;for(let t=1;t<=a;t++)7===o&&(o=0,i+="</tr><tr>"),i+=`\n      <td\n        data-date-day="${t}"\n        class="day-entry">\n        <span class="day" data-date-day=${t}>\n          ${t}\n        </span>\n      </td>\n    `,o++;for(;o<7;)i+="<td></td>",o++;return i+="</tr></tbody></table>",i})(e,n,this.weekdayNames.map((t=>t.substring(0,3))))),Array.from(this.calendar?.querySelectorAll(".day-entry .day")||[]).forEach((t=>t.addEventListener("click",this.onDayChange.bind(this)))),this.updateInputs(),this.setSelectedDay(),this.setCurrentDay()}onDayChange(t){if(this.isDisabled)return;const e=(0,l.Nq)(this.preview);e.setDate(Number(t.target.getAttribute("data-date-day"))),this.value=(0,l.Ey)(e.getTime(),p.wJ),this.dispatchEvent(new CustomEvent("day-changed",{detail:e}))}onYearChange(t){if(!t.target.value)return;const e=(0,l.Nq)(this.preview);e.setFullYear(Number(t.target.value.trim())),this.preview=e.getTime(),this.renderCalendar(),this.dispatchEvent(new CustomEvent("year-changed",{detail:e}))}onMonthChange(t){if(!t.target.value)return;const e=(0,l.Nq)(this.preview);e.setMonth(Number(t.target.value)-1),this.preview=e.getTime(),this.renderCalendar(),this.dispatchEvent(new CustomEvent("month-changed",{detail:e}))}onYearInputBlur(t){this.yearInput.baseElement.value=t.target.value||(0,l.Bl)(this.preview)}onMonthInputBlur(t){this.monthInput.baseElement.value=t.target.value||(0,l.tj)(this.preview)}getSelectedDayEle(){const t=(0,l.Nq)(this.timestamp).getDate();return this.calendar?.querySelector(`[data-date-day="${t}"]`)}getCurrentDayEle(){return this.calendar?.querySelector(`[data-date-day="${(0,l._B)()}"]`)}clearSelectedDays(){const t=this.calendar?.querySelectorAll("[data-selected]");t&&t.forEach((t=>t.removeAttribute("data-selected")))}setSelectedDay(){this.clearSelectedDays(),this.value&&this.isSelectedView&&this.getSelectedDayEle().setAttribute("data-selected","true")}setCurrentDay(){if(this.isTodayView){const t=this.getCurrentDayEle(),e=this.getAttribute("calendar-label-today")||p.QF;t.setAttribute("data-current-day","true"),t.setAttribute("title",e)}}navPrevMonth(){if(this.isDisabled)return;const t=(t=>{const e=(0,l.Nq)(t),n=e.getMonth();if(0===n){const t=e.getFullYear();e.setFullYear(t-1),e.setMonth(11)}else e.setMonth(n-1);return e})(this.preview);this.preview=t.getTime(),this.renderCalendar()}navNextMonth(){if(this.isDisabled)return;const t=(t=>{const e=(0,l.Nq)(t),n=e.getMonth();if(11===n){const t=e.getFullYear();e.setFullYear(t+1),e.setMonth(0)}else e.setMonth(n+1);return e})(this.preview);this.preview=t.getTime(),this.renderCalendar()}clearValue(){this.timestamp="",this.value="",this.removeAttribute("preview"),this.submitButton.setAttribute("disabled","true")}onInitialValueChange(t){if(this.value)return;const e=(0,l.Nq)(t).getTime();(0,l.xP)(e)?(this.timestamp=e,this.preview=e):this.clearValue()}onYearsRangeChange(){setTimeout((()=>{this.yearInput&&(this.yearInput.innerHTML=(t=>{const[e,n]=t,a=[];for(let t=e;t<=n;t++)a.push(t);return a})(this.yearsRange).map((t=>c({label:t,dataId:t,dataName:t}))).join(""))}))}onMonthNamesChange(){setTimeout((()=>{this.monthInput&&(this.monthInput.innerHTML=u(this.monthNames))}))}onSubmitLabelChange(t){this.submitButton&&(this.submitButton.textContent=t||p.Tv)}onCancelLabelChange(t){this.cancelButton&&(this.cancelButton.textContent=t||p.lv)}onInitialMonthChange(t){const e=(0,l.Bl)(this.preview);this.preview=(0,l.Nq)(`${e}/${t}/1`).getTime()}onInitialYearChange(t){const e=(0,l.tj)(this.preview);this.preview=(0,l.Nq)(`${t}/${e}/1`).getTime()}attributeChangedCallback(t,e,n){super.attributeChangedCallback(t,e,n),e!==n&&(w.includes(t)?("calendar-label-submit"===t&&this.onSubmitLabelChange(n),"calendar-label-cancel"===t&&this.onCancelLabelChange(n)):(n&&"initial-value"===t&&this.onInitialValueChange(n),n&&"initial-month"===t&&this.onInitialMonthChange(n),n&&"initial-year"===t&&this.onInitialYearChange(n),"years-range"===t&&this.onYearsRangeChange(Number(n)),"calendar-months"===t&&this.onMonthNamesChange(),"calendar-label-today"===t&&this.setCurrentDay(n),"disabled"===t&&setTimeout((()=>{this.cancelButton?.setAttribute("disabled","true"===n)})),this.renderCalendar()))}getValidity(){return this.isRequired&&!this.value?{valueMissing:!0}:{}}});customElements.define(m,q)},98538:(t,e,n)=>{n.d(e,{S:()=>s,T:()=>o});var a=n(88961),r=n(25964),i=n(63200);const o=(0,r.xE)("icon"),s=(0,i.Zz)((0,a.RF)({mappings:{fill:{}}}),a.VO,a.tQ)((0,a.tz)({slots:[],wrappedEleName:"descope-image",style:()=>"\n      :host {\n        display: inline-flex;\n      }\n      ",excludeAttrsSync:["tabindex","class"],componentName:o}))}}]);
 //# sourceMappingURL=descope-date-field-descope-calendar-index-js.js.map