@scania/tegel 1.42.0 → 1.44.0-sonarcloud-0

package/dist/cjs/tds-step.cjs.entry.js

@@ -27,6 +27,8 @@ const TdsStep = class {
     /* Needs to be onload to do this on any updates. */
     componentWillLoad() {
         this.stepperEl = this.el.closest('tds-stepper');
+        if (!this.stepperEl)
+            return;
         this.orientation = this.stepperEl.orientation;
         this.labelPosition = this.stepperEl.labelPosition;
         this.size = this.stepperEl.size;
@@ -46,7 +48,7 @@ const TdsStep = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '871df74d99ed0bdf15fa82e0c2980b08b94735a8' }, index.h("div", { key: 'e108eb5e43390635fbd6020195cb7e6a4912c7c2', role: "listitem", "aria-disabled": this.state === 'upcoming' ? 'true' : 'false', "aria-current": this.tdsAriaCurrent, tabIndex: -1, "aria-label": `Step ${this.index}: ${this.state}`, class: `${this.size} ${this.orientation} text-${this.labelPosition} ${this.hideLabels ? 'hide-labels' : ''}` }, index.h("span", { key: '8940a00dcd0001d6d264aff8cbc9331d4d890d49', class: `${this.state} content-container` }, this.state === 'success' || this.state === 'error' ? (index.h("tds-icon", { "aria-hidden": "true", svgTitle: `tds-step-icon-${this.stepperId}`, class: 'tds-step-icon', name: this.state === 'success' ? 'tick' : 'warning', size: this.size === 'lg' ? '20px' : '16px' })) : (index.h("span", { "aria-hidden": "true", class: "index-container" }, this.index))), !this.hideLabels && (index.h("div", { key: 'daa62f4d9347c571d214b1b9eb68b7d56418aed2', "aria-hidden": "true", class: `label ${this.size} ${this.state}` }, index.h("slot", { key: '68a20d3daded858cf1188f43747edb77ed2c9cbf', name: "label" }))))));
+        return (index.h(index.Host, { key: '0589d81b64f547deb8f0d9db7c9d377ee9d8db67' }, index.h("div", { key: '7d01660a996d9c3a63b6c9765aa9e97a3c465f72', role: "listitem", "aria-disabled": this.state === 'upcoming' ? 'true' : 'false', "aria-current": this.tdsAriaCurrent, tabIndex: -1, "aria-label": `Step ${this.index}: ${this.state}`, class: `${this.size} ${this.orientation} text-${this.labelPosition} ${this.hideLabels ? 'hide-labels' : ''}` }, index.h("span", { key: 'f11f36b998a8b40842517a4032fe25aad488ccf3', class: `${this.state} content-container` }, this.state === 'success' || this.state === 'error' ? (index.h("tds-icon", { "aria-hidden": "true", svgTitle: `tds-step-icon-${this.stepperId}`, class: 'tds-step-icon', name: this.state === 'success' ? 'tick' : 'warning', size: this.size === 'lg' ? '20px' : '16px' })) : (index.h("span", { "aria-hidden": "true", class: "index-container" }, this.index))), !this.hideLabels && (index.h("div", { key: '0e707ca85c128c486906e893f20f7a171ef693f7', "aria-hidden": "true", class: `label ${this.size} ${this.state}` }, index.h("slot", { key: '265d2e99ba2b59749a1ee841895127c90c7750ac', name: "label" }))))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/tds-stepper.cjs.entry.js

@@ -53,7 +53,7 @@ const TdsStepper = class {
         });
     }
     render() {
-        return (index.h(index.Host, { key: '83520f04716c1a9314858780bcd31d63b6fd1192' }, index.h("div", { key: '5b024281e8bc253f9790b0670c7c1d78b897e49a', role: "list", "aria-label": this.tdsAriaLabel, class: `${this.orientation} text-position-${this.labelPosition} ${this.size}` }, index.h("slot", { key: '271835f2b05c6ec8ecf34433897848e23a02da03' }))));
+        return (index.h(index.Host, { key: 'a62077cf8b1936e7109eea64cad0ceb67a45c676' }, index.h("div", { key: 'f958fcd53b074ac8ac72d055162e738116e94956', role: "list", "aria-label": this.tdsAriaLabel, class: `${this.orientation} text-position-${this.labelPosition} ${this.size}` }, index.h("slot", { key: 'e9dfa6c14ec134baafe5a58394337b09ca091809' }))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/tds-table-body-input-wrapper.cjs.entry.js

@@ -90,7 +90,7 @@ const TdsTableBodyInputWrapper = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '1ebf0bf16490030ce20a99e1234e68d81430eaf8', class: {
+        return (index.h(index.Host, { key: 'ad9ea213210029f368ef88ecb62db60a0d79843d', class: {
                 'focused-input-wrapper': this.inputFocused,
                 'show-icon': this.showIcon,
                 'tds-table__compact': this.compactDesign,

package/dist/cjs/tds-table-body-row-expandable.cjs.entry.js

@@ -75,24 +75,30 @@ const TdsTableBodyRowExpandable = class {
         this.tdsChange.emit({ rowId: this.rowId, isExpanded: this.isExpanded, tableId: this.tableId });
     }
     connectedCallback() {
+        var _a;
         /* if user did set a prop we use that as default behaviour */
         if (this.expanded !== undefined) {
             this.isExpanded = this.expanded;
         }
         this.tableEl = this.host.closest('tds-table');
-        this.tableId = this.tableEl.tableId;
+        this.tableId = (_a = this.tableEl) === null || _a === void 0 ? void 0 : _a.tableId;
     }
     componentWillLoad() {
         relevantTableProps.forEach((tablePropName) => {
-            this[tablePropName] = this.tableEl[tablePropName];
+            var _a;
+            this[tablePropName] = (_a = this.tableEl) === null || _a === void 0 ? void 0 : _a[tablePropName];
         });
     }
     componentWillRender() {
+        var _a;
         if (this.colSpan !== null) {
             this.columnsNumber = this.colSpan;
         }
         else {
-            this.columnsNumber = this.tableEl.querySelector('tds-table-header').childElementCount + 1;
+            const header = (_a = this.tableEl) === null || _a === void 0 ? void 0 : _a.querySelector('tds-table-header');
+            if (header) {
+                this.columnsNumber = header.childElementCount + 1;
+            }
         }
     }
     sendValue() {
@@ -104,26 +110,27 @@ const TdsTableBodyRowExpandable = class {
         this.sendValue();
     }
     render() {
-        return (index.h(index.Host, { key: '3d289d00082c284257728cec4f0ddcfc63dda863', class: {
+        var _a;
+        return (index.h(index.Host, { key: '9747b45c606d94f6a79e35afd1e126e0d4940761', class: {
                 'tds-table__row': true,
                 'tds-table__row-expand--active': this.isExpanded,
                 'tds-table__compact': this.compactDesign,
                 'tds-table--divider': this.verticalDividers,
-            } }, index.h("tr", { key: '246ee336a3ab871346e1fcf81f02109121dc9657', id: `expandable-content-${this.rowId}`, class: {
+            } }, index.h("tr", { key: 'c3eb7c452c55cd64393d4d0820983a450b3c83de', id: `expandable-content-${this.rowId}`, class: {
                 'tds-table__row': true,
                 'tds-table__row--expanded': this.isExpanded,
-            }, part: "row" }, index.h("td", { key: 'b727b78965a4bdf0b6cf8ff7e8460d3dfae8327e', class: {
+            }, part: "row" }, index.h("td", { key: 'a269a53c209ac33f82475c92408a824194feea0d', class: {
                 'tds-table__cell-expand': true,
-            } }, index.h("label", { key: 'c878be3429a3145b62b242f2e3d9c90ec0a74257', class: "tds-table__expand-control-container" }, index.h("input", { key: '6b99ef165e359012f83f7e298d9f83319493fc52', class: "tds-table__expand-input", type: "checkbox", onChange: (event) => this.onChangeHandler(event), checked: this.isExpanded, "aria-expanded": this.isExpanded ? 'true' : 'false', "aria-controls": `expandable-content-${this.rowId}`, "aria-label": this.tdsAriaLabelExpandButton }), index.h("span", { key: 'ec9e1aefc553362c0c3e15cb99118a9c2dfffd04', class: "tds-expendable-row-icon" }, index.h("svg", { key: '84b3270e5f1bfc7671adcea34d862fe0485f40a8', fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 32 32" }, index.h("path", { key: 'fc04209a4a2d35c19c7c74875c0ab302077abbf2', "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" }))))), index.h("slot", { key: '0c16341da217fbe920241a97b179335cb61e2364' })), index.h("tr", { key: 'a83ca5c30ec4945dfee096a408db4d1d240d3643', class: {
+            } }, index.h("label", { key: '3a32f175d6f584850e442a279818bbdec8fbc00a', class: "tds-table__expand-control-container" }, index.h("input", { key: '073584fdeda9b0aa6dc6fa51030ee84c1478f3a4', class: "tds-table__expand-input", type: "checkbox", onChange: (event) => this.onChangeHandler(event), checked: this.isExpanded, "aria-expanded": this.isExpanded ? 'true' : 'false', "aria-controls": `expandable-content-${this.rowId}`, "aria-label": this.tdsAriaLabelExpandButton }), index.h("span", { key: 'd3782b0bb66e7ac420c94eaa310a18ec97de34a8', class: "tds-expendable-row-icon" }, index.h("svg", { key: 'd25d24e492917ecea514da86a7e92238089bfe3c', fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 32 32" }, index.h("path", { key: '1849dbf3a843f1f98a415a0017ad32951e0af4ff', "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" }))))), index.h("slot", { key: 'c6af8843f62b83e6e96e3ea65087c276c0fb6e4f' })), index.h("tr", { key: '12d8127b203fd91f1b0a767b47aa752d84016aed', class: {
                 'tds-table__row-expand': true,
                 'tds-table__row-expand--expanded': this.isExpanded,
-            }, part: "expand-row" }, index.h("td", { key: '2fcafe17b33ce39b5e1a3b149434006a70f6b8f3', class: {
+            }, part: "expand-row" }, index.h("td", { key: '9bd6d1292ede611479fe3f59239ca0ae1257fddc', class: {
                 'tds-table__cell-expand': true,
                 'tds-table__cell-expand--overflow-hidden': this.overflow === 'hidden',
                 'tds-table__cell-expand--overflow-visible': this.overflow === 'visible',
-            }, part: "expand-row-cell", colSpan: this.columnsNumber }, index.h("div", { key: 'b696b23d127e32a8017692b03de1ce8ee9497dcb', style: {
+            }, part: "expand-row-cell", colSpan: (_a = this.columnsNumber) !== null && _a !== void 0 ? _a : undefined }, index.h("div", { key: '6cfcd733564c5e6d1b55f6029e80e2b5713988d5', style: {
                 overflow: this.overflow,
-            } }, index.h("slot", { key: 'e64e00778fd7c85618ae4cbc19d232e2acb873b5', name: "expand-row" }))))));
+            } }, index.h("slot", { key: 'fa74913d8c68ad2fbfc359fe9d67f27b9b254d28', name: "expand-row" }))))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/tds-table-body-row.cjs.entry.js

@@ -28,17 +28,19 @@ const TdsTableBodyRow = class {
         this.tableId = '';
     }
     async handleCheckboxChange(event) {
+        var _a;
         this.selected = event.detail.checked;
         this.tdsSelect.emit({
             tableId: this.tableId,
             checked: this.selected,
-            selectedRows: await this.tableEl.getSelectedRows(),
+            selectedRows: await ((_a = this.tableEl) === null || _a === void 0 ? void 0 : _a.getSelectedRows()),
         });
     }
     handleRowClick(e) {
+        var _a, _b, _c;
         if (!this.clickable)
             return;
-        let rowIndex = Array.from(this.host.parentElement.children).indexOf(this.host);
+        const rowIndex = Array.from((_c = (_b = (_a = this.host) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.children) !== null && _c !== void 0 ? _c : []).indexOf(this.host);
         this.tdsClick.emit({
             event: e,
             tableId: this.tableId,
@@ -71,18 +73,19 @@ const TdsTableBodyRow = class {
     componentWillLoad() {
         if (this.tableEl) {
             relevantTableProps.forEach((tablePropName) => {
-                this[tablePropName] = this.tableEl[tablePropName];
+                var _a;
+                this[tablePropName] = (_a = this.tableEl) === null || _a === void 0 ? void 0 : _a[tablePropName];
             });
         }
     }
     render() {
-        return (index.h(index.Host, { key: '6bf3fee7c066bc4686c9aa0ecba45c04ca7b2aae', tabindex: this.clickable ? '0' : null, class: {
+        return (index.h(index.Host, { key: '94bac5b3613998d805d62da4ce0ca9480e337fbc', tabindex: this.clickable ? '0' : null, class: {
                 'tds-table__row': true,
                 'tds-table__row--selected': this.selected,
                 'tds-table__compact': this.compactDesign,
                 'tds-table--divider': this.verticalDividers,
                 'tds-table__row--clickable': this.clickable,
-            }, onClick: (e) => this.handleRowClick(e), onKeyDown: (e) => this.handleKeyDown(e), role: "row" }, this.multiselect && (index.h("td", { key: '845e64408b938254887c7ec840eae48fc4ed01e3', class: "tds-table__body-cell tds-table__body-cell--checkbox tds-form-label tds-form-label--table" }, index.h("tds-checkbox", { key: '817ef05632a9b2704148a0c9ce190b360b9cec3b', onTdsChange: (event) => this.handleCheckboxChange(event), checked: this.selected, disabled: this.disabled }))), index.h("slot", { key: '50cf1a5aeae24aaceeb813f432abe8e75ad53857' })));
+            }, onClick: (e) => this.handleRowClick(e), onKeyDown: (e) => this.handleKeyDown(e), role: "row" }, this.multiselect && (index.h("td", { key: 'cb823140e532475537b7f7e78ae667173fa49259', class: "tds-table__body-cell tds-table__body-cell--checkbox tds-form-label tds-form-label--table" }, index.h("tds-checkbox", { key: 'f4727dca32c80f8c0ec36995f0ac072fc7af1106', onTdsChange: (event) => this.handleCheckboxChange(event), checked: this.selected, disabled: this.disabled }))), index.h("slot", { key: '33046cf6051498b6b1b314f8d7dd380b4c2309d0' })));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/tds-table-body.cjs.entry.js

@@ -24,7 +24,7 @@ const TdsTableBody = class {
         this.enablePaginationTableBody = false;
         this.expandableRows = false;
         this.multiselectArray = [];
-        this.multiselectArrayJSON = undefined;
+        this.multiselectArrayJSON = '';
         this.mainCheckboxStatus = false;
         this.columnsNumber = 0;
         this.zebraMode = 'none';
@@ -47,16 +47,20 @@ const TdsTableBody = class {
         this.bodyCheckBoxClicked();
     }
     connectedCallback() {
+        var _a;
         this.tableEl = this.host.closest('tds-table');
-        this.tableId = this.tableEl.tableId;
+        this.tableId = (_a = this.tableEl) === null || _a === void 0 ? void 0 : _a.tableId;
     }
     componentWillLoad() {
         relevantTableProps.forEach((tablePropName) => {
-            this[tablePropName] = this.tableEl[tablePropName];
+            var _a;
+            this[tablePropName] = (_a = this.tableEl) === null || _a === void 0 ? void 0 : _a[tablePropName];
         });
     }
     componentWillRender() {
-        const headerColumnsNo = this.host.parentElement.querySelector('tds-table-header').children.length;
+        var _a, _b;
+        const headrColumn = (_a = this.host.parentElement) === null || _a === void 0 ? void 0 : _a.querySelector('tds-table-header');
+        const headerColumnsNo = (_b = headrColumn === null || headrColumn === void 0 ? void 0 : headrColumn.children.length) !== null && _b !== void 0 ? _b : 0;
         // multiselect and expended features requires one extra column for controls...
         if (this.multiselect || this.expandableRows) {
             this.columnsNumber = headerColumnsNo + 1;
@@ -66,12 +70,12 @@ const TdsTableBody = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'f9472ae9b1dcad43aab101811dfe858dea4851e9', "data-selected-rows": this.multiselectArrayJSON, class: {
+        return (index.h(index.Host, { key: '38f8bf195ef802dbf2ee50e5ea6eb1ecc6d35549', "data-selected-rows": this.multiselectArrayJSON, class: {
                 'tds-table--zebra-mode-rows-odd': this.zebraMode === 'rows-odd',
                 'tds-table--zebra-mode-rows-even': this.zebraMode === 'rows-even',
                 'tds-table--zebra-mode-columns-odd': this.zebraMode === 'columns-odd',
                 'tds-table--zebra-mode-columns-even': this.zebraMode === 'columns-even',
-            } }, index.h("slot", { key: '61a0ec649d2f7f51ca386c46335a6ae018c993d0' })));
+            } }, index.h("slot", { key: '30787d97aa3a0f2a1f447d7ebc5434b6345fd7c3' })));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/tds-table-footer.cjs.entry.js

@@ -45,7 +45,7 @@ const TdsTableFooter = class {
         this.nextPage = () => {
             /** If pages and greater or equal to the number of pages, increase pagination value.
              * This is to not get above the number of pages in pagination value.  */
-            if (this.paginationValue <= this.pages) {
+            if (this.pages && this.paginationValue <= this.pages) {
                 this.paginationValue++;
             }
             this.emitTdsPagination();
@@ -65,11 +65,11 @@ const TdsTableFooter = class {
         this.paginationValue = 1;
         this.rowsperpage = true;
         this.rowsPerPageValues = [10, 25, 50];
-        this.pages = null;
+        this.pages = 0;
         this.cols = null;
         this.columnsNumber = 0;
         this.compactDesign = false;
-        this.lastCorrectValue = undefined;
+        this.lastCorrectValue = 1;
         this.tableId = '';
         this.horizontalScrollWidth = null;
         this.rowsPerPageValue = this.rowsPerPageValues[0];
@@ -87,16 +87,19 @@ const TdsTableFooter = class {
         }
     }
     connectedCallback() {
+        var _a;
         this.tableEl = this.host.closest('tds-table');
-        this.tableId = this.tableEl.tableId;
+        this.tableId = (_a = this.tableEl) === null || _a === void 0 ? void 0 : _a.tableId;
     }
     componentWillLoad() {
+        var _a, _b, _c;
         relevantTableProps.forEach((tablePropName) => {
-            this[tablePropName] = this.tableEl[tablePropName];
+            var _a;
+            this[tablePropName] = (_a = this.tableEl) === null || _a === void 0 ? void 0 : _a[tablePropName];
         });
         this.storeLastCorrectValue(this.paginationValue);
         /** Get the number of columns. */
-        const numberOfColumns = this.host.parentElement.querySelector('tds-table-header').childElementCount;
+        const numberOfColumns = (_c = (_b = (_a = this.host.parentElement) === null || _a === void 0 ? void 0 : _a.querySelector('tds-table-header')) === null || _b === void 0 ? void 0 : _b.childElementCount) !== null && _c !== void 0 ? _c : 0;
         if (this.cols) {
             this.columnsNumber = this.cols;
         }
@@ -137,12 +140,16 @@ const TdsTableFooter = class {
     }
     render() {
         var _a;
-        return (index.h(index.Host, { key: 'd064beda251b663ad3afccebc98fb4718e3f1d09', class: {
+        return (index.h(index.Host, { key: '96d07c2b5e5b667c809b949d68f65be571ad1235', class: {
                 'tds-table--compact': this.compactDesign,
                 'footer__horizontal-scroll': !!this.horizontalScrollWidth,
-            }, style: this.getStyles() }, index.h("tr", { key: '02d6c97e498e44ad70c86fd08cc665a8b89e2a07', class: "tds-table__footer-row" }, index.h("td", { key: 'e9d64ea0f3be240867d886973a40c557fe9899da', class: "tds-table__footer-cell", colSpan: this.columnsNumber }, this.pagination && (index.h("div", { key: '4a8f3f921a4e103a1a14e368a4702cd8f6ceb18b', class: "tds-table__pagination" }, index.h("div", { key: 'c536fb9916071677bf20f033ebb184d469aa0774', class: "tds-table__row-selector" }, this.rowsperpage && ((_a = this.rowsPerPageValues) === null || _a === void 0 ? void 0 : _a.length) > 0 && (index.h("div", { key: '5a935d6c92a574e1ea0a081e955916526ec9da45', class: "rows-per-page" }, index.h("p", { key: 'ae9f908bc6803a814236a56e5801857a1989df54' }, "Rows per page"), index.h("tds-dropdown", { key: '1bcac2201accc7d613250c8f38b77ddc04bfb463', modeVariant: "secondary", id: "rows-dropdown", class: "page-dropdown", size: "xs", defaultValue: `${this.rowsPerPageValues[0]}`, onTdsChange: (event) => this.rowsPerPageChange(event) }, this.rowsPerPageValues.map((value) => {
+            }, style: this.getStyles() }, index.h("tr", { key: '418f2868d0c4e5366f94d725b6cf3e7aa0346f27', class: "tds-table__footer-row" }, index.h("td", { key: '8734d546ea3cfba0738c4daf78242e4a5e5397ea', class: "tds-table__footer-cell", colSpan: this.columnsNumber }, this.pagination && (index.h("div", { key: 'b348c2a48e321423523f1b2a46b916a90dc94889', class: "tds-table__pagination" }, index.h("div", { key: '5ddf22f56fda6e794e34b5e11cc0f84842c9efde', class: "tds-table__row-selector" }, this.rowsperpage && ((_a = this.rowsPerPageValues) === null || _a === void 0 ? void 0 : _a.length) > 0 && (index.h("div", { key: '39c3a7bdc7627c7710735804a121165d0fb204c8', class: "rows-per-page" }, index.h("p", { key: '0e33895d223c3e456f7847137a2242170ebea58b' }, "Rows per page"), index.h("tds-dropdown", { key: 'efdaba5e2e40e0bb6eaee4b2fa3ac86a36dd99e7', modeVariant: "secondary", id: "rows-dropdown", class: "page-dropdown", size: "xs", defaultValue: `${this.rowsPerPageValues[0]}`, onTdsChange: (event) => this.rowsPerPageChange(event) }, this.rowsPerPageValues.map((value) => {
             return (index.h("tds-dropdown-option", { value: `${value}` }, value));
-        }))))), index.h("div", { key: '08f90bbe4dd64812b95de4be540c65afea1a5d7c', class: "tds-table__page-selector" }, index.h("input", { key: '4e780ad0a24f39df03edc044d110b6278589a61a', ref: (element) => (this.inputElement = element), class: "tds-table__page-selector-input", type: "number", min: "1", max: this.pages, value: this.paginationValue, pattern: "[0-9]+", dir: "ltr", onChange: (event) => this.paginationInputChange(event), onAnimationEnd: removeShakeAnimation }), index.h("p", { key: '538690df3c6bef86bf14fe8b7c967b89257e5cb7', class: "tds-table__footer-text" }, "of ", index.h("span", { key: 'ec38ac0b07103bea8aec7ba3e7e88d73c2a756cb' }, this.pages), " pages"), index.h("button", { key: 'f196e4b87144a6e66a6a3d0451ca0d4ba32bd1af', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue <= 1, onClick: () => this.firstPage() }, index.h("tds-icon", { key: '80041ff46837e3ba072b740cf79d1cf9bbf21b63', name: "skip_backwards", size: "20px" })), index.h("button", { key: 'c51d570daeb97dbe2cae4e344eb51b97d88bb10a', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue <= 1, onClick: () => this.previousPage() }, index.h("tds-icon", { key: 'bc02c69dc75f412fac63d952458d0ea06530593c', name: "chevron_left", size: "20px" })), index.h("button", { key: 'df29a47121d892642b24533a0e132d1f2d13d545', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue >= this.pages, onClick: () => this.nextPage() }, index.h("tds-icon", { key: 'b2ae455a7a62c647f5c79cfc8f41bcae4b41b12d', name: "chevron_right", size: "20px" })), index.h("button", { key: 'd333d73217b7ed86841810bd342e2dd3152ef560', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue >= this.pages, onClick: () => this.lastPage() }, index.h("tds-icon", { key: '9d94abd5c17bc50b6a33c21dcc74b2689d514f2a', name: "skip_forward", size: "20px" })))))))));
+        }))))), index.h("div", { key: 'aa4872b13712174bfa21c94b15b93816c713fd29', class: "tds-table__page-selector" }, index.h("input", { key: 'fa1964c83ec002ccc6e4061ae1f8596d9ee15836', ref: (element) => {
+                if (element) {
+                    this.inputElement = element;
+                }
+            }, class: "tds-table__page-selector-input", type: "number", min: "1", max: this.pages, value: this.paginationValue, pattern: "[0-9]+", dir: "ltr", onChange: (event) => this.paginationInputChange(event), onAnimationEnd: removeShakeAnimation }), index.h("p", { key: 'a8b07a6e86e18800f7681eca6377a722f12069ac', class: "tds-table__footer-text" }, "of ", index.h("span", { key: '17019da6fe48ec045f5d1335d8c08a273dc0ac6a' }, this.pages), " pages"), index.h("button", { key: 'daa1446d15681d297a024bfa8da1ec2173ed921c', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue <= 1, onClick: () => this.firstPage() }, index.h("tds-icon", { key: '6abd73717c6c232ef603f749f68da72600bf48e8', name: "skip_backwards", size: "20px" })), index.h("button", { key: '1ea33dbc2d1bcdb0b3613a312a43997bfbc39a55', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue <= 1, onClick: () => this.previousPage() }, index.h("tds-icon", { key: '66c0d727d030b343d387b293f7cef4773f54e6b1', name: "chevron_left", size: "20px" })), index.h("button", { key: '05f18129f73975b81f252721b0f33686e32b8211', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue >= this.pages, onClick: () => this.nextPage() }, index.h("tds-icon", { key: '120e02ba680a6dad5cdfaed8002467d8f09565ad', name: "chevron_right", size: "20px" })), index.h("button", { key: '58e65e438020594246c0f64fc06c751b13879ee3', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue >= this.pages, onClick: () => this.lastPage() }, index.h("tds-icon", { key: '9ea98a3a7f40a9051eb46e300e5d5128dc01a95c', name: "skip_forward", size: "20px" })))))))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/tds-table-header-input-wrapper.cjs.entry.js

@@ -72,7 +72,7 @@ const TdsTableHeaderInputWrapper = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '62070c88b54c313b2db10890023db32f0eaf66b5', class: {
+        return (index.h(index.Host, { key: '76de40e0a578e0592d9c85d278d65187d84d7573', class: {
                 'focused-input-wrapper': this.inputFocused,
                 'show-icon': this.showIcon,
                 'tds-table__compact': this.compactDesign,

package/dist/cjs/tds-table-header.cjs.entry.js

@@ -54,46 +54,52 @@ const TdsTableHeaderRow = class {
         }
     }
     bodyExpandClicked() {
-        const numberOfExtendRowsActive = this.host.parentElement
-            .querySelector('tds-table-body')
-            .getElementsByClassName('tds-table__row-extend--active').length;
-        const numberOfExtendRows = this.host.parentElement
-            .querySelector('tds-table-body')
-            .getElementsByTagName('tds-table-body-row-expendable').length;
-        if (numberOfExtendRows === numberOfExtendRowsActive) {
-            this.mainExpendSelected = true;
-        }
-        else {
-            this.mainExpendSelected = false;
+        var _a;
+        const parentBody = (_a = this.host.parentElement) === null || _a === void 0 ? void 0 : _a.querySelector('tds-table-body');
+        if (parentBody) {
+            const numberOfExtendRowsActive = parentBody.getElementsByClassName('tds-table__row-extend--active').length;
+            const numberOfExtendRows = parentBody.getElementsByTagName('tds-table-body-row-expendable').length;
+            if (numberOfExtendRows === numberOfExtendRowsActive) {
+                this.mainExpendSelected = true;
+            }
+            else {
+                this.mainExpendSelected = false;
+            }
         }
     }
     connectedCallback() {
+        var _a;
         this.tableEl = this.host.closest('tds-table');
-        this.tableId = this.tableEl.tableId;
+        this.tableId = (_a = this.tableEl) === null || _a === void 0 ? void 0 : _a.tableId;
     }
     componentWillLoad() {
         relevantTableProps.forEach((tablePropName) => {
-            this[tablePropName] = this.tableEl[tablePropName];
+            var _a;
+            this[tablePropName] = (_a = this.tableEl) === null || _a === void 0 ? void 0 : _a[tablePropName];
         });
     }
     componentWillRender() {
-        this.enableToolbarDesign =
-            this.host.closest('tds-table').getElementsByTagName('tds-table-toolbar').length >= 1;
+        const closestTable = this.host.closest('tds-table');
+        if (closestTable) {
+            this.enableToolbarDesign =
+                (closestTable === null || closestTable === void 0 ? void 0 : closestTable.getElementsByTagName('tds-table-toolbar').length) >= 1;
+        }
     }
     async handleCheckboxChange(event) {
+        var _a;
         this.allSelected = event.detail.checked;
         this.tdsSelectAll.emit({
             tableId: this.tableId,
             checked: event.detail.checked,
-            selectedRows: await this.tableEl.getSelectedRows(),
+            selectedRows: await ((_a = this.tableEl) === null || _a === void 0 ? void 0 : _a.getSelectedRows()),
         });
     }
     render() {
-        return (index.h(index.Host, { key: '6c1cc431846a627cab836e62a551f9f5d6558a9d', class: {
+        return (index.h(index.Host, { key: 'd223210726dcf021431d5dbaae0339f46c948d01', class: {
                 'tds-table--compact': this.compactDesign,
                 'tds-table--divider': this.verticalDividers,
                 'tds-table--toolbar-available': this.enableToolbarDesign,
-            } }, index.h("tr", { key: 'fe66a0019ffef72437ef0312e07d8e23b0c8f728' }, this.multiselect && (index.h("th", { key: 'a132d706ef3650e6909a2b1bd90ed51b53a8fe02', class: "tds-table__header-cell tds-table__header-cell--checkbox" }, index.h("div", { key: 'a4a62796419d0f77a9a9b035a2493ec7cc184e9f', class: "tds-form-label tds-form-label--table" }, index.h("tds-checkbox", { key: '2b9e308d8098b8e2825936f6ff2ab0e1ec0e8897', checked: this.allSelected || this.selected, disabled: this.disabled, indeterminate: this.indeterminate, onTdsChange: (event) => this.handleCheckboxChange(event) })))), this.expandableRows && (index.h("th", { key: '916a17bb35705db77de44bee119c579dd55c2d8f', class: "tds-table__header-cell tds-table__header-cell--checkbox" })), index.h("slot", { key: '79d44597fcb6fa6d2e94197c57a1c9dded7e9f3d' }))));
+            } }, index.h("tr", { key: 'e0378b5a3843b17a322b41a6062edfa44a46fc95' }, this.multiselect && (index.h("th", { key: '9641cb2e3ee11abb9cf30a7592c0b6d00f5f7575', class: "tds-table__header-cell tds-table__header-cell--checkbox" }, index.h("div", { key: 'a0a02dad1e01d7ffaed5a8069dcd885021076e51', class: "tds-form-label tds-form-label--table" }, index.h("tds-checkbox", { key: '5ed55d728588753457e279b955f1eba78b6dc311', checked: this.allSelected || this.selected, disabled: this.disabled, indeterminate: this.indeterminate, onTdsChange: (event) => this.handleCheckboxChange(event) })))), this.expandableRows && (index.h("th", { key: '7a5451320a3909e333bdbc21c2f748f95eafef74', class: "tds-table__header-cell tds-table__header-cell--checkbox" })), index.h("slot", { key: '841f44149457dfe9f5a9e9d09bdddcd8cd443646' }))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/tds-table-toolbar.cjs.entry.js

@@ -40,15 +40,17 @@ const TdsTableToolbar = class {
         }
     }
     connectedCallback() {
+        var _a;
         this.tableEl = this.host.closest('tds-table');
-        this.tableId = this.tableEl.tableId;
+        this.tableId = (_a = this.tableEl) === null || _a === void 0 ? void 0 : _a.tableId;
         if (!this.tdsSearchAriaLabel) {
             console.warn('tds-table-toolbar: tdsSearchAriaLabel is highly recommended for accessibility');
         }
     }
     componentWillLoad() {
         relevantTableProps.forEach((tablePropName) => {
-            this[tablePropName] = this.tableEl[tablePropName];
+            var _a;
+            this[tablePropName] = (_a = this.tableEl) === null || _a === void 0 ? void 0 : _a[tablePropName];
         });
     }
     handleSearch(event) {
@@ -74,10 +76,10 @@ const TdsTableToolbar = class {
         return styles;
     }
     render() {
-        return (index.h(index.Host, { key: 'e7ce21fcad3bfbc9f93088f777855baa9c6e3869', class: {
+        return (index.h(index.Host, { key: '37a65522a8efe0d073906a1c0ad59bc0574faa0c', class: {
                 'tds-table--compact': this.compactDesign,
                 'toolbar__horizontal-scroll': !!this.horizontalScrollWidth,
-            }, style: this.getStyles(), "aria-labelledby": "table-toolbar-title" }, index.h("div", { key: '7310ec2851d440ba6529eb2d48bb20bcb508429f', class: "tds-table__upper-bar-flex" }, index.h("div", { key: '5b901252d433968edb04de20a25ea9c09bb39b4b', class: "tds-table__actionbar-left" }, this.tableTitle && (index.h("caption", { key: '661f8de9fe38cd72b098251b027c7e6f554033e5', id: "table-toolbar-title", class: "tds-table__title" }, this.tableTitle)), index.h("slot", { key: '8d00d01e2ac92c75f95dc6ae89e7b8769cde6dc1', name: "start" })), index.h("div", { key: 'fd28cb512ed5ad997cdb1f0b1dff8f7489f95db5', class: "tds-table__actionbar" }, this.filter && (index.h("div", { key: 'fb2649d623a21eeb1a8c3ed5c512d02d7bbb2efc', class: "tds-table__searchbar" }, index.h("input", { key: '9cd1284bec12081a2e99996eb6bd160ac926b751', class: "tds-table__searchbar-input", type: "text", onKeyUp: (event) => this.handleSearch(event), "aria-label": this.tdsSearchAriaLabel }), index.h("span", { key: '015060f9c59d06c430fabb0acabb8b476a477616', class: "tds-table__searchbar-icon" }, index.h("tds-icon", { key: '5f990c7f452a46bb0471dd658f24afd848d029e9', name: "search", size: "20px" })))), index.h("slot", { key: 'a91b2aee680ef316d2fdd46d46bfe9ec3eb3e314', name: "end" })))));
+            }, style: this.getStyles(), "aria-labelledby": "table-toolbar-title" }, index.h("div", { key: 'f4116716bd302f31f5c5a1c6344cbd263f20aadb', class: "tds-table__upper-bar-flex" }, index.h("div", { key: '7c1088b56cd537ba8d6734bfdd8a87604c0038c3', class: "tds-table__actionbar-left" }, this.tableTitle && (index.h("caption", { key: 'aab5ff50d91410486069f9a734fd74606674819b', id: "table-toolbar-title", class: "tds-table__title" }, this.tableTitle)), index.h("slot", { key: '2e7f6fdbe8865712cba24e3b4a6e5833dd684ef0', name: "start" })), index.h("div", { key: '1d78a673fc3d4af7955cfb9ee00ff4d2265b73e9', class: "tds-table__actionbar" }, this.filter && (index.h("div", { key: '6fcef1537fb441d8e835d6d6978a2ca8ae107eef', class: "tds-table__searchbar" }, index.h("input", { key: 'd74bd73c0b0a969d69ea6d5ac142215466ab3add', class: "tds-table__searchbar-input", type: "text", onKeyUp: (event) => this.handleSearch(event), "aria-label": this.tdsSearchAriaLabel }), index.h("span", { key: '6b97b5d9b0ff3bb5b17f228d9786a64b1ea1ebe4', class: "tds-table__searchbar-icon" }, index.h("tds-icon", { key: '268d432c7c1ed126e2b0186e72ffd4fa53f33d3a', name: "search", size: "20px" })))), index.h("slot", { key: 'ef138ddefb88afc9967230c39600538a9d112dbb', name: "end" })))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/tds-table.cjs.entry.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-ca8040ad.js');
 const generateUniqueId = require('./generateUniqueId-e3fc9863.js');
 
-const tableCss = ":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}";
+const tableCss = ":host,:root{--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}";
 const TdsTableStyle0 = tableCss;
 
 const TdsTable = class {
@@ -34,20 +34,19 @@ const TdsTable = class {
     }
     /** Returns all selected rows data. */
     async getSelectedRows() {
+        var _a;
         let selectedRowsData = [];
         const tableBody = this.host.querySelector('tds-table-body');
-        const selectedRows = Array.from(tableBody.querySelectorAll('tds-table-body-row')).filter((element) => element.selected);
+        const selectedRows = Array.from((_a = tableBody === null || tableBody === void 0 ? void 0 : tableBody.querySelectorAll('tds-table-body-row')) !== null && _a !== void 0 ? _a : []).filter((element) => element.selected);
         selectedRows.forEach((row) => {
             let selectedRow = [];
             const rowCells = Array.from(row.getElementsByTagName('tds-body-cell'));
             rowCells.forEach((cell) => {
-                var _a;
+                var _a, _b;
                 const cellObject = {
-                    cellKey: null,
-                    cellValue: null,
+                    cellKey: (_a = cell.cellKey) !== null && _a !== void 0 ? _a : '',
+                    cellValue: ((_b = cell.cellValue) !== null && _b !== void 0 ? _b : cell.innerText),
                 };
-                cellObject.cellKey = cell.cellKey;
-                cellObject.cellValue = (_a = cell.cellValue) !== null && _a !== void 0 ? _a : cell.innerText;
                 selectedRow = [...selectedRow, cellObject];
             });
             selectedRowsData = [...selectedRowsData, selectedRow];
@@ -87,29 +86,32 @@ const TdsTable = class {
     }
     componentWillRender() {
         if (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;
+            const closestTable = this.host.closest('tds-table');
+            if (closestTable) {
+                this.enableHorizontalScrollToolbarDesign =
+                    closestTable.getElementsByTagName('tds-table-toolbar').length >= 1;
+                this.enableHorizontalScrollFooterDesign =
+                    closestTable.getElementsByTagName('tds-table-footer').length >= 1;
+            }
         }
     }
     render() {
-        return (index.h(index.Host, { key: '7a9b7fb545f7c4cd4c0f118910ce8af6d407851e', class: {
+        return (index.h(index.Host, { key: '2518c49a6d15147aed6989edfbd4cd658ac2219a', class: {
                 'tds-table--responsive': this.responsive,
                 'tds-mode-variant-primary': this.modeVariant === 'primary',
                 'tds-mode-variant-secondary': this.modeVariant === 'secondary',
-            } }, index.h("table", { key: '8a1c7e74c38a55e17d7cf322997f6690d6b29f3f', style: this.getStyles(), class: {
+            } }, index.h("table", { key: '1a845328df98203bd3b4bc3c058310c75ebd83a6', style: this.getStyles(), class: {
                 'tds-table': true,
                 'tds-table--compact': this.compactDesign,
                 'tds-table--divider': this.verticalDividers,
-                'tds-table--no-min-width': this.noMinWidth,
+                '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,
-            } }, index.h("slot", { key: 'a47351a50dbd07b15f969ffaeb75f62045693968' }))));
+            } }, index.h("slot", { key: 'ded1d53ea8e07514e45797c0feffa83f58cce6b4' }))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/tds-tag.cjs.entry.js

@@ -21,7 +21,7 @@ const TdsTag = class {
             [`${this.size.toLowerCase()}`]: true,
             [`${this.variant.toLowerCase()}`]: true,
         });
-        return (index.h(index.Host, { key: 'ce69caedf87367e14db73628ff7948fca1580073', class: getTagClasses() }, index.h("div", { key: 'fbdddb159c5e590cca490df2ff2bf53602fc3265', class: "tds-tag__content" }, hasPrefixSlot && index.h("slot", { key: '77e44bf68f83708da2bdf7dcf50878d43638df97', name: "prefix" }), index.h("span", { key: '27aa436683c94063a3a041c6679d622e5f621d92' }, this.text))));
+        return (index.h(index.Host, { key: 'f2f854a15358d98bc4c55b093e243cc07cc8e439', class: getTagClasses() }, index.h("div", { key: 'a9b74511347d721ae769d42e4b0edb5ac9acdf85', class: "tds-tag__content" }, hasPrefixSlot && index.h("slot", { key: '95b1acec855e8e0caeadc3458222bf6a91795704', name: "prefix" }), index.h("span", { key: 'e40a01fda9aa32ae42032656ebf11375b45f9183' }, this.text))));
     }
     get host() { return index.getElement(this); }
 };