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

package/dist/cjs/tds-datetime.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 datetimeCss = ".tds-datetime-input[type=datetime-local].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-md[type=datetime-local].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-sm[type=datetime-local].sc-tds-datetime~.icon-time.sc-tds-datetime{display:none}.tds-datetime-input[type=date].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-md[type=date].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-sm[type=date].sc-tds-datetime~.icon-time.sc-tds-datetime{display:none}.tds-datetime-input[type=time].sc-tds-datetime~.icon-datetime-local.sc-tds-datetime,.tds-datetime-input-md[type=time].sc-tds-datetime~.icon-datetime-local.sc-tds-datetime,.tds-datetime-input-sm[type=time].sc-tds-datetime~.icon-datetime-local.sc-tds-datetime{display:none}.tds-datetime-input.sc-tds-datetime{box-sizing:border-box;border-radius:4px 4px 0 0;width:100%;box-sizing:border-box;margin:0;border:none;outline:none;height:100%;color:var(--tds-datetime-color);background-color:var(--tds-datetime-background);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:var(--tds-spacing-element-20) var(--tds-spacing-element-16)}.tds-datetime-input.sc-tds-datetime *.sc-tds-datetime{box-sizing:border-box}.tds-datetime-input.sc-tds-datetime::placeholder{opacity:1;color:var(--tds-datetime-placeholder)}.tds-datetime-input.sc-tds-datetime:focus::placeholder{color:var(--tds-datetime-placeholder-color-focus)}.tds-datetime-input.sc-tds-datetime:disabled{background-color:var(--tds-datetime-background-disabled);color:var(--tds-datetime-color-disabled);cursor:not-allowed}.tds-datetime-input.sc-tds-datetime:disabled::placeholder{color:var(--tds-datetime-placeholder-disabled)}.tds-datetime-input.sc-tds-datetime:disabled~.tds-datetime-label-inside.sc-tds-datetime{color:var(--tds-datetime-label-disabled)}.tds-datetime-input-md.sc-tds-datetime{box-sizing:border-box;border-radius:4px 4px 0 0;width:100%;box-sizing:border-box;margin:0;border:none;outline:none;height:100%;color:var(--tds-datetime-color);background-color:var(--tds-datetime-background);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:var(--tds-spacing-element-16)}.tds-datetime-input-md.sc-tds-datetime *.sc-tds-datetime{box-sizing:border-box}.tds-datetime-input-md.sc-tds-datetime::placeholder{opacity:1;color:var(--tds-datetime-placeholder)}.tds-datetime-input-md.sc-tds-datetime:focus::placeholder{color:var(--tds-datetime-placeholder-color-focus)}.tds-datetime-input-md.sc-tds-datetime:disabled{background-color:var(--tds-datetime-background-disabled);color:var(--tds-datetime-color-disabled);cursor:not-allowed}.tds-datetime-input-md.sc-tds-datetime:disabled::placeholder{color:var(--tds-datetime-placeholder-disabled)}.tds-datetime-input-md.sc-tds-datetime:disabled~.tds-datetime-label-inside.sc-tds-datetime{color:var(--tds-datetime-label-disabled)}.tds-datetime-input-sm.sc-tds-datetime{box-sizing:border-box;border-radius:4px 4px 0 0;width:100%;box-sizing:border-box;margin:0;border:none;outline:none;height:100%;color:var(--tds-datetime-color);background-color:var(--tds-datetime-background);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:var(--tds-spacing-element-16)}.tds-datetime-input-sm.sc-tds-datetime *.sc-tds-datetime{box-sizing:border-box}.tds-datetime-input-sm.sc-tds-datetime::placeholder{opacity:1;color:var(--tds-datetime-placeholder)}.tds-datetime-input-sm.sc-tds-datetime:focus::placeholder{color:var(--tds-datetime-placeholder-color-focus)}.tds-datetime-input-sm.sc-tds-datetime:disabled{background-color:var(--tds-datetime-background-disabled);color:var(--tds-datetime-color-disabled);cursor:not-allowed}.tds-datetime-input-sm.sc-tds-datetime:disabled::placeholder{color:var(--tds-datetime-placeholder-disabled)}.tds-datetime-input-sm.sc-tds-datetime:disabled~.tds-datetime-label-inside.sc-tds-datetime{color:var(--tds-datetime-label-disabled)}.tds-datetime-container.sc-tds-datetime{border-radius:4px 4px 0 0;display:flex;position:relative;height:56px;box-sizing:border-box;background-color:var(--tds-datetime-background);border-bottom:1px solid var(--tds-datetime-border-bottom);transition:border-bottom-color 200ms ease}.tds-datetime-container.sc-tds-datetime:hover{border-bottom-color:var(--tds-datetime-border-bottom-hover)}.tds-form-datetime-md.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{height:48px}.tds-form-datetime-sm.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{height:40px}.tds-datetime-input-container.sc-tds-datetime{position:relative;width:100%}.tds-datetime-input-container.sc-tds-datetime .datetime-icon.sc-tds-datetime{height:20px;width:20px;position:absolute;top:50%;transform:translateY(-50%);right:18px;pointer-events:none;color:var(--tds-datetime-icon)}.tds-datetime-label.sc-tds-datetime{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);display:block;margin-bottom:var(--tds-spacing-element-8);color:var(--tds-datetime-label-color)}.tds-datetime-label-inside.sc-tds-datetime{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);position:absolute;pointer-events:none;color:var(--tds-datetime-label-inside-color);left:16px}.tds-form-datetime.sc-tds-datetime{display:block;min-width:208px;background:unset}.tds-form-datetime-nomin.sc-tds-datetime{min-width:auto}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input.sc-tds-datetime{padding-top:var(--tds-spacing-element-24);padding-bottom:15px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{top:20px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input.sc-tds-datetime::placeholder{color:transparent}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input.sc-tds-datetime .sc-tds-datetime::placeholder{color:transparent}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input.sc-tds-datetime:focus::placeholder{transition:color 0.35s ease;color:var(--tds-datetime-placeholder-color-focus)}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime{padding-top:var(--tds-spacing-element-20);padding-bottom:11px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{top:16px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime::placeholder{color:transparent}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime .sc-tds-datetime::placeholder{color:transparent}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime:focus::placeholder{transition:color 0.35s ease;color:var(--tds-datetime-placeholder-color-focus)}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime{padding-top:var(--tds-spacing-element-20);padding-bottom:11px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{top:16px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime::placeholder{color:transparent}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime .sc-tds-datetime::placeholder{color:transparent}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime:focus::placeholder{transition:color 0.35s ease;color:var(--tds-datetime-placeholder-color-focus)}.tds-form-datetime.tds-datetime-container-label-inside.tds-datetime-focus.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime,.tds-form-datetime.tds-datetime-container-label-inside.tds-datetime-data.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:0.1s ease all;top:8px}.tds-form-datetime.tds-datetime-container-label-inside.tds-datetime-focus.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime,.tds-form-datetime.tds-datetime-container-label-inside.tds-datetime-data.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:0.1s ease all;top:8px}.tds-form-datetime.tds-datetime-container-label-inside.tds-datetime-focus.sc-tds-datetime .tds-datetime-input.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime,.tds-form-datetime.tds-datetime-container-label-inside.tds-datetime-data.sc-tds-datetime .tds-datetime-input.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:0.1s ease all;top:12px}.tds-datetime-bar.sc-tds-datetime{position:absolute;width:100%}.tds-datetime-bar.sc-tds-datetime::before,.tds-datetime-bar.sc-tds-datetime::after{content:\"\";height:2px;top:54px;width:0;position:absolute;background:var(--tds-datetime-bar);transition:0.35s ease all}.tds-form-datetime-md.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::before,.tds-form-datetime-md.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::after{top:46px}.tds-form-datetime-sm.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::before,.tds-form-datetime-sm.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::after{top:40px}.tds-datetime-bar.sc-tds-datetime::before{left:50%}.tds-datetime-bar.sc-tds-datetime::after{right:50%}.tds-datetime-focus.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::before,.tds-datetime-focus.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::after{width:50%}.tds-datetime-helper.sc-tds-datetime{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);display:block;flex-basis:100%;padding-top:var(--tds-spacing-element-4);color:var(--tds-datetime-helper)}.tds-datetime-helper.sc-tds-datetime .tds-helper.sc-tds-datetime{display:inline-flex;gap:8px}.tds-form-datetime-disabled.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{border-bottom-color:transparent}.tds-form-datetime-disabled.sc-tds-datetime .datetime-icon.sc-tds-datetime tds-icon.sc-tds-datetime{color:var(--tds-datetime-icon-disabled)}.tds-form-datetime-disabled.sc-tds-datetime .tds-datetime-label.sc-tds-datetime{color:var(--tds-datetime-label-disabled);cursor:not-allowed}.tds-form-datetime-success.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{border-bottom-color:var(--tds-datetime-border-bottom-success);color:var(--tds-datetime-color-success)}.tds-form-datetime-success.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::before,.tds-form-datetime-success.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::after{background:var(--tds-datetime-bar-sucess)}.tds-form-datetime-error.sc-tds-datetime .tds-datetime-helper.sc-tds-datetime{color:var(--tds-datetime-helper-error)}.tds-form-datetime-error.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{border-bottom-color:var(--tds-datetime-border-bottom-error)}.tds-form-datetime-error.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::before,.tds-form-datetime-error.sc-tds-datetime .tds-datetime-bar.sc-tds-datetime::after{background:var(--tds-datetime-bar-error)}.tds-form-datetime-error.sc-tds-datetime .datetime-icon.sc-tds-datetime tds-icon.sc-tds-datetime{color:var(--tds-datetime-icon-error)}.tds-datetime-textcounter.sc-tds-datetime{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);color:var(--tds-datetime-textcounter);float:right}.tds-datetime-textcounter.sc-tds-datetime .tds-datetime-textcounter-divider.sc-tds-datetime{letter-spacing:var(--tds-detail-05-ls);color:var(--tds-datetime-textcounter-divider)}input[type=datetime-local].sc-tds-datetime::-webkit-inner-spin-button,input[type=datetime-local].sc-tds-datetime::-webkit-calendar-picker-indicator{opacity:0}input[type=date].sc-tds-datetime::-webkit-inner-spin-button,input[type=date].sc-tds-datetime::-webkit-calendar-picker-indicator{opacity:0}input[type=time].sc-tds-datetime::-webkit-inner-spin-button,input[type=time].sc-tds-datetime::-webkit-calendar-picker-indicator{opacity:0}";
 const TdsDatetimeStyle0 = datetimeCss;
@@ -86,6 +87,7 @@ const TdsDatetime = class {
         this.tdsBlur.emit(e);
     }
     render() {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
         let className = ' tds-datetime-input';
         if (this.size === 'md') {
             className += `${className}-md`;
@@ -93,7 +95,7 @@ const TdsDatetime = class {
         if (this.size === 'sm') {
             className += `${className}-sm`;
         }
-        return (index.h("div", { key: 'bbf891d5e12a402775f253dc7010aa57ac0aa3b2', class: `
+        return (index.h("div", { key: 'ff9559a2dcde10aa0ab9f7b246bc9a211ae14336', class: `
         ${this.noMinWidth ? 'tds-form-datetime-nomin' : ''}
         ${this.focusInput ? 'tds-form-datetime tds-datetime-focus' : ' tds-form-datetime'}
         ${this.value.length > 0 ? 'tds-datetime-data' : ''}
@@ -103,8 +105,9 @@ const TdsDatetime = class {
         ${this.state === 'error' || this.state === 'success'
                 ? `tds-form-datetime-${this.state}`
                 : ''}
-        ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, this.label && (index.h("label", { key: '5d82dd3550ec13ee724f27ed351c825a68fef879', htmlFor: this.name, class: "tds-datetime-label" }, this.label)), index.h("div", { key: '6c33d37db85b9d2456bf798b5ebc3511278ed20c', onClick: (e) => this.handleFocusClick(e), class: "tds-datetime-container" }, index.h("div", { key: '8180010cb4c1a486ca0ad38cf5e071dc2c3cdf8e', class: "tds-datetime-input-container" }, index.h("input", { key: '57ebc684980064f0e80c2098f6b4ecce43c51043', ref: (inputEl) => (this.textInput = inputEl), class: className, type: this.type, disabled: this.disabled, value: this.value, min: this.min, max: this.max, autofocus: this.autofocus, name: this.name, onInput: (e) => this.handleInput(e), onBlur: (e) => this.handleBlur(e), onChange: (e) => this.handleChange(e) }), index.h("div", { key: '201c1a161d7a432c25fe950f1b0ab89b39661007', class: "datetime-icon icon-datetime-local" }, index.h("tds-icon", { key: '5d1d5507b58eefedbd4bb547749850649d73279b', size: "20px", name: "calendar" })), index.h("div", { key: '627fcb60cefc9652cd30234f300e77c5abd36934', class: "datetime-icon icon-time" }, index.h("tds-icon", { key: 'e44e6fc4e7eaf8979ecfcc69d57c36fd00bde8b6', size: "20px", name: "clock" }))), index.h("div", { key: 'c167492c99eb44ab832b70d9a814455c54a5135b', class: "tds-datetime-bar" })), this.helper && (index.h("div", { key: '67a91d166c2ef9653518add8f16d2d850dd1b4cf', class: "tds-datetime-helper" }, index.h("div", { key: '1dc9e8119c99d15a0f72cdf8320982e2edbe34d7', class: "tds-helper" }, this.state === 'error' && index.h("tds-icon", { key: 'fec21bee110bd7a4e83bf44b23961713d5d63511', name: "error", size: "16px" }), this.helper)))));
+        ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, this.label && (index.h("label", { key: '5f4eb55e9130b1225c5bee79dee4e001c687ccb9', htmlFor: this.name, class: "tds-datetime-label" }, this.label)), index.h("div", { key: '1421e6bd3e6fb90a15fd91accafa87c4ab7c3d35', onClick: (e) => this.handleFocusClick(e), class: "tds-datetime-container" }, index.h("div", { key: 'a4043f0231f57f17c8d32ca57c34c74e9589cd81', class: "tds-datetime-input-container" }, index.h("input", { key: '4dea136537509b8f860665c1f25cfceedafba168', ref: (inputEl) => (this.textInput = inputEl), class: className, type: this.type, disabled: this.disabled, value: this.value, min: this.min, max: this.max, autofocus: this.autofocus, name: this.name, onInput: (e) => this.handleInput(e), onBlur: (e) => this.handleBlur(e), onChange: (e) => this.handleChange(e) }), index.h("div", { key: '0de5760735617eee28368f4e6dc15d2cfd664172', class: "datetime-icon icon-datetime-local" }, index.h(prefixedTagNames.tdsIcon, { key: 'f0904a047029c721c744fb3d7a98adcb78be1dd5', size: "20px", name: "calendar" })), index.h("div", { key: '94f559661570e3de4495cbe029b50e96f5ad650a', class: "datetime-icon icon-time" }, index.h(prefixedTagNames.tdsIcon, { key: '37847e302e89774a85e0349a8ab401d6ba92d305', size: "20px", name: "clock" }))), index.h("div", { key: 'c7f0964c0131b312334089d541f3ce1d82ebbf6a', class: "tds-datetime-bar" })), this.helper && (index.h("div", { key: '670fb70fe2720a204881ea82892fab68d64e1f82', class: "tds-datetime-helper" }, index.h("div", { key: 'de655e36ffb7f5a7d97a75e1d4325041a2d179cd', class: "tds-helper" }, this.state === 'error' && (index.h(prefixedTagNames.tdsIcon, { key: '45fc7fd21f32a9cf56d703822b4dbe6afe1c0f2f', name: "error", size: "16px" })), this.helper)))));
     }
+    get host() { return index.getElement(this); }
 };
 TdsDatetime.style = TdsDatetimeStyle0;
 

package/dist/cjs/tds-dropdown-option.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 dropdownOptionCss = ":host{box-sizing:border-box;display:block;background-color:var(--tds-dropdown-option-background)}:host *{box-sizing:border-box}:host .dropdown-option{color:var(--tds-dropdown-option-color);border-bottom:1px solid var(--tds-dropdown-option-border);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);overflow-wrap:anywhere}:host .dropdown-option.selected{background-color:var(--tds-dropdown-option-background-selected)}:host .dropdown-option.disabled{color:var(--tds-dropdown-option-color-disabled)}:host .dropdown-option button:focus{outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host .dropdown-option button{all:unset;width:100%}:host .dropdown-option button.lg{padding:19px 0 20px}:host .dropdown-option button.md{padding:15px 0 16px}:host .dropdown-option button.sm{padding:11px 0 12px}:host .dropdown-option button .single-select{display:flex;align-items:center;justify-content:space-between;padding:0 16px}:host .dropdown-option .multiselect{width:100%;height:100%}:host .dropdown-option .multiselect tds-checkbox{display:flex;height:100%;width:100%}:host .dropdown-option .multiselect tds-checkbox.lg{padding:15px 16px 16px}:host .dropdown-option .multiselect tds-checkbox.md{padding:11px 16px 12px}:host .dropdown-option .multiselect tds-checkbox.sm{padding:7px 16px 8px}:host .dropdown-option:hover{background-color:var(--tds-dropdown-option-background-hover);cursor:pointer}:host .dropdown-option:hover.disabled{background-color:var(--tds-dropdown-option-background);cursor:not-allowed}:host([hidden]){display:none}";
 const TdsDropdownOptionStyle0 = dropdownOptionCss;
@@ -71,7 +72,8 @@ const TdsDropdownOption = class {
         this.selected = selected;
     }
     render() {
-        return (index.h(index.Host, { key: '0c0253f02e12d0eb7924969b2d347ab2005d0772', role: "option", "aria-disabled": this.disabled, "aria-selected": this.selected }, index.h("div", { key: 'ad79763807bb52a3e242989f676a03e85804fc62', class: `dropdown-option 
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: '7718cac4b266a8a6e093badf7d6ddb3a3e74fa21', role: "option", "aria-disabled": this.disabled, "aria-selected": this.selected }, index.h("div", { key: 'c28693ad8721d53cd9da2147058354ccebc8aa07', class: `dropdown-option 
           ${this.size}
           ${this.selected ? 'selected' : ''}
           ${this.disabled ? 'disabled' : ''}
@@ -79,13 +81,13 @@ const TdsDropdownOption = class {
                 if (event.key === 'Escape') {
                     this.parentElement.close();
                 }
-            } }, index.h("tds-checkbox", { onTdsChange: (event) => {
+            } }, index.h(prefixedTagNames.tdsCheckbox, { onTdsChange: (event) => {
                 this.handleMultiselect(event);
             }, disabled: this.disabled, checked: this.selected, class: {
                 [this.size]: true,
             } }, index.h("div", { slot: "label" }, index.h("slot", null))))) : (index.h("button", { onClick: () => {
                 this.handleSingleSelect();
-            }, onFocus: (event) => this.handleFocus(event), onBlur: (event) => this.handleBlur(event), disabled: this.disabled, class: this.size }, index.h("div", { class: "single-select" }, index.h("slot", null), this.selected && index.h("tds-icon", { name: "tick", size: "16px" })))))));
+            }, onFocus: (event) => this.handleFocus(event), onBlur: (event) => this.handleBlur(event), disabled: this.disabled, class: this.size }, index.h("div", { class: "single-select" }, index.h("slot", null), this.selected && (index.h(prefixedTagNames.tdsIcon, { name: "tick", size: "16px" }))))))));
     }
     static get delegatesFocus() { return true; }
     get host() { return index.getElement(this); }

