@scania/tegel 1.29.0-1.29.0-fix-spinner-alignment-beta.1 → 1.29.0-beta.0

package/dist/collection/components/table/table-body-row/table-body-row.js

@@ -68,13 +68,13 @@ export class TdsTableBodyRow {
         }
     }
     render() {
-        return (h(Host, { key: '6bf3fee7c066bc4686c9aa0ecba45c04ca7b2aae', tabindex: this.clickable ? '0' : null, class: {
+        return (h(Host, { key: '5b049039384682278f6d296b58c861e255a7be36', 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 && (h("td", { key: '845e64408b938254887c7ec840eae48fc4ed01e3', class: "tds-table__body-cell tds-table__body-cell--checkbox tds-form-label tds-form-label--table" }, h("tds-checkbox", { key: '817ef05632a9b2704148a0c9ce190b360b9cec3b', onTdsChange: (event) => this.handleCheckboxChange(event), checked: this.selected, disabled: this.disabled }))), h("slot", { key: '50cf1a5aeae24aaceeb813f432abe8e75ad53857' })));
+            }, onClick: (e) => this.handleRowClick(e), onKeyDown: (e) => this.handleKeyDown(e) }, this.multiselect && (h("td", { key: 'b01c688d209a7c81d7a4987a23afbdbbaf8c4b1e', class: "tds-table__body-cell tds-table__body-cell--checkbox tds-form-label tds-form-label--table" }, h("tds-checkbox", { key: 'b716bd929a7e1c6e29edb74609a7695db85d859a', onTdsChange: (event) => this.handleCheckboxChange(event), checked: this.selected, disabled: this.disabled }))), h("slot", { key: 'c34811d4ef6837c3046434c805e1f1c291bc658c' })));
     }
     static get is() { return "tds-table-body-row"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/table-body-row-expandable/table-body-row-expandable.js

@@ -21,7 +21,6 @@ export class TdsTableBodyRowExpandable {
         this.expanded = undefined;
         this.overflow = 'auto';
         this.autoCollapse = false;
-        this.tdsAriaLabelExpandButton = '';
         this.isExpanded = false;
         this.tableId = '';
         this.columnsNumber = null;
@@ -101,26 +100,26 @@ export class TdsTableBodyRowExpandable {
         this.sendValue();
     }
     render() {
-        return (h(Host, { key: '3d289d00082c284257728cec4f0ddcfc63dda863', class: {
+        return (h(Host, { key: '9414020f12ee91b731b9095601b990bc2ad3371c', class: {
                 'tds-table__row': true,
                 'tds-table__row-expand--active': this.isExpanded,
                 'tds-table__compact': this.compactDesign,
                 'tds-table--divider': this.verticalDividers,
-            } }, h("tr", { key: '246ee336a3ab871346e1fcf81f02109121dc9657', id: `expandable-content-${this.rowId}`, class: {
+            } }, h("tr", { key: 'a61e2b06bd0ca24a1439f9ee188c16c6d72aee6b', class: {
                 'tds-table__row': true,
                 'tds-table__row--expanded': this.isExpanded,
-            }, part: "row" }, h("td", { key: 'b727b78965a4bdf0b6cf8ff7e8460d3dfae8327e', class: {
+            }, part: "row" }, h("td", { key: '6b95af08336808aa1c3546065ddea7df3d88784a', class: {
                 'tds-table__cell-expand': true,
-            } }, h("label", { key: 'c878be3429a3145b62b242f2e3d9c90ec0a74257', class: "tds-table__expand-control-container" }, 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 }), h("span", { key: 'ec9e1aefc553362c0c3e15cb99118a9c2dfffd04', class: "tds-expendable-row-icon" }, h("svg", { key: '84b3270e5f1bfc7671adcea34d862fe0485f40a8', fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 32 32" }, 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" }))))), h("slot", { key: '0c16341da217fbe920241a97b179335cb61e2364' })), h("tr", { key: 'a83ca5c30ec4945dfee096a408db4d1d240d3643', class: {
+            } }, h("label", { key: '4e8684f15d8c2eeba68b44d83c4c4879a06488cc', class: "tds-table__expand-control-container" }, h("input", { key: 'b089f4d08c90209b7dd9c346e61508cec9699329', class: "tds-table__expand-input", type: "checkbox", onChange: (event) => this.onChangeHandler(event), checked: this.isExpanded }), h("span", { key: 'c1f0397af8533f7a90f91694b903f99a3dce06f5', class: "tds-expendable-row-icon" }, h("svg", { key: '688c959410eb223201fa60a74d580bbf0f58f73a', fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 32 32" }, h("path", { key: '597ee637be990bb4e597bf460f4e0d44095cf507', "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" }))))), h("slot", { key: '25c8b16c5aeafe8922680a0508b9a1740374b43e' })), h("tr", { key: 'f39b8152eb0a697ecfaf52068e137619129eee69', class: {
                 'tds-table__row-expand': true,
                 'tds-table__row-expand--expanded': this.isExpanded,
-            }, part: "expand-row" }, h("td", { key: '2fcafe17b33ce39b5e1a3b149434006a70f6b8f3', class: {
+            }, part: "expand-row" }, h("td", { key: 'fcfec78e44e1da564b36d2fa65f0549aa7154fc6', 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 }, h("div", { key: 'b696b23d127e32a8017692b03de1ce8ee9497dcb', style: {
+            }, part: "expand-row-cell", colSpan: this.columnsNumber }, h("div", { key: 'ecf58e291825543681d0781249b0404b7385144e', style: {
                 overflow: this.overflow,
-            } }, h("slot", { key: 'e64e00778fd7c85618ae4cbc19d232e2acb873b5', name: "expand-row" }))))));
+            } }, h("slot", { key: '8b118db9c887061935d153138b76e3712b1e6804', name: "expand-row" }))))));
     }
     static get is() { return "tds-table-body-row-expandable"; }
     static get encapsulation() { return "shadow"; }
@@ -224,24 +223,6 @@ export class TdsTableBodyRowExpandable {
                 "attribute": "auto-collapse",
                 "reflect": false,
                 "defaultValue": "false"
-            },
-            "tdsAriaLabelExpandButton": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Aria label for the expand button, providing an accessible description"
-                },
-                "attribute": "tds-aria-label-expand-button",
-                "reflect": true,
-                "defaultValue": "''"
             }
         };
     }

