@govtechsg/sgds-web-component 3.24.1-rc.2 → 3.24.1-rc.3

package/index.umd.min.js

@@ -2100,7 +2100,15 @@ const tn="important",sn=" !"+tn;const an=qe(class extends Ye{constructor(e){if(s
 
         ${this.separator?ee`<sgds-divider></sgds-divider>`:ie}
       </div>
-    `}}Pr.styles=[...Be.styles,zr],Pr.dependencies={"sgds-icon":_t,"sgds-divider":ho},e([Ve({type:String,reflect:!0})],Pr.prototype,"title",void 0),e([Ve({type:Boolean,reflect:!0})],Pr.prototype,"collapsed",void 0),e([Ve({type:Boolean,reflect:!0})],Pr.prototype,"collapsible",void 0),e([Ve({type:Boolean,reflect:!0})],Pr.prototype,"separator",void 0),customElements.define("sgds-sidebar",Zr),customElements.define("sgds-sidebar-item",Vr),customElements.define("sgds-sidebar-section",Pr),customElements.define("sgds-sidebar-group",Mr);var Lr=n`:host{display:contents}:host([layout=fixed]) .table{table-layout:fixed}.table{border-collapse:collapse;display:table;table-layout:auto;width:100%}.data-table{border:var(--sgds-border-width-1) solid;border-color:var(--sgds-border-color-muted);border-radius:var(--sgds-border-radius-md);display:flex;flex-direction:column;min-height:var(--sgds-dimension-56)}.footer{justify-content:space-between;padding:var(--sgds-padding-sm) var(--sgds-padding-lg)}.footer,.loading{align-items:center;display:flex}.loading{border-top:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);justify-content:center;min-height:var(--sgds-dimension-128);padding:var(--sgds-padding-sm) var(--sgds-padding-md)}.loading .loading-menu{gap:var(--sgds-gap-xs);pointer-events:none}.loading .loading-menu,.no-data{align-items:center;color:var(--sgds-text-color-subtle);display:flex}.no-data{border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);justify-content:center;min-height:var(--sgds-dimension-128);padding:var(--sgds-padding-sm) var(--sgds-padding-md)}.active:not(.sort-icon),tr:hover:not([data-header-row]){background-color:var(--sgds-bg-translucent-subtle);transition:background-color .15s ease}td,th{border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);vertical-align:middle}.data-table-cell,.data-table-head{align-items:center;display:flex;min-height:var(--sgds-dimension-56);padding:var(--sgds-padding-sm) var(--sgds-padding-md)}.data-table-head{font-weight:var(--sgds-font-weight-semibold);gap:var(--sgds-gap-2-xs)}.sort,.sort-button{align-items:center;display:inline-flex}.sort-button{background-color:var(--sgds-bg-transparent);border:var(--sgds-border-width-1) solid var(--sgds-border-color-transparent);border-radius:var(--sgds-form-border-radius-md);color:var(--sgds-color-subtle);cursor:pointer;height:var(--sgds-dimension-24);justify-content:center;padding:0;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:var(--sgds-dimension-24)}.sort-button:hover{background-color:var(--sgds-bg-translucent-subtle);color:var(--sgds-color-default)}.sort-button:focus,.sort-button:focus-visible{background-color:var(--sgds-bg-translucent-subtle);border-color:transparent;outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.sort-button:disabled{background-color:var(--sgds-bg-transparent);color:var(--sgds-color-muted);cursor:not-allowed}.sort-button.active{background-color:var(--sgds-primary-surface-translucent);color:var(--sgds-primary-color-default)}.sort-icon{display:inline-flex}.data-table-cell.align-right,.data-table-head.align-right{justify-content:flex-end;text-align:right}.control-cell{width:var(--sgds-dimension-56)}:host(.checkbox-cell) .data-table-cell,:host(.checkbox-cell) .data-table-head{padding:var(--sgds-padding-sm) var(--sgds-padding-md)}:host(.expand-cell) .data-table-cell{cursor:pointer;padding:var(--sgds-padding-md)}.expandable-td{border:0;padding:0}.expandable-content{background-color:var(--sgds-surface-raised);border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);padding:var(--sgds-padding-2-xl);padding-left:var(--sgds-padding-4-xl)}.hidden{display:none}`;class Ar extends Be{render(){return ie}}e([Ve({type:Number,reflect:!0})],Ar.prototype,"colspan",void 0),e([Ve({type:Number,reflect:!0})],Ar.prototype,"rowspan",void 0);class Dr extends Be{constructor(){super(...arguments),this.textAlign="left",this.sorting=!1,this.sortKey=""}handleSortClick(){if(!this.sorting)return;const e="ascending"===this.ariasort?"descending":"descending"===this.ariasort?"none":"ascending";this.ariasort=e,this.emit("i-sgds-sort",{detail:{key:this.sortKey,direction:e},bubbles:!0,composed:!0})}render(){return ie}}e([Ve({type:String,reflect:!0})],Dr.prototype,"width",void 0),e([Ve({type:Number,reflect:!0})],Dr.prototype,"colspan",void 0),e([Ve({type:Number,reflect:!0})],Dr.prototype,"rowspan",void 0),e([Ve({type:String,reflect:!0})],Dr.prototype,"textAlign",void 0),e([Ve({type:String,reflect:!0})],Dr.prototype,"ariasort",void 0),e([Ve({type:Boolean,reflect:!0})],Dr.prototype,"sorting",void 0),e([Ve({type:String,reflect:!0})],Dr.prototype,"sortKey",void 0);class Ir extends Be{constructor(){super(...arguments),this.rowData={},this.expand=!1,this.open=!1,this.checked=!1,this.showCheckbox=!1,this.showExpandPlaceholder=!1,this.columnAlignments=[],this.hasDataRows=!1,this._isHeaderRow=!1}get checkbox(){var e;return null!==(e=this._checkboxEl)&&void 0!==e?e:null}connectedCallback(){super.connectedCallback()}firstUpdated(){this._expandableBody&&(this._expandableBody.hidden=!this.open)}async handleExpandedChange(){if(this.open){if(this.emit("sgds-show",{cancelable:!0}).defaultPrevented)return void(this.open=!1);await Qe(this._expandableBody),this._expandableBody.hidden=!1;const{keyframes:e,options:t}=st(this,"row.expand.show");await Ge(this._expandableBody,Xe(e,this._expandableBody.scrollHeight),t),this.emit("sgds-after-show")}else{if(this.emit("sgds-hide",{cancelable:!0}).defaultPrevented)return void(this.open=!0);await Qe(this._expandableBody);const{keyframes:e,options:t}=st(this,"row.expand.hide");await Ge(this._expandableBody,Xe(e,this._expandableBody.scrollHeight),t),this._expandableBody.hidden=!0,this.emit("sgds-after-hide")}}async handleCheckedChange(){this.checked&&this.emit("i-sgds-change",{detail:{checked:!0}})}async show(){if(!this.open)return this.open=!0,at(this,"sgds-after-show")}async hide(){if(this.open)return this.open=!1,at(this,"sgds-after-hide")}_onSlotChange(){var e;const t=null!==(e=this._assignedCells)&&void 0!==e?e:[];this._isHeaderRow=t.some(e=>e instanceof Dr),this.requestUpdate()}_onCheckboxChange(e){this.emit("i-sgds-change",{detail:{checked:e.target.checked}})}_toggleExpand(){this.open?this.hide():this.show()}_onExpandKeyDown(e){"Enter"===e.key&&(e.preventDefault(),this._toggleExpand())}_onSortKeyDown(e,t){"Enter"===e.key&&(e.preventDefault(),t.handleSortClick())}_renderCell(e,t){var s;const i=Array.from(e.childNodes).map(e=>e.cloneNode(!0));if(e instanceof Dr)return ee`<th
+    `}}Pr.styles=[...Be.styles,zr],Pr.dependencies={"sgds-icon":_t,"sgds-divider":ho},e([Ve({type:String,reflect:!0})],Pr.prototype,"title",void 0),e([Ve({type:Boolean,reflect:!0})],Pr.prototype,"collapsed",void 0),e([Ve({type:Boolean,reflect:!0})],Pr.prototype,"collapsible",void 0),e([Ve({type:Boolean,reflect:!0})],Pr.prototype,"separator",void 0),customElements.define("sgds-sidebar",Zr),customElements.define("sgds-sidebar-item",Vr),customElements.define("sgds-sidebar-section",Pr),customElements.define("sgds-sidebar-group",Mr);var Lr=n`:host{display:contents}:host([layout=fixed]) .table{table-layout:fixed}.table{border-collapse:collapse;display:table;table-layout:auto;width:100%}.data-table{border:var(--sgds-border-width-1) solid;border-color:var(--sgds-border-color-muted);border-radius:var(--sgds-border-radius-md);display:flex;flex-direction:column;min-height:var(--sgds-dimension-56)}.footer{justify-content:space-between;padding:var(--sgds-padding-sm) var(--sgds-padding-lg)}.footer,.loading{align-items:center;display:flex}.loading{border-top:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);justify-content:center;min-height:var(--sgds-dimension-128);padding:var(--sgds-padding-sm) var(--sgds-padding-md)}.loading .loading-menu{gap:var(--sgds-gap-xs);pointer-events:none}.loading .loading-menu,.no-data{align-items:center;color:var(--sgds-text-color-subtle);display:flex}.no-data{border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);justify-content:center;min-height:var(--sgds-dimension-128);padding:var(--sgds-padding-sm) var(--sgds-padding-md)}.active:not(.sort-icon),tr:hover:not([data-header-row]){background-color:var(--sgds-bg-translucent-subtle);transition:background-color .15s ease}td,th{border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);vertical-align:middle}.data-table-cell,.data-table-head{align-items:center;display:flex;min-height:var(--sgds-dimension-56);padding:var(--sgds-padding-sm) var(--sgds-padding-md)}.data-table-head{font-weight:var(--sgds-font-weight-semibold);gap:var(--sgds-gap-2-xs)}.sort,.sort-button{align-items:center;display:inline-flex}.sort-button{background-color:var(--sgds-bg-transparent);border:var(--sgds-border-width-1) solid var(--sgds-border-color-transparent);border-radius:var(--sgds-form-border-radius-md);color:var(--sgds-color-subtle);cursor:pointer;height:var(--sgds-dimension-24);justify-content:center;padding:0;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:var(--sgds-dimension-24)}.sort-button:hover{background-color:var(--sgds-bg-translucent-subtle);color:var(--sgds-color-default)}.sort-button:focus,.sort-button:focus-visible{background-color:var(--sgds-bg-translucent-subtle);border-color:transparent;outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.sort-button:disabled{background-color:var(--sgds-bg-transparent);color:var(--sgds-color-muted);cursor:not-allowed}.sort-button.active{background-color:var(--sgds-primary-surface-translucent);color:var(--sgds-primary-color-default)}.sort-icon{display:inline-flex}.data-table-cell.align-right,.data-table-head.align-right{justify-content:flex-end;text-align:right}.control-cell{width:var(--sgds-dimension-56)}:host(.checkbox-cell) .data-table-cell,:host(.checkbox-cell) .data-table-head{padding:var(--sgds-padding-sm) var(--sgds-padding-md)}:host(.expand-cell) .data-table-cell{cursor:pointer;padding:var(--sgds-padding-md)}.expandable-td{border:0;padding:0}.expandable-content{background-color:var(--sgds-surface-raised);border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);padding:var(--sgds-padding-2-xl);padding-left:var(--sgds-padding-4-xl)}.hidden{display:none}`;class Ar extends Be{render(){return ee`<slot></slot>`}}Ar.styles=[...Be.styles,n`
+      :host {
+        display: contents;
+      }
+    `],e([Ve({type:Number,reflect:!0})],Ar.prototype,"colspan",void 0),e([Ve({type:Number,reflect:!0})],Ar.prototype,"rowspan",void 0);class Dr extends Be{constructor(){super(...arguments),this.textAlign="left",this.sorting=!1,this.sortKey=""}handleSortClick(){if(!this.sorting)return;const e="ascending"===this.ariasort?"descending":"descending"===this.ariasort?"none":"ascending";this.ariasort=e,this.emit("i-sgds-sort",{detail:{key:this.sortKey,direction:e},bubbles:!0,composed:!0})}render(){return ee`<slot></slot>`}}Dr.styles=[...Be.styles,n`
+      :host {
+        display: contents;
+      }
+    `],e([Ve({type:String,reflect:!0})],Dr.prototype,"width",void 0),e([Ve({type:Number,reflect:!0})],Dr.prototype,"colspan",void 0),e([Ve({type:Number,reflect:!0})],Dr.prototype,"rowspan",void 0),e([Ve({type:String,reflect:!0})],Dr.prototype,"textAlign",void 0),e([Ve({type:String,reflect:!0})],Dr.prototype,"ariasort",void 0),e([Ve({type:Boolean,reflect:!0})],Dr.prototype,"sorting",void 0),e([Ve({type:String,reflect:!0})],Dr.prototype,"sortKey",void 0);class Ir extends Be{constructor(){super(...arguments),this.rowData={},this.expand=!1,this.open=!1,this.checked=!1,this.showCheckbox=!1,this.showExpandPlaceholder=!1,this.columnAlignments=[],this.hasDataRows=!1,this._isHeaderRow=!1,this._cellSlotNames=new WeakMap}get checkbox(){var e;return null!==(e=this._checkboxEl)&&void 0!==e?e:null}connectedCallback(){super.connectedCallback(),this._lightDomObserver=new MutationObserver(()=>this._handleLightDomChange()),this._lightDomObserver.observe(this,{childList:!0}),this._handleLightDomChange()}disconnectedCallback(){var e;null===(e=this._lightDomObserver)||void 0===e||e.disconnect(),super.disconnectedCallback()}firstUpdated(){this._expandableBody&&(this._expandableBody.hidden=!this.open)}async handleExpandedChange(){if(this.open){if(this.emit("sgds-show",{cancelable:!0}).defaultPrevented)return void(this.open=!1);await Qe(this._expandableBody),this._expandableBody.hidden=!1;const{keyframes:e,options:t}=st(this,"row.expand.show");await Ge(this._expandableBody,Xe(e,this._expandableBody.scrollHeight),t),this.emit("sgds-after-show")}else{if(this.emit("sgds-hide",{cancelable:!0}).defaultPrevented)return void(this.open=!0);await Qe(this._expandableBody);const{keyframes:e,options:t}=st(this,"row.expand.hide");await Ge(this._expandableBody,Xe(e,this._expandableBody.scrollHeight),t),this._expandableBody.hidden=!0,this.emit("sgds-after-hide")}}async handleCheckedChange(){this.checked&&this.emit("i-sgds-change",{detail:{checked:!0}})}async show(){if(!this.open)return this.open=!0,at(this,"sgds-after-show")}async hide(){if(this.open)return this.open=!1,at(this,"sgds-after-hide")}getCellText(e){var t;const s=this._getCells().filter(e=>e instanceof Ar),i=s[e];return i?(null!==(t=i.textContent)&&void 0!==t?t:"").trim():""}_getCells(){return Array.from(this.children).filter(e=>e instanceof Ar||e instanceof Dr)}_syncCellSlots(e){e.forEach(t=>{const s=`cell-${e.indexOf(t)}`;this._cellSlotNames.set(t,s),t.getAttribute("slot")!==s&&t.setAttribute("slot",s)})}_handleLightDomChange(){const e=this._getCells();this._syncCellSlots(e),this._isHeaderRow=e.some(e=>e instanceof Dr),this.requestUpdate()}_onCheckboxChange(e){this.emit("i-sgds-change",{detail:{checked:e.target.checked}})}_toggleExpand(){this.open?this.hide():this.show()}_onExpandKeyDown(e){"Enter"===e.key&&(e.preventDefault(),this._toggleExpand())}_onSortKeyDown(e,t){"Enter"===e.key&&(e.preventDefault(),t.handleSortClick())}_renderCell(e,t){var s;const i=this._cellSlotNames.get(e);if(e instanceof Dr)return ee`<th
         width=${We(e.width)}
         colspan=${We(e.colspan)}
         rowspan=${We(e.rowspan)}
@@ -2112,7 +2120,7 @@ const tn="important",sn=" !"+tn;const an=qe(class extends Ye{constructor(e){if(s
         @keydown=${e.sorting?t=>this._onSortKeyDown(t,e):ie}
       >
         <div class="data-table-head ${"right"===e.textAlign?"align-right":"align-left"}">
-          ${i}
+          ${i?ee`<slot name=${i}></slot>`:ie}
           ${e.sorting?ee`
                 <button
                   type="button"
@@ -2129,7 +2137,9 @@ const tn="important",sn=" !"+tn;const an=qe(class extends Ye{constructor(e){if(s
               `:ie}
         </div>
       </th>`;const a=null!==(s=this.columnAlignments[t])&&void 0!==s?s:"left";return ee`<td colspan=${We(e.colspan)} rowspan=${We(e.rowspan)}>
-      <div class="data-table-cell ${"right"===a?"align-right":"align-left"}">${i}</div>
+      <div class="data-table-cell ${"right"===a?"align-right":"align-left"}">
+        ${i?ee`<slot name=${i}></slot>`:ie}
+      </div>
     </td>`}_renderExpandCell(){return this._isHeaderRow?ee`<th class="control-cell" scope="col"></th>`:ee`<td class="control-cell" @click=${this._toggleExpand} @keydown=${this._onExpandKeyDown} tabindex="0">
       <div class="data-table-cell expand-cell">
         <sgds-icon name=${this.open?"chevron-up":"chevron-down"} size="md"></sgds-icon>
@@ -2142,17 +2152,16 @@ const tn="important",sn=" !"+tn;const an=qe(class extends Ye{constructor(e){if(s
           <div class="data-table-cell checkbox-cell">
             <sgds-checkbox .checked=${this.checked} @sgds-change=${this._onCheckboxChange}></sgds-checkbox>
           </div>
-        </td>`}_renderHiddenSlotCell(){return this._isHeaderRow?ee`<th hidden style="display:none"><slot @slotchange=${this._onSlotChange}></slot></th>`:ee`<td hidden style="display:none"><slot @slotchange=${this._onSlotChange}></slot></td>`}render(){var e;const t=null!==(e=this._assignedCells)&&void 0!==e?e:[],s=t.length+(this.showCheckbox?1:0)+(this.expand||this.showExpandPlaceholder?1:0),i=this._isHeaderRow?"row row-header":"row row-body";return ee`
-      <tr part=${i} ?data-header-row=${this._isHeaderRow} class=${this.open?"active":""}>
-        ${this._renderHiddenSlotCell()}
+        </td>`}render(){const e=this._getCells(),t=e.length+(this.showCheckbox?1:0)+(this.expand||this.showExpandPlaceholder?1:0),s=this._isHeaderRow?"row row-header":"row row-body";return ee`
+      <tr part=${s} ?data-header-row=${this._isHeaderRow} class=${this.open?"active":""}>
         ${this.expand?this._renderExpandCell():this.showExpandPlaceholder?this._renderExpandPlaceholder():ie}
         ${this.showCheckbox?this._renderCheckboxCell():ie}
-        ${(()=>{let e=0;return t.map(t=>{const s=this._renderCell(t,e),i=Number(t.colspan)>0?Number(t.colspan):1;return e+=i,s})})()}
+        ${(()=>{let t=0;return e.map(e=>{const s=this._renderCell(e,t),i=Number(e.colspan)>0?Number(e.colspan):1;return t+=i,s})})()}
       </tr>
 
       ${this.expand?ee`
             <tr class="expandable-row">
-              <td colspan=${s} class="expandable-td">
+              <td colspan=${t} class="expandable-td">
                 <div class="expandable-body">
                   <div class="expandable-content">
                     <slot name="content"></slot>
@@ -2161,7 +2170,7 @@ const tn="important",sn=" !"+tn;const an=qe(class extends Ye{constructor(e){if(s
               </td>
             </tr>
           `:ie}
-    `}}Ir.styles=[...Be.styles,Lr],Ir.dependencies={"sgds-checkbox":ya,"sgds-data-table-cell":Ar,"sgds-data-table-head":Dr,"sgds-icon":_t},e([Ve({type:Object,reflect:!0})],Ir.prototype,"rowData",void 0),e([Ve({type:Boolean,reflect:!0})],Ir.prototype,"expand",void 0),e([Ve({type:Boolean,reflect:!0})],Ir.prototype,"open",void 0),e([Ve({type:Boolean,reflect:!0})],Ir.prototype,"checked",void 0),e([Ve({type:Boolean})],Ir.prototype,"showCheckbox",void 0),e([Ve({type:Boolean})],Ir.prototype,"showExpandPlaceholder",void 0),e([Ve({attribute:!1})],Ir.prototype,"columnAlignments",void 0),e([Ve({type:Boolean})],Ir.prototype,"hasDataRows",void 0),e([Ae(".expandable-body")],Ir.prototype,"_expandableBody",void 0),e([Ae("sgds-checkbox")],Ir.prototype,"_checkboxEl",void 0),e([Ie({flatten:!0})],Ir.prototype,"_assignedCells",void 0),e([ze()],Ir.prototype,"_isHeaderRow",void 0),e([ot("open",{waitUntilFirstUpdate:!0})],Ir.prototype,"handleExpandedChange",null),e([ot("checked")],Ir.prototype,"handleCheckedChange",null),it("row.expand.show",{keyframes:[{height:"0",opacity:"0"},{height:"auto",opacity:"1"}],options:{duration:250,easing:"ease-in-out"}}),it("row.expand.hide",{keyframes:[{height:"auto",opacity:"1"},{height:"0",opacity:"0"}],options:{duration:250,easing:"ease-in-out"}});class Er extends Be{constructor(){super(...arguments),this.multiSelect=!1,this.dataLength=0,this.currentPage=1,this.itemsPerPage=5,this.footerText="",this.hideFooter=!1,this.isLoading=!1,this.serverSort=!1,this.layout="auto",this.mode="client",this.tableRows=[],this.headerRows=[],this._headerCells=[],this._initialRowPositions=new WeakMap,this._hasCapturedInitialRowPositions=!1,this._rowHandlers=new WeakMap}connectedCallback(){super.connectedCallback(),this.setAttribute("role","table")}_isRowChecked(e){var t;return e.checked||!0===(null===(t=e.checkbox)||void 0===t?void 0:t.checked)}_updateHeaderCheckbox(){const e=this.tableRows.filter(e=>this._isRowChecked(e)).length,t=e===this.tableRows.length&&e>0;this.headerRows.forEach(s=>{s.checked=t,s.checkbox&&(s.checkbox.checked=t,s.checkbox.indeterminate=e>0&&!t)})}async _syncHeaderCheckboxAfterRender(){if(!this.multiSelect||0===this.headerRows.length)return;const e=[...this.headerRows,...this.tableRows];await Promise.all(e.map(e=>e.updateComplete)),this._updateHeaderCheckbox()}_emitRowSelect(){const e=this.tableRows.filter(e=>this._isRowChecked(e)).map(e=>e.rowData);this.emit("sgds-row-select",{detail:{selected:e}})}_attachRowListener(e){const t=this._rowHandlers.get(e);t&&e.removeEventListener("i-sgds-change",t);const s=t=>{const{checked:s}=t.detail;this.headerRows.includes(e)?this.tableRows.forEach(e=>{e.checked=s,e.checkbox&&(e.checkbox.checked=s)}):(e.checked=s,this._updateHeaderCheckbox()),this._emitRowSelect()};this._rowHandlers.set(e,s),e.addEventListener("i-sgds-change",s)}_configureRows(){const e=this.tableRows.some(e=>e.expand),t=this.tableRows.length>0;this.headerRows.forEach(s=>{s.showCheckbox=this.multiSelect,s.showExpandPlaceholder=e,s.hasDataRows=t,this.multiSelect&&this._attachRowListener(s)}),this.tableRows.forEach(t=>{t.showCheckbox=this.multiSelect,t.showExpandPlaceholder=!t.expand&&e,this.multiSelect&&this._attachRowListener(t)}),this.multiSelect&&this._syncHeaderCheckboxAfterRender(),this._applyColumnAlignment()}_applyColumnAlignment(){const e=this._headerCells.reduce((e,t)=>{var s;const i=Number(t.colspan)>0?Number(t.colspan):1,a=null!==(s=t.textAlign)&&void 0!==s?s:"left";for(let t=0;t<i;t++)e.push(a);return e},[]);this.headerRows.forEach(t=>{t.columnAlignments=[...e]}),this.tableRows.forEach(t=>{t.columnAlignments=[...e]})}_extractCellText(e,t){const s=Array.from(e.children).filter(e=>"sgds-data-table-cell"===e.tagName.toLowerCase())[t];return((null==s?void 0:s.textContent)||"").trim()}_toComparableValue(e,t,s){return t&&e.rowData&&t in e.rowData?e.rowData[t]:this._extractCellText(e,s)}_compareValues(e,t,s){if(e===t)return 0;const i=Number(e),a=Number(t);if(Number.isFinite(i)&&Number.isFinite(a))return"ascending"===s?i-a:a-i;const o=String(e).localeCompare(String(t),void 0,{numeric:!0,sensitivity:"base"});return"ascending"===s?o:-o}_resetOtherHeaderSortStates(e){this._headerCells.forEach(t=>{t!==e&&t.sorting&&(t.ariasort="none")})}_getRowsInInitialPositionOrder(e){return[...e].sort((e,t)=>{const s=this._initialRowPositions.get(e),i=this._initialRowPositions.get(t);return void 0===s&&void 0===i?0:void 0===s?1:void 0===i?-1:s-i})}_captureInitialRowPositions(e){this._hasCapturedInitialRowPositions||(e.forEach((e,t)=>{this._initialRowPositions.set(e,t)}),this._hasCapturedInitialRowPositions=!0)}_handleSort(e){if(!(e.target instanceof Dr&&e.target.sorting))return;const{key:t,direction:s}=e.detail,i=e.target,a=i?this._headerCells.indexOf(i):-1;if(this._resetOtherHeaderSortStates(i),this.serverSort)return e.stopPropagation(),void this.emit("sgds-sort",{detail:{key:t,direction:s}});if(!(a<0)){if("none"===s)return this.tableRows=this._getRowsInInitialPositionOrder(this.tableRows),this._syncDomRowOrder(),void this._updateVisibleRows();if("client"===this.mode){const e=(this.currentPage-1)*this.itemsPerPage,i=e+this.itemsPerPage,o=[...this.tableRows],n=o.slice(e,i).sort((e,i)=>{const o=this._toComparableValue(e,t,a),n=this._toComparableValue(i,t,a);return this._compareValues(o,n,s)});return o.splice(e,n.length,...n),this.tableRows=o,this._syncDomRowOrder(),void this._updateVisibleRows()}this.tableRows=[...this.tableRows].sort((e,i)=>{const o=this._toComparableValue(e,t,a),n=this._toComparableValue(i,t,a);return this._compareValues(o,n,s)}),this._syncDomRowOrder(),this._updateVisibleRows()}}_syncDomRowOrder(){var e;const t=null===(e=this.tableRows[0])||void 0===e?void 0:e.parentElement;t&&this.tableRows.forEach(e=>t.appendChild(e))}_handleSlotChange(e){const t=e.target.assignedElements({flatten:!0}).filter(e=>e instanceof Ir);this.headerRows=t.filter(e=>Array.from(e.children).some(e=>"sgds-data-table-head"===e.tagName.toLowerCase())),this.tableRows=t.filter(e=>Array.from(e.children).filter(e=>!e.hasAttribute("slot")).every(e=>"sgds-data-table-cell"===e.tagName.toLowerCase())),this._headerCells=this.headerRows.reduce((e,t)=>{const s=Array.from(t.children).filter(e=>e instanceof Dr);return e.push(...s),e},[]),this._captureInitialRowPositions(this.tableRows),this._headerCells.forEach(e=>{e.sorting&&!e.ariasort&&(e.ariasort="none")}),this._configureRows(),this._updateVisibleRows()}_updateVisibleRows(){if("server"===this.mode)return void this.tableRows.forEach(e=>e.style.display=this.isLoading?"none":"");const e=this.dataLength||this.tableRows.length,t=Math.max(1,Math.ceil(e/this.itemsPerPage));if(this.currentPage>t)return void(this.currentPage=t);const s=(this.currentPage-1)*this.itemsPerPage,i=new Set(this.tableRows.slice(s,s+this.itemsPerPage));this.tableRows.forEach(e=>e.style.display=i.has(e)?"":"none")}updated(e){(e.has("currentPage")||e.has("itemsPerPage")||e.has("mode")||e.has("isLoading"))&&this._updateVisibleRows(),e.has("multiSelect")&&this._configureRows(),this.multiSelect&&(e.has("tableRows")||e.has("headerRows"))&&this._syncHeaderCheckboxAfterRender()}render(){const e=this.dataLength||this.tableRows.length,t=(this.currentPage-1)*this.itemsPerPage,s=Math.min(t+this.itemsPerPage,e),i=0===e?0:t+1,a=!this.isLoading&&0===this.tableRows.length;return ee`
+    `}}Ir.styles=[...Be.styles,Lr],Ir.dependencies={"sgds-checkbox":ya,"sgds-data-table-cell":Ar,"sgds-data-table-head":Dr,"sgds-icon":_t},e([Ve({type:Object,reflect:!0})],Ir.prototype,"rowData",void 0),e([Ve({type:Boolean,reflect:!0})],Ir.prototype,"expand",void 0),e([Ve({type:Boolean,reflect:!0})],Ir.prototype,"open",void 0),e([Ve({type:Boolean,reflect:!0})],Ir.prototype,"checked",void 0),e([Ve({type:Boolean})],Ir.prototype,"showCheckbox",void 0),e([Ve({type:Boolean})],Ir.prototype,"showExpandPlaceholder",void 0),e([Ve({attribute:!1})],Ir.prototype,"columnAlignments",void 0),e([Ve({type:Boolean})],Ir.prototype,"hasDataRows",void 0),e([Ae(".expandable-body")],Ir.prototype,"_expandableBody",void 0),e([Ae("sgds-checkbox")],Ir.prototype,"_checkboxEl",void 0),e([ze()],Ir.prototype,"_isHeaderRow",void 0),e([ot("open",{waitUntilFirstUpdate:!0})],Ir.prototype,"handleExpandedChange",null),e([ot("checked")],Ir.prototype,"handleCheckedChange",null),it("row.expand.show",{keyframes:[{height:"0",opacity:"0"},{height:"auto",opacity:"1"}],options:{duration:250,easing:"ease-in-out"}}),it("row.expand.hide",{keyframes:[{height:"auto",opacity:"1"},{height:"0",opacity:"0"}],options:{duration:250,easing:"ease-in-out"}});class Er extends Be{constructor(){super(...arguments),this.multiSelect=!1,this.dataLength=0,this.currentPage=1,this.itemsPerPage=5,this.footerText="",this.hideFooter=!1,this.isLoading=!1,this.serverSort=!1,this.layout="auto",this.mode="client",this.tableRows=[],this.headerRows=[],this._headerCells=[],this._initialRowPositions=new WeakMap,this._hasCapturedInitialRowPositions=!1,this._rowHandlers=new WeakMap}connectedCallback(){super.connectedCallback(),this.setAttribute("role","table")}_isRowChecked(e){var t;return e.checked||!0===(null===(t=e.checkbox)||void 0===t?void 0:t.checked)}_updateHeaderCheckbox(){const e=this.tableRows.filter(e=>this._isRowChecked(e)).length,t=e===this.tableRows.length&&e>0;this.headerRows.forEach(s=>{s.checked=t,s.checkbox&&(s.checkbox.checked=t,s.checkbox.indeterminate=e>0&&!t)})}async _syncHeaderCheckboxAfterRender(){if(!this.multiSelect||0===this.headerRows.length)return;const e=[...this.headerRows,...this.tableRows];await Promise.all(e.map(e=>e.updateComplete)),this._updateHeaderCheckbox()}_emitRowSelect(){const e=this.tableRows.filter(e=>this._isRowChecked(e)).map(e=>e.rowData);this.emit("sgds-row-select",{detail:{selected:e}})}_attachRowListener(e){const t=this._rowHandlers.get(e);t&&e.removeEventListener("i-sgds-change",t);const s=t=>{const{checked:s}=t.detail;this.headerRows.includes(e)?this.tableRows.forEach(e=>{e.checked=s,e.checkbox&&(e.checkbox.checked=s)}):(e.checked=s,this._updateHeaderCheckbox()),this._emitRowSelect()};this._rowHandlers.set(e,s),e.addEventListener("i-sgds-change",s)}_configureRows(){const e=this.tableRows.some(e=>e.expand),t=this.tableRows.length>0;this.headerRows.forEach(s=>{s.showCheckbox=this.multiSelect,s.showExpandPlaceholder=e,s.hasDataRows=t,this.multiSelect&&this._attachRowListener(s)}),this.tableRows.forEach(t=>{t.showCheckbox=this.multiSelect,t.showExpandPlaceholder=!t.expand&&e,this.multiSelect&&this._attachRowListener(t)}),this.multiSelect&&this._syncHeaderCheckboxAfterRender(),this._applyColumnAlignment()}_applyColumnAlignment(){const e=this._headerCells.reduce((e,t)=>{var s;const i=Number(t.colspan)>0?Number(t.colspan):1,a=null!==(s=t.textAlign)&&void 0!==s?s:"left";for(let t=0;t<i;t++)e.push(a);return e},[]);this.headerRows.forEach(t=>{t.columnAlignments=[...e]}),this.tableRows.forEach(t=>{t.columnAlignments=[...e]})}_extractCellText(e,t){const s=e.getCellText(t);if(s)return s;const i=Array.from(e.children).filter(e=>"sgds-data-table-cell"===e.tagName.toLowerCase())[t];return((null==i?void 0:i.textContent)||"").trim()}_toComparableValue(e,t,s){return t&&e.rowData&&t in e.rowData?e.rowData[t]:this._extractCellText(e,s)}_compareValues(e,t,s){if(e===t)return 0;const i=Number(e),a=Number(t);if(Number.isFinite(i)&&Number.isFinite(a))return"ascending"===s?i-a:a-i;const o=String(e).localeCompare(String(t),void 0,{numeric:!0,sensitivity:"base"});return"ascending"===s?o:-o}_resetOtherHeaderSortStates(e){this._headerCells.forEach(t=>{t!==e&&t.sorting&&(t.ariasort="none")})}_getRowsInInitialPositionOrder(e){return[...e].sort((e,t)=>{const s=this._initialRowPositions.get(e),i=this._initialRowPositions.get(t);return void 0===s&&void 0===i?0:void 0===s?1:void 0===i?-1:s-i})}_captureInitialRowPositions(e){this._hasCapturedInitialRowPositions||(e.forEach((e,t)=>{this._initialRowPositions.set(e,t)}),this._hasCapturedInitialRowPositions=!0)}_handleSort(e){const t=e.composedPath().find(e=>e instanceof Dr);if(!t||!t.sorting)return;const{key:s,direction:i}=e.detail,a=t?this._headerCells.indexOf(t):-1;if(this._resetOtherHeaderSortStates(t),this.serverSort)return e.stopPropagation(),void this.emit("sgds-sort",{detail:{key:s,direction:i}});if(!(a<0)){if("none"===i)return this.tableRows=this._getRowsInInitialPositionOrder(this.tableRows),this._syncDomRowOrder(),void this._updateVisibleRows();if("client"===this.mode){const e=(this.currentPage-1)*this.itemsPerPage,t=e+this.itemsPerPage,o=[...this.tableRows],n=o.slice(e,t).sort((e,t)=>{const o=this._toComparableValue(e,s,a),n=this._toComparableValue(t,s,a);return this._compareValues(o,n,i)});return o.splice(e,n.length,...n),this.tableRows=o,this._syncDomRowOrder(),void this._updateVisibleRows()}this.tableRows=[...this.tableRows].sort((e,t)=>{const o=this._toComparableValue(e,s,a),n=this._toComparableValue(t,s,a);return this._compareValues(o,n,i)}),this._syncDomRowOrder(),this._updateVisibleRows()}}_syncDomRowOrder(){var e;const t=null===(e=this.tableRows[0])||void 0===e?void 0:e.parentElement;t&&this.tableRows.forEach(e=>t.appendChild(e))}_handleSlotChange(e){const t=e.target.assignedElements({flatten:!0}).filter(e=>e instanceof Ir),s=e=>Array.from(e.children).filter(e=>{const t=e.tagName.toLowerCase();return!("sgds-data-table-cell"!==t&&"sgds-data-table-head"!==t)&&"content"!==e.getAttribute("slot")});this.headerRows=t.filter(e=>s(e).some(e=>"sgds-data-table-head"===e.tagName.toLowerCase())),this.tableRows=t.filter(e=>{const t=s(e);return t.length>0&&t.every(e=>"sgds-data-table-cell"===e.tagName.toLowerCase())}),this._headerCells=this.headerRows.reduce((e,t)=>{const s=Array.from(t.children).filter(e=>e instanceof Dr);return e.push(...s),e},[]),this._captureInitialRowPositions(this.tableRows),this._headerCells.forEach(e=>{e.sorting&&!e.ariasort&&(e.ariasort="none")}),this._configureRows(),this._updateVisibleRows()}_updateVisibleRows(){if("server"===this.mode)return void this.tableRows.forEach(e=>e.style.display=this.isLoading?"none":"");const e=this.dataLength||this.tableRows.length,t=Math.max(1,Math.ceil(e/this.itemsPerPage));if(this.currentPage>t)return void(this.currentPage=t);const s=(this.currentPage-1)*this.itemsPerPage,i=new Set(this.tableRows.slice(s,s+this.itemsPerPage));this.tableRows.forEach(e=>e.style.display=i.has(e)?"":"none")}updated(e){(e.has("currentPage")||e.has("itemsPerPage")||e.has("mode")||e.has("isLoading"))&&this._updateVisibleRows(),e.has("multiSelect")&&this._configureRows(),this.multiSelect&&(e.has("tableRows")||e.has("headerRows"))&&this._syncHeaderCheckboxAfterRender()}render(){const e=this.dataLength||this.tableRows.length,t=(this.currentPage-1)*this.itemsPerPage,s=Math.min(t+this.itemsPerPage,e),i=0===e?0:t+1,a=!this.isLoading&&0===this.tableRows.length;return ee`
       <div class="data-table">
         <div>
           <slot @slotchange=${this._handleSlotChange} @i-sgds-sort=${this._handleSort} class="table"></slot>