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

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

@@ -63,11 +63,11 @@ export class TdsTableHeaderInputWrapper {
         }
     }
     render() {
-        return (h(Host, { key: '04c6b46892b719c0f66525ddcacae57dceb3b9ff', class: {
+        return (h(Host, { key: '62070c88b54c313b2db10890023db32f0eaf66b5', class: {
                 '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", { class: "search-icon", slot: "icon", size: "16px", name: "search" })) : null));
+            } }, 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));
     }
     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,6 +12,7 @@ export class TdsTableToolbar {
     constructor() {
         this.tableTitle = '';
         this.filter = false;
+        this.tdsSearchAriaLabel = '';
         this.verticalDividers = false;
         this.compactDesign = false;
         this.noMinWidth = false;
@@ -34,6 +35,9 @@ 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) => {
@@ -63,10 +67,10 @@ export class TdsTableToolbar {
         return styles;
     }
     render() {
-        return (h(Host, { key: '6350a9feb5812921105edb7bb5951d03d0c32a24', class: {
+        return (h(Host, { key: '063779da774e1040065cb68412e1e57f9b5a700c', class: {
                 'tds-table--compact': this.compactDesign,
                 'toolbar__horizontal-scroll': !!this.horizontalScrollWidth,
-            }, style: this.getStyles() }, h("div", { key: '1cb6c95719546ea0bbde729e6b26ab34dd3ae55f', class: "tds-table__upper-bar-flex" }, h("caption", { key: '37ca396778dbe93ca622564f4374a0561348c243', class: "tds-table__title" }, this.tableTitle), h("div", { key: 'aa129f0aca461d85dfad97fa0682975787512d53', class: "tds-table__actionbar" }, this.filter && (h("div", { key: '447cd5e4ad047f1424180e7456093b43f5b23e09', class: "tds-table__searchbar" }, h("input", { key: 'c9798ebec2c279516f34bb8c25912e7959c3abfd', class: "tds-table__searchbar-input", type: "text", onKeyUp: (event) => this.handleSearch(event) }), h("span", { key: 'a6c16f3162e654aff742634a4bb77eb8a886fbad', class: "tds-table__searchbar-icon" }, h("tds-icon", { key: 'c1bcb6cfa93140a3e1b2cced582cdb62eb184623', name: "search", size: "20px" })))), h("slot", { key: 'fd86cec3c8e2cbd8c0198005883c1d2b64acd51b', name: "end" })))));
+            }, 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" })))));
     }
     static get is() { return "tds-table-toolbar"; }
     static get encapsulation() { return "shadow"; }
@@ -117,6 +121,24 @@ 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/tabs/folder-tabs/folder-tab/folder-tab.js

@@ -35,10 +35,10 @@ export class TdsFolderTab {
         }
     }
     render() {
-        return (h(Host, { key: '9290c4ab2f7d051bba9fec4dad9a7d07790ed5b7', "aria-selected": this.selected }, h("div", { key: '36225101c510f2d77282fd600c4ee00085791109', class: {
+        return (h(Host, { key: '8333653e86ef3caee44209a82dc0c2a1f1712ab7', "aria-selected": this.selected }, h("div", { key: '1663d7239688a10db05987819b4a4bc086173945', class: {
                 selected: this.selected,
                 disabled: this.disabled,
-            }, style: { width: `${this.tabWidth}px` } }, h("slot", { key: '05954c498b9fbd6a2a1231d84bf2657a0616db36' }))));
+            }, style: { width: `${this.tabWidth}px` } }, h("slot", { key: '735ddc8e33370ebd246a235f8211911d0293fcc1' }))));
     }
     static get is() { return "tds-folder-tab"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tabs/folder-tabs/folder-tabs.js

@@ -162,9 +162,9 @@ export class TdsFolderTabs {
         this.removeEventListenerFromTabs();
     }
     render() {
-        return (h(Host, { key: '54a3cceed49387a8f0dbe74eecb96ae284882ff9', role: "tablist", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: '170e5256bde8efdce412bbab1a674b23159d02d1', class: "wrapper", ref: (el) => {
+        return (h(Host, { key: '903822cecef549d104fe825f3b022e840ed235c6', role: "tablist", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: '86490800caf5cac30845b3b39952cf89e05fa121', class: "wrapper", ref: (el) => {
                 this.navWrapperElement = el;
-            } }, h("button", { key: '1c74ef8c81361bfa6ff5d227c145a3371fb2f66f', "aria-label": this.tdsScrollLeftAriaLabel, class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, disabled: !this.showLeftScroll, onClick: () => this.scrollLeft() }, h("tds-icon", { key: '94ddd85d4107c89487db727f13a9c443fd160fc6', name: "chevron_left", size: "20px" })), h("slot", { key: '63978c3c62482bc0a251377756630f555f10dfef', onSlotchange: () => this.handleSlotChange() }), h("button", { key: 'aeb86fbdb365e62df37b72daa0b53f51486834a9', "aria-label": this.tdsScrollRightAriaLabel, class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, disabled: !this.showRightScroll, onClick: () => this.scrollRight() }, h("tds-icon", { key: '2cc4d301a4490d6b8d8f2373fc2450c93922a814', name: "chevron_right", size: "20px" })))));
+            } }, h("button", { key: '35646398aed34628fca2c90e32dca1022ccd9756', "aria-label": this.tdsScrollLeftAriaLabel, class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, disabled: !this.showLeftScroll, onClick: () => this.scrollLeft() }, h("tds-icon", { key: 'c1110710a4d1e642a796261daeddd176c5ff0a25', name: "chevron_left", size: "20px" })), h("slot", { key: 'c70b90ff38c25f898025bf8dae890fc6458242c3', onSlotchange: () => this.handleSlotChange() }), h("button", { key: 'cdeb537cf2f861a29efafd1927e9f532c53923cc', "aria-label": this.tdsScrollRightAriaLabel, class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, disabled: !this.showRightScroll, onClick: () => this.scrollRight() }, h("tds-icon", { key: 'b7c8b9bbe9005c6d5cf8f3b1bf910efcb60bf51c', name: "chevron_right", size: "20px" })))));
     }
     static get is() { return "tds-folder-tabs"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tabs/inline-tabs/inline-tab/inline-tab.js

@@ -30,11 +30,11 @@ export class TdsInlineTab {
         }
     }
     render() {
-        return (h(Host, { key: '4c9f91014f30c1e7db52778dc4cf8800aa62050d', "aria-selected": this.selected }, h("div", { key: '860cfdd9338915275262875fc79588b58bebf447', class: {
+        return (h(Host, { key: '5afb8ea09666230ca5ac15a12873925c715b5d69', "aria-selected": this.selected }, h("div", { key: '46eaf3e44e529543120237da361282b4062a56c6', class: {
                 'inline-tab-item': true,
                 'selected': this.selected,
                 'disabled': this.disabled,
-            } }, h("slot", { key: 'eeccc1bdc172fab4d7ad96143b01f17982266f4d' }))));
+            } }, h("slot", { key: '7bd7e6871aa776a07aebc703a3f1fa9c1bf169b6' }))));
     }
     static get is() { return "tds-inline-tab"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tabs/inline-tabs/inline-tabs.js

@@ -169,9 +169,9 @@ export class TdsInlineTabs {
         this.removeEventListenerFromTabs();
     }
     render() {
-        return (h(Host, { key: '47fd4d494254749aa276d4f046ded68fe472b062', role: "tablist", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: 'f5c42677bafef38db784c517714ac8a4e0149862', class: "wrapper", ref: (el) => {
+        return (h(Host, { key: '0ebd82f8133fa74341e13640f31a077588b628ce', role: "tablist", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: '0b5a6d3b12a7e16746c309d79fa75054b4226270', class: "wrapper", ref: (el) => {
                 this.navWrapperElement = el;
-            }, style: { paddingLeft: `${this.leftPadding}px` } }, h("button", { key: '5955dc1657efcfec14393987f6ebfaea4c90615d', "aria-label": this.tdsScrollLeftAriaLabel, class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, h("tds-icon", { key: '3c3c7d93197f40b0cbb67d20cd5c32b827a29430', name: "chevron_left", size: "20px" })), h("slot", { key: '335ec61f80defb892c229901165809487950dc03', onSlotchange: () => this.handleSlotChange() }), h("button", { key: 'cc22a000e41efa472638da3c480b5cf1094aaec2', "aria-label": this.tdsScrollRightAriaLabel, class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, h("tds-icon", { key: '9ca29d2d1cb3df19993723a2eb0716d36c0f20ea', name: "chevron_right", size: "20px" })))));
+            }, style: { paddingLeft: `${this.leftPadding}px` } }, h("button", { key: 'd14195b0f9f1f9bbb2cb79787bf74ce86da3e4a4', "aria-label": this.tdsScrollLeftAriaLabel, class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, h("tds-icon", { key: 'f862dfcdf53b04ceff036f0b406bd0af488adfa8', name: "chevron_left", size: "20px" })), h("slot", { key: '02054d05dcbdae34cddad74194dc41331f755df9', onSlotchange: () => this.handleSlotChange() }), h("button", { key: 'e950ef97d3b59121ffeb128276648f8ca8b3e60f', "aria-label": this.tdsScrollRightAriaLabel, class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, h("tds-icon", { key: 'a1785c72f129daf7ddede2795ce1b5fa758cf004', name: "chevron_right", size: "20px" })))));
     }
     static get is() { return "tds-inline-tabs"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tabs/navigation-tabs/navigation-tab/navigation-tab.js

@@ -30,8 +30,8 @@ export class TdsNavigationTab {
         }
     }
     render() {
-        return (h(Host, { key: '51152bf313a84cb937e7f49e87cc8dcd74ab0612' }, h("div", { key: '5d55db68f75e042dafe40da1b9e84d74f1cd8849', class: `navigation-tab-item  ${this.selected ? 'selected' : ''}
-           ${this.disabled ? 'disabled' : ''}` }, h("slot", { key: '174108daa16d6fa68c04244af1843771a4df91f5' }))));
+        return (h(Host, { key: '01d6c9a6d072a25603fb275f4217358d26c7ef3a' }, h("div", { key: 'a345c96e11757005920cff65cdeb950df5bf2e0d', class: `navigation-tab-item  ${this.selected ? 'selected' : ''}
+           ${this.disabled ? 'disabled' : ''}` }, h("slot", { key: 'bbeef04e703360625c7b7158bffd1f17a5742be5' }))));
     }
     static get is() { return "tds-navigation-tab"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tabs/navigation-tabs/navigation-tabs.js

@@ -169,15 +169,15 @@ export class TdsNavigationTabs {
         this.removeEventListenerFromTabs();
     }
     render() {
-        return (h(Host, { key: '809fe9d34b03949edae1708b6dea7f0406afee80', role: "tablist", class: { [`tds-mode-variant-${this.modeVariant}`]: this.modeVariant !== null } }, h("div", { key: '866605f8695441d7817c07895bdffd5e3e7ba5ac', class: "wrapper", ref: (el) => {
+        return (h(Host, { key: '16fdf2aff26da72316d2c5b82f1b16c41c63e259', role: "tablist", class: { [`tds-mode-variant-${this.modeVariant}`]: this.modeVariant !== null } }, h("div", { key: '4b0bd3931f0fbfc5a9d90291aadf903a43261f98', class: "wrapper", ref: (el) => {
                 this.navWrapperElement = el;
-            }, style: { paddingLeft: `${this.leftPadding}px` } }, h("button", { key: '2d394ecb940cee024174932676c2a6c22622c853', "aria-label": this.tdsScrollLeftAriaLabel, class: {
+            }, style: { paddingLeft: `${this.leftPadding}px` } }, h("button", { key: '3fcc90ed48c8b7ef0805f93e143214056c03122e', "aria-label": this.tdsScrollLeftAriaLabel, class: {
                 'scroll-left-button': true,
                 'show': this.showLeftScroll,
-            }, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, h("tds-icon", { key: '09386162127467a545e00f44130352afb9cfed03', name: "chevron_left", size: "20px" })), h("slot", { key: '3b3cd70ed645318d0661a3acbee3d2bc748314cf', onSlotchange: () => this.handleSlotChange() }), h("button", { key: '1afb2dc9b261626db800593548d7e023e14cd39b', "aria-label": this.tdsScrollRightAriaLabel, class: {
+            }, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, h("tds-icon", { key: 'ba7ae61254e781e0877530652b33ca0e87e482d3', name: "chevron_left", size: "20px" })), h("slot", { key: 'dc76c269ea68615020bbc1c55f1085b6a927fc6c', onSlotchange: () => this.handleSlotChange() }), h("button", { key: 'd52c3c76b5e597eaae55503c1a88d27efec99b66', "aria-label": this.tdsScrollRightAriaLabel, class: {
                 'scroll-right-button': true,
                 'show': this.showRightScroll,
-            }, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, h("tds-icon", { key: '451a8ddc680799fd86e390d8aeab5c22c73f31ee', name: "chevron_right", size: "20px" })))));
+            }, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, h("tds-icon", { key: 'ab533d4d7a4655772ad023f32f653fd4c762085b', name: "chevron_right", size: "20px" })))));
     }
     static get is() { return "tds-navigation-tabs"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1,11 +1,13 @@
 import { h } from "@stencil/core";
 import hasSlot from "../../utils/hasSlot";
+import generateUniqueId from "../../utils/generateUniqueId";
 /**
  * @slot prefix - Slot for the prefix in the component.
  * @slot suffix - Slot for the suffix in the component. Suffix is hidden when the input is in readonly state.
  */
 export class TdsTextField {
     constructor() {
+        this.uuid = generateUniqueId();
         this.type = 'text';
         this.labelPosition = 'no-label';
         this.label = '';
@@ -74,7 +76,7 @@ export class TdsTextField {
         var _a;
         const usesPrefixSlot = hasSlot('prefix', this.host);
         const usesSuffixSlot = hasSlot('suffix', this.host);
-        return (h("div", { key: 'b15e2650ad5cb65cad16240834a569d89c787de6', class: {
+        return (h("div", { key: '04c86fdbe70838228aa25e129adde1e92b8c3da1', class: {
                 'form-text-field': true,
                 'form-text-field-nomin': this.noMinWidth,
                 'text-field-focus': this.focusInput && !this.disabled,
@@ -92,12 +94,12 @@ export class TdsTextField {
                 'form-text-field-sm': this.size === 'sm',
                 'form-text-field-error': this.state === 'error',
                 'form-text-field-success': this.state === 'success',
-            } }, this.labelPosition === 'outside' && (h("div", { key: 'a8d058d6e063cabf93cf859883b306bfeeb18319', class: "text-field-label-outside" }, h("label", { key: '6ee037a99fb88c38e1bbd967e74f609fcf4670dc', htmlFor: "text-field-input-element" }, this.label))), h("div", { key: 'e7e50a86f774f9d693a43690d75d381b3556124f', onClick: () => this.textInput.focus(), class: "text-field-container" }, usesPrefixSlot && (h("div", { key: '5f42f91a49235c9911f366920790942147eabefd', class: {
+            } }, this.labelPosition === 'outside' && (h("div", { key: '89a6c50afdfc35f8329b7a1e6de9c6dc860fa2a7', class: "text-field-label-outside" }, h("label", { key: '1a26cc9423cd42e4ae64fdfe36ae28a1600217e1', htmlFor: `text-field-input-element-${this.uuid}` }, this.label))), h("div", { key: 'fff9ea20453ad6708b32e5efb7fabd8272863c8d', onClick: () => this.textInput.focus(), class: "text-field-container" }, usesPrefixSlot && (h("div", { key: '5d3b6511643b28852f3ab9c1490aa1577d0c1870', class: {
                 'text-field-slot-wrap-prefix': true,
                 'text-field-error': this.state === 'error',
                 'text-field-success': this.state === 'success',
                 'text-field-default': this.state === 'default',
-            } }, h("slot", { key: 'a6093bd26cde5c76a1362b260aa44e6b4bf1aed5', name: "prefix" }))), h("div", { key: 'ae0ab4730cdede21de1accab8ed74440ec7084ae', class: "text-field-input-container" }, h("input", { key: '4a96bf3b95969d3a7c6e00487d36d3b0fbc720cc', ref: (inputEl) => {
+            } }, h("slot", { key: '8c6c192a137ea00d114f9721d0f6fcea366708ca', name: "prefix" }))), h("div", { key: 'e8b2650e45cba5e63e1db4e3d1d7af6662ff187b', class: "text-field-input-container" }, h("input", { key: 'd5d238312f2c4fd2179892995165a7263d12a7bd', ref: (inputEl) => {
                 this.textInput = inputEl;
             }, class: {
                 'text-field-input': true,
@@ -112,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", "aria-readonly": this.readOnly, id: "text-field-input-element" }), this.labelPosition === 'inside' && this.size !== 'sm' && (h("label", { key: 'e9501e5e9af625a6efaca69b6d880a6063d9e1e3', class: "text-field-label-inside", htmlFor: "text-field-input-element" }, this.label))), h("div", { key: 'fed042784d9f96ffb658aaa7f83562fc4b696662', class: "text-field-bar" }), usesSuffixSlot && (h("div", { key: 'c66e08a4c15b09a3e340ffc1f249b49dae370a9f', class: {
+            }, "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: {
                 '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: '7caa1d97bcf8af6dc39976889a610027085421c9', name: "suffix" }))), this.readOnly && !this.hideReadOnlyIcon && (h("span", { key: '62bc9b373fb3e02b18041dde126e59354e727b2b', class: "text-field-icon__readonly" }, h("tds-icon", { key: '8064a973aae69b47661defa941de2e7fb6167b57', name: "edit_inactive", size: "20px" }))), h("span", { key: '71a2bd9077e2fa03458b41fd8ab5733998f33bbe', class: "text-field-icon__readonly-label" }, "This field is non-editable")), h("div", { key: 'f7110fc6ebff413d08feb61c8bf8bfd3aef3490c', "aria-live": "assertive" }, (this.helper || this.maxLength > 0) && (h("div", { key: '3776b5499bda3e3027ee537de571ded883e319af', class: "text-field-helper" }, this.state === 'error' && (h("div", { key: 'f887f43d1007b20d237217bf56813680ed671495', class: "text-field-helper-error-state" }, !this.readOnly && h("tds-icon", { key: 'ce50aeaa79974e0312307fab6a5b6d49bdfb501d', name: "error", size: "16px" }), this.helper)), this.state !== 'error' && this.helper, !this.readOnly && this.maxLength > 0 && (h("span", { key: '2bb64d74bee0003c2b68262852995573203703be', class: {
+            } }, 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: {
                 '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)))))));

package/dist/collection/components/textarea/textarea.js

@@ -1,6 +1,8 @@
 import { h } from "@stencil/core";
+import generateUniqueId from "../../utils/generateUniqueId";
 export class TdsTextarea {
     constructor() {
+        this.uuid = generateUniqueId();
         this.label = '';
         this.name = '';
         this.helper = undefined;
@@ -56,7 +58,7 @@ export class TdsTextarea {
     }
     render() {
         var _a;
-        return (h("div", { key: 'b50538b818f0e82cca94db22f91a8ee73e009ca7', class: {
+        return (h("div", { key: '09084849dd168d823b2754bcaede53797632768e', class: {
                 'textarea-container': true,
                 'textarea-label-inside': this.labelPosition === 'inside',
                 'textarea-focus': this.focusInput,
@@ -66,7 +68,7 @@ export class TdsTextarea {
                 'textarea-data': this.value !== '',
                 [`textarea-${this.state}`]: this.state === 'error' || this.state === 'success',
                 'no-min-width': this.noMinWidth,
-            } }, this.labelPosition !== 'no-label' && (h("label", { key: 'f96e68827795a3402d4261ffab997e5c9292fd20', htmlFor: "textarea-element", class: 'textarea-label' }, this.label)), h("div", { key: '0ed06e68cc15d78d4afead9404e89040229edb6e', class: "textarea-wrapper" }, h("textarea", { key: 'a15b5762cc8288e0b0e9631707055091062d0e95', id: "textarea-element", class: 'textarea-input', ref: (inputEl) => {
+            } }, this.labelPosition !== 'no-label' && (h("label", { key: 'f9877966b5ba3bd607657d36b2a7bbd3c474c16c', htmlFor: `textarea-element-${this.uuid}`, class: 'textarea-label' }, this.label)), h("div", { key: 'cba716bf15c07f17d5960bc67e8f8e3bd6bc5f22', class: "textarea-wrapper" }, h("textarea", { key: '50683f2569ee49c150969b22858a351a953b1222', id: `textarea-element-${this.uuid}`, class: 'textarea-input', ref: (inputEl) => {
                 this.textEl = inputEl;
             }, disabled: this.disabled, readonly: !this.disabled && this.readOnly, placeholder: this.placeholder, value: this.value, name: this.name, autofocus: this.autofocus, maxlength: this.maxLength, cols: this.cols, rows: this.rows, onFocus: (event) => {
                 if (!this.readOnly) {
@@ -76,7 +78,7 @@ export class TdsTextarea {
                 if (!this.readOnly) {
                     this.handleBlur(event);
                 }
-            }, onInput: (event) => this.handleInput(event), onChange: (event) => this.handleChange(event), "aria-invalid": this.state === 'error' ? 'true' : 'false', "aria-readonly": this.readOnly ? 'true' : 'false', "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label, "aria-describedby": "textarea-helper-element" }), h("span", { key: '904e38bce9b98c8ea06428c26083bc3d7476b845', class: "textarea-resizer-icon" }, h("svg", { key: '59e3404d79da1dfad42788e5f6e90e47752d603e', width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '8e91b396a4337c0c56b0e8131d96aae5595506d9', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.8536 0.853553C12.0488 0.658291 12.0488 0.341709 11.8536 0.146447C11.6583 -0.0488155 11.3417 -0.0488155 11.1464 0.146447L0.146447 11.1464C-0.0488155 11.3417 -0.0488155 11.6583 0.146447 11.8536C0.341709 12.0488 0.658291 12.0488 0.853553 11.8536L11.8536 0.853553ZM11.8536 4.64645C12.0488 4.84171 12.0488 5.15829 11.8536 5.35355L5.35355 11.8536C5.15829 12.0488 4.84171 12.0488 4.64645 11.8536C4.45118 11.6583 4.45118 11.3417 4.64645 11.1464L11.1464 4.64645C11.3417 4.45118 11.6583 4.45118 11.8536 4.64645ZM11.8536 8.64645C12.0488 8.84171 12.0488 9.15829 11.8536 9.35355L9.35355 11.8536C9.15829 12.0488 8.84171 12.0488 8.64645 11.8536C8.45118 11.6583 8.45118 11.3417 8.64645 11.1464L11.1464 8.64645C11.3417 8.45118 11.6583 8.45118 11.8536 8.64645Z", fill: "currentColor" }))), !this.disabled && !this.hideReadOnlyIcon && this.readOnly && (h("span", { key: '4c4629c89b4b2545a8482a0cd6c59b7c57888aa8', class: "textarea-icon__readonly" }, h("tds-tooltip", { key: 'cae2de2a71c2891067303188f54d7c1b186886ff', placement: "top-end", text: "This field is non-editable", selector: "#readonly-tooltip" }), h("tds-icon", { key: 'a09a265f4684d2356886a23cdef4a570d8323c04', id: "readonly-tooltip", name: "edit_inactive" })))), h("span", { key: '5862f0cb512faf37724629642c6560bdde90e47e', class: 'textarea-helper', "aria-live": "assertive", id: "textarea-helper-element" }, this.state === 'error' && !this.readOnly && h("tds-icon", { key: 'cc0202e6e28daf0664fb3446fd4118e453e89cff', name: "error", size: "16px" }), this.helper), this.maxLength > 0 && (h("div", { key: '6e1c683c4036b8aa9924ca69d4dda6b2b3a5fd8a', class: 'textarea-textcounter' }, this.value === null ? 0 : (_a = this.value) === null || _a === void 0 ? void 0 : _a.length, h("span", { key: '2eb15f11eb7b8abe3741bc9d4dde13ba2fa02d8a', class: "textfield-textcounter-divider" }, " / "), " ", this.maxLength))));
+            }, onInput: (event) => this.handleInput(event), onChange: (event) => this.handleChange(event), "aria-invalid": this.state === 'error' ? 'true' : 'false', "aria-readonly": this.readOnly ? 'true' : 'false', "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label, "aria-describedby": `textarea-helper-element-${this.uuid}` }), h("span", { key: '63845b20b05c201035152df1aa842760cec47962', class: "textarea-resizer-icon" }, h("svg", { key: 'ba16ccfcbc0252e4353018499354191f29a15fe2', width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '33a546d271c4aecad1c4ce3fc8228a14a3790068', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.8536 0.853553C12.0488 0.658291 12.0488 0.341709 11.8536 0.146447C11.6583 -0.0488155 11.3417 -0.0488155 11.1464 0.146447L0.146447 11.1464C-0.0488155 11.3417 -0.0488155 11.6583 0.146447 11.8536C0.341709 12.0488 0.658291 12.0488 0.853553 11.8536L11.8536 0.853553ZM11.8536 4.64645C12.0488 4.84171 12.0488 5.15829 11.8536 5.35355L5.35355 11.8536C5.15829 12.0488 4.84171 12.0488 4.64645 11.8536C4.45118 11.6583 4.45118 11.3417 4.64645 11.1464L11.1464 4.64645C11.3417 4.45118 11.6583 4.45118 11.8536 4.64645ZM11.8536 8.64645C12.0488 8.84171 12.0488 9.15829 11.8536 9.35355L9.35355 11.8536C9.15829 12.0488 8.84171 12.0488 8.64645 11.8536C8.45118 11.6583 8.45118 11.3417 8.64645 11.1464L11.1464 8.64645C11.3417 8.45118 11.6583 8.45118 11.8536 8.64645Z", fill: "currentColor" }))), !this.disabled && !this.hideReadOnlyIcon && this.readOnly && (h("span", { key: 'f7c2b6973c0ab4990379ea66d05bcf7d846ace1c', class: "textarea-icon__readonly" }, h("tds-tooltip", { key: 'dce91ccbd1aa3649ff9db60c8641a254ed5486f6', placement: "top-end", text: "This field is non-editable", selector: "#readonly-tooltip" }), h("tds-icon", { key: '4dd9659c02aece8803820ec34c65298d109f9007', id: "readonly-tooltip", name: "edit_inactive" })))), h("span", { key: '33954390252928f917ceb119a20eff0f06342cc1', class: 'textarea-helper', "aria-live": "assertive", id: `textarea-helper-element-${this.uuid}` }, this.state === 'error' && !this.readOnly && h("tds-icon", { key: '33c46966f9df85784e2520b096a6f58ebfff2885', name: "error", size: "16px" }), this.helper), this.maxLength > 0 && (h("div", { key: '8c9051a3c6fd9bc65c35b0e2d02786a24acb00de', class: 'textarea-textcounter' }, this.value === null ? 0 : (_a = this.value) === null || _a === void 0 ? void 0 : _a.length, h("span", { key: '59180502bd4aa0bb71378fba4a3899eb59c8211e', class: "textfield-textcounter-divider" }, " / "), " ", this.maxLength))));
     }
     static get is() { return "tds-textarea"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/toast/toast.js

@@ -65,12 +65,12 @@ export class TdsToast {
         const usesHeaderSlot = hasSlot('header', this.host);
         const usesSubheaderSlot = hasSlot('subheader', this.host);
         const usesActionsSlot = hasSlot('actions', this.host);
-        return (h(Host, { key: '57126c13e4498e7862026978aab347dbe7e24d63', "aria-live": this.tdsAriaLive, toastRole: this.toastRole, "aria-describedby": this.host.getAttribute('aria-describedby'), class: {
+        return (h(Host, { key: '371f64114169ae6f8a42a83ca62be3b1111d81e7', "aria-live": this.tdsAriaLive, toastRole: this.toastRole, "aria-describedby": this.host.getAttribute('aria-describedby'), class: {
                 hide: this.hidden,
                 show: !this.hidden,
-            } }, h("div", { key: '099c769d8f2e54b76eada969978e641b3f5c18ea', class: `
+            } }, h("div", { key: '9352959b1f363e8210b96347e15d6ee1671eda97', class: `
             wrapper
-            ${this.variant}` }, h("tds-icon", { key: '60fe4a91c42741be76f882fd82daa4ae3f5de545', name: this.getIconName(), size: "20px" }), h("div", { key: '5c5f4221726b14a38a6fb440a7f15570bb17b3cf', class: `content` }, h("div", { key: '2b53199e99ab3417160af38d81301a61e66eaef0', class: "header-subheader" }, this.header && h("div", { key: 'c98f680755ba45a8661ca46f6064c696ee61b6bb', class: "header" }, this.header), usesHeaderSlot && h("slot", { key: '5420edf38e156a811187eb6f5838bd8611818673', name: "header" }), this.subheader && h("div", { key: '9dc6d054f0f2ee3d179f25a8e75134d73ab426e2', class: "subheader" }, this.subheader), usesSubheaderSlot && h("slot", { key: '726eec99d5f05bea48b5a30bf7e91a71099960f8', name: "subheader" })), usesActionsSlot && (h("div", { key: '1cb83584cdb4cc8e3d383ebdf5d470135f7573ab', class: `toast-bottom ${usesSubheaderSlot || this.subheader ? 'subheader' : 'no-subheader'}` }, h("slot", { key: '0950f174a2e62ffbec229ef24e4a999a318798cd', name: "actions" })))), this.closable && (h("button", { key: 'ee90c96c48a11e38f17acd8cb66a1619bd770e83', id: "my-button", "aria-label": this.tdsCloseAriaLabel, onClick: this.handleClose, class: "close" }, h("tds-icon", { key: '632aefc906f17bd0993c832f9c4c5a1ec8db1ccc', name: "cross", size: "20px" }))))));
+            ${this.variant}` }, h("tds-icon", { key: '9db246bb5db02240242de1fb2189fc5c9c0e2b81', name: this.getIconName(), size: "20px" }), h("div", { key: '8f9560777602ddce1629e0fe28ec7eb8c7f0764a', class: `content` }, h("div", { key: '3884f54d0d0e60f098b5d843d53aefcd8765b8f2', class: "header-subheader" }, this.header && h("div", { key: 'a84a1511ba263347ed1b22c2536c5b31726ecd43', class: "header" }, this.header), usesHeaderSlot && h("slot", { key: 'd29b6eb1d1f5867a7a9d7c96bf18e0b36bf70643', name: "header" }), this.subheader && h("div", { key: 'db0e71f911352e1caeb5d393ca89eaeac7027765', class: "subheader" }, this.subheader), usesSubheaderSlot && h("slot", { key: '7174daff9b337cd7e771644b9aabffb0c524baf2', name: "subheader" })), usesActionsSlot && (h("div", { key: 'a10a7985a5631314645064b1675550f2fb553b36', class: `toast-bottom ${usesSubheaderSlot || this.subheader ? 'subheader' : 'no-subheader'}` }, h("slot", { key: '9f136b3ad9ca7e80ca78271f42f1dade48dd225c', name: "actions" })))), this.closable && (h("button", { key: '5ce50919432231daa334f60a7f9cac6a517bc8c2', id: "my-button", "aria-label": this.tdsCloseAriaLabel, onClick: this.handleClose, class: "close" }, h("tds-icon", { key: '4f2d045d8303aa333109c1d18e3c50f68e325b7f', name: "cross", size: "20px" }))))));
     }
     static get is() { return "tds-toast"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/toggle/toggle.js

@@ -38,10 +38,10 @@ export class TdsToggle {
         }
     }
     render() {
-        return (h("div", { key: '8f8a77827f524c049aa004d15372a78e7fad41e2', class: "tds-toggle" }, this.headline && (h("div", { key: '8e254412e80362807046a893fc3f7c42a0c376ba', class: {
+        return (h("div", { key: '6da0f52d32eda250fc21a3c588c1e2d926fbe4c4', class: "tds-toggle" }, this.headline && (h("div", { key: '0ae25c6f04a1dddf42fcec8350d39001540ec767', class: {
                 'toggle-headline': true,
                 'disabled': this.disabled,
-            } }, this.headline)), h("input", { key: '47ed1307b67b61b1594006449fb1b4ccf6d031b8', "aria-label": this.tdsAriaLabel, "aria-describedby": this.host.getAttribute('aria-describedby'), "aria-labelledby": this.host.getAttribute('aria-labelledby'), "aria-checked": this.checked, "aria-required": this.required, onChange: () => this.handleToggle(), class: `${this.size}`, checked: this.checked, disabled: this.disabled, required: this.required, type: "checkbox", name: this.name, id: this.toggleId, role: "switch" }), this.labelSlot && (h("label", { key: '75964d686710d6b4f8bbe365cc51c8aab3234d26', class: { disabled: this.disabled }, htmlFor: this.toggleId }, h("slot", { key: 'aeeaed1f37a160ce792df3f5115c75eaa0fd2c0a', name: "label" })))));
+            } }, this.headline)), h("input", { key: 'e377c5abadf93192db6cc0da87bedb904a6dac0a', "aria-label": this.tdsAriaLabel, "aria-describedby": this.host.getAttribute('aria-describedby'), "aria-labelledby": this.host.getAttribute('aria-labelledby'), "aria-checked": this.checked, "aria-required": this.required, onChange: () => this.handleToggle(), class: `${this.size}`, checked: this.checked, disabled: this.disabled, required: this.required, type: "checkbox", name: this.name, id: this.toggleId, role: "switch" }), this.labelSlot && (h("label", { key: 'c23fa4c4e361bcf67585077adf5e5ecdd340e308', class: { disabled: this.disabled }, htmlFor: this.toggleId }, h("slot", { key: '011d721feb8779b8064bd9ee05940e9ee2590919', name: "label" })))));
     }
     static get is() { return "tds-toggle"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/tooltip/tooltip.js

@@ -58,7 +58,7 @@ export class TdsTooltip {
     }
     render() {
         var _a;
-        return (h(Host, { key: '59eff46fa8b6f26ac7b43fff50f8f388d45d16a7', role: "tooltip", "aria-describedby": this.tdsAriaDescribedby, "aria-label": this.text }, h("tds-popover-core", Object.assign({ key: 'b6fb24abddaa4d7a804876891993b463a36e8610' }, this.inheritedAttributes, { class: {
+        return (h(Host, { key: '9209dd16639d00c6cbf72215f6fefe445539482b', role: "tooltip", "aria-describedby": this.tdsAriaDescribedby, "aria-label": this.text }, h("tds-popover-core", Object.assign({ key: '0a6b8305dbf90f976ebe7bbc144c7259eaedd563' }, this.inheritedAttributes, { class: {
                 'tds-tooltip': true,
                 [`tds-tooltip-${this.border}`]: true,
                 [(_a = this.inheritedAttributes.class) !== null && _a !== void 0 ? _a : '']: true,
@@ -71,7 +71,7 @@ export class TdsTooltip {
             // @ts-ignore
             onInternalTdsClose: () => {
                 this.show = false;
-            }, defaultShow: this.defaultShow }), this.text, h("slot", { key: 'a1b4e5f08a1239a6a0d522b4057f6d529c9e79d9' }))));
+            }, defaultShow: this.defaultShow }), this.text, h("slot", { key: '368b56fc092da7005b1994c4283c061a61f5e529' }))));
     }
     static get is() { return "tds-tooltip"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/types/ScaniaIcons.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/types/TratonIcons.js

@@ -0,0 +1 @@
+export {};

package/dist/components/{p-1c606f82.js → p-090bb1e9.js}

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-28ef5186.js';
 import { c as convertToString } from './p-a1181b1f.js';
-import { d as defineCustomElement$2 } from './p-14ab9663.js';
-import { d as defineCustomElement$1 } from './p-92fb75a7.js';
+import { d as defineCustomElement$2 } from './p-1ef7423a.js';
+import { d as defineCustomElement$1 } from './p-adf3fdac.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;transition:background-color var(--tds-motion-duration-fast-02) var(--tds-motion-easing-scania)}: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.xs{padding:7px 0 8px}: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 .multiselect tds-checkbox.xs{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;
@@ -89,7 +89,7 @@ const TdsDropdownOption = /*@__PURE__*/ proxyCustomElement(class TdsDropdownOpti
         this.internalValue = convertToString(this.value);
     }
     render() {
-        return (h(Host, { key: 'f471d5238869b3a522b36d99d7549c1229cd83a2' }, h("div", { key: 'da9edccba96999b0ee40f8c599325774593de814', class: `dropdown-option 
+        return (h(Host, { key: '74a589238e0aa9efbb7f0d04acf1327277182dd8' }, h("div", { key: '0ae5f014516383833b2504c4dfe3c317e44d1ef9', class: `dropdown-option 
           ${this.size}
           ${this.selected ? 'selected' : ''}
           ${this.disabled ? 'disabled' : ''}

package/dist/components/{p-14ab9663.js → p-1ef7423a.js}

@@ -64,11 +64,11 @@ const TdsCheckbox = /*@__PURE__*/ proxyCustomElement(class TdsCheckbox extends H
         }
     }
     render() {
-        return (h("div", { key: '26c1c30edd11f3d1dc76beffa496b93841a7dac5', class: "tds-checkbox" }, h("input", { key: 'ebb9d474d9f726248f7a0c9079c5474431d18104',
+        return (h("div", { key: '8f5104073f1be9323bc0125feab7515759ac7679', class: "tds-checkbox" }, h("input", { key: '8536a1eaefb5b7bdf258a4ddca67660becc797a5',
             // eslint-disable-next-line no-return-assign
             ref: (inputElement) => (this.inputElement = inputElement), indeterminate: this.indeterminate, "aria-checked": this.checked, "aria-required": this.required, "aria-label": this.tdsAriaLabel, "aria-describedby": this.tdsAriaDescribedby, required: this.required, type: "checkbox", name: this.name, value: this.value, id: this.checkboxId, checked: this.checked, disabled: this.disabled, onFocus: (event) => this.handleFocus(event), onBlur: (event) => this.handleBlur(event), onChange: () => {
                 this.handleChange();
-            } }), h("label", { key: '68e89bdc35cc5f37756cdbde5f563bf64e334310', htmlFor: this.checkboxId }, h("slot", { key: 'f5122194e84705f82c8f148feadfc2787577c346', name: "label" }))));
+            } }), h("label", { key: 'e6e065ce109371607c5412ab38ece22d3ac1d626', htmlFor: this.checkboxId }, h("slot", { key: '4698f97ac58203e3f478321da53cc364157ded78', name: "label" }))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/{p-265c3467.js → p-3f2187a4.js}

@@ -12,7 +12,7 @@ const TdsSideMenuUserLabel = /*@__PURE__*/ proxyCustomElement(class TdsSideMenuU
         this.subheading = undefined;
     }
     render() {
-        return (h(Host, { key: '7bac8221992109403d3f0506b7f0125a0b77b6d4' }, this.heading, this.subheading && h("div", { key: 'b9137e36496fb7fc10da067ea61596da2a38fa9d', class: "subheading" }, this.subheading)));
+        return (h(Host, { key: '5b045eb527ee378f50f6a1bec3a383b9c0f352ef' }, this.heading, this.subheading && h("div", { key: '3e106d0bdbe62438e8d2edbf73f43324cb78ffdd', class: "subheading" }, this.subheading)));
     }
     static get style() { return TdsSideMenuUserLabelStyle0; }
 }, [1, "tds-side-menu-user-label", {

package/dist/components/{p-c0b84c59.js → p-50b1ba5c.js}

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-28ef5186.js';
 import { c as convertToString, a as convertArrayToStrings } from './p-a1181b1f.js';
-import { d as defineCustomElement$1 } from './p-92fb75a7.js';
+import { d as defineCustomElement$1 } from './p-adf3fdac.js';
 
 /**
  * Find the next focusable element index in a list of focusable elements.
@@ -467,9 +467,9 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
     }
     render() {
         appendHiddenInput(this.host, this.name, this.selectedOptions.join(','), this.disabled);
-        return (h(Host, { key: 'b8c418ebe609789c1610178d764a7d620e2231c2', class: {
+        return (h(Host, { key: '355b932acbd4bd73fd49f03fc97c45d2851d384c', class: {
                 [`tds-mode-variant-${this.modeVariant}`]: Boolean(this.modeVariant),
-            } }, this.label && this.labelPosition === 'outside' && (h("div", { key: 'ee5c005d5020e2226ce54c93a90f2098e081a6df', class: `label-outside ${this.disabled ? 'disabled' : ''}` }, this.label)), h("div", { key: 'ca674a2361f1301886bb855b7093c67b999a500a', class: {
+            } }, this.label && this.labelPosition === 'outside' && (h("div", { key: '6551ecaae468c210b4d984ab611ce6053c0e4793', class: `label-outside ${this.disabled ? 'disabled' : ''}` }, this.label)), h("div", { key: '9942c7bc9940d319d8cf97dc17cd1241633921e2', class: {
                 'dropdown-select': true,
                 [this.size]: true,
                 'disabled': this.disabled,
@@ -519,7 +519,7 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
                     label-inside-as-placeholder
                     ${this.size}
                     ${this.selectedOptions.length ? 'selected' : ''}
-                    ` }, this.label)), h("div", { class: `placeholder ${this.size}` }, this.selectedOptions.length ? this.getValue() : this.placeholder), h("tds-icon", { "aria-label": "Open/Close dropdown", svgTitle: "Open/Close dropdown", class: `menu-icon ${this.open ? 'open' : 'closed'}`, name: "chevron_down", size: "16px" }))))), h("div", { key: '14558013e5903958942dc7dd3ef2d3a49f79b245', role: "listbox", "aria-label": this.tdsAriaLabel, "aria-orientation": "vertical", "aria-multiselectable": this.multiselect, ref: (element) => {
+                    ` }, this.label)), h("div", { class: `placeholder ${this.size}` }, this.selectedOptions.length ? this.getValue() : this.placeholder), h("tds-icon", { "aria-label": "Open/Close dropdown", svgTitle: "Open/Close dropdown", class: `menu-icon ${this.open ? 'open' : 'closed'}`, name: "chevron_down", size: "16px" }))))), h("div", { key: 'd0b201e483628f0152d4169dfe53eba25860bd8e', role: "listbox", "aria-label": this.tdsAriaLabel, "aria-orientation": "vertical", "aria-multiselectable": this.multiselect, ref: (element) => {
                 this.dropdownList = element;
             }, class: {
                 'dropdown-list': true,
@@ -530,11 +530,11 @@ const TdsDropdown = /*@__PURE__*/ proxyCustomElement(class TdsDropdown extends H
                 'closed': !this.open,
                 [`animation-enter-${this.animation}`]: this.animation !== 'none' && this.open,
                 [`animation-exit-${this.animation}`]: this.animation !== 'none' && !this.open,
-            } }, h("slot", { key: '5f69c2fcb5b6a130888d7cd92d4cb882122e3e58', onSlotchange: () => this.handleSlotChange() }), this.filterResult === 0 && this.noResultText !== '' && (h("div", { key: 'bae7a62960f90cd7b679ac4956a677dbff378ac7', class: `no-result ${this.size}` }, this.noResultText))), this.helper && (h("div", { key: 'be5fe56a1e19e812fa983c22f130c0d3001da55b', class: {
+            } }, h("slot", { key: 'e18a6991f876c142ff21d6e15c121a8e450735ae', onSlotchange: () => this.handleSlotChange() }), this.filterResult === 0 && this.noResultText !== '' && (h("div", { key: '79b654db4e9a18b5a19e2a42d2fd06d7bea4fe6b', class: `no-result ${this.size}` }, this.noResultText))), this.helper && (h("div", { key: 'e0bef905f7e310a47e567ea6fa13e11923b54232', class: {
                 helper: true,
                 error: this.error,
                 disabled: this.disabled,
-            } }, this.error && h("tds-icon", { key: 'c0ccc491caa1aca628aff12e02d8a917a74e9c86', name: "error", size: "16px" }), this.helper))));
+            } }, this.error && h("tds-icon", { key: '0ee7ab0c6c86e35ce5c0d1933e75237fb43d58d1', name: "error", size: "16px" }), this.helper))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/{p-8c849aa2.js → p-74971a3e.js}

@@ -12,10 +12,10 @@ const TdsHeaderDropdownListItem = /*@__PURE__*/ proxyCustomElement(class TdsHead
         this.size = 'md';
     }
     render() {
-        return (h(Host, { key: 'ca37bc294a28794d8bcd7aea18464665b5e8edad' }, h("div", { key: '640cee1fd256dbbc046f8564808ea45ed838d2c5', class: {
+        return (h(Host, { key: 'a77c76be838a9f7036fe712b86cdf2f5b3c0c46f' }, h("div", { key: 'a3740446c4fed86228fa14ecb20b99b2c707f97b', class: {
                 'component': true,
                 'component-selected': this.selected,
-            } }, h("slot", { key: 'e5cf6d2af513224921c836206f16d6c44879369c' }))));
+            } }, h("slot", { key: '0a037fd8059aa356ed9885e3e06d391f876e2fc3' }))));
     }
     get host() { return this; }
     static get style() { return TdsHeaderDropdownListItemStyle0; }

package/dist/components/{p-3dcfe1f4.js → p-76c8d381.js}

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
 import { i as inheritAttributes } from './p-3fe9cbbf.js';
-import { d as defineCustomElement$1 } from './p-252f3d4d.js';
+import { d as defineCustomElement$1 } from './p-b0ca50a3.js';
 
 const tooltipCss = ".sc-tds-tooltip-h{position:absolute}.tds-tooltip.sc-tds-tooltip{box-sizing:border-box;font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);color:var(--tds-tooltip-color);background-color:var(--tds-tooltip-background);border-radius:4px;padding:8px;word-wrap:break-word;white-space:normal;max-width:192px;z-index:900;opacity:0;visibility:hidden;transition:opacity 200ms ease-in, visibility 200ms ease-in}.tds-tooltip.sc-tds-tooltip *.sc-tds-tooltip{box-sizing:border-box}.tds-tooltip.tds-tooltip-top-left.sc-tds-tooltip{border-radius:0 4px 4px}.tds-tooltip.tds-tooltip-top-right.sc-tds-tooltip{border-radius:4px 0 4px 4px}.tds-tooltip.tds-tooltip-bottom-right.sc-tds-tooltip{border-radius:4px 4px 0}.tds-tooltip.tds-tooltip-bottom-left.sc-tds-tooltip{border-radius:4px 4px 4px 0}.tds-tooltip-show.sc-tds-tooltip{opacity:1;visibility:visible}";
 const TdsTooltipStyle0 = tooltipCss;
@@ -62,7 +62,7 @@ const TdsTooltip = /*@__PURE__*/ proxyCustomElement(class TdsTooltip extends H {
     }
     render() {
         var _a;
-        return (h(Host, { key: '59eff46fa8b6f26ac7b43fff50f8f388d45d16a7', role: "tooltip", "aria-describedby": this.tdsAriaDescribedby, "aria-label": this.text }, h("tds-popover-core", Object.assign({ key: 'b6fb24abddaa4d7a804876891993b463a36e8610' }, this.inheritedAttributes, { class: {
+        return (h(Host, { key: '9209dd16639d00c6cbf72215f6fefe445539482b', role: "tooltip", "aria-describedby": this.tdsAriaDescribedby, "aria-label": this.text }, h("tds-popover-core", Object.assign({ key: '0a6b8305dbf90f976ebe7bbc144c7259eaedd563' }, this.inheritedAttributes, { class: {
                 'tds-tooltip': true,
                 [`tds-tooltip-${this.border}`]: true,
                 [(_a = this.inheritedAttributes.class) !== null && _a !== void 0 ? _a : '']: true,
@@ -75,7 +75,7 @@ const TdsTooltip = /*@__PURE__*/ proxyCustomElement(class TdsTooltip extends H {
             // @ts-ignore
             onInternalTdsClose: () => {
                 this.show = false;
-            }, defaultShow: this.defaultShow }), this.text, h("slot", { key: 'a1b4e5f08a1239a6a0d522b4057f6d529c9e79d9' }))));
+            }, defaultShow: this.defaultShow }), this.text, h("slot", { key: '368b56fc092da7005b1994c4283c061a61f5e529' }))));
     }
     get host() { return this; }
     static get style() { return TdsTooltipStyle0; }

package/dist/components/{p-d61bd22e.js → p-7dbc1182.js}

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
 import { d as dfs } from './p-52bf0fdf.js';
-import { d as defineCustomElement$1 } from './p-e49a0ceb.js';
+import { d as defineCustomElement$1 } from './p-e1622f4a.js';
 
 const headerItemCss = ":host ::slotted(button),:host ::slotted(a){all:unset;box-sizing:border-box;background-color:var(--tds-header-background);border-right:1px solid var(--tds-header--basic-element-border);width:100%;height:100%;cursor:pointer;padding:0 24px;display:flex;align-items:center;gap:8px}:host ::slotted(button) *,:host ::slotted(a) *{box-sizing:border-box}:host ::slotted(button:hover),:host ::slotted(a:hover){background-color:var(--tds-header-item-hover)}:host ::slotted(button:focus-visible),:host ::slotted(a:focus-visible){outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host .component-active ::slotted(button),:host .component-active ::slotted(a){background-color:var(--tds-header--basic-element-background-open);color:var(--tds-header-nav-item-dropdown-opened-color);border-color:var(--tds-header--basic-element-border-open)}:host .component-selected:not(.component-active) ::slotted(button),:host .component-selected:not(.component-active) ::slotted(a){background-color:var(--tds-header--basic-element-background-selected);padding-top:4px;border-bottom-style:solid;border-bottom-width:4px;border-bottom-color:var(--tds-nav-item-border-color-active)}";
 const TdsHeaderItemStyle0 = headerItemCss;
@@ -79,10 +79,10 @@ const TdsHeaderItem = /*@__PURE__*/ proxyCustomElement(class TdsHeaderItem exten
         }
     }
     render() {
-        return (h(Host, { key: '04494c94f296aeaed5dc491c2ebf31450e15efc1' }, h("tds-core-header-item", { key: '8a699bc7134795ca9670a0f21a688dc3efadd51a', class: {
+        return (h(Host, { key: '8bf1f05e837866442a31d6079cebce9f3f4b6a01' }, h("tds-core-header-item", { key: '2000815259c320803ecc6bb71553d56187c40983', class: {
                 'component-active': this.active,
                 'component-selected': this.selected,
-            } }, h("slot", { key: 'd0c443c281df9015bbdbffd1b56035d2c7e0cca2' }))));
+            } }, h("slot", { key: '35753d03b2ca354b0054172079ac20cd87524538' }))));
     }
     get host() { return this; }
     static get style() { return TdsHeaderItemStyle0; }

package/dist/components/{p-f8a36676.js → p-7f02bdf2.js}

@@ -1,8 +1,8 @@
 import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
 import { i as inheritAriaAttributes } from './p-0bd4c19c.js';
-import { d as defineCustomElement$3 } from './p-e49a0ceb.js';
-import { d as defineCustomElement$2 } from './p-d61bd22e.js';
-import { d as defineCustomElement$1 } from './p-92fb75a7.js';
+import { d as defineCustomElement$3 } from './p-e1622f4a.js';
+import { d as defineCustomElement$2 } from './p-7dbc1182.js';
+import { d as defineCustomElement$1 } from './p-adf3fdac.js';
 
 const headerLauncherButtonCss = ":host{display:block}:host tds-header-item{display:block}:host .icon{position:relative;margin-left:-6px;left:3px;transition:all 0.2s ease-in-out}";
 const TdsHeaderLauncherButtonStyle0 = headerLauncherButtonCss;
@@ -18,7 +18,7 @@ const TdsHeaderLauncherButton = /*@__PURE__*/ proxyCustomElement(class TdsHeader
     render() {
         this.ariaAttributes = Object.assign(Object.assign({}, this.ariaAttributes), inheritAriaAttributes(this.host));
         const buttonProps = Object.assign({}, this.ariaAttributes);
-        return (h(Host, { key: '445f5863dd96c417c99e460248bd0f2c2a224f0a' }, h("tds-header-item", { key: '792692a34c1192d37e81322a8e75387e51954ebe', active: this.active }, h("button", Object.assign({ key: '7be3e9e148ceab7b361f37b1029dfad474db7b16' }, buttonProps, { "aria-label": this.tdsAriaLabel }), h("tds-icon", { key: '5001f19dfa40ade6a9c64052caa4c38de901a5d4', class: "icon", name: "bento", size: "20px", "svg-title": this.tdsAriaLabel })))));
+        return (h(Host, { key: '6d8b16f71586f3bc944f17aa80234605bbc57ab0' }, h("tds-header-item", { key: '49529617101956090cdc2092d4df80fdf376a123', active: this.active }, h("button", Object.assign({ key: '76cd7b84413aafedaec6b1326e55307bf640b73f' }, buttonProps, { "aria-label": this.tdsAriaLabel }), h("tds-icon", { key: '145394461e3bc680a2f2b07e82f8b3bb549f1e6d', class: "icon", name: "bento", size: "20px", "svg-title": this.tdsAriaLabel })))));
     }
     get host() { return this; }
     static get style() { return TdsHeaderLauncherButtonStyle0; }

package/dist/components/{p-0e6efec9.js → p-8a483a61.js}

@@ -58,12 +58,12 @@ const TdsSideMenuItem = /*@__PURE__*/ proxyCustomElement(class TdsSideMenuItem e
         this.updateSlottedElements();
     }
     render() {
-        return (h(Host, { key: '47e9325f6606cb06ce21676b12b9123bb5147501' }, h("div", { key: 'b0309c6d2242d862a3c91fe0f8e94af73af915d5', class: {
+        return (h(Host, { key: '0c9290486534fe72176fd531e9c1946358984c3a' }, h("div", { key: 'e215756bc01214c4de39702eec972ccb84a58d2d', class: {
                 'component': true,
                 'component-selected': this.selected,
                 'component-active': this.active,
                 'component-collapsed': this.collapsed,
-            } }, h("slot", { key: 'f96fa0078d9d2da5f76edb05d91cb5eb19dd01fb' }))));
+            } }, h("slot", { key: 'c461a28519b6632322b872b71407ee82ed82a950' }))));
     }
     get host() { return this; }
     static get style() { return TdsSideMenuItemStyle0; }

package/dist/components/{p-34737ed9.js → p-9336db16.js}

@@ -75,7 +75,7 @@ const TdsHeaderDropdownList = /*@__PURE__*/ proxyCustomElement(class TdsHeaderDr
             'role': 'list',
             'aria-labelledby': (_a = this.headingElement) === null || _a === void 0 ? void 0 : _a.id,
         };
-        return (h(Host, Object.assign({ key: 'ed227a94a244fcb78cef53b5f0253e5df9a41c31' }, attributes), h("slot", { key: '39e541672f4ab52a308a9cb5856c9d2535afbfea' })));
+        return (h(Host, Object.assign({ key: '57e8ecd046b7a260f1516fc80673e9d095ffd4d3' }, attributes), h("slot", { key: 'e0bafe5fffcf8864faebd4603597e3e424a35046' })));
     }
     get host() { return this; }
     static get style() { return TdsHeaderDropdownListStyle0; }