package/dist/collection/components/table/table-header-cell/table-header-cell.js

@@ -31,7 +31,7 @@ export class TdsTableHeaderCell {
         };
         this.headerCellContent = () => {
             if (this.sortable) {
-                return (h("button", { class: "tds-table__header-button", onClick: () => this.sortButtonClick(), style: { justifyContent: this.textAlignState }, "aria-label": this.tdsAriaLabelSortButton }, h("span", { class: "tds-table__header-button-text" }, this.cellValue, h("slot", null)), this.sortingDirection === undefined && (h("tds-icon", { svgTitle: "sorting", class: "tds-table__header-button-icon", name: "sorting", size: "16px" })), this.sortingDirection && ['asc', 'desc'].includes(this.sortingDirection) && (h("tds-icon", { svgTitle: "arrow down", class: `tds-table__header-button-icon ${this.sortingDirection === 'asc' ? 'tds-table__header-button-icon--rotate' : ''}`, name: "arrow_down", size: "16px" }))));
+                return (h("button", { class: "tds-table__header-button", onClick: () => this.sortButtonClick(), style: { justifyContent: this.textAlignState } }, h("span", { class: "tds-table__header-button-text" }, this.cellValue, h("slot", null)), this.sortingDirection === undefined && (h("tds-icon", { class: "tds-table__header-button-icon", name: "sorting", size: "16px" })), this.sortingDirection && ['asc', 'desc'].includes(this.sortingDirection) && (h("tds-icon", { class: `tds-table__header-button-icon ${this.sortingDirection === 'asc' ? 'tds-table__header-button-icon--rotate' : ''}`, name: "arrow_down", size: "16px" }))));
             }
             return (h("p", { class: {
                     'tds-table__header-text': true,
@@ -50,7 +50,6 @@ export class TdsTableHeaderCell {
         this.sortable = false;
         this.textAlign = 'left';
         this.disablePadding = false;
-        this.tdsAriaLabelSortButton = '';
         this.textAlignState = undefined;
         this.sortingDirection = undefined;
         this.sortedByMyKey = false;
@@ -105,15 +104,8 @@ export class TdsTableHeaderCell {
         this.enableToolbarDesign =
             this.host.closest('tds-table').getElementsByTagName('tds-table-toolbar').length >= 1;
     }
-    getAriaSort() {
-        if (this.sortingDirection === 'asc')
-            return 'ascending';
-        if (this.sortingDirection === 'desc')
-            return 'descending';
-        return 'none';
-    }
     render() {
-        return (h(Host, { key: 'f128527938679fe448019802ea76cda1a57d75be', class: {
+        return (h(Host, { key: '072b8e55e1519151d7a178f905c5cf5bb353c5bf', class: {
                 'tds-table__header-cell': true,
                 'tds-table__header-cell--sortable': this.sortable,
                 'tds-table__header-cell--is-sorted': this.sortedByMyKey,
@@ -124,7 +116,7 @@ export class TdsTableHeaderCell {
                 'tds-table--extra-column': this.multiselect || this.expandableRows,
                 'tds-table--toolbar-available': this.enableToolbarDesign,
                 'tds-table--no-padding': this.disablePadding,
-            }, style: { minWidth: this.customWidth }, onMouseOver: () => this.onHeadCellHover(this.cellKey), onMouseLeave: () => this.onHeadCellHover(''), role: "columnheader", "aria-sort": this.getAriaSort() }, this.headerCellContent()));
+            }, style: { minWidth: this.customWidth }, onMouseOver: () => this.onHeadCellHover(this.cellKey), onMouseLeave: () => this.onHeadCellHover('') }, this.headerCellContent()));
     }
     static get is() { return "tds-header-cell"; }
     static get encapsulation() { return "shadow"; }
@@ -244,24 +236,6 @@ export class TdsTableHeaderCell {
                 "attribute": "disable-padding",
                 "reflect": true,
                 "defaultValue": "false"
-            },
-            "tdsAriaLabelSortButton": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Aria label for the sort button, providing an accessible description"
-                },
-                "attribute": "tds-aria-label-sort-button",
-                "reflect": true,
-                "defaultValue": "''"
             }
         };
     }

package/dist/collection/components/table/table-header-input-wrapper/table-header-input-wrapper.js

@@ -67,7 +67,7 @@ export class TdsTableHeaderInputWrapper {
                 'focused-input-wrapper': this.inputFocused,
                 'show-icon': this.showIcon,
                 'tds-table__compact': this.compactDesign,
-            } }, this.renderSlot ? h("slot", { onSlotchange: () => this.handleSlotChange() }) : null, this.showIcon ? (h("tds-icon", { svgTitle: "search", class: "search-icon", slot: "icon", size: "16px", name: "search" })) : null));
+            } }, this.renderSlot ? h("slot", { onSlotchange: () => this.handleSlotChange() }) : null, this.showIcon ? (h("tds-icon", { class: "search-icon", slot: "icon", size: "16px", name: "search" })) : null));
     }
     static get is() { return "tds-table-header-input-wrapper"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/table-toolbar/table-toolbar.js

@@ -12,7 +12,6 @@ export class TdsTableToolbar {
     constructor() {
         this.tableTitle = '';
         this.filter = false;
-        this.tdsSearchAriaLabel = '';
         this.verticalDividers = false;
         this.compactDesign = false;
         this.noMinWidth = false;
@@ -35,9 +34,6 @@ export class TdsTableToolbar {
     connectedCallback() {
         this.tableEl = this.host.closest('tds-table');
         this.tableId = this.tableEl.tableId;
-        if (!this.tdsSearchAriaLabel) {
-            console.warn('tds-table-toolbar: tdsSearchAriaLabel is highly recommended for accessibility');
-        }
     }
     componentWillLoad() {
         relevantTableProps.forEach((tablePropName) => {
@@ -67,10 +63,10 @@ export class TdsTableToolbar {
         return styles;
     }
     render() {
-        return (h(Host, { key: '063779da774e1040065cb68412e1e57f9b5a700c', class: {
+        return (h(Host, { key: '53f2438014682bd1b23cdeb222723b4f09fcf48b', class: {
                 'tds-table--compact': this.compactDesign,
                 'toolbar__horizontal-scroll': !!this.horizontalScrollWidth,
-            }, style: this.getStyles(), "aria-labelledby": "table-toolbar-title" }, h("div", { key: '2bdef8894ab761fbdce8a1074d81c7af252b75be', class: "tds-table__upper-bar-flex" }, h("caption", { key: '031e3ecf77cd9a988f3c256383595aa1348215a0', id: "table-toolbar-title", class: "tds-table__title" }, this.tableTitle), h("div", { key: 'fe49c2d76c2cc64350b81b6a36db4dd40ef83e58', class: "tds-table__actionbar" }, this.filter && (h("div", { key: '7cb0de70a472d969fa99374b4c70b0dd170c07fc', class: "tds-table__searchbar" }, h("input", { key: '0afebcf7ebf0b5e040f975667e87c32ba4f56aed', class: "tds-table__searchbar-input", type: "text", onKeyUp: (event) => this.handleSearch(event), "aria-label": this.tdsSearchAriaLabel }), h("span", { key: 'c9e90eb15de675efe7a4a4552af1089036027c25', class: "tds-table__searchbar-icon" }, h("tds-icon", { key: '64fa664f000a0419b6807b1a639da85c426cb4f2', name: "search", size: "20px" })))), h("slot", { key: '3f18fa9b8877bcec0e3af488dbbbd77c5e09d53c', name: "end" })))));
+            }, style: this.getStyles() }, h("div", { key: 'e5912f152a528a0c9bf5a7582b10e2ca0458da9f', class: "tds-table__upper-bar-flex" }, h("caption", { key: '382bf6a6e35d78e329af0b6672b70c8875eaa184', class: "tds-table__title" }, this.tableTitle), h("div", { key: 'f3a4fc316840e0bd1f083540a30831b77acf0c59', class: "tds-table__actionbar" }, this.filter && (h("div", { key: '20ab41120800efe3194818c8e6a8039db012900b', class: "tds-table__searchbar" }, h("input", { key: 'd07cc3caa8f06b92fa7e80eabdaa565042d06ba5', class: "tds-table__searchbar-input", type: "text", onKeyUp: (event) => this.handleSearch(event) }), h("span", { key: '6b8cb5f2d9500a0a104d0656c085745ec6194bf0', class: "tds-table__searchbar-icon" }, h("tds-icon", { key: '926eeae91dfa03475fb16470e5780dc592f05680', name: "search", size: "20px" })))), h("slot", { key: '2694b404429fc75ad0793f01b604197c4faa4f7e', name: "end" })))));
     }
     static get is() { return "tds-table-toolbar"; }
     static get encapsulation() { return "shadow"; }
@@ -121,24 +117,6 @@ export class TdsTableToolbar {
                 "attribute": "filter",
                 "reflect": true,
                 "defaultValue": "false"
-            },
-            "tdsSearchAriaLabel": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Aria label for the search input, providing an accessible description"
-                },
-                "attribute": "tds-search-aria-label",
-                "reflect": false,
-                "defaultValue": "''"
             }
         };
     }

package/dist/collection/components/text-field/text-field.js

@@ -99,7 +99,7 @@ export class TdsTextField {
                 'text-field-error': this.state === 'error',
                 'text-field-success': this.state === 'success',
                 'text-field-default': this.state === 'default',
-            } }, h("slot", { key: '8c6c192a137ea00d114f9721d0f6fcea366708ca', name: "prefix" }))), h("div", { key: 'e8b2650e45cba5e63e1db4e3d1d7af6662ff187b', class: "text-field-input-container" }, h("input", { key: 'd5d238312f2c4fd2179892995165a7263d12a7bd', ref: (inputEl) => {
+            } }, h("slot", { key: '8c6c192a137ea00d114f9721d0f6fcea366708ca', name: "prefix" }))), h("div", { key: 'e8b2650e45cba5e63e1db4e3d1d7af6662ff187b', class: "text-field-input-container" }, h("input", { key: 'd208edd0ffe3f2a78bc2df4f0dd58e13fd768453', ref: (inputEl) => {
                 this.textInput = inputEl;
             }, class: {
                 'text-field-input': true,
@@ -114,13 +114,13 @@ export class TdsTextField {
                 if (!this.readOnly) {
                     this.handleBlur(event);
                 }
-            }, "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label, "aria-describedby": `text-field-helper-element-${this.uuid}`, "aria-readonly": this.readOnly, id: `text-field-input-element-${this.uuid}` }), this.labelPosition === 'inside' && this.size !== 'sm' && (h("label", { key: '9d3cadd3c28ae4f198d5ddc142ef02d7535e9def', class: "text-field-label-inside", htmlFor: `text-field-input-element-${this.uuid}` }, this.label))), h("div", { key: '6df4af20de96ef2c081fed3ae765e4982cd836bd', class: "text-field-bar" }), usesSuffixSlot && (h("div", { key: '38b4ee5a2639c26f7e66f8ac4449fac3c90cf753', class: {
+            }, "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label, "aria-describedby": "text-field-helper-element", "aria-readonly": this.readOnly, id: `text-field-input-element-${this.uuid}` }), this.labelPosition === 'inside' && this.size !== 'sm' && (h("label", { key: '38b9cedc8c7a07b582c16b01a267cf4e08a20481', class: "text-field-label-inside", htmlFor: `text-field-input-element-${this.uuid}` }, this.label))), h("div", { key: '9587a4002c11b93ee715952080e4959be0393642', class: "text-field-bar" }), usesSuffixSlot && (h("div", { key: 'bb46ceb5bee96468ecbd1ec0bda36c639b045450', class: {
                 'text-field-slot-wrap-suffix': true,
                 'text-field-error': this.state === 'error',
                 'text-field-success': this.state === 'success',
                 'text-field-default': this.state === 'default',
                 'tds-u-display-none': this.readOnly,
-            } }, h("slot", { key: 'a320cf2cabe3de76c4605a0cd4ed8925d7ceac17', name: "suffix" }))), this.readOnly && !this.hideReadOnlyIcon && (h("span", { key: '02ca8a9c4afdb8570abb8e848c87d84b3cb470db', class: "text-field-icon__readonly" }, h("tds-icon", { key: '8774ad6177bd0007cf1c62b15a7bca4ad32b8e1e', name: "edit_inactive", size: "20px" }))), h("span", { key: '81ebfc7038ea8cc5c55abafb142d19102171b931', class: "text-field-icon__readonly-label" }, "This field is non-editable")), h("div", { key: 'bb636ecc8feb14ae6d65828f8642eaade8af5a77', "aria-live": "assertive" }, (this.helper || this.maxLength > 0) && (h("div", { key: '5f5c356778771e62d89b392e440de717bd2c98f1', class: "text-field-helper", id: `text-field-helper-element-${this.uuid}` }, this.state === 'error' && (h("div", { key: '26b094a392c6ffa39bdbd5b3e4be1d312a6afb34', class: "text-field-helper-error-state" }, !this.readOnly && h("tds-icon", { key: 'c2c968f2d161a54955da370780fea6caeeb683d3', name: "error", size: "16px" }), this.helper)), this.state !== 'error' && this.helper, !this.readOnly && this.maxLength > 0 && (h("span", { key: '70534a98310d79bd6e9de45671e4f0035c3d6c9a', class: {
+            } }, h("slot", { key: 'baa86fca37b71182b800095be7c4fb6db2ee4d13', name: "suffix" }))), this.readOnly && !this.hideReadOnlyIcon && (h("span", { key: '6d3abf0a6e60463e7f6db1187229cf17e5f4b80b', class: "text-field-icon__readonly" }, h("tds-icon", { key: 'c5afca89f935a0a3f2c63039badf7b05c60b6015', name: "edit_inactive", size: "20px" }))), h("span", { key: 'd677de36f510688d3311f514aed89390c1d0a39b', class: "text-field-icon__readonly-label" }, "This field is non-editable")), h("div", { key: 'f79ebd15d92174541ea7683de7cf002af996733a', "aria-live": "assertive" }, (this.helper || this.maxLength > 0) && (h("div", { key: 'b7708331d4c8a21d869a21f86e873da017ae2157', class: "text-field-helper" }, this.state === 'error' && (h("div", { key: '098f7e9d9b053b4bfb02a387be879d4c519c2b95', class: "text-field-helper-error-state" }, !this.readOnly && h("tds-icon", { key: 'fa894663253fdb19d168e284284f35695deada29', name: "error", size: "16px" }), this.helper)), this.state !== 'error' && this.helper, !this.readOnly && this.maxLength > 0 && (h("span", { key: 'dcae00985dc79db8ad6bdd65fe6160d4f5de8603', class: {
                 'text-field-textcounter-divider': true,
                 'text-field-textcounter-disabled': this.disabled,
             } }, this.value === null ? 0 : (_a = this.value) === null || _a === void 0 ? void 0 : _a.length, " / ", this.maxLength)))))));