package/dist/cjs/tds-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');
 
 /**
  * Find the next focusable element index in a list of focusable elements.
@@ -406,8 +407,9 @@ const TdsDropdown = class {
     }
     render() {
         var _a, _b, _c, _d;
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
         appendHiddenInput(this.host, this.name, (_a = this.value) === null || _a === void 0 ? void 0 : _a.map((value) => value).toString(), this.disabled);
-        return (index.h(index.Host, { key: '62778591bba0279591717580456056657bb96e44', role: "select", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, this.label && this.labelPosition === 'outside' && (index.h("div", { key: 'd511a016571d4aa5b1b6db2e183356612c354a0b', class: `label-outside ${this.disabled ? 'disabled' : ''}` }, this.label)), index.h("div", { key: 'e9a1f512fc81191d66918f967bc90cff26f13080', class: `dropdown-select ${this.size} ${this.disabled ? 'disabled' : ''}` }, this.filter ? (index.h("div", { class: {
+        return (index.h(index.Host, { key: '4c1cf54198f6f00501c337e858ea391272a551e2', role: "select", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, this.label && this.labelPosition === 'outside' && (index.h("div", { key: 'aa66572284cfbeb78b2b26edf17aad3ecc9a3c43', class: `label-outside ${this.disabled ? 'disabled' : ''}` }, this.label)), index.h("div", { key: '114d2d6580dee9739620212079d6e516dacca31e', class: `dropdown-select ${this.size} ${this.disabled ? 'disabled' : ''}` }, this.filter ? (index.h("div", { class: {
                 filter: true,
                 focus: this.filterFocus,
                 disabled: this.disabled,
@@ -430,11 +432,11 @@ const TdsDropdown = class {
                     this.open = false;
                 }
             }
-        })), index.h("tds-icon", { tabIndex: 0, role: "button", "aria-label": "Clear filter", svgTitle: "Clear filter", onClick: this.handleFilterReset, onKeyDown: (event) => {
+        })), index.h(prefixedTagNames.tdsIcon, { tabIndex: 0, role: "button", "aria-label": "Clear filter", svgTitle: "Clear filter", onClick: this.handleFilterReset, onKeyDown: (event) => {
                 if (event.key === 'Enter') {
                     this.handleFilterReset();
                 }
-            }, class: `clear-icon ${this.open && this.inputElement.value !== '' ? '' : 'hide'}`, name: "cross", size: "16px" }), index.h("tds-icon", { tabIndex: 0, role: "button", "aria-label": "Open/Close dropdown", svgTitle: "Open/Close dropdown", onClick: this.handleToggleOpen, onKeyDown: (event) => {
+            }, class: `clear-icon ${this.open && this.inputElement.value !== '' ? '' : 'hide'}`, name: "cross", size: "16px" }), index.h(prefixedTagNames.tdsIcon, { tabIndex: 0, role: "button", "aria-label": "Open/Close dropdown", svgTitle: "Open/Close dropdown", onClick: this.handleToggleOpen, onKeyDown: (event) => {
                 if (event.key === 'Enter') {
                     this.handleToggleOpen();
                 }
@@ -450,11 +452,11 @@ const TdsDropdown = class {
                     label-inside-as-placeholder
                     ${this.size}
                     ${((_c = this.value) === null || _c === void 0 ? void 0 : _c.length) ? 'selected' : ''}
-                    ` }, this.label)), index.h("div", { class: `placeholder ${this.size}` }, ((_d = this.value) === null || _d === void 0 ? void 0 : _d.length) ? this.getValue() : this.placeholder), index.h("tds-icon", { "aria-label": "Open/Close dropdown", svgTitle: "Open/Close dropdown", class: `menu-icon ${this.open ? 'open' : 'closed'}`, name: "chevron_down", size: "16px" }))))), index.h("div", { key: '33d624c7a3669842e5f3c10fff22182185a81eb6', ref: (element) => (this.dropdownList = element), class: `dropdown-list
+                    ` }, this.label)), index.h("div", { class: `placeholder ${this.size}` }, ((_d = this.value) === null || _d === void 0 ? void 0 : _d.length) ? this.getValue() : this.placeholder), index.h(prefixedTagNames.tdsIcon, { "aria-label": "Open/Close dropdown", svgTitle: "Open/Close dropdown", class: `menu-icon ${this.open ? 'open' : 'closed'}`, name: "chevron_down", size: "16px" }))))), index.h("div", { key: '7087e043f7f55ed270cf75405a04ed930c0117de', ref: (element) => (this.dropdownList = element), class: `dropdown-list
             ${this.size}
             ${this.open ? 'open' : 'closed'}
             ${this.getOpenDirection()}
-            ${this.label && this.labelPosition === 'outside' ? 'label-outside' : ''}` }, index.h("slot", { key: 'f65db159240901a2df850c299d926fe2b21d48df', onSlotchange: () => this.handleSlotChange() }), this.filterResult === 0 && this.noResultText !== '' && (index.h("div", { key: 'a1f2a9b42feea0ca9a332c4ec765b2053a186637', class: `no-result ${this.size}` }, this.noResultText))), this.helper && (index.h("div", { key: '173ddb47f30e6901198a58221c274ddf4502cf15', class: `helper ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}` }, this.error && index.h("tds-icon", { key: 'f68ef6f14584bca3c932655be7e63451aac3863e', name: "error", size: "16px" }), this.helper))));
+            ${this.label && this.labelPosition === 'outside' ? 'label-outside' : ''}` }, index.h("slot", { key: 'b9ca939c2e58a69f66011f812023b03315c5e631', onSlotchange: () => this.handleSlotChange() }), this.filterResult === 0 && this.noResultText !== '' && (index.h("div", { key: 'd0f2de1b2a6f5a37224ba77a47e746b7892291b6', class: `no-result ${this.size}` }, this.noResultText))), this.helper && (index.h("div", { key: '86aad799a3ba5950d8df21a3e485f645fd039ffd', class: `helper ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}` }, this.error && (index.h(prefixedTagNames.tdsIcon, { key: '9b51e3ffc96dbd1c39f8b8358df8808a447167e3', name: "error", size: "16px" })), this.helper))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/tds-folder-tabs.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 folderTabsCss = ":host{box-sizing:border-box;overflow:hidden;outline:0}:host *{box-sizing:border-box}:host .wrapper{display:flex;overflow-x:scroll;scrollbar-width:none;position:relative}:host .wrapper::-webkit-scrollbar{display:none}:host .scroll-right-button{z-index:1;right:0}:host .scroll-left-button{z-index:1;left:0}:host .scroll-right-button,:host .scroll-left-button{height:50px;color:var(--tds-folder-tabs-scroll-btn-color);cursor:pointer;border:0;width:0;background-color:var(--tds-folder-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 TdsFolderTabsStyle0 = folderTabsCss;
@@ -167,9 +168,10 @@ const TdsFolderTabs = class {
         this.removeEventListenerFromTabs();
     }
     render() {
-        return (index.h(index.Host, { key: '748bacbb3d58d37735385a8c926dacb637d8eff1', role: "list", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, index.h("div", { key: '4c4f764a6a8c8a095bd1d030ef85a34014d8d284', class: "wrapper", ref: (el) => {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: '7f81db3a95250825f2ad5b6b614af7eddfe33b66', role: "list", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, index.h("div", { key: 'be070eb5e8484fc397426bb8e0c3f35ed4a1e851', class: "wrapper", ref: (el) => {
                 this.navWrapperElement = el;
-            } }, index.h("button", { key: 'ca859bdc9b9d10a7bcfaae194bbee508f308c1a2', class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, disabled: !this.showLeftScroll, onClick: () => this.scrollLeft() }, index.h("tds-icon", { key: '70aaa7044418b79234b9f3bd7eef2c1e0bf96e61', name: "chevron_left", size: "20px" })), index.h("slot", { key: 'ca1990c7333322885aa37b164cc7d74708b22116', onSlotchange: () => this.handleSlotChange() }), index.h("button", { key: '6321d42b6a42a9bf63ae844b94541f56806195fd', class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, disabled: !this.showRightScroll, onClick: () => this.scrollRight() }, index.h("tds-icon", { key: '40a0e7a3297bdf6d4abbe5fc62114020fdb7aee3', name: "chevron_right", size: "20px" })))));
+            } }, index.h("button", { key: '6d3862bddb1407519259a5eab162ab0ddf95e76c', class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, disabled: !this.showLeftScroll, onClick: () => this.scrollLeft() }, index.h(prefixedTagNames.tdsIcon, { key: 'e36ee18f2896ad27889619a284c8e39ea0397148', name: "chevron_left", size: "20px" })), index.h("slot", { key: '1b62b7716c519f9eb9c2b2a8eab327a25d621a7e', onSlotchange: () => this.handleSlotChange() }), index.h("button", { key: 'ac50c266270eab2bc53172f2e000a0d93ca4aa2d', class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, disabled: !this.showRightScroll, onClick: () => this.scrollRight() }, index.h(prefixedTagNames.tdsIcon, { key: 'c62208f8e55c6d4662872a9b676e9993c61ec03d', name: "chevron_right", size: "20px" })))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/tds-footer-group.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 footerGroupCss = ":host{display:block}:host .footer-top-title{font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);opacity:var(--tds-footer-top-title-opacity);color:var(--tds-footer-top-links);padding-bottom:8px}:host button.footer-top-title-button{display:none;border:none;width:100%;font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);color:var(--tds-footer-top-links);background-color:transparent;text-align:left;padding:19px 24px;justify-content:space-between;border-bottom:1px solid var(--tds-footer-top-divider)}:host button.footer-top-title-button.expanded{border-bottom:none}:host button.footer-top-title-button.expanded tds-icon{transform:rotateZ(180deg)}:host button.footer-top-title-button:hover{cursor:pointer}:host button.footer-top-title-button:active{background-color:var(--tds-footer-top-button-active)}:host button.footer-top-title-button:focus-visible{outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host button.footer-top-title-button tds-icon{transition:transform 0.2s ease-in-out}:host [role=list]{list-style:none;padding:0;margin:0;display:flex;gap:8px}:host [role=list].start,:host [role=list].end{gap:24px}:host [role=list].top-part-child{flex-direction:column}@media all and (max-width: 992px){:host [role=list].start:not(.top-part-child){flex-direction:column}:host [role=list].start:not(.top-part-child).start,:host [role=list].start:not(.top-part-child).end{gap:8px}:host [role=list].top-part-child.closed{display:none}:host [role=list].top-part-child{gap:0}:host .footer-top-title{display:none}:host button.footer-top-title-button{display:flex;align-items:center}}";
 const TdsFooterGroupStyle0 = footerGroupCss;
@@ -25,11 +26,12 @@ const TdsFooterGroup = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'b704a9cdc581f94a4680793bccc4da44496fe328' }, this.titleText && this.topPartGroup && (index.h("div", { key: '630d91ff93d0eeb6c0bc603d9255059bad3b8d33', class: "footer-top-title" }, this.titleText)), this.titleText && this.topPartGroup && (index.h("button", { key: '2a424b0f61fb06b14ae9bb9a611b5264e0854111', onClick: () => {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: 'e11ef7d9a8aec368d66af7b0cabe26dc902c85a7' }, this.titleText && this.topPartGroup && (index.h("div", { key: '3e2501b462125c822ae2c88ff730a55c0aad8260', class: "footer-top-title" }, this.titleText)), this.titleText && this.topPartGroup && (index.h("button", { key: '52daf369f035175fc48ee9199b0f1e7036e7c463', onClick: () => {
                 this.open = !this.open;
-            }, class: `footer-top-title-button  ${this.open ? 'expanded' : 'closed'}` }, this.titleText, index.h("tds-icon", { key: 'ea2d3d26b0c70d6346b71d98753a6e13bf074351', name: "chevron_down", size: "20px" }))), index.h("div", { key: '400c3cf5f39e59fa60f26cba45df02ad8b5da063', role: "list", class: `${this.slotPosition ? this.slotPosition : ''}
+            }, class: `footer-top-title-button  ${this.open ? 'expanded' : 'closed'}` }, this.titleText, index.h(prefixedTagNames.tdsIcon, { key: '3eb5fa8014c2715c55da365a58956580d1ae0409', name: "chevron_down", size: "20px" }))), index.h("div", { key: 'fed9169cb09fc437108cdebfaeeccec8574c6040', role: "list", class: `${this.slotPosition ? this.slotPosition : ''}
             ${this.topPartGroup ? 'top-part-child' : ''}
-            ${this.open ? 'expanded' : 'closed'}` }, index.h("slot", { key: '38241a0f3b5a343f5074b113168ba97465f7c209' }))));
+            ${this.open ? 'expanded' : 'closed'}` }, index.h("slot", { key: '30f371244d9019e299e3e1cc0ae515d1e36a5b9b' }))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/tds-header-brand-symbol.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 headerBrandSymbolCss = ":host tds-header-item{display:none}:host tds-header-item ::slotted(*){background-image:var(--tds-background-image-scania-symbol-svg), var(--tds-background-image-scania-symbol-png);background-size:30px auto;background-position:center;background-repeat:no-repeat}@media (min-width: 992px){:host tds-header-item{display:block}}";
 const TdsHeaderBrandSymbolStyle0 = headerBrandSymbolCss;
@@ -12,7 +13,8 @@ const TdsHeaderBrandSymbol = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '9b3b472651a6d410b143316851ca701eab5a82c3' }, index.h("tds-header-item", { key: '843bc3ce81ae39261a7eb4429ed4d9d76f051cfb' }, index.h("slot", { key: 'd3a939ac410d229c78532c133e54b868507f7aff' }))));
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: '6f237ddae88d1a8c47da6517e69c8a46bde26b2b' }, index.h(prefixedTagNames.tdsHeaderItem, { key: '9e2eedf7f479dbff34d1e43008d1b3a524431567' }, index.h("slot", { key: '7d3349600bac83de2347ca11d10434826e24f213' }))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/tds-header-cell.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 tableHeaderCellCss = ":host(.tds-table__header-cell){box-sizing:border-box;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-header-background-hover);padding:0;height:48px;min-width:192px;box-sizing:border-box;vertical-align:middle;overflow:hidden;transition:background-color 200ms ease}:host(.tds-table__header-cell) *{box-sizing:border-box}:host(.tds-table__header-cell) .tds-table__header-text{padding:8px 16px;margin:0}:host(.tds-table__header-cell) .tds-table__header-text-no-padding{padding:0}:host(.tds-table__header-cell--sortable) .tds-table__header-button{display:flex;align-items:center;gap:8px;justify-content:start;flex-direction:row;width:100%;height:100%;padding:0 16px;background-color:transparent;border:none;cursor:pointer;transition:background-color 200ms ease}:host(.tds-table__header-cell--sortable) .tds-table__header-button:focus{outline:2px solid var(--tds-table-header-btn-focus);outline-offset:-2px}:host(.tds-table__header-cell--sortable) .tds-table__header-button:focus .tds-table__header-button-icon{opacity:1}:host(.tds-table__header-cell--sortable) .tds-table__header-button .tds-table__header-button-text{font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);text-align:left;color:var(--tds-table-header-btn-color)}:host(.tds-table__header-cell--sortable) .tds-table__header-button .tds-table__header-button-icon{flex:0 0 16px;height:16px;width:16px;opacity:0;transform-origin:center;transition:opacity 200ms ease-in, transform 200ms ease;fill:var(--tds-table-color)}:host(.tds-table__header-cell--sortable) .tds-table__header-button:hover .tds-table__header-button-icon{opacity:1}:host(.tds-table__header-cell--is-sorted) .tds-table__header-button{background-color:var(--tds-table-header-btn-background)}:host(.tds-table__header-cell--is-sorted) .tds-table__header-button:hover{background-color:var(--tds-table-header-btn-background-hover)}:host(.tds-table__header-cell--is-sorted) .tds-table__header-button .tds-table__header-button-icon{opacity:1}:host(.tds-table__header-cell--is-sorted) .tds-table__header-button .tds-table__header-button-icon--rotate{transform:rotate(180deg)}:host(.tds-table--compact){height:33px}:host(.tds-table--divider){border-right:1px solid var(--tds-table-divider)}:host(.tds-table--divider:last-of-type){border-right:none}:host(.tds-table--no-min-width){min-width:unset}:host(.tds-table--no-padding){height:unset}:host(.tds-table__header-cell:first-of-type){border-top-left-radius:4px}:host(.tds-table__header-cell:last-of-type){border-top-right-radius:4px}:host(.tds-table--extra-column:first-of-type){border-top-left-radius:0}:host(.tds-table--toolbar-available){border-radius:0}:host(.tds-table--extra-column.tds-table--toolbar-available){border-radius:0}:host(.tds-table__header-cell.tds-table--toolbar-available:first-of-type){border-top-left-radius:0}:host(.tds-table__header-cell.tds-table--toolbar-available:last-of-type){border-top-right-radius:0}";
 const TdsHeaderCellStyle0 = tableHeaderCellCss;
@@ -39,9 +40,9 @@ const TdsTableHeaderCell = class {
                 key: this.cellKey,
             });
         };
-        this.headerCellContent = () => {
+        this.headerCellContent = (prefixedTagNames) => {
             if (this.sortable) {
-                return (index.h("button", { class: "tds-table__header-button", onClick: () => this.sortButtonClick(), style: { justifyContent: this.textAlignState } }, index.h("span", { class: "tds-table__header-button-text" }, this.cellValue, index.h("slot", null)), this.sortingDirection === undefined && (index.h("tds-icon", { class: "tds-table__header-button-icon", name: "sorting", size: "16px" })), this.sortingDirection && ['asc', 'desc'].includes(this.sortingDirection) && (index.h("tds-icon", { class: `tds-table__header-button-icon ${this.sortingDirection === 'asc' ? 'tds-table__header-button-icon--rotate' : ''}`, name: "arrow_down", size: "16px" }))));
+                return (index.h("button", { class: "tds-table__header-button", onClick: () => this.sortButtonClick(), style: { justifyContent: this.textAlignState } }, index.h("span", { class: "tds-table__header-button-text" }, this.cellValue, index.h("slot", null)), this.sortingDirection === undefined && (index.h(prefixedTagNames.tdsIcon, { class: "tds-table__header-button-icon", name: "sorting", size: "16px" })), this.sortingDirection && ['asc', 'desc'].includes(this.sortingDirection) && (index.h(prefixedTagNames.tdsIcon, { class: `tds-table__header-button-icon ${this.sortingDirection === 'asc' ? 'tds-table__header-button-icon--rotate' : ''}`, name: "arrow_down", size: "16px" }))));
             }
             return (index.h("p", { class: {
                     'tds-table__header-text': true,
@@ -115,7 +116,8 @@ const TdsTableHeaderCell = class {
             this.host.closest('tds-table').getElementsByTagName('tds-table-toolbar').length >= 1;
     }
     render() {
-        return (index.h(index.Host, { key: '6a051465b3a5af5460f7c5ac112798b521f9b4a8', class: {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: '0dc5485f665fc02b21ed16b04e130b49037fa491', class: {
                 'tds-table__header-cell': true,
                 'tds-table__header-cell--sortable': this.sortable,
                 'tds-table__header-cell--is-sorted': this.sortedByMyKey,
@@ -126,7 +128,7 @@ const TdsTableHeaderCell = class {
                 'tds-table--extra-column': this.multiselect || this.expandableRows,
                 'tds-table--toolbar-available': this.enableToolbarDesign,
                 'tds-table--no-padding': this.disablePadding,
-            }, style: { minWidth: this.customWidth }, onMouseOver: () => this.onHeadCellHover(this.cellKey), onMouseLeave: () => this.onHeadCellHover('') }, this.headerCellContent()));
+            }, style: { minWidth: this.customWidth }, onMouseOver: () => this.onHeadCellHover(this.cellKey), onMouseLeave: () => this.onHeadCellHover('') }, this.headerCellContent(prefixedTagNames)));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/tds-header-dropdown-list.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
-const isHeadingElement = require('./isHeadingElement-4f06b688.js');
+const getPreviousNestedChildOfSiblingsMatching = require('./getPreviousNestedChildOfSiblingsMatching-4e700df1.js');
 require('./dfs-84f7f63e.js');
 
 const headerDropdownListCss = ":host{display:block;width:190px;padding:0;margin:0;list-style:none;border-radius:unset;background-color:var(--tds-header-app-launcher-menu-bg)}@media all and (max-width: 384px){:host{width:100vw}}:host([size=lg]){width:320px}";
@@ -30,7 +30,7 @@ const TdsHeaderDropdownList = class {
         if (this.host.parentElement.tagName.toLowerCase() === 'tds-header-launcher-list') {
             listRoot = this.host.parentElement;
         }
-        const headingEl = isHeadingElement.getPreviousNestedChildOfSiblingsMatching(listRoot, isHeadingElement.isHeadingElement);
+        const headingEl = getPreviousNestedChildOfSiblingsMatching.getPreviousNestedChildOfSiblingsMatching(listRoot, getPreviousNestedChildOfSiblingsMatching.isHeadingElement);
         if (headingEl) {
             this.headingElement = headingEl;
         }

package/dist/cjs/tds-header-dropdown.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 headerDropdownCss = ":host{--tds-scrollbar-width-standard:thin;--tds-scrollbar-width:10px;--tds-scrollbar-height:10px;--tds-scrollbar-thumb-border-width:3px;--tds-scrollbar-thumb-border-hover-width:2px}body{scrollbar-width:thin}:host{height:var(--tds-header-height);position:relative}:host .menu{flex-direction:column;overflow-y:auto;max-height:calc(100vh - var(--tds-header-height));box-shadow:var(--tds-nav-dropdown-menu-box);background-color:var(--tds-header-app-launcher-menu-background);border-top-right-radius:0;border-top-left-radius:0}:host .menu:hover::-webkit-scrollbar-thumb{border:var(--tds-scrollbar-thumb-border-hover-width) solid transparent;background:var(--tds-scrollbar-hover-thumb-color);background-clip:padding-box}:host .menu::-webkit-scrollbar{width:var(--tds-scrollbar-width)}:host .menu::-webkit-scrollbar-track{background:var(--tds-scrollbar-track-color)}:host .menu::-webkit-scrollbar-thumb{border-radius:40px;background:var(--tds-scrollbar-thumb-color);border:var(--tds-scrollbar-thumb-border-width) solid transparent;background-clip:padding-box}:host .menu::-webkit-scrollbar-button{height:0;width:0}@supports not selector(::-webkit-scrollbar){:host .menu{scrollbar-color:var(--tds-scrollbar-thumb-color) var(--tds-scrollbar-track-color);scrollbar-width:var(--tds-scrollbar-width-standard)}}:host .state-open .dropdown-icon{transform:rotatetds-z-index(180deg)}:host .state-open .button{position:relative;z-index:901}";
 const TdsHeaderDropdownStyle0 = headerDropdownCss;
@@ -35,13 +36,14 @@ const TdsHeaderDropdown = class {
         this.open = !this.open;
     }
     render() {
-        return (index.h(index.Host, { key: '73a8e824b891f66806fad583470460a30af641de' }, index.h("div", { key: '81e78a9f21b152ae4698ec6f693ead79eb40f936', class: {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: '7e2cd60291832d0b78a7bb314f28c7bca0741ff5' }, index.h("div", { key: '5c7aa66e35135d792e7e17983913057bacae0a81', class: {
                 'state-open': this.open,
-            } }, index.h("tds-header-item", { key: 'aab78709417d1fd623c9a9969246434d78bcc055', class: "button", active: this.open, selected: this.selected }, index.h("button", { key: 'dff4234a39520177ba3cc058511144431facb944', ref: (el) => {
+            } }, index.h(prefixedTagNames.tdsHeaderItem, { key: '074a2bcc6b24729de6725022b249c7a77e3d2e3f', class: "button", active: this.open, selected: this.selected }, index.h("button", { key: '60b484244a06d6fff7df7fbfec57276acfc0deae', ref: (el) => {
                 this.buttonEl = el;
             }, "aria-expanded": `${this.open}`, "aria-controls": `launcher-${this.uuid}`, "aria-current": this.selected ? 'location' : 'false', onClick: () => {
                 this.toggleDropdown();
-            } }, index.h("slot", { key: 'ec32e95833f0bc4a93a18c0058c7bea979cde638', name: "icon" }), this.label, index.h("slot", { key: 'ab077d925ecbc941446bb9f1f6755dccae26e0ae', name: "label" }), !this.noDropdownIcon && (index.h("tds-icon", { key: 'eb45d913a11433c12e5add804c88fd7c33e343ea', class: "dropdown-icon", name: "chevron_down", size: "16px" })))), this.buttonEl && (index.h("tds-popover-canvas", { key: 'bc15799eeb488984d58abe21cfc27ba695a395a0', id: `tds-dropdown-${this.uuid}`, class: "menu", referenceEl: this.buttonEl, placement: "bottom-start", show: this.open, offsetDistance: 0, modifiers: [
+            } }, index.h("slot", { key: 'b2a7281717686f186aeb9ccba55854362e4fad65', name: "icon" }), this.label, index.h("slot", { key: '6f9684dc01fe44c3a0e88f98ab276c6cc610b8cf', name: "label" }), !this.noDropdownIcon && (index.h(prefixedTagNames.tdsIcon, { key: 'e8a4ae7c78551f0578dbc0f97866d06a3efcce1e', class: "dropdown-icon", name: "chevron_down", size: "16px" })))), this.buttonEl && (index.h(prefixedTagNames.tdsPopoverCanvas, { key: '4cc743cd081481ed5558a2bfbc92048d25563e94', id: `tds-dropdown-${this.uuid}`, class: "menu", referenceEl: this.buttonEl, placement: "bottom-start", show: this.open, offsetDistance: 0, modifiers: [
                 {
                     name: 'flip',
                     options: {

package/dist/cjs/tds-header-hamburger.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 headerHamburgerCss = ":host{color:var(--tds-white)}:host tds-header-item{display:block}:host .icon{position:relative;margin-left:-6px;left:3px;transition:background 0.2s ease-in-out, color 0.2s ease-in-out}@media screen and (min-width: 992px){:host tds-header-item{display:none}:host([persistent]) tds-header-item{display:block}}";
@@ -14,8 +15,9 @@ const TdsHeaderHamburger = class {
         index.registerInstance(this, hostRef);
     }
     render() {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
         const inheritedButtonProps = Object.assign({}, inheritAriaAttributes.inheritAriaAttributes(this.host));
-        return (index.h(index.Host, { key: 'fa81c06234538414f64c983239c34b7a32184d35' }, index.h("tds-header-item", { key: '5c1168413c62c9f51df5d15bc4b1c12f971cf2f8' }, index.h("button", Object.assign({ key: 'e2225a6e50590b6b25d282737e2198cbd6bf1458' }, inheritedButtonProps), index.h("tds-icon", { key: '5659662f934a61c57b981a24e27cc4e25247cbf7', class: "icon", name: "burger", size: "20px" })))));
+        return (index.h(index.Host, { key: 'b44b763cd492848f49ffb03f20a84479bbf4dc6f' }, index.h(prefixedTagNames.tdsHeaderItem, { key: '2e545cec7a232a21184f01f0b6b03e411131f0c4' }, index.h("button", Object.assign({ key: '650633e93ff94d94a79662b13217cea3aaa8ea22' }, inheritedButtonProps), index.h(prefixedTagNames.tdsIcon, { key: '25ddaf1f48ae43f45040059fafd465de64a71a1f', class: "icon", name: "burger", size: "20px" })))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/{tds-core-header-item_2.cjs.entry.js → tds-header-item.cjs.entry.js}

@@ -4,19 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
 const dfs = require('./dfs-84f7f63e.js');
-
-const coreHeaderItemCss = ":host{font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);color:var(--tds-header-nav-item-color)}:host .item{all:unset;box-sizing:border-box;display:flex;justify-content:center;align-items:center;min-width:var(--tds-header-height);height:var(--tds-header-height);margin:0}:host .item *{box-sizing:border-box}:host slot{white-space:nowrap}:host ::slotted(svg){font-size:20px}";
-const TdsCoreHeaderItemStyle0 = coreHeaderItemCss;
-
-const TdsCoreHeaderItem = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-    }
-    render() {
-        return (index.h(index.Host, { key: 'ef3825bce10e5d23e01b4be557014a5c90b8e7de' }, index.h("div", { key: '134696c5345b16dc15dc1940d7d42066597b3a4e', class: "item" }, index.h("slot", { key: '9e8fbe10a25cb6005d2ff03ce00adc5c6cdad495' }))));
-    }
-};
-TdsCoreHeaderItem.style = TdsCoreHeaderItemStyle0;
+const tagName = require('./tagName-f24f57ce.js');
 
 const headerItemCss = ":host ::slotted(button),:host ::slotted(a){all:unset;box-sizing:border-box;background-color:var(--tds-header-background);border-right:1px solid var(--tds-header--basic-element-border);width:100%;height:100%;cursor:pointer;padding:0 24px;display:flex;align-items:center;gap:8px}:host ::slotted(button) *,:host ::slotted(a) *{box-sizing:border-box}:host ::slotted(button:hover),:host ::slotted(a:hover){background-color:var(--tds-header-item-hover)}:host ::slotted(button:focus-visible),:host ::slotted(a:focus-visible){outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host .component-active ::slotted(button),:host .component-active ::slotted(a){background-color:var(--tds-header--basic-element-background-open);color:var(--tds-header-nav-item-dropdown-opened-color);border-color:var(--tds-header--basic-element-border-open)}:host .component-selected:not(.component-active) ::slotted(button),:host .component-selected:not(.component-active) ::slotted(a){background-color:var(--tds-header--basic-element-background-selected);padding-top:4px;border-bottom-style:solid;border-bottom-width:4px;border-bottom-color:var(--tds-nav-item-border-color-active)}";
 const TdsHeaderItemStyle0 = headerItemCss;
@@ -56,14 +44,14 @@ const TdsHeaderItem = class {
         this.slotEl.addEventListener('slotchange', this.updateSlottedElements);
     }
     render() {
-        return (index.h(index.Host, { key: 'd5f256a30d131817e23f428b87a3604e2a299ad6' }, index.h("tds-core-header-item", { key: 'd2dc6486839af96bbd10938bf9e03ff50123da4f', class: {
-                'component-active': this.active,
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: '53e959002a5dd092b8a21b1746f2677b9e8f1bf6' }, index.h(prefixedTagNames.tdsCoreHeaderItem, { key: '32993eb9fd4c7ccfa0dc0a9af898ebd082e39ecd', class: {
+                'component-active and-other': this.active,
                 'component-selected': this.selected,
-            } }, index.h("slot", { key: 'a89a44221fe947e4075e6889ed3e3cf8478f6e96' }))));
+            } }, index.h("slot", { key: '3bbed91129ca0fe39e5edd287407b44d35e1f6d9' }))));
     }
     get host() { return index.getElement(this); }
 };
 TdsHeaderItem.style = TdsHeaderItemStyle0;
 
-exports.tds_core_header_item = TdsCoreHeaderItem;
 exports.tds_header_item = TdsHeaderItem;

package/dist/cjs/tds-header-launcher-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 headerLauncherButtonCss = ":host{display:block}:host tds-header-item{display:block}:host .icon{position:relative;margin-left:-6px;left:3px;transition:all 0.2s ease-in-out}";
@@ -15,9 +16,10 @@ const TdsHeaderLauncherButton = class {
         this.active = false;
     }
     render() {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
         this.ariaAttributes = Object.assign(Object.assign({}, this.ariaAttributes), inheritAriaAttributes.inheritAriaAttributes(this.host));
         const buttonProps = Object.assign({}, this.ariaAttributes);
-        return (index.h(index.Host, { key: 'ee714e05a3585542850f433cd81ed25d95a14070' }, index.h("tds-header-item", { key: '0a7c7b20fa872c1ccd4e0760b9f68743ec6c761f', active: this.active }, index.h("button", Object.assign({ key: '1b0c93c04e5206dc47fe3df3a158e16ed624f8e1' }, buttonProps), index.h("tds-icon", { key: '11a961f7e11d741108a450ef1a2fa1b22f5520a8', class: "icon", name: "bento", size: "20px" })))));
+        return (index.h(index.Host, { key: '7b3cdd607d43179c06df73f9c1e93cc8a3d34110' }, index.h(prefixedTagNames.tdsHeaderItem, { key: '34947ba38eb0a041e98ad33ee3d9f3eb23d09d80', active: this.active }, index.h("button", Object.assign({ key: 'a54b553fc4da95d6655a1a508c61e9effb87e804' }, buttonProps), index.h(prefixedTagNames.tdsIcon, { key: 'bcbb1a11a47b1d278b46456fdc08e79aff248de6', class: "icon", name: "bento", size: "20px" })))));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/tds-header-launcher-grid.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
-const isHeadingElement = require('./isHeadingElement-4f06b688.js');
+const getPreviousNestedChildOfSiblingsMatching = require('./getPreviousNestedChildOfSiblingsMatching-4e700df1.js');
 require('./dfs-84f7f63e.js');
 
 const headerLauncherGridCss = ".tds-header-launcher-grid{box-sizing:border-box;padding:12px;margin:0;list-style:none;width:100%;display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px;border-radius:none}";
@@ -16,9 +16,9 @@ const TdsHeaderLauncherGrid = class {
     }
     componentWillLoad() {
         const listRoot = this.host;
-        const headingEl = isHeadingElement.getPreviousNestedChildOfSiblingsMatching(listRoot, (el) => {
+        const headingEl = getPreviousNestedChildOfSiblingsMatching.getPreviousNestedChildOfSiblingsMatching(listRoot, (el) => {
             const e = el;
-            return isHeadingElement.isHeadingElement(e);
+            return getPreviousNestedChildOfSiblingsMatching.isHeadingElement(e);
         });
         if (headingEl) {
             this.headingElement = headingEl;

package/dist/cjs/tds-header-launcher-list-item.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 headerLauncherListItemCss = ":host{display:block;border-bottom:1px solid var(--tds-nav-dropdown-item-border-color)}";
 const TdsHeaderLauncherListItemStyle0 = headerLauncherListItemCss;
@@ -12,8 +13,10 @@ const TdsHeaderLauncherListItem = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '1b2afd6810710416ac4362d00af34f2ec889ea1f' }, index.h("tds-header-dropdown-list-item", { key: '860b07b16c713c8a74e7443c452263e054c6aebd', size: "lg" }, index.h("slot", { key: '521f412cd86ae413537bca6821f9c95bce075f63' }))));
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: 'dc91e95bff5fc5a24a7888e8ea1c09d9f6ddd381' }, index.h(prefixedTagNames.tdsHeaderDropdownListItem, { key: '25c61bb9c8600a30fad53b1265f8b3608aaa510c', size: "lg" }, index.h("slot", { key: '02c4962deca0829a70e9a6d8dbd9a26d4a721933' }))));
     }
+    get host() { return index.getElement(this); }
 };
 TdsHeaderLauncherListItem.style = TdsHeaderLauncherListItemStyle0;
 

package/dist/cjs/tds-header-launcher-list.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 TdsHeaderLauncherList = class {
     constructor(hostRef) {
@@ -11,8 +12,10 @@ const TdsHeaderLauncherList = class {
         this.uuid = generateUniqueId.generateUniqueId();
     }
     render() {
-        return (index.h(index.Host, { key: '3e4fe30a4ec6234898314d838831ffccdaf37ccf' }, index.h("tds-header-dropdown-list", { key: '0a3926403b5800b45433edd035f700a6778bbc2b', size: "lg" }, index.h("slot", { key: 'bcbe4495b9f136b07a5c3c1e7062ec116707a5e4' }))));
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: '181fea64b9b0c467cc3f87284a35bcd4f3744bfe' }, index.h(prefixedTagNames.tdsHeaderDropdownList, { key: 'fa756f0269c590d9d56741a4e5c79f0f2e276144', size: "lg" }, index.h("slot", { key: 'c7e198458ec21f602d432485d84e72af3b16e26b' }))));
     }
+    get host() { return index.getElement(this); }
 };
 
 exports.tds_header_launcher_list = TdsHeaderLauncherList;

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

@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-ca8040ad.js');
 const generateUniqueId = require('./generateUniqueId-e3fc9863.js');
 const inheritAriaAttributes = require('./inheritAriaAttributes-dedbbc57.js');
+const tagName = require('./tagName-f24f57ce.js');
 require('./inheritAttributes-ff9ad737.js');
 
 const headerLauncherCss = ":host{--tds-scrollbar-width-standard:thin;--tds-scrollbar-width:10px;--tds-scrollbar-height:10px;--tds-scrollbar-thumb-border-width:3px;--tds-scrollbar-thumb-border-hover-width:2px}body{scrollbar-width:thin}:host .wrapper{height:var(--tds-header-height);position:relative}:host .wrapper .menu{flex-direction:column;overflow-y:auto;max-height:calc(100vh - var(--tds-header-height));box-shadow:var(--tds-nav-dropdown-menu-box);background-color:var(--tds-header-app-launcher-menu-background);border-radius:0}:host .wrapper .menu:hover::-webkit-scrollbar-thumb{border:var(--tds-scrollbar-thumb-border-hover-width) solid transparent;background:var(--tds-scrollbar-hover-thumb-color);background-clip:padding-box}:host .wrapper .menu::-webkit-scrollbar{width:var(--tds-scrollbar-width)}:host .wrapper .menu::-webkit-scrollbar-track{background:var(--tds-scrollbar-track-color)}:host .wrapper .menu::-webkit-scrollbar-thumb{border-radius:40px;background:var(--tds-scrollbar-thumb-color);border:var(--tds-scrollbar-thumb-border-width) solid transparent;background-clip:padding-box}:host .wrapper .menu::-webkit-scrollbar-button{height:0;width:0}@supports not selector(::-webkit-scrollbar){:host .wrapper .menu{scrollbar-color:var(--tds-scrollbar-thumb-color) var(--tds-scrollbar-track-color);scrollbar-width:var(--tds-scrollbar-width-standard)}}@media all and (max-width: 384px){:host .wrapper .menu{width:100vw}}:host .wrapper.state-list-type-menu .menu{height:calc(100vh - var(--tds-header-height))}:host .wrapper.state-open .button{position:relative;z-index:901}";
@@ -33,17 +34,18 @@ const TdsHeaderLauncher = class {
         this.open = !this.open;
     }
     render() {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
         this.ariaAttributes = Object.assign(Object.assign({}, this.ariaAttributes), inheritAriaAttributes.inheritAriaAttributes(this.host, ['role']));
         const buttonAttributes = Object.assign(Object.assign({}, this.ariaAttributes), { 'aria-expanded': `${this.open}`, 'aria-controls': `launcher-${this.uuid}`, 'class': 'button', 'active': this.open, 'onClick': () => {
                 this.toggleLauncher();
             }, 'ref': (el) => {
                 this.buttonEl = el;
             } });
-        return (index.h(index.Host, { key: '28c3cec9d319219a00783f0743fc7e035b9b63f5' }, index.h("div", { key: 'a4372783a69578e1965bb14b2b3ad12e2752c472', class: {
+        return (index.h(index.Host, { key: '676852dc130a6ac9500239445c8eefc244aba92d' }, index.h("div", { key: '320336c1b9f9d4e152b4d0977caffaa0a212ec90', class: {
                 'wrapper': true,
                 'state-open': this.open,
                 'state-list-type-menu': this.hasListTypeMenu,
-            } }, index.h("tds-header-launcher-button", Object.assign({ key: 'cad014a13dcd193c0b829033d600c07a342a78cc' }, buttonAttributes)), this.buttonEl && (index.h("tds-popover-canvas", { key: '64c9c7e77f6e6825bd0ace40543e10c1444cb290', id: `tds-launcher-${this.uuid}`, class: "menu", referenceEl: this.buttonEl, placement: "bottom-start", show: this.open, offsetDistance: 0, modifiers: [
+            } }, index.h(prefixedTagNames.tdsHeaderLauncherButton, Object.assign({ key: 'e342ef3f5bc23a694186c1c729cef676dc8c7f1e' }, buttonAttributes)), this.buttonEl && (index.h(prefixedTagNames.tdsPopoverCanvas, { key: '3c49f19fcca97529596140f707625b3192ec7758', id: `tds-launcher-${this.uuid}`, class: "menu", referenceEl: this.buttonEl, placement: "bottom-start", show: this.open, offsetDistance: 0, modifiers: [
                 {
                     name: 'flip',
                     options: {

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

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
 
-const inlineTabCss = ":host{box-sizing:border-box;display:block;position:relative}: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);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:20px 4px}:host ::slotted(*:focus-visible)::before{content:\"\";position:absolute;left:0;right:0;top:20px;bottom:20px;outline:2px solid var(--tds-blue-400)}:host .inline-tab-item:not(.selected)::after{width:0%;transition:width 0.15s ease-in-out 0s}:host .inline-tab-item{position:relative;margin-right:32px}:host .inline-tab-item:hover{cursor:pointer}:host .inline-tab-item:hover::after{width:100%}:host .inline-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-inline-tabs-tab-indicator-background-hover);z-index:1}:host .selected ::slotted(*){color:var(--tds-inline-tabs-tab-color-selected)}:host .selected::after{width:100%;background-color:var(--tds-inline-tabs-tab-indicator-background-active)}:host .disabled{color:var(--tds-inline-tabs-tab-color-disabled)}:host .disabled ::slotted(*){opacity:var(--tds-inline-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 inlineTabCss = ":host{box-sizing:border-box;display:block;position:relative}: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);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:20px 4px}:host ::slotted(*:focus-visible)::before{content:\"\";position:absolute;left:0;right:0;top:20px;bottom:20px;outline:2px solid var(--tds-blue-400)}:host .inline-tab-item:not(.selected)::after{width:0%;transition:width 0.15s ease-in-out 0s}:host .inline-tab-item{position:relative;margin-right:32px}:host .inline-tab-item:hover{cursor:pointer}:host .inline-tab-item:hover::after{width:100%}:host .inline-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-inline-tabs-tab-indicator-background-hover);z-index:1}:host .selected ::slotted(*){color:var(--tds-inline-tabs-tab-color-selected)}:host .selected::after{width:100%;background-color:var(--tds-inline-tabs-tab-indicator-background-active)}:host .disabled{color:var(--tds-inline-tabs-tab-color-disabled)}:host .disabled ::slotted(*){opacity:var(--tds-inline-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 TdsInlineTabStyle0 = inlineTabCss;
 
 const TdsInlineTab = class {

package/dist/cjs/tds-inline-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 inlineTabsCss = ":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 inlineTabsCss = ":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 TdsInlineTabsStyle0 = inlineTabsCss;
 
 const TdsInlineTabs = class {
@@ -67,6 +68,7 @@ const TdsInlineTabs = class {
         this.modeVariant = 'primary';
         this.defaultSelectedIndex = 0;
         this.selectedIndex = undefined;
+        this.leftPadding = 32;
         this.showLeftScroll = false;
         this.showRightScroll = false;
     }
@@ -146,12 +148,18 @@ const TdsInlineTabs = 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();
@@ -167,9 +175,10 @@ const TdsInlineTabs = class {
         this.removeEventListenerFromTabs();
     }
     render() {
-        return (index.h(index.Host, { key: 'fdf1cc28637a8bd207c84aba91f60d145acd10c9', role: "list", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, index.h("div", { key: '068e21bac127323f56d858abf59c1f905a4ee315', class: "wrapper", ref: (el) => {
+        const prefixedTagNames = tagName.getPrefixedTagNames(this.host);
+        return (index.h(index.Host, { key: 'bc607732f1152e69199b3fca66efc4ebfd9683f7', role: "list", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, index.h("div", { key: 'ac41e6a7b6495c4ae9516a7e76e36f26be0b13d5', class: "wrapper", ref: (el) => {
                 this.navWrapperElement = el;
-            } }, index.h("button", { key: '646917420741478a9492cec16c066833d3e3266e', class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, index.h("tds-icon", { key: '939eb79ed238163057dcc8316f6efdec89262ff8', name: "chevron_left", size: "20px" })), index.h("slot", { key: 'f3306035cce33e3efb3e89ab4650c3781703f9e5', onSlotchange: () => this.handleSlotChange() }), index.h("button", { key: '6b2023939d94eb9f9822e25fd4facce715fdf227', class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, index.h("tds-icon", { key: '0b2626c78903ce14239891aa667a61ed913097ac', name: "chevron_right", size: "20px" })))));
+            }, style: { paddingLeft: `${this.leftPadding}px` } }, index.h("button", { key: '02979087fbd289a8959e63c3960aa34e431505bc', class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, index.h(prefixedTagNames.tdsIcon, { key: 'e60e28cd233f054cde23c03b21a98185f18c82c1', name: "chevron_left", size: "20px" })), index.h("slot", { key: '82a24bd27e62b3dc58457a0a4ed9ee8fa1c2a6f7', onSlotchange: () => this.handleSlotChange() }), index.h("button", { key: 'bea28e92a4cbe56d35106b399b8bc7734dc04290', class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, index.h(prefixedTagNames.tdsIcon, { key: '55317e5de61ad0ab7713852dc067e6f254d57988', name: "chevron_right", size: "20px" })))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {