@descope/web-components-ui 1.0.283 → 1.0.284

package/dist/umd/7044.js

@@ -1 +1 @@
-"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[7044],{7044:(e,t,r)=>{r.d(t,{C:()=>a});var s=r(322);class a extends s.n{get sortable(){return"true"===this.getAttribute("sortable")}_defaultRenderer(e,t,r){const s=r.item[this.path]||"";e.innerHTML=s,e.title=s,Array.isArray(s)&&(e.innerHTML=s.join(", "))}_defaultHeaderRenderer(e,t){this.sortable?super._defaultHeaderRenderer(e,t):e.innerHTML=this.__getHeader(this.header,this.path)}}}}]);
+"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[7044],{7044:(e,t,s)=>{s.d(t,{C:()=>a});var r=s(322);class a extends r.n{get sortable(){return"true"===this.getAttribute("sortable")}_defaultRenderer(e,t,s){const r=s.item[this.path]||"",a=Array.isArray(r)?r.join(", "):r;this.__setTextContent(e,a),e.title=a}_defaultHeaderRenderer(e,t){this.sortable?super._defaultHeaderRenderer(e,t):this.__setTextContent(e,this.__getHeader(this.header,this.path))}}}}]);

package/dist/umd/descope-grid-descope-grid-custom-column-index-js.js

@@ -1 +1 @@
-"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[5988],{9278:(e,t,n)=>{n.r(t),n.d(t,{componentName:()=>c});var s=n(4567),r=n(7044);class i extends r.C{_defaultRenderer(e,t,n){const s=n.item[this.path]||"",r=Array.from(this.children).find((e=>{const t=e.getAttribute("data-pattern");return!t||new RegExp(t).test(s)}));if(!r)return void(e.innerHTML=n.item[this.path]||"");const i=r.cloneNode(!0);i.innerHTML=s||"",e.innerHTML="",e.append(i)}}const c=(0,s.iY)("grid-custom-column");customElements.define(c,i)}}]);
+"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[5988],{9278:(e,t,n)=>{n.r(t),n.d(t,{componentName:()=>c});var s=n(4567),o=n(7044);class r extends o.C{_defaultRenderer(e,t,n){const s=n.item[this.path]||"",o=Array.from(this.children).find((e=>{const t=e.getAttribute("data-pattern");return!t||new RegExp(t).test(s)}));if(!o)return void this.__setTextContent(e,n.item[this.path]||"");const r=o.cloneNode(!0);r.textContent=s||"",e.innerHTML="",e.append(r)}}const c=(0,s.iY)("grid-custom-column");customElements.define(c,r)}}]);

package/dist/umd/descope-grid-index-js.js

@@ -1 +1 @@
-"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[9461,769,3726,5988,7487,3705,3878,4803,7044],{3878:(e,t,r)=>{r.d(t,{P:()=>s});var n=r(2061),o=r(1e3),i=r(2561);const s=(...e)=>(0,n.qC)(o.wX,o.li,o.QT,o.mE)((0,i.s)(...e))},818:(e,t,r)=>{r.d(t,{h:()=>i});var n=r(4567),o=r(1250);const i=e=>class extends e{init(){super.init?.();const e=document.createElement("template");e.innerHTML=`\n\t\t\t\t<${o.f}\n\t\t\t\t\ttabindex="-1"\n\t\t\t\t\tslot="input"\n\t\t\t\t></${o.f}>\n\t\t\t`,this.baseElement.appendChild(e.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(o.f),this.checkbox=this.inputElement.querySelector("vaadin-checkbox"),(0,n.oP)(this,this.inputElement,{includeAttrs:["required","full-width","size","label","invalid","disabled","readonly"]}),(0,n.Db)(this.inputElement,this,["checked"]),(0,n.tg)(this,this.inputElement,{includeAttrs:["checked"]})}}},6882:(e,t,r)=>{r.d(t,{Z:()=>n});const n=`\n:host {\n\tdisplay: inline-flex;\n}\n\n${(0,r(4201).DY)()}\n\n.wrapper {\n\tdisplay: flex;\n\tbox-sizing: border-box;\n}\nvaadin-text-field {\n\tposition: relative;\n\tpadding: 0;\n\tdisplay: inline-flex;\n\talign-items: flex-start;\n}\nvaadin-text-field::before {\n\theight: 0;\n\tmargin: 0;\n}\nvaadin-text-field::part(label) {\n  position: absolute;\n  top: 0;\n}\nvaadin-text-field::part(input-field) {\n\tpadding: 0;\n\tbackground: none;\n\tmin-height: 0;\n}\nvaadin-text-field::part(input-field)::after {\n  background: none;\n}\nvaadin-text-field[focus-ring]::part(input-field) {\n\tbox-shadow: none;\n}\n\nvaadin-checkbox [slot="label"] {\n  align-self: flex-start;\n  padding: 0;\n}\n[required] vaadin-checkbox [slot="label"]:not(:empty) {\n\tpadding-inline-end: 1em;\n}\ndescope-boolean-field-internal {\n  -webkit-mask-image: none;\n  min-height: initial;\n}\n`},1250:(e,t,r)=>{r.d(t,{Z:()=>l,f:()=>i});var n=r(3878),o=r(4567);const i=(0,o.iY)("boolean-field-internal"),s=["disabled","label","invalid","readonly"],a=(0,n.P)({componentName:i,baseSelector:"div"}),l=class extends a{static get observedAttributes(){return["readonly"]}constructor(){super(),this.innerHTML='\n\t\t\t<div class="wrapper">\n\t\t\t\t<vaadin-checkbox></vaadin-checkbox>\n\t\t\t</div>\n\t\t',this.wrapperEle=this.querySelector("div"),this.checkbox=this.querySelector("vaadin-checkbox")}get value(){return this.checkbox?.checked}set value(e){this.checkbox.checked=e}get checked(){return this.value}set checked(e){this.value=e}init(){this.addEventListener("focus",(e=>{e.isTrusted&&this.checkbox.focus()})),super.init?.(),(0,o.oP)(this,this.checkbox,{includeAttrs:s}),(0,o.tg)(this,this.checkbox,{includeAttrs:["checked"]}),this.handleFocusEventsDispatching([this.checkbox])}attributeChangedCallback(e,t,r){super.attributeChangedCallback?.(e,t,r),"readonly"===e&&this.onReadOnlyChange(null!==r)}onReadOnlyChange(e){this.baseElement.setAttribute("inert",e)}getValidity(){return this.isRequired&&!this.value?{valueMissing:!0}:{}}}},6676:(e,t,r)=>{r.r(t);var n=r(1250);customElements.define(n.f,n.Z)},3483:(e,t,r)=>{r.r(t),r.d(t,{CheckboxClass:()=>f});var n=r(4567),o=r(2061),i=r(1e3),s=r(818),a=r(6882),l=r(4201);const d=(0,n.iY)("checkbox"),{host:c,component:h,checkboxElement:p,checkboxSurface:u,checkboxLabel:m,requiredIndicator:b,helperText:g,errorMessage:y}={host:{selector:()=>":host"},requiredIndicator:{selector:'[required] vaadin-checkbox [slot="label"]:not(:empty)::after'},component:{selector:"vaadin-checkbox"},checkboxElement:{selector:"vaadin-checkbox::part(checkbox)"},checkboxSurface:{selector:"vaadin-checkbox::part(checkbox)::after"},checkboxLabel:{selector:'vaadin-checkbox [slot="label"]:not(:empty)'},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},f=(0,o.qC)((0,i.yk)({mappings:{hostWidth:{...c,property:"width"},hostDirection:{...c,property:"direction"},fontSize:[c,p,m],fontFamily:[m,g,y],labelTextColor:{...m,property:"color"},labelSpacing:{...m,property:"padding-inline-start"},labelLineHeight:{...m,property:"line-height"},labelFontWeight:{...m,property:"font-weight"},labelRequiredIndicator:{...b,property:"content"},errorMessageTextColor:{...y,property:"color"},inputValueTextColor:{...u,property:"color"},inputBackgroundColor:{...p,property:"background-color"},inputBorderRadius:{...p,property:"border-radius"},inputBorderWidth:{...p,property:"border-width"},inputBorderOffset:{...p,property:"border-offset"},inputBorderColor:{...p,property:"border-color"},inputBorderStyle:{...p,property:"border-style"},inputOutlineWidth:{...p,property:"outline-width"},inputOutlineOffset:{...p,property:"outline-offset"},inputOutlineColor:{...p,property:"outline-color"},inputOutlineStyle:{...p,property:"outline-style"},inputSize:[{...p,property:"width"},{...p,property:"height"},{...u,property:"font-size"},{...h,property:"font-size"}]}}),i.e4,(0,i.dj)({proxyProps:["value","selectionStart"]}),i.Ae,s.h)((0,i.DM)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t\t${a.Z}\n      ${(0,l.bi)(f.cssVarList)}\n\n      :host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t\tmax-width: 100%;\n      }\n\n      :host ::part(error-message) {\n        direction: ltr;\n      }\n\n      vaadin-text-field {\n        width: 100%;\n      }\n\n      descope-boolean-field-internal {\n\t\t\t\tpadding: 0;\n\t\t\t\twidth: 100%;\n        height: 100%;\n      }\n\n      vaadin-checkbox::part(checkbox) {\n        margin: 0;\n      }\n\n      vaadin-checkbox::part(checkbox)::after {\n        top: 0;\n        left: 0;\n      }\n\n      vaadin-text-field::part(input-field)::after {\n        content: none;\n      }\n    `,excludeAttrsSync:["label","tabindex"],componentName:d}));r(3092),r(9789),r(6676),customElements.define(d,f)},9278:(e,t,r)=>{r.r(t),r.d(t,{componentName:()=>s});var n=r(4567),o=r(7044);class i extends o.C{_defaultRenderer(e,t,r){const n=r.item[this.path]||"",o=Array.from(this.children).find((e=>{const t=e.getAttribute("data-pattern");return!t||new RegExp(t).test(n)}));if(!o)return void(e.innerHTML=r.item[this.path]||"");const i=o.cloneNode(!0);i.innerHTML=n||"",e.innerHTML="",e.append(i)}}const s=(0,n.iY)("grid-custom-column");customElements.define(s,i)},2238:(e,t,r)=>{r.r(t),r.d(t,{componentName:()=>l}),r(3483);var n=r(4567),o=r(8623);const i=()=>{const e=document.createElement("descope-checkbox");return e.setAttribute("bordered","true"),e.setAttribute("size","xs"),e},s=e=>!!e.items?.length&&e.selectedItems.length===e.items.length;class a extends o.w{_onHeaderRendererOrBindingChanged(){}_headerRenderer(e){const t=e.parentNode;let r=e.querySelector("descope-checkbox");r||(r=i(),r.addEventListener("input",(()=>{const e=s(t);t.selectedItems=e?[]:t.items})),e.appendChild(r)),r.setAttribute("checked",s(t))}_defaultRenderer(e,t,r){const n=e.parentNode;let o=e.querySelector("descope-checkbox");o||(o=i(),e.appendChild(o)),o.onchange=()=>{o.checked?n.selectItem(r.item):n.deselectItem(r.item)},o.setAttribute("checked",r.selected)}}const l=(0,n.iY)("grid-selection-column");customElements.define(l,a)},7044:(e,t,r)=>{r.d(t,{C:()=>o});var n=r(322);class o extends n.n{get sortable(){return"true"===this.getAttribute("sortable")}_defaultRenderer(e,t,r){const n=r.item[this.path]||"";e.innerHTML=n,e.title=n,Array.isArray(n)&&(e.innerHTML=n.join(", "))}_defaultHeaderRenderer(e,t){this.sortable?super._defaultHeaderRenderer(e,t):e.innerHTML=this.__getHeader(this.header,this.path)}}},2356:(e,t,r)=>{r.r(t),r.d(t,{componentName:()=>i});var n=r(4567),o=r(7044);const i=(0,n.iY)("grid-text-column");customElements.define(i,o.C)},9950:(e,t,r)=>{r.r(t),r.d(t,{GridClass:()=>f}),r(4595),r(2356),r(9278),r(2238);var n=r(2061),o=r(4567),i=r(1e3);const s=e=>{const t=Array.isArray(e);return t||console.error("data must be an array, received:",e),t},a=(0,o.iY)("grid"),{host:l,headerRow:d,headerRowCell:c,contentRow:h,firstRow:p,sortIndicators:u,activeSortIndicator:m,selectedRow:b,rowSeparator:g,resizeHandle:y}={host:{selector:()=>"vaadin-grid"},headerRow:{selector:()=>"::part(header-cell)"},headerRowCell:{selector:()=>"vaadin-grid::part(header-cell)"},contentRow:{selector:()=>"::part(cell)"},firstRow:{selector:()=>"::part(first-header-row-cell)"},selectedRow:{selector:()=>"::part(selected-row-cell)"},sortIndicators:{selector:()=>"vaadin-grid-sorter::part(indicators)"},activeSortIndicator:{selector:()=>"vaadin-grid-sorter[direction]"},rowSeparator:{selector:()=>"vaadin-grid::part(body-cell)"},resizeHandle:{selector:()=>"::part(resize-handle)"}},f=(0,n.qC)((0,i.yk)({componentNameOverride:(0,o.iY)("input-wrapper")}),(0,i.yk)({mappings:{hostWidth:{selector:()=>":host",property:"width"},hostHeight:{selector:()=>":host",property:"height"},hostMinHeight:{selector:()=>":host",property:"min-height"},fontFamily:[{...d},{...h}],fontSize:[{...d},{...h}],fontWeight:{...h},valueTextColor:{...h,property:"color"},backgroundColor:[{...l,property:"background-color"},{...h,property:"background-color"}],sortIndicatorsColor:{...u,property:"color"},activeSortIndicator:{...m,property:"color"},borderColor:{...l,property:"border-color"},borderWidth:{...l,property:"border-width"},borderStyle:{...l,property:"border-style"},borderRadius:{...l,property:"border-radius"},selectedBackgroundColor:{...b,property:"background-color"},headerRowTextColor:{...c,property:"color"},separatorColor:[{...p,property:"border-bottom-color"},{...g,property:"border-top-color"}],resizeHandleColor:{...y,property:"background-color"}}}),i.e4,i.Ae,(e=>class extends e{#e;init(){super.init?.(),this.handleColumns(),this.forwardSelectedItemsChange(),this.baseElement._mapSorters=()=>{}}forwardSelectedItemsChange(){this.baseElement.addEventListener("selected-items-changed",(e=>{this.dispatchEvent(new CustomEvent("selected-items-changed",{bubbles:!0,composed:!0,detail:e.detail}))}))}attributeChangedCallback(e,t,r){super.attributeChangedCallback?.(e,t,r),"columns"===e&&this.setColumnsDataFromAttr()}handleColumns(){this.columnsAttr?this.setColumnsDataFromAttr():this.children.length&&this.setColumnsFromChildren()}setColumnsFromChildren(){this.#e=Array.from(this.children).map((e=>({path:e.getAttribute("path"),header:e.getAttribute("header"),type:e.localName.match("^descope-grid-(\\w+)-column$")?.[1]||"text",attrs:["frozen","resizable","auto-width","status"].reduce(((t,r)=>{const n=e.getAttribute(r);return n&&(t[r]=n),t}),{})})))}get columnsAttr(){return this.getAttribute("columns")}setColumnsDataFromAttr(){try{const e=JSON.parse(this.columnsAttr);s(e)&&(this.columns=e)}catch(e){console.error('could not parse data string from attribute "columns" -',e.message)}}#t=({path:e,header:t,type:r,attrs:n})=>{const o=`descope-grid-${r}-column`;return`<${o} header="${t}" path="${e}" ${Object.entries(n).map((([e,t])=>`${e}="${t}"`)).join(" ")}></${o}>`};get renderColumn(){return this.#t}set renderColumn(e){this.#t=e,this.renderColumns()}getColumnsTemplate(){return this.#e?.reduce?.(((e,t)=>e+(this.renderColumn?.(t||{})||"")),"")}renderColumns(){const e=this.getColumnsTemplate();e&&(this.innerHTML=e)}get grid(){return this.shadowRoot.querySelector("vaadin-grid")}get data(){return this.grid.items}set data(e){if(s(e)&&this.grid.items!==e&&(this.grid.items=e,this.grid.selectedItems)){const e=new Set(this.grid.items.map((e=>e[this.uniqueColumnId]??e))),t=this.grid.selectedItems.filter((t=>e.has(t[this.uniqueColumnId]??t)));this.grid.selectedItems.length!==t.length&&(this.grid.selectedItems=t)}}get columns(){return this.#e}set columns(e){this.#e=e,this.renderColumns()}get paths(){return this.columns.map((e=>e.path))}get uniqueColumnId(){return this.getAttribute("unique-column-id")}}))((0,i.DM)({delegatesFocus:!1,slots:[""],wrappedEleName:"vaadin-grid",style:()=>"\n      vaadin-grid {\n        overflow: hidden;\n        height: 100%;\n        min-height: 300px;\n      }\n      vaadin-grid-cell-content {\n        display: flex;\n      }\n      vaadin-grid::part(selected-row-cell) {\n        background-image: none;\n        box-shadow: none;\n      }\n\t\t",excludeAttrsSync:["columns","tabindex"],componentName:a}));customElements.define(a,f)}}]);
+"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[9461,769,3726,5988,7487,3705,3878,4803,7044],{3878:(e,t,r)=>{r.d(t,{P:()=>s});var n=r(2061),o=r(1e3),i=r(2561);const s=(...e)=>(0,n.qC)(o.wX,o.li,o.QT,o.mE)((0,i.s)(...e))},818:(e,t,r)=>{r.d(t,{h:()=>i});var n=r(4567),o=r(1250);const i=e=>class extends e{init(){super.init?.();const e=document.createElement("template");e.innerHTML=`\n\t\t\t\t<${o.f}\n\t\t\t\t\ttabindex="-1"\n\t\t\t\t\tslot="input"\n\t\t\t\t></${o.f}>\n\t\t\t`,this.baseElement.appendChild(e.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(o.f),this.checkbox=this.inputElement.querySelector("vaadin-checkbox"),(0,n.oP)(this,this.inputElement,{includeAttrs:["required","full-width","size","label","invalid","disabled","readonly"]}),(0,n.Db)(this.inputElement,this,["checked"]),(0,n.tg)(this,this.inputElement,{includeAttrs:["checked"]})}}},6882:(e,t,r)=>{r.d(t,{Z:()=>n});const n=`\n:host {\n\tdisplay: inline-flex;\n}\n\n${(0,r(4201).DY)()}\n\n.wrapper {\n\tdisplay: flex;\n\tbox-sizing: border-box;\n}\nvaadin-text-field {\n\tposition: relative;\n\tpadding: 0;\n\tdisplay: inline-flex;\n\talign-items: flex-start;\n}\nvaadin-text-field::before {\n\theight: 0;\n\tmargin: 0;\n}\nvaadin-text-field::part(label) {\n  position: absolute;\n  top: 0;\n}\nvaadin-text-field::part(input-field) {\n\tpadding: 0;\n\tbackground: none;\n\tmin-height: 0;\n}\nvaadin-text-field::part(input-field)::after {\n  background: none;\n}\nvaadin-text-field[focus-ring]::part(input-field) {\n\tbox-shadow: none;\n}\n\nvaadin-checkbox [slot="label"] {\n  align-self: flex-start;\n  padding: 0;\n}\n[required] vaadin-checkbox [slot="label"]:not(:empty) {\n\tpadding-inline-end: 1em;\n}\ndescope-boolean-field-internal {\n  -webkit-mask-image: none;\n  min-height: initial;\n}\n`},1250:(e,t,r)=>{r.d(t,{Z:()=>l,f:()=>i});var n=r(3878),o=r(4567);const i=(0,o.iY)("boolean-field-internal"),s=["disabled","label","invalid","readonly"],a=(0,n.P)({componentName:i,baseSelector:"div"}),l=class extends a{static get observedAttributes(){return["readonly"]}constructor(){super(),this.innerHTML='\n\t\t\t<div class="wrapper">\n\t\t\t\t<vaadin-checkbox></vaadin-checkbox>\n\t\t\t</div>\n\t\t',this.wrapperEle=this.querySelector("div"),this.checkbox=this.querySelector("vaadin-checkbox")}get value(){return this.checkbox?.checked}set value(e){this.checkbox.checked=e}get checked(){return this.value}set checked(e){this.value=e}init(){this.addEventListener("focus",(e=>{e.isTrusted&&this.checkbox.focus()})),super.init?.(),(0,o.oP)(this,this.checkbox,{includeAttrs:s}),(0,o.tg)(this,this.checkbox,{includeAttrs:["checked"]}),this.handleFocusEventsDispatching([this.checkbox])}attributeChangedCallback(e,t,r){super.attributeChangedCallback?.(e,t,r),"readonly"===e&&this.onReadOnlyChange(null!==r)}onReadOnlyChange(e){this.baseElement.setAttribute("inert",e)}getValidity(){return this.isRequired&&!this.value?{valueMissing:!0}:{}}}},6676:(e,t,r)=>{r.r(t);var n=r(1250);customElements.define(n.f,n.Z)},3483:(e,t,r)=>{r.r(t),r.d(t,{CheckboxClass:()=>x});var n=r(4567),o=r(2061),i=r(1e3),s=r(818),a=r(6882),l=r(4201);const d=(0,n.iY)("checkbox"),{host:c,component:h,checkboxElement:p,checkboxSurface:u,checkboxLabel:m,requiredIndicator:b,helperText:g,errorMessage:y}={host:{selector:()=>":host"},requiredIndicator:{selector:'[required] vaadin-checkbox [slot="label"]:not(:empty)::after'},component:{selector:"vaadin-checkbox"},checkboxElement:{selector:"vaadin-checkbox::part(checkbox)"},checkboxSurface:{selector:"vaadin-checkbox::part(checkbox)::after"},checkboxLabel:{selector:'vaadin-checkbox [slot="label"]:not(:empty)'},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},x=(0,o.qC)((0,i.yk)({mappings:{hostWidth:{...c,property:"width"},hostDirection:{...c,property:"direction"},fontSize:[c,p,m],fontFamily:[m,g,y],labelTextColor:{...m,property:"color"},labelSpacing:{...m,property:"padding-inline-start"},labelLineHeight:{...m,property:"line-height"},labelFontWeight:{...m,property:"font-weight"},labelRequiredIndicator:{...b,property:"content"},errorMessageTextColor:{...y,property:"color"},inputValueTextColor:{...u,property:"color"},inputBackgroundColor:{...p,property:"background-color"},inputBorderRadius:{...p,property:"border-radius"},inputBorderWidth:{...p,property:"border-width"},inputBorderOffset:{...p,property:"border-offset"},inputBorderColor:{...p,property:"border-color"},inputBorderStyle:{...p,property:"border-style"},inputOutlineWidth:{...p,property:"outline-width"},inputOutlineOffset:{...p,property:"outline-offset"},inputOutlineColor:{...p,property:"outline-color"},inputOutlineStyle:{...p,property:"outline-style"},inputSize:[{...p,property:"width"},{...p,property:"height"},{...u,property:"font-size"},{...h,property:"font-size"}]}}),i.e4,(0,i.dj)({proxyProps:["value","selectionStart"]}),i.Ae,s.h)((0,i.DM)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t\t${a.Z}\n      ${(0,l.bi)(x.cssVarList)}\n\n      :host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t\tmax-width: 100%;\n      }\n\n      :host ::part(error-message) {\n        direction: ltr;\n      }\n\n      vaadin-text-field {\n        width: 100%;\n      }\n\n      descope-boolean-field-internal {\n\t\t\t\tpadding: 0;\n\t\t\t\twidth: 100%;\n        height: 100%;\n      }\n\n      vaadin-checkbox::part(checkbox) {\n        margin: 0;\n      }\n\n      vaadin-checkbox::part(checkbox)::after {\n        top: 0;\n        left: 0;\n      }\n\n      vaadin-text-field::part(input-field)::after {\n        content: none;\n      }\n    `,excludeAttrsSync:["label","tabindex"],componentName:d}));r(3092),r(9789),r(6676),customElements.define(d,x)},9278:(e,t,r)=>{r.r(t),r.d(t,{componentName:()=>s});var n=r(4567),o=r(7044);class i extends o.C{_defaultRenderer(e,t,r){const n=r.item[this.path]||"",o=Array.from(this.children).find((e=>{const t=e.getAttribute("data-pattern");return!t||new RegExp(t).test(n)}));if(!o)return void this.__setTextContent(e,r.item[this.path]||"");const i=o.cloneNode(!0);i.textContent=n||"",e.innerHTML="",e.append(i)}}const s=(0,n.iY)("grid-custom-column");customElements.define(s,i)},2238:(e,t,r)=>{r.r(t),r.d(t,{componentName:()=>l}),r(3483);var n=r(4567),o=r(8623);const i=()=>{const e=document.createElement("descope-checkbox");return e.setAttribute("bordered","true"),e.setAttribute("size","xs"),e},s=e=>!!e.items?.length&&e.selectedItems.length===e.items.length;class a extends o.w{_onHeaderRendererOrBindingChanged(){}_headerRenderer(e){const t=e.parentNode;let r=e.querySelector("descope-checkbox");r||(r=i(),r.addEventListener("input",(()=>{const e=s(t);t.selectedItems=e?[]:t.items})),e.appendChild(r)),r.setAttribute("checked",s(t))}_defaultRenderer(e,t,r){const n=e.parentNode;let o=e.querySelector("descope-checkbox");o||(o=i(),e.appendChild(o)),o.onchange=()=>{o.checked?n.selectItem(r.item):n.deselectItem(r.item)},o.setAttribute("checked",r.selected)}}const l=(0,n.iY)("grid-selection-column");customElements.define(l,a)},7044:(e,t,r)=>{r.d(t,{C:()=>o});var n=r(322);class o extends n.n{get sortable(){return"true"===this.getAttribute("sortable")}_defaultRenderer(e,t,r){const n=r.item[this.path]||"",o=Array.isArray(n)?n.join(", "):n;this.__setTextContent(e,o),e.title=o}_defaultHeaderRenderer(e,t){this.sortable?super._defaultHeaderRenderer(e,t):this.__setTextContent(e,this.__getHeader(this.header,this.path))}}},2356:(e,t,r)=>{r.r(t),r.d(t,{componentName:()=>i});var n=r(4567),o=r(7044);const i=(0,n.iY)("grid-text-column");customElements.define(i,o.C)},9950:(e,t,r)=>{r.r(t),r.d(t,{GridClass:()=>x}),r(4595),r(2356),r(9278),r(2238);var n=r(2061),o=r(4567),i=r(1e3);const s=e=>{const t=Array.isArray(e);return t||console.error("data must be an array, received:",e),t},a=(0,o.iY)("grid"),{host:l,headerRow:d,headerRowCell:c,contentRow:h,firstRow:p,sortIndicators:u,activeSortIndicator:m,selectedRow:b,rowSeparator:g,resizeHandle:y}={host:{selector:()=>"vaadin-grid"},headerRow:{selector:()=>"::part(header-cell)"},headerRowCell:{selector:()=>"vaadin-grid::part(header-cell)"},contentRow:{selector:()=>"::part(cell)"},firstRow:{selector:()=>"::part(first-header-row-cell)"},selectedRow:{selector:()=>"::part(selected-row-cell)"},sortIndicators:{selector:()=>"vaadin-grid-sorter::part(indicators)"},activeSortIndicator:{selector:()=>"vaadin-grid-sorter[direction]"},rowSeparator:{selector:()=>"vaadin-grid::part(body-cell)"},resizeHandle:{selector:()=>"::part(resize-handle)"}},x=(0,n.qC)((0,i.yk)({componentNameOverride:(0,o.iY)("input-wrapper")}),(0,i.yk)({mappings:{hostWidth:{selector:()=>":host",property:"width"},hostHeight:{selector:()=>":host",property:"height"},hostMinHeight:{selector:()=>":host",property:"min-height"},fontFamily:[{...d},{...h}],fontSize:[{...d},{...h}],fontWeight:{...h},valueTextColor:{...h,property:"color"},backgroundColor:[{...l,property:"background-color"},{...h,property:"background-color"}],sortIndicatorsColor:{...u,property:"color"},activeSortIndicator:{...m,property:"color"},borderColor:{...l,property:"border-color"},borderWidth:{...l,property:"border-width"},borderStyle:{...l,property:"border-style"},borderRadius:{...l,property:"border-radius"},selectedBackgroundColor:{...b,property:"background-color"},headerRowTextColor:{...c,property:"color"},separatorColor:[{...p,property:"border-bottom-color"},{...g,property:"border-top-color"}],resizeHandleColor:{...y,property:"background-color"}}}),i.e4,i.Ae,(e=>class extends e{#e;init(){super.init?.(),this.handleColumns(),this.forwardSelectedItemsChange(),this.baseElement._mapSorters=()=>{}}forwardSelectedItemsChange(){this.baseElement.addEventListener("selected-items-changed",(e=>{this.dispatchEvent(new CustomEvent("selected-items-changed",{bubbles:!0,composed:!0,detail:e.detail}))}))}attributeChangedCallback(e,t,r){super.attributeChangedCallback?.(e,t,r),"columns"===e&&this.setColumnsDataFromAttr()}handleColumns(){this.columnsAttr?this.setColumnsDataFromAttr():this.children.length&&this.setColumnsFromChildren()}setColumnsFromChildren(){this.#e=Array.from(this.children).map((e=>({path:e.getAttribute("path"),header:e.getAttribute("header"),type:e.localName.match("^descope-grid-(\\w+)-column$")?.[1]||"text",attrs:["frozen","resizable","auto-width","status"].reduce(((t,r)=>{const n=e.getAttribute(r);return n&&(t[r]=n),t}),{})})))}get columnsAttr(){return this.getAttribute("columns")}setColumnsDataFromAttr(){try{const e=JSON.parse(this.columnsAttr);s(e)&&(this.columns=e)}catch(e){console.error('could not parse data string from attribute "columns" -',e.message)}}#t=({path:e,header:t,type:r,attrs:n})=>{const o=`descope-grid-${r}-column`;return`<${o} header="${t}" path="${e}" ${Object.entries(n).map((([e,t])=>`${e}="${t}"`)).join(" ")}></${o}>`};get renderColumn(){return this.#t}set renderColumn(e){this.#t=e,this.renderColumns()}getColumnsTemplate(){return this.#e?.reduce?.(((e,t)=>e+(this.renderColumn?.(t||{})||"")),"")}renderColumns(){const e=this.getColumnsTemplate();e&&(this.innerHTML=e)}get grid(){return this.shadowRoot.querySelector("vaadin-grid")}get data(){return this.grid.items}set data(e){if(s(e)&&this.grid.items!==e&&(this.grid.items=e,this.grid.selectedItems)){const e=new Set(this.grid.items.map((e=>e[this.uniqueColumnId]??e))),t=this.grid.selectedItems.filter((t=>e.has(t[this.uniqueColumnId]??t)));this.grid.selectedItems.length!==t.length&&(this.grid.selectedItems=t)}}get columns(){return this.#e}set columns(e){this.#e=e,this.renderColumns()}get paths(){return this.columns.map((e=>e.path))}get uniqueColumnId(){return this.getAttribute("unique-column-id")}}))((0,i.DM)({delegatesFocus:!1,slots:[""],wrappedEleName:"vaadin-grid",style:()=>"\n      vaadin-grid {\n        overflow: hidden;\n        height: 100%;\n        min-height: 300px;\n      }\n      vaadin-grid-cell-content {\n        display: flex;\n      }\n      vaadin-grid::part(selected-row-cell) {\n        background-image: none;\n        box-shadow: none;\n      }\n\t\t",excludeAttrsSync:["columns","tabindex"],componentName:a}));customElements.define(a,x)}}]);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@descope/web-components-ui",
-  "version": "1.0.283",
+  "version": "1.0.284",
   "description": "",
   "main": "dist/cjs/index.cjs.js",
   "module": "dist/index.esm.js",

