@scania/tegel 1.14.0 → 1.15.0-component-versioning-beta.0

package/dist/esm/tds-navigation-tabs.entry.js

@@ -1,6 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-51d04e39.js';
+import { g as getPrefixedTagNames } from './tagName-0d04643f.js';
 
-const navigationTabsCss = ":host{box-sizing:border-box;display:flex;background-color:var(--tds-inline-tabs-background);position:relative}:host *{box-sizing:border-box}:host::after{content:\" \";display:block;border-bottom:1px solid var(--tds-inline-tabs-horizontal-divider-background);opacity:var(--tds-inline-tabs-horizontal-divider-opacity);left:0;right:0;bottom:0;position:absolute}:host .wrapper{display:flex;flex-wrap:nowrap;white-space:nowrap;width:100%;overflow-x:scroll;scrollbar-width:none}:host .wrapper::-webkit-scrollbar{display:none}:host .scroll-right-button{right:0;z-index:1}:host .scroll-left-button{left:0;z-index:1}:host .scroll-right-button,:host .scroll-left-button{color:var(--tds-folder-tabs-scroll-btn-color);cursor:pointer;border:0;width:0;background-color:var(--tds-inline-tabs-scroll-btn-background);display:none;justify-content:center;align-items:center;opacity:0;pointer-events:none;position:sticky}:host .scroll-right-button.show,:host .scroll-left-button.show{min-width:48px;display:block;opacity:1;pointer-events:all}:host .scroll-right-button:hover,:host .scroll-left-button:hover{background-color:var(--tds-folder-tabs-scroll-btn-background-hover)}:host .scroll-right-button:active,:host .scroll-left-button:active{background-color:var(--tds-folder-tabs-scroll-btn-background-active)}:host .scroll-right-button:focus,:host .scroll-left-button:focus{outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host .scroll-right-button svg,:host .scroll-left-button svg{fill:var(--tds-folder-tabs-scroll-btn-color)}";
+const navigationTabsCss = ":host{box-sizing:border-box;display:flex;background-color:var(--tds-inline-tabs-background);position:relative}:host *{box-sizing:border-box}:host::after{content:\" \";display:block;border-bottom:1px solid var(--tds-inline-tabs-horizontal-divider-background);opacity:var(--tds-inline-tabs-horizontal-divider-opacity);left:0;right:0;bottom:0;position:absolute}:host .wrapper{display:flex;flex-wrap:nowrap;white-space:nowrap;width:100%;overflow-x:scroll;scrollbar-width:none;gap:16px}:host .wrapper::-webkit-scrollbar{display:none}:host .scroll-right-button{right:0;z-index:1}:host .scroll-left-button{left:0;z-index:1}:host .scroll-right-button,:host .scroll-left-button{color:var(--tds-folder-tabs-scroll-btn-color);cursor:pointer;border:0;width:0;background-color:var(--tds-inline-tabs-scroll-btn-background);display:none;justify-content:center;align-items:center;opacity:0;pointer-events:none;position:sticky}:host .scroll-right-button.show,:host .scroll-left-button.show{min-width:48px;display:block;opacity:1;pointer-events:all}:host .scroll-right-button:hover,:host .scroll-left-button:hover{background-color:var(--tds-folder-tabs-scroll-btn-background-hover)}:host .scroll-right-button:active,:host .scroll-left-button:active{background-color:var(--tds-folder-tabs-scroll-btn-background-active)}:host .scroll-right-button:focus,:host .scroll-left-button:focus{outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host .scroll-right-button svg,:host .scroll-left-button svg{fill:var(--tds-folder-tabs-scroll-btn-color)}";
 const TdsNavigationTabsStyle0 = navigationTabsCss;
 
 const TdsNavigationTabs = class {
@@ -63,6 +64,7 @@ const TdsNavigationTabs = class {
         this.modeVariant = 'primary';
         this.defaultSelectedIndex = 0;
         this.selectedIndex = undefined;
+        this.leftPadding = 32;
         this.showLeftScroll = false;
         this.showRightScroll = false;
     }
@@ -115,8 +117,10 @@ const TdsNavigationTabs = class {
             child.classList.remove('last');
             child.classList.remove('first');
         });
-        this.children[0].classList.add('first');
-        this.children[this.children.length - 1].classList.add('last');
+        if (this.children.length > 0) {
+            this.children[0].classList.add('first');
+            this.children[this.children.length - 1].classList.add('last');
+        }
     }
     initializeSelectedTab() {
         if (this.selectedIndex === undefined) {
@@ -140,12 +144,18 @@ const TdsNavigationTabs = class {
             this.showRightScroll = false;
         }
     }
+    applyCustomLeftPadding() {
+        if (this.navWrapperElement) {
+            this.navWrapperElement.style.paddingLeft = `${this.leftPadding}px`;
+        }
+    }
     handleSlotChange() {
         this.initializeTabs();
         this.addEventListenerToTabs();
         this.initializeSelectedTab();
         this.updateScrollButtons();
         this.addResizeObserver();
+        this.applyCustomLeftPadding(); // Apply custom left padding to the wrapper
     }
     connectedCallback() {
         this.initializeTabs();
@@ -161,9 +171,10 @@ const TdsNavigationTabs = class {
         this.removeEventListenerFromTabs();
     }
     render() {
-        return (h(Host, { key: 'eaf7fd47f5f4132d7920d5deafb659828cab01e9', role: "list", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: '1fe0e2f45e6cf32175a3ef6c556aa63ba3b46b97', class: "wrapper", ref: (el) => {
+        const prefixedTagNames = getPrefixedTagNames(this.host);
+        return (h(Host, { key: 'fc517a4647224414ac6b1643b7ff3cb94810e69c', role: "list", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: '4a26e80281ecc5a791a8c5eee623fdc8a1630f68', class: "wrapper", ref: (el) => {
                 this.navWrapperElement = el;
-            } }, h("button", { key: 'fa71abb901a1c6ab70dde90d759d9aa537a72ec2', class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, h("tds-icon", { key: '0aff4668869fa761e03e8c81ed054561787beb49', name: "chevron_left", size: "20px" })), h("slot", { key: '169f8b9eb18a33fb4fc739863eaf4a730e066c83', onSlotchange: () => this.handleSlotChange() }), h("button", { key: '9c9757d3c818191ce5aec5bbd64699c04dfc07db', class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, h("tds-icon", { key: 'e38ac8674d9e3e4aeaa67bd888cd411002353634', name: "chevron_right", size: "20px" })))));
+            }, style: { paddingLeft: `${this.leftPadding}px` } }, h("button", { key: '6b60e0b9635abf48ca821f8e157b2dff42f8ea24', class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, h(prefixedTagNames.tdsIcon, { key: 'eccc37fc81804e909bec8a77279fee3eb156aaa2', name: "chevron_left", size: "20px" })), h("slot", { key: 'f48ae4ce1f825415a5c70d86a73caad8411b9bec', onSlotchange: () => this.handleSlotChange() }), h("button", { key: 'd0fca82d30d9e354edd26147be75f03fbabdedc0', class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, h(prefixedTagNames.tdsIcon, { key: 'bc9270c86e3bfbdfb9168f12865d294f2e7fba3a', name: "chevron_right", size: "20px" })))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/tds-popover-canvas.entry.js

@@ -1,5 +1,6 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-51d04e39.js';
 import { i as inheritAttributes } from './inheritAttributes-d21e267b.js';
+import { g as getPrefixedTagNames } from './tagName-0d04643f.js';
 
 const popoverCanvasCss = ".tds-popover-canvas.sc-tds-popover-canvas{box-sizing:border-box;display:inline-block;color:var(--tds-popover-canvas-color);background-color:var(--tds-popover-canvas-background);box-shadow:0 3px 3px rgba(0, 0, 0, 0.15), 0 -1px 1px rgba(0, 0, 0, 0.1);border-radius:4px;z-index:900}.tds-popover-canvas.sc-tds-popover-canvas *.sc-tds-popover-canvas{box-sizing:border-box}";
 const TdsPopoverCanvasStyle0 = popoverCanvasCss;
@@ -27,12 +28,13 @@ const TdsPopoverCanvas = class {
     }
     render() {
         var _a;
-        return (h(Host, { key: '6585164269ddef7083e5aed2bcfa4ea5ab7d32ba' }, h("tds-popover-core", Object.assign({ key: '9470ac2faa94611ece2c9394717a7bb9d63eb5b1' }, this.inheritedAttributes, { class: {
+        const prefixedTagNames = getPrefixedTagNames(this.host);
+        return (h(Host, { key: '20f9ec1ff4aa412411f04c1448ab218846b3daff' }, h(prefixedTagNames.tdsPopoverCore, Object.assign({ key: 'c40d4551a718074f8c1508ac37c92e757c550c06' }, this.inheritedAttributes, { class: {
                 'tds-popover-canvas': true,
                 [(_a = this.inheritedAttributes.class) !== null && _a !== void 0 ? _a : '']: true,
             }, selector: this.selector, referenceEl: this.referenceEl, show: this.show, placement: this.placement, offsetSkidding: this.offsetSkidding, offsetDistance: this.offsetDistance, modifiers: this.modifiers, trigger: 'click', ref: (el) => {
                 this.childRef = el;
-            } }), h("div", { key: '330a63a0ef5c9f057d877dae9977b8bc25987771' }, h("slot", { key: '38787385e51260e4a140f83d5eb22f03deb6e30e' })))));
+            } }), h("div", { key: '64101f87fa1f0d22962ddcc1337dafedd3dbd454' }, h("slot", { key: '4c0a7a20eece3cb14465d599821ff0467672476d' })))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/tds-popover-menu.entry.js

@@ -1,5 +1,6 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-51d04e39.js';
 import { i as inheritAttributes } from './inheritAttributes-d21e267b.js';
+import { g as getPrefixedTagNames } from './tagName-0d04643f.js';
 
 const popoverMenuCss = ".tds-popover-menu.sc-tds-popover-menu{box-sizing:border-box;overflow:hidden;width:160px;background-color:var(--tds-popover-menu-background);padding:16px 6px;box-shadow:0 3px 3px rgba(0, 0, 0, 0.15), 0 -1px 1px rgba(0, 0, 0, 0.1);border-radius:4px;z-index:900}.tds-popover-menu.sc-tds-popover-menu *.sc-tds-popover-menu{box-sizing:border-box}.tds-popover-menu.fluid-width.sc-tds-popover-menu{width:unset}tds-popover-core.sc-tds-popover-menu{padding:6px 0 !important}.sc-tds-popover-menu-s>tds-divider{display:block;padding:6px !important}";
 const TdsPopoverMenuStyle0 = popoverMenuCss;
@@ -27,13 +28,14 @@ const TdsPopoverMenu = class {
     }
     render() {
         var _a;
-        return (h(Host, { key: '36c12148ce4507dd4b157fff5be30760d2374bdd' }, h("tds-popover-core", { key: '92d5abfd7e7213dcb22c92fa401a21dfeef76edd', class: {
+        const prefixedTagNames = getPrefixedTagNames(this.host);
+        return (h(Host, { key: '175101f0b9f5df56fa56a2a15d43468d5065129a' }, h(prefixedTagNames.tdsPopoverCore, { key: '91613f80d57750fe7f1a5957e5b3c359708f85b2', class: {
                 'tds-popover-menu': true,
                 [(_a = this.inheritedAttributes.class) !== null && _a !== void 0 ? _a : '']: true,
                 'fluid-width': this.fluidWidth,
             }, selector: this.selector, referenceEl: this.referenceEl, show: this.show, placement: this.placement, offsetSkidding: this.offsetSkidding, offsetDistance: this.offsetDistance, ref: (el) => {
                 this.childRef = el;
-            } }, h("div", { key: '6b3a893d1d0a9c32a3846c7216a4fdac92a4222c', role: "list" }, h("slot", { key: 'cae075f5e187b5f59638f6f2a9ff8c38e716bcbb' })))));
+            } }, h("div", { key: 'a5ee1d312e2608e134924e584f0c7b81a79b7401', role: "list" }, h("slot", { key: '27ca85a642e2ca45a36522d1917ba01042c5f347' })))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/tds-side-menu-close-button.entry.js

@@ -1,5 +1,6 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-51d04e39.js';
 import { i as inheritAriaAttributes } from './inheritAriaAttributes-04f2f252.js';
+import { g as getPrefixedTagNames } from './tagName-0d04643f.js';
 import './inheritAttributes-d21e267b.js';
 
 const sideMenuCloseButtonCss = ":host button{height:64px;width:100%;text-align:left;padding:0 24px;border:none;background-color:var(--tds-sidebar-side-menu-background-cover);font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);color:var(--tds-sidebar-side-menu-single-item-color);display:flex;align-items:center;border-bottom:1px solid var(--tds-sidebar-side-menu-bottom-menu-border-top)}:host button:hover{cursor:pointer;background-color:var(--tds-sidebar-item-state-hover)}:host button:focus-visible{cursor:pointer;border:1px solid var(--tds-sidebar-side-menu-single-subitem-selected-border-color)}";
@@ -10,8 +11,9 @@ const TdsSideMenuCloseButton = class {
         registerInstance(this, hostRef);
     }
     render() {
+        const prefixedTagNames = getPrefixedTagNames(this.host);
         const buttonProps = Object.assign({ 'aria-label': 'Close' }, inheritAriaAttributes(this.host));
-        return (h(Host, { key: '1dff25b895f341657373ab020116e5c4c0f7af67' }, h("button", Object.assign({ key: 'e2c3af974cfc7f9c9e0ec5b64c199fcda0408279' }, buttonProps), h("tds-icon", { key: 'aa56689766fe0c49e8d8d591c9f741a24dd85cc8', name: "cross", size: "20px" }))));
+        return (h(Host, { key: 'b8d9efa8e96a192966ead2a13898665f82b3fc2d' }, h("button", Object.assign({ key: '39f2161c9d6330bb9d0ca2245b2e6b63622fd9a6' }, buttonProps), h(prefixedTagNames.tdsIcon, { key: 'a3e98760aef2bf5bced8a96cae2e01067ab5a61c', name: "cross", size: "20px" }))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/tds-side-menu-collapse-button.entry.js

@@ -1,4 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-51d04e39.js';
+import { g as getPrefixedTagNames } from './tagName-0d04643f.js';
 
 const sideMenuCollapseButtonCss = ":host{position:sticky;bottom:0;display:none;height:68px;border-top:1px solid var(--tds-sidebar-side-menu-bottom-menu-border-top)}:host .icon{transform:rotateZ(90deg);transition:all 0.2s ease-in-out;width:20px;height:20px}:host .state-collapsed .icon{transform:translateX(-50%) rotateZ(90deg) rotateX(180deg);color:var(--tds-sidebar-side-menu-single-item-color);margin-left:0;position:absolute;left:50%}@media (min-width: 992px){:host{display:block}}";
 const TdsSideMenuCollapseButtonStyle0 = sideMenuCollapseButtonCss;
@@ -32,14 +33,15 @@ const TdsSideMenuCollapseButton = class {
         this.collapsed = this.sideMenuEl.collapsed;
     }
     render() {
-        return (h(Host, { key: '15266cdc6a39373563c89553817e1a6777f01f1c', role: "button", tabindex: "0", onClick: () => {
+        const prefixedTagNames = getPrefixedTagNames(this.host);
+        return (h(Host, { key: '716bdffd158c839bca8c35073866d5c8983277c1', role: "button", tabindex: "0", onClick: () => {
                 this.handleClick();
-            } }, h("div", { key: '813da1c78798289b4eed8342b6c00a837ae04b24', class: {
+            } }, h("div", { key: 'e8d943133fdbc74d31e8e2f824ae7b2a47426f9d', class: {
                 'wrapper': true,
                 'state-collapsed': this.collapsed,
-            } }, h("tds-side-menu-item", { key: '44321406d890c741fff0ad1df9576588a6658ea5', class: {
+            } }, h(prefixedTagNames.tdsSideMenuItem, { key: '13be747559758d11dba4a5a8be20762385155b86', class: {
                 button: true,
-            } }, h("a", { key: '7e214b15daa5dac9df931a5d15f6ed80a52b5f7d' }, h("svg", { key: '61928c3ba4c6e2357a426f0c0ca1a0de86365b6a', class: "icon", slot: "icon", fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 32 32" }, h("path", { key: '5cbbfe5239506f994a0b17f11cae1ded3c1f643e', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M16 1.975a1 1 0 0 1 1 1v20.3l9.311-9.312a1 1 0 0 1 1.415 1.414l-9.887 9.887a2.6 2.6 0 0 1-3.677 0l-9.887-9.887a1 1 0 1 1 1.414-1.414L15 23.274V2.975a1 1 0 0 1 1-1ZM5.188 28.001a1 1 0 0 0 0 2h21.62a1 1 0 1 0 0-2H5.188Z", fill: "currentColor" })), !this.collapsed && h("slot", { key: 'b63370f60320b46557e7d40cfad048e29c60109f' }))))));
+            } }, h("a", { key: '2660af6cc804011bcbd9838b00949001002170c4' }, h("svg", { key: '10bfa3c93ab0ca8f0dc7fc5a84198bf37dc4f968', class: "icon", slot: "icon", fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 32 32" }, h("path", { key: '5f77a44d3c22512f93d8c1bbcca0f650594c8be7', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M16 1.975a1 1 0 0 1 1 1v20.3l9.311-9.312a1 1 0 0 1 1.415 1.414l-9.887 9.887a2.6 2.6 0 0 1-3.677 0l-9.887-9.887a1 1 0 1 1 1.414-1.414L15 23.274V2.975a1 1 0 0 1 1-1ZM5.188 28.001a1 1 0 0 0 0 2h21.62a1 1 0 1 0 0-2H5.188Z", fill: "currentColor" })), !this.collapsed && h("slot", { key: '0bb583b4f58f7933a55d515636b524ceb2ccb891' }))))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/tds-side-menu-dropdown.entry.js

@@ -1,4 +1,5 @@
 import { r as registerInstance, h, F as Fragment, H as Host, g as getElement } from './index-51d04e39.js';
+import { g as getPrefixedTagNames } from './tagName-0d04643f.js';
 
 const sideMenuDropdownCss = ":host{display:block}:host .wrapper{display:flex;flex-direction:column}:host .dropdown-icon{margin-left:auto;transition:all 0.2s ease-in-out}:host .state-open .dropdown-icon{transform:rotateZ(180deg)}:host .state-open .menu{display:block}:host .state-collapsed .menu{--side-menu-width:69px;position:absolute;left:var(--side-menu-width);box-shadow:var(--tds-nav-dropdown-menu-box);background-color:var(--tds-sidebar-side-menu-subnav-background)}:host .state-collapsed .menu .heading-collapsed{all:unset;box-sizing:border-box;padding:16px 24px 15px;min-height:48px;display:flex;align-items:center;border-bottom:1px solid var(--tds-sidebar-side-menu-bottom-menu-border-top);font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls)}:host :not(.state-collapsed) .menu ::slotted(tds-side-menu-dropdown-list){width:100%}:host .menu{display:none;flex-direction:column}";
 const TdsSideMenuDropdownStyle0 = sideMenuDropdownCss;
@@ -50,13 +51,14 @@ const TdsSideMenuDropdown = class {
         this.open = this.defaultOpen;
     }
     render() {
-        return (h(Host, { key: '1bad48953f08e903e9179dae839c93b249f93266' }, h("div", { key: '7e8020738796fb8c449f76a3d1aef801151e4e63', class: {
+        const prefixedTagNames = getPrefixedTagNames(this.host);
+        return (h(Host, { key: 'd61a2cd774e95646ec3f0c00a13404907cedecf1' }, h("div", { key: 'ab794f2a74f5d43d4f80ff84ac6a89abd4d8751d', class: {
                 'wrapper': true,
                 'state-open': this.getIsOpenState(),
                 'state-collapsed': this.collapsed,
-            } }, h("tds-side-menu-item", { key: 'e4420aba88077e36b1cc7cd10958459d79a463f4', class: "button", active: this.getIsOpenState(), selected: this.selected, onClick: () => {
+            } }, h(prefixedTagNames.tdsSideMenuItem, { key: 'e6b558615f822a452d63f174e1c83c80e4c07558', class: "button", active: this.getIsOpenState(), selected: this.selected, onClick: () => {
                 this.open = !this.open;
-            } }, h("button", { key: '483ac0b103bf54f63c67cf2d78ed9e82703ba331' }, h("slot", { key: 'ec027d3c88569c79d0dde6c51f8dc1056dee6284', name: "icon" }), !this.collapsed && (h(Fragment, { key: 'f71caa474565871d170653153c8daa7ddead5f17' }, this.buttonLabel, h("slot", { key: '487db682801ce910cd65dc6d3ef481bff888574e', name: "label" }), h("tds-icon", { key: 'dc75ac7be7eedf85fec97cd3fdbbf786cebe8907', class: "dropdown-icon", name: "chevron_down", size: "16px" }))))), h("div", { key: 'e321069727d205d0623cd72fb922c3101f9d2e08', class: "menu" }, this.collapsed && (h("h3", { key: '7d5a73c051a700f0568d63ae62ce2737cdb57dd8', class: "heading-collapsed" }, this.buttonLabel, h("slot", { key: '9c831576869cac930e8fe9edcbfc86dfede01a47', name: "label" }))), h("slot", { key: '7db68bb3f46cdc24fa44c375f0d6bec82c317be4' })))));
+            } }, h("button", { key: 'b9c9f561847d6b48ce83807fadc07192a42b11e3' }, h("slot", { key: 'e0ecb003ae2d04f0c7f01b357ab831ac2eb68d03', name: "icon" }), !this.collapsed && (h(Fragment, { key: 'f9fc33e944f4b56f86c7495084d32091d61fafa5' }, this.buttonLabel, h("slot", { key: 'c5494b6dd481897c452c8e45e21f35d0260f8703', name: "label" }), h(prefixedTagNames.tdsIcon, { key: '1a11f0ed9d78d15d4e68667ed79353af6a6255c9', class: "dropdown-icon", name: "chevron_down", size: "16px" }))))), h("div", { key: '75ef7b1e15e926813dabd29cb6f68b17774bbf4d', class: "menu" }, this.collapsed && (h("h3", { key: '89a41eed8483f37deb9391293584e93959d03532', class: "heading-collapsed" }, this.buttonLabel, h("slot", { key: '1c0cbdd49a1226ee5311a733ab24064ee3032604', name: "label" }))), h("slot", { key: '5850c21ffe901c0e8ed848d21106ff63653dce0a' })))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/tds-side-menu-user-image.entry.js

@@ -0,0 +1,18 @@
+import { r as registerInstance, h, H as Host } from './index-51d04e39.js';
+
+const sideMenuUserImageCss = ":host img,:host ::slotted(*){width:34px;height:34px;border-radius:50%}";
+const TdsSideMenuUserImageStyle0 = sideMenuUserImageCss;
+
+const TdsSideMenuUserImage = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.src = undefined;
+        this.alt = undefined;
+    }
+    render() {
+        return (h(Host, { key: 'cd4bcc9ba4ce93b20e39ab0782136518a99899a3' }, h("slot", { key: '09bf0b847a54c03474e9d5dcaad8d0a5a347dbfc' }), this.src && h("img", { key: '8d74e3733d69ac50f4fe07557b91aec07aa74605', src: this.src, alt: this.alt })));
+    }
+};
+TdsSideMenuUserImage.style = TdsSideMenuUserImageStyle0;
+
+export { TdsSideMenuUserImage as tds_side_menu_user_image };

package/dist/esm/{tds-side-menu-user-image_2.entry.js → tds-side-menu-user-label.entry.js}

@@ -1,20 +1,5 @@
 import { r as registerInstance, h, H as Host } from './index-51d04e39.js';
 
-const sideMenuUserImageCss = ":host img,:host ::slotted(*){width:34px;height:34px;border-radius:50%}";
-const TdsSideMenuUserImageStyle0 = sideMenuUserImageCss;
-
-const TdsSideMenuUserImage = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.src = undefined;
-        this.alt = undefined;
-    }
-    render() {
-        return (h(Host, { key: 'cd4bcc9ba4ce93b20e39ab0782136518a99899a3' }, h("slot", { key: '09bf0b847a54c03474e9d5dcaad8d0a5a347dbfc' }), this.src && h("img", { key: '8d74e3733d69ac50f4fe07557b91aec07aa74605', src: this.src, alt: this.alt })));
-    }
-};
-TdsSideMenuUserImage.style = TdsSideMenuUserImageStyle0;
-
 const sideMenuUserLabelCss = ":host{display:block;font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);color:var(--tds-sidebar-side-menu-single-item-color)}:host .subheading{color:var(--tds-grey-500)}";
 const TdsSideMenuUserLabelStyle0 = sideMenuUserLabelCss;
 
@@ -30,4 +15,4 @@ const TdsSideMenuUserLabel = class {
 };
 TdsSideMenuUserLabel.style = TdsSideMenuUserLabelStyle0;
 
-export { TdsSideMenuUserImage as tds_side_menu_user_image, TdsSideMenuUserLabel as tds_side_menu_user_label };
+export { TdsSideMenuUserLabel as tds_side_menu_user_label };

package/dist/esm/tds-side-menu-user.entry.js

@@ -1,4 +1,5 @@
-import { r as registerInstance, h, H as Host } from './index-51d04e39.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-51d04e39.js';
+import { g as getPrefixedTagNames } from './tagName-0d04643f.js';
 
 const sideMenuUserCss = ":host{display:flex;align-items:center;gap:12px;height:68px}:host tds-side-menu-user-image{margin-left:-4px}";
 const TdsSideMenuUserStyle0 = sideMenuUserCss;
@@ -12,8 +13,10 @@ const TdsSideMenuUser = class {
         this.imgAlt = undefined;
     }
     render() {
-        return (h(Host, { key: '061364f66ad366cbfb421fa0609020564bd36e83' }, h("tds-side-menu-user-image", { key: '01ae0ecb3a011a6a8f50566dc5b683fb56f8d387', src: this.imgSrc, alt: this.imgAlt }, h("slot", { key: '5265cabfa2a7533f7e6c8a9a47b1691f8991d3f0', name: "image" })), h("tds-side-menu-user-label", { key: '525ac1f1593b048c266733e24d5dd3f5632ce197', heading: this.heading, subheading: this.subheading })));
+        const prefixedTagNames = getPrefixedTagNames(this.host);
+        return (h(Host, { key: '378797df81d1a0cdec4a7ad12813dcd2d57a8017' }, h(prefixedTagNames.tdsSideMenuUserImage, { key: 'faa47521346c55bfa10d27c2aabd9a9224ec1f88', src: this.imgSrc, alt: this.imgAlt }, h("slot", { key: '0863342a90fb83e8afc04d763181532c65f86060', name: "image" })), h(prefixedTagNames.tdsSideMenuUserLabel, { key: '7f5782f7a00fa2741d24f4d371da8f48e76b8267', heading: this.heading, subheading: this.subheading })));
     }
+    get host() { return getElement(this); }
 };
 TdsSideMenuUser.style = TdsSideMenuUserStyle0;
 

package/dist/esm/tds-slider.entry.js

@@ -1,5 +1,6 @@
-import { r as registerInstance, c as createEvent, h } from './index-51d04e39.js';
+import { r as registerInstance, c as createEvent, h, g as getElement } from './index-51d04e39.js';
 import { g as generateUniqueId } from './generateUniqueId-7934d315.js';
+import { g as getPrefixedTagNames } from './tagName-0d04643f.js';
 
 const sliderCss = "tds-slider{box-sizing:border-box;width:100%}tds-slider *{box-sizing:border-box}tds-slider input[type=range].tds-slider-native-element{display:none}.tds-slider-wrapper{width:100%}.tds-slider-wrapper.read-only{pointer-events:none}.tds-slider{width:100%;display:flex;flex-wrap:nowrap;padding-top:65px}.tds-slider .tds-slider-inner{width:100%;height:20px;position:relative}.tds-slider .tds-slider__controls{position:relative;top:-25px}.tds-slider .tds-slider__controls .tds-slider__control{cursor:pointer}.tds-slider .tds-slider__controls .tds-slider__control.tds-slider__control-minus{padding:18px 18px 18px 0}.tds-slider .tds-slider__controls .tds-slider__control.tds-slider__control-plus{padding:18px 0 18px 18px}.tds-slider .tds-slider__input-values{position:relative;top:-25px;display:flex;flex-wrap:nowrap;align-items:center}.tds-slider .tds-slider__input-values .tds-slider__input-value{user-select:none;padding:18px;color:var(--tds-grey-700);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls)}.tds-slider .tds-slider__input-values .tds-slider__input-value.min-value{padding-left:0}.tds-slider .tds-slider__input-values .tds-slider__input-field-wrapper{background-color:var(--tds-slider-inputfield-background);display:flex;align-items:center;justify-content:center;border-radius:4px 4px 0 0}.tds-slider .tds-slider__input-values .tds-slider__input-field-wrapper input.tds-slider__input-field{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);color:var(--tds-slider-input-inputfield-color);border:0;background-color:transparent;text-align:center;padding:12px;box-shadow:inset 0 -1px 0 var(--tds-slider-inputfield-box-shadow);border-radius:4px 4px 0 0}.tds-slider .tds-slider__input-values .tds-slider__input-field-wrapper input.tds-slider__input-field:hover{box-shadow:inset 0 -1px 0 var(--tds-grey-600)}.tds-slider .tds-slider__input-values .tds-slider__input-field-wrapper input.tds-slider__input-field:focus{box-shadow:inset 0 -2px 0 var(--tds-blue-400);outline:0}.tds-slider label{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);user-select:none;position:absolute;color:var(--tds-slider-label-color);padding-bottom:16px;transform:translateY(-100%)}.tds-slider label.offset{padding-bottom:34px}.tds-slider .tds-slider__value{font:var(--tds-detail-01);letter-spacing:var(--tds-detail-01-ls);user-select:none;border-radius:4px;padding:8px;position:absolute;transform:translate(-50%, -100%);top:-24px;background-color:var(--tds-slider-value-tooltip-background);color:var(--tds-slider-value-tooltip-color)}.tds-slider .tds-slider__value svg{color:var(--tds-slider-value-tooltip-background);position:absolute;left:50%;transform:translateX(-50%);top:34px}.tds-slider .tds-slider__thumb{position:absolute}.tds-slider .tds-slider__thumb .tds-slider__thumb-inner{width:20px;height:20px;border-radius:100%;background-color:var(--tds-slider-thumb-color);position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);cursor:pointer}.tds-slider .tds-slider__thumb .tds-slider__thumb-inner::before{content:\" \";display:none;width:48px;height:48px;background-color:var(--tds-slider-thumb-color);position:absolute;border-radius:100%;top:50%;left:50%;transform:translate(-50%, -50%)}.tds-slider .tds-slider__thumb .tds-slider__thumb-inner:hover::before{display:block;opacity:0.08}.tds-slider .tds-slider__thumb .tds-slider__thumb-inner.pressed{width:24px;height:24px}.tds-slider .tds-slider__thumb .tds-slider__thumb-inner.pressed::before{display:block;opacity:0.16 !important}.tds-slider .tds-slider__value-dividers-wrapper{position:relative;width:100%;pointer-events:none}.tds-slider .tds-slider__value-dividers{pointer-events:none;position:absolute;display:flex;justify-content:space-between;width:100%}.tds-slider .tds-slider__value-dividers .tds-slider__value-divider{transform:translateY(-50%);height:16px;background-color:var(--tds-slider-divider-color);color:var(--tds-slider-divider-values-color);width:1px}.tds-slider .tds-slider__value-dividers .tds-slider__value-divider span{display:block;user-select:none;color:var(-tds-grey-700);font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);position:relative;top:-7px;left:50%;transform:translate(-50%, -100%);width:50px;text-align:center}.tds-slider .tds-slider__track{width:100%;height:2px;border-radius:1px;background-color:var(--tds-slider-track-color);position:relative}.tds-slider .tds-slider__track:focus{outline:0}.tds-slider .tds-slider__track:focus .tds-slider__thumb .tds-slider__thumb-inner{width:24px;height:24px}.tds-slider .tds-slider__track:focus .tds-slider__thumb .tds-slider__thumb-inner::before{display:block;opacity:0.08}.tds-slider .tds-slider__track .tds-slider__track-fill{background-color:var(--tds-slider-track-fill-color);border-radius:2px;height:4px;position:absolute;left:0;top:-1px}.tds-slider.disabled{cursor:not-allowed}.tds-slider.disabled>*{pointer-events:none}.tds-slider.disabled label{color:var(--tds-slider-disabled)}.tds-slider.disabled .tds-slider__controls .tds-slider__control{cursor:default}.tds-slider.disabled .tds-slider__controls .tds-slider__control.tds-slider__control-minus svg,.tds-slider.disabled .tds-slider__controls .tds-slider__control.tds-slider__control-plus svg{fill:var(--tds-slider-disabled)}.tds-slider.disabled .tds-slider__input-values .tds-slider__input-value{color:var(--tds-slider-disabled)}.tds-slider.disabled .tds-slider__input-values .tds-slider__input-field-wrapper{pointer-events:none}.tds-slider.disabled .tds-slider__input-values .tds-slider__input-field-wrapper input.tds-slider__input-field{color:var(--tds-slider-disabled);pointer-events:none}.tds-slider.disabled .tds-slider__value{display:none}.tds-slider.disabled .tds-slider__track .tds-slider__track-fill{background-color:var(--tds-slider-disabled)}.tds-slider.disabled .tds-slider__value-dividers .tds-slider__value-divider span{color:var(--tds-slider-disabled)}.tds-slider.disabled .tds-slider__thumb{pointer-events:none}.tds-slider.disabled .tds-slider__thumb .tds-slider__thumb-inner{background-color:var(--tds-slider-disabled);cursor:default}.tds-slider.tds-slider-small .tds-slider__thumb .tds-slider__thumb-inner{width:16px;height:16px}.tds-slider.tds-slider-small .tds-slider__thumb .tds-slider__thumb-inner::before{width:40px;height:40px}.tds-slider.tds-slider-small .tds-slider__thumb .tds-slider__thumb-inner.pressed{width:20px;height:20px}.tds-slider .tds-slider__controls .tds-slider__control{cursor:default}.tds-slider .tds-slider__controls .tds-slider__control.tds-slider__control-minus tds-icon,.tds-slider .tds-slider__controls .tds-slider__control.tds-slider__control-plus tds-icon{color:var(--tds-slider-controls-color)}.tds-slider.disabled .tds-slider__controls .tds-slider__control{cursor:default}.tds-slider.disabled .tds-slider__controls .tds-slider__control.tds-slider__control-minus tds-icon,.tds-slider.disabled .tds-slider__controls .tds-slider__control.tds-slider__control-plus tds-icon{color:var(--tds-slider-disabled)}";
 const TdsSliderStyle0 = sliderCss;
@@ -296,25 +297,27 @@ const TdsSlider = class {
         this.updateTrack();
     }
     render() {
-        return (h("div", { key: '943840a77d7cb7f6c394bc2fcd25b36e9a6b5369', class: {
+        const prefixedTagNames = getPrefixedTagNames(this.host);
+        return (h("div", { key: 'd676666417f2124dd55ca83f8d8823b47dca5275', class: {
                 'tds-slider-wrapper': true,
                 'read-only': this.readOnly,
-            } }, h("input", { key: '9f009acc794cfdf37f7a459ae00defc447949436', class: "tds-slider-native-element", type: "range", name: this.name, min: this.min, max: this.max, value: this.value, disabled: this.disabled }), h("div", { key: 'e23f338ee45c0416c02568be5ef538708c71a3c2', class: {
+            } }, h("input", { key: '1cb6a822d82f5bfd0234dbc20cf46ee178ef4f3f', class: "tds-slider-native-element", type: "range", name: this.name, min: this.min, max: this.max, value: this.value, disabled: this.disabled }), h("div", { key: '25ee1da1072d4081404310fefcf6156ac1545bb6', class: {
                 'tds-slider': true,
                 'disabled': this.disabled,
                 'tds-slider-small': this.useSmall,
             }, ref: (el) => {
                 this.wrapperElement = el;
-            } }, h("label", { key: '959ee49ec8483ead245abff393c2e89c5c20ee06', class: this.showTickNumbers && 'offset' }, this.label), this.useInput && (h("div", { key: 'c1844b647050d9873d0abc95c3a43dc2f2090020', class: "tds-slider__input-values" }, h("div", { key: 'c725f1db4ef669ed6033f9e5b105f6401245263e', class: "tds-slider__input-value min-value" }, this.min))), this.useControls && (h("div", { key: '9b1f41eed1e3df5574d9454e42875e6365d4d200', class: "tds-slider__controls" }, h("div", { key: '0518f6daaead7ac4b4ed4ca177cb592ce3331260', class: "tds-slider__control tds-slider__control-minus", onClick: (event) => this.stepLeft(event) }, h("tds-icon", { key: 'e82506df9a4dd9073e485da2e4457c26188c4a17', name: "minus", size: "16px" })))), h("div", { key: '212769a9fca717328cfc7e7159bc01f65d5313a2', class: "tds-slider-inner" }, this.tickValues.length > 0 && (h("div", { key: '8158e5b300c4085146900ed5b56ef5748852e137', class: "tds-slider__value-dividers-wrapper" }, h("div", { key: '57f7c51c9f538fba5083ffdd7b805212a7726ed4', class: "tds-slider__value-dividers" }, this.tickValues.map((value) => (h("div", { class: "tds-slider__value-divider" }, this.showTickNumbers && h("span", null, value))))))), h("div", { key: '8e25f27e20a07410fbf7ac70600e14663fe4cf0a', class: "tds-slider__track", ref: (el) => {
+            } }, h("label", { key: '9f613d2362d32772238e4f9cf4cc21333fa610bb', class: this.showTickNumbers && 'offset' }, this.label), this.useInput && (h("div", { key: 'ebbcd4682a5563b5781b0aeeeeac2e56f6a79fbd', class: "tds-slider__input-values" }, h("div", { key: '3b0b92b1408f79864825be16dc851b12183bb799', class: "tds-slider__input-value min-value" }, this.min))), this.useControls && (h("div", { key: '6d36e25c24c5fe18200f65703a018b92726b3dee', class: "tds-slider__controls" }, h("div", { key: 'fb4de7652d093df433e2be7cc06a7b9a9421ed58', class: "tds-slider__control tds-slider__control-minus", onClick: (event) => this.stepLeft(event) }, h(prefixedTagNames.tdsIcon, { key: '6a0f6fd30de791dfe2bcab654a9368707cc5ff4c', name: "minus", size: "16px" })))), h("div", { key: '0a49a454753cae2f4e49bc5cdfe4094201e0f41b', class: "tds-slider-inner" }, this.tickValues.length > 0 && (h("div", { key: 'c920f993c2bf263ecaea5fa6b3904a34e8b94fe8', class: "tds-slider__value-dividers-wrapper" }, h("div", { key: 'ed326517f7c3338c88d3314c5848960de2882447', class: "tds-slider__value-dividers" }, this.tickValues.map((value) => (h("div", { class: "tds-slider__value-divider" }, this.showTickNumbers && h("span", null, value))))))), h("div", { key: '5170894e75bd459c9dc5e6010a8312b611c664e8', class: "tds-slider__track", ref: (el) => {
                 this.trackElement = el;
-            }, tabindex: this.disabled ? '-1' : '0' }, h("div", { key: 'cb48279c9b6b7f91754a0d0504d38977e80d6454', class: "tds-slider__track-fill", ref: (el) => {
+            }, tabindex: this.disabled ? '-1' : '0' }, h("div", { key: '55e94d65579e662b3b92a43418524f348ef4c69c', class: "tds-slider__track-fill", ref: (el) => {
                 this.trackFillElement = el;
-            } }), h("div", { key: 'e4d05479a9067ee506578b522c56719c006036fc', class: "tds-slider__thumb", ref: (el) => {
+            } }), h("div", { key: 'a8129aaa54e8a03f254e8858e98427fa3f99f452', class: "tds-slider__thumb", ref: (el) => {
                 this.thumbElement = el;
-            }, onMouseDown: () => this.grabThumb(), onTouchStart: () => this.grabThumb() }, this.tooltip && (h("div", { key: '6487f63ad6f2ff00cbdd4e1c10bc9d4ec4550137', class: "tds-slider__value" }, this.value, h("svg", { key: '5c89ff40a9ccab1e48d1867a69835206313bf4c1', width: "18", height: "14", viewBox: "0 0 18 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'd661c16c25e293a54fd6f98989655252e06a5d31', d: "M8.15882 12.6915L0.990487 1.54076C0.562658 0.875246 1.0405 0 1.83167 0H16.1683C16.9595 0 17.4373 0.875246 17.0095 1.54076L9.84118 12.6915C9.44754 13.3038 8.55246 13.3038 8.15882 12.6915Z", fill: "currentColor" })))), h("div", { key: '977ed57e0a9d115152dd08bdd656c5d6c858d633', class: "tds-slider__thumb-inner", ref: (el) => {
+            }, onMouseDown: () => this.grabThumb(), onTouchStart: () => this.grabThumb() }, this.tooltip && (h("div", { key: '1d478384f0b6c31d4a2766a3a627cdd4574cd79e', class: "tds-slider__value" }, this.value, h("svg", { key: '343f422c8042eacbb37737913dcfd4e065a03679', width: "18", height: "14", viewBox: "0 0 18 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '5057f976f09b5f176f2c1489e6ab94aed8dc0472', d: "M8.15882 12.6915L0.990487 1.54076C0.562658 0.875246 1.0405 0 1.83167 0H16.1683C16.9595 0 17.4373 0.875246 17.0095 1.54076L9.84118 12.6915C9.44754 13.3038 8.55246 13.3038 8.15882 12.6915Z", fill: "currentColor" })))), h("div", { key: '8ed0d33b1b5be47b9e231d88bf2ea9fa8d7a9199', class: "tds-slider__thumb-inner", ref: (el) => {
                 this.thumbInnerElement = el;
-            } })))), this.useInput && (h("div", { key: '026b89aea3e01f0d6621d95260db43ba96834181', class: "tds-slider__input-values" }, h("div", { key: '9c58cc92d072760adbef4fa1c49c2766f48a4a3b', class: "tds-slider__input-value", onClick: (event) => this.stepLeft(event) }, this.max), h("div", { key: '7a35238569b9ded1481ea48a868a985426ec4cef', class: "tds-slider__input-field-wrapper" }, h("input", { key: '51ba5b59604cfff6aa6a8bad6c59f3f706a8f3e4', size: this.calculateInputSizeFromMax(), class: "tds-slider__input-field", value: this.value, readOnly: this.readOnly, onBlur: (event) => this.updateSliderValueOnInputChange(event), onKeyDown: (event) => this.handleInputFieldEnterPress(event), type: "number", min: this.min, max: this.max })))), this.useControls && (h("div", { key: '4d10cc417985b3ae3739120b508e781e79a315d0', class: "tds-slider__controls" }, h("div", { key: '9a422c72b65fc9888fd472c36a20df99bb4b50f4', class: "tds-slider__control tds-slider__control-plus", onClick: (event) => this.stepRight(event) }, h("tds-icon", { key: '808969d21cb085de199f1d8af307aa9a412c2b4d', name: "plus", size: "16px" })))))));
+            } })))), this.useInput && (h("div", { key: '17cdc0c35da1c5355edcacec51a84146ba052350', class: "tds-slider__input-values" }, h("div", { key: 'af0f7c10aa16cc44789c827f7eee086fa4abfc70', class: "tds-slider__input-value", onClick: (event) => this.stepLeft(event) }, this.max), h("div", { key: '6879810e310ab9f036cd37cd907f704470334cb8', class: "tds-slider__input-field-wrapper" }, h("input", { key: '4ea73453907e378ec31fa2c99517d7ba16af5d5a', size: this.calculateInputSizeFromMax(), class: "tds-slider__input-field", value: this.value, readOnly: this.readOnly, onBlur: (event) => this.updateSliderValueOnInputChange(event), onKeyDown: (event) => this.handleInputFieldEnterPress(event), type: "number", min: this.min, max: this.max })))), this.useControls && (h("div", { key: '9afa97d14e9e9b44c0f412462b302d160051161d', class: "tds-slider__controls" }, h("div", { key: 'efd5e7f9b2f3287e5294bebc51739c6b07876ec7', class: "tds-slider__control tds-slider__control-plus", onClick: (event) => this.stepRight(event) }, h(prefixedTagNames.tdsIcon, { key: '5d0fd79876dab01667cf73dcd816a9198e33bd85', name: "plus", size: "16px" })))))));
     }
+    get host() { return getElement(this); }
     static get watchers() { return {
         "value": ["handleValueUpdate"]
     }; }

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

@@ -1,4 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-51d04e39.js';
+import { g as getPrefixedTagNames } from './tagName-0d04643f.js';
 
 const stepCss = ":host{position:relative;display:table-cell}:host [role=listitem]{display:flex;justify-content:start;flex-direction:row;align-items:center;gap:8px}:host [role=listitem].text-below{flex-direction:column}:host [role=listitem].lg{padding:0 20px;font:var(--tds-detail-01);letter-spacing:var(--tds-detail-01-ls)}:host [role=listitem].lg .content-container{height:30px;min-width:30px}:host [role=listitem].lg .content-container tds-icon{vertical-align:bottom}:host [role=listitem].lg .content-container .index-container{vertical-align:sub}:host [role=listitem].lg.vertical::after{content:\" \";position:absolute;background-color:var(--tds-stepper-icon-step-background-after);opacity:0.16;height:36px;width:1px;top:40px;left:36px}:host [role=listitem].lg.horizontal::after{content:\" \";position:absolute;background-color:var(--tds-stepper-icon-step-background-after);opacity:0.16;height:1px;left:calc(50% + 24px);right:0;top:18px}:host [role=listitem].lg.horizontal::before{content:\" \";position:absolute;background-color:var(--tds-stepper-icon-step-background-after);opacity:0.16;height:1px;right:calc(50% + 24px);left:0;top:18px}:host [role=listitem].lg.horizontal.text-aside:not(.hide-labels)::after{content:\" \";position:absolute;background-color:var(--tds-stepper-icon-step-background-after);opacity:0.16;height:1px;top:16px;width:10px;left:auto;right:-10px}:host [role=listitem].lg.horizontal.text-aside:not(.hide-labels)::before{content:\" \";position:absolute;background-color:var(--tds-stepper-icon-step-background-after);opacity:0.16;height:1px;top:16px;width:10px;left:-10px;right:auto}:host [role=listitem].sm{padding:0 20px;font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls)}:host [role=listitem].sm .index-container{vertical-align:-webkit-baseline-middle;vertical-align:-moz-middle-with-baseline}:host [role=listitem].sm .content-container{height:24px;min-width:24px}:host [role=listitem].sm .tds-step-icon{vertical-align:-webkit-baseline-middle;vertical-align:-moz-middle-with-baseline;margin-top:-2px}:host [role=listitem].sm.vertical::after{content:\" \";position:absolute;background-color:var(--tds-stepper-icon-step-background-after);opacity:0.16;height:20px;width:1px;top:34px;left:32px}:host [role=listitem].sm.vertical::before{content:\" \";position:absolute;background-color:var(--tds-stepper-icon-step-background-after);opacity:0.16;height:20px;width:1px;top:34px;left:32px}:host [role=listitem].sm.horizontal::after{content:\" \";position:absolute;background-color:var(--tds-stepper-icon-step-background-after);opacity:0.16;height:1px;left:calc(50% + 16px + 8px);right:0;top:13px}:host [role=listitem].sm.horizontal::before{content:\" \";position:absolute;background-color:var(--tds-stepper-icon-step-background-after);opacity:0.16;height:1px;left:0;right:calc(50% + 24px);top:13px}:host [role=listitem].sm.horizontal.text-aside:not(.hide-labels)::after{content:\" \";position:absolute;background-color:var(--tds-stepper-icon-step-background-after);opacity:0.16;height:1px;top:13px;width:10px;left:auto;right:-10px}:host [role=listitem].sm.horizontal.text-aside:not(.hide-labels)::before{content:\" \";position:absolute;background-color:var(--tds-stepper-icon-step-background-after);opacity:0.16;height:1px;top:13px;width:10px;left:-10px;right:auto}:host [role=listitem] .content-container{border-radius:100px;border:1px solid var(--tds-stepper-icon-background);text-align:center;position:relative}:host [role=listitem] .content-container.error{border-color:var(--tds-negative);color:var(--tds-negative)}:host [role=listitem] .content-container.success{background-color:var(--tds-positive);border-color:var(--tds-positive);color:var(--tds-white)}:host [role=listitem] .content-container.upcoming{background-color:transparent;border-color:var(--tds-stepper-label-border-color-upcoming);color:var(--tds-stepper-label-text-color-upcoming);opacity:var(--tds-stepper-label-text-opacity-upcoming)}:host [role=listitem] .label{text-align:center}:host [role=listitem] .label.lg{font:var(--tds-detail-01);letter-spacing:var(--tds-detail-01-ls)}:host [role=listitem] .label.sm{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls)}:host [role=listitem] .label.upcoming{color:var(--tds-stepper-label-text-color-upcoming);opacity:var(--tds-stepper-label-text-opacity-upcoming)}:host(:last-of-type) [role=listitem].horizontal{padding-right:0}:host(:last-of-type) [role=listitem].sm::after,:host(:last-of-type) [role=listitem].lg::after{display:none}:host(:last-of-type) [role=listitem].sm.vertical::before{display:none}:host(:first-of-type) [role=listitem].horizontal{padding-left:0}:host(:first-of-type) [role=listitem].sm::before,:host(:first-of-type) [role=listitem].lg::before{display:none}";
 const TdsStepStyle0 = stepCss;
@@ -21,7 +22,7 @@ const TdsStep = class {
     }
     /* Needs to be onload to do this on any updates. */
     componentWillLoad() {
-        this.stepperEl = this.el.closest('tds-stepper');
+        this.stepperEl = this.host.closest('tds-stepper');
         this.orientation = this.stepperEl.orientation;
         this.labelPosition = this.stepperEl.labelPosition;
         this.size = this.stepperEl.size;
@@ -41,9 +42,10 @@ const TdsStep = class {
         }
     }
     render() {
-        return (h(Host, { key: '6c7a2673bbe13e518f2052cac2b8bcc948c7c5ea' }, h("div", { key: '7df6c87c7743fcd539abcbde7c2396ba8d7fa4d6', role: "listitem", class: `${this.size} ${this.orientation} text-${this.labelPosition} ${this.hideLabels ? 'hide-labels' : ''}` }, h("span", { key: 'b2902e638345c79401405b9c16dd6f4d196c8bac', class: `${this.state} content-container` }, this.state === 'success' || this.state === 'error' ? (h("tds-icon", { class: 'tds-step-icon', name: this.state === 'success' ? 'tick' : 'warning', size: this.size === 'lg' ? '20px' : '16px' })) : (h("span", { class: "index-container" }, this.index))), !this.hideLabels && (h("div", { key: 'b35127501be3ab9cc6f3bf0b9f54709f0d98ec36', class: `label ${this.size} ${this.state}` }, h("slot", { key: '43499d45d42401e384b8c9f20885873d23351110', name: "label" }))))));
+        const prefixedTagNames = getPrefixedTagNames(this.host);
+        return (h(Host, { key: '52a70297ba2b6f186916f597e2e6f355fea93d50' }, h("div", { key: 'e6abd1a5dc488b03a16451e162ea9b6911e36875', role: "listitem", class: `${this.size} ${this.orientation} text-${this.labelPosition} ${this.hideLabels ? 'hide-labels' : ''}` }, h("span", { key: 'e98b565719a767a03386f9e351be40c3843ae7f2', class: `${this.state} content-container` }, this.state === 'success' || this.state === 'error' ? (h(prefixedTagNames.tdsIcon, { class: 'tds-step-icon', name: this.state === 'success' ? 'tick' : 'warning', size: this.size === 'lg' ? '20px' : '16px' })) : (h("span", { class: "index-container" }, this.index))), !this.hideLabels && (h("div", { key: 'eb6814fb3f3b932de0ea2adaa02e8d350db105b0', class: `label ${this.size} ${this.state}` }, h("slot", { key: '8e3c42eaa55d71e278f73ac7c920510fc182f00b', name: "label" }))))));
     }
-    get el() { return getElement(this); }
+    get host() { return getElement(this); }
 };
 TdsStep.style = TdsStepStyle0;
 

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

@@ -1,4 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-51d04e39.js';
+import { g as getPrefixedTagNames } from './tagName-0d04643f.js';
 
 const tableBodyInputWrapperCss = ":host{position:relative}:host(.focused-input-wrapper) tds-icon{display:inline-block}:host(.show-icon) ::slotted(input){padding-right:var(--tds-spacing-element-24)}:host(:hover) tds-icon{display:inline-block}:host(:hover) ::slotted(input:not(:focus)){background-color:var(--tds-table-input-background-hover)}tds-icon.edit-icon{display:none;position:absolute;right:10px;top:1px;pointer-events:none;cursor:pointer}::slotted(input){box-sizing:border-box;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding-left:var(--tds-spacing-element-16);padding-right:var(--tds-spacing-element-16);color:var(--tds-table-color);background-color:transparent;height:48px;border-radius:0;border:0;border-bottom:2px solid transparent;width:100%;cursor:pointer}::slotted(input)::placeholder{color:var(--tds-table-color)}::slotted(input:disabled){background-color:var(--tds-table-input-background-disabled)}::slotted(input:focus){outline:none;background-color:var(--tds-table-input-background-focus);border-bottom:2px solid var(--tds-text-field-bar)}:host(.tds-table__compact) ::slotted(input){height:32px;}";
 const TdsTableBodyInputWrapperStyle0 = tableBodyInputWrapperCss;
@@ -68,11 +69,12 @@ const TdsTableBodyInputWrapper = class {
         }
     }
     render() {
-        return (h(Host, { key: 'c40a17a264d914934ea4f0e5c4a27b58f06d8055', class: {
+        const prefixedTagNames = getPrefixedTagNames(this.host);
+        return (h(Host, { key: '05e41154f07408493f682755fcfce90b16540f05', 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: "edit-icon", slot: "icon", size: "16px", name: "edit" })) : null));
+            } }, this.renderSlot ? h("slot", { onSlotchange: () => this.handleSlotChange() }) : null, this.showIcon ? (h(prefixedTagNames.tdsIcon, { class: "edit-icon", slot: "icon", size: "16px", name: "edit" })) : null));
     }
     get host() { return getElement(this); }
 };

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

@@ -1,4 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-51d04e39.js';
+import { g as getPrefixedTagNames } from './tagName-0d04643f.js';
 
 const tableBodyRowCss = ":host(.tds-table__row){box-sizing:border-box;display:table-row;border-bottom:1px solid var(--tds-table-divider);background-color:var(--tds-table-body-row-background);transition:background-color 200ms ease;color:var(--tds-table-color)}:host(.tds-table__row) *{box-sizing:border-box}:host(.tds-table__row) .tds-table__body-cell--checkbox{min-width:48px;width:48px;padding:0}:host(.tds-table__row:hover){background-color:var(--tds-table-body-row-background-hover)}:host(.tds-table__row--selected){background-color:var(--tds-table-body-row-background-selected)}:host(.tds-table__row--selected:hover){background-color:var(--tds-table-body-row-background-selected-hover)}:host(.tds-table__row--hidden){display:none}:host(.tds-table__row--expended){width:100%;background-color:pink}:host .tds-form-label--table{width:100%;height:48px;display:flex;justify-content:center;align-items:center;cursor:pointer}:host(.tds-table__compact) .tds-form-label--table{height:32px}:host(.tds-table--divider) .tds-table__body-cell--checkbox{border-right:1px solid var(--tds-table-divider)}";
 const TdsTableBodyRowStyle0 = tableBodyRowCss;
@@ -51,12 +52,13 @@ const TdsTableBodyRow = class {
         });
     }
     render() {
-        return (h(Host, { key: '2b99a5336354cb5e7e2e7ef9c81bac76a55c6895', class: {
+        const prefixedTagNames = getPrefixedTagNames(this.host);
+        return (h(Host, { key: '0ac4875938275167c52bdb1a66fc54158c61a76d', class: {
                 'tds-table__row': true,
                 'tds-table__row--selected': this.selected,
                 'tds-table__compact': this.compactDesign,
                 'tds-table--divider': this.verticalDividers,
-            } }, this.multiselect && (h("td", { key: '049e91ea474a539b6fbe344db4aed9de42297f3d', class: "tds-table__body-cell tds-table__body-cell--checkbox tds-form-label tds-form-label--table" }, h("tds-checkbox", { key: '2af9307e3143db71cae028c1cc2116382b20f4c9', onTdsChange: (event) => this.handleCheckboxChange(event), checked: this.selected, disabled: this.disabled }))), h("slot", { key: '2eff0d398eb53934ca0b152d25422a5febbbffbb' })));
+            } }, this.multiselect && (h("td", { key: 'c7207da4609b85ae7d2af89df17a06021ed4d5dc', class: "tds-table__body-cell tds-table__body-cell--checkbox tds-form-label tds-form-label--table" }, h(prefixedTagNames.tdsCheckbox, { key: '46d7c610a47b1318d0d30d689bcdcfde5761727c', onTdsChange: (event) => this.handleCheckboxChange(event), checked: this.selected, disabled: this.disabled }))), h("slot", { key: '06e607ab15a8f5610f67be5afd2a46ed0f96c4b4' })));
     }
     get host() { return getElement(this); }
 };

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

@@ -1,4 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-51d04e39.js';
+import { g as getPrefixedTagNames } from './tagName-0d04643f.js';
 
 const tableFooterCss = ":host{box-sizing:border-box;display:table-footer-group;height:48px}:host *{box-sizing:border-box}:host .tds-table__footer-row{background-color:var(--tds-table-footer-background);color:var(--tds-table-color)}:host .tds-table__footer-cell{padding:0 16px}:host .tds-table__footer-cell .tds-table__pagination{height:48px;display:flex;align-items:center;justify-content:space-between}:host .tds-table__footer-cell .tds-table__pagination .tds-table__row-selector,:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector{display:flex;align-items:center}:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);background-color:var(--tds-table-footer-page-selector-input-background);color:var(--tds-table-color);width:54px;height:30px;border:none;border-radius:4px;transition:background-color 250ms ease;margin-right:4px;padding-left:16px}:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input:hover{background-color:var(--tds-table-footer-page-selector-input-background-hover)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input:disabled{color:var(--tds-table-footer-page-selector-input-color-disabled)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input--shake{animation:tds-shake-animation 0.5s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;transform:translate3d(0, 0, 0);backface-visibility:hidden;perspective:1000px}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-text{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:1px 8px 0 0}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn{display:flex;justify-content:center;align-items:center;border:none;background-color:transparent;cursor:pointer;height:32px;width:32px;border-radius:4px;transition:background-color 250ms ease;color:var(--tds-table-footer-page-selector-icon)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn:hover{background-color:var(--tds-table-footer-btn-hover)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn:disabled{cursor:default;color:var(--tds-table-footer-page-selector-icon-disabled)}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn:disabled:hover{background-color:transparent}:host .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn-svg{height:20px;width:20px;fill:var(--tds-table-color)}:host(.tds-table--compact){height:32px}:host(.tds-table--compact) .tds-table__footer-cell .tds-table__pagination{height:32px}:host(.tds-table--compact) .tds-table__footer-cell .tds-table__pagination .tds-table__page-selector-input{height:24px}:host(.tds-table--compact) .tds-table__footer-cell .tds-table__pagination .tds-table__footer-btn{height:28px;width:28px}:host(.footer__horizontal-scroll){display:inline-table;position:absolute;margin-top:10px}@keyframes tds-shake-animation{10%,90%{transform:translate3d(-1px, 0, 0)}20%,80%{transform:translate3d(2px, 0, 0)}30%,50%,70%{transform:translate3d(-4px, 0, 0)}40%,60%{transform:translate3d(4px, 0, 0)}}";
 const TdsTableFooterStyle0 = tableFooterCss;
@@ -99,11 +100,19 @@ const TdsTableFooter = class {
         });
         this.storeLastCorrectValue(this.paginationValue);
     }
+    getStyles() {
+        const styles = {};
+        if (this.horizontalScrollWidth) {
+            styles.width = `${this.horizontalScrollWidth}px`;
+        }
+        return styles;
+    }
     render() {
-        return (h(Host, { key: 'fe6221e5dd2ec57e63afefc5e45c0b3f5ad85d8f', class: {
+        const prefixedTagNames = getPrefixedTagNames(this.host);
+        return (h(Host, { key: '2b1679b41dc9820424351c33e85591f36818d1e1', class: {
                 'tds-table--compact': this.compactDesign,
                 'footer__horizontal-scroll': !!this.horizontalScrollWidth,
-            }, style: this.horizontalScrollWidth ? { width: this.horizontalScrollWidth } : {} }, h("tr", { key: '6f6bfca5e7719084b2c4564b86806f6eb7867601', class: "tds-table__footer-row" }, h("td", { key: '2c4389dfa2c028798246a5c4d8b9bdcc05a780f2', class: "tds-table__footer-cell", colSpan: this.columnsNumber }, this.pagination && (h("div", { key: '0831e596963e20222feee940fb7d7d489f832b5e', class: "tds-table__pagination" }, h("div", { key: '1129e67d9b69b06a1fadde589f9ad37a1bd9fcca', class: "tds-table__row-selector" }), h("div", { key: '81e685df813d615027470d4c84c468bb2c5fccca', class: "tds-table__page-selector" }, h("input", { key: '4b116837ae02fcbf6b51b940587ae6159d40f5cb', 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 }), h("p", { key: '927af4715b33f50679aef3ec5eccc5fd4044add7', class: "tds-table__footer-text" }, "of ", h("span", { key: '2d89421fbbbb0828623465f39edc506b9bfa82da' }, this.pages), " pages"), h("button", { key: '37916d812b7b4510b088b382f48b2d9f04d212b2', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue <= 1, onClick: () => this.previousPage() }, h("tds-icon", { key: 'd89ac980f4c48fe6c14610f27ccc05e43994631e', name: "chevron_left", size: "20px" })), h("button", { key: '246b17fc6ff26e3830d5a359a4a5de844bc93a1b', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue >= this.pages, onClick: () => this.nextPage() }, h("tds-icon", { key: '6fa3441ed75b484974e50ee41ea1444bea7c30e2', name: "chevron_right", size: "20px" })))))))));
+            }, style: this.getStyles() }, h("tr", { key: '153812eec84fce53dc6dc8ac7ca0ef80dfd76213', class: "tds-table__footer-row" }, h("td", { key: '8393249d6dc9f5758e7b4fa83d7cfcbde59dbc77', class: "tds-table__footer-cell", colSpan: this.columnsNumber }, this.pagination && (h("div", { key: 'cbd30e634548f1019ccd1bc15512a6b65ff13034', class: "tds-table__pagination" }, h("div", { key: '1c4a05e5ee585ca96b632082cdc34b7d5e520447', class: "tds-table__row-selector" }), h("div", { key: 'aaa98355f48907c761157c79d6676a357b431e98', class: "tds-table__page-selector" }, h("input", { key: '8bea9cd1dd079ec4062a0fc1a72b57d5aafbdf69', 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 }), h("p", { key: '75c510c649be650ad2c52d894eee1f99ceed9d96', class: "tds-table__footer-text" }, "of ", h("span", { key: 'cbdf2851142771260e5f2ded77fac0313e326e69' }, this.pages), " pages"), h("button", { key: 'e881d7d94881aef373551e37b9371a9f6b4d5332', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue <= 1, onClick: () => this.previousPage() }, h(prefixedTagNames.tdsIcon, { key: 'efb8d1f38cb9cea4fccc9b9df0649837d44dfa46', name: "chevron_left", size: "20px" })), h("button", { key: '6017258d6ec87aea2e34739c17d63d1e0762c2d6', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue >= this.pages, onClick: () => this.nextPage() }, h(prefixedTagNames.tdsIcon, { key: 'c020cb98076c8c5e26cb9d4a78f0600272e4ebf5', name: "chevron_right", size: "20px" })))))))));
     }
     get host() { return getElement(this); }
 };

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

@@ -1,4 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-51d04e39.js';
+import { g as getPrefixedTagNames } from './tagName-0d04643f.js';
 
 const tableHeaderInputWrapperCss = ":host{position:relative}:host(:hover) tds-icon{display:inline-block}:host(.focused-input-wrapper) tds-icon{display:inline-block}:host(.focused-input-wrapper) ::slotted(input:not(:focus)){background-color:var(--tds-table-input-background-hover)}:host(.show-icon) ::slotted(input){padding-left:35px}tds-icon.search-icon{color:var(--tds-table-input-header-icon);position:absolute;left:15px;top:1px}::slotted(input){box-sizing:border-box;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);color:var(--tds-table-color);padding-left:var(--tds-spacing-element-16);padding-right:var(--tds-spacing-element-16);height:48px;border-radius:0;background-color:transparent;border:0;border-bottom:2px solid transparent}::slotted(input)::placeholder{color:var(--tds-table-input-header-placeholder)}::slotted(input:focus){outline:none;background-color:var(--tds-table-input-header-background-focus);border-bottom:2px solid var(--tds-text-field-bar)}:host(.tds-table__compact) ::slotted(input){height:32px;}";
 const TdsTableHeaderInputWrapperStyle0 = tableHeaderInputWrapperCss;
@@ -68,11 +69,12 @@ const TdsTableHeaderInputWrapper = class {
         }
     }
     render() {
-        return (h(Host, { key: '43243a6c8e1a0ef0f18d9f1f1d4cd4cba6bc15b4', class: {
+        const prefixedTagNames = getPrefixedTagNames(this.host);
+        return (h(Host, { key: '379cdc2f1c18f2a15919e9d2b431f192f2e719d5', 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(prefixedTagNames.tdsIcon, { class: "search-icon", slot: "icon", size: "16px", name: "search" })) : null));
     }
     get host() { return getElement(this); }
 };

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

@@ -1,4 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-51d04e39.js';
+import { g as getPrefixedTagNames } from './tagName-0d04643f.js';
 
 const tableHeaderCss = ":host{box-sizing:border-box;display:table-header-group}:host *{box-sizing:border-box}:host .tds-table__header-cell--checkbox{font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);display:table-cell;text-align:left;color:var(--tds-table-color);background-color:var(--tds-table-header-background);border-bottom:1px solid var(--tds-table-divider);height:48px;box-sizing:border-box;overflow:hidden;transition:background-color 200ms ease;min-width:unset;width:48px;padding:0;border-top-left-radius:4px}:host .tds-form-label--table{width:100%;height:48px;display:flex;justify-content:center;align-items:center;cursor:pointer}:host .tds-table__expand-control-container{display:flex;justify-content:center;align-items:center;height:48px;cursor:pointer}:host .tds-table__expand-control-container .tds-table__expand-input{display:none}:host .tds-table__expand-control-container .tds-expandable-row-icon{height:20px;width:20px;transition:transform 200ms ease;transform:rotate(0)}:host .tds-table__expand-control-container .tds-expandable-row-icon--opened{transform:rotate(180deg)}:host ::slotted(tds-header-cell:hover){background-color:var(--tds-table-header-background-hover)}:host(.tds-table--compact) .tds-table__header-cell--checkbox{height:32px}:host(.tds-table--compact) .tds-form-label--table{height:32px}:host(.tds-table--divider) .tds-table__header-cell--checkbox{border-right:1px solid var(--tds-table-divider)}:host(.tds-table--toolbar-available) .tds-table__header-cell--checkbox{border-top-left-radius:0}";
 const TdsTableHeaderStyle0 = tableHeaderCss;
@@ -85,11 +86,12 @@ const TdsTableHeaderRow = class {
         });
     }
     render() {
-        return (h(Host, { key: '5f212887d3d35e32240e9745d62685b7024100e1', class: {
+        const prefixedTagNames = getPrefixedTagNames(this.host);
+        return (h(Host, { key: 'c6b52b1d3a4758d2f633b63276491d54378997d0', class: {
                 'tds-table--compact': this.compactDesign,
                 'tds-table--divider': this.verticalDividers,
                 'tds-table--toolbar-available': this.enableToolbarDesign,
-            } }, h("tr", { key: '1a40af0dddfb627c39ae5df47aedc80eb1006f04' }, this.multiselect && (h("th", { key: '17d16e6bf8964b30e0ce93a76c436112ac0a6540', class: "tds-table__header-cell tds-table__header-cell--checkbox" }, h("div", { key: '98f282baf5a0b4a929ad04c850319e04955090a0', class: "tds-form-label tds-form-label--table" }, h("tds-checkbox", { key: '9d8115deb1403df121309d32a166ccc6eac685d5', checked: this.allSelected || this.selected, disabled: this.disabled, indeterminate: this.indeterminate, onTdsChange: (event) => this.handleCheckboxChange(event) })))), this.expandableRows && (h("th", { key: '7cc0e1c0d3d7ec9f4bef917a5b8346cca8bc58ae', class: "tds-table__header-cell tds-table__header-cell--checkbox" })), h("slot", { key: '2f7aa3bd3acdd69f1f2a20d3525ad5901f0ac239' }))));
+            } }, h("tr", { key: '4f9c9077abe94dd132d70c3b1917b5ee321bb86c' }, this.multiselect && (h("th", { key: '93fe6f0b820002e877368a406a1f27993f8c76d9', class: "tds-table__header-cell tds-table__header-cell--checkbox" }, h("div", { key: '0ee069d210c5bf362585034db083d675e20790d9', class: "tds-form-label tds-form-label--table" }, h(prefixedTagNames.tdsCheckbox, { key: '8a1db3dd87cf767823c4a20a9d7c4fd25e9c595c', checked: this.allSelected || this.selected, disabled: this.disabled, indeterminate: this.indeterminate, onTdsChange: (event) => this.handleCheckboxChange(event) })))), this.expandableRows && (h("th", { key: '2a141bca63ff69c3572f18e83ba67c375b11b988', class: "tds-table__header-cell tds-table__header-cell--checkbox" })), h("slot", { key: 'b5cfad23823fbddf0136ea696ec5870f114075f6' }))));
     }
     get host() { return getElement(this); }
 };

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

@@ -1,4 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-51d04e39.js';
+import { g as getPrefixedTagNames } from './tagName-0d04643f.js';
 
 const tableToolbarCss = ":host{box-sizing:border-box;display:table-caption;position:relative;background-color:var(--tds-table-toolbar-background);color:var(--tds-table-color);padding:0 var(--tds-spacing-element-16);height:64px;border-top-left-radius:4px;border-top-right-radius:4px}:host *{box-sizing:border-box}:host .tds-table__upper-bar-flex{width:100%;height:100%;display:flex;justify-content:space-between}:host .tds-table__title{font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);padding-top:var(--tds-spacing-element-16);text-align:left}:host .tds-table__actionbar,:host slot[name=end]::slotted(*){display:flex;align-self:center}:host .tds-table__searchbar{display:flex;align-self:center;position:relative;height:40px;width:40px;border-radius:4px 4px 0 0;transition:background-color 250ms ease, width 250ms ease;overflow:hidden;background-color:transparent}:host .tds-table__searchbar::after{content:\"\";width:100%;height:2px;position:absolute;bottom:0;background-color:var(--tds-blue-400);transform:scaleX(0);transition:transform 150ms ease}:host .tds-table__searchbar:focus-within::after{transform:scaleX(100%)}:host .tds-table__searchbar:focus-within,:host .tds-table__searchbar.tds-table__searchbar--active{width:208px;background-color:var(--tds-table-toolbar-searchbar-background)}:host .tds-table__searchbar:focus-within:hover,:host .tds-table__searchbar.tds-table__searchbar--active:hover{background-color:var(--tds-table-toolbar-searchbar-background)}:host .tds-table__searchbar .tds-table__searchbar-input{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);color:var(--tds-table-color);z-index:1;width:100%;height:100%;border:none;padding:0 36px 0 16px;background-color:transparent;outline:none;cursor:pointer}:host .tds-table__searchbar .tds-table__searchbar-input :focus{background-color:var(--tds-table-toolbar-searchbar-background)}:host .tds-table__searchbar:hover{background-color:var(--tds-table-toolbar-searchbar-background-hover)}:host .tds-table__searchbar .tds-table__searchbar-icon{z-index:0;position:absolute;right:9px;top:9px;width:20px;height:20px}:host(.toolbar__horizontal-scroll){position:absolute;top:var(--tds-spacing-element-16)}:host(.tds-table--compact){height:56px}";
 const TdsTableToolbarStyle0 = tableToolbarCss;
@@ -58,11 +59,19 @@ const TdsTableToolbar = class {
             tdsTableSearchBar.classList.remove('tds-table__searchbar--active');
         }
     }
+    getStyles() {
+        const styles = {};
+        if (this.horizontalScrollWidth) {
+            styles.width = `${this.horizontalScrollWidth}px`;
+        }
+        return styles;
+    }
     render() {
-        return (h(Host, { key: '9c864dc219ed17a50a4d84881c676e05b3e0ef92', class: {
+        const prefixedTagNames = getPrefixedTagNames(this.host);
+        return (h(Host, { key: '017e5a33806f969620e47af13c1abd4d5cc73c1e', class: {
                 'tds-table--compact': this.compactDesign,
                 'toolbar__horizontal-scroll': !!this.horizontalScrollWidth,
-            }, style: this.horizontalScrollWidth ? { width: this.horizontalScrollWidth } : {} }, h("div", { key: '035b5a5396344e3d682fb5370a4e1c0484045579', class: "tds-table__upper-bar-flex" }, h("caption", { key: 'f1f5ba362eda8a0ae25fb63c89a25fe3606365c9', class: "tds-table__title" }, this.tableTitle), h("div", { key: 'b94a83cf81e1aaa06d1b29a4e9207c99bccbbbbc', class: "tds-table__actionbar" }, this.filter && (h("div", { key: '358798e484d1892acb6a4e7e3b30702002ba860d', class: "tds-table__searchbar" }, h("input", { key: 'f062bf19e13e312ee9089324bdfc6d4e2e9a1db4', class: "tds-table__searchbar-input", type: "text", onKeyUp: (event) => this.handleSearch(event) }), h("span", { key: '9e874b39910b2d32b0a3193b14e01ed5f681b928', class: "tds-table__searchbar-icon" }, h("tds-icon", { key: '38d5a1b800d849b66a0c35d01d496fc4708f53c2', name: "search", size: "20px" })))), h("slot", { key: 'f362385a5719c51dbce2b213774b6397ede8714b', name: "end" })))));
+            }, style: this.getStyles() }, h("div", { key: '8a2e0b3ff1cb452706d4a01818f6159749dbb89a', class: "tds-table__upper-bar-flex" }, h("caption", { key: '91dcfc3b3e1a6f88a816c8aaadd6160bd9ad9474', class: "tds-table__title" }, this.tableTitle), h("div", { key: '62b725ed18e7406d2635c62ae057abb6cf214cba', class: "tds-table__actionbar" }, this.filter && (h("div", { key: '0dc45e13a7185194002e25a9116b6535307d6412', class: "tds-table__searchbar" }, h("input", { key: '6f147fde17c9c01c58ed2178c084a5be48c84186', class: "tds-table__searchbar-input", type: "text", onKeyUp: (event) => this.handleSearch(event) }), h("span", { key: 'd2b540ca62e3b4c3a917b2283510760be12e0b2a', class: "tds-table__searchbar-icon" }, h(prefixedTagNames.tdsIcon, { key: '39b663fbe530f36568e282768ed7b5630722fb01', name: "search", size: "20px" })))), h("slot", { key: '19474502d0d73d1c3a7b899a8a21cc269bd8efe8', name: "end" })))));
     }
     get host() { return getElement(this); }
 };

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

@@ -49,6 +49,13 @@ const TdsTable = class {
         });
         return selectedRowsData;
     }
+    getStyles() {
+        const styles = {};
+        if (this.horizontalScrollWidth) {
+            styles.width = `${this.horizontalScrollWidth}px`;
+        }
+        return styles;
+    }
     multiselectChanged(newValue) {
         this.emitInternalTdsPropChange('multiselect', newValue);
     }
@@ -79,11 +86,11 @@ const TdsTable = class {
         }
     }
     render() {
-        return (h(Host, { key: 'da929268a984ca0e81843132b2fafd6c79bec3b3', class: {
+        return (h(Host, { key: '580c1c90c9f4556b16037c3200ae739a891bea88', class: {
                 'tds-table--responsive': this.responsive,
                 'tds-mode-variant-primary': this.modeVariant === 'primary',
                 'tds-mode-variant-secondary': this.modeVariant === 'secondary',
-            } }, h("table", { key: '2ba662d97bc834a7a0d6d71338fc7c322bc15741', style: this.horizontalScrollWidth ? { width: this.horizontalScrollWidth } : {}, class: {
+            } }, h("table", { key: 'f2e9d248c5e93e6d83cfcd74408f99ed54c1ae95', style: this.getStyles(), class: {
                 'tds-table': true,
                 'tds-table--compact': this.compactDesign,
                 'tds-table--divider': this.verticalDividers,
@@ -94,7 +101,7 @@ const TdsTable = class {
                 '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,
-            } }, h("slot", { key: 'c95e71aeaac2f4378d440bb23ff890c9c4a76fdf' }))));
+            } }, h("slot", { key: '74edfe5bc755d4a7880b1368452f2906ebc5346a' }))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {