@scania/tegel 1.15.0 → 1.16.0

package/dist/types/components/table/table/table.d.ts

@@ -9,6 +9,7 @@ type Props = {
     modeVariant: 'primary' | 'secondary' | null;
     textAlign: string;
     horizontalScrollWidth?: string;
+    zebraMode: 'rows-odd' | 'rows-even' | 'columns-odd' | 'columns-even' | 'none';
 };
 export type InternalTdsTablePropChange = {
     tableId: string;
@@ -32,6 +33,8 @@ export declare class TdsTable {
     responsive: boolean;
     /** Variant of the component, based on current mode. */
     modeVariant: 'primary' | 'secondary';
+    /** Enables zebra stripe mode on the table rows or columns. */
+    zebraMode: 'rows-odd' | 'rows-even' | 'columns-odd' | 'columns-even' | 'none';
     /** Width of the table, used as the constraint for horizontal scrolling.
      * **NOTE**: this will disable usage of the responsive flag
      * */
@@ -56,6 +59,7 @@ export declare class TdsTable {
     compactDesignChanged(newValue: boolean): void;
     verticalDividersChanged(newValue: boolean): void;
     noMinWidthChanged(newValue: boolean): void;
+    zebraModeChanged(newValue: 'rows-odd' | 'rows-even' | 'columns-odd' | 'columns-even' | 'none'): void;
     modeVariantChanged(newValue: 'primary' | 'secondary' | null): void;
     widthChanged(newValue: string): void;
     componentWillRender(): void;

package/dist/types/components/table/table-body/table-body.d.ts

@@ -11,6 +11,7 @@ export declare class TdsTableBody {
     multiselectArrayJSON: string;
     mainCheckboxStatus: boolean;
     columnsNumber: number;
+    zebraMode: 'rows-odd' | 'rows-even' | 'columns-odd' | 'columns-even' | 'none';
     tableId: string;
     tableEl: HTMLTdsTableElement;
     internalTdsPropChangeListener(event: CustomEvent<InternalTdsTablePropChange>): void;

package/dist/types/components/table/table-body-cell/table-body-cell.d.ts

@@ -16,7 +16,6 @@ export declare class TdsTableBodyCell {
     verticalDividers: boolean;
     compactDesign: boolean;
     noMinWidth: boolean;
-    whiteBackground: boolean;
     tableId: string;
     host: HTMLElement;
     tableEl: HTMLTdsTableElement;

package/dist/types/components/table/table-body-row-expandable/table-body-row-expandable.d.ts

@@ -11,12 +11,13 @@ export declare class TdsTableBodyRowExpandable {
     /** In case that automatic count of columns does not work, user can manually set this one.
      *  Take in mind that expandable control is column too */
     colSpan: number;
-    /** Sets default expanded value of row */
     /** ID for the table row. Randomly generated if not specified. */
     rowId: string;
     /** Sets isExpanded state to true or false externally */
     expanded: boolean;
-    /** Sets isExpanded state to true or fals internally */
+    /** Controls the overflow behavior of the expandable row content */
+    overflow: 'auto' | 'hidden';
+    /** Sets isExpanded state to true or false internally */
     isExpanded: boolean;
     tableId: string;
     columnsNumber: number;
@@ -35,9 +36,9 @@ export declare class TdsTableBodyRowExpandable {
     }>;
     internalTdsPropChangeListener(event: CustomEvent<InternalTdsTablePropChange>): void;
     watchExpanded(newValue: boolean): void;
-    /** method to expand table row */
+    /** Method to expand table row */
     expand(): Promise<void>;
-    /** method to collapse table row */
+    /** Method to collapse table row */
     collapse(): Promise<void>;
     connectedCallback(): void;
     componentWillLoad(): void;

package/dist/types/components/table/table-footer/table-footer.d.ts

@@ -5,6 +5,10 @@ export declare class TdsTableFooter {
     pagination: boolean;
     /** Sets the pagination number. */
     paginationValue: number;
+    /** Enable rows per page dropdown */
+    rowsperpage: boolean;
+    /** Set available rows per page values */
+    rowsPerPageValues: number[];
     /** Sets the number of pages. */
     pages: number;
     /** <b>Client override</b> Used to set the column span of the footer. Use as fallback if the automatic count of columns fails. */
@@ -15,6 +19,7 @@ export declare class TdsTableFooter {
     lastCorrectValue: number;
     tableId: string;
     horizontalScrollWidth: string;
+    rowsPerPageValue: number;
     host: HTMLElement;
     private inputElement;
     private tableEl;
@@ -22,14 +27,19 @@ export declare class TdsTableFooter {
     tdsPagination: EventEmitter<{
         tableId: string;
         paginationValue: number;
+        rowsPerPage?: number;
     }>;
     internalTdsPropChangeListener(event: CustomEvent<InternalTdsTablePropChange>): void;
     connectedCallback(): void;
     componentWillLoad(): void;
+    private emitTdsPagination;
     private storeLastCorrectValue;
     private previousPage;
     private nextPage;
+    private lastPage;
+    private firstPage;
     private paginationInputChange;
+    private rowsPerPageChange;
     private getStyles;
     render(): any;
 }

package/dist/types/components.d.ts

@@ -414,7 +414,7 @@ export namespace Components {
         /**
           * The size of the Dropdown.
          */
-        "size": 'sm' | 'md' | 'lg';
+        "size": 'xs' | 'sm' | 'md' | 'lg';
     }
     interface TdsDropdownOption {
         /**
@@ -1141,6 +1141,14 @@ export namespace Components {
           * Enables style with vertical dividers between columns
          */
         "verticalDividers": boolean;
+        /**
+          * Enables zebra stripe mode on the table rows or columns.
+         */
+        "zebraMode": | 'rows-odd'
+    | 'rows-even'
+    | 'columns-odd'
+    | 'columns-even'
+    | 'none';
     }
     interface TdsTableBody {
     }
@@ -1166,17 +1174,21 @@ export namespace Components {
          */
         "colSpan": number;
         /**
-          * method to collapse table row
+          * Method to collapse table row
          */
         "collapse": () => Promise<void>;
         /**
-          * method to expand table row
+          * Method to expand table row
          */
         "expand": () => Promise<void>;
         /**
           * Sets isExpanded state to true or false externally
          */
         "expanded": boolean;
+        /**
+          * Controls the overflow behavior of the expandable row content
+         */
+        "overflow": 'auto' | 'hidden';
         /**
           * ID for the table row. Randomly generated if not specified.
          */
@@ -1199,6 +1211,14 @@ export namespace Components {
           * Sets the pagination number.
          */
         "paginationValue": number;
+        /**
+          * Set available rows per page values
+         */
+        "rowsPerPageValues": number[];
+        /**
+          * Enable rows per page dropdown
+         */
+        "rowsperpage": boolean;
     }
     interface TdsTableHeader {
         /**
@@ -2352,6 +2372,7 @@ declare global {
         "tdsPagination": {
     tableId: string;
     paginationValue: number;
+    rowsPerPage?: number;
   };
     }
     interface HTMLTdsTableFooterElement extends Components.TdsTableFooter, HTMLStencilElement {
@@ -3029,7 +3050,7 @@ declare namespace LocalJSX {
         /**
           * The size of the Dropdown.
          */
-        "size"?: 'sm' | 'md' | 'lg';
+        "size"?: 'xs' | 'sm' | 'md' | 'lg';
     }
     interface TdsDropdownOption {
         /**
@@ -3760,6 +3781,14 @@ declare namespace LocalJSX {
           * Enables style with vertical dividers between columns
          */
         "verticalDividers"?: boolean;
+        /**
+          * Enables zebra stripe mode on the table rows or columns.
+         */
+        "zebraMode"?: | 'rows-odd'
+    | 'rows-even'
+    | 'columns-odd'
+    | 'columns-even'
+    | 'none';
     }
     interface TdsTableBody {
     }
@@ -3803,6 +3832,10 @@ declare namespace LocalJSX {
     rowId: string;
     isExpanded: boolean;
   }>) => void;
+        /**
+          * Controls the overflow behavior of the expandable row content
+         */
+        "overflow"?: 'auto' | 'hidden';
         /**
           * ID for the table row. Randomly generated if not specified.
          */
@@ -3819,6 +3852,7 @@ declare namespace LocalJSX {
         "onTdsPagination"?: (event: TdsTableFooterCustomEvent<{
     tableId: string;
     paginationValue: number;
+    rowsPerPage?: number;
   }>) => void;
         /**
           * Sets the number of pages.
@@ -3832,6 +3866,14 @@ declare namespace LocalJSX {
           * Sets the pagination number.
          */
         "paginationValue"?: number;
+        /**
+          * Set available rows per page values
+         */
+        "rowsPerPageValues"?: number[];
+        /**
+          * Enable rows per page dropdown
+         */
+        "rowsperpage"?: boolean;
     }
     interface TdsTableHeader {
         /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@scania/tegel",
-  "version": "1.15.0",
+  "version": "1.16.0",
   "description": "Tegel Design System",
   "type": "module",
   "keywords": [

package/dist/cjs/tds-dropdown-option.cjs.entry.js

@@ -1,95 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-ca8040ad.js');
-
-const dropdownOptionCss = ":host{box-sizing:border-box;display:block;background-color:var(--tds-dropdown-option-background)}:host *{box-sizing:border-box}:host .dropdown-option{color:var(--tds-dropdown-option-color);border-bottom:1px solid var(--tds-dropdown-option-border);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);overflow-wrap:anywhere}:host .dropdown-option.selected{background-color:var(--tds-dropdown-option-background-selected)}:host .dropdown-option.disabled{color:var(--tds-dropdown-option-color-disabled)}:host .dropdown-option button:focus{outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host .dropdown-option button{all:unset;width:100%}:host .dropdown-option button.lg{padding:19px 0 20px}:host .dropdown-option button.md{padding:15px 0 16px}:host .dropdown-option button.sm{padding:11px 0 12px}:host .dropdown-option button .single-select{display:flex;align-items:center;justify-content:space-between;padding:0 16px}:host .dropdown-option .multiselect{width:100%;height:100%}:host .dropdown-option .multiselect tds-checkbox{display:flex;height:100%;width:100%}:host .dropdown-option .multiselect tds-checkbox.lg{padding:15px 16px 16px}:host .dropdown-option .multiselect tds-checkbox.md{padding:11px 16px 12px}:host .dropdown-option .multiselect tds-checkbox.sm{padding:7px 16px 8px}:host .dropdown-option:hover{background-color:var(--tds-dropdown-option-background-hover);cursor:pointer}:host .dropdown-option:hover.disabled{background-color:var(--tds-dropdown-option-background);cursor:not-allowed}:host([hidden]){display:none}";
-const TdsDropdownOptionStyle0 = dropdownOptionCss;
-
-const TdsDropdownOption = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.tdsSelect = index.createEvent(this, "tdsSelect", 6);
-        this.tdsFocus = index.createEvent(this, "tdsFocus", 6);
-        this.tdsBlur = index.createEvent(this, "tdsBlur", 6);
-        this.componentWillRender = () => {
-            this.parentElement =
-                this.host.parentElement.tagName === 'TDS-DROPDOWN'
-                    ? this.host.parentElement
-                    : this.host.getRootNode().host;
-            this.multiselect = this.parentElement.multiselect;
-            this.size = this.parentElement.size;
-            this.label = this.host.textContent.trim();
-        };
-        this.handleSingleSelect = () => {
-            if (!this.disabled) {
-                this.selected = true;
-                this.parentElement.appendValue(this.value);
-                this.parentElement.close();
-                this.tdsSelect.emit({
-                    value: this.value,
-                    selected: this.selected,
-                });
-            }
-        };
-        this.handleMultiselect = (event) => {
-            if (!this.disabled) {
-                if (event.detail.checked) {
-                    this.parentElement.appendValue(this.value);
-                    this.selected = true;
-                    this.tdsSelect.emit({
-                        value: this.value,
-                        selected: this.selected,
-                    });
-                }
-                else {
-                    this.parentElement.removeValue(this.value);
-                    this.selected = false;
-                    this.tdsSelect.emit({
-                        value: this.value,
-                        selected: this.selected,
-                    });
-                }
-                event.stopPropagation();
-            }
-        };
-        this.handleFocus = (event) => {
-            this.tdsFocus.emit(event);
-        };
-        this.handleBlur = (event) => {
-            this.tdsBlur.emit(event);
-        };
-        this.value = undefined;
-        this.disabled = false;
-        this.selected = false;
-        this.multiselect = undefined;
-        this.size = 'lg';
-    }
-    /** Method to select/deselect an option. */
-    async setSelected(selected) {
-        this.selected = selected;
-    }
-    render() {
-        return (index.h(index.Host, { key: '0c0253f02e12d0eb7924969b2d347ab2005d0772', role: "option", "aria-disabled": this.disabled, "aria-selected": this.selected }, index.h("div", { key: 'ad79763807bb52a3e242989f676a03e85804fc62', class: `dropdown-option 
-          ${this.size}
-          ${this.selected ? 'selected' : ''}
-          ${this.disabled ? 'disabled' : ''}
-          ` }, this.multiselect ? (index.h("div", { class: "multiselect", onKeyDown: (event) => {
-                if (event.key === 'Escape') {
-                    this.parentElement.close();
-                }
-            } }, index.h("tds-checkbox", { onTdsChange: (event) => {
-                this.handleMultiselect(event);
-            }, disabled: this.disabled, checked: this.selected, class: {
-                [this.size]: true,
-            } }, index.h("div", { slot: "label" }, index.h("slot", null))))) : (index.h("button", { onClick: () => {
-                this.handleSingleSelect();
-            }, onFocus: (event) => this.handleFocus(event), onBlur: (event) => this.handleBlur(event), disabled: this.disabled, class: this.size }, index.h("div", { class: "single-select" }, index.h("slot", null), this.selected && index.h("tds-icon", { name: "tick", size: "16px" })))))));
-    }
-    static get delegatesFocus() { return true; }
-    get host() { return index.getElement(this); }
-};
-TdsDropdownOption.style = TdsDropdownOptionStyle0;
-
-exports.tds_dropdown_option = TdsDropdownOption;

package/dist/tegel/p-36e88ce8.entry.js

@@ -1 +0,0 @@
-import{r as t,c as o,h as s,H as i,g as d}from"./p-2049fab2.js";const e=class{constructor(s){t(this,s),this.tdsSelect=o(this,"tdsSelect",6),this.tdsFocus=o(this,"tdsFocus",6),this.tdsBlur=o(this,"tdsBlur",6),this.componentWillRender=()=>{this.parentElement="TDS-DROPDOWN"===this.host.parentElement.tagName?this.host.parentElement:this.host.getRootNode().host,this.multiselect=this.parentElement.multiselect,this.size=this.parentElement.size,this.label=this.host.textContent.trim()},this.handleSingleSelect=()=>{this.disabled||(this.selected=!0,this.parentElement.appendValue(this.value),this.parentElement.close(),this.tdsSelect.emit({value:this.value,selected:this.selected}))},this.handleMultiselect=t=>{this.disabled||(t.detail.checked?(this.parentElement.appendValue(this.value),this.selected=!0,this.tdsSelect.emit({value:this.value,selected:this.selected})):(this.parentElement.removeValue(this.value),this.selected=!1,this.tdsSelect.emit({value:this.value,selected:this.selected})),t.stopPropagation())},this.handleFocus=t=>{this.tdsFocus.emit(t)},this.handleBlur=t=>{this.tdsBlur.emit(t)},this.value=void 0,this.disabled=!1,this.selected=!1,this.multiselect=void 0,this.size="lg"}async setSelected(t){this.selected=t}render(){return s(i,{key:"0c0253f02e12d0eb7924969b2d347ab2005d0772",role:"option","aria-disabled":this.disabled,"aria-selected":this.selected},s("div",{key:"ad79763807bb52a3e242989f676a03e85804fc62",class:`dropdown-option \n          ${this.size}\n          ${this.selected?"selected":""}\n          ${this.disabled?"disabled":""}\n          `},this.multiselect?s("div",{class:"multiselect",onKeyDown:t=>{"Escape"===t.key&&this.parentElement.close()}},s("tds-checkbox",{onTdsChange:t=>{this.handleMultiselect(t)},disabled:this.disabled,checked:this.selected,class:{[this.size]:!0}},s("div",{slot:"label"},s("slot",null)))):s("button",{onClick:()=>{this.handleSingleSelect()},onFocus:t=>this.handleFocus(t),onBlur:t=>this.handleBlur(t),disabled:this.disabled,class:this.size},s("div",{class:"single-select"},s("slot",null),this.selected&&s("tds-icon",{name:"tick",size:"16px"})))))}static get delegatesFocus(){return!0}get host(){return d(this)}};e.style=":host{box-sizing:border-box;display:block;background-color:var(--tds-dropdown-option-background)}:host *{box-sizing:border-box}:host .dropdown-option{color:var(--tds-dropdown-option-color);border-bottom:1px solid var(--tds-dropdown-option-border);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);overflow-wrap:anywhere}:host .dropdown-option.selected{background-color:var(--tds-dropdown-option-background-selected)}:host .dropdown-option.disabled{color:var(--tds-dropdown-option-color-disabled)}:host .dropdown-option button:focus{outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host .dropdown-option button{all:unset;width:100%}:host .dropdown-option button.lg{padding:19px 0 20px}:host .dropdown-option button.md{padding:15px 0 16px}:host .dropdown-option button.sm{padding:11px 0 12px}:host .dropdown-option button .single-select{display:flex;align-items:center;justify-content:space-between;padding:0 16px}:host .dropdown-option .multiselect{width:100%;height:100%}:host .dropdown-option .multiselect tds-checkbox{display:flex;height:100%;width:100%}:host .dropdown-option .multiselect tds-checkbox.lg{padding:15px 16px 16px}:host .dropdown-option .multiselect tds-checkbox.md{padding:11px 16px 12px}:host .dropdown-option .multiselect tds-checkbox.sm{padding:7px 16px 8px}:host .dropdown-option:hover{background-color:var(--tds-dropdown-option-background-hover);cursor:pointer}:host .dropdown-option:hover.disabled{background-color:var(--tds-dropdown-option-background);cursor:not-allowed}:host([hidden]){display:none}";export{e as tds_dropdown_option}

package/dist/tegel/p-3e859e33.entry.js

@@ -1 +0,0 @@
-import{r as t,c as e,h as a,H as d,g as s}from"./p-2049fab2.js";import{g as o}from"./p-11648030.js";const r=["verticalDividers","compactDesign","noMinWidth","modeVariant"],n=class{constructor(a){t(this,a),this.internalTdsRowExpanded=e(this,"internalTdsRowExpanded",6),this.tdsChange=e(this,"tdsChange",6),this.colSpan=null,this.rowId=o(),this.expanded=void 0,this.isExpanded=!1,this.tableId="",this.columnsNumber=null,this.verticalDividers=!1,this.compactDesign=!1,this.noMinWidth=!1,this.modeVariant=null}internalTdsPropChangeListener(t){this.tableId===t.detail.tableId&&t.detail.changed.filter((t=>r.includes(t))).forEach((e=>{if(void 0===this[e])throw new Error(`Table prop is not supported: ${e}`);this[e]=t.detail[e]}))}watchExpanded(t){t!==this.isExpanded&&(this.isExpanded=t,this.tdsChange.emit({rowId:this.rowId,isExpanded:this.isExpanded}))}async expand(){this.isExpanded=!0,this.tdsChange.emit({rowId:this.rowId,isExpanded:this.isExpanded})}async collapse(){this.isExpanded=!1,this.tdsChange.emit({rowId:this.rowId,isExpanded:this.isExpanded})}connectedCallback(){void 0!==this.expanded&&(this.isExpanded=this.expanded),this.tableEl=this.host.closest("tds-table"),this.tableId=this.tableEl.tableId}componentWillLoad(){r.forEach((t=>{this[t]=this.tableEl[t]}))}componentWillRender(){this.columnsNumber=null!==this.colSpan?this.colSpan:this.tableEl.querySelector("tds-table-header").childElementCount+1}sendValue(){this.internalTdsRowExpanded.emit([this.tableId,this.isExpanded]),this.tdsChange.emit({rowId:this.rowId,isExpanded:this.isExpanded})}onChangeHandler(t){this.isExpanded=!0===t.currentTarget.checked,this.sendValue()}render(){return a(d,{key:"cd23997b2d0b659691199b0f6a7be6aa51689ee4",class:{"tds-table__row":!0,"tds-table__row-expand--active":this.isExpanded,"tds-table__compact":this.compactDesign,"tds-table--divider":this.verticalDividers}},a("tr",{key:"a3fec49a0b97a35f61db7c31dfc023ba3acebd86",class:{"tds-table__row":!0,"tds-table__row--expanded":this.isExpanded},part:"row"},a("td",{key:"d995074fc578640544f59df3426762ff6595dd0b",class:"tds-table__cell tds-table__cell--expand"},a("label",{key:"0f905bda5651a8c9dc30094dbc402e5e618e4030",class:"tds-table__expand-control-container"},a("input",{key:"9b316a0e3a44cfa21851a1ac2ec0980d53d3aa54",class:"tds-table__expand-input",type:"checkbox",onChange:t=>this.onChangeHandler(t),checked:this.isExpanded}),a("span",{key:"022d891384b907d3ebce4b2138fef4f5c6f7d44f",class:"tds-expendable-row-icon"},a("svg",{key:"fb7ccb4d599e72a9d7a56808f59226779ffe611b",fill:"none",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 32 32"},a("path",{key:"1e2c766463813a4b1edc32093abbbf501b99974b","fill-rule":"evenodd","clip-rule":"evenodd",d:"M4.273 9.783a1 1 0 0 1 1.415 0l9.888 9.888a.6.6 0 0 0 .848 0l9.888-9.888a1 1 0 1 1 1.415 1.414l-9.889 9.889a2.6 2.6 0 0 1-3.677 0l-9.888-9.889a1 1 0 0 1 0-1.414Z",fill:"currentColor"}))))),a("slot",{key:"7f0e3d93df3da8eeff969daa9aba8eecaa1e6e23"})),a("tr",{key:"89766434b64dd9bf0aecf805fdd494aab68f8af9",class:{"tds-table__row-expand":!0,"tds-table__row-expand--expanded":this.isExpanded},part:"expand-row"},a("td",{key:"f0c746d12fae92eae3e6bf9651c826fb3aacbefe",class:"tds-table__cell-expand",colSpan:this.columnsNumber},a("slot",{key:"0a9e454379a7a6a72b3d6ea33a66a4aaaac09e8f",name:"expand-row"}))))}get host(){return s(this)}static get watchers(){return{expanded:["watchExpanded"]}}};n.style=":host{box-sizing:border-box;display:contents}:host *{box-sizing:border-box}:host .tds-table__row,:host .tds-table__row-extend{display:table-row;border-bottom:1px solid var(--tds-table-divider);background-color:var(--tds-table-body-row-background);transition:background-color 200ms ease;color:var(--tds-table-color)}:host .tds-table__row--expanded{border-bottom:none}:host .tds-table__row:hover,:host .tds-table__row-extend:hover{background-color:var(--tds-table-body-row-background-hover)}:host .tds-table__expand-control-container{display:flex;justify-content:center;align-items:center;height:46px;cursor:pointer;padding:0 16px;position:relative}:host .tds-table__expand-control-container .tds-table__expand-input{all:unset;top:0;left:0;width:100%;height:100%;position:absolute;cursor:pointer}:host .tds-table__expand-control-container .tds-table__expand-input:focus{outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host .tds-table__expand-control-container .tds-expendable-row-icon{height:16px;width:16px;transition:transform 200ms ease;transform:rotate(0)}:host .tds-table__row-expand{display:none;transition:background-color 200ms ease}:host .tds-table__row-expand--expanded{border-bottom:1px solid var(--tds-table-divider)}:host .tds-table__row-expand .tds-table__cell-expand{max-width:1px;overflow:scroll;padding:16px 16px 16px 66px;color:var(--tds-table-color)}:host(.tds-table__row-expand--active) .tds-table__row{background-color:var(--tds-table-body-row-background-selected)}:host(.tds-table__row-expand--active) .tds-table__expand-control-container .tds-expendable-row-icon{transform:rotate(180deg)}:host(.tds-table__row-expand--active) .tds-table__row-expand{background-color:var(--tds-table-body-row-background-selected);display:table-row}:host(.tds-table__compact) .tds-table__expand-control-container{height:30px}:host(.tds-table__compact) .tds-table__row-expand .tds-table__cell-expand{padding:8px 16px 8px 66px}:host(.tds-table__row--hidden){display:none}:host(.tds-table--divider) .tds-table__cell--expand{border-right:1px solid var(--tds-table-divider)}";export{n as tds_table_body_row_expandable}

package/dist/tegel/p-957c8b27.entry.js

@@ -1 +0,0 @@
-import{r as t,h as s,H as e,g as i}from"./p-2049fab2.js";const d=["verticalDividers","compactDesign","noMinWidth"],o=class{constructor(s){t(this,s),this.cellValue=void 0,this.cellKey=void 0,this.disablePadding=!1,this.textAlign=void 0,this.textAlignState=void 0,this.activeSorting=!1,this.verticalDividers=!1,this.compactDesign=!1,this.noMinWidth=!1,this.whiteBackground=!1,this.tableId=""}internalTdsPropChangeListener(t){this.tableId===t.detail.tableId&&t.detail.changed.filter((t=>d.includes(t))).forEach((s=>{if(void 0===this[s])throw new Error(`Table prop is not supported: ${s}`);this[s]=t.detail[s]}))}internalTdsHoverListener(t){const{tableId:s,key:e}=t.detail;s===this.tableId&&(this.activeSorting=this.cellKey===e)}internalTdsTextAlignListener(t){const[s,e,i]=t.detail;this.tableId===s&&this.cellKey===e&&(this.textAlignState=this.textAlign?this.textAlign:["left","start","center","right","end"].includes(i)?i:"left")}connectedCallback(){this.tableEl=this.host.closest("tds-table"),this.tableId=this.tableEl.tableId}componentWillLoad(){d.forEach((t=>{this[t]=this.tableEl[t]})),this.textAlign&&(this.textAlignState=this.textAlign)}render(){let t="var(--tds-spacing-element-16)";return this.disablePadding?t="0":this.compactDesign&&(t="var(--tds-spacing-element-8) var(--tds-spacing-element-16)"),s(e,{key:"11e448416f213f9fdf6dea7bd5ccff4512c7a8dd",class:{"tds-table__body-cell":!0,"tds-table__body-cell--hover":this.activeSorting,"tds-table__compact":this.compactDesign,"tds-table--divider":this.verticalDividers,"tds-table--no-min-width":this.noMinWidth},style:{textAlign:this.textAlignState,padding:t}},this.cellValue,s("slot",{key:"5c7052d46ee8351e2710cf72fc4db07ff84bd843"}))}get host(){return i(this)}};o.style=":host(.tds-table__body-cell){box-sizing:border-box;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);display:table-cell;box-sizing:border-box;color:var(--tds-table-color);padding:var(--tds-spacing-element-16);min-width:192px;vertical-align:top;background-color:transparent;transition:background-color 200ms ease}:host(.tds-table__body-cell) *{box-sizing:border-box}:host(.tds-table__body-cell--hover){background-color:var(--tds-table-body-cell-background-hover)}:host(.tds-table__compact){padding:var(--tds-spacing-element-8) var(--tds-spacing-element-16)}:host(.tds-table--divider){border-right:1px solid var(--tds-table-divider)}:host(.tds-table--divider:last-of-type){border-right:none}:host(.tds-table--no-min-width){min-width:unset}";export{o as tds_body_cell}

package/dist/tegel/p-a2548553.entry.js

@@ -1 +0,0 @@
-import{r as t,h as s,H as e,g as o}from"./p-2049fab2.js";const i=["multiselect","expandableRows"],a=class{constructor(s){t(this,s),this.bodyCheckBoxClicked=()=>{const t=this.host.getElementsByClassName("tds-table__row").length,s=this.host.getElementsByClassName("tds-table__row--selected").length;this.mainCheckboxStatus=t===s},this.multiselect=!1,this.enablePaginationTableBody=!1,this.expandableRows=!1,this.multiselectArray=[],this.multiselectArrayJSON=void 0,this.mainCheckboxStatus=!1,this.columnsNumber=0,this.tableId=""}internalTdsPropChangeListener(t){this.tableId===t.detail.tableId&&t.detail.changed.filter((t=>i.includes(t))).forEach((s=>{if(void 0===this[s])throw new Error(`Table prop is not supported: ${s}`);this[s]=t.detail[s]}))}bodyCheckboxListener(){this.bodyCheckBoxClicked()}connectedCallback(){this.tableEl=this.host.closest("tds-table"),this.tableId=this.tableEl.tableId}componentWillLoad(){i.forEach((t=>{this[t]=this.tableEl[t]}))}componentWillRender(){const t=this.host.parentElement.querySelector("tds-table-header").children.length;this.columnsNumber=this.multiselect||this.expandableRows?t+1:t}render(){return s(e,{key:"891bbd417703b240531383d54d5644cf39462573","data-selected-rows":this.multiselectArrayJSON},s("slot",{key:"409bc90e7c6d49588a7ec1796cfbad734c333c40"}))}get host(){return o(this)}};a.style=":host,tds-table-body{box-sizing:border-box;display:table-row-group}:host *,tds-table-body *{box-sizing:border-box}:host .tds-table__info-message,tds-table-body .tds-table__info-message{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);display:table-cell;box-sizing:border-box;color:var(--tds-table-color);padding:var(--tds-spacing-element-16);min-width:192px;vertical-align:top;background-color:transparent;transition:background-color 200ms ease}";export{a as tds_table_body}

package/dist/tegel/p-e1842d99.entry.js

@@ -1 +0,0 @@
-import{r as t,c as e,h as a,H as s,g as o}from"./p-2049fab2.js";const i=["compactDesign","horizontalScrollWidth"];function l(t){t.target.classList.remove("tds-table__page-selector-input--shake")}const r=class{constructor(a){t(this,a),this.tdsPagination=e(this,"tdsPagination",7),this.previousPage=()=>{this.paginationValue>=2&&this.paginationValue--,this.tdsPagination.emit({tableId:this.tableId,paginationValue:Number(this.paginationValue)}),this.storeLastCorrectValue(this.paginationValue)},this.nextPage=()=>{this.paginationValue<=this.pages&&this.paginationValue++,this.tdsPagination.emit({tableId:this.tableId,paginationValue:Number(this.paginationValue)}),this.storeLastCorrectValue(this.paginationValue)},this.pagination=!1,this.paginationValue=1,this.pages=null,this.cols=null,this.columnsNumber=0,this.compactDesign=!1,this.lastCorrectValue=void 0,this.tableId="",this.horizontalScrollWidth=null}internalTdsPropChangeListener(t){this.tableId===t.detail.tableId&&t.detail.changed.filter((t=>i.includes(t))).forEach((e=>{if(void 0===this[e])throw new Error(`Table prop is not supported: ${e}`);this[e]=t.detail[e]}))}connectedCallback(){this.tableEl=this.host.closest("tds-table"),this.tableId=this.tableEl.tableId}componentWillLoad(){i.forEach((t=>{this[t]=this.tableEl[t]})),this.storeLastCorrectValue(this.paginationValue);const t=this.host.parentElement.querySelector("tds-table-header").childElementCount;this.columnsNumber=this.cols?this.cols:t}storeLastCorrectValue(t){this.lastCorrectValue=t}paginationInputChange(t){const e=Number(t.target.value);e>t.target.max||e<t.target.min?(t.target.classList.add("tds-table__page-selector-input--shake"),this.inputElement.value=String(this.lastCorrectValue),this.paginationValue=Number(this.inputElement.value)):this.paginationValue=e,this.tdsPagination.emit({tableId:this.tableId,paginationValue:Number(this.paginationValue)}),this.storeLastCorrectValue(this.paginationValue)}getStyles(){const t={};return this.horizontalScrollWidth&&(t.width=`${this.horizontalScrollWidth}px`),t}render(){return a(s,{key:"0d611bd3d31ce4dd1a7238784aa6aa6ab29d2abd",class:{"tds-table--compact":this.compactDesign,"footer__horizontal-scroll":!!this.horizontalScrollWidth},style:this.getStyles()},a("tr",{key:"cb4fc7ffecfa791f08a3da4a167459ccfb32e782",class:"tds-table__footer-row"},a("td",{key:"bf7388bc8aa26313cadba5333dc587d431a29867",class:"tds-table__footer-cell",colSpan:this.columnsNumber},this.pagination&&a("div",{key:"ace766078c85f047034ac614712dc58b6dc7b540",class:"tds-table__pagination"},a("div",{key:"0ef2c3c300bab7595773b65aa40da1399af4b7b8",class:"tds-table__row-selector"}),a("div",{key:"3fe2283dcbfd64fb54bd8faa9bd269dac22e81d8",class:"tds-table__page-selector"},a("input",{key:"84295a91900f676742795c975f1706d4fbe196f6",ref:t=>this.inputElement=t,class:"tds-table__page-selector-input",type:"number",min:"1",max:this.pages,value:this.paginationValue,pattern:"[0-9]+",dir:"ltr",onChange:t=>this.paginationInputChange(t),onAnimationEnd:l}),a("p",{key:"88c7d7d7cfe66f2431b44c9ed38ebee5771f54b7",class:"tds-table__footer-text"},"of ",a("span",{key:"42cf669a05c6e0e86a56aa568f2623c562bf83f6"},this.pages)," pages"),a("button",{key:"3f022e45c6ca31ce542854c5e659349ab54b372a",type:"button",class:"tds-table__footer-btn",disabled:this.paginationValue<=1,onClick:()=>this.previousPage()},a("tds-icon",{key:"253b1cb33d4038ce03ff8fdb0bad30ba46ab0c13",name:"chevron_left",size:"20px"})),a("button",{key:"ad21b63c30fc638372c89bb366be77df419bf532",type:"button",class:"tds-table__footer-btn",disabled:this.paginationValue>=this.pages,onClick:()=>this.nextPage()},a("tds-icon",{key:"58a640745984554b8c7cba3ce07130063299223e",name:"chevron_right",size:"20px"})))))))}get host(){return o(this)}};r.style=":host{box-sizing:border-box;display:table-footer-group;height:48px}:host *{box-sizing:border-box}:host .tds-table__footer-row{background-color:var(--tds-table-footer-background);color:var(--tds-table-color)}:host .tds-table__footer-cell{padding:0 16px}:host .tds-table__footer-cell .tds-table__pagination{height:48px;display:flex;align-items:center;justify-content:space-between}:host .tds-table__footer-cell .tds-table__pagination .tds-table__row-selector,:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector{display:flex;align-items:center}:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);background-color:var(--tds-table-footer-page-selector-input-background);color:var(--tds-table-color);width:54px;height:30px;border:none;border-radius:4px;transition:background-color 250ms ease;margin-right:4px;padding-left:16px}:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input:hover{background-color:var(--tds-table-footer-page-selector-input-background-hover)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input:disabled{color:var(--tds-table-footer-page-selector-input-color-disabled)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input--shake{animation:tds-shake-animation 0.5s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;transform:translate3d(0, 0, 0);backface-visibility:hidden;perspective:1000px}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-text{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:1px 8px 0 0}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn{display:flex;justify-content:center;align-items:center;border:none;background-color:transparent;cursor:pointer;height:32px;width:32px;border-radius:4px;transition:background-color 250ms ease;color:var(--tds-table-footer-page-selector-icon)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn:hover{background-color:var(--tds-table-footer-btn-hover)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn:disabled{cursor:default;color:var(--tds-table-footer-page-selector-icon-disabled)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn:disabled:hover{background-color:transparent}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn-svg{height:20px;width:20px;fill:var(--tds-table-color)}:host(.tds-table--compact){height:32px}:host(.tds-table--compact) .tds-table__footer-cell .tds-table__pagination{height:32px}:host(.tds-table--compact) .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input{height:24px}:host(.tds-table--compact) .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn{height:28px;width:28px}:host(.footer__horizontal-scroll){display:inline-table;position:absolute;margin-top:10px}@keyframes tds-shake-animation{10%,90%{transform:translate3d(-1px, 0, 0)}20%,80%{transform:translate3d(2px, 0, 0)}30%,50%,70%{transform:translate3d(-4px, 0, 0)}40%,60%{transform:translate3d(4px, 0, 0)}}";export{r as tds_table_footer}

package/dist/tegel/p-e7fac8ad.entry.js

@@ -1 +0,0 @@
-import{r as t,c as s,h as o,H as r,g as l}from"./p-2049fab2.js";import{g as a}from"./p-11648030.js";const e=class{constructor(o){t(this,o),this.internalTdsTablePropChange=s(this,"internalTdsTablePropChange",6),this.verticalDividers=!1,this.compactDesign=!1,this.noMinWidth=void 0,this.multiselect=!1,this.expandableRows=!1,this.responsive=!1,this.modeVariant=null,this.horizontalScrollWidth=null,this.tableId=a(),this.enableHorizontalScrollToolbarDesign=!1,this.enableHorizontalScrollFooterDesign=!1}emitInternalTdsPropChange(t,s){this.internalTdsTablePropChange.emit({tableId:this.tableId,changed:[t],[t]:s})}async getSelectedRows(){let t=[];const s=this.host.querySelector("tds-table-body");return Array.from(s.querySelectorAll("tds-table-body-row")).filter((t=>t.selected)).forEach((s=>{let o=[];Array.from(s.getElementsByTagName("tds-body-cell")).forEach((t=>{var s;const r={cellKey:null,cellValue:null};r.cellKey=t.cellKey,r.cellValue=null!==(s=t.cellValue)&&void 0!==s?s:t.innerText,o=[...o,r]})),t=[...t,o]})),t}getStyles(){const t={};return this.horizontalScrollWidth&&(t.width=`${this.horizontalScrollWidth}px`),t}multiselectChanged(t){this.emitInternalTdsPropChange("multiselect",t)}enableExpandableRowsChanged(t){this.emitInternalTdsPropChange("expandableRows",t)}compactDesignChanged(t){this.emitInternalTdsPropChange("compactDesign",t)}verticalDividersChanged(t){this.emitInternalTdsPropChange("verticalDividers",t)}noMinWidthChanged(t){this.emitInternalTdsPropChange("noMinWidth",t)}modeVariantChanged(t){this.emitInternalTdsPropChange("modeVariant",t)}widthChanged(t){this.emitInternalTdsPropChange("horizontalScrollWidth",t)}componentWillRender(){this.horizontalScrollWidth&&(this.enableHorizontalScrollToolbarDesign=this.host.closest("tds-table").getElementsByTagName("tds-table-toolbar").length>=1,this.enableHorizontalScrollFooterDesign=this.host.closest("tds-table").getElementsByTagName("tds-table-footer").length>=1)}render(){return o(r,{key:"580c1c90c9f4556b16037c3200ae739a891bea88",class:{"tds-table--responsive":this.responsive,"tds-mode-variant-primary":"primary"===this.modeVariant,"tds-mode-variant-secondary":"secondary"===this.modeVariant}},o("table",{key:"f2e9d248c5e93e6d83cfcd74408f99ed54c1ae95",style:this.getStyles(),class:{"tds-table":!0,"tds-table--compact":this.compactDesign,"tds-table--divider":this.verticalDividers,"tds-table--no-min-width":this.noMinWidth,"tds-table--responsive":this.responsive,"tds-table--horizontal-scroll":!!this.horizontalScrollWidth,"tds-table--horizontal-scroll-toolbar":this.enableHorizontalScrollToolbarDesign&&!this.compactDesign,"tds-table--horizontal-scroll-toolbar-compact":this.enableHorizontalScrollToolbarDesign&&this.compactDesign,"tds-table--horizontal-scroll-footer":this.enableHorizontalScrollFooterDesign&&!this.compactDesign,"tds-table--horizontal-scroll-footer-compact":this.enableHorizontalScrollFooterDesign&&this.compactDesign}},o("slot",{key:"74edfe5bc755d4a7880b1368452f2906ebc5346a"})))}get host(){return l(this)}static get watchers(){return{multiselect:["multiselectChanged"],expandableRows:["enableExpandableRowsChanged"],compactDesign:["compactDesignChanged"],verticalDividers:["verticalDividersChanged"],noMinWidth:["noMinWidthChanged"],modeVariant:["modeVariantChanged"],horizontalScrollWidth:["widthChanged"]}}};e.style=":host{--tds-scrollbar-width-standard:thin;--tds-scrollbar-width:10px;--tds-scrollbar-height:10px;--tds-scrollbar-thumb-border-width:3px;--tds-scrollbar-thumb-border-hover-width:2px}body{scrollbar-width:thin}:host,.tds-table{border-collapse:collapse;display:table;box-sizing:border-box}:host *,.tds-table *{box-sizing:border-box}:host(.tds-table--responsive),.tds-table--responsive{width:100%}.tds-table--horizontal-scroll{display:block;overflow-x:scroll;white-space:nowrap}.tds-table--horizontal-scroll:hover::-webkit-scrollbar-thumb{border:var(--tds-scrollbar-thumb-border-hover-width) solid transparent;background:var(--tds-scrollbar-hover-thumb-color);background-clip:padding-box}.tds-table--horizontal-scroll::-webkit-scrollbar{height:var(--tds-scrollbar-height)}.tds-table--horizontal-scroll::-webkit-scrollbar-track{background:var(--tds-scrollbar-track-color)}.tds-table--horizontal-scroll::-webkit-scrollbar-thumb{border-radius:40px;background:var(--tds-scrollbar-thumb-color);border:var(--tds-scrollbar-thumb-border-width) solid transparent;background-clip:padding-box}.tds-table--horizontal-scroll::-webkit-scrollbar-button{height:0;width:0}@supports not selector(::-webkit-scrollbar){.tds-table--horizontal-scroll{scrollbar-color:var(--tds-scrollbar-thumb-color) var(--tds-scrollbar-track-color);scrollbar-width:var(--tds-scrollbar-width-standard)}}.tds-table--horizontal-scroll-toolbar{margin-top:64px}.tds-table--horizontal-scroll-toolbar-compact{margin-top:56px}.tds-table--horizontal-scroll-footer{margin-bottom:49px}.tds-table--horizontal-scroll-footer-compact{margin-bottom:33px}";export{e as tds_table}