package/src/components/descope-grid/descope-grid-custom-column/GridCustomColumnClass.js

@@ -18,13 +18,13 @@ export class GridCustomColumnClass extends GridTextColumnClass {
     });
 
     if (!contentEle) {
-      cell.innerHTML = model.item[this.path] || '';
+      this.__setTextContent(cell, model.item[this.path] || '');
 
       return;
     }
 
     const newEle = contentEle.cloneNode(true);
-    newEle.innerHTML = content || '';
+    newEle.textContent = content || '';
     cell.innerHTML = '';
     cell.append(newEle);
   }

package/src/components/descope-grid/descope-grid-text-column/GridTextColumnClass.js

@@ -7,12 +7,11 @@ export class GridTextColumnClass extends GridSortColumn {
   }
 
   _defaultRenderer(cell, _col, model) {
-    const content = model.item[this.path] || '';
-    cell.innerHTML = content;
+    const data = model.item[this.path] || '';
+    const content = Array.isArray(data) ? data.join(', ') : data;
+
+    this.__setTextContent(cell, content);
     cell.title = content;
-    if (Array.isArray(content)) {
-      cell.innerHTML = content.join(', ');
-    }
   }
 
   _defaultHeaderRenderer(root, _column) {
@@ -22,7 +21,6 @@ export class GridTextColumnClass extends GridSortColumn {
       return;
     }
 
-    // eslint-disable-next-line no-param-reassign
-    root.innerHTML = this.__getHeader(this.header, this.path);
+    this.__setTextContent(root, this.__getHeader(this.header, this.path));
   }
 }