@descope/web-components-ui 1.113.0 → 1.115.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,2 +1,2 @@
1
- "use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[1331],{12848:(t,e,o)=>{o.r(e),o.d(e,{MultiSelectComboBoxClass:()=>I,componentName:()=>l}),o(51408);var r=o(9696),n=o(97810),i=o(73551),a=o(79365);const l=(0,n.xE)("multi-select-combo-box"),{host:s,inputField:d,inputElement:p,placeholder:c,toggle:u,clearButton:m,label:b,requiredIndicator:h,helperText:g,errorMessage:y,chip:v,chipLabel:f,overflowChipFirstBorder:x,overflowChipSecondBorder:w}={host:{selector:()=>":host"},inputField:{selector:"::part(input-field)"},inputElement:{selector:"input"},placeholder:{selector:"> input:placeholder-shown"},toggle:{selector:"::part(toggle-button)"},clearButton:{selector:"::part(clear-button)"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"},chip:{selector:"vaadin-multi-select-combo-box-chip"},chipLabel:{selector:"vaadin-multi-select-combo-box-chip::part(label)"},overflowChipFirstBorder:{selector:"vaadin-multi-select-combo-box-chip[slot='overflow']::before"},overflowChipSecondBorder:{selector:"vaadin-multi-select-combo-box-chip[slot='overflow']::after"}},I=(0,r.Zz)((0,a.RF)({mappings:{hostWidth:{...s,property:"width"},hostDirection:{...s,property:"direction"},fontSize:[{},s],chipFontSize:{...f,property:"font-size"},fontFamily:[b,c,d,g,y,f],labelFontSize:{...b,property:"font-size"},labelFontWeight:{...b,property:"font-weight"},labelTextColor:[{...b,property:"color"},{...h,property:"color"}],errorMessageTextColor:{...y,property:"color"},errorMessageIcon:{...y,property:"background-image"},errorMessageIconSize:{...y,property:"background-size"},errorMessageIconPadding:{...y,property:"padding-inline-start"},errorMessageIconRepeat:{...y,property:"background-repeat"},errorMessageIconPosition:{...y,property:"background-position"},errorMessageFontSize:{...y,property:"font-size"},inputHeight:{...d,property:"min-height"},inputBackgroundColor:{...d,property:"background-color"},inputBorderColor:{...d,property:"border-color"},inputBorderWidth:{...d,property:"border-width"},inputBorderStyle:{...d,property:"border-style"},inputBorderRadius:{...d,property:"border-radius"},labelRequiredIndicator:{...h,property:"content"},inputValueTextColor:{...d,property:"color"},inputPlaceholderTextColor:{...c,property:"color"},inputDropdownButtonCursor:[{...u,property:"cursor"},{...m,property:"cursor"}],inputDropdownButtonColor:[{...u,property:"color"},{...m,property:"color"}],inputDropdownButtonSize:[{...u,property:"font-size"},{...m,property:"font-size"}],inputDropdownButtonOffset:[{...u,property:"margin-right"},{...u,property:"margin-left"}],inputOutlineColor:{...d,property:"outline-color"},inputOutlineWidth:{...d,property:"outline-width"},inputOutlineStyle:{...d,property:"outline-style"},inputOutlineOffset:{...d,property:"outline-offset"},inputHorizontalPadding:[{...p,property:"padding-left"},{...p,property:"padding-right"},{...d,property:"padding-inline-start"}],inputVerticalPadding:[{...d,property:"padding-top"},{...d,property:"padding-bottom"}],chipTextColor:{...f,property:"color"},chipBackgroundColor:[{...v,property:"background-color"},{...x,property:"border-color"},{...w,property:"border-color"}],labelPosition:{...b,property:"position"},labelTopPosition:{...b,property:"top"},labelLeftPosition:{...b,property:"left"},labelHorizontalPosition:[{...b,property:"left"},{...b,property:"right"}],inputTransformY:{...b,property:"transform"},inputTransition:{...b,property:"transition"},marginInlineStart:{...b,property:"margin-inline-start"},placeholderOpacity:{...c,property:"opacity"},inputVerticalAlignment:{...d,property:"align-items"},overlayBackground:{property:()=>I.cssVarList.overlay.backgroundColor},overlayTextColor:{property:()=>I.cssVarList.overlay.textColor},overlayBorder:{property:()=>I.cssVarList.overlay.border},overlayFontSize:{property:()=>I.cssVarList.overlay.fontSize},overlayFontFamily:{property:()=>I.cssVarList.overlay.fontFamily},overlayCursor:{property:()=>I.cssVarList.overlay.cursor},overlayItemBoxShadow:{property:()=>I.cssVarList.overlay.itemBoxShadow},overlayItemPaddingInlineStart:{property:()=>I.cssVarList.overlay.itemPaddingInlineStart},overlayItemPaddingInlineEnd:{property:()=>I.cssVarList.overlay.itemPaddingInlineEnd}}}),a.VO,(0,a.mA)({name:"overlay",selector:"vaadin-multi-select-combo-box-internal",mappings:{backgroundColor:{selector:"vaadin-multi-select-combo-box-scroller"},minHeight:{selector:"vaadin-multi-select-combo-box-overlay"},margin:{selector:"vaadin-multi-select-combo-box-overlay"},cursor:{selector:"vaadin-multi-select-combo-box-item"},fontFamily:{selector:"vaadin-multi-select-combo-box-item"},textColor:{selector:"vaadin-multi-select-combo-box-item",property:"color"},fontSize:{selector:"vaadin-multi-select-combo-box-item"},itemBoxShadow:{selector:"vaadin-multi-select-combo-box-item",property:"box-shadow"},itemPaddingInlineStart:{selector:"vaadin-multi-select-combo-box-item",property:"padding-inline-start"},itemPaddingInlineEnd:{selector:"vaadin-multi-select-combo-box-item",property:"padding-inline-end"}},forward:{include:!1,attributes:["size"]}}),(0,a.OZ)({proxyProps:["selectionStart"],inputEvent:"selected-items-changed"}),a._$,a.tQ,(t=>class extends t{static get observedAttributes(){return["readonly"]}#t=({displayName:t,value:e,label:o})=>{const r=document.createElement("span");return r.setAttribute("data-name",o),r.setAttribute("data-id",e),r.textContent=t||o,r.outerHTML};#e;#o=[];get defaultValues(){const t=this.getAttribute("default-values");if(t)try{const e=JSON.parse(t);if(this.isValidDataType(e))return e}catch(t){console.error('could not parse data string from attribute "default-values" -',t.message)}return[]}get renderItem(){return this.#t}set renderItem(t){this.#t=t,this.renderItems()}get data(){if(this.#e)return this.#e;const t=this.getAttribute("data");if(t)try{const e=JSON.parse(t);if(this.isValidDataType(e))return e}catch(t){console.error('could not parse data string from attribute "data" -',t.message)}return[]}set data(t){this.isValidDataType(t)&&(this.#e=t,this.renderItems())}get allowCustomValues(){return"true"===this.getAttribute("allow-custom-value")}get minItemsSelection(){return parseInt(this.getAttribute("min-items-selection"),10)||0}get maxItemsSelection(){return parseInt(this.getAttribute("max-items-selection"),10)||0}isValidDataType(t){const e=Array.isArray(t);return e||console.error("data and default-values must be an array, received:",t),e}getItemsTemplate(){return this.data?.reduce?.(((t,e)=>t+(this.renderItem?.(e||{})||"")),"")}renderItems(){const t=this.getItemsTemplate();t&&(this.innerHTML=t)}updateSelectedItems(){const t=this.baseElement.selectedItems?.map((t=>t.getAttribute("data-id")))||[];t.length>0&&(this.value=t),0===this.value.length&&this.setDefaultValues()}customValueTransformFn(t){return t}setComboBoxDescriptor(){const t=Object.getOwnPropertyDescriptor(this.inputElement.constructor.prototype,"value"),e=this;Object.defineProperties(this.inputElement,{value:{...t,set(o){const r=e.customValueTransformFn(o)||"";r!==this.value&&t.set.call(this,r)}}})}#r(t){return Array.from(new Map(t.map((t=>[t.getAttribute("data-id"),t]))).values())}#n(){const t=Array.from(this.children),e=this.#r(t);t.length?(this.removeAttribute("has-no-options"),e.forEach((t=>{Object.defineProperty(t,"data-name",{value:t.getAttribute("data-name"),configurable:!0,writable:!0}),Object.defineProperty(t,"data-id",{value:t.getAttribute("data-id"),configurable:!0,writable:!0})})),this.baseElement.items=e,setTimeout((()=>{this.updateSelectedItems()}),0)):(this.baseElement.items=[],this.setAttribute("has-no-options","")),this.baseElement.renderer=(t,e,o)=>{t.innerHTML=o.item.outerHTML}}#i(){const t=this.baseElement.shadowRoot.querySelector("vaadin-multi-select-combo-box-internal").shadowRoot.querySelector("vaadin-multi-select-combo-box-overlay");t._attachOverlay=()=>{t.bringToFront()},t._detachOverlay=()=>{},t._enterModalState=()=>{}}#a(){this.allowCustomValues&&this.baseElement.addEventListener("custom-value-set",(t=>{const e=this.#t({label:t.detail,displayName:t.detail,value:t.detail});this.innerHTML+=e,this.baseElement._lastFilter="",setTimeout((()=>{this.value=[...this.value,t.detail]}),0)}))}setGetValidity(){this.getValidity=function(){if(this.pattern){const t=new RegExp(this.pattern);if(this.value.some((e=>!t.test(e))))return{patternMismatch:!0}}return this.isRequired&&!this.value.length?{valueMissing:!0}:this.isRequired&&this.minItemsSelection&&this.value.length<this.minItemsSelection?{rangeUnderflow:!0}:this.maxItemsSelection&&this.value.length>this.maxItemsSelection?{rangeOverflow:!0}:{}};const t=this;this.baseElement.checkValidity=()=>t.validity.valid}init(){super.init?.(),this.setGetValidity(),this.setComboBoxDescriptor(),this.#i(),this.#a(),this.renderItems(),(0,n.mx)(this,this.renderItems.bind(this),{includeAttrs:["data"]}),(0,n.Ge)(this,this.#n.bind(this)),(0,n.EA)(this,this.baseElement,{includeAttrs:["placeholder"]}),this.setDefaultValues(),this.baseElement.addEventListener("selected-items-changed",(()=>{this.#l(),this.dispatchEvent(new CustomEvent("input",{bubbles:!0}))}))}setDefaultValues(){this.defaultValues.length>0&&(this.value=this.defaultValues)}#l(){this.#o=this.baseElement.selectedItems?.map((t=>t.getAttribute("data-id")))||[]}set value(t){if(t&&t.length>0){const e=this.baseElement.items?.filter((e=>t.includes(e["data-id"])));if(this.allowCustomValues){const o=e?.map((t=>t.getAttribute("data-id")))||[],r=t.filter((t=>!o.includes(t)));if(r.length){const e=r.reduce(((t,e)=>t+this.#t({label:e,displayName:e,value:e})),"");return this.innerHTML+=e,void setTimeout((()=>{this.value=t}),0)}}const o=e?.map((t=>t.getAttribute("data-id")))||[];(0,r.AG)(this.#o,o)||(this.baseElement.selectedItems=e)}else this.baseElement.selectedItems=[]}get value(){return this.#o}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),"readonly"===t&&this.onReadOnlyChange(null!==o&&"true"===o)}onReadOnlyChange(t){t?this.baseElement?.shadowRoot?.querySelector("vaadin-multi-select-combo-box-internal")?.setAttribute("inert",t):this.baseElement?.shadowRoot?.querySelector("vaadin-multi-select-combo-box-internal")?.removeAttribute("inert")}}))((0,a.tz)({slots:["","prefix"],wrappedEleName:"vaadin-multi-select-combo-box",style:()=>`\n\t\t:host {\n\t\t\tdisplay: inline-flex;\n\t\t\tbox-sizing: border-box;\n\t\t\t-webkit-mask-image: none;\n\t\t}\n\t\t${(0,i.cy)(I.cssVarList)}\n\t\t${(0,i.fu)("vaadin-multi-select-combo-box")}\n\t\t${(0,i.lS)("vaadin-multi-select-combo-box")}\n\t\t${(0,i.I4)("vaadin-multi-select-combo-box")}\n\n\t\tvaadin-multi-select-combo-box {\n\t\t\tpadding: 0;\n\t\t\twidth: 100%;\n\t\t}\n\t\tvaadin-multi-select-combo-box::before {\n\t\t\theight: initial;\n\t\t}\n\t\tvaadin-multi-select-combo-box [slot="input"] {\n\t\t\t-webkit-mask-image: none;\n\t\t\tmin-height: 0;\n align-self: center;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\t\tvaadin-multi-select-combo-box[readonly] [slot="input"] {\n flex-grow: 1;\n flex-basis: 4em;\n\t\t}\n\n\t\t::part(input-field) {\n padding: 0;\n\t\t\tbox-shadow: none;\n\t\t}\n ${(0,i.$J)("vaadin-multi-select-combo-box")}\n :host([has-label]) vaadin-multi-select-combo-box-chip::part(label) {\n display: block;\n }\n\n vaadin-multi-select-combo-box vaadin-multi-select-combo-box-chip[slot='overflow']::before,\n vaadin-multi-select-combo-box vaadin-multi-select-combo-box-chip[slot='overflow']::after {\n left: -4px;\n right: -4px;\n border-left-width: 0;\n border-inline-start-style: solid;\n border-inline-start-width: 2px;\n }\n vaadin-multi-select-combo-box vaadin-multi-select-combo-box-chip[slot='overflow']::after {\n left: -8px;\n right: -8px;\n }\n\n :host([has-no-options][allow-custom-value='true']) ::part(toggle-button) {\n display: none;\n }\n\n ${(0,i.Kl)()}\n\n vaadin-multi-select-combo-box::part(toggle-button),\n vaadin-multi-select-combo-box::part(clear-button) {\n align-self: center;\n }\n\n vaadin-multi-select-combo-box[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n opacity: 0;\n }\n vaadin-multi-select-combo-box[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n opacity: 0;\n }\n\n\t\t`,excludeAttrsSync:["tabindex","size","data","placeholder"],componentName:l,includeForwardProps:["items","renderer","selectedItems"]}));customElements.define(l,I)},73551:(t,e,o)=>{o.d(e,{$J:()=>u,I4:()=>a,Kl:()=>m,LJ:()=>c,Qv:()=>i,X6:()=>s,cy:()=>r,fu:()=>d,kG:()=>p,lS:()=>l,zm:()=>n});const r=t=>`\n :host {\n padding: calc(var(${t.inputOutlineWidth}) + var(${t.inputOutlineOffset}))\n }\n`,n=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`,a=t=>`\n ${t} > label,\n ${t}::part(label),\n ${t}::part(required-indicator) {\n cursor: pointer;\n }\n`,l=(t,e="input")=>`\n ${t}[disabled] > ${e}:placeholder-shown,\n\t${t}[readonly] > ${e}:placeholder-shown {\n\t\topacity: 1;\n\t}\n`,s=()=>"\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`,c=(t,e)=>`\n ${n(t)}\n ${a(t)}\n ${l(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`,u=t=>`\n :host ::part(error-message) {\n direction: ltr;\n }\n :host([required]) ::part(required-indicator) {\n width: 1em;\n display: inline-flex;\n }\n :host([required]) ::part(required-indicator)::after {\n position: static;\n }\n :host([has-label]) ::part(label) {\n padding-right: 0;\n padding-bottom: 0;\n display: flex;\n width: 100%;\n }\n ${t} [slot="label"] {\n max-width: calc(100% - 1em);\n overflow: hidden;\n text-overflow: ellipsis;\n padding-bottom: 0.5em;\n }\n`,m=()=>'\n :host([label-type="floating"]) {\n position: relative;\n }\n :host([label-type="floating"][has-label]) > ::part(label) {\n z-index: 1;\n padding: 0;\n width: auto;\n }\n '}}]);
1
+ "use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[1331],{12848:(t,e,o)=>{o.r(e),o.d(e,{MultiSelectComboBoxClass:()=>I,componentName:()=>l}),o(51408);var r=o(9696),n=o(97810),i=o(73551),a=o(79365);const l=(0,n.xE)("multi-select-combo-box"),{host:s,inputField:d,inputElement:p,placeholder:c,toggle:u,clearButton:m,label:b,requiredIndicator:h,helperText:g,errorMessage:y,chip:v,chipLabel:f,overflowChipFirstBorder:x,overflowChipSecondBorder:w}={host:{selector:()=>":host"},inputField:{selector:"::part(input-field)"},inputElement:{selector:"input"},placeholder:{selector:"> input:placeholder-shown"},toggle:{selector:"::part(toggle-button)"},clearButton:{selector:"::part(clear-button)"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"},chip:{selector:"vaadin-multi-select-combo-box-chip"},chipLabel:{selector:"vaadin-multi-select-combo-box-chip::part(label)"},overflowChipFirstBorder:{selector:"vaadin-multi-select-combo-box-chip[slot='overflow']::before"},overflowChipSecondBorder:{selector:"vaadin-multi-select-combo-box-chip[slot='overflow']::after"}},I=(0,r.Zz)((0,a.RF)({mappings:{hostWidth:{...s,property:"width"},hostDirection:{...s,property:"direction"},fontSize:[{},s],chipFontSize:{...f,property:"font-size"},fontFamily:[b,c,d,g,y,f],labelFontSize:{...b,property:"font-size"},labelFontWeight:{...b,property:"font-weight"},labelTextColor:[{...b,property:"color"},{...h,property:"color"}],errorMessageTextColor:{...y,property:"color"},errorMessageIcon:{...y,property:"background-image"},errorMessageIconSize:{...y,property:"background-size"},errorMessageIconPadding:{...y,property:"padding-inline-start"},errorMessageIconRepeat:{...y,property:"background-repeat"},errorMessageIconPosition:{...y,property:"background-position"},errorMessageFontSize:{...y,property:"font-size"},inputHeight:{...d,property:"min-height"},inputBackgroundColor:{...d,property:"background-color"},inputBorderColor:{...d,property:"border-color"},inputBorderWidth:{...d,property:"border-width"},inputBorderStyle:{...d,property:"border-style"},inputBorderRadius:{...d,property:"border-radius"},labelRequiredIndicator:{...h,property:"content"},inputValueTextColor:{...d,property:"color"},inputPlaceholderTextColor:{...c,property:"color"},inputDropdownButtonCursor:[{...u,property:"cursor"},{...m,property:"cursor"}],inputDropdownButtonColor:[{...u,property:"color"},{...m,property:"color"}],inputDropdownButtonSize:[{...u,property:"font-size"},{...m,property:"font-size"}],inputDropdownButtonOffset:[{...u,property:"margin-right"},{...u,property:"margin-left"}],inputOutlineColor:{...d,property:"outline-color"},inputOutlineWidth:{...d,property:"outline-width"},inputOutlineStyle:{...d,property:"outline-style"},inputOutlineOffset:{...d,property:"outline-offset"},inputHorizontalPadding:[{...p,property:"padding-left"},{...p,property:"padding-right"},{...d,property:"padding-inline-start"}],inputVerticalPadding:[{...d,property:"padding-top"},{...d,property:"padding-bottom"}],chipTextColor:{...f,property:"color"},chipBackgroundColor:[{...v,property:"background-color"},{...x,property:"border-color"},{...w,property:"border-color"}],labelPosition:{...b,property:"position"},labelTopPosition:{...b,property:"top"},labelLeftPosition:{...b,property:"left"},labelHorizontalPosition:[{...b,property:"left"},{...b,property:"right"}],inputTransformY:{...b,property:"transform"},inputTransition:{...b,property:"transition"},marginInlineStart:{...b,property:"margin-inline-start"},placeholderOpacity:{...c,property:"opacity"},inputVerticalAlignment:{...d,property:"align-items"},overlayBackground:{property:()=>I.cssVarList.overlay.backgroundColor},overlayTextColor:{property:()=>I.cssVarList.overlay.textColor},overlayBorder:{property:()=>I.cssVarList.overlay.border},overlayFontSize:{property:()=>I.cssVarList.overlay.fontSize},overlayFontFamily:{property:()=>I.cssVarList.overlay.fontFamily},overlayCursor:{property:()=>I.cssVarList.overlay.cursor},overlayItemBoxShadow:{property:()=>I.cssVarList.overlay.itemBoxShadow},overlayItemPaddingInlineStart:{property:()=>I.cssVarList.overlay.itemPaddingInlineStart},overlayItemPaddingInlineEnd:{property:()=>I.cssVarList.overlay.itemPaddingInlineEnd}}}),a.VO,(0,a.mA)({name:"overlay",selector:"vaadin-multi-select-combo-box-internal",mappings:{backgroundColor:{selector:"vaadin-multi-select-combo-box-scroller"},minHeight:{selector:"vaadin-multi-select-combo-box-overlay"},margin:{selector:"vaadin-multi-select-combo-box-overlay"},cursor:{selector:"vaadin-multi-select-combo-box-item"},fontFamily:{selector:"vaadin-multi-select-combo-box-item"},textColor:{selector:"vaadin-multi-select-combo-box-item",property:"color"},fontSize:{selector:"vaadin-multi-select-combo-box-item"},itemBoxShadow:{selector:"vaadin-multi-select-combo-box-item",property:"box-shadow"},itemPaddingInlineStart:{selector:"vaadin-multi-select-combo-box-item",property:"padding-inline-start"},itemPaddingInlineEnd:{selector:"vaadin-multi-select-combo-box-item",property:"padding-inline-end"}},forward:{include:!1,attributes:["size"]}}),(0,a.OZ)({proxyProps:["selectionStart"],inputEvent:"selected-items-changed"}),a._$,a.tQ,(t=>class extends t{static get observedAttributes(){return["readonly"]}#t=({displayName:t,value:e,label:o})=>{const r=document.createElement("span");return r.setAttribute("data-name",o),r.setAttribute("data-id",e),r.textContent=t||o,r.outerHTML};#e;#o=[];get defaultValues(){const t=this.getAttribute("default-values");if(t)try{const e=JSON.parse(t);if(this.isValidDataType(e))return e}catch(t){console.error('could not parse data string from attribute "default-values" -',t.message)}return[]}get renderItem(){return this.#t}set renderItem(t){this.#t=t,this.renderItems()}get data(){if(this.#e)return this.#e;const t=this.getAttribute("data");if(t)try{const e=JSON.parse(t);if(this.isValidDataType(e))return e}catch(t){console.error('could not parse data string from attribute "data" -',t.message)}return[]}set data(t){this.isValidDataType(t)&&(this.#e=t,this.renderItems())}get allowCustomValues(){return"true"===this.getAttribute("allow-custom-value")}get minItemsSelection(){return parseInt(this.getAttribute("min-items-selection"),10)||0}get maxItemsSelection(){return parseInt(this.getAttribute("max-items-selection"),10)||0}isValidDataType(t){const e=Array.isArray(t);return e||console.error("data and default-values must be an array, received:",t),e}getItemsTemplate(){return this.data?.reduce?.(((t,e)=>t+(this.renderItem?.(e||{})||"")),"")}renderItems(){const t=this.getItemsTemplate();t&&(this.innerHTML=t)}updateSelectedItems(){const t=this.baseElement.selectedItems?.map((t=>t.getAttribute("data-id")))||[];t.length>0&&(this.value=t),0===this.value.length&&this.setDefaultValues()}customValueTransformFn(t){return t}setComboBoxDescriptor(){const t=Object.getOwnPropertyDescriptor(this.inputElement.constructor.prototype,"value"),e=this;Object.defineProperties(this.inputElement,{value:{...t,set(o){const r=e.customValueTransformFn(o)||"";r!==this.value&&t.set.call(this,r)}}})}#r(t){return Array.from(new Map(t.map((t=>[t.getAttribute("data-id"),t]))).values())}#n(){const t=Array.from(this.children),e=this.#r(t);t.length?(this.removeAttribute("has-no-options"),e.forEach((t=>{Object.defineProperty(t,"data-name",{value:t.getAttribute("data-name"),configurable:!0,writable:!0}),Object.defineProperty(t,"data-id",{value:t.getAttribute("data-id"),configurable:!0,writable:!0})})),this.baseElement.items=e,setTimeout((()=>{this.updateSelectedItems()}),0)):(this.baseElement.items=[],this.setAttribute("has-no-options","")),this.baseElement.renderer=(t,e,o)=>{t.innerHTML=o.item.outerHTML}}#i(){const t=this.baseElement.shadowRoot.querySelector("vaadin-multi-select-combo-box-internal").shadowRoot.querySelector("vaadin-multi-select-combo-box-overlay");t._attachOverlay=()=>{t.bringToFront()},t._detachOverlay=()=>{},t._enterModalState=()=>{}}#a(){this.allowCustomValues&&this.baseElement.addEventListener("custom-value-set",(t=>{const e=this.#t({label:t.detail,displayName:t.detail,value:t.detail});this.innerHTML+=e,this.baseElement._lastFilter="",setTimeout((()=>{this.value=[...this.value,t.detail]}),0)}))}setGetValidity(){this.getValidity=function(){if(this.pattern){const t=new RegExp(this.pattern);if(this.value.some((e=>!t.test(e))))return{patternMismatch:!0}}return this.isRequired&&!this.value.length?{valueMissing:!0}:this.isRequired&&this.minItemsSelection&&this.value.length<this.minItemsSelection?{rangeUnderflow:!0}:this.maxItemsSelection&&this.value.length>this.maxItemsSelection?{rangeOverflow:!0}:{}};const t=this;this.baseElement.checkValidity=()=>t.validity.valid}init(){super.init?.(),this.setGetValidity(),this.#a(),this.renderItems(),(0,n.mx)(this,this.renderItems.bind(this),{includeAttrs:["data"]}),(0,n.Ge)(this,this.#n.bind(this)),(0,n.EA)(this,this.baseElement,{includeAttrs:["placeholder"]}),setTimeout((()=>{this.setComboBoxDescriptor(),this.#i()})),this.setDefaultValues(),this.baseElement.addEventListener("selected-items-changed",(()=>{this.#l(),this.dispatchEvent(new CustomEvent("input",{bubbles:!0}))}))}setDefaultValues(){this.defaultValues.length>0&&(this.value=this.defaultValues)}#l(){this.#o=this.baseElement.selectedItems?.map((t=>t.getAttribute("data-id")))||[]}set value(t){if(t&&t.length>0){const e=this.baseElement.items?.filter((e=>t.includes(e["data-id"])));if(this.allowCustomValues){const o=e?.map((t=>t.getAttribute("data-id")))||[],r=t.filter((t=>!o.includes(t)));if(r.length){const e=r.reduce(((t,e)=>t+this.#t({label:e,displayName:e,value:e})),"");return this.innerHTML+=e,void setTimeout((()=>{this.value=t}),0)}}const o=e?.map((t=>t.getAttribute("data-id")))||[];(0,r.AG)(this.#o,o)||(this.baseElement.selectedItems=e)}else this.baseElement.selectedItems=[]}get value(){return this.#o}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),"readonly"===t&&this.onReadOnlyChange(null!==o&&"true"===o)}onReadOnlyChange(t){t?this.baseElement?.shadowRoot?.querySelector("vaadin-multi-select-combo-box-internal")?.setAttribute("inert",t):this.baseElement?.shadowRoot?.querySelector("vaadin-multi-select-combo-box-internal")?.removeAttribute("inert")}}))((0,a.tz)({slots:["","prefix"],wrappedEleName:"vaadin-multi-select-combo-box",style:()=>`\n\t\t:host {\n\t\t\tdisplay: inline-flex;\n\t\t\tbox-sizing: border-box;\n\t\t\t-webkit-mask-image: none;\n\t\t}\n\t\t${(0,i.cy)(I.cssVarList)}\n\t\t${(0,i.fu)("vaadin-multi-select-combo-box")}\n\t\t${(0,i.lS)("vaadin-multi-select-combo-box")}\n\t\t${(0,i.I4)("vaadin-multi-select-combo-box")}\n\n\t\tvaadin-multi-select-combo-box {\n\t\t\tpadding: 0;\n\t\t\twidth: 100%;\n\t\t}\n\t\tvaadin-multi-select-combo-box::before {\n\t\t\theight: initial;\n\t\t}\n\t\tvaadin-multi-select-combo-box [slot="input"] {\n\t\t\t-webkit-mask-image: none;\n\t\t\tmin-height: 0;\n align-self: center;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\t\tvaadin-multi-select-combo-box[readonly] [slot="input"] {\n flex-grow: 1;\n flex-basis: 4em;\n\t\t}\n\n\t\t::part(input-field) {\n padding: 0;\n\t\t\tbox-shadow: none;\n\t\t}\n ${(0,i.$J)("vaadin-multi-select-combo-box")}\n :host([has-label]) vaadin-multi-select-combo-box-chip::part(label) {\n display: block;\n }\n\n vaadin-multi-select-combo-box vaadin-multi-select-combo-box-chip[slot='overflow']::before,\n vaadin-multi-select-combo-box vaadin-multi-select-combo-box-chip[slot='overflow']::after {\n left: -4px;\n right: -4px;\n border-left-width: 0;\n border-inline-start-style: solid;\n border-inline-start-width: 2px;\n }\n vaadin-multi-select-combo-box vaadin-multi-select-combo-box-chip[slot='overflow']::after {\n left: -8px;\n right: -8px;\n }\n\n :host([has-no-options][allow-custom-value='true']) ::part(toggle-button) {\n display: none;\n }\n\n ${(0,i.Kl)()}\n\n vaadin-multi-select-combo-box::part(toggle-button),\n vaadin-multi-select-combo-box::part(clear-button) {\n align-self: center;\n }\n\n vaadin-multi-select-combo-box[label-type="floating"]:not([focused])[readonly] > input:placeholder-shown {\n opacity: 0;\n }\n vaadin-multi-select-combo-box[label-type="floating"]:not([focused])[disabled] > input:placeholder-shown {\n opacity: 0;\n }\n\n\t\t`,excludeAttrsSync:["tabindex","size","data","placeholder"],componentName:l,includeForwardProps:["items","renderer","selectedItems"]}));customElements.define(l,I)},73551:(t,e,o)=>{o.d(e,{$J:()=>u,I4:()=>a,Kl:()=>m,LJ:()=>c,Qv:()=>i,X6:()=>s,cy:()=>r,fu:()=>d,kG:()=>p,lS:()=>l,zm:()=>n});const r=t=>`\n :host {\n padding: calc(var(${t.inputOutlineWidth}) + var(${t.inputOutlineOffset}))\n }\n`,n=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`,a=t=>`\n ${t} > label,\n ${t}::part(label),\n ${t}::part(required-indicator) {\n cursor: pointer;\n }\n`,l=(t,e="input")=>`\n ${t}[disabled] > ${e}:placeholder-shown,\n\t${t}[readonly] > ${e}:placeholder-shown {\n\t\topacity: 1;\n\t}\n`,s=()=>"\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`,c=(t,e)=>`\n ${n(t)}\n ${a(t)}\n ${l(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`,u=t=>`\n :host ::part(error-message) {\n direction: ltr;\n }\n :host([required]) ::part(required-indicator) {\n width: 1em;\n display: inline-flex;\n }\n :host([required]) ::part(required-indicator)::after {\n position: static;\n }\n :host([has-label]) ::part(label) {\n padding-right: 0;\n padding-bottom: 0;\n display: flex;\n width: 100%;\n }\n ${t} [slot="label"] {\n max-width: calc(100% - 1em);\n overflow: hidden;\n text-overflow: ellipsis;\n padding-bottom: 0.5em;\n }\n`,m=()=>'\n :host([label-type="floating"]) {\n position: relative;\n }\n :host([label-type="floating"][has-label]) > ::part(label) {\n z-index: 1;\n padding: 0;\n width: auto;\n }\n '}}]);
2
2
  //# sourceMappingURL=descope-multi-select-combo-box-index-js.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"descope-multi-select-combo-box-index-js.js","mappings":"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","sources":["webpack://@descope/web-components-ui/./src/components/descope-multi-select-combo-box/MultiSelectComboBoxClass.js","webpack://@descope/web-components-ui/./src/components/descope-multi-select-combo-box/index.js","webpack://@descope/web-components-ui/./src/helpers/themeHelpers/resetHelpers.js"],"sourcesContent":["import { compose, compareArraysUnordered } from '../../helpers';\nimport {\n forwardAttrs,\n getComponentName,\n observeAttributes,\n observeChildren,\n} from '../../helpers/componentHelpers';\nimport {\n resetInputLabelPosition,\n resetInputCursor,\n resetInputPlaceholder,\n resetInputReadonlyStyle,\n useHostExternalPadding,\n inputFloatingLabelStyle,\n} from '../../helpers/themeHelpers/resetHelpers';\nimport {\n createStyleMixin,\n draggableMixin,\n createProxy,\n componentNameValidationMixin,\n portalMixin,\n proxyInputMixin,\n changeMixin,\n} from '../../mixins';\n\nexport const componentName = getComponentName('multi-select-combo-box');\n\nconst multiSelectComboBoxMixin = (superclass) =>\n class MultiSelectComboBoxMixinClass extends superclass {\n static get observedAttributes() {\n return ['readonly'];\n }\n\n // eslint-disable-next-line class-methods-use-this\n #renderItem = ({ displayName, value, label }) => {\n const ele = document.createElement('span');\n ele.setAttribute('data-name', label);\n ele.setAttribute('data-id', value);\n ele.textContent = displayName || label;\n\n return ele.outerHTML;\n };\n\n #data;\n\n #value = [];\n\n get defaultValues() {\n const defaultValuesAttr = this.getAttribute('default-values');\n if (defaultValuesAttr) {\n try {\n const defaultValues = JSON.parse(defaultValuesAttr);\n if (this.isValidDataType(defaultValues)) {\n return defaultValues;\n }\n } catch (e) {\n // eslint-disable-next-line no-console\n console.error('could not parse data string from attribute \"default-values\" -', e.message);\n }\n }\n return [];\n }\n\n get renderItem() {\n return this.#renderItem;\n }\n\n set renderItem(renderFn) {\n this.#renderItem = renderFn;\n this.renderItems();\n }\n\n get data() {\n if (this.#data) return this.#data;\n\n const dataAttr = this.getAttribute('data');\n\n if (dataAttr) {\n try {\n const data = JSON.parse(dataAttr);\n if (this.isValidDataType(data)) {\n return data;\n }\n } catch (e) {\n // eslint-disable-next-line no-console\n console.error('could not parse data string from attribute \"data\" -', e.message);\n }\n }\n\n return [];\n }\n\n set data(data) {\n if (this.isValidDataType(data)) {\n this.#data = data;\n this.renderItems();\n }\n }\n\n get allowCustomValues() {\n return this.getAttribute('allow-custom-value') === 'true';\n }\n\n get minItemsSelection() {\n return parseInt(this.getAttribute('min-items-selection'), 10) || 0;\n }\n\n get maxItemsSelection() {\n return parseInt(this.getAttribute('max-items-selection'), 10) || 0;\n }\n\n // eslint-disable-next-line class-methods-use-this\n isValidDataType(data) {\n const isValid = Array.isArray(data);\n if (!isValid) {\n // eslint-disable-next-line no-console\n console.error('data and default-values must be an array, received:', data);\n }\n\n return isValid;\n }\n\n getItemsTemplate() {\n return this.data?.reduce?.((acc, item) => acc + (this.renderItem?.(item || {}) || ''), '');\n }\n\n renderItems() {\n const template = this.getItemsTemplate();\n if (template) this.innerHTML = template;\n }\n\n updateSelectedItems() {\n // This is a list of all the selected items, including ones that may have been removed from the DOM\n const currentSelected =\n this.baseElement.selectedItems?.map((item) => item.getAttribute('data-id')) || [];\n\n // if there are selected items, we want to trigger a potential update to the value if some child elements were removed\n if (currentSelected.length > 0) {\n // setting the value checks that the selected items are still in the DOM and will not set the value if they are not\n this.value = currentSelected;\n }\n\n // otherwise, if default value is specified, set default value as selected item\n if (this.value.length === 0) {\n this.setDefaultValues();\n }\n }\n\n // eslint-disable-next-line class-methods-use-this\n customValueTransformFn(val) {\n return val;\n }\n\n // We want to override Vaadin's Combo Box value setter. This is needed since Vaadin couples between the\n // field that it searches the value, and the finaly display value of the input.\n // We provide a custom transform function to override that behavior.\n setComboBoxDescriptor() {\n const valueDescriptor = Object.getOwnPropertyDescriptor(\n this.inputElement.constructor.prototype,\n 'value'\n );\n\n const comboBox = this;\n\n Object.defineProperties(this.inputElement, {\n value: {\n ...valueDescriptor,\n set(val) {\n const transformedValue = comboBox.customValueTransformFn(val) || '';\n\n if (transformedValue === this.value) {\n return;\n }\n\n valueDescriptor.set.call(this, transformedValue);\n },\n },\n });\n }\n\n // To prevent duplicate items for the multi select options, we dedup them based on the \"data-id\" attribute\n // eslint-disable-next-line class-methods-use-this\n #dedupItems(items) {\n return Array.from(\n new Map(items.map((item) => [item.getAttribute('data-id'), item])).values()\n );\n }\n\n // vaadin api is to set props on their combo box node,\n // in order to avoid it, we are passing the children of this component\n // to the items & renderer props, so it will be used as the combo box items\n #onChildrenChange() {\n const items = Array.from(this.children);\n const dedupItems = this.#dedupItems(items);\n\n // we want the data-name attribute to be accessible as an object attribute\n if (items.length) {\n this.removeAttribute('has-no-options');\n\n dedupItems.forEach((node) => {\n Object.defineProperty(node, 'data-name', {\n value: node.getAttribute('data-name'),\n configurable: true,\n writable: true,\n });\n Object.defineProperty(node, 'data-id', {\n value: node.getAttribute('data-id'),\n configurable: true,\n writable: true,\n });\n });\n\n this.baseElement.items = dedupItems;\n\n setTimeout(() => {\n // set timeout to ensure this runs after customValueTransformFn had the chance to be overriden\n this.updateSelectedItems();\n }, 0);\n } else {\n this.baseElement.items = [];\n this.setAttribute('has-no-options', '');\n }\n\n // use vaadin combobox custom renderer to render options as HTML\n // and not via default renderer, which renders only the data-name's value\n // in its own HTML template\n this.baseElement.renderer = (root, combo, model) => {\n // eslint-disable-next-line no-param-reassign\n root.innerHTML = model.item.outerHTML;\n };\n }\n\n // the default vaadin behavior is to attach the overlay to the body when opened\n // we do not want that because it's difficult to style the overlay in this way\n // so we override it to open inside the shadow DOM\n #overrideOverlaySettings() {\n const overlay = this.baseElement.shadowRoot\n .querySelector('vaadin-multi-select-combo-box-internal')\n .shadowRoot.querySelector('vaadin-multi-select-combo-box-overlay');\n overlay._attachOverlay = () => {\n overlay.bringToFront();\n };\n overlay._detachOverlay = () => {};\n overlay._enterModalState = () => {};\n }\n\n #handleCustomValues() {\n if (this.allowCustomValues) {\n this.baseElement.addEventListener('custom-value-set', (e) => {\n const newItemHtml = this.#renderItem({\n label: e.detail,\n displayName: e.detail,\n value: e.detail,\n });\n this.innerHTML += newItemHtml;\n // The internal filter needs to be removed, otherwise there's a bug where a new custom item\n // added can't be removed from the dropdown because of how the vaadin component is implemented\n this.baseElement._lastFilter = '';\n // The value needs to be set with a timeout because it needs to execute after\n // the custom value is added to items by the children change observer\n setTimeout(() => {\n this.value = [...this.value, e.detail];\n }, 0);\n });\n }\n }\n\n setGetValidity() {\n // eslint-disable-next-line func-names\n this.getValidity = function () {\n if (this.pattern) {\n const patternRegex = new RegExp(this.pattern);\n if (this.value.some((val) => !patternRegex.test(val)))\n return {\n patternMismatch: true,\n };\n }\n\n if (this.isRequired && !this.value.length) {\n return {\n valueMissing: true,\n };\n }\n // If the field is not required, no minimum selection can be set\n if (\n this.isRequired &&\n this.minItemsSelection &&\n this.value.length < this.minItemsSelection\n ) {\n return {\n rangeUnderflow: true,\n };\n }\n if (this.maxItemsSelection && this.value.length > this.maxItemsSelection) {\n return {\n rangeOverflow: true,\n };\n }\n return {};\n };\n\n // This is required to override the default validity check of the vaadin component\n // which is triggered when the component is checked for validity after blur\n // Without this, our minItemsSelection and maxItemsSelection constraints will not be checked\n const that = this;\n // eslint-disable-next-line func-names\n this.baseElement.checkValidity = () => {\n return that.validity.valid;\n };\n }\n\n init() {\n super.init?.();\n\n this.setGetValidity();\n\n this.setComboBoxDescriptor();\n\n this.#overrideOverlaySettings();\n\n this.#handleCustomValues();\n\n this.renderItems();\n\n observeAttributes(this, this.renderItems.bind(this), { includeAttrs: ['data'] });\n\n observeChildren(this, this.#onChildrenChange.bind(this));\n\n // Note: we need to forward the `placeholder` because the vaadin component observes it and\n // tries to override it, causing us to lose the user set placeholder.\n forwardAttrs(this, this.baseElement, { includeAttrs: ['placeholder'] });\n\n this.setDefaultValues();\n\n this.baseElement.addEventListener('selected-items-changed', () => {\n this.#updateInternalValue();\n this.dispatchEvent(new CustomEvent('input', { bubbles: true }));\n });\n }\n\n setDefaultValues() {\n const initialDefaultValues = this.defaultValues;\n if (initialDefaultValues.length > 0) {\n this.value = this.defaultValues;\n }\n }\n\n #updateInternalValue() {\n // This is done here because we don't want to return a different copy of the same array\n // every time get value is called if a new value wasn't set\n this.#value =\n this.baseElement.selectedItems?.map((elem) => elem.getAttribute('data-id')) || [];\n }\n\n // Updating the value will update the selectedItems, which will trigger an event 'selected-items-changed'\n // which we listen to in the init function to update the internal value\n set value(vals) {\n if (vals && vals.length > 0) {\n // Filters the children of the component to find the ones that match the values,\n // since it's possible that some values that are trying to set are not in the children\n const selectedChildren = this.baseElement.items?.filter((item) =>\n vals.includes(item['data-id'])\n );\n\n // If the component allows custom values, we need to add the values that are not present in the children\n if (this.allowCustomValues) {\n const existingValues =\n selectedChildren?.map((child) => child.getAttribute('data-id')) || [];\n const missingValues = vals.filter((val) => !existingValues.includes(val));\n\n if (missingValues.length) {\n const newItemsHtml = missingValues.reduce((acc, val) => {\n const newItemHtml = this.#renderItem({\n label: val,\n displayName: val,\n value: val,\n });\n return acc + newItemHtml;\n }, '');\n this.innerHTML += newItemsHtml;\n\n // The value needs to be set with a timeout because it needs to execute after\n // the custom values are added to the items by the children change observer\n setTimeout(() => {\n this.value = vals;\n }, 0);\n return;\n }\n }\n\n const newSelectedValues =\n selectedChildren?.map((child) => child.getAttribute('data-id')) || [];\n if (!compareArraysUnordered(this.#value, newSelectedValues)) {\n this.baseElement.selectedItems = selectedChildren;\n }\n } else {\n this.baseElement.selectedItems = [];\n }\n }\n\n get value() {\n return this.#value;\n }\n\n attributeChangedCallback(attrName, oldValue, newValue) {\n super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n if (attrName === 'readonly') {\n this.onReadOnlyChange(newValue !== null && newValue === 'true');\n }\n }\n\n onReadOnlyChange(val) {\n if (val) {\n this.baseElement?.shadowRoot\n ?.querySelector('vaadin-multi-select-combo-box-internal')\n ?.setAttribute('inert', val);\n } else {\n this.baseElement?.shadowRoot\n ?.querySelector('vaadin-multi-select-combo-box-internal')\n ?.removeAttribute('inert');\n }\n }\n };\n\nconst {\n host,\n inputField,\n inputElement,\n placeholder,\n toggle,\n clearButton,\n label,\n requiredIndicator,\n helperText,\n errorMessage,\n chip,\n chipLabel,\n overflowChipFirstBorder,\n overflowChipSecondBorder,\n} = {\n host: { selector: () => ':host' },\n inputField: { selector: '::part(input-field)' },\n inputElement: { selector: 'input' },\n placeholder: { selector: '> input:placeholder-shown' },\n toggle: { selector: '::part(toggle-button)' },\n clearButton: { selector: '::part(clear-button)' },\n label: { selector: '::part(label)' },\n requiredIndicator: { selector: '[required]::part(required-indicator)::after' },\n helperText: { selector: '::part(helper-text)' },\n errorMessage: { selector: '::part(error-message)' },\n chip: { selector: 'vaadin-multi-select-combo-box-chip' },\n chipLabel: { selector: 'vaadin-multi-select-combo-box-chip::part(label)' },\n overflowChipFirstBorder: {\n selector: \"vaadin-multi-select-combo-box-chip[slot='overflow']::before\",\n },\n overflowChipSecondBorder: {\n selector: \"vaadin-multi-select-combo-box-chip[slot='overflow']::after\",\n },\n};\n\nexport const MultiSelectComboBoxClass = compose(\n createStyleMixin({\n mappings: {\n hostWidth: { ...host, property: 'width' },\n hostDirection: { ...host, property: 'direction' },\n // we apply font-size also on the host so we can set its width with em\n fontSize: [{}, host],\n chipFontSize: { ...chipLabel, property: 'font-size' },\n fontFamily: [label, placeholder, inputField, helperText, errorMessage, chipLabel],\n labelFontSize: { ...label, property: 'font-size' },\n labelFontWeight: { ...label, property: 'font-weight' },\n labelTextColor: [\n { ...label, property: 'color' },\n { ...requiredIndicator, property: 'color' },\n ],\n errorMessageTextColor: { ...errorMessage, property: 'color' },\n errorMessageIcon: { ...errorMessage, property: 'background-image' },\n errorMessageIconSize: { ...errorMessage, property: 'background-size' },\n errorMessageIconPadding: { ...errorMessage, property: 'padding-inline-start' },\n errorMessageIconRepeat: { ...errorMessage, property: 'background-repeat' },\n errorMessageIconPosition: { ...errorMessage, property: 'background-position' },\n errorMessageFontSize: { ...errorMessage, property: 'font-size' },\n inputHeight: { ...inputField, property: 'min-height' },\n inputBackgroundColor: { ...inputField, property: 'background-color' },\n inputBorderColor: { ...inputField, property: 'border-color' },\n inputBorderWidth: { ...inputField, property: 'border-width' },\n inputBorderStyle: { ...inputField, property: 'border-style' },\n inputBorderRadius: { ...inputField, property: 'border-radius' },\n labelRequiredIndicator: { ...requiredIndicator, property: 'content' },\n inputValueTextColor: { ...inputField, property: 'color' },\n inputPlaceholderTextColor: { ...placeholder, property: 'color' },\n inputDropdownButtonCursor: [\n { ...toggle, property: 'cursor' },\n { ...clearButton, property: 'cursor' },\n ],\n inputDropdownButtonColor: [\n { ...toggle, property: 'color' },\n { ...clearButton, property: 'color' },\n ],\n inputDropdownButtonSize: [\n { ...toggle, property: 'font-size' },\n { ...clearButton, property: 'font-size' },\n ],\n inputDropdownButtonOffset: [\n { ...toggle, property: 'margin-right' },\n { ...toggle, property: 'margin-left' },\n ],\n inputOutlineColor: { ...inputField, property: 'outline-color' },\n inputOutlineWidth: { ...inputField, property: 'outline-width' },\n inputOutlineStyle: { ...inputField, property: 'outline-style' },\n inputOutlineOffset: { ...inputField, property: 'outline-offset' },\n inputHorizontalPadding: [\n { ...inputElement, property: 'padding-left' },\n { ...inputElement, property: 'padding-right' },\n { ...inputField, property: 'padding-inline-start' },\n ],\n inputVerticalPadding: [\n { ...inputField, property: 'padding-top' },\n { ...inputField, property: 'padding-bottom' },\n ],\n chipTextColor: { ...chipLabel, property: 'color' },\n chipBackgroundColor: [\n { ...chip, property: 'background-color' },\n { ...overflowChipFirstBorder, property: 'border-color' },\n { ...overflowChipSecondBorder, property: 'border-color' },\n ],\n\n labelPosition: { ...label, property: 'position' },\n labelTopPosition: { ...label, property: 'top' },\n labelLeftPosition: { ...label, property: 'left' },\n labelHorizontalPosition: [\n { ...label, property: 'left' },\n { ...label, property: 'right' },\n ],\n inputTransformY: { ...label, property: 'transform' },\n inputTransition: { ...label, property: 'transition' },\n marginInlineStart: { ...label, property: 'margin-inline-start' },\n placeholderOpacity: { ...placeholder, property: 'opacity' },\n inputVerticalAlignment: { ...inputField, property: 'align-items' },\n\n // we need to use the variables from the portal mixin\n // so we need to use an arrow function on the selector\n // for that to work, because ComboBox is not available\n // at this time.\n overlayBackground: {\n property: () => MultiSelectComboBoxClass.cssVarList.overlay.backgroundColor,\n },\n overlayTextColor: {\n property: () => MultiSelectComboBoxClass.cssVarList.overlay.textColor,\n },\n overlayBorder: { property: () => MultiSelectComboBoxClass.cssVarList.overlay.border },\n overlayFontSize: { property: () => MultiSelectComboBoxClass.cssVarList.overlay.fontSize },\n overlayFontFamily: { property: () => MultiSelectComboBoxClass.cssVarList.overlay.fontFamily },\n overlayCursor: { property: () => MultiSelectComboBoxClass.cssVarList.overlay.cursor },\n overlayItemBoxShadow: {\n property: () => MultiSelectComboBoxClass.cssVarList.overlay.itemBoxShadow,\n },\n overlayItemPaddingInlineStart: {\n property: () => MultiSelectComboBoxClass.cssVarList.overlay.itemPaddingInlineStart,\n },\n overlayItemPaddingInlineEnd: {\n property: () => MultiSelectComboBoxClass.cssVarList.overlay.itemPaddingInlineEnd,\n },\n },\n }),\n draggableMixin,\n portalMixin({\n name: 'overlay',\n selector: 'vaadin-multi-select-combo-box-internal',\n mappings: {\n backgroundColor: { selector: 'vaadin-multi-select-combo-box-scroller' },\n minHeight: { selector: 'vaadin-multi-select-combo-box-overlay' },\n margin: { selector: 'vaadin-multi-select-combo-box-overlay' },\n cursor: { selector: 'vaadin-multi-select-combo-box-item' },\n fontFamily: { selector: 'vaadin-multi-select-combo-box-item' },\n textColor: { selector: 'vaadin-multi-select-combo-box-item', property: 'color' },\n fontSize: { selector: 'vaadin-multi-select-combo-box-item' },\n itemBoxShadow: { selector: 'vaadin-multi-select-combo-box-item', property: 'box-shadow' },\n itemPaddingInlineStart: {\n selector: 'vaadin-multi-select-combo-box-item',\n property: 'padding-inline-start',\n },\n itemPaddingInlineEnd: {\n selector: 'vaadin-multi-select-combo-box-item',\n property: 'padding-inline-end',\n },\n },\n forward: {\n include: false,\n attributes: ['size'],\n },\n }),\n proxyInputMixin({ proxyProps: ['selectionStart'], inputEvent: 'selected-items-changed' }),\n changeMixin,\n componentNameValidationMixin,\n multiSelectComboBoxMixin\n)(\n createProxy({\n slots: ['', 'prefix'],\n wrappedEleName: 'vaadin-multi-select-combo-box',\n style: () => `\n\t\t:host {\n\t\t\tdisplay: inline-flex;\n\t\t\tbox-sizing: border-box;\n\t\t\t-webkit-mask-image: none;\n\t\t}\n\t\t${useHostExternalPadding(MultiSelectComboBoxClass.cssVarList)}\n\t\t${resetInputReadonlyStyle('vaadin-multi-select-combo-box')}\n\t\t${resetInputPlaceholder('vaadin-multi-select-combo-box')}\n\t\t${resetInputCursor('vaadin-multi-select-combo-box')}\n\n\t\tvaadin-multi-select-combo-box {\n\t\t\tpadding: 0;\n\t\t\twidth: 100%;\n\t\t}\n\t\tvaadin-multi-select-combo-box::before {\n\t\t\theight: initial;\n\t\t}\n\t\tvaadin-multi-select-combo-box [slot=\"input\"] {\n\t\t\t-webkit-mask-image: none;\n\t\t\tmin-height: 0;\n align-self: center;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\t\tvaadin-multi-select-combo-box[readonly] [slot=\"input\"] {\n flex-grow: 1;\n flex-basis: 4em;\n\t\t}\n\n\t\t::part(input-field) {\n padding: 0;\n\t\t\tbox-shadow: none;\n\t\t}\n ${resetInputLabelPosition('vaadin-multi-select-combo-box')}\n :host([has-label]) vaadin-multi-select-combo-box-chip::part(label) {\n display: block;\n }\n\n vaadin-multi-select-combo-box vaadin-multi-select-combo-box-chip[slot='overflow']::before,\n vaadin-multi-select-combo-box vaadin-multi-select-combo-box-chip[slot='overflow']::after {\n left: -4px;\n right: -4px;\n border-left-width: 0;\n border-inline-start-style: solid;\n border-inline-start-width: 2px;\n }\n vaadin-multi-select-combo-box vaadin-multi-select-combo-box-chip[slot='overflow']::after {\n left: -8px;\n right: -8px;\n }\n\n :host([has-no-options][allow-custom-value='true']) ::part(toggle-button) {\n display: none;\n }\n\n ${inputFloatingLabelStyle()}\n\n vaadin-multi-select-combo-box::part(toggle-button),\n vaadin-multi-select-combo-box::part(clear-button) {\n align-self: center;\n }\n\n vaadin-multi-select-combo-box[label-type=\"floating\"]:not([focused])[readonly] > input:placeholder-shown {\n opacity: 0;\n }\n vaadin-multi-select-combo-box[label-type=\"floating\"]:not([focused])[disabled] > input:placeholder-shown {\n opacity: 0;\n }\n\n\t\t`,\n // Note: we exclude `size` to avoid overriding Vaadin's ComboBox property\n // with the same name. Including it will cause Vaadin to calculate NaN size,\n // and reset items to an empty array, and opening the list box with no items\n // to display.\n // Note: we exclude `placeholder` because the vaadin component observes it and\n // tries to override it, causing us to lose the user set placeholder.\n excludeAttrsSync: ['tabindex', 'size', 'data', 'placeholder'],\n componentName,\n includeForwardProps: ['items', 'renderer', 'selectedItems'],\n })\n);\n","import '@vaadin/multi-select-combo-box';\nimport { componentName, MultiSelectComboBoxClass } from './MultiSelectComboBoxClass';\n\ncustomElements.define(componentName, MultiSelectComboBoxClass);\n\nexport { MultiSelectComboBoxClass, componentName };\n","export const useHostExternalPadding = (cssVarList) => `\n :host {\n padding: calc(var(${cssVarList.inputOutlineWidth}) + var(${cssVarList.inputOutlineOffset}))\n }\n`;\n\nexport const resetInputFieldUnderlayingBorder = (name) => `\n ${name}::part(input-field)::after {\n border: none;\n }\n`;\n\nexport const resetInitialHeight = (name) => `\n ${name}::before {\n\t\theight: unset;\n\t}\n`;\n\nexport const resetInputElement = (name) => `\n ${name} > input {\n -webkit-mask-image: none;\n min-height: 0;\n box-sizing: border-box;\n }\n`;\n\nexport const resetInputContainer = (name) => `\n ${name} {\n margin: 0;\n padding: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n }\n`;\n\nexport const resetInputField = (name) => `\n ${name}::part(input-field) {\n overflow: hidden;\n padding: 0;\n box-shadow: none;\n }\n`;\n\nexport const resetInputCursor = (name) => `\n ${name} > label,\n ${name}::part(label),\n ${name}::part(required-indicator) {\n cursor: pointer;\n }\n`;\n\nexport const resetInputPlaceholder = (name, ele = 'input') => `\n ${name}[disabled] > ${ele}:placeholder-shown,\n\t${name}[readonly] > ${ele}:placeholder-shown {\n\t\topacity: 1;\n\t}\n`;\n\nexport const resetInputAutoFill = (name, cssVarList) => `\n ${name} input:-webkit-autofill,\n ${name} input:-webkit-autofill::first-line,\n ${name} input:-webkit-autofill:hover,\n ${name} input:-webkit-autofill:active,\n ${name} input:-webkit-autofill:focus {\n -webkit-text-fill-color: var(${cssVarList.inputValueTextColor});\n box-shadow: 0 0 0 var(${cssVarList.inputHeight}) var(${cssVarList.inputBackgroundColor}) inset;\n }\n`;\n\nexport const resetInputFieldDefaultWidth = () => `\n :host {\n --vaadin-field-default-width: auto;\n box-sizing: border-box;\n }\n`;\n\nexport const resetInputReadonlyStyle = (name) => `\n ${name}::part(input-field)::after {\n opacity: 0;\n }\n`;\n\nexport const resetInputFieldInvalidBackgroundColor = (name) => `\n ${name}::part(input-field)::after {\n background: none;\n }\n`;\n\nexport const resetInputOverrides = (name, cssVarList) => `\n ${resetInputContainer(name)}\n ${resetInputCursor(name)}\n ${resetInputPlaceholder(name)}\n ${resetInputField(name)}\n ${resetInputAutoFill(name, cssVarList)}\n ${resetInputFieldInvalidBackgroundColor(name)}\n ${resetInitialHeight(name)}\n ${resetInputElement(name)}\n ${resetInputFieldUnderlayingBorder(name)}\n`;\n\n// This function is used to support RTL correctly for input components.\n// It also fixes the error message to be displayed LTR since we currently\n// don't support RTL for error messages.\nexport const resetInputLabelPosition = (name) => `\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 ${name} [slot=\"label\"] {\n max-width: calc(100% - 1em);\n overflow: hidden;\n text-overflow: ellipsis;\n padding-bottom: 0.5em;\n }\n`;\n\nexport const inputFloatingLabelStyle = () => {\n return `\n :host([label-type=\"floating\"]) {\n position: relative;\n }\n :host([label-type=\"floating\"][has-label]) > ::part(label) {\n z-index: 1;\n padding: 0;\n width: auto;\n }\n `;\n};\n"],"names":["componentName","host","inputField","inputElement","placeholder","toggle","clearButton","label","requiredIndicator","helperText","errorMessage","chip","chipLabel","overflowChipFirstBorder","overflowChipSecondBorder","selector","MultiSelectComboBoxClass","mappings","hostWidth","property","hostDirection","fontSize","chipFontSize","fontFamily","labelFontSize","labelFontWeight","labelTextColor","errorMessageTextColor","errorMessageIcon","errorMessageIconSize","errorMessageIconPadding","errorMessageIconRepeat","errorMessageIconPosition","errorMessageFontSize","inputHeight","inputBackgroundColor","inputBorderColor","inputBorderWidth","inputBorderStyle","inputBorderRadius","labelRequiredIndicator","inputValueTextColor","inputPlaceholderTextColor","inputDropdownButtonCursor","inputDropdownButtonColor","inputDropdownButtonSize","inputDropdownButtonOffset","inputOutlineColor","inputOutlineWidth","inputOutlineStyle","inputOutlineOffset","inputHorizontalPadding","inputVerticalPadding","chipTextColor","chipBackgroundColor","labelPosition","labelTopPosition","labelLeftPosition","labelHorizontalPosition","inputTransformY","inputTransition","marginInlineStart","placeholderOpacity","inputVerticalAlignment","overlayBackground","cssVarList","overlay","backgroundColor","overlayTextColor","textColor","overlayBorder","border","overlayFontSize","overlayFontFamily","overlayCursor","cursor","overlayItemBoxShadow","itemBoxShadow","overlayItemPaddingInlineStart","itemPaddingInlineStart","overlayItemPaddingInlineEnd","itemPaddingInlineEnd","name","minHeight","margin","forward","include","attributes","proxyProps","inputEvent","superclass","observedAttributes","displayName","value","ele","document","createElement","setAttribute","textContent","outerHTML","defaultValues","defaultValuesAttr","this","getAttribute","JSON","parse","isValidDataType","e","console","error","message","renderItem","renderFn","renderItems","data","dataAttr","allowCustomValues","minItemsSelection","parseInt","maxItemsSelection","isValid","Array","isArray","getItemsTemplate","reduce","acc","item","template","innerHTML","updateSelectedItems","currentSelected","baseElement","selectedItems","map","length","setDefaultValues","customValueTransformFn","val","setComboBoxDescriptor","valueDescriptor","Object","getOwnPropertyDescriptor","constructor","prototype","comboBox","defineProperties","set","transformedValue","call","items","from","Map","values","children","dedupItems","removeAttribute","forEach","node","defineProperty","configurable","writable","setTimeout","renderer","root","combo","model","shadowRoot","querySelector","_attachOverlay","bringToFront","_detachOverlay","_enterModalState","addEventListener","newItemHtml","detail","_lastFilter","setGetValidity","getValidity","pattern","patternRegex","RegExp","some","test","patternMismatch","isRequired","valueMissing","rangeUnderflow","rangeOverflow","that","checkValidity","validity","valid","init","super","bind","includeAttrs","dispatchEvent","CustomEvent","bubbles","elem","vals","selectedChildren","filter","includes","existingValues","child","missingValues","newItemsHtml","newSelectedValues","attributeChangedCallback","attrName","oldValue","newValue","onReadOnlyChange","slots","wrappedEleName","style","excludeAttrsSync","includeForwardProps","customElements","define","useHostExternalPadding","resetInputContainer","resetInputField","resetInputCursor","resetInputPlaceholder","resetInputFieldDefaultWidth","resetInputReadonlyStyle","resetInputFieldInvalidBackgroundColor","resetInputOverrides","resetInputAutoFill","resetInitialHeight","resetInputElement","resetInputFieldUnderlayingBorder","resetInputLabelPosition","inputFloatingLabelStyle"],"sourceRoot":""}
1
+ {"version":3,"file":"descope-multi-select-combo-box-index-js.js","mappings":"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","sources":["webpack://@descope/web-components-ui/./src/components/descope-multi-select-combo-box/MultiSelectComboBoxClass.js","webpack://@descope/web-components-ui/./src/components/descope-multi-select-combo-box/index.js","webpack://@descope/web-components-ui/./src/helpers/themeHelpers/resetHelpers.js"],"sourcesContent":["import { compose, compareArraysUnordered } from '../../helpers';\nimport {\n forwardAttrs,\n getComponentName,\n observeAttributes,\n observeChildren,\n} from '../../helpers/componentHelpers';\nimport {\n resetInputLabelPosition,\n resetInputCursor,\n resetInputPlaceholder,\n resetInputReadonlyStyle,\n useHostExternalPadding,\n inputFloatingLabelStyle,\n} from '../../helpers/themeHelpers/resetHelpers';\nimport {\n createStyleMixin,\n draggableMixin,\n createProxy,\n componentNameValidationMixin,\n portalMixin,\n proxyInputMixin,\n changeMixin,\n} from '../../mixins';\n\nexport const componentName = getComponentName('multi-select-combo-box');\n\nconst multiSelectComboBoxMixin = (superclass) =>\n class MultiSelectComboBoxMixinClass extends superclass {\n static get observedAttributes() {\n return ['readonly'];\n }\n\n // eslint-disable-next-line class-methods-use-this\n #renderItem = ({ displayName, value, label }) => {\n const ele = document.createElement('span');\n ele.setAttribute('data-name', label);\n ele.setAttribute('data-id', value);\n ele.textContent = displayName || label;\n\n return ele.outerHTML;\n };\n\n #data;\n\n #value = [];\n\n get defaultValues() {\n const defaultValuesAttr = this.getAttribute('default-values');\n if (defaultValuesAttr) {\n try {\n const defaultValues = JSON.parse(defaultValuesAttr);\n if (this.isValidDataType(defaultValues)) {\n return defaultValues;\n }\n } catch (e) {\n // eslint-disable-next-line no-console\n console.error('could not parse data string from attribute \"default-values\" -', e.message);\n }\n }\n return [];\n }\n\n get renderItem() {\n return this.#renderItem;\n }\n\n set renderItem(renderFn) {\n this.#renderItem = renderFn;\n this.renderItems();\n }\n\n get data() {\n if (this.#data) return this.#data;\n\n const dataAttr = this.getAttribute('data');\n\n if (dataAttr) {\n try {\n const data = JSON.parse(dataAttr);\n if (this.isValidDataType(data)) {\n return data;\n }\n } catch (e) {\n // eslint-disable-next-line no-console\n console.error('could not parse data string from attribute \"data\" -', e.message);\n }\n }\n\n return [];\n }\n\n set data(data) {\n if (this.isValidDataType(data)) {\n this.#data = data;\n this.renderItems();\n }\n }\n\n get allowCustomValues() {\n return this.getAttribute('allow-custom-value') === 'true';\n }\n\n get minItemsSelection() {\n return parseInt(this.getAttribute('min-items-selection'), 10) || 0;\n }\n\n get maxItemsSelection() {\n return parseInt(this.getAttribute('max-items-selection'), 10) || 0;\n }\n\n // eslint-disable-next-line class-methods-use-this\n isValidDataType(data) {\n const isValid = Array.isArray(data);\n if (!isValid) {\n // eslint-disable-next-line no-console\n console.error('data and default-values must be an array, received:', data);\n }\n\n return isValid;\n }\n\n getItemsTemplate() {\n return this.data?.reduce?.((acc, item) => acc + (this.renderItem?.(item || {}) || ''), '');\n }\n\n renderItems() {\n const template = this.getItemsTemplate();\n if (template) this.innerHTML = template;\n }\n\n updateSelectedItems() {\n // This is a list of all the selected items, including ones that may have been removed from the DOM\n const currentSelected =\n this.baseElement.selectedItems?.map((item) => item.getAttribute('data-id')) || [];\n\n // if there are selected items, we want to trigger a potential update to the value if some child elements were removed\n if (currentSelected.length > 0) {\n // setting the value checks that the selected items are still in the DOM and will not set the value if they are not\n this.value = currentSelected;\n }\n\n // otherwise, if default value is specified, set default value as selected item\n if (this.value.length === 0) {\n this.setDefaultValues();\n }\n }\n\n // eslint-disable-next-line class-methods-use-this\n customValueTransformFn(val) {\n return val;\n }\n\n // We want to override Vaadin's Combo Box value setter. This is needed since Vaadin couples between the\n // field that it searches the value, and the finaly display value of the input.\n // We provide a custom transform function to override that behavior.\n setComboBoxDescriptor() {\n const valueDescriptor = Object.getOwnPropertyDescriptor(\n this.inputElement.constructor.prototype,\n 'value'\n );\n\n const comboBox = this;\n\n Object.defineProperties(this.inputElement, {\n value: {\n ...valueDescriptor,\n set(val) {\n const transformedValue = comboBox.customValueTransformFn(val) || '';\n\n if (transformedValue === this.value) {\n return;\n }\n\n valueDescriptor.set.call(this, transformedValue);\n },\n },\n });\n }\n\n // To prevent duplicate items for the multi select options, we dedup them based on the \"data-id\" attribute\n // eslint-disable-next-line class-methods-use-this\n #dedupItems(items) {\n return Array.from(\n new Map(items.map((item) => [item.getAttribute('data-id'), item])).values()\n );\n }\n\n // vaadin api is to set props on their combo box node,\n // in order to avoid it, we are passing the children of this component\n // to the items & renderer props, so it will be used as the combo box items\n #onChildrenChange() {\n const items = Array.from(this.children);\n const dedupItems = this.#dedupItems(items);\n\n // we want the data-name attribute to be accessible as an object attribute\n if (items.length) {\n this.removeAttribute('has-no-options');\n\n dedupItems.forEach((node) => {\n Object.defineProperty(node, 'data-name', {\n value: node.getAttribute('data-name'),\n configurable: true,\n writable: true,\n });\n Object.defineProperty(node, 'data-id', {\n value: node.getAttribute('data-id'),\n configurable: true,\n writable: true,\n });\n });\n\n this.baseElement.items = dedupItems;\n\n setTimeout(() => {\n // set timeout to ensure this runs after customValueTransformFn had the chance to be overriden\n this.updateSelectedItems();\n }, 0);\n } else {\n this.baseElement.items = [];\n this.setAttribute('has-no-options', '');\n }\n\n // use vaadin combobox custom renderer to render options as HTML\n // and not via default renderer, which renders only the data-name's value\n // in its own HTML template\n this.baseElement.renderer = (root, combo, model) => {\n // eslint-disable-next-line no-param-reassign\n root.innerHTML = model.item.outerHTML;\n };\n }\n\n // the default vaadin behavior is to attach the overlay to the body when opened\n // we do not want that because it's difficult to style the overlay in this way\n // so we override it to open inside the shadow DOM\n #overrideOverlaySettings() {\n const overlay = this.baseElement.shadowRoot\n .querySelector('vaadin-multi-select-combo-box-internal')\n .shadowRoot.querySelector('vaadin-multi-select-combo-box-overlay');\n overlay._attachOverlay = () => {\n overlay.bringToFront();\n };\n overlay._detachOverlay = () => {};\n overlay._enterModalState = () => {};\n }\n\n #handleCustomValues() {\n if (this.allowCustomValues) {\n this.baseElement.addEventListener('custom-value-set', (e) => {\n const newItemHtml = this.#renderItem({\n label: e.detail,\n displayName: e.detail,\n value: e.detail,\n });\n this.innerHTML += newItemHtml;\n // The internal filter needs to be removed, otherwise there's a bug where a new custom item\n // added can't be removed from the dropdown because of how the vaadin component is implemented\n this.baseElement._lastFilter = '';\n // The value needs to be set with a timeout because it needs to execute after\n // the custom value is added to items by the children change observer\n setTimeout(() => {\n this.value = [...this.value, e.detail];\n }, 0);\n });\n }\n }\n\n setGetValidity() {\n // eslint-disable-next-line func-names\n this.getValidity = function () {\n if (this.pattern) {\n const patternRegex = new RegExp(this.pattern);\n if (this.value.some((val) => !patternRegex.test(val)))\n return {\n patternMismatch: true,\n };\n }\n\n if (this.isRequired && !this.value.length) {\n return {\n valueMissing: true,\n };\n }\n // If the field is not required, no minimum selection can be set\n if (\n this.isRequired &&\n this.minItemsSelection &&\n this.value.length < this.minItemsSelection\n ) {\n return {\n rangeUnderflow: true,\n };\n }\n if (this.maxItemsSelection && this.value.length > this.maxItemsSelection) {\n return {\n rangeOverflow: true,\n };\n }\n return {};\n };\n\n // This is required to override the default validity check of the vaadin component\n // which is triggered when the component is checked for validity after blur\n // Without this, our minItemsSelection and maxItemsSelection constraints will not be checked\n const that = this;\n // eslint-disable-next-line func-names\n this.baseElement.checkValidity = () => {\n return that.validity.valid;\n };\n }\n\n init() {\n super.init?.();\n\n this.setGetValidity();\n\n this.#handleCustomValues();\n\n this.renderItems();\n\n observeAttributes(this, this.renderItems.bind(this), { includeAttrs: ['data'] });\n\n observeChildren(this, this.#onChildrenChange.bind(this));\n\n // Note: we need to forward the `placeholder` because the vaadin component observes it and\n // tries to override it, causing us to lose the user set placeholder.\n forwardAttrs(this, this.baseElement, { includeAttrs: ['placeholder'] });\n\n // This is a workaround for a problem we have in Console App, where in ScreenBuilder - the inputElement is not ready when trying to\n // set the component's descriptor and override the overlay settings.\n // THIS IS A PROBLEM WITH THE CONSOLE APP THAT NEEDS TO BE RESOLVED. Until then, we use this workaround.\n setTimeout(() => {\n this.setComboBoxDescriptor();\n this.#overrideOverlaySettings();\n });\n\n this.setDefaultValues();\n\n this.baseElement.addEventListener('selected-items-changed', () => {\n this.#updateInternalValue();\n this.dispatchEvent(new CustomEvent('input', { bubbles: true }));\n });\n }\n\n setDefaultValues() {\n const initialDefaultValues = this.defaultValues;\n if (initialDefaultValues.length > 0) {\n this.value = this.defaultValues;\n }\n }\n\n #updateInternalValue() {\n // This is done here because we don't want to return a different copy of the same array\n // every time get value is called if a new value wasn't set\n this.#value =\n this.baseElement.selectedItems?.map((elem) => elem.getAttribute('data-id')) || [];\n }\n\n // Updating the value will update the selectedItems, which will trigger an event 'selected-items-changed'\n // which we listen to in the init function to update the internal value\n set value(vals) {\n if (vals && vals.length > 0) {\n // Filters the children of the component to find the ones that match the values,\n // since it's possible that some values that are trying to set are not in the children\n const selectedChildren = this.baseElement.items?.filter((item) =>\n vals.includes(item['data-id'])\n );\n\n // If the component allows custom values, we need to add the values that are not present in the children\n if (this.allowCustomValues) {\n const existingValues =\n selectedChildren?.map((child) => child.getAttribute('data-id')) || [];\n const missingValues = vals.filter((val) => !existingValues.includes(val));\n\n if (missingValues.length) {\n const newItemsHtml = missingValues.reduce((acc, val) => {\n const newItemHtml = this.#renderItem({\n label: val,\n displayName: val,\n value: val,\n });\n return acc + newItemHtml;\n }, '');\n this.innerHTML += newItemsHtml;\n\n // The value needs to be set with a timeout because it needs to execute after\n // the custom values are added to the items by the children change observer\n setTimeout(() => {\n this.value = vals;\n }, 0);\n return;\n }\n }\n\n const newSelectedValues =\n selectedChildren?.map((child) => child.getAttribute('data-id')) || [];\n if (!compareArraysUnordered(this.#value, newSelectedValues)) {\n this.baseElement.selectedItems = selectedChildren;\n }\n } else {\n this.baseElement.selectedItems = [];\n }\n }\n\n get value() {\n return this.#value;\n }\n\n attributeChangedCallback(attrName, oldValue, newValue) {\n super.attributeChangedCallback?.(attrName, oldValue, newValue);\n\n if (attrName === 'readonly') {\n this.onReadOnlyChange(newValue !== null && newValue === 'true');\n }\n }\n\n onReadOnlyChange(val) {\n if (val) {\n this.baseElement?.shadowRoot\n ?.querySelector('vaadin-multi-select-combo-box-internal')\n ?.setAttribute('inert', val);\n } else {\n this.baseElement?.shadowRoot\n ?.querySelector('vaadin-multi-select-combo-box-internal')\n ?.removeAttribute('inert');\n }\n }\n };\n\nconst {\n host,\n inputField,\n inputElement,\n placeholder,\n toggle,\n clearButton,\n label,\n requiredIndicator,\n helperText,\n errorMessage,\n chip,\n chipLabel,\n overflowChipFirstBorder,\n overflowChipSecondBorder,\n} = {\n host: { selector: () => ':host' },\n inputField: { selector: '::part(input-field)' },\n inputElement: { selector: 'input' },\n placeholder: { selector: '> input:placeholder-shown' },\n toggle: { selector: '::part(toggle-button)' },\n clearButton: { selector: '::part(clear-button)' },\n label: { selector: '::part(label)' },\n requiredIndicator: { selector: '[required]::part(required-indicator)::after' },\n helperText: { selector: '::part(helper-text)' },\n errorMessage: { selector: '::part(error-message)' },\n chip: { selector: 'vaadin-multi-select-combo-box-chip' },\n chipLabel: { selector: 'vaadin-multi-select-combo-box-chip::part(label)' },\n overflowChipFirstBorder: {\n selector: \"vaadin-multi-select-combo-box-chip[slot='overflow']::before\",\n },\n overflowChipSecondBorder: {\n selector: \"vaadin-multi-select-combo-box-chip[slot='overflow']::after\",\n },\n};\n\nexport const MultiSelectComboBoxClass = compose(\n createStyleMixin({\n mappings: {\n hostWidth: { ...host, property: 'width' },\n hostDirection: { ...host, property: 'direction' },\n // we apply font-size also on the host so we can set its width with em\n fontSize: [{}, host],\n chipFontSize: { ...chipLabel, property: 'font-size' },\n fontFamily: [label, placeholder, inputField, helperText, errorMessage, chipLabel],\n labelFontSize: { ...label, property: 'font-size' },\n labelFontWeight: { ...label, property: 'font-weight' },\n labelTextColor: [\n { ...label, property: 'color' },\n { ...requiredIndicator, property: 'color' },\n ],\n errorMessageTextColor: { ...errorMessage, property: 'color' },\n errorMessageIcon: { ...errorMessage, property: 'background-image' },\n errorMessageIconSize: { ...errorMessage, property: 'background-size' },\n errorMessageIconPadding: { ...errorMessage, property: 'padding-inline-start' },\n errorMessageIconRepeat: { ...errorMessage, property: 'background-repeat' },\n errorMessageIconPosition: { ...errorMessage, property: 'background-position' },\n errorMessageFontSize: { ...errorMessage, property: 'font-size' },\n inputHeight: { ...inputField, property: 'min-height' },\n inputBackgroundColor: { ...inputField, property: 'background-color' },\n inputBorderColor: { ...inputField, property: 'border-color' },\n inputBorderWidth: { ...inputField, property: 'border-width' },\n inputBorderStyle: { ...inputField, property: 'border-style' },\n inputBorderRadius: { ...inputField, property: 'border-radius' },\n labelRequiredIndicator: { ...requiredIndicator, property: 'content' },\n inputValueTextColor: { ...inputField, property: 'color' },\n inputPlaceholderTextColor: { ...placeholder, property: 'color' },\n inputDropdownButtonCursor: [\n { ...toggle, property: 'cursor' },\n { ...clearButton, property: 'cursor' },\n ],\n inputDropdownButtonColor: [\n { ...toggle, property: 'color' },\n { ...clearButton, property: 'color' },\n ],\n inputDropdownButtonSize: [\n { ...toggle, property: 'font-size' },\n { ...clearButton, property: 'font-size' },\n ],\n inputDropdownButtonOffset: [\n { ...toggle, property: 'margin-right' },\n { ...toggle, property: 'margin-left' },\n ],\n inputOutlineColor: { ...inputField, property: 'outline-color' },\n inputOutlineWidth: { ...inputField, property: 'outline-width' },\n inputOutlineStyle: { ...inputField, property: 'outline-style' },\n inputOutlineOffset: { ...inputField, property: 'outline-offset' },\n inputHorizontalPadding: [\n { ...inputElement, property: 'padding-left' },\n { ...inputElement, property: 'padding-right' },\n { ...inputField, property: 'padding-inline-start' },\n ],\n inputVerticalPadding: [\n { ...inputField, property: 'padding-top' },\n { ...inputField, property: 'padding-bottom' },\n ],\n chipTextColor: { ...chipLabel, property: 'color' },\n chipBackgroundColor: [\n { ...chip, property: 'background-color' },\n { ...overflowChipFirstBorder, property: 'border-color' },\n { ...overflowChipSecondBorder, property: 'border-color' },\n ],\n\n labelPosition: { ...label, property: 'position' },\n labelTopPosition: { ...label, property: 'top' },\n labelLeftPosition: { ...label, property: 'left' },\n labelHorizontalPosition: [\n { ...label, property: 'left' },\n { ...label, property: 'right' },\n ],\n inputTransformY: { ...label, property: 'transform' },\n inputTransition: { ...label, property: 'transition' },\n marginInlineStart: { ...label, property: 'margin-inline-start' },\n placeholderOpacity: { ...placeholder, property: 'opacity' },\n inputVerticalAlignment: { ...inputField, property: 'align-items' },\n\n // we need to use the variables from the portal mixin\n // so we need to use an arrow function on the selector\n // for that to work, because ComboBox is not available\n // at this time.\n overlayBackground: {\n property: () => MultiSelectComboBoxClass.cssVarList.overlay.backgroundColor,\n },\n overlayTextColor: {\n property: () => MultiSelectComboBoxClass.cssVarList.overlay.textColor,\n },\n overlayBorder: { property: () => MultiSelectComboBoxClass.cssVarList.overlay.border },\n overlayFontSize: { property: () => MultiSelectComboBoxClass.cssVarList.overlay.fontSize },\n overlayFontFamily: { property: () => MultiSelectComboBoxClass.cssVarList.overlay.fontFamily },\n overlayCursor: { property: () => MultiSelectComboBoxClass.cssVarList.overlay.cursor },\n overlayItemBoxShadow: {\n property: () => MultiSelectComboBoxClass.cssVarList.overlay.itemBoxShadow,\n },\n overlayItemPaddingInlineStart: {\n property: () => MultiSelectComboBoxClass.cssVarList.overlay.itemPaddingInlineStart,\n },\n overlayItemPaddingInlineEnd: {\n property: () => MultiSelectComboBoxClass.cssVarList.overlay.itemPaddingInlineEnd,\n },\n },\n }),\n draggableMixin,\n portalMixin({\n name: 'overlay',\n selector: 'vaadin-multi-select-combo-box-internal',\n mappings: {\n backgroundColor: { selector: 'vaadin-multi-select-combo-box-scroller' },\n minHeight: { selector: 'vaadin-multi-select-combo-box-overlay' },\n margin: { selector: 'vaadin-multi-select-combo-box-overlay' },\n cursor: { selector: 'vaadin-multi-select-combo-box-item' },\n fontFamily: { selector: 'vaadin-multi-select-combo-box-item' },\n textColor: { selector: 'vaadin-multi-select-combo-box-item', property: 'color' },\n fontSize: { selector: 'vaadin-multi-select-combo-box-item' },\n itemBoxShadow: { selector: 'vaadin-multi-select-combo-box-item', property: 'box-shadow' },\n itemPaddingInlineStart: {\n selector: 'vaadin-multi-select-combo-box-item',\n property: 'padding-inline-start',\n },\n itemPaddingInlineEnd: {\n selector: 'vaadin-multi-select-combo-box-item',\n property: 'padding-inline-end',\n },\n },\n forward: {\n include: false,\n attributes: ['size'],\n },\n }),\n proxyInputMixin({ proxyProps: ['selectionStart'], inputEvent: 'selected-items-changed' }),\n changeMixin,\n componentNameValidationMixin,\n multiSelectComboBoxMixin\n)(\n createProxy({\n slots: ['', 'prefix'],\n wrappedEleName: 'vaadin-multi-select-combo-box',\n style: () => `\n\t\t:host {\n\t\t\tdisplay: inline-flex;\n\t\t\tbox-sizing: border-box;\n\t\t\t-webkit-mask-image: none;\n\t\t}\n\t\t${useHostExternalPadding(MultiSelectComboBoxClass.cssVarList)}\n\t\t${resetInputReadonlyStyle('vaadin-multi-select-combo-box')}\n\t\t${resetInputPlaceholder('vaadin-multi-select-combo-box')}\n\t\t${resetInputCursor('vaadin-multi-select-combo-box')}\n\n\t\tvaadin-multi-select-combo-box {\n\t\t\tpadding: 0;\n\t\t\twidth: 100%;\n\t\t}\n\t\tvaadin-multi-select-combo-box::before {\n\t\t\theight: initial;\n\t\t}\n\t\tvaadin-multi-select-combo-box [slot=\"input\"] {\n\t\t\t-webkit-mask-image: none;\n\t\t\tmin-height: 0;\n align-self: center;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\t\tvaadin-multi-select-combo-box[readonly] [slot=\"input\"] {\n flex-grow: 1;\n flex-basis: 4em;\n\t\t}\n\n\t\t::part(input-field) {\n padding: 0;\n\t\t\tbox-shadow: none;\n\t\t}\n ${resetInputLabelPosition('vaadin-multi-select-combo-box')}\n :host([has-label]) vaadin-multi-select-combo-box-chip::part(label) {\n display: block;\n }\n\n vaadin-multi-select-combo-box vaadin-multi-select-combo-box-chip[slot='overflow']::before,\n vaadin-multi-select-combo-box vaadin-multi-select-combo-box-chip[slot='overflow']::after {\n left: -4px;\n right: -4px;\n border-left-width: 0;\n border-inline-start-style: solid;\n border-inline-start-width: 2px;\n }\n vaadin-multi-select-combo-box vaadin-multi-select-combo-box-chip[slot='overflow']::after {\n left: -8px;\n right: -8px;\n }\n\n :host([has-no-options][allow-custom-value='true']) ::part(toggle-button) {\n display: none;\n }\n\n ${inputFloatingLabelStyle()}\n\n vaadin-multi-select-combo-box::part(toggle-button),\n vaadin-multi-select-combo-box::part(clear-button) {\n align-self: center;\n }\n\n vaadin-multi-select-combo-box[label-type=\"floating\"]:not([focused])[readonly] > input:placeholder-shown {\n opacity: 0;\n }\n vaadin-multi-select-combo-box[label-type=\"floating\"]:not([focused])[disabled] > input:placeholder-shown {\n opacity: 0;\n }\n\n\t\t`,\n // Note: we exclude `size` to avoid overriding Vaadin's ComboBox property\n // with the same name. Including it will cause Vaadin to calculate NaN size,\n // and reset items to an empty array, and opening the list box with no items\n // to display.\n // Note: we exclude `placeholder` because the vaadin component observes it and\n // tries to override it, causing us to lose the user set placeholder.\n excludeAttrsSync: ['tabindex', 'size', 'data', 'placeholder'],\n componentName,\n includeForwardProps: ['items', 'renderer', 'selectedItems'],\n })\n);\n","import '@vaadin/multi-select-combo-box';\nimport { componentName, MultiSelectComboBoxClass } from './MultiSelectComboBoxClass';\n\ncustomElements.define(componentName, MultiSelectComboBoxClass);\n\nexport { MultiSelectComboBoxClass, componentName };\n","export const useHostExternalPadding = (cssVarList) => `\n :host {\n padding: calc(var(${cssVarList.inputOutlineWidth}) + var(${cssVarList.inputOutlineOffset}))\n }\n`;\n\nexport const resetInputFieldUnderlayingBorder = (name) => `\n ${name}::part(input-field)::after {\n border: none;\n }\n`;\n\nexport const resetInitialHeight = (name) => `\n ${name}::before {\n\t\theight: unset;\n\t}\n`;\n\nexport const resetInputElement = (name) => `\n ${name} > input {\n -webkit-mask-image: none;\n min-height: 0;\n box-sizing: border-box;\n }\n`;\n\nexport const resetInputContainer = (name) => `\n ${name} {\n margin: 0;\n padding: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n }\n`;\n\nexport const resetInputField = (name) => `\n ${name}::part(input-field) {\n overflow: hidden;\n padding: 0;\n box-shadow: none;\n }\n`;\n\nexport const resetInputCursor = (name) => `\n ${name} > label,\n ${name}::part(label),\n ${name}::part(required-indicator) {\n cursor: pointer;\n }\n`;\n\nexport const resetInputPlaceholder = (name, ele = 'input') => `\n ${name}[disabled] > ${ele}:placeholder-shown,\n\t${name}[readonly] > ${ele}:placeholder-shown {\n\t\topacity: 1;\n\t}\n`;\n\nexport const resetInputAutoFill = (name, cssVarList) => `\n ${name} input:-webkit-autofill,\n ${name} input:-webkit-autofill::first-line,\n ${name} input:-webkit-autofill:hover,\n ${name} input:-webkit-autofill:active,\n ${name} input:-webkit-autofill:focus {\n -webkit-text-fill-color: var(${cssVarList.inputValueTextColor});\n box-shadow: 0 0 0 var(${cssVarList.inputHeight}) var(${cssVarList.inputBackgroundColor}) inset;\n }\n`;\n\nexport const resetInputFieldDefaultWidth = () => `\n :host {\n --vaadin-field-default-width: auto;\n box-sizing: border-box;\n }\n`;\n\nexport const resetInputReadonlyStyle = (name) => `\n ${name}::part(input-field)::after {\n opacity: 0;\n }\n`;\n\nexport const resetInputFieldInvalidBackgroundColor = (name) => `\n ${name}::part(input-field)::after {\n background: none;\n }\n`;\n\nexport const resetInputOverrides = (name, cssVarList) => `\n ${resetInputContainer(name)}\n ${resetInputCursor(name)}\n ${resetInputPlaceholder(name)}\n ${resetInputField(name)}\n ${resetInputAutoFill(name, cssVarList)}\n ${resetInputFieldInvalidBackgroundColor(name)}\n ${resetInitialHeight(name)}\n ${resetInputElement(name)}\n ${resetInputFieldUnderlayingBorder(name)}\n`;\n\n// This function is used to support RTL correctly for input components.\n// It also fixes the error message to be displayed LTR since we currently\n// don't support RTL for error messages.\nexport const resetInputLabelPosition = (name) => `\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 ${name} [slot=\"label\"] {\n max-width: calc(100% - 1em);\n overflow: hidden;\n text-overflow: ellipsis;\n padding-bottom: 0.5em;\n }\n`;\n\nexport const inputFloatingLabelStyle = () => {\n return `\n :host([label-type=\"floating\"]) {\n position: relative;\n }\n :host([label-type=\"floating\"][has-label]) > ::part(label) {\n z-index: 1;\n padding: 0;\n width: auto;\n }\n `;\n};\n"],"names":["componentName","host","inputField","inputElement","placeholder","toggle","clearButton","label","requiredIndicator","helperText","errorMessage","chip","chipLabel","overflowChipFirstBorder","overflowChipSecondBorder","selector","MultiSelectComboBoxClass","mappings","hostWidth","property","hostDirection","fontSize","chipFontSize","fontFamily","labelFontSize","labelFontWeight","labelTextColor","errorMessageTextColor","errorMessageIcon","errorMessageIconSize","errorMessageIconPadding","errorMessageIconRepeat","errorMessageIconPosition","errorMessageFontSize","inputHeight","inputBackgroundColor","inputBorderColor","inputBorderWidth","inputBorderStyle","inputBorderRadius","labelRequiredIndicator","inputValueTextColor","inputPlaceholderTextColor","inputDropdownButtonCursor","inputDropdownButtonColor","inputDropdownButtonSize","inputDropdownButtonOffset","inputOutlineColor","inputOutlineWidth","inputOutlineStyle","inputOutlineOffset","inputHorizontalPadding","inputVerticalPadding","chipTextColor","chipBackgroundColor","labelPosition","labelTopPosition","labelLeftPosition","labelHorizontalPosition","inputTransformY","inputTransition","marginInlineStart","placeholderOpacity","inputVerticalAlignment","overlayBackground","cssVarList","overlay","backgroundColor","overlayTextColor","textColor","overlayBorder","border","overlayFontSize","overlayFontFamily","overlayCursor","cursor","overlayItemBoxShadow","itemBoxShadow","overlayItemPaddingInlineStart","itemPaddingInlineStart","overlayItemPaddingInlineEnd","itemPaddingInlineEnd","name","minHeight","margin","forward","include","attributes","proxyProps","inputEvent","superclass","observedAttributes","displayName","value","ele","document","createElement","setAttribute","textContent","outerHTML","defaultValues","defaultValuesAttr","this","getAttribute","JSON","parse","isValidDataType","e","console","error","message","renderItem","renderFn","renderItems","data","dataAttr","allowCustomValues","minItemsSelection","parseInt","maxItemsSelection","isValid","Array","isArray","getItemsTemplate","reduce","acc","item","template","innerHTML","updateSelectedItems","currentSelected","baseElement","selectedItems","map","length","setDefaultValues","customValueTransformFn","val","setComboBoxDescriptor","valueDescriptor","Object","getOwnPropertyDescriptor","constructor","prototype","comboBox","defineProperties","set","transformedValue","call","items","from","Map","values","children","dedupItems","removeAttribute","forEach","node","defineProperty","configurable","writable","setTimeout","renderer","root","combo","model","shadowRoot","querySelector","_attachOverlay","bringToFront","_detachOverlay","_enterModalState","addEventListener","newItemHtml","detail","_lastFilter","setGetValidity","getValidity","pattern","patternRegex","RegExp","some","test","patternMismatch","isRequired","valueMissing","rangeUnderflow","rangeOverflow","that","checkValidity","validity","valid","init","super","bind","includeAttrs","dispatchEvent","CustomEvent","bubbles","elem","vals","selectedChildren","filter","includes","existingValues","child","missingValues","newItemsHtml","newSelectedValues","attributeChangedCallback","attrName","oldValue","newValue","onReadOnlyChange","slots","wrappedEleName","style","excludeAttrsSync","includeForwardProps","customElements","define","useHostExternalPadding","resetInputContainer","resetInputField","resetInputCursor","resetInputPlaceholder","resetInputFieldDefaultWidth","resetInputReadonlyStyle","resetInputFieldInvalidBackgroundColor","resetInputOverrides","resetInputAutoFill","resetInitialHeight","resetInputElement","resetInputFieldUnderlayingBorder","resetInputLabelPosition","inputFloatingLabelStyle"],"sourceRoot":""}
@@ -1,5 +1,5 @@
1
1
  /*! For license information please see descope-outbound-apps.js.LICENSE.txt */
2
- "use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[461,2294,4292,4551,5087],{7720:(t,e,o)=>{o.d(e,{T:()=>l,x:()=>c});var n=o(88961),r=o(63200),i=o(25964),a=o(93895),s=o(72270);const l=(0,i.xE)("list");class d extends((0,s.qu)({componentName:l,baseSelector:".wrapper"})){static get observedAttributes(){return["variant","readonly"]}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <div class="wrapper">\n <slot></slot>\n <slot name="empty-state">\n No item...\n </slot>\n </div>\n\t',(0,i.fz)('\n .wrapper {\n overflow: auto;\n display: grid;\n max-height: 100%;\n width: 100%;\n }\n\n :host {\n display: inline-flex;\n width: 100%;\n }\n slot[name="empty-state"] {\n justify-content: center;\n align-items: center;\n display: flex;\n flex-grow: 1;\n }\n\n :host slot[name="empty-state"] {\n display: none;\n }\n :host([empty]) slot[name="empty-state"] {\n display: flex;\n }\n ::slotted(:not([slot])) {\n width: 100%;\n }\n ',this)}get items(){return this.shadowRoot.querySelector("slot").assignedElements()}#t(){0===this.items.length?this.setAttribute("empty","true"):this.removeAttribute("empty")}get variant(){return this.getAttribute("variant")||"list"}#e(){this.items.forEach((t=>{let e=t;e.localName!==a.O.componentName&&(e=t.querySelector(a.O.componentName));const o="tiles"===this.variant?"tile":"row";e.setAttribute("variant",o)}))}init(){super.init?.(),(0,i.Ge)(this,(()=>{this.#t(),this.#e(),this.#o()}))}get isReadOnly(){return"true"===this.getAttribute("readonly")}#o(){this.items.forEach((t=>{this.isReadOnly?t.setAttribute("inert",""):t.removeAttribute("inert")}))}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),o!==e&&("variant"===t?this.#e():"readonly"===t&&this.#o())}}const c=(0,r.Zz)((0,n.RF)({mappings:{hostWidth:{selector:()=>":host",property:"width"},maxHeight:{selector:()=>":host"},minHeight:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-left"},{property:"padding-right"}],hostDirection:{selector:()=>":host",property:"direction"},fontFamily:{},gap:{},backgroundColor:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},boxShadow:{},gridTemplateColumns:{},maxItemsWidth:{selector:()=>"::slotted(:not([slot]))",property:"max-width"},minItemsWidth:{selector:()=>"::slotted(:not([slot]))",property:"min-width"},itemsHorizontalAlign:{selector:()=>"::slotted(*)",property:"justify-self"},emptyStateTextColor:{selector:()=>'slot[name="empty-state"]',property:"color"},emptyStateTextFontFamily:{selector:()=>'slot[name="empty-state"]',property:"font-family"}}}),n.VO,n.tQ)(d)},8512:(t,e,o)=>{o.d(e,{T:()=>l,q:()=>p});var n=o(88961),r=o(72270),i=o(63200),a=o(25964),s=o(18782);const l=(0,a.xE)("image"),d=["src","src-dark"];class c extends((0,r.qu)({componentName:l,baseSelector:"slot"})){static get observedAttributes(){return d}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<slot></slot>\n\t",(0,a.fz)("\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n :host > slot {\n width: 100%;\n height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n ::slotted(*) {\n width: 100%;\n\t\t\t}\n\n .hidden {\n display: none;\n }\n ",this)}init(){super.init?.(),this.toggleVisibility(this.src)}onThemeChange(){this.renderImage()}toggleVisibility(t){t?this.classList.remove("hidden"):this.classList.add("hidden")}get altText(){return this.getAttribute("alt")||""}get legacySrc(){return this.getAttribute("src")}get themeSrc(){return this.getAttribute(`src-${this.currentThemeName}`)}get src(){return this.themeSrc||this.legacySrc}updateFillColor(t){[t,...t.querySelectorAll("*[fill]")].forEach((t=>{t.setAttribute("fill",`var(${p.cssVarList.fill}, ${t.getAttribute("fill")||"''"})`)}))}renderImage(){this.toggleVisibility(this.src),(0,s.m)(this.src,this.altText).then((t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))}))}shouldRender(t){const e=this.getAttribute(t);return this.src===e}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),e!==o&&this.shouldRender(t)&&this.renderImage()}}const p=(0,i.Zz)((0,n.RF)({mappings:{fill:{},height:{selector:()=>":host"},width:{selector:()=>":host"}}}),n.VO,n.tQ)(c)},10767:(t,e,o)=>{o.d(e,{G:()=>n});const n=t=>class extends t{get isLoading(){return"true"===this.getAttribute("loading")}click(){this.isLoading||super.click()}}},18782:(t,e,o)=>{o.d(e,{m:()=>i});var n=o(25414);const r=t=>{const e=n.A.sanitize(t,{USE_PROFILES:{svg:!0,svgFilters:!0},ADD_TAGS:["image"],FORBID_TAGS:["defs"]});return(new DOMParser).parseFromString(e,"image/svg+xml").querySelector("svg")},i=async(t,e)=>{try{let o;if((t=>t.startsWith("data:image/svg+xml;base64,"))(t)){const e=atob(t.slice(26));o=r(e)}else if("svg"===(t=>{const e=t.match(/\.([0-9a-z]+)(?:[\\?#]|$)/i);return e?e[1]:null})(t)){const e=await fetch(t),n=await e.text();o=r(n)}else o=((t,e)=>{const o=document.createElement("img");return o.setAttribute("src",t),o.setAttribute("alt",e),o})(t,e);return o.style.setProperty("max-width","100%"),o.style.setProperty("max-height","100%"),o}catch{return null}}},19624:(t,e,o)=>{o.d(e,{J:()=>m,T:()=>l});var n=o(63200),r=o(25964),i=o(88961),a=o(98538),s=o(10767);const l=(0,r.xE)("button"),{host:d,label:c,slottedIcon:p}={host:{selector:()=>":host"},label:{selector:"::part(label)"},slottedIcon:{selector:()=>"::slotted(descope-icon)"}};let h;const m=(0,n.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:a.S.cssVarList.fill},labelTextDecoration:{...c,property:"text-decoration"},labelSpacing:{...c,property:"gap"},textAlign:{...c,property:"justify-content",fallback:"center"},iconSize:[{...p,property:"width"},{...p,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${h}\n\t\t\tvaadin-button::part(label) { pointer-events: none; }\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${m.cssVarList.outlineWidth}) + var(${m.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width="true"]) {\n width: var(${m.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${m.cssVarList.hostHeight}) - var(${m.cssVarList.outlineWidth}) - var(${m.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square="true"]:not([full-width="true"]) {\n\t\t\t\twidth: calc(var(${m.cssVarList.hostWidth}) - var(${m.cssVarList.outlineWidth}) - var(${m.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex","class"],componentName:l})),{color:u,fontSize:b}=m.cssVarList;h=`\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(${u});\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`},24542:(t,e,o)=>{o.r(e),o.d(e,{ListItemClass:()=>n.O,componentName:()=>n.T});var n=o(93895);customElements.define(n.T,n.O)},30576:(t,e,o)=>{o.r(e),o.d(e,{ButtonClass:()=>n.J,componentName:()=>n.T});var n=o(19624);o(83799),customElements.define(n.T,n.J)},44666:(t,e,o)=>{o.d(e,{E:()=>h,T:()=>s});var n=o(88961),r=o(72270),i=o(63200),a=o(25964);const s=(0,a.xE)("avatar");class l extends((0,r.qu)({componentName:s,baseSelector:":host > .wrapper"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <div class="wrapper">\n <vaadin-avatar></vaadin-avatar>\n <div class="editableBadge">\n <vaadin-icon icon="vaadin:pencil"></vaadin-icon>\n </div>\n </div>\n\t\t',(0,a.fz)("\n :host {\n\t\t\t\t\tdisplay: inline-flex;\n\t\t\t\t}\n\n .editableBadge {\n border: 1px solid;\n border-radius: 100%;\n height: fit-content;\n width: 25%;\n height: 25%;\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 5%;\n box-sizing: border-box;\n position: absolute;\n bottom: 0;\n inset-inline-end: 0;\n }\n\n vaadin-icon {\n color: currentcolor;\n }\n\n vaadin-avatar {\n width: 100%;\n height: 100%;\n margin: 0;\n border: none\n }\n\n .wrapper {\n display: inline-flex;\n position: relative;\n width: 100%;\n height: 100%;\n }\n ",this),this.avatarComponent=this.shadowRoot.querySelector("vaadin-avatar"),(0,a.EA)(this,this.avatarComponent,{includeAttrs:["display-name","img","abbr"],mapAttrs:{"display-name":"name"}});const t=this.shadowRoot.querySelector(".editableBadge");(0,a.mx)(this,(()=>{t.style.display=this.isEditable?"":"none"}),{includeAttrs:["editable"]})}get isEditable(){return"true"===this.getAttribute("editable")}}const{host:d,editableBadge:c,avatar:p}={host:{selector:()=>":host"},editableBadge:{selector:"> .editableBadge"},avatar:{selector:"vaadin-avatar"}},h=(0,i.Zz)((0,n.RF)({mappings:{hostWidth:[{...d,property:"width"},{...d,property:"min-width"}],hostHeight:{...d,property:"height"},cursor:[p,d],hostDirection:{...d,property:"direction"},avatarTextColor:{...p,property:"color"},avatarBackgroundColor:{...p,property:"background-color"},editableIconColor:{...c,property:"color"},editableBorderColor:{...c,property:"border-color"},editableBackgroundColor:{...c,property:"background-color"}}}),n.VO,n.tQ)(l)},45400:(t,e,o)=>{o.r(e),o.d(e,{ListClass:()=>n.x,componentName:()=>n.T}),o(24542);var n=o(7720);customElements.define(n.T,n.x)},58204:(t,e,o)=>{o.r(e),o.d(e,{OutboundAppsClass:()=>g,componentName:()=>h}),o(45400),o(24542),o(63595),o(64309),o(30576);var n=o(63200),r=o(25964),i=o(88961),a=o(72270),s=o(98538),l=o(66434),d=o(44666),c=o(7720),p=o(93895);const h=(0,r.xE)("outbound-apps"),m=({name:t,description:e,logo:o,appId:n,isConnected:i},a,s)=>{const l=i?"disconnect":"connect";return`\n <descope-list-item>\n <descope-avatar\n ${o?`img="${o}"`:""}\n ${t?`display-name="${t}" abbr=${(0,r.ie)(t)}`:""}\n size=${s.size}\n class="app-logo"\n ></descope-avatar>\n\n <div class="content">\n <descope-text\n class="app-title"\n variant="subtitle1"\n mode="primary"\n >${t}</descope-text>\n ${e?`\n <descope-text\n class="app-description"\n variant="body2"\n mode="primary"\n >${e}</descope-text>\n `:""}\n </div>\n <div class="controls">\n <descope-button variant="link" mode="primary" size=${s.size} data-action="${l}" data-outbound-app-id="${n}" data-id="${l}">\n ${i?s.disconnectButtonLabel:s.connectButtonLabel}\n </descope-button>\n </div>\n </descope-list-item>\n`},u=(0,a.qu)({componentName:h,baseSelector:"descope-list"}),{host:b}={host:{selector:()=>":host"}},g=(0,n.Zz)((0,i.RF)({mappings:{hostWidth:{...b,property:"width"},minHeight:{selector:()=>":host"},hostDirection:[{...b,property:"direction"},{selector:"descope-list",property:"direction"},{selector:"descope-list-item",property:"direction"}],iconColor:{selector:()=>" descope-icon",property:s.S.cssVarList.fill},errorIconColor:{selector:()=>" descope-icon.error-icon",property:s.S.cssVarList.fill},fontSize:{selector:l.s.componentName,property:l.s.cssVarList.fontSize},appLogoBackgroundColor:{selector:d.E.componentName,property:d.E.cssVarList.avatarBackgroundColor},appLogoGap:{selector:()=>" .app-logo",property:"margin-inline-end"},contentGap:{selector:()=>" .content",property:"gap"},itemsTextAlign:{selector:l.s.componentName,property:l.s.cssVarList.textAlign},itemCursor:{selector:p.O.componentName,property:p.O.cssVarList.cursor},itemOutline:{selector:p.O.componentName,property:p.O.cssVarList.outline},itemBorderColor:{selector:p.O.componentName,property:p.O.cssVarList.borderColor},itemBackgroundColor:{selector:p.O.componentName,property:p.O.cssVarList.backgroundColor},listBorderWidth:{selector:()=>c.x.componentName,property:c.x.cssVarList.borderWidth},listBoxShadow:{selector:()=>c.x.componentName,property:c.x.cssVarList.boxShadow},listPadding:[{selector:()=>c.x.componentName,property:c.x.cssVarList.verticalPadding},{selector:()=>c.x.componentName,property:c.x.cssVarList.horizontalPadding}]}}),i.VO,(0,i.t$)({itemRenderer:m,rerenderAttrsList:["size","connect-button-label","disconnect-button-label"]}),i.tQ)(class extends u{constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <descope-list>\n <slot name="empty-state" slot="empty-state"></slot>\n </descope-list>\n ',this.appsList=this.shadowRoot.querySelector("descope-list"),(0,r.fz)("\n :host {\n width: 100%;\n }\n .controls {\n display: flex;\n min-width: 8em;\n justify-content: end;\n }\n .content {\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n }\n .app-title,\n .app-description {\n display: flex;\n direction: inherit;\n }\n descope-list {\n display: block;\n }\n ",this)}init(){super.init?.(),this.appsList.itemRenderer=m,this.appsList.addEventListener("click",this.onAppsListClick.bind(this))}get readonly(){return"true"===this.getAttribute("readonly")}onAppsListClick(t){if(!this.readonly){const e=t.srcElement.getAttribute("data-outbound-app-id"),o=t.srcElement.getAttribute("data-action");e&&o&&this.dispatchEvent(new CustomEvent(`${o}-clicked`,{bubbles:!0,detail:{id:e,action:o}}))}}get size(){return this.getAttribute("size")||"sm"}get connectButtonLabel(){return this.getAttribute("connect-button-label")||"Connect"}get disconnectButtonLabel(){return this.getAttribute("disconnect-button-label")||"Disconnect"}});customElements.define(h,g)},63595:(t,e,o)=>{o.r(e),o.d(e,{TextClass:()=>n.s,componentName:()=>n.T});var n=o(66434);customElements.define(n.T,n.s)},64309:(t,e,o)=>{o.r(e),o.d(e,{AvatarClass:()=>n.E,componentName:()=>n.T});var n=o(44666);o(4408),o(95260),o(37182),customElements.define(n.T,n.E)},66434:(t,e,o)=>{o.d(e,{T:()=>s,s:()=>c});var n=o(88961),r=o(63200),i=o(25964),a=o(72270);const s=(0,i.xE)("text");class l extends((0,a.qu)({componentName:s,baseSelector:":host > slot"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <slot part="text-wrapper"></slot>\n ',(0,i.fz)("\n :host {\n display: inline-block;\n line-height: 1em;\n }\n :host > slot {\n width: 100%;\n display: inline-block;\n }\n ",this)}get hideWhenEmpty(){return"true"===this.getAttribute("hide-when-empty")}init(){super.init(),(0,i.Ge)(this,(()=>{const t=!!this.childNodes.length;this.style.display=!t&&this.hideWhenEmpty?"none":""}))}}const{host:d}={host:{selector:()=>":host"}},c=(0,r.Zz)((0,n.RF)({mappings:{hostWidth:{...d,property:"width"},hostDirection:{...d,property:"direction"},fontSize:{},textColor:[{property:"color"}],textLineHeight:{property:"line-height"},textLetterSpacing:{property:"letter-spacing"},textShadow:{},textAlign:{},textTransform:{},fontFamily:{},fontStyle:{},fontWeight:{},borderWidth:{},borderStyle:{},borderColor:{}}}),n.VO,n.tQ)(l)},83799:(t,e,o)=>{o(93555),o(89389)},89389:(t,e,o)=>{o.d(e,{$:()=>u});var n=o(13256),r=o(55774),i=o(82901),a=o(90676),s=o(81488),l=o(87550);const d=o(51450).AH`
2
+ "use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[461,2294,4292,4551,5087],{7720:(t,e,o)=>{o.d(e,{T:()=>l,x:()=>c});var n=o(88961),r=o(63200),i=o(25964),a=o(93895),s=o(72270);const l=(0,i.xE)("list");class d extends((0,s.qu)({componentName:l,baseSelector:".wrapper"})){static get observedAttributes(){return["variant","readonly"]}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <div class="wrapper">\n <slot></slot>\n <slot name="empty-state">\n No item...\n </slot>\n </div>\n\t',(0,i.fz)('\n .wrapper {\n overflow: auto;\n display: grid;\n max-height: 100%;\n width: 100%;\n }\n\n :host {\n display: inline-flex;\n width: 100%;\n }\n slot[name="empty-state"] {\n justify-content: center;\n align-items: center;\n display: flex;\n flex-grow: 1;\n }\n\n :host slot[name="empty-state"] {\n display: none;\n }\n :host([empty]) slot[name="empty-state"] {\n display: flex;\n }\n ::slotted(:not([slot])) {\n width: 100%;\n }\n ',this)}get items(){return this.shadowRoot.querySelector("slot").assignedElements()}#t(){0===this.items.length?this.setAttribute("empty","true"):this.removeAttribute("empty")}get variant(){return this.getAttribute("variant")||"list"}#e(){this.items.forEach((t=>{let e=t;e.localName!==a.O.componentName&&(e=t.querySelector(a.O.componentName));const o="tiles"===this.variant?"tile":"row";e.setAttribute("variant",o)}))}init(){super.init?.(),(0,i.Ge)(this,(()=>{this.#t(),this.#e(),this.#o()}))}get isReadOnly(){return"true"===this.getAttribute("readonly")}#o(){this.items.forEach((t=>{this.isReadOnly?t.setAttribute("inert",""):t.removeAttribute("inert")}))}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),o!==e&&("variant"===t?this.#e():"readonly"===t&&this.#o())}}const c=(0,r.Zz)((0,n.RF)({mappings:{hostWidth:{selector:()=>":host",property:"width"},maxHeight:{selector:()=>":host"},minHeight:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-left"},{property:"padding-right"}],hostDirection:{selector:()=>":host",property:"direction"},fontFamily:{},gap:{},backgroundColor:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},boxShadow:{},gridTemplateColumns:{},maxItemsWidth:{selector:()=>"::slotted(:not([slot]))",property:"max-width"},minItemsWidth:{selector:()=>"::slotted(:not([slot]))",property:"min-width"},itemsHorizontalAlign:{selector:()=>"::slotted(*)",property:"justify-self"},emptyStateTextColor:{selector:()=>'slot[name="empty-state"]',property:"color"},emptyStateTextFontFamily:{selector:()=>'slot[name="empty-state"]',property:"font-family"}}}),n.VO,n.tQ)(d)},8512:(t,e,o)=>{o.d(e,{T:()=>l,q:()=>p});var n=o(88961),r=o(72270),i=o(63200),a=o(25964),s=o(18782);const l=(0,a.xE)("image"),d=["src","src-dark"];class c extends((0,r.qu)({componentName:l,baseSelector:"slot"})){static get observedAttributes(){return d}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n\t\t<slot></slot>\n\t",(0,a.fz)("\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t}\n :host > slot {\n width: 100%;\n height: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tdisplay: flex;\n\t\t\t\toverflow: hidden;\n\t\t\t}\n\n ::slotted(*) {\n width: 100%;\n\t\t\t}\n\n .hidden {\n display: none;\n }\n ",this)}init(){super.init?.(),this.toggleVisibility(this.src)}onThemeChange(){this.renderImage()}toggleVisibility(t){t?this.classList.remove("hidden"):this.classList.add("hidden")}get altText(){return this.getAttribute("alt")||""}get legacySrc(){return this.getAttribute("src")}get themeSrc(){return this.getAttribute(`src-${this.currentThemeName}`)}get src(){return this.themeSrc||this.legacySrc}updateFillColor(t){[t,...t.querySelectorAll("*[fill]")].forEach((t=>{t.setAttribute("fill",`var(${p.cssVarList.fill}, ${t.getAttribute("fill")||"''"})`)}))}renderImage(){this.toggleVisibility(this.src),(0,s.m)(this.src,this.altText).then((t=>{this.innerHTML="",t&&(this.updateFillColor(t),this.appendChild(t))}))}shouldRender(t){const e=this.getAttribute(t);return this.src===e}attributeChangedCallback(t,e,o){super.attributeChangedCallback?.(t,e,o),e!==o&&this.shouldRender(t)&&this.renderImage()}}const p=(0,i.Zz)((0,n.RF)({mappings:{fill:{},height:{selector:()=>":host"},width:{selector:()=>":host"}}}),n.VO,n.tQ)(c)},10767:(t,e,o)=>{o.d(e,{G:()=>n});const n=t=>class extends t{get isLoading(){return"true"===this.getAttribute("loading")}click(){this.isLoading||super.click()}}},18782:(t,e,o)=>{o.d(e,{m:()=>i});var n=o(25414);const r=t=>{const e=n.A.sanitize(t,{USE_PROFILES:{svg:!0,svgFilters:!0},ADD_TAGS:["image"],FORBID_TAGS:["defs"]});return(new DOMParser).parseFromString(e,"image/svg+xml").querySelector("svg")},i=async(t,e)=>{try{let o;if((t=>t.startsWith("data:image/svg+xml;base64,"))(t)){const e=atob(t.slice(26));o=r(e)}else if("svg"===(t=>{const e=t.match(/\.([0-9a-z]+)(?:[\\?#]|$)/i);return e?e[1]:null})(t)){const e=await fetch(t),n=await e.text();o=r(n)}else o=((t,e)=>{const o=document.createElement("img");return o.setAttribute("src",t),o.setAttribute("alt",e),o})(t,e);return o.style.setProperty("max-width","100%"),o.style.setProperty("max-height","100%"),o}catch{return null}}},19624:(t,e,o)=>{o.d(e,{J:()=>m,T:()=>l});var n=o(63200),r=o(25964),i=o(88961),a=o(98538),s=o(10767);const l=(0,r.xE)("button"),{host:d,label:c,slottedIcon:p}={host:{selector:()=>":host"},label:{selector:"::part(label)"},slottedIcon:{selector:()=>"::slotted(descope-icon)"}};let h;const m=(0,n.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:a.S.cssVarList.fill},labelTextDecoration:{...c,property:"text-decoration"},labelSpacing:{...c,property:"gap"},textAlign:{...c,property:"justify-content",fallback:"center"},iconSize:[{...p,property:"width"},{...p,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${h}\n\t\t\tvaadin-button::part(label) { pointer-events: none; }\n\t\t\t:host {\n\t\t\t\tpadding: calc(var(${m.cssVarList.outlineWidth}) + var(${m.cssVarList.outlineOffset}));\n\t\t\t}\n :host([full-width="true"]) {\n width: var(${m.cssVarList.hostWidth});\n }\n\t\t\tvaadin-button {\n\t\t\t\theight: calc(var(${m.cssVarList.hostHeight}) - var(${m.cssVarList.outlineWidth}) - var(${m.cssVarList.outlineOffset}));\n\t\t\t}\n\t\t\t[square="true"]:not([full-width="true"]) {\n\t\t\t\twidth: calc(var(${m.cssVarList.hostWidth}) - var(${m.cssVarList.outlineWidth}) - var(${m.cssVarList.outlineOffset}));\n padding: 0;\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex","class"],componentName:l})),{color:u,fontSize:b}=m.cssVarList;h=`\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(${u});\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`},24542:(t,e,o)=>{o.r(e),o.d(e,{ListItemClass:()=>n.O,componentName:()=>n.T});var n=o(93895);customElements.define(n.T,n.O)},30576:(t,e,o)=>{o.r(e),o.d(e,{ButtonClass:()=>n.J,componentName:()=>n.T});var n=o(19624);o(83799),customElements.define(n.T,n.J)},44666:(t,e,o)=>{o.d(e,{E:()=>h,T:()=>s});var n=o(88961),r=o(72270),i=o(63200),a=o(25964);const s=(0,a.xE)("avatar");class l extends((0,r.qu)({componentName:s,baseSelector:":host > .wrapper"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <div class="wrapper">\n <vaadin-avatar></vaadin-avatar>\n <div class="editableBadge">\n <vaadin-icon icon="vaadin:pencil"></vaadin-icon>\n </div>\n </div>\n\t\t',(0,a.fz)("\n :host {\n\t\t\t\t\tdisplay: inline-flex;\n\t\t\t\t}\n\n .editableBadge {\n border: 1px solid;\n border-radius: 100%;\n height: fit-content;\n width: 25%;\n height: 25%;\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 5%;\n box-sizing: border-box;\n position: absolute;\n bottom: 0;\n inset-inline-end: 0;\n }\n\n vaadin-icon {\n color: currentcolor;\n }\n\n vaadin-avatar {\n width: 100%;\n height: 100%;\n margin: 0;\n border: none\n }\n\n .wrapper {\n display: inline-flex;\n position: relative;\n width: 100%;\n height: 100%;\n }\n ",this),this.avatarComponent=this.shadowRoot.querySelector("vaadin-avatar"),(0,a.EA)(this,this.avatarComponent,{includeAttrs:["display-name","img","abbr"],mapAttrs:{"display-name":"name"}});const t=this.shadowRoot.querySelector(".editableBadge");(0,a.mx)(this,(()=>{t.style.display=this.isEditable?"":"none"}),{includeAttrs:["editable"]})}get isEditable(){return"true"===this.getAttribute("editable")}}const{host:d,editableBadge:c,avatar:p}={host:{selector:()=>":host"},editableBadge:{selector:"> .editableBadge"},avatar:{selector:"vaadin-avatar"}},h=(0,i.Zz)((0,n.RF)({mappings:{hostWidth:[{...d,property:"width"},{...d,property:"min-width"}],hostHeight:{...d,property:"height"},cursor:[p,d],hostDirection:{...d,property:"direction"},avatarTextColor:{...p,property:"color"},avatarBackgroundColor:{...p,property:"background-color"},editableIconColor:{...c,property:"color"},editableBorderColor:{...c,property:"border-color"},editableBackgroundColor:{...c,property:"background-color"}}}),n.VO,n.tQ)(l)},45400:(t,e,o)=>{o.r(e),o.d(e,{ListClass:()=>n.x,componentName:()=>n.T}),o(24542);var n=o(7720);customElements.define(n.T,n.x)},58204:(t,e,o)=>{o.r(e),o.d(e,{OutboundAppsClass:()=>b,componentName:()=>p}),o(45400),o(24542),o(63595),o(64309),o(30576);var n=o(63200),r=o(25964),i=o(88961),a=o(72270),s=o(98538),l=o(66434),d=(o(44666),o(7720)),c=o(93895);const p=(0,r.xE)("outbound-apps"),h=({name:t,description:e,logo:o,appId:n,isConnected:i},a,s)=>{const l=i?"disconnect":"connect";return`\n <descope-list-item>\n <descope-avatar\n ${o?`img="${o}"`:""}\n ${t?`display-name="${t}" abbr=${(0,r.ie)(t)}`:""}\n size=${s.size}\n ${o?'st-avatar-background-color="none"':""}\n class="app-logo"\n ></descope-avatar>\n\n <div class="content">\n <descope-text\n class="app-title"\n variant="subtitle1"\n mode="primary"\n >${t}</descope-text>\n ${e?`\n <descope-text\n class="app-description"\n variant="body2"\n mode="primary"\n >${e}</descope-text>\n `:""}\n </div>\n <div class="controls">\n <descope-button variant="link" mode="primary" size=${s.size} data-action="${l}" data-outbound-app-id="${n}" data-id="${l}">\n ${i?s.disconnectButtonLabel:s.connectButtonLabel}\n </descope-button>\n </div>\n </descope-list-item>\n`},m=(0,a.qu)({componentName:p,baseSelector:"descope-list"}),{host:u}={host:{selector:()=>":host"}},b=(0,n.Zz)((0,i.RF)({mappings:{hostWidth:{...u,property:"width"},minHeight:{selector:()=>":host"},hostDirection:[{...u,property:"direction"},{selector:"descope-list",property:"direction"},{selector:"descope-list-item",property:"direction"}],iconColor:{selector:()=>" descope-icon",property:s.S.cssVarList.fill},errorIconColor:{selector:()=>" descope-icon.error-icon",property:s.S.cssVarList.fill},fontSize:{selector:l.s.componentName,property:l.s.cssVarList.fontSize},appLogoGap:{selector:()=>" .app-logo",property:"margin-inline-end"},contentGap:{selector:()=>" .content",property:"gap"},itemsTextAlign:{selector:l.s.componentName,property:l.s.cssVarList.textAlign},itemCursor:{selector:c.O.componentName,property:c.O.cssVarList.cursor},itemOutline:{selector:c.O.componentName,property:c.O.cssVarList.outline},itemBorderColor:{selector:c.O.componentName,property:c.O.cssVarList.borderColor},itemBackgroundColor:{selector:c.O.componentName,property:c.O.cssVarList.backgroundColor},listBorderWidth:{selector:()=>d.x.componentName,property:d.x.cssVarList.borderWidth},listBoxShadow:{selector:()=>d.x.componentName,property:d.x.cssVarList.boxShadow},listPadding:[{selector:()=>d.x.componentName,property:d.x.cssVarList.verticalPadding},{selector:()=>d.x.componentName,property:d.x.cssVarList.horizontalPadding}]}}),i.VO,(0,i.t$)({itemRenderer:h,rerenderAttrsList:["size","connect-button-label","disconnect-button-label"]}),i.tQ)(class extends m{constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <descope-list>\n <slot name="empty-state" slot="empty-state"></slot>\n </descope-list>\n ',this.appsList=this.shadowRoot.querySelector("descope-list"),(0,r.fz)("\n :host {\n width: 100%;\n }\n .controls {\n display: flex;\n min-width: 8em;\n justify-content: end;\n }\n .content {\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n }\n .app-title,\n .app-description {\n display: flex;\n direction: inherit;\n }\n descope-list {\n display: block;\n }\n ",this)}init(){super.init?.(),this.appsList.itemRenderer=h,this.appsList.addEventListener("click",this.onAppsListClick.bind(this))}get readonly(){return"true"===this.getAttribute("readonly")}onAppsListClick(t){if(!this.readonly){const e=t.srcElement.getAttribute("data-outbound-app-id"),o=t.srcElement.getAttribute("data-action");e&&o&&this.dispatchEvent(new CustomEvent(`${o}-clicked`,{bubbles:!0,detail:{id:e,action:o}}))}}get size(){return this.getAttribute("size")||"sm"}get connectButtonLabel(){return this.getAttribute("connect-button-label")||"Connect"}get disconnectButtonLabel(){return this.getAttribute("disconnect-button-label")||"Disconnect"}});customElements.define(p,b)},63595:(t,e,o)=>{o.r(e),o.d(e,{TextClass:()=>n.s,componentName:()=>n.T});var n=o(66434);customElements.define(n.T,n.s)},64309:(t,e,o)=>{o.r(e),o.d(e,{AvatarClass:()=>n.E,componentName:()=>n.T});var n=o(44666);o(4408),o(95260),o(37182),customElements.define(n.T,n.E)},66434:(t,e,o)=>{o.d(e,{T:()=>s,s:()=>c});var n=o(88961),r=o(63200),i=o(25964),a=o(72270);const s=(0,i.xE)("text");class l extends((0,a.qu)({componentName:s,baseSelector:":host > slot"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n <slot part="text-wrapper"></slot>\n ',(0,i.fz)("\n :host {\n display: inline-block;\n line-height: 1em;\n }\n :host > slot {\n width: 100%;\n display: inline-block;\n }\n ",this)}get hideWhenEmpty(){return"true"===this.getAttribute("hide-when-empty")}init(){super.init(),(0,i.Ge)(this,(()=>{const t=!!this.childNodes.length;this.style.display=!t&&this.hideWhenEmpty?"none":""}))}}const{host:d}={host:{selector:()=>":host"}},c=(0,r.Zz)((0,n.RF)({mappings:{hostWidth:{...d,property:"width"},hostDirection:{...d,property:"direction"},fontSize:{},textColor:[{property:"color"}],textLineHeight:{property:"line-height"},textLetterSpacing:{property:"letter-spacing"},textShadow:{},textAlign:{},textTransform:{},fontFamily:{},fontStyle:{},fontWeight:{},borderWidth:{},borderStyle:{},borderColor:{}}}),n.VO,n.tQ)(l)},83799:(t,e,o)=>{o(93555),o(89389)},89389:(t,e,o)=>{o.d(e,{$:()=>u});var n=o(13256),r=o(55774),i=o(82901),a=o(90676),s=o(81488),l=o(87550);const d=o(51450).AH`
3
3
  :host {
4
4
  display: inline-block;
5
5
  position: relative;