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

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

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
+const tagName = require('./tagName-f24f57ce.js');
 
 const messageCss = ":host .wrapper{display:flex;padding:16px;background-color:var(--tds-message-background);border-radius:4px}:host .wrapper.information{border-left:4px solid var(--tds-information)}:host .wrapper.information tds-icon{color:var(--tds-information)}:host .wrapper.success{border-left:4px solid var(--tds-positive)}:host .wrapper.success tds-icon{color:var(--tds-positive)}:host .wrapper.error{background-color:var(--tds-message-type-error-background);border-left:4px solid var(--tds-negative)}:host .wrapper.error tds-icon{color:var(--tds-negative)}:host .wrapper.warning{border-left:4px solid var(--tds-warning)}:host .wrapper.warning tds-icon{color:var(--tds-warning)}:host .wrapper.minimal{border:none;display:flex;align-items:center;padding:0;background-color:transparent}:host .wrapper.minimal .header{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls)}:host .wrapper.minimal.error .header{color:var(--tds-negative)}:host tds-icon{padding-right:16px}:host .content{display:flex;flex-direction:column;gap:4px;color:var(--tds-message-color);padding:2px 0}:host .content .header{font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls)}:host .content .extended-message{color:var(--tds-message-color);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls)}:host .tds-mode-variant-primary{--tds-message-background:var(--tds-message-background-primary)}:host .tds-mode-variant-secondary{--tds-message-background:var(--tds-message-background-secondary)}";
 const TdsMessageStyle0 = messageCss;
@@ -31,11 +32,13 @@ const TdsMessage = class {
         this.minimal = false;
     }
     render() {
-        return (index.h(index.Host, { key: 'b270c0935bf7eb09d16df32854c5a9411a78fba9' }, index.h("div", { key: '668d8a6a940ce0f972c2398d063640b38e307219', class: `
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: '388273d2a33152931a10fa1a26b2de908392aff6' }, index.h("div", { key: '65f066f605a1cc7efe87ead5375b8f556476deef', class: `
         wrapper ${this.variant}
         ${this.minimal ? 'minimal' : ''}
-        ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, !this.noIcon && index.h("tds-icon", { key: 'bfa6b4c85c649cd3cff00eb121ba9df08b02d65f', name: this.getIconName(), size: "20px" }), index.h("div", { key: '4239603ea7d58ed79ea6bb4cf212d4405204b2a6', class: `content` }, this.header && index.h("div", { key: '5c8ad00a65d6310a86a353580e98e45b056c9a96', class: "header" }, this.header), !this.minimal && (index.h("div", { key: 'd0087a45aa622374dfcc1b6d791a82b0c14b64cf', class: "extended-message" }, index.h("slot", { key: '8fdfd7079bc6473ea8d8eff72874827f3f9bcae1' })))))));
+        ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, !this.noIcon && (index.h(prefixedTagNames.tdsIcon, { key: '291a17b2822d1d2ac9e6781d5097038ca29ef7d2', name: this.getIconName(), size: "20px" })), index.h("div", { key: '215381c9cfce537513900866d4f770218bf31662', class: `content` }, this.header && index.h("div", { key: 'c11eb4ca87b49fb7ddf98f6b5d0f8f1d56429b9d', class: "header" }, this.header), !this.minimal && (index.h("div", { key: '27e69500df32197323fc1e05bebb819be2f882e4', class: "extended-message" }, index.h("slot", { key: 'd50e21441cf16f1457072a933e8459c16170f3aa' })))))));
     }
+    get host() { return index.getElement(this); }
 };
 TdsMessage.style = TdsMessageStyle0;
 

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

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
 const hasSlot = require('./hasSlot-1c90e9ba.js');
+const tagName = require('./tagName-f24f57ce.js');
 
 const modalCss = ".tds-modal{box-sizing:border-box;background-color:var(--tds-modal-background);margin:auto;position:relative;border-radius:4px;max-height:85vh;overflow-y:auto;pointer-events:auto;}.tds-modal *{box-sizing:border-box}.tds-modal::-webkit-scrollbar{width:5px;background-color:var(--tds-grey-300);border-radius:0 1em 1em 0}.tds-modal::-webkit-scrollbar-track{background-color:var(--tds-grey-300);border-radius:0 1em 1em 0}.tds-modal::-webkit-scrollbar-thumb{background-color:var(--tds-grey-500);border-radius:0 1em 1em 0}.tds-modal__actions-sticky{overflow:hidden;display:flex;flex-direction:column}.tds-modal__actions-sticky .body{font:var(--tds-body-01);letter-spacing:var(--tds-body-01-ls);max-height:calc(85vh - 36px);overflow-y:auto}.tds-modal__actions-sticky slot[name=actions]{bottom:-1px;left:0;right:0;background-color:var(--tds-modal-background);padding:var(--tds-spacing-element-24) var(--tds-spacing-element-16) var(--tds-spacing-element-16);display:flex;gap:16px}.tds-modal__actions-static slot[name=actions]{background-color:var(--tds-modal-background);display:flex;gap:16px;padding:24px 16px 16px}@media (min-width: 320px){.tds-modal-xs{width:100%}.tds-modal-sm{width:100%}.tds-modal-md{width:100%}.tds-modal-lg{width:100%}}@media (min-width: 672px){.tds-modal-xs{width:50%}.tds-modal-sm{width:62.5%}.tds-modal-md{width:75%}.tds-modal-lg{width:100%}}@media (min-width: 1056px){.tds-modal-xs{width:31.25%}.tds-modal-sm{width:43.75%}.tds-modal-md{width:62.5%}.tds-modal-lg{width:75%}}@media (min-width: 1312px){.tds-modal-xs{width:31.25%}.tds-modal-sm{width:37.5%}.tds-modal-md{width:62.5%}.tds-modal-lg{width:75%}}@media (min-width: 1584px){.tds-modal-xs{width:25%}.tds-modal-sm{width:37.5%}.tds-modal-md{width:50%}.tds-modal-lg{width:75%}}@media (max-width: 320px){.tds-modal-md,.tds-modal-lg,.tds-modal-sm{height:100%}.tds-modal-md slot[name=actions]::slotted(*),.tds-modal-lg slot[name=actions]::slotted(*),.tds-modal-sm slot[name=actions]::slotted(*){display:flex}}.header{display:flex;padding:var(--tds-spacing-element-16);position:sticky;top:0;background-color:var(--tds-modal-background);z-index:1}.header,slot[name=header]::slotted(*){color:var(--tds-modal-text);font:var(--tds-headline-05) !important;letter-spacing:var(--tds-headline-05-ls) !important;margin:0;flex:1}.body{color:var(--tds-modal-text);font:var(--tds-body-01);letter-spacing:var(--tds-body-01-ls);overflow-y:visible;padding:0 var(--tds-spacing-element-16) var(--tds-spacing-element-16);}.body::-webkit-scrollbar{width:5px;background-color:var(--tds-grey-300)}.body::-webkit-scrollbar-track{background-color:var(--tds-grey-300)}.body::-webkit-scrollbar-thumb{background-color:var(--tds-grey-500)}.tds-modal-backdrop{box-sizing:border-box;position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--tds-modal-backdrop);pointer-events:auto}.tds-modal-backdrop *{box-sizing:border-box}button.tds-modal-close{margin:0 0 auto auto;background-color:transparent;border:0;padding:0;appearance:unset}.tds-modal-close{display:inline-block;height:auto;color:var(--tds-modal-icon);cursor:pointer}.tds-modal-close:focus{outline:2px solid var(--tds-blue-400);outline-offset:-2px}@media (min-width: 320px){.tds-modal-close{margin-left:var(--tds-spacing-element-16)}}@media (min-width: 1056px){.tds-modal-close{margin-left:var(--tds-spacing-element-48)}}.tds-modal-close-btn{display:inline-block;height:auto;background-repeat:no-repeat;cursor:pointer}@media (min-width: 320px){.tds-modal-close-btn{margin-left:var(--tds-spacing-element-16)}}@media (min-width: 1056px){.tds-modal-close-btn{margin-left:var(--tds-spacing-element-48)}}.tds-modal-close-btn svg{fill:var(--tds-modal-icon)}.tds-modal-overflow{overflow:hidden}:host{box-sizing:border-box;position:fixed;top:0;right:0;bottom:0;left:0;padding:0 16px;z-index:700;pointer-events:none}:host *{box-sizing:border-box}:host .tds-modal-close{border:none;background-color:transparent}:host .tds-modal-close-btn{border:none;background-color:transparent}@media (max-width: 320px){:host{padding:0}}:host.show{display:flex}:host.hide{display:none}:host(.show){display:flex}:host(.hide){display:none}";
 const TdsModalStyle0 = modalCss;
@@ -115,9 +116,10 @@ const TdsModal = class {
         });
     }
     render() {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
         const usesHeaderSlot = hasSlot.hasSlot('header', this.host);
         const usesActionsSlot = hasSlot.hasSlot('actions', this.host);
-        return (index.h(index.Host, { key: 'c39328a5796996173d2a484b7b509d03524cb2d6', class: `${this.isShown ? 'show' : 'hide'}`, onClick: (event) => this.handleOverlayClick(event) }, index.h("div", { key: 'f270ed2ab8f671418d5196cda7d4085d6fa69d02', class: "tds-modal-backdrop" }), index.h("div", { key: '8d4670500365548f786a3c6200f9395998198ac0', class: `tds-modal tds-modal__actions-${this.actionsPosition} tds-modal-${this.size}` }, index.h("div", { key: '27a05c42f14827b74b560e1f0b23286c851ff676', class: "header" }, this.header && index.h("div", { key: 'dadbb997eec4b06e6a64a7cdc800603653053862', class: "header-text" }, this.header), usesHeaderSlot && index.h("slot", { key: '07beeba1aea6030fd1c9f2c0aac132828e28a481', name: "header" }), this.closable && (index.h("button", { key: 'e2c25399c520409e8d98345d715a9ea9a4ddfb14', class: "tds-modal-close", "aria-label": "close", onClick: (event) => this.handleClose(event) }, index.h("tds-icon", { key: 'd74d288daea98783e8f4649e0320ce1f9e3b68d0', name: "cross", size: "20px" })))), index.h("div", { key: '594f17d9eba2cb2ec6ffc7382669caba1f5f525a', class: "body" }, index.h("slot", { key: 'dcdaede2986c40a927a74608bed7145696871962', name: "body" })), usesActionsSlot && index.h("slot", { key: 'e0403d1f1201833742925ae8cbb599c2d9ba7b94', name: "actions" }))));
+        return (index.h(index.Host, { key: 'c132c58c8fad8644529d3da69c24b0ab2adf9df1', class: `${this.isShown ? 'show' : 'hide'}`, onClick: (event) => this.handleOverlayClick(event) }, index.h("div", { key: '7f68b5d68ec5fd68236df07fee40ec54ef5e3728', class: "tds-modal-backdrop" }), index.h("div", { key: '6a6b336f9e3f79953605351b124f672e42d88147', class: `tds-modal tds-modal__actions-${this.actionsPosition} tds-modal-${this.size}` }, index.h("div", { key: '826344b73843c905780a54c60e12c083c910dd5c', class: "header" }, this.header && index.h("div", { key: '5e9deedca44877bd6d0440996e73b683cda520eb', class: "header-text" }, this.header), usesHeaderSlot && index.h("slot", { key: '3c0dd4c3fdd4975dcaa43144e93ec9b5c044656c', name: "header" }), this.closable && (index.h("button", { key: '90861404b8b329b34827138bf4221ebe29737e82', class: "tds-modal-close", "aria-label": "close", onClick: (event) => this.handleClose(event) }, index.h(prefixedTagNames.tdsIcon, { key: '563e956985492fc9f5c16b374f60c979bf746c62', name: "cross", size: "20px" })))), index.h("div", { key: 'aeb5db11812c6e1f6723ed12c1d3c8ea8efbe33e', class: "body" }, index.h("slot", { key: '7214799883b11d5b4b2f45ebafd6cd6b69b9f896', name: "body" })), usesActionsSlot && index.h("slot", { key: '0e93478772268d86115d4f6f0bfa6c62b52040f7', name: "actions" }))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/tds-navigation-tab.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
 
-const navigationTabCss = ":host{box-sizing:border-box;display:block}:host *{box-sizing:border-box}:host ::slotted(*){all:unset;font:var(--tds-headline-07) !important;letter-spacing:var(--tds-headline-07-ls) !important;color:var(--tds-navigation-tabs-tab-color) !important;text-decoration:none;display:block;position:relative;transition:color 0.15s ease-in-out 0s;white-space:nowrap;background-color:transparent;border:0;width:100%;padding:26px 4px}:host ::slotted(*:focus-visible)::before{content:\"\";position:absolute;left:0;right:0;top:26px;bottom:26px;outline:2px solid var(--tds-blue-400)}:host .navigation-tab-item:not(.selected)::after{width:0%;transition:width 0.15s ease-in-out 0s}:host .navigation-tab-item{position:relative;margin-right:32px}:host .navigation-tab-item:hover{cursor:pointer}:host .navigation-tab-item:hover::after{width:100%}:host .navigation-tab-item::after{content:\" \";position:absolute;bottom:0;right:0;left:0;margin-left:auto;width:0%;margin-right:auto;height:2px;background-color:var(--tds-navigation-tabs-tab-indicator-background-hover);z-index:1}:host .selected ::slotted(*){color:var(--tds-navigation-tabs-tab-color-selected)}:host .selected::after{width:100%;background-color:var(--tds-navigation-tabs-tab-indicator-background-active)}:host .disabled{color:var(--tds-navigation-tabs-tab-color-disabled)}:host .disabled ::slotted(*){opacity:var(--tds-navigation-tabs-tab-color-opacity-disabled)}:host .disabled::after{content:none}:host .disabled ::slotted(*:hover){cursor:not-allowed}:host .disabled ::slotted(*:focus-visible){outline:none}:host(.first){margin-left:32px}:host(.last){margin-right:32px}";
+const navigationTabCss = ":host{box-sizing:border-box;display:block}:host *{box-sizing:border-box}:host ::slotted(*){all:unset;font:var(--tds-headline-07) !important;letter-spacing:var(--tds-headline-07-ls) !important;color:var(--tds-navigation-tabs-tab-color) !important;text-decoration:none;display:block;position:relative;transition:color 0.15s ease-in-out 0s;white-space:nowrap;background-color:transparent;border:0;width:100%;padding:26px 4px}:host ::slotted(*:focus-visible)::before{content:\"\";position:absolute;left:0;right:0;top:26px;bottom:26px;outline:2px solid var(--tds-blue-400)}:host .navigation-tab-item:not(.selected)::after{width:0%;transition:width 0.15s ease-in-out 0s}:host .navigation-tab-item{position:relative;margin-right:32px}:host .navigation-tab-item:hover{cursor:pointer}:host .navigation-tab-item:hover::after{width:100%}:host .navigation-tab-item::after{content:\" \";position:absolute;bottom:0;right:0;left:0;margin-left:auto;width:0%;margin-right:auto;height:2px;background-color:var(--tds-navigation-tabs-tab-indicator-background-hover);z-index:1}:host .selected ::slotted(*){color:var(--tds-navigation-tabs-tab-color-selected)}:host .selected::after{width:100%;background-color:var(--tds-navigation-tabs-tab-indicator-background-active)}:host .disabled{color:var(--tds-navigation-tabs-tab-color-disabled)}:host .disabled ::slotted(*){opacity:var(--tds-navigation-tabs-tab-color-opacity-disabled)}:host .disabled::after{content:none}:host .disabled ::slotted(*:hover){cursor:not-allowed}:host .disabled ::slotted(*:focus-visible){outline:none}:host(.last){margin-right:32px}";
 const TdsNavigationTabStyle0 = navigationTabCss;
 
 const TdsNavigationTab = class {

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

@@ -3,8 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
+const tagName = require('./tagName-f24f57ce.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 {
@@ -67,6 +68,7 @@ const TdsNavigationTabs = class {
         this.modeVariant = 'primary';
         this.defaultSelectedIndex = 0;
         this.selectedIndex = undefined;
+        this.leftPadding = 32;
         this.showLeftScroll = false;
         this.showRightScroll = false;
     }
@@ -119,8 +121,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) {
@@ -144,12 +148,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();
@@ -165,9 +175,10 @@ const TdsNavigationTabs = class {
         this.removeEventListenerFromTabs();
     }
     render() {
-        return (index.h(index.Host, { key: 'eaf7fd47f5f4132d7920d5deafb659828cab01e9', role: "list", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, index.h("div", { key: '1fe0e2f45e6cf32175a3ef6c556aa63ba3b46b97', class: "wrapper", ref: (el) => {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: 'fc517a4647224414ac6b1643b7ff3cb94810e69c', role: "list", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, index.h("div", { key: '4a26e80281ecc5a791a8c5eee623fdc8a1630f68', class: "wrapper", ref: (el) => {
                 this.navWrapperElement = el;
-            } }, index.h("button", { key: 'fa71abb901a1c6ab70dde90d759d9aa537a72ec2', class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, index.h("tds-icon", { key: '0aff4668869fa761e03e8c81ed054561787beb49', name: "chevron_left", size: "20px" })), index.h("slot", { key: '169f8b9eb18a33fb4fc739863eaf4a730e066c83', onSlotchange: () => this.handleSlotChange() }), index.h("button", { key: '9c9757d3c818191ce5aec5bbd64699c04dfc07db', class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, index.h("tds-icon", { key: 'e38ac8674d9e3e4aeaa67bd888cd411002353634', name: "chevron_right", size: "20px" })))));
+            }, style: { paddingLeft: `${this.leftPadding}px` } }, index.h("button", { key: '6b60e0b9635abf48ca821f8e157b2dff42f8ea24', class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, index.h(prefixedTagNames.tdsIcon, { key: 'eccc37fc81804e909bec8a77279fee3eb156aaa2', name: "chevron_left", size: "20px" })), index.h("slot", { key: 'f48ae4ce1f825415a5c70d86a73caad8411b9bec', onSlotchange: () => this.handleSlotChange() }), index.h("button", { key: 'd0fca82d30d9e354edd26147be75f03fbabdedc0', class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, index.h(prefixedTagNames.tdsIcon, { key: 'bc9270c86e3bfbdfb9168f12865d294f2e7fba3a', name: "chevron_right", size: "20px" })))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
 const inheritAttributes = require('./inheritAttributes-ff9ad737.js');
+const tagName = require('./tagName-f24f57ce.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;
@@ -31,12 +32,13 @@ const TdsPopoverCanvas = class {
     }
     render() {
         var _a;
-        return (index.h(index.Host, { key: '6585164269ddef7083e5aed2bcfa4ea5ab7d32ba' }, index.h("tds-popover-core", Object.assign({ key: '9470ac2faa94611ece2c9394717a7bb9d63eb5b1' }, this.inheritedAttributes, { class: {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: '20f9ec1ff4aa412411f04c1448ab218846b3daff' }, index.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;
-            } }), index.h("div", { key: '330a63a0ef5c9f057d877dae9977b8bc25987771' }, index.h("slot", { key: '38787385e51260e4a140f83d5eb22f03deb6e30e' })))));
+            } }), index.h("div", { key: '64101f87fa1f0d22962ddcc1337dafedd3dbd454' }, index.h("slot", { key: '4c0a7a20eece3cb14465d599821ff0467672476d' })))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
 const inheritAttributes = require('./inheritAttributes-ff9ad737.js');
+const tagName = require('./tagName-f24f57ce.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;
@@ -31,13 +32,14 @@ const TdsPopoverMenu = class {
     }
     render() {
         var _a;
-        return (index.h(index.Host, { key: '36c12148ce4507dd4b157fff5be30760d2374bdd' }, index.h("tds-popover-core", { key: '92d5abfd7e7213dcb22c92fa401a21dfeef76edd', class: {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: '175101f0b9f5df56fa56a2a15d43468d5065129a' }, index.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;
-            } }, index.h("div", { key: '6b3a893d1d0a9c32a3846c7216a4fdac92a4222c', role: "list" }, index.h("slot", { key: 'cae075f5e187b5f59638f6f2a9ff8c38e716bcbb' })))));
+            } }, index.h("div", { key: 'a5ee1d312e2608e134924e584f0c7b81a79b7401', role: "list" }, index.h("slot", { key: '27ca85a642e2ca45a36522d1917ba01042c5f347' })))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
 const inheritAriaAttributes = require('./inheritAriaAttributes-dedbbc57.js');
+const tagName = require('./tagName-f24f57ce.js');
 require('./inheritAttributes-ff9ad737.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)}";
@@ -14,8 +15,9 @@ const TdsSideMenuCloseButton = class {
         index.registerInstance(this, hostRef);
     }
     render() {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
         const buttonProps = Object.assign({ 'aria-label': 'Close' }, inheritAriaAttributes.inheritAriaAttributes(this.host));
-        return (index.h(index.Host, { key: '1dff25b895f341657373ab020116e5c4c0f7af67' }, index.h("button", Object.assign({ key: 'e2c3af974cfc7f9c9e0ec5b64c199fcda0408279' }, buttonProps), index.h("tds-icon", { key: 'aa56689766fe0c49e8d8d591c9f741a24dd85cc8', name: "cross", size: "20px" }))));
+        return (index.h(index.Host, { key: 'b8d9efa8e96a192966ead2a13898665f82b3fc2d' }, index.h("button", Object.assign({ key: '39f2161c9d6330bb9d0ca2245b2e6b63622fd9a6' }, buttonProps), index.h(prefixedTagNames.tdsIcon, { key: 'a3e98760aef2bf5bced8a96cae2e01067ab5a61c', name: "cross", size: "20px" }))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
+const tagName = require('./tagName-f24f57ce.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;
@@ -36,14 +37,15 @@ const TdsSideMenuCollapseButton = class {
         this.collapsed = this.sideMenuEl.collapsed;
     }
     render() {
-        return (index.h(index.Host, { key: '15266cdc6a39373563c89553817e1a6777f01f1c', role: "button", tabindex: "0", onClick: () => {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: '716bdffd158c839bca8c35073866d5c8983277c1', role: "button", tabindex: "0", onClick: () => {
                 this.handleClick();
-            } }, index.h("div", { key: '813da1c78798289b4eed8342b6c00a837ae04b24', class: {
+            } }, index.h("div", { key: 'e8d943133fdbc74d31e8e2f824ae7b2a47426f9d', class: {
                 'wrapper': true,
                 'state-collapsed': this.collapsed,
-            } }, index.h("tds-side-menu-item", { key: '44321406d890c741fff0ad1df9576588a6658ea5', class: {
+            } }, index.h(prefixedTagNames.tdsSideMenuItem, { key: '13be747559758d11dba4a5a8be20762385155b86', class: {
                 button: true,
-            } }, index.h("a", { key: '7e214b15daa5dac9df931a5d15f6ed80a52b5f7d' }, index.h("svg", { key: '61928c3ba4c6e2357a426f0c0ca1a0de86365b6a', class: "icon", slot: "icon", fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 32 32" }, index.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 && index.h("slot", { key: 'b63370f60320b46557e7d40cfad048e29c60109f' }))))));
+            } }, index.h("a", { key: '2660af6cc804011bcbd9838b00949001002170c4' }, index.h("svg", { key: '10bfa3c93ab0ca8f0dc7fc5a84198bf37dc4f968', class: "icon", slot: "icon", fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 32 32" }, index.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 && index.h("slot", { key: '0bb583b4f58f7933a55d515636b524ceb2ccb891' }))))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
+const tagName = require('./tagName-f24f57ce.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;
@@ -54,13 +55,14 @@ const TdsSideMenuDropdown = class {
         this.open = this.defaultOpen;
     }
     render() {
-        return (index.h(index.Host, { key: '1bad48953f08e903e9179dae839c93b249f93266' }, index.h("div", { key: '7e8020738796fb8c449f76a3d1aef801151e4e63', class: {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: 'd61a2cd774e95646ec3f0c00a13404907cedecf1' }, index.h("div", { key: 'ab794f2a74f5d43d4f80ff84ac6a89abd4d8751d', class: {
                 'wrapper': true,
                 'state-open': this.getIsOpenState(),
                 'state-collapsed': this.collapsed,
-            } }, index.h("tds-side-menu-item", { key: 'e4420aba88077e36b1cc7cd10958459d79a463f4', class: "button", active: this.getIsOpenState(), selected: this.selected, onClick: () => {
+            } }, index.h(prefixedTagNames.tdsSideMenuItem, { key: 'e6b558615f822a452d63f174e1c83c80e4c07558', class: "button", active: this.getIsOpenState(), selected: this.selected, onClick: () => {
                 this.open = !this.open;
-            } }, index.h("button", { key: '483ac0b103bf54f63c67cf2d78ed9e82703ba331' }, index.h("slot", { key: 'ec027d3c88569c79d0dde6c51f8dc1056dee6284', name: "icon" }), !this.collapsed && (index.h(index.Fragment, { key: 'f71caa474565871d170653153c8daa7ddead5f17' }, this.buttonLabel, index.h("slot", { key: '487db682801ce910cd65dc6d3ef481bff888574e', name: "label" }), index.h("tds-icon", { key: 'dc75ac7be7eedf85fec97cd3fdbbf786cebe8907', class: "dropdown-icon", name: "chevron_down", size: "16px" }))))), index.h("div", { key: 'e321069727d205d0623cd72fb922c3101f9d2e08', class: "menu" }, this.collapsed && (index.h("h3", { key: '7d5a73c051a700f0568d63ae62ce2737cdb57dd8', class: "heading-collapsed" }, this.buttonLabel, index.h("slot", { key: '9c831576869cac930e8fe9edcbfc86dfede01a47', name: "label" }))), index.h("slot", { key: '7db68bb3f46cdc24fa44c375f0d6bec82c317be4' })))));
+            } }, index.h("button", { key: 'b9c9f561847d6b48ce83807fadc07192a42b11e3' }, index.h("slot", { key: 'e0ecb003ae2d04f0c7f01b357ab831ac2eb68d03', name: "icon" }), !this.collapsed && (index.h(index.Fragment, { key: 'f9fc33e944f4b56f86c7495084d32091d61fafa5' }, this.buttonLabel, index.h("slot", { key: 'c5494b6dd481897c452c8e45e21f35d0260f8703', name: "label" }), index.h(prefixedTagNames.tdsIcon, { key: '1a11f0ed9d78d15d4e68667ed79353af6a6255c9', class: "dropdown-icon", name: "chevron_down", size: "16px" }))))), index.h("div", { key: '75ef7b1e15e926813dabd29cb6f68b17774bbf4d', class: "menu" }, this.collapsed && (index.h("h3", { key: '89a41eed8483f37deb9391293584e93959d03532', class: "heading-collapsed" }, this.buttonLabel, index.h("slot", { key: '1c0cbdd49a1226ee5311a733ab24064ee3032604', name: "label" }))), index.h("slot", { key: '5850c21ffe901c0e8ed848d21106ff63653dce0a' })))));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -0,0 +1,22 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-ca8040ad.js');
+
+const sideMenuUserImageCss = ":host img,:host ::slotted(*){width:34px;height:34px;border-radius:50%}";
+const TdsSideMenuUserImageStyle0 = sideMenuUserImageCss;
+
+const TdsSideMenuUserImage = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.src = undefined;
+        this.alt = undefined;
+    }
+    render() {
+        return (index.h(index.Host, { key: 'cd4bcc9ba4ce93b20e39ab0782136518a99899a3' }, index.h("slot", { key: '09bf0b847a54c03474e9d5dcaad8d0a5a347dbfc' }), this.src && index.h("img", { key: '8d74e3733d69ac50f4fe07557b91aec07aa74605', src: this.src, alt: this.alt })));
+    }
+};
+TdsSideMenuUserImage.style = TdsSideMenuUserImageStyle0;
+
+exports.tds_side_menu_user_image = TdsSideMenuUserImage;

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

@@ -4,21 +4,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
 
-const sideMenuUserImageCss = ":host img,:host ::slotted(*){width:34px;height:34px;border-radius:50%}";
-const TdsSideMenuUserImageStyle0 = sideMenuUserImageCss;
-
-const TdsSideMenuUserImage = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.src = undefined;
-        this.alt = undefined;
-    }
-    render() {
-        return (index.h(index.Host, { key: 'cd4bcc9ba4ce93b20e39ab0782136518a99899a3' }, index.h("slot", { key: '09bf0b847a54c03474e9d5dcaad8d0a5a347dbfc' }), this.src && index.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;
 
@@ -34,5 +19,4 @@ const TdsSideMenuUserLabel = class {
 };
 TdsSideMenuUserLabel.style = TdsSideMenuUserLabelStyle0;
 
-exports.tds_side_menu_user_image = TdsSideMenuUserImage;
 exports.tds_side_menu_user_label = TdsSideMenuUserLabel;

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

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
+const tagName = require('./tagName-f24f57ce.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;
@@ -16,8 +17,10 @@ const TdsSideMenuUser = class {
         this.imgAlt = undefined;
     }
     render() {
-        return (index.h(index.Host, { key: '061364f66ad366cbfb421fa0609020564bd36e83' }, index.h("tds-side-menu-user-image", { key: '01ae0ecb3a011a6a8f50566dc5b683fb56f8d387', src: this.imgSrc, alt: this.imgAlt }, index.h("slot", { key: '5265cabfa2a7533f7e6c8a9a47b1691f8991d3f0', name: "image" })), index.h("tds-side-menu-user-label", { key: '525ac1f1593b048c266733e24d5dd3f5632ce197', heading: this.heading, subheading: this.subheading })));
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: '378797df81d1a0cdec4a7ad12813dcd2d57a8017' }, index.h(prefixedTagNames.tdsSideMenuUserImage, { key: 'faa47521346c55bfa10d27c2aabd9a9224ec1f88', src: this.imgSrc, alt: this.imgAlt }, index.h("slot", { key: '0863342a90fb83e8afc04d763181532c65f86060', name: "image" })), index.h(prefixedTagNames.tdsSideMenuUserLabel, { key: '7f5782f7a00fa2741d24f4d371da8f48e76b8267', heading: this.heading, subheading: this.subheading })));
     }
+    get host() { return index.getElement(this); }
 };
 TdsSideMenuUser.style = TdsSideMenuUserStyle0;
 

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

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
 const generateUniqueId = require('./generateUniqueId-e3fc9863.js');
+const tagName = require('./tagName-f24f57ce.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;
@@ -300,25 +301,27 @@ const TdsSlider = class {
         this.updateTrack();
     }
     render() {
-        return (index.h("div", { key: '943840a77d7cb7f6c394bc2fcd25b36e9a6b5369', class: {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h("div", { key: 'd676666417f2124dd55ca83f8d8823b47dca5275', class: {
                 'tds-slider-wrapper': true,
                 'read-only': this.readOnly,
-            } }, index.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 }), index.h("div", { key: 'e23f338ee45c0416c02568be5ef538708c71a3c2', class: {
+            } }, index.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 }), index.h("div", { key: '25ee1da1072d4081404310fefcf6156ac1545bb6', class: {
                 'tds-slider': true,
                 'disabled': this.disabled,
                 'tds-slider-small': this.useSmall,
             }, ref: (el) => {
                 this.wrapperElement = el;
-            } }, index.h("label", { key: '959ee49ec8483ead245abff393c2e89c5c20ee06', class: this.showTickNumbers && 'offset' }, this.label), this.useInput && (index.h("div", { key: 'c1844b647050d9873d0abc95c3a43dc2f2090020', class: "tds-slider__input-values" }, index.h("div", { key: 'c725f1db4ef669ed6033f9e5b105f6401245263e', class: "tds-slider__input-value min-value" }, this.min))), this.useControls && (index.h("div", { key: '9b1f41eed1e3df5574d9454e42875e6365d4d200', class: "tds-slider__controls" }, index.h("div", { key: '0518f6daaead7ac4b4ed4ca177cb592ce3331260', class: "tds-slider__control tds-slider__control-minus", onClick: (event) => this.stepLeft(event) }, index.h("tds-icon", { key: 'e82506df9a4dd9073e485da2e4457c26188c4a17', name: "minus", size: "16px" })))), index.h("div", { key: '212769a9fca717328cfc7e7159bc01f65d5313a2', class: "tds-slider-inner" }, this.tickValues.length > 0 && (index.h("div", { key: '8158e5b300c4085146900ed5b56ef5748852e137', class: "tds-slider__value-dividers-wrapper" }, index.h("div", { key: '57f7c51c9f538fba5083ffdd7b805212a7726ed4', class: "tds-slider__value-dividers" }, this.tickValues.map((value) => (index.h("div", { class: "tds-slider__value-divider" }, this.showTickNumbers && index.h("span", null, value))))))), index.h("div", { key: '8e25f27e20a07410fbf7ac70600e14663fe4cf0a', class: "tds-slider__track", ref: (el) => {
+            } }, index.h("label", { key: '9f613d2362d32772238e4f9cf4cc21333fa610bb', class: this.showTickNumbers && 'offset' }, this.label), this.useInput && (index.h("div", { key: 'ebbcd4682a5563b5781b0aeeeeac2e56f6a79fbd', class: "tds-slider__input-values" }, index.h("div", { key: '3b0b92b1408f79864825be16dc851b12183bb799', class: "tds-slider__input-value min-value" }, this.min))), this.useControls && (index.h("div", { key: '6d36e25c24c5fe18200f65703a018b92726b3dee', class: "tds-slider__controls" }, index.h("div", { key: 'fb4de7652d093df433e2be7cc06a7b9a9421ed58', class: "tds-slider__control tds-slider__control-minus", onClick: (event) => this.stepLeft(event) }, index.h(prefixedTagNames.tdsIcon, { key: '6a0f6fd30de791dfe2bcab654a9368707cc5ff4c', name: "minus", size: "16px" })))), index.h("div", { key: '0a49a454753cae2f4e49bc5cdfe4094201e0f41b', class: "tds-slider-inner" }, this.tickValues.length > 0 && (index.h("div", { key: 'c920f993c2bf263ecaea5fa6b3904a34e8b94fe8', class: "tds-slider__value-dividers-wrapper" }, index.h("div", { key: 'ed326517f7c3338c88d3314c5848960de2882447', class: "tds-slider__value-dividers" }, this.tickValues.map((value) => (index.h("div", { class: "tds-slider__value-divider" }, this.showTickNumbers && index.h("span", null, value))))))), index.h("div", { key: '5170894e75bd459c9dc5e6010a8312b611c664e8', class: "tds-slider__track", ref: (el) => {
                 this.trackElement = el;
-            }, tabindex: this.disabled ? '-1' : '0' }, index.h("div", { key: 'cb48279c9b6b7f91754a0d0504d38977e80d6454', class: "tds-slider__track-fill", ref: (el) => {
+            }, tabindex: this.disabled ? '-1' : '0' }, index.h("div", { key: '55e94d65579e662b3b92a43418524f348ef4c69c', class: "tds-slider__track-fill", ref: (el) => {
                 this.trackFillElement = el;
-            } }), index.h("div", { key: 'e4d05479a9067ee506578b522c56719c006036fc', class: "tds-slider__thumb", ref: (el) => {
+            } }), index.h("div", { key: 'a8129aaa54e8a03f254e8858e98427fa3f99f452', class: "tds-slider__thumb", ref: (el) => {
                 this.thumbElement = el;
-            }, onMouseDown: () => this.grabThumb(), onTouchStart: () => this.grabThumb() }, this.tooltip && (index.h("div", { key: '6487f63ad6f2ff00cbdd4e1c10bc9d4ec4550137', class: "tds-slider__value" }, this.value, index.h("svg", { key: '5c89ff40a9ccab1e48d1867a69835206313bf4c1', width: "18", height: "14", viewBox: "0 0 18 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.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" })))), index.h("div", { key: '977ed57e0a9d115152dd08bdd656c5d6c858d633', class: "tds-slider__thumb-inner", ref: (el) => {
+            }, onMouseDown: () => this.grabThumb(), onTouchStart: () => this.grabThumb() }, this.tooltip && (index.h("div", { key: '1d478384f0b6c31d4a2766a3a627cdd4574cd79e', class: "tds-slider__value" }, this.value, index.h("svg", { key: '343f422c8042eacbb37737913dcfd4e065a03679', width: "18", height: "14", viewBox: "0 0 18 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.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" })))), index.h("div", { key: '8ed0d33b1b5be47b9e231d88bf2ea9fa8d7a9199', class: "tds-slider__thumb-inner", ref: (el) => {
                 this.thumbInnerElement = el;
-            } })))), this.useInput && (index.h("div", { key: '026b89aea3e01f0d6621d95260db43ba96834181', class: "tds-slider__input-values" }, index.h("div", { key: '9c58cc92d072760adbef4fa1c49c2766f48a4a3b', class: "tds-slider__input-value", onClick: (event) => this.stepLeft(event) }, this.max), index.h("div", { key: '7a35238569b9ded1481ea48a868a985426ec4cef', class: "tds-slider__input-field-wrapper" }, index.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 && (index.h("div", { key: '4d10cc417985b3ae3739120b508e781e79a315d0', class: "tds-slider__controls" }, index.h("div", { key: '9a422c72b65fc9888fd472c36a20df99bb4b50f4', class: "tds-slider__control tds-slider__control-plus", onClick: (event) => this.stepRight(event) }, index.h("tds-icon", { key: '808969d21cb085de199f1d8af307aa9a412c2b4d', name: "plus", size: "16px" })))))));
+            } })))), this.useInput && (index.h("div", { key: '17cdc0c35da1c5355edcacec51a84146ba052350', class: "tds-slider__input-values" }, index.h("div", { key: 'af0f7c10aa16cc44789c827f7eee086fa4abfc70', class: "tds-slider__input-value", onClick: (event) => this.stepLeft(event) }, this.max), index.h("div", { key: '6879810e310ab9f036cd37cd907f704470334cb8', class: "tds-slider__input-field-wrapper" }, index.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 && (index.h("div", { key: '9afa97d14e9e9b44c0f412462b302d160051161d', class: "tds-slider__controls" }, index.h("div", { key: 'efd5e7f9b2f3287e5294bebc51739c6b07876ec7', class: "tds-slider__control tds-slider__control-plus", onClick: (event) => this.stepRight(event) }, index.h(prefixedTagNames.tdsIcon, { key: '5d0fd79876dab01667cf73dcd816a9198e33bd85', name: "plus", size: "16px" })))))));
     }
+    get host() { return index.getElement(this); }
     static get watchers() { return {
         "value": ["handleValueUpdate"]
     }; }

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

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
+const tagName = require('./tagName-f24f57ce.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;
@@ -25,7 +26,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;
@@ -45,9 +46,10 @@ const TdsStep = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '6c7a2673bbe13e518f2052cac2b8bcc948c7c5ea' }, index.h("div", { key: '7df6c87c7743fcd539abcbde7c2396ba8d7fa4d6', role: "listitem", class: `${this.size} ${this.orientation} text-${this.labelPosition} ${this.hideLabels ? 'hide-labels' : ''}` }, index.h("span", { key: 'b2902e638345c79401405b9c16dd6f4d196c8bac', class: `${this.state} content-container` }, this.state === 'success' || this.state === 'error' ? (index.h("tds-icon", { class: 'tds-step-icon', name: this.state === 'success' ? 'tick' : 'warning', size: this.size === 'lg' ? '20px' : '16px' })) : (index.h("span", { class: "index-container" }, this.index))), !this.hideLabels && (index.h("div", { key: 'b35127501be3ab9cc6f3bf0b9f54709f0d98ec36', class: `label ${this.size} ${this.state}` }, index.h("slot", { key: '43499d45d42401e384b8c9f20885873d23351110', name: "label" }))))));
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: '52a70297ba2b6f186916f597e2e6f355fea93d50' }, index.h("div", { key: 'e6abd1a5dc488b03a16451e162ea9b6911e36875', role: "listitem", class: `${this.size} ${this.orientation} text-${this.labelPosition} ${this.hideLabels ? 'hide-labels' : ''}` }, index.h("span", { key: 'e98b565719a767a03386f9e351be40c3843ae7f2', class: `${this.state} content-container` }, this.state === 'success' || this.state === 'error' ? (index.h(prefixedTagNames.tdsIcon, { class: 'tds-step-icon', name: this.state === 'success' ? 'tick' : 'warning', size: this.size === 'lg' ? '20px' : '16px' })) : (index.h("span", { class: "index-container" }, this.index))), !this.hideLabels && (index.h("div", { key: 'eb6814fb3f3b932de0ea2adaa02e8d350db105b0', class: `label ${this.size} ${this.state}` }, index.h("slot", { key: '8e3c42eaa55d71e278f73ac7c920510fc182f00b', name: "label" }))))));
     }
-    get el() { return index.getElement(this); }
+    get host() { return index.getElement(this); }
 };
 TdsStep.style = TdsStepStyle0;
 

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

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
+const tagName = require('./tagName-f24f57ce.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;
@@ -72,11 +73,12 @@ const TdsTableBodyInputWrapper = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'c40a17a264d914934ea4f0e5c4a27b58f06d8055', class: {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: '05e41154f07408493f682755fcfce90b16540f05', class: {
                 'focused-input-wrapper': this.inputFocused,
                 'show-icon': this.showIcon,
                 'tds-table__compact': this.compactDesign,
-            } }, this.renderSlot ? index.h("slot", { onSlotchange: () => this.handleSlotChange() }) : null, this.showIcon ? (index.h("tds-icon", { class: "edit-icon", slot: "icon", size: "16px", name: "edit" })) : null));
+            } }, this.renderSlot ? index.h("slot", { onSlotchange: () => this.handleSlotChange() }) : null, this.showIcon ? (index.h(prefixedTagNames.tdsIcon, { class: "edit-icon", slot: "icon", size: "16px", name: "edit" })) : null));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
+const tagName = require('./tagName-f24f57ce.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;
@@ -55,12 +56,13 @@ const TdsTableBodyRow = class {
         });
     }
     render() {
-        return (index.h(index.Host, { key: '2b99a5336354cb5e7e2e7ef9c81bac76a55c6895', class: {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.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 && (index.h("td", { key: '049e91ea474a539b6fbe344db4aed9de42297f3d', class: "tds-table__body-cell tds-table__body-cell--checkbox tds-form-label tds-form-label--table" }, index.h("tds-checkbox", { key: '2af9307e3143db71cae028c1cc2116382b20f4c9', onTdsChange: (event) => this.handleCheckboxChange(event), checked: this.selected, disabled: this.disabled }))), index.h("slot", { key: '2eff0d398eb53934ca0b152d25422a5febbbffbb' })));
+            } }, this.multiselect && (index.h("td", { key: 'c7207da4609b85ae7d2af89df17a06021ed4d5dc', class: "tds-table__body-cell tds-table__body-cell--checkbox tds-form-label tds-form-label--table" }, index.h(prefixedTagNames.tdsCheckbox, { key: '46d7c610a47b1318d0d30d689bcdcfde5761727c', onTdsChange: (event) => this.handleCheckboxChange(event), checked: this.selected, disabled: this.disabled }))), index.h("slot", { key: '06e607ab15a8f5610f67be5afd2a46ed0f96c4b4' })));
     }
     get host() { return index.getElement(this); }
 };

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

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
+const tagName = require('./tagName-f24f57ce.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;
@@ -103,11 +104,19 @@ const TdsTableFooter = class {
         });
         this.storeLastCorrectValue(this.paginationValue);
     }
+    getStyles() {
+        const styles = {};
+        if (this.horizontalScrollWidth) {
+            styles.width = `${this.horizontalScrollWidth}px`;
+        }
+        return styles;
+    }
     render() {
-        return (index.h(index.Host, { key: 'fe6221e5dd2ec57e63afefc5e45c0b3f5ad85d8f', class: {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: '2b1679b41dc9820424351c33e85591f36818d1e1', class: {
                 'tds-table--compact': this.compactDesign,
                 'footer__horizontal-scroll': !!this.horizontalScrollWidth,
-            }, style: this.horizontalScrollWidth ? { width: this.horizontalScrollWidth } : {} }, index.h("tr", { key: '6f6bfca5e7719084b2c4564b86806f6eb7867601', class: "tds-table__footer-row" }, index.h("td", { key: '2c4389dfa2c028798246a5c4d8b9bdcc05a780f2', class: "tds-table__footer-cell", colSpan: this.columnsNumber }, this.pagination && (index.h("div", { key: '0831e596963e20222feee940fb7d7d489f832b5e', class: "tds-table__pagination" }, index.h("div", { key: '1129e67d9b69b06a1fadde589f9ad37a1bd9fcca', class: "tds-table__row-selector" }), index.h("div", { key: '81e685df813d615027470d4c84c468bb2c5fccca', class: "tds-table__page-selector" }, index.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 }), index.h("p", { key: '927af4715b33f50679aef3ec5eccc5fd4044add7', class: "tds-table__footer-text" }, "of ", index.h("span", { key: '2d89421fbbbb0828623465f39edc506b9bfa82da' }, this.pages), " pages"), index.h("button", { key: '37916d812b7b4510b088b382f48b2d9f04d212b2', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue <= 1, onClick: () => this.previousPage() }, index.h("tds-icon", { key: 'd89ac980f4c48fe6c14610f27ccc05e43994631e', name: "chevron_left", size: "20px" })), index.h("button", { key: '246b17fc6ff26e3830d5a359a4a5de844bc93a1b', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue >= this.pages, onClick: () => this.nextPage() }, index.h("tds-icon", { key: '6fa3441ed75b484974e50ee41ea1444bea7c30e2', name: "chevron_right", size: "20px" })))))))));
+            }, style: this.getStyles() }, index.h("tr", { key: '153812eec84fce53dc6dc8ac7ca0ef80dfd76213', class: "tds-table__footer-row" }, index.h("td", { key: '8393249d6dc9f5758e7b4fa83d7cfcbde59dbc77', class: "tds-table__footer-cell", colSpan: this.columnsNumber }, this.pagination && (index.h("div", { key: 'cbd30e634548f1019ccd1bc15512a6b65ff13034', class: "tds-table__pagination" }, index.h("div", { key: '1c4a05e5ee585ca96b632082cdc34b7d5e520447', class: "tds-table__row-selector" }), index.h("div", { key: 'aaa98355f48907c761157c79d6676a357b431e98', class: "tds-table__page-selector" }, index.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 }), index.h("p", { key: '75c510c649be650ad2c52d894eee1f99ceed9d96', class: "tds-table__footer-text" }, "of ", index.h("span", { key: 'cbdf2851142771260e5f2ded77fac0313e326e69' }, this.pages), " pages"), index.h("button", { key: 'e881d7d94881aef373551e37b9371a9f6b4d5332', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue <= 1, onClick: () => this.previousPage() }, index.h(prefixedTagNames.tdsIcon, { key: 'efb8d1f38cb9cea4fccc9b9df0649837d44dfa46', name: "chevron_left", size: "20px" })), index.h("button", { key: '6017258d6ec87aea2e34739c17d63d1e0762c2d6', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue >= this.pages, onClick: () => this.nextPage() }, index.h(prefixedTagNames.tdsIcon, { key: 'c020cb98076c8c5e26cb9d4a78f0600272e4ebf5', name: "chevron_right", size: "20px" })))))))));
     }
     get host() { return index.getElement(this); }
 };