@scania/tegel 1.24.0-value-prop.beta.6 → 1.25.0-config-for-china.beta.2

package/dist/components/{p-4030e9bc.js → p-6c2d5c85.js}

@@ -1,6 +1,7 @@
 import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-28ef5186.js';
-import { d as defineCustomElement$2 } from './p-d921fe75.js';
-import { d as defineCustomElement$1 } from './p-e323cd2a.js';
+import { a as convertToString } from './p-b1d21573.js';
+import { d as defineCustomElement$2 } from './p-eac79032.js';
+import { d as defineCustomElement$1 } from './p-ad77fb02.js';
 
 const dropdownOptionCss = ":host{box-sizing:border-box;display:block;background-color:var(--tds-dropdown-option-background)}:host *{box-sizing:border-box}:host .dropdown-option{color:var(--tds-dropdown-option-color);border-bottom:1px solid var(--tds-dropdown-option-border);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);overflow-wrap:anywhere;transition:background-color var(--tds-motion-duration-fast-02) var(--tds-motion-easing-scania)}:host .dropdown-option.selected{background-color:var(--tds-dropdown-option-background-selected)}:host .dropdown-option.disabled{color:var(--tds-dropdown-option-color-disabled)}:host .dropdown-option button:focus{outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host .dropdown-option button{all:unset;width:100%}:host .dropdown-option button.lg{padding:19px 0 20px}:host .dropdown-option button.md{padding:15px 0 16px}:host .dropdown-option button.sm{padding:11px 0 12px}:host .dropdown-option button.xs{padding:7px 0 8px}:host .dropdown-option button .single-select{display:flex;align-items:center;justify-content:space-between;padding:0 16px}:host .dropdown-option .multiselect{width:100%;height:100%}:host .dropdown-option .multiselect tds-checkbox{display:flex;height:100%;width:100%}:host .dropdown-option .multiselect tds-checkbox.lg{padding:15px 16px 16px}:host .dropdown-option .multiselect tds-checkbox.md{padding:11px 16px 12px}:host .dropdown-option .multiselect tds-checkbox.sm{padding:7px 16px 8px}:host .dropdown-option .multiselect tds-checkbox.xs{padding:7px 16px 8px}:host .dropdown-option:hover{background-color:var(--tds-dropdown-option-background-hover);cursor:pointer}:host .dropdown-option:hover.disabled{background-color:var(--tds-dropdown-option-background);cursor:not-allowed}:host([hidden]){display:none}";
 const TdsDropdownOptionStyle0 = dropdownOptionCss;
@@ -25,10 +26,10 @@ const TdsDropdownOption = /*@__PURE__*/ proxyCustomElement(class TdsDropdownOpti
         this.handleSingleSelect = () => {
             if (!this.disabled) {
                 this.selected = true;
-                this.parentElement.appendValue(this.value);
+                this.parentElement.appendValue(this.internalValue);
                 this.parentElement.close();
                 this.tdsSelect.emit({
-                    value: this.value,
+                    value: this.internalValue,
                     selected: this.selected,
                 });
             }
@@ -36,18 +37,18 @@ const TdsDropdownOption = /*@__PURE__*/ proxyCustomElement(class TdsDropdownOpti
         this.handleMultiselect = (event) => {
             if (!this.disabled) {
                 if (event.detail.checked) {
-                    this.parentElement.appendValue(this.value);
+                    this.parentElement.appendValue(this.internalValue);
                     this.selected = true;
                     this.tdsSelect.emit({
-                        value: this.value,
+                        value: this.internalValue,
                         selected: this.selected,
                     });
                 }
                 else {
-                    this.parentElement.removeValue(this.value);
+                    this.parentElement.removeValue(this.internalValue);
                     this.selected = false;
                     this.tdsSelect.emit({
-                        value: this.value,
+                        value: this.internalValue,
                         selected: this.selected,
                     });
                 }
@@ -61,6 +62,7 @@ const TdsDropdownOption = /*@__PURE__*/ proxyCustomElement(class TdsDropdownOpti
             this.tdsBlur.emit(event);
         };
         this.value = undefined;
+        this.internalValue = undefined;
         this.disabled = false;
         this.selected = false;
         this.multiselect = undefined;
@@ -70,8 +72,14 @@ const TdsDropdownOption = /*@__PURE__*/ proxyCustomElement(class TdsDropdownOpti
     async setSelected(selected) {
         this.selected = selected;
     }
+    valueWatcher(newValue) {
+        this.internalValue = convertToString(newValue);
+    }
+    componentWillLoad() {
+        this.internalValue = convertToString(this.value);
+    }
     render() {
-        return (h(Host, { key: '1cb00a19c5dbcc47e1b2bc97d1d5ccc8ac5a532a', role: "option", "aria-disabled": this.disabled, "aria-selected": this.selected }, h("div", { key: '5deaf44c7306f4b1856200bf0a5640e99fcb449d', class: `dropdown-option 
+        return (h(Host, { key: '5d13306d202a3c488fdd75daa3aa8cfc15e4b9cf', role: "option", "aria-disabled": this.disabled, "aria-selected": this.selected }, h("div", { key: 'df8b33467c49913853b2d86dff7115b6cea37f55', class: `dropdown-option 
           ${this.size}
           ${this.selected ? 'selected' : ''}
           ${this.disabled ? 'disabled' : ''}
@@ -89,14 +97,20 @@ const TdsDropdownOption = /*@__PURE__*/ proxyCustomElement(class TdsDropdownOpti
     }
     static get delegatesFocus() { return true; }
     get host() { return this; }
+    static get watchers() { return {
+        "value": ["valueWatcher"]
+    }; }
     static get style() { return TdsDropdownOptionStyle0; }
 }, [17, "tds-dropdown-option", {
-        "value": [1],
+        "value": [8],
         "disabled": [4],
+        "internalValue": [32],
         "selected": [32],
         "multiselect": [32],
         "size": [32],
         "setSelected": [64]
+    }, undefined, {
+        "value": ["valueWatcher"]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {

package/dist/components/{p-30de8ac4.js → p-707a562e.js}

@@ -10,7 +10,7 @@ const TdsCoreHeaderItem = /*@__PURE__*/ proxyCustomElement(class TdsCoreHeaderIt
         this.__attachShadow();
     }
     render() {
-        return (h(Host, { key: 'ef3825bce10e5d23e01b4be557014a5c90b8e7de' }, h("div", { key: '134696c5345b16dc15dc1940d7d42066597b3a4e', class: "item" }, h("slot", { key: '9e8fbe10a25cb6005d2ff03ce00adc5c6cdad495' }))));
+        return (h(Host, { key: 'a97f1ad7ef0398e2414f62374e69a738f8af8e18' }, h("div", { key: '3fd840c4cd4a7bd5bf27c3039c246f2faa085d51', class: "item" }, h("slot", { key: '5d521057588befd7509318ba5f053c6204e7344b' }))));
     }
     static get style() { return TdsCoreHeaderItemStyle0; }
 }, [1, "tds-core-header-item"]);

package/dist/components/{p-fcec766c.js → p-75437dea.js}

@@ -75,7 +75,7 @@ const TdsHeaderDropdownList = /*@__PURE__*/ proxyCustomElement(class TdsHeaderDr
             'role': 'list',
             'aria-labelledby': (_a = this.headingElement) === null || _a === void 0 ? void 0 : _a.id,
         };
-        return (h(Host, Object.assign({ key: '2ebed45f0b4d3b872378a1246180fc34f8ea46de' }, attributes), h("slot", { key: '5b72e5cab5c21fdaa55ca8641c729393ade09f75' })));
+        return (h(Host, Object.assign({ key: 'a5dd28fda0bbec3b9fdfa94b2170723ea93e646b' }, attributes), h("slot", { key: '8e196622a25da4f35e3dbcef8abf385d5723353c' })));
     }
     get host() { return this; }
     static get style() { return TdsHeaderDropdownListStyle0; }

package/dist/components/{p-e46088d9.js → p-8f8b0827.js}

@@ -11,7 +11,7 @@ const Divider = /*@__PURE__*/ proxyCustomElement(class Divider extends H {
         this.orientation = 'horizontal';
     }
     render() {
-        return (h(Host, { key: '52a57f6bab64f6329412bbab154f213864382e98', role: "separator", "aria-orientation": this.orientation === 'vertical' ? 'vertical' : undefined }, h("div", { key: '5ba2a5d20d84748b4b76e7ec24155f29cab69bc5', class: `divider ${this.orientation}` })));
+        return (h(Host, { key: 'a6195d6461fc6727d9e83c4152f446179160963f', role: "separator", "aria-orientation": this.orientation === 'vertical' ? 'vertical' : undefined }, h("div", { key: 'f1cf2f97534adfe809f8ddda734cfdbcecd7989a', class: `divider ${this.orientation}` })));
     }
     static get style() { return TdsDividerStyle0; }
 }, [1, "tds-divider", {

package/dist/components/{p-cfb1b588.js → p-9d7232d0.js}

@@ -12,10 +12,10 @@ const TdsHeaderDropdownListItem = /*@__PURE__*/ proxyCustomElement(class TdsHead
         this.size = 'md';
     }
     render() {
-        return (h(Host, { key: 'e884013f09151c5ba323ac69c34c88e8aba9d132' }, h("div", { key: 'e4babaebaac5f661b2ef365a120e9953d6535c73', class: {
+        return (h(Host, { key: 'e907df68566401506c20283daeeeabf1ebcaa7c8' }, h("div", { key: '5a784414662a0da44aeada1496801146606852df', class: {
                 'component': true,
                 'component-selected': this.selected,
-            } }, h("slot", { key: 'b58b6c84093c4edd303ee3ed202703f316cfcaa2' }))));
+            } }, h("slot", { key: 'a1027ad30124faea7cadbf48c07d3e5e021426f2' }))));
     }
     get host() { return this; }
     static get style() { return TdsHeaderDropdownListItemStyle0; }

package/dist/components/{p-e323cd2a.js → p-ad77fb02.js}

@@ -36,7 +36,7 @@ const Icon = /*@__PURE__*/ proxyCustomElement(class Icon extends H {
         this.arrayOfIcons = [...this.arrayOfIcons];
     }
     render() {
-        return h(Host, { key: '905914904d2afac05280f9daf9834b89aa3ec14f' }, this.setIcons());
+        return h(Host, { key: '06edf681e29edcaa43a7a276344f500bae1f9b71' }, this.setIcons());
     }
     static get style() { return TdsIconStyle0; }
 }, [1, "tds-icon", {

package/dist/components/p-b1d21573.js

@@ -0,0 +1,16 @@
+/**
+ * Converts a value (string or number) to string
+ * @param value - The value to convert
+ * @returns The string representation of the value, or empty string if null/undefined
+ */
+const convertToString = (value) => {
+    if (value === null || value === undefined)
+        return '';
+    return value.toString();
+};
+// Optional: If we need array conversion often
+const convertArrayToStrings = (values) => {
+    return values.map((value) => convertToString(value));
+};
+
+export { convertToString as a, convertArrayToStrings as c };

package/dist/components/{p-dddaa520.js → p-d1ace0be.js}

@@ -12,7 +12,7 @@ const TdsSideMenuUserImage = /*@__PURE__*/ proxyCustomElement(class TdsSideMenuU
         this.alt = undefined;
     }
     render() {
-        return (h(Host, { key: 'cd4bcc9ba4ce93b20e39ab0782136518a99899a3' }, h("slot", { key: '09bf0b847a54c03474e9d5dcaad8d0a5a347dbfc' }), this.src && h("img", { key: '8d74e3733d69ac50f4fe07557b91aec07aa74605', src: this.src, alt: this.alt })));
+        return (h(Host, { key: 'f52d600d147e4422c99883473c5453018135edc5' }, h("slot", { key: '1ecdae7d2a9d8a42a93c9b4e77ebf885c2308925' }), this.src && h("img", { key: 'c2efe65b3cb9102db3019d15ed54a8cbaecef877', src: this.src, alt: this.alt })));
     }
     static get style() { return TdsSideMenuUserImageStyle0; }
 }, [1, "tds-side-menu-user-image", {

package/dist/components/{p-d921fe75.js → p-eac79032.js}

@@ -57,11 +57,11 @@ const TdsCheckbox = /*@__PURE__*/ proxyCustomElement(class TdsCheckbox extends H
         }
     }
     render() {
-        return (h("div", { key: '068b73081ab2b1b24d58fd2afd70f2b0e4308745', class: "tds-checkbox" }, h("input", { key: '97bd225b10dea56b8166ce3d5c2e4569a7dc76f9',
+        return (h("div", { key: '1d0a8257cd1710277e076b4a277dff2c0c89b3d8', class: "tds-checkbox" }, h("input", { key: '689144e40c0be61db6b82aa6eaeb7ff3d09d7d72',
             // eslint-disable-next-line no-return-assign
             ref: (inputElement) => (this.inputElement = inputElement), indeterminate: this.indeterminate, "aria-checked": this.checked, "aria-required": this.required, "aria-describedby": this.host.getAttribute('aria-describedby'), "aria-labelledby": this.host.getAttribute('aria-labelledby'), required: this.required, type: "checkbox", name: this.name, value: this.value, id: this.checkboxId, checked: this.checked, disabled: this.disabled, onFocus: (event) => this.handleFocus(event), onBlur: (event) => this.handleBlur(event), onChange: () => {
                 this.handleChange();
-            } }), h("label", { key: '9cfe0411c9b26d12229de7fdb9421b333da0199c', htmlFor: this.checkboxId }, h("slot", { key: '17d2e45ddf05aa409926f3df82caab7a4f110b72', name: "label" }))));
+            } }), h("label", { key: '534eed7aa114861c528be0b776879484a35348bf', htmlFor: this.checkboxId }, h("slot", { key: 'db59bcc78f7f2be94037651b880a5ef149b90747', name: "label" }))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/{p-aea7fa6b.js → p-f0a50868.js}

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
 import { i as inheritAttributes } from './p-3fe9cbbf.js';
-import { d as defineCustomElement$1 } from './p-5e1a9abc.js';
+import { d as defineCustomElement$1 } from './p-3351035f.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 +31,12 @@ const TdsPopoverCanvas = /*@__PURE__*/ proxyCustomElement(class TdsPopoverCanvas
     }
     render() {
         var _a;
-        return (h(Host, { key: '13a6fe4800b9efc612ec21d20da5b2c2c9cdc2ce' }, h("tds-popover-core", Object.assign({ key: 'e3912733d09d6b7e5aa8bc2f5f6e87d828a2b07b' }, this.inheritedAttributes, { class: {
+        return (h(Host, { key: '6e23edc224b529194c9911295149528f284dd619' }, h("tds-popover-core", Object.assign({ key: '3a61648cb95b48a3972d8b953711254af918309a' }, 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;
-            }, defaultShow: this.defaultShow, animation: this.animation }), h("div", { key: '69bfa1b736a60777b578de6a0d4c4959c0a21781' }, h("slot", { key: '01776b37392ff7f23d35ff10fa647214d6567d1d' })))));
+            }, defaultShow: this.defaultShow, animation: this.animation }), h("div", { key: '6134b2a420449dd93c8fd14c6fc83b1e51e1922a' }, h("slot", { key: 'c805717c849fbc9c5933c4f7232c4edc22dc003d' })))));
     }
     get host() { return this; }
     static get style() { return TdsPopoverCanvasStyle0; }

package/dist/components/{p-8a2d7b2f.js → p-f1980746.js}

@@ -1,8 +1,8 @@
 import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
 import { i as inheritAriaAttributes } from './p-0bd4c19c.js';
-import { d as defineCustomElement$3 } from './p-30de8ac4.js';
-import { d as defineCustomElement$2 } from './p-0676aa23.js';
-import { d as defineCustomElement$1 } from './p-e323cd2a.js';
+import { d as defineCustomElement$3 } from './p-707a562e.js';
+import { d as defineCustomElement$2 } from './p-3a7f88ff.js';
+import { d as defineCustomElement$1 } from './p-ad77fb02.js';
 
 const headerLauncherButtonCss = ":host{display:block}:host tds-header-item{display:block}:host .icon{position:relative;margin-left:-6px;left:3px;transition:all 0.2s ease-in-out}";
 const TdsHeaderLauncherButtonStyle0 = headerLauncherButtonCss;
@@ -17,7 +17,7 @@ const TdsHeaderLauncherButton = /*@__PURE__*/ proxyCustomElement(class TdsHeader
     render() {
         this.ariaAttributes = Object.assign(Object.assign({}, this.ariaAttributes), inheritAriaAttributes(this.host));
         const buttonProps = Object.assign({}, this.ariaAttributes);
-        return (h(Host, { key: 'ee714e05a3585542850f433cd81ed25d95a14070' }, h("tds-header-item", { key: '0a7c7b20fa872c1ccd4e0760b9f68743ec6c761f', active: this.active }, h("button", Object.assign({ key: '1b0c93c04e5206dc47fe3df3a158e16ed624f8e1' }, buttonProps), h("tds-icon", { key: '11a961f7e11d741108a450ef1a2fa1b22f5520a8', class: "icon", name: "bento", size: "20px" })))));
+        return (h(Host, { key: 'ffe903179bae0b20240541dabc867ad291a88890' }, h("tds-header-item", { key: '4104afafab4e15d15e452e7d5b35bfa8b6911e4b', active: this.active }, h("button", Object.assign({ key: '1285f504631cb4606456beda892946bcd5da12c0' }, buttonProps), h("tds-icon", { key: '973233afc8d4e19df3cdcae48b770f8c5f46c7c7', class: "icon", name: "bento", size: "20px" })))));
     }
     get host() { return this; }
     static get style() { return TdsHeaderLauncherButtonStyle0; }

package/dist/components/tds-accordion-item.js

@@ -1,5 +1,6 @@
 import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-28ef5186.js';
-import { d as defineCustomElement$2 } from './p-e323cd2a.js';
+import { g as generateUniqueId } from './p-11648030.js';
+import { d as defineCustomElement$2 } from './p-ad77fb02.js';
 
 const accordionItemCss = ".tds-accordion-item{box-sizing:border-box;list-style:none;color:var(--tds-accordion-color);position:relative;border-top:1px solid var(--tds-accordion-border)}.tds-accordion-item *{box-sizing:border-box}.tds-accordion-item button.tds-accordion-header-icon-start,.tds-accordion-item button.tds-accordion-header-icon-end{all:unset}.tds-accordion-item .tds-accordion-header-icon-start,.tds-accordion-item .tds-accordion-header-icon-end,.tds-accordion-item button.tds-accordion-header-icon-start,.tds-accordion-item button.tds-accordion-header-icon-end{box-sizing:border-box;cursor:pointer;display:flex;align-items:center;width:100%;font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);padding:var(--tds-spacing-element-16);background-color:var(--tds-accordion-background)}.tds-accordion-item .tds-accordion-header-icon-start *,.tds-accordion-item .tds-accordion-header-icon-end *,.tds-accordion-item button.tds-accordion-header-icon-start *,.tds-accordion-item button.tds-accordion-header-icon-end *{box-sizing:border-box}.tds-accordion-item .tds-accordion-header-icon-start .tds-accordion-icon,.tds-accordion-item .tds-accordion-header-icon-end .tds-accordion-icon,.tds-accordion-item button.tds-accordion-header-icon-start .tds-accordion-icon,.tds-accordion-item button.tds-accordion-header-icon-end .tds-accordion-icon{transform-origin:center;transition:transform 0.15s ease-in-out;color:var(--tds-accordion-icon-color)}.tds-accordion-item .tds-accordion-header-icon-start .tds-accordion-icon>tds-icon,.tds-accordion-item .tds-accordion-header-icon-end .tds-accordion-icon>tds-icon,.tds-accordion-item button.tds-accordion-header-icon-start .tds-accordion-icon>tds-icon,.tds-accordion-item button.tds-accordion-header-icon-end .tds-accordion-icon>tds-icon{display:block}.tds-accordion-item .tds-accordion-title{flex-grow:2}.tds-accordion-item .tds-accordion-panel{cursor:default;padding:var(--tds-spacing-element-8) var(--tds-spacing-layout-64) var(--tds-spacing-element-32) var(--tds-spacing-element-16);display:none;font:var(--tds-detail-03);letter-spacing:var(--tds-detail-03-ls)}.tds-accordion-item .tds-accordion-panel p{margin:0;padding:0}.tds-accordion-item .tds-accordion-panel--padding-reset{padding-right:var(--tds-spacing-element-16)}.tds-accordion-item .tds-accordion-header-icon-end .tds-accordion-icon{margin:0 0 0 var(--tds-spacing-element-32)}.tds-accordion-item .tds-accordion-header-icon-start .tds-accordion-title{order:1}.tds-accordion-item .tds-accordion-header-icon-start .tds-accordion-icon{order:0;margin:0 var(--tds-spacing-element-16) 0 0}.tds-accordion-item.disabled,.tds-accordion-item.disabled .tds-accordion-header-icon-end,.tds-accordion-item.disabled .tds-accordion-header-icon-start,.tds-accordion-item.disabled .tds-accordion-panel{color:var(--tds-accordion-color-disabled);cursor:not-allowed}.tds-accordion-item.disabled .tds-accordion-icon,.tds-accordion-item.disabled .tds-accordion-header-icon-end .tds-accordion-icon,.tds-accordion-item.disabled .tds-accordion-header-icon-start .tds-accordion-icon,.tds-accordion-item.disabled .tds-accordion-panel .tds-accordion-icon{color:var(--tds-accordion-color-disabled)}.tds-accordion-item.disabled:hover,.tds-accordion-item.disabled:hover *,.tds-accordion-item.disabled:focus,.tds-accordion-item.disabled:focus *,.tds-accordion-item.disabled:active,.tds-accordion-item.disabled:active *,.tds-accordion-item.disabled.active,.tds-accordion-item.disabled.active *{cursor:not-allowed}.tds-accordion-item.disabled:hover .tds-accordion-header-icon-start,.tds-accordion-item.disabled:hover .tds-accordion-header-icon-end,.tds-accordion-item.disabled:focus .tds-accordion-header-icon-start,.tds-accordion-item.disabled:focus .tds-accordion-header-icon-end,.tds-accordion-item.disabled:active .tds-accordion-header-icon-start,.tds-accordion-item.disabled:active .tds-accordion-header-icon-end,.tds-accordion-item.disabled.active .tds-accordion-header-icon-start,.tds-accordion-item.disabled.active .tds-accordion-header-icon-end{background-color:var(--tds-accordion-bg);outline:none;pointer-events:none}.tds-accordion-item.disabled:hover .tds-accordion-header-icon-start::after,.tds-accordion-item.disabled:hover .tds-accordion-header-icon-end::after,.tds-accordion-item.disabled:focus .tds-accordion-header-icon-start::after,.tds-accordion-item.disabled:focus .tds-accordion-header-icon-end::after,.tds-accordion-item.disabled:active .tds-accordion-header-icon-start::after,.tds-accordion-item.disabled:active .tds-accordion-header-icon-end::after,.tds-accordion-item.disabled.active .tds-accordion-header-icon-start::after,.tds-accordion-item.disabled.active .tds-accordion-header-icon-end::after{border-color:transparent}.tds-accordion-item.expanded .tds-accordion-panel{display:block;padding-bottom:31px}.tds-accordion-item.expanded .tds-accordion-icon{transform:rotate(180deg)}.tds-accordion-item.expanded .tds-accordion-header-icon-end .tds-accordion-icon{margin-right:0;margin-left:var(--tds-spacing-element-32)}.tds-accordion-item.expanded .tds-accordion-header-icon-start .tds-accordion-icon{margin-left:0;margin-right:var(--tds-spacing-element-16)}.tds-accordion-item:focus{border-top:1px solid var(--tds-accordion-border-focus)}.tds-accordion-item[disabled=true]:focus{border-color:var(--tds-accordion-border)}:host(:focus) .tds-accordion-item{outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host(:focus) .tds-accordion-item .tds-accordion-header-icon-start,:host(:focus) .tds-accordion-item .tds-accordion-header-icon-end{background-color:var(--tds-accordion-background-focus);outline:none}:host(:hover) .tds-accordion-header-icon-start,:host(:hover) .tds-accordion-header-icon-end{background-color:var(--tds-accordion-background-hover)}:host(:active) .tds-accordion-header-icon-start,:host(:active) .tds-accordion-header-icon-end{background-color:var(--tds-accordion-background-active);outline:none}";
 const TdsAccordionItemStyle0 = accordionItemCss;
@@ -15,10 +16,10 @@ const TdsAccordionItem$1 = /*@__PURE__*/ proxyCustomElement(class TdsAccordionIt
         this.disabled = false;
         this.expanded = false;
         this.paddingReset = false;
+        this.ariaLevelValue = '6';
     }
     /** Method for toggling the expanded state of the Accordion Item. */
     async toggleAccordionItem() {
-        // This is negated in order to emit the value the Accordion Item will have after it has expanded/redacted.
         const event = this.tdsToggle.emit({
             expanded: !this.expanded,
         });
@@ -27,12 +28,14 @@ const TdsAccordionItem$1 = /*@__PURE__*/ proxyCustomElement(class TdsAccordionIt
         }
     }
     render() {
-        return (h(Host, { key: '628336db584f9488762b6073af5fc05b18a064bd' }, h("div", { key: '15807da09f006149732d53a7f9aab2f86be788cd', class: `tds-accordion-item
+        const primaryElementId = generateUniqueId();
+        const secondaryElementId = generateUniqueId();
+        return (h(Host, { key: 'b2935bb09e2114c8a87f50964bffdd07211ee201' }, h("div", { key: '50db384c5c5a6e8761df5f2d0637838bcd3ca1da', class: `tds-accordion-item
         ${this.disabled ? 'disabled' : ''}
         ${this.expanded ? 'expanded' : ''}
-        ` }, h("button", { key: 'f2f5941332be588effc795862d4136077b51122e', type: "button", "aria-expanded": this.expanded, class: `tds-accordion-header-icon-${this.expandIconPosition}`, onClick: () => this.toggleAccordionItem(), disabled: this.disabled }, h("div", { key: '3cfa2d6066875270211f75879effd48b88932ce8', class: "tds-accordion-title" }, this.header, h("slot", { key: '3c5cb389c8df24b1cb0cd20bfcb3c0b1154d3e38', name: "header" })), h("div", { key: 'a6a8189fc018d2629989165b3bb49ab111318628', class: "tds-accordion-icon" }, h("tds-icon", { key: 'a7cf540846b381a4925a754ea7b915c7df5d1208', name: "chevron_down", size: "16px" }))), h("div", { key: 'd3eb2219f67e69c54f55428950b976ba282845dc', class: `tds-accordion-panel
+        ` }, h("div", { key: '4b8f4b7b615139c0c73fc6b705d342eb41b6e6ba', role: "heading", "aria-level": this.ariaLevelValue }, h("button", { key: 'e581244d09226e154f6a4042ec120364a61c861b', id: secondaryElementId, "aria-controls": primaryElementId, type: "button", "aria-expanded": this.expanded ? 'true' : 'false', "aria-disabled": this.disabled, class: `tds-accordion-header-icon-${this.expandIconPosition}`, onClick: () => this.toggleAccordionItem(), disabled: this.disabled }, h("div", { key: '3e380f7dc892022cbacc75e05a11e6e9e2b078ea', class: "tds-accordion-title" }, this.header, h("slot", { key: '465dc1763ed8a1c587b3d3ea7a9467f2dab56a2b', name: "header" })), h("div", { key: 'd1c0d053e936d2750e693b3aa665098491f59ec0', class: "tds-accordion-icon" }, h("tds-icon", { key: 'fd33161591b663d8e33f2a62922d8594cf7290e1', svgTitle: "Chevron Down", name: "chevron_down", size: "16px" })))), h("div", { key: '8103ea48538f990461b3ad0e01b70584b47726d1', role: "region", "aria-live": "polite", "aria-labelledby": secondaryElementId, id: primaryElementId, class: `tds-accordion-panel
             ${this.paddingReset ? 'tds-accordion-panel--padding-reset ' : ''}
-            ` }, h("slot", { key: '21625afeae6b8342aaa7d56c05ed965c29cc709d' })))));
+            ` }, h("slot", { key: '14af4c914f6935c4efdc0e79e7ce05d4a11efea4' })))));
     }
     static get style() { return TdsAccordionItemStyle0; }
 }, [1, "tds-accordion-item", {
@@ -41,6 +44,7 @@ const TdsAccordionItem$1 = /*@__PURE__*/ proxyCustomElement(class TdsAccordionIt
         "disabled": [4],
         "expanded": [4],
         "paddingReset": [4, "padding-reset"],
+        "ariaLevelValue": [1, "aria-level-value"],
         "toggleAccordionItem": [64]
     }]);
 function defineCustomElement$1() {

package/dist/components/tds-badge.js

@@ -35,7 +35,12 @@ const TdsBadge$1 = /*@__PURE__*/ proxyCustomElement(class TdsBadge extends H {
         }
     }
     render() {
-        return (h("host", { key: 'edf6347da9742ae8353a33fa1613c0dd9170357b', class: `tds-badge tds-badge-${this.size} ${this.shape === 'pill' ? 'tds-badge-pill' : ''} ${this.hidden ? 'tds-badge-hidden' : ''}` }, h("div", { key: '223c0b81e4de5e790daa011481bc45d7565e5cfc', class: "tds-badge-text" }, this.text)));
+        return (h("host", { key: '4e3c33d01ed9a0da06dd45f6cbb7e3ff55837f65', class: {
+                'tds-badge': true,
+                [`tds-badge-${this.size}`]: true,
+                'tds-badge-pill': this.shape === 'pill',
+                'tds-badge-hidden': this.hidden,
+            } }, h("div", { key: '3a1966458cc39041221082096ef70efc3fd13d9f', class: "tds-badge-text" }, this.text)));
     }
     static get watchers() { return {
         "value": ["watchProps"],

package/dist/components/tds-banner.js

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-28ef5186.js';
 import { g as generateUniqueId } from './p-11648030.js';
 import { h as hasSlot } from './p-ae110fc2.js';
-import { d as defineCustomElement$2 } from './p-e323cd2a.js';
+import { d as defineCustomElement$2 } from './p-ad77fb02.js';
 
 const bannerCss = ":host(.hide){display:none;visibility:hidden}:host(.error){background-color:var(--tds-banner-background-error)}:host(.information){background-color:var(--tds-banner-background-info)}:host{display:flex;background-color:var(--tds-banner-background-default);z-index:400;padding-left:16px}:host .banner-icon{padding-left:4px;padding-top:14px;padding-right:12px;color:var(--tds-banner-prefix-default-color)}:host .banner-icon.error{color:var(--tds-banner-prefix-error-color)}:host .banner-icon.information{color:var(--tds-banner-prefix-info-color)}:host .content{color:var(--tds-banner-text-color);display:flex;flex-direction:column;flex-grow:1;padding:16px 0}:host .content.no-icon{padding-left:16px}:host .header-subheader{display:flex;flex-direction:column;gap:4px}:host .header,:host slot[name=header]{font:var(--tds-headline-06);letter-spacing:var(--tds-headline-06-ls)}:host .subheader,:host slot[name=subheader]{display:block;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls)}:host slot[name=actions]::slotted(*){display:block;width:fit-content;margin-top:16px}:host .banner-close{color:var(--tds-banner-x-color)}:host .banner-close button{padding-right:16px;padding-top:14px;background-color:transparent;border:none;color:var(--tds-banner-x-color)}:host .banner-close button:hover{cursor:pointer}:host .banner-close button:focus-visible{outline:none}:host .banner-close button:focus-visible tds-icon{outline:2px solid var(--tds-blue-400);outline-offset:-2px}";
 const TdsBannerStyle0 = bannerCss;
@@ -26,6 +26,7 @@ const TdsBanner$1 = /*@__PURE__*/ proxyCustomElement(class TdsBanner extends H {
         this.variant = 'default';
         this.bannerId = generateUniqueId();
         this.hidden = false;
+        this.roleType = 'banner';
     }
     /** Hides the Banner. */
     async hideBanner() {
@@ -47,9 +48,11 @@ const TdsBanner$1 = /*@__PURE__*/ proxyCustomElement(class TdsBanner extends H {
         const usesHeaderSlot = hasSlot('subheader', this.host);
         const usesSubheaderSlot = hasSlot('subheader', this.host);
         const usesActionsSlot = hasSlot('actions', this.host);
-        return (h(Host, { key: 'cce608e8685f68d432cb3e2dd847a1919d7fac17', role: "banner", "aria-hidden": `${this.hidden}`, "aria-live": this.host.getAttribute('aria-live') ? this.host.getAttribute('aria-live') : 'polite', "aria-atomic": this.host.getAttribute('aria-atomic'), class: `${this.variant} ${this.hidden ? 'hide' : 'show'}` }, this.icon && (h("div", { key: '45c455342ea61eadf0090a98a67e4137499cc9db', class: `banner-icon ${this.variant}` }, h("tds-icon", { key: 'c503d90c8abdf3d794c5ea4744acf4bf726d9b68', name: this.icon, size: "20px" }))), h("div", { key: '0b625094274021007e5ebb2a13ad74037e2bcce9', class: "content" }, h("div", { key: '957b3928258ad7640cedec4c5882b7db5d5c5362', class: "header-subheader" }, this.header && h("div", { key: 'b4c2221163bd72d05300766cecad13081c631f3f', class: "header" }, this.header), usesHeaderSlot && h("slot", { key: '70329f3c96268ccac2a82ff5f2a35619abaea25e', name: "header" }), this.subheader && h("div", { key: '922b918a9fb308dbe367e2409db1807ff2fcb736', class: "subheader" }, this.subheader), usesSubheaderSlot && h("slot", { key: '8ce26997a04b5d8a7607b06980c556a69a400740', name: "subheader" })), usesActionsSlot && h("slot", { key: '6e7e450a48e1c3aa4765b6049789b273a740c3ba', name: "actions" })), h("div", { key: 'e644385a339db3f121be9ae2c23eb4875194291a', class: `banner-close` }, h("button", { key: 'a172a6f4fb35a64c5f0002b9c73740c413c39c12', onClick: () => {
-                this.handleClose();
-            } }, h("tds-icon", { key: 'da9b83b7c7538b431f919c7e13265d28fde1e39f', name: "cross", size: "20px" })))));
+        return (h(Host, { key: '75cdf09f84a1dac7638a4788eb48c46bca25df4e', role: this.roleType, "aria-hidden": `${this.hidden}`, "aria-live": this.roleType === 'alert' ? 'assertive' : 'polite', "aria-atomic": this.host.getAttribute('aria-atomic'), class: {
+                [this.variant]: true,
+                hide: this.hidden,
+                show: !this.hidden,
+            } }, this.icon && (h("div", { key: 'fbc4f8da1b9ff964b676644167543cdbee176f42', class: `banner-icon ${this.variant}` }, h("tds-icon", { key: '26030bb557b9577084a54e2ef890138a2e77a798', name: this.icon, size: "20px", svgTitle: this.icon }))), h("div", { key: '94b8134ce4407f3a1190e35948d030734d76d7e5', class: "content" }, h("div", { key: '4352ab96dfa32e26bc99b0f0c7fec0393c15d784', class: "header-subheader" }, this.header && h("div", { key: 'c31647bdaaeccc5209630da0e20024d1b93f55e9', class: "header" }, this.header), usesHeaderSlot && h("slot", { key: 'ad0ab42576026a5d563559150197bf2fcb6de0e0', name: "header" }), this.subheader && h("div", { key: '20c64e0e58e582d8c5a2cb384c73176864ad650f', class: "subheader" }, this.subheader), usesSubheaderSlot && h("slot", { key: 'b43635b5d0c36e54562676f57f2296290d04e087', name: "subheader" })), usesActionsSlot && h("slot", { key: '37613fb7d8b745aac05b9878f2e2c195bcca6453', name: "actions" })), h("div", { key: '670d386ded1892d4db0e462b4a34a9de7a559d89', class: `banner-close` }, h("button", { key: 'bacd3ab747cbdfbcc61732b13385506e17691ab6', "aria-label": "Close banner", onClick: this.handleClose }, h("tds-icon", { key: '7e508cf4500350cc74e24fa7338b98134560ce31', name: "cross", size: "20px", svgTitle: "Close" })))));
     }
     get host() { return this; }
     static get style() { return TdsBannerStyle0; }
@@ -60,6 +63,7 @@ const TdsBanner$1 = /*@__PURE__*/ proxyCustomElement(class TdsBanner extends H {
         "variant": [1],
         "bannerId": [1, "banner-id"],
         "hidden": [516],
+        "roleType": [1, "role-type"],
         "hideBanner": [64],
         "showBanner": [64]
     }]);

package/dist/components/tds-block.js

@@ -23,12 +23,16 @@ const TdsBlock$1 = /*@__PURE__*/ proxyCustomElement(class TdsBlock extends H {
     }
     render() {
         const nestingLevel = this.getNestingLevel();
-        const evenOddClass = this.modeVariant === null
-            ? nestingLevel % 2 === 0
-                ? 'tds-block-even'
-                : 'tds-block-odd'
-            : '';
-        return (h("div", { key: '5f22f1b8ae254a577a151563deadd969e90e3d20', class: `tds-block ${evenOddClass} ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("slot", { key: '52367d3055296ebd2b6e8291786554f34253750f' })));
+        let evenOddClass = '';
+        if (this.modeVariant === null) {
+            if (nestingLevel % 2 === 0) {
+                evenOddClass = 'tds-block-even';
+            }
+            else {
+                evenOddClass = 'tds-block-odd';
+            }
+        }
+        return (h("div", { key: 'efd570de70b5c6a313c3334b718cb201c4946251', class: `tds-block ${evenOddClass} ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("slot", { key: '56f2673bc4ae6c6801c52caf465d1bbcf27d8514' })));
     }
     get host() { return this; }
     static get style() { return TdsBlockStyle0; }

package/dist/components/tds-body-cell.js

@@ -60,13 +60,16 @@ const TdsTableBodyCell = /*@__PURE__*/ proxyCustomElement(class TdsTableBodyCell
         }
     }
     connectedCallback() {
+        var _a;
         this.tableEl = this.host.closest('tds-table');
-        this.tableId = this.tableEl.tableId;
+        this.tableId = (_a = this.tableEl) === null || _a === void 0 ? void 0 : _a.tableId;
     }
     componentWillLoad() {
-        relevantTableProps.forEach((tablePropName) => {
-            this[tablePropName] = this.tableEl[tablePropName];
-        });
+        if (this.tableEl) {
+            relevantTableProps.forEach((tablePropName) => {
+                this[tablePropName] = this.tableEl[tablePropName];
+            });
+        }
         if (this.textAlign) {
             this.textAlignState = this.textAlign;
         }
@@ -84,13 +87,13 @@ const TdsTableBodyCell = /*@__PURE__*/ proxyCustomElement(class TdsTableBodyCell
             // Conditionally set padding style
             padding: paddingStyle,
         };
-        return (h(Host, { key: '30e53ca949c66ba4499463aa9e4710b48a5c6a2b', class: {
+        return (h(Host, { key: '8a4beee29a06e1d8adc6f6baa8a8cd8707277b9a', class: {
                 'tds-table__body-cell': true,
                 'tds-table__body-cell--hover': this.activeSorting,
                 'tds-table__compact': this.compactDesign,
                 'tds-table--divider': this.verticalDividers,
                 'tds-table--no-min-width': this.noMinWidth,
-            }, style: dynamicStyles }, this.cellValue, h("slot", { key: '800cc9978517c7486b87b603e3cff2d576e9a3fc' })));
+            }, style: dynamicStyles }, this.cellValue, h("slot", { key: 'a21e51a9fdd21294c1226286f8ef8feb4bc93af6' })));
     }
     get host() { return this; }
     static get style() { return TdsBodyCellStyle0; }

package/dist/components/tds-breadcrumb.js

@@ -11,7 +11,7 @@ const TdsBreadcrumb$1 = /*@__PURE__*/ proxyCustomElement(class TdsBreadcrumb ext
         this.current = false;
     }
     render() {
-        return (h("div", { key: '5b1576c613720b9964419b572999e5a01bc1b835', role: "listitem", class: `${this.current ? 'current' : ''}` }, h("slot", { key: '7f298648fe0596e6ae099facdc5cb6e1439496f6' })));
+        return (h("div", { key: '459fcc2d9467e9793d3f5273ea14cc2758fdbc0f', role: "listitem", class: `${this.current ? 'current' : ''}` }, h("slot", { key: '6009cb6b16b769c975e069b1f4ee171a48711497' })));
     }
     static get style() { return TdsBreadcrumbStyle0; }
 }, [1, "tds-breadcrumb", {

package/dist/components/tds-breadcrumbs.js

@@ -12,7 +12,7 @@ const TdsBreadcrumbs$1 = /*@__PURE__*/ proxyCustomElement(class TdsBreadcrumbs e
     render() {
         var _a;
         (_a = this.host.children[this.host.children.length - 1]) === null || _a === void 0 ? void 0 : _a.classList.add('last');
-        return (h("nav", { key: '3f11a51e2918aadfeebe11c6254264f807dcb919' }, h("div", { key: 'de74067b415ca8a3b46f230840cb3ca18d81fbb1', role: "list", class: 'tds-breadcrumb' }, h("slot", { key: '81fa5a70cba9e85c7c567193bb035e0d338f97fd' }))));
+        return (h("nav", { key: '919f59903df9c43f62053efef7a630cb0d8983b1' }, h("div", { key: '6cfd5afea42e7b8c7c1b9da8bc336ba76a56089c', role: "list", class: 'tds-breadcrumb' }, h("slot", { key: '30754525f3de22a9e0fbf74352f52b9ec15cb88c' }))));
     }
     get host() { return this; }
     static get style() { return TdsBreadcrumbsStyle0; }

package/dist/components/tds-button.js

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
 import { h as hasSlot } from './p-ae110fc2.js';
 
-const buttonCss = ".sc-tds-button:root,.tds-mode-light.sc-tds-button{--tds-btn-primary-background:var(--tds-blue-600);--tds-btn-primary-color:var(--tds-white);--tds-btn-primary-border-color:transparent;--tds-btn-primary-background-hover:var(--tds-blue-500);--tds-btn-primary-color-hover:var(--tds-white);--tds-btn-primary-border-color-hover:transparent;--tds-btn-primary-background-active:var(--tds-blue-700);--tds-btn-primary-color-active:var(--tds-white);--tds-btn-primary-border-color-active:var(--tds-blue-700);--tds-btn-primary-background-focus:var(--tds-blue-400);--tds-btn-primary-color-focus:var(--tds-white);--tds-btn-primary-border-color-focus:var(--tds-blue-600);--tds-btn-primary-outline-color-focus:var(--tds-blue-600);--tds-btn-primary-background-disabled-primary:var(--tds-grey-50);--tds-btn-primary-background-disabled-secondary:var(--tds-white);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-primary);--tds-btn-primary-color-disabled:var(--tds-grey-400);--tds-btn-primary-border-color-disabled:transparent;--tds-btn-icon-primary-fill:var(--tds-grey-50);--tds-btn-icon-primary-color:var(--tds-grey-50);--tds-btn-secondary-background:transparent;--tds-btn-secondary-color:var(--tds-black);--tds-btn-secondary-border-color:var(--tds-black-48);--tds-btn-secondary-background-hover:var(--tds-blue-500);--tds-btn-secondary-color-hover:var(--tds-white);--tds-btn-secondary-border-color-hover:var(--tds-blue-500);--tds-btn-secondary-background-active:transparent;--tds-btn-secondary-color-active:var(--tds-black);--tds-btn-secondary-border-color-active:var(--tds-black-87);--tds-btn-secondary-background-focus:transparent;--tds-btn-secondary-color-focus:var(--tds-black);--tds-btn-secondary-border-color-focus:var(--tds-blue-400);--tds-btn-secondary-outline-color:var(--tds-black-38);--tds-btn-secondary-outline-color-focus:var(--tds-blue-400);--tds-btn-secondary-background-disabled:transparent;--tds-btn-secondary-color-disabled:var(--tds-black-38);--tds-btn-secondary-border-color-disabled:var(--tds-black-38);--tds-btn-icon-secondary-color-focus:var(--tds-black);--tds-btn-icon-secondary-fill-focus:var(--tds-black);--tds-btn-icon-secondary-fill-active:var(--tds-grey-958);--tds-btn-icon-secondary-fill:var(--tds-grey-958);--tds-btn-icon-secondary-color:var(--tds-grey-958);--tds-btn-icon-secondary-fill-hover:var(--tds-grey-50);--tds-btn-icon-secondary-color-hover:var(--tds-grey-50);--tds-btn-icon-secondary-color-active:var(--tds-grey-958);--tds-btn-ghost-background:transparent;--tds-btn-ghost-color:var(--tds-black);--tds-btn-ghost-border-color:transparent;--tds-btn-ghost-background-hover:transparent;--tds-btn-ghost-color-hover:var(--tds-black);--tds-btn-ghost-border-color-hover:var(--tds-black-48);--tds-btn-ghost-outline-color-hover:var(--tds-black-48);--tds-btn-ghost-background-active:transparent;--tds-btn-ghost-color-active:var(--tds-black);--tds-btn-ghost-border-color-active:var(--tds-black-87);--tds-btn-ghost-background-focus:transparent;--tds-btn-ghost-color-focus:var(--tds-black);--tds-btn-ghost-border-color-focus:var(--tds-blue-400);--tds-btn-ghost-outline-color-focus:var(--tds-blue-400);--tds-btn-ghost-background-disabled:transparent;--tds-btn-ghost-color-disabled:var(--tds-black-38);--tds-btn-ghost-border-color-disabled:transparent;--tds-btn-icon-ghost-fill:var(--tds-grey-958);--tds-btn-icon-ghost-color:var(--tds-grey-958);--tds-btn-danger-background:var(--tds-negative);--tds-btn-danger-color:var(--tds-white);--tds-btn-danger-border-color:transparent;--tds-btn-danger-background-hover:var(--tds-red-600);--tds-btn-danger-color-hover:var(--tds-white);--tds-btn-danger-border-color-hover:transparent;--tds-btn-danger-background-active:var(--tds-red-700);--tds-btn-danger-color-active:var(--tds-white);--tds-btn-danger-border-color-active:var(--tds-red-700);--tds-btn-danger-background-focus:var(--tds-red-400);--tds-btn-danger-color-focus:var(--tds-white);--tds-btn-danger-border-color-focus:var(--tds-red-400);--tds-btn-danger-outline-color-focus:var(--tds-red-700);--tds-btn-danger-background-disabled-primary:var(--tds-grey-50);--tds-btn-danger-background-disabled-secondary:var(--tds-white);--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-primary);--tds-btn-danger-color-disabled:var(--tds-black-38);--tds-btn-danger-border-color-disabled:transparent;--tds-btn-icon-danger-fill:var(--tds-grey-50);--tds-btn-icon-danger-color:var(--tds-grey-50)}.sc-tds-button:root .tds-mode-variant-primary.sc-tds-button,.tds-mode-light.sc-tds-button .tds-mode-variant-primary.sc-tds-button{--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-primary);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-primary)}.sc-tds-button:root .tds-mode-variant-secondary.sc-tds-button,.tds-mode-light.sc-tds-button .tds-mode-variant-secondary.sc-tds-button{--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-secondary);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-secondary)}.tds-mode-dark.sc-tds-button{--tds-btn-primary-background:var(--tds-blue-400);--tds-btn-primary-background-hover:var(--tds-blue-500);--tds-btn-primary-background-active:var(--tds-blue-300);--tds-btn-primary-background-focus:var(--tds-blue-600);--tds-btn-primary-border-color-focus:var(--tds-blue-400);--tds-btn-primary-outline-color-focus:var(--tds-blue-400);--tds-btn-primary-background-disabled-primary:var(--tds-grey-900);--tds-btn-primary-background-disabled-secondary:var(--tds-grey-868);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-primary);--tds-btn-primary-color-disabled:var(--tds-white-38);--tds-btn-icon-primary-fill:var(--tds-grey-50);--tds-btn-icon-primary-color:var(--tds-grey-50);--tds-btn-secondary-background:transparent;--tds-btn-secondary-color:var(--tds-white);--tds-btn-secondary-border-color:var(--tds-white-48);--tds-btn-secondary-background-hover:var(--tds-blue-500);--tds-btn-secondary-color-hover:var(--tds-white);--tds-btn-secondary-border-color-hover:var(--tds-blue-500);--tds-btn-secondary-background-active:transparent;--tds-btn-secondary-color-active:var(--tds-white);--tds-btn-secondary-border-color-active:var(--tds-white-87);--tds-btn-secondary-background-focus:transparent;--tds-btn-secondary-color-focus:var(--tds-white);--tds-btn-secondary-border-color-focus:var(--tds-blue-400);--tds-btn-secondary-outline-color-focus:var(--tds-blue-400);--tds-btn-secondary-outline-color:var(--tds-white);--tds-btn-secondary-background-disabled:transparent;--tds-btn-secondary-color-disabled:var(--tds-white-38);--tds-btn-secondary-border-color-disabled:var(--tds-white-38);--tds-btn-icon-secondary-color-focus:var(--tds-white);--tds-btn-icon-secondary-fill-focus:var(--tds-white);--tds-btn-icon-secondary-fill:var(--tds-grey-50);--tds-btn-icon-secondary-color:var(--tds-grey-50);--tds-btn-ghost-background:transparent;--tds-btn-ghost-color:var(--tds-white);--tds-btn-ghost-border-color:transparent;--tds-btn-ghost-background-hover:transparent;--tds-btn-ghost-color-hover:var(--tds-white);--tds-btn-ghost-border-color-hover:var(--tds-white-48);--tds-btn-ghost-outline-color-hover:var(--tds-white-48);--tds-btn-ghost-background-active:transparent;--tds-btn-ghost-color-active:var(--tds-white);--tds-btn-ghost-border-color-active:var(--tds-white-87);--tds-btn-ghost-background-focus:transparent;--tds-btn-ghost-color-focus:var(--tds-white);--tds-btn-ghost-border-color-focus:var(--tds-blue-300);--tds-btn-ghost-outline-color-focus:var(--tds-blue-300);--tds-btn-ghost-background-disabled:transparent;--tds-btn-ghost-color-disabled:var(--tds-white-38);--tds-btn-ghost-border-color-disabled:transparent;--tds-btn-icon-ghost-fill:var(--tds-grey-50);--tds-btn-icon-ghost-color:var(--tds-grey-50);--tds-btn-danger-background:var(--tds-negative);--tds-btn-danger-color:var(--tds-white);--tds-btn-danger-border-color:transparent;--tds-btn-danger-background-hover:var(--tds-red-600);--tds-btn-danger-color-hover:var(--tds-white);--tds-btn-danger-border-color-hover:transparent;--tds-btn-danger-background-active:var(--tds-red-700);--tds-btn-danger-color-active:var(--tds-white);--tds-btn-danger-border-color-active:transparent;--tds-btn-danger-background-focus:var(--tds-red-400);--tds-btn-danger-color-focus:var(--tds-white);--tds-btn-danger-border-color-focus:var(--tds-red-400);--tds-btn-danger-outline-color-focus:var(--tds-red-700);--tds-btn-danger-background-disabled-primary:var(--tds-grey-900);--tds-btn-danger-background-disabled-secondary:var(--tds-grey-868);--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-primary);--tds-btn-danger-color-disabled:var(--tds-white-38);--tds-btn-danger-border-color-disabled:transparent;--tds-btn-icon-danger-fill:var(--tds-white);--tds-btn-icon-danger-color:var(--tds-white)}.tds-mode-dark.sc-tds-button .tds-mode-variant-primary.sc-tds-button{--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-primary);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-primary)}.tds-mode-dark.sc-tds-button .tds-mode-variant-secondary.sc-tds-button{--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-secondary);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-secondary)}button.sc-tds-button{box-sizing:border-box;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);display:inline-flex;align-items:center;border-radius:4px;border:none;box-shadow:none;position:relative;text-decoration:none;cursor:pointer;height:56px;padding:var(--tds-spacing-element-20);border:1px solid}button.sc-tds-button *.sc-tds-button{box-sizing:border-box}button.sc-tds-button:focus{outline:none}button.sc-tds-button:focus-visible{outline:2px solid var(--tds-blue-400);outline-offset:-2px}button.xs.sc-tds-button{padding:var(--tds-spacing-element-4) var(--tds-spacing-element-8);height:24px;font-size:12px;border-radius:2px}button.sm.sc-tds-button{padding:var(--tds-spacing-element-12);height:40px}button.sm.icon.sc-tds-button{padding:10px var(--tds-spacing-element-12)}button.sm.only-icon.sc-tds-button{padding:11px}button.md.sc-tds-button{padding:var(--tds-spacing-element-16);height:48px}button.md.icon.sc-tds-button{padding:14px var(--tds-spacing-element-16)}button.md.only-icon.sc-tds-button{padding:13px}button.lg.sc-tds-button{padding:var(--tds-spacing-element-20);height:56px}button.lg.icon.sc-tds-button{padding:18px var(--tds-spacing-element-20)}button.lg.only-icon.sc-tds-button{padding:17px}button.fullbleed.sc-tds-button{width:100%;display:flex;justify-content:center}button.animation-fade.sc-tds-button{transition:background-color var(--tds-motion-duration-fast-02) var(--tds-motion-easing-scania)}button.primary.sc-tds-button{background:var(--tds-btn-primary-background);border-color:var(--tds-btn-primary-border-color);color:var(--tds-btn-primary-color);outline-color:var(--tds-btn-primary-outline-color)}button.primary.icon.sc-tds-button{fill:var(--tds-btn-icon-primary-fill);color:var(--tds-btn-icon-primary-fill);fill:var(--tds-btn-icon-primary-color);color:var(--tds-btn-icon-primary-color)}button.primary.sc-tds-button:hover{background:var(--tds-btn-primary-background-hover);border-color:var(--tds-btn-primary-border-color-hover);color:var(--tds-btn-primary-color-hover);outline-color:var(--tds-btn-primary-outline-color-hover)}button.primary:hover:not(.disabled).sc-tds-button-s>[slot=icon],button.primary:hover:not(.disabled) .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-primary-fill-hover);color:var(--tds-btn-icon-primary-fill-hover);fill:var(--tds-btn-icon-primary-color-hover);color:var(--tds-btn-icon-primary-color-hover)}button.primary.sc-tds-button:focus-visible{background:var(--tds-btn-primary-background-focus);border-color:var(--tds-btn-primary-border-color-focus);color:var(--tds-btn-primary-color-focus);outline-color:var(--tds-btn-primary-outline-color-focus)}button.primary:focus-visible.sc-tds-button-s>[slot=icon],button.primary:focus-visible .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-primary-fill-focus);color:var(--tds-btn-icon-primary-fill-focus);fill:var(--tds-btn-icon-primary-color-focus);color:var(--tds-btn-icon-primary-color-focus)}button.primary.sc-tds-button:active,button.primary.active.sc-tds-button{background:var(--tds-btn-primary-background-active);border-color:var(--tds-btn-primary-border-color-active);color:var(--tds-btn-primary-color-active);outline-color:var(--tds-btn-primary-outline-color-active)}button.primary:active:not(.disabled).sc-tds-button-s>[slot=icon],button.primary:active:not(.disabled) .sc-tds-button-s>[slot=icon],button.primary.active:not(.disabled).sc-tds-button-s>[slot=icon],button.primary.active:not(.disabled) .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-primary-fill-active);color:var(--tds-btn-icon-primary-fill-active);fill:var(--tds-btn-icon-primary-color-active);color:var(--tds-btn-icon-primary-color-active)}button.primary.disabled.sc-tds-button,button.primary.sc-tds-button:disabled{background:var(--tds-btn-primary-background-disabled);border-color:var(--tds-btn-primary-border-color-disabled);color:var(--tds-btn-primary-color-disabled);outline-color:var(--tds-btn-primary-outline-color-disabled)}button.secondary.sc-tds-button{background:var(--tds-btn-secondary-background);border-color:var(--tds-btn-secondary-border-color);color:var(--tds-btn-secondary-color);outline-color:var(--tds-btn-secondary-outline-color)}button.secondary.icon.sc-tds-button{fill:var(--tds-btn-icon-secondary-fill);color:var(--tds-btn-icon-secondary-fill);fill:var(--tds-btn-icon-secondary-color);color:var(--tds-btn-icon-secondary-color)}button.secondary.sc-tds-button:hover{background:var(--tds-btn-secondary-background-hover);border-color:var(--tds-btn-secondary-border-color-hover);color:var(--tds-btn-secondary-color-hover);outline-color:var(--tds-btn-secondary-outline-color-hover)}button.secondary:hover:not(.disabled).sc-tds-button-s>[slot=icon],button.secondary:hover:not(.disabled) .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-secondary-fill-hover);color:var(--tds-btn-icon-secondary-fill-hover);fill:var(--tds-btn-icon-secondary-color-hover);color:var(--tds-btn-icon-secondary-color-hover)}button.secondary.sc-tds-button:focus-visible{background:var(--tds-btn-secondary-background-focus);border-color:var(--tds-btn-secondary-border-color-focus);color:var(--tds-btn-secondary-color-focus);outline-color:var(--tds-btn-secondary-outline-color-focus)}button.secondary:focus-visible.sc-tds-button-s>[slot=icon],button.secondary:focus-visible .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-secondary-fill-focus);color:var(--tds-btn-icon-secondary-fill-focus);fill:var(--tds-btn-icon-secondary-color-focus);color:var(--tds-btn-icon-secondary-color-focus)}button.secondary.sc-tds-button:active,button.secondary.active.sc-tds-button{background:var(--tds-btn-secondary-background-active);border-color:var(--tds-btn-secondary-border-color-active);color:var(--tds-btn-secondary-color-active);outline-color:var(--tds-btn-secondary-outline-color-active)}button.secondary:active:not(.disabled).sc-tds-button-s>[slot=icon],button.secondary:active:not(.disabled) .sc-tds-button-s>[slot=icon],button.secondary.active:not(.disabled).sc-tds-button-s>[slot=icon],button.secondary.active:not(.disabled) .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-secondary-fill-active);color:var(--tds-btn-icon-secondary-fill-active);fill:var(--tds-btn-icon-secondary-color-active);color:var(--tds-btn-icon-secondary-color-active)}button.secondary.disabled.sc-tds-button,button.secondary.sc-tds-button:disabled{background:var(--tds-btn-secondary-background-disabled);border-color:var(--tds-btn-secondary-border-color-disabled);color:var(--tds-btn-secondary-color-disabled);outline-color:var(--tds-btn-secondary-outline-color-disabled)}button.ghost.sc-tds-button{background:var(--tds-btn-ghost-background);border-color:var(--tds-btn-ghost-border-color);color:var(--tds-btn-ghost-color);outline-color:var(--tds-btn-ghost-outline-color)}button.ghost.icon.sc-tds-button{fill:var(--tds-btn-icon-ghost-fill);color:var(--tds-btn-icon-ghost-fill);fill:var(--tds-btn-icon-ghost-color);color:var(--tds-btn-icon-ghost-color)}button.ghost.sc-tds-button:hover{background:var(--tds-btn-ghost-background-hover);border-color:var(--tds-btn-ghost-border-color-hover);color:var(--tds-btn-ghost-color-hover);outline-color:var(--tds-btn-ghost-outline-color-hover)}button.ghost:hover:not(.disabled).sc-tds-button-s>[slot=icon],button.ghost:hover:not(.disabled) .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-ghost-fill-hover);color:var(--tds-btn-icon-ghost-fill-hover);fill:var(--tds-btn-icon-ghost-color-hover);color:var(--tds-btn-icon-ghost-color-hover)}button.ghost.sc-tds-button:focus-visible{background:var(--tds-btn-ghost-background-focus);border-color:var(--tds-btn-ghost-border-color-focus);color:var(--tds-btn-ghost-color-focus);outline-color:var(--tds-btn-ghost-outline-color-focus)}button.ghost:focus-visible.sc-tds-button-s>[slot=icon],button.ghost:focus-visible .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-ghost-fill-focus);color:var(--tds-btn-icon-ghost-fill-focus);fill:var(--tds-btn-icon-ghost-color-focus);color:var(--tds-btn-icon-ghost-color-focus)}button.ghost.sc-tds-button:active,button.ghost.active.sc-tds-button{background:var(--tds-btn-ghost-background-active);border-color:var(--tds-btn-ghost-border-color-active);color:var(--tds-btn-ghost-color-active);outline-color:var(--tds-btn-ghost-outline-color-active)}button.ghost:active:not(.disabled).sc-tds-button-s>[slot=icon],button.ghost:active:not(.disabled) .sc-tds-button-s>[slot=icon],button.ghost.active:not(.disabled).sc-tds-button-s>[slot=icon],button.ghost.active:not(.disabled) .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-ghost-fill-active);color:var(--tds-btn-icon-ghost-fill-active);fill:var(--tds-btn-icon-ghost-color-active);color:var(--tds-btn-icon-ghost-color-active)}button.ghost.disabled.sc-tds-button,button.ghost.sc-tds-button:disabled{background:var(--tds-btn-ghost-background-disabled);border-color:var(--tds-btn-ghost-border-color-disabled);color:var(--tds-btn-ghost-color-disabled);outline-color:var(--tds-btn-ghost-outline-color-disabled)}button.danger.sc-tds-button{background:var(--tds-btn-danger-background);border-color:var(--tds-btn-danger-border-color);color:var(--tds-btn-danger-color);outline-color:var(--tds-btn-danger-outline-color)}button.danger.icon.sc-tds-button{fill:var(--tds-btn-icon-danger-fill);color:var(--tds-btn-icon-danger-fill);fill:var(--tds-btn-icon-danger-color);color:var(--tds-btn-icon-danger-color)}button.danger.sc-tds-button:hover{background:var(--tds-btn-danger-background-hover);border-color:var(--tds-btn-danger-border-color-hover);color:var(--tds-btn-danger-color-hover);outline-color:var(--tds-btn-danger-outline-color-hover)}button.danger:hover:not(.disabled).sc-tds-button-s>[slot=icon],button.danger:hover:not(.disabled) .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-danger-fill-hover);color:var(--tds-btn-icon-danger-fill-hover);fill:var(--tds-btn-icon-danger-color-hover);color:var(--tds-btn-icon-danger-color-hover)}button.danger.sc-tds-button:focus-visible{background:var(--tds-btn-danger-background-focus);border-color:var(--tds-btn-danger-border-color-focus);color:var(--tds-btn-danger-color-focus);outline-color:var(--tds-btn-danger-outline-color-focus)}button.danger:focus-visible.sc-tds-button-s>[slot=icon],button.danger:focus-visible .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-danger-fill-focus);color:var(--tds-btn-icon-danger-fill-focus);fill:var(--tds-btn-icon-danger-color-focus);color:var(--tds-btn-icon-danger-color-focus)}button.danger.sc-tds-button:active,button.danger.active.sc-tds-button{background:var(--tds-btn-danger-background-active);border-color:var(--tds-btn-danger-border-color-active);color:var(--tds-btn-danger-color-active);outline-color:var(--tds-btn-danger-outline-color-active)}button.danger:active:not(.disabled).sc-tds-button-s>[slot=icon],button.danger:active:not(.disabled) .sc-tds-button-s>[slot=icon],button.danger.active:not(.disabled).sc-tds-button-s>[slot=icon],button.danger.active:not(.disabled) .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-danger-fill-active);color:var(--tds-btn-icon-danger-fill-active);fill:var(--tds-btn-icon-danger-color-active);color:var(--tds-btn-icon-danger-color-active)}button.danger.disabled.sc-tds-button,button.danger.sc-tds-button:disabled{background:var(--tds-btn-danger-background-disabled);border-color:var(--tds-btn-danger-border-color-disabled);color:var(--tds-btn-danger-color-disabled);outline-color:var(--tds-btn-danger-outline-color-disabled)}tds-button.sc-tds-button-h{display:inline-flex;align-items:center}.sc-tds-button-htds-button.sc-tds-button-s>[slot=icon],.sc-tds-button-htds-button .sc-tds-button-s>[slot=icon]{width:var(--tds-spacing-element-20);height:var(--tds-spacing-element-20)}.sc-tds-button-htds-button .sm.sc-tds-button-s>[slot=icon],.sc-tds-button-htds-button .sm .sc-tds-button-s>[slot=icon]{width:var(--tds-spacing-element-16);height:var(--tds-spacing-element-16)}[disabled].sc-tds-button-h:active{pointer-events:none}[disabled].sc-tds-button-h button.sc-tds-button{cursor:not-allowed}tds-button[fullbleed].sc-tds-button-h{width:100%;justify-content:center}tds-button.sc-tds-button button.sc-tds-button{display:inline-flex;align-items:center}tds-button button.sm.sc-tds-button-s>[slot=icon]{margin-left:var(--tds-spacing-element-12);width:var(--tds-spacing-element-16);height:var(--tds-spacing-element-16)}tds-button button.md.sc-tds-button-s>[slot=icon]{margin-left:var(--tds-spacing-element-16);width:var(--tds-spacing-element-20);height:var(--tds-spacing-element-20)}tds-button button.lg.sc-tds-button-s>[slot=icon]{margin-left:var(--tds-spacing-element-20);width:var(--tds-spacing-element-20);height:var(--tds-spacing-element-20)}tds-button button.only-icon.sc-tds-button-s>[slot=icon]{margin-left:0}";
+const buttonCss = ".sc-tds-button:root,.tds-mode-light.sc-tds-button{--tds-btn-primary-background:var(--tds-blue-600);--tds-btn-primary-color:var(--tds-white);--tds-btn-primary-border-color:transparent;--tds-btn-primary-background-hover:var(--tds-blue-500);--tds-btn-primary-color-hover:var(--tds-white);--tds-btn-primary-border-color-hover:transparent;--tds-btn-primary-background-active:var(--tds-blue-700);--tds-btn-primary-color-active:var(--tds-white);--tds-btn-primary-border-color-active:var(--tds-blue-700);--tds-btn-primary-background-focus:var(--tds-blue-400);--tds-btn-primary-color-focus:var(--tds-white);--tds-btn-primary-border-color-focus:var(--tds-blue-600);--tds-btn-primary-outline-color-focus:var(--tds-blue-600);--tds-btn-primary-background-disabled-primary:var(--tds-grey-50);--tds-btn-primary-background-disabled-secondary:var(--tds-white);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-primary);--tds-btn-primary-color-disabled:var(--tds-grey-400);--tds-btn-primary-border-color-disabled:transparent;--tds-btn-icon-primary-fill:var(--tds-grey-50);--tds-btn-icon-primary-color:var(--tds-grey-50);--tds-btn-secondary-background:transparent;--tds-btn-secondary-color:var(--tds-black);--tds-btn-secondary-border-color:var(--tds-black-48);--tds-btn-secondary-background-hover:var(--tds-blue-500);--tds-btn-secondary-color-hover:var(--tds-white);--tds-btn-secondary-border-color-hover:var(--tds-blue-500);--tds-btn-secondary-background-active:transparent;--tds-btn-secondary-color-active:var(--tds-black);--tds-btn-secondary-border-color-active:var(--tds-black-87);--tds-btn-secondary-background-focus:transparent;--tds-btn-secondary-color-focus:var(--tds-black);--tds-btn-secondary-border-color-focus:var(--tds-blue-400);--tds-btn-secondary-outline-color:var(--tds-black-38);--tds-btn-secondary-outline-color-focus:var(--tds-blue-400);--tds-btn-secondary-background-disabled:transparent;--tds-btn-secondary-color-disabled:var(--tds-black-38);--tds-btn-secondary-border-color-disabled:var(--tds-black-38);--tds-btn-icon-secondary-color-focus:var(--tds-black);--tds-btn-icon-secondary-fill-focus:var(--tds-black);--tds-btn-icon-secondary-fill-active:var(--tds-grey-958);--tds-btn-icon-secondary-fill:var(--tds-grey-958);--tds-btn-icon-secondary-color:var(--tds-grey-958);--tds-btn-icon-secondary-fill-hover:var(--tds-grey-50);--tds-btn-icon-secondary-color-hover:var(--tds-grey-50);--tds-btn-icon-secondary-color-active:var(--tds-grey-958);--tds-btn-ghost-background:transparent;--tds-btn-ghost-color:var(--tds-black);--tds-btn-ghost-border-color:transparent;--tds-btn-ghost-background-hover:transparent;--tds-btn-ghost-color-hover:var(--tds-black);--tds-btn-ghost-border-color-hover:var(--tds-black-48);--tds-btn-ghost-outline-color-hover:var(--tds-black-48);--tds-btn-ghost-background-active:transparent;--tds-btn-ghost-color-active:var(--tds-black);--tds-btn-ghost-border-color-active:var(--tds-black-87);--tds-btn-ghost-background-focus:transparent;--tds-btn-ghost-color-focus:var(--tds-black);--tds-btn-ghost-border-color-focus:var(--tds-blue-400);--tds-btn-ghost-outline-color-focus:var(--tds-blue-400);--tds-btn-ghost-background-disabled:transparent;--tds-btn-ghost-color-disabled:var(--tds-black-38);--tds-btn-ghost-border-color-disabled:transparent;--tds-btn-icon-ghost-fill:var(--tds-grey-958);--tds-btn-icon-ghost-color:var(--tds-grey-958);--tds-btn-danger-background:var(--tds-negative);--tds-btn-danger-color:var(--tds-white);--tds-btn-danger-border-color:transparent;--tds-btn-danger-background-hover:var(--tds-red-600);--tds-btn-danger-color-hover:var(--tds-white);--tds-btn-danger-border-color-hover:transparent;--tds-btn-danger-background-active:var(--tds-red-700);--tds-btn-danger-color-active:var(--tds-white);--tds-btn-danger-border-color-active:var(--tds-red-700);--tds-btn-danger-background-focus:var(--tds-red-400);--tds-btn-danger-color-focus:var(--tds-white);--tds-btn-danger-border-color-focus:var(--tds-red-400);--tds-btn-danger-outline-color-focus:var(--tds-red-700);--tds-btn-danger-background-disabled-primary:var(--tds-grey-50);--tds-btn-danger-background-disabled-secondary:var(--tds-white);--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-primary);--tds-btn-danger-color-disabled:var(--tds-black-38);--tds-btn-danger-border-color-disabled:transparent;--tds-btn-icon-danger-fill:var(--tds-grey-50);--tds-btn-icon-danger-color:var(--tds-grey-50)}.sc-tds-button:root .tds-mode-variant-primary.sc-tds-button,.tds-mode-light.sc-tds-button .tds-mode-variant-primary.sc-tds-button{--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-primary);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-primary)}.sc-tds-button:root .tds-mode-variant-secondary.sc-tds-button,.tds-mode-light.sc-tds-button .tds-mode-variant-secondary.sc-tds-button{--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-secondary);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-secondary)}.tds-mode-dark.sc-tds-button{--tds-btn-primary-background:var(--tds-blue-400);--tds-btn-primary-background-hover:var(--tds-blue-500);--tds-btn-primary-background-active:var(--tds-blue-300);--tds-btn-primary-background-focus:var(--tds-blue-600);--tds-btn-primary-border-color-focus:var(--tds-blue-400);--tds-btn-primary-outline-color-focus:var(--tds-blue-400);--tds-btn-primary-background-disabled-primary:var(--tds-grey-900);--tds-btn-primary-background-disabled-secondary:var(--tds-grey-868);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-primary);--tds-btn-primary-color-disabled:var(--tds-white-38);--tds-btn-icon-primary-fill:var(--tds-grey-50);--tds-btn-icon-primary-color:var(--tds-grey-50);--tds-btn-secondary-background:transparent;--tds-btn-secondary-color:var(--tds-white);--tds-btn-secondary-border-color:var(--tds-white-48);--tds-btn-secondary-background-hover:var(--tds-blue-500);--tds-btn-secondary-color-hover:var(--tds-white);--tds-btn-secondary-border-color-hover:var(--tds-blue-500);--tds-btn-secondary-background-active:transparent;--tds-btn-secondary-color-active:var(--tds-white);--tds-btn-secondary-border-color-active:var(--tds-white-87);--tds-btn-secondary-background-focus:transparent;--tds-btn-secondary-color-focus:var(--tds-white);--tds-btn-secondary-border-color-focus:var(--tds-blue-400);--tds-btn-secondary-outline-color-focus:var(--tds-blue-400);--tds-btn-secondary-outline-color:var(--tds-white);--tds-btn-secondary-background-disabled:transparent;--tds-btn-secondary-color-disabled:var(--tds-white-38);--tds-btn-secondary-border-color-disabled:var(--tds-white-38);--tds-btn-icon-secondary-color-focus:var(--tds-white);--tds-btn-icon-secondary-fill-focus:var(--tds-white);--tds-btn-icon-secondary-fill:var(--tds-grey-50);--tds-btn-icon-secondary-color:var(--tds-grey-50);--tds-btn-ghost-background:transparent;--tds-btn-ghost-color:var(--tds-white);--tds-btn-ghost-border-color:transparent;--tds-btn-ghost-background-hover:transparent;--tds-btn-ghost-color-hover:var(--tds-white);--tds-btn-ghost-border-color-hover:var(--tds-white-48);--tds-btn-ghost-outline-color-hover:var(--tds-white-48);--tds-btn-ghost-background-active:transparent;--tds-btn-ghost-color-active:var(--tds-white);--tds-btn-ghost-border-color-active:var(--tds-white-87);--tds-btn-ghost-background-focus:transparent;--tds-btn-ghost-color-focus:var(--tds-white);--tds-btn-ghost-border-color-focus:var(--tds-blue-300);--tds-btn-ghost-outline-color-focus:var(--tds-blue-300);--tds-btn-ghost-background-disabled:transparent;--tds-btn-ghost-color-disabled:var(--tds-white-38);--tds-btn-ghost-border-color-disabled:transparent;--tds-btn-icon-ghost-fill:var(--tds-grey-50);--tds-btn-icon-ghost-color:var(--tds-grey-50);--tds-btn-danger-background:var(--tds-negative);--tds-btn-danger-color:var(--tds-white);--tds-btn-danger-border-color:transparent;--tds-btn-danger-background-hover:var(--tds-red-600);--tds-btn-danger-color-hover:var(--tds-white);--tds-btn-danger-border-color-hover:transparent;--tds-btn-danger-background-active:var(--tds-red-700);--tds-btn-danger-color-active:var(--tds-white);--tds-btn-danger-border-color-active:transparent;--tds-btn-danger-background-focus:var(--tds-red-400);--tds-btn-danger-color-focus:var(--tds-white);--tds-btn-danger-border-color-focus:var(--tds-red-400);--tds-btn-danger-outline-color-focus:var(--tds-red-700);--tds-btn-danger-background-disabled-primary:var(--tds-grey-900);--tds-btn-danger-background-disabled-secondary:var(--tds-grey-868);--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-primary);--tds-btn-danger-color-disabled:var(--tds-white-38);--tds-btn-danger-border-color-disabled:transparent;--tds-btn-icon-danger-fill:var(--tds-white);--tds-btn-icon-danger-color:var(--tds-white)}.tds-mode-dark.sc-tds-button .tds-mode-variant-primary.sc-tds-button{--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-primary);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-primary)}.tds-mode-dark.sc-tds-button .tds-mode-variant-secondary.sc-tds-button{--tds-btn-danger-background-disabled:var(--tds-btn-danger-background-disabled-secondary);--tds-btn-primary-background-disabled:var(--tds-btn-primary-background-disabled-secondary)}button.sc-tds-button{box-sizing:border-box;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);display:inline-flex;align-items:center;border-radius:4px;border:none;box-shadow:none;position:relative;text-decoration:none;cursor:pointer;height:56px;padding:var(--tds-spacing-element-20);border:1px solid}button.sc-tds-button *.sc-tds-button{box-sizing:border-box}button.sc-tds-button:focus{outline:none}button.sc-tds-button:focus-visible{outline:2px solid var(--tds-blue-400);outline-offset:-2px}button.xs.sc-tds-button{padding:var(--tds-spacing-element-4) var(--tds-spacing-element-8);height:24px;font-size:12px;border-radius:2px}button.sm.sc-tds-button{padding:var(--tds-spacing-element-12);height:40px}button.sm.icon.sc-tds-button{padding:10px var(--tds-spacing-element-12)}button.sm.only-icon.sc-tds-button{padding:11px}button.md.sc-tds-button{padding:var(--tds-spacing-element-16);height:48px}button.md.icon.sc-tds-button{padding:14px var(--tds-spacing-element-16)}button.md.only-icon.sc-tds-button{padding:13px}button.lg.sc-tds-button{padding:var(--tds-spacing-element-20);height:56px}button.lg.icon.sc-tds-button{padding:18px var(--tds-spacing-element-20)}button.lg.only-icon.sc-tds-button{padding:17px}button.fullbleed.sc-tds-button{width:100%;display:flex;justify-content:center}button.animation-fade.sc-tds-button{transition:background-color var(--tds-motion-duration-fast-02) var(--tds-motion-easing-scania)}button.primary.sc-tds-button{background:var(--tds-btn-primary-background);border-color:var(--tds-btn-primary-border-color);color:var(--tds-btn-primary-color);outline-color:var(--tds-btn-primary-outline-color)}button.primary.icon.sc-tds-button{fill:var(--tds-btn-icon-primary-fill);color:var(--tds-btn-icon-primary-fill);fill:var(--tds-btn-icon-primary-color);color:var(--tds-btn-icon-primary-color)}button.primary.sc-tds-button:hover{background:var(--tds-btn-primary-background-hover);border-color:var(--tds-btn-primary-border-color-hover);color:var(--tds-btn-primary-color-hover);outline-color:var(--tds-btn-primary-outline-color-hover)}button.primary:hover:not(.disabled).sc-tds-button-s>[slot=icon],button.primary:hover:not(.disabled) .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-primary-fill-hover);color:var(--tds-btn-icon-primary-fill-hover);fill:var(--tds-btn-icon-primary-color-hover);color:var(--tds-btn-icon-primary-color-hover)}button.primary.sc-tds-button:focus-visible{background:var(--tds-btn-primary-background-focus);border-color:var(--tds-btn-primary-border-color-focus);color:var(--tds-btn-primary-color-focus);outline-color:var(--tds-btn-primary-outline-color-focus)}button.primary:focus-visible.sc-tds-button-s>[slot=icon],button.primary:focus-visible .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-primary-fill-focus);color:var(--tds-btn-icon-primary-fill-focus);fill:var(--tds-btn-icon-primary-color-focus);color:var(--tds-btn-icon-primary-color-focus)}button.primary.sc-tds-button:active,button.primary.active.sc-tds-button{background:var(--tds-btn-primary-background-active);border-color:var(--tds-btn-primary-border-color-active);color:var(--tds-btn-primary-color-active);outline-color:var(--tds-btn-primary-outline-color-active)}button.primary:active:not(.disabled).sc-tds-button-s>[slot=icon],button.primary:active:not(.disabled) .sc-tds-button-s>[slot=icon],button.primary.active:not(.disabled).sc-tds-button-s>[slot=icon],button.primary.active:not(.disabled) .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-primary-fill-active);color:var(--tds-btn-icon-primary-fill-active);fill:var(--tds-btn-icon-primary-color-active);color:var(--tds-btn-icon-primary-color-active)}button.primary.disabled.sc-tds-button,button.primary.sc-tds-button:disabled{background:var(--tds-btn-primary-background-disabled);border-color:var(--tds-btn-primary-border-color-disabled);color:var(--tds-btn-primary-color-disabled);outline-color:var(--tds-btn-primary-outline-color-disabled)}button.secondary.sc-tds-button{background:var(--tds-btn-secondary-background);border-color:var(--tds-btn-secondary-border-color);color:var(--tds-btn-secondary-color);outline-color:var(--tds-btn-secondary-outline-color)}button.secondary.icon.sc-tds-button{fill:var(--tds-btn-icon-secondary-fill);color:var(--tds-btn-icon-secondary-fill);fill:var(--tds-btn-icon-secondary-color);color:var(--tds-btn-icon-secondary-color)}button.secondary.sc-tds-button:hover{background:var(--tds-btn-secondary-background-hover);border-color:var(--tds-btn-secondary-border-color-hover);color:var(--tds-btn-secondary-color-hover);outline-color:var(--tds-btn-secondary-outline-color-hover)}button.secondary:hover:not(.disabled).sc-tds-button-s>[slot=icon],button.secondary:hover:not(.disabled) .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-secondary-fill-hover);color:var(--tds-btn-icon-secondary-fill-hover);fill:var(--tds-btn-icon-secondary-color-hover);color:var(--tds-btn-icon-secondary-color-hover)}button.secondary.sc-tds-button:focus-visible{background:var(--tds-btn-secondary-background-focus);border-color:var(--tds-btn-secondary-border-color-focus);color:var(--tds-btn-secondary-color-focus);outline-color:var(--tds-btn-secondary-outline-color-focus)}button.secondary:focus-visible.sc-tds-button-s>[slot=icon],button.secondary:focus-visible .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-secondary-fill-focus);color:var(--tds-btn-icon-secondary-fill-focus);fill:var(--tds-btn-icon-secondary-color-focus);color:var(--tds-btn-icon-secondary-color-focus)}button.secondary.sc-tds-button:active,button.secondary.active.sc-tds-button{background:var(--tds-btn-secondary-background-active);border-color:var(--tds-btn-secondary-border-color-active);color:var(--tds-btn-secondary-color-active);outline-color:var(--tds-btn-secondary-outline-color-active)}button.secondary:active:not(.disabled).sc-tds-button-s>[slot=icon],button.secondary:active:not(.disabled) .sc-tds-button-s>[slot=icon],button.secondary.active:not(.disabled).sc-tds-button-s>[slot=icon],button.secondary.active:not(.disabled) .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-secondary-fill-active);color:var(--tds-btn-icon-secondary-fill-active);fill:var(--tds-btn-icon-secondary-color-active);color:var(--tds-btn-icon-secondary-color-active)}button.secondary.disabled.sc-tds-button,button.secondary.sc-tds-button:disabled{background:var(--tds-btn-secondary-background-disabled);border-color:var(--tds-btn-secondary-border-color-disabled);color:var(--tds-btn-secondary-color-disabled);outline-color:var(--tds-btn-secondary-outline-color-disabled)}button.ghost.sc-tds-button{background:var(--tds-btn-ghost-background);border-color:var(--tds-btn-ghost-border-color);color:var(--tds-btn-ghost-color);outline-color:var(--tds-btn-ghost-outline-color)}button.ghost.icon.sc-tds-button{fill:var(--tds-btn-icon-ghost-fill);color:var(--tds-btn-icon-ghost-fill);fill:var(--tds-btn-icon-ghost-color);color:var(--tds-btn-icon-ghost-color)}button.ghost.sc-tds-button:hover{background:var(--tds-btn-ghost-background-hover);border-color:var(--tds-btn-ghost-border-color-hover);color:var(--tds-btn-ghost-color-hover);outline-color:var(--tds-btn-ghost-outline-color-hover)}button.ghost:hover:not(.disabled).sc-tds-button-s>[slot=icon],button.ghost:hover:not(.disabled) .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-ghost-fill-hover);color:var(--tds-btn-icon-ghost-fill-hover);fill:var(--tds-btn-icon-ghost-color-hover);color:var(--tds-btn-icon-ghost-color-hover)}button.ghost.sc-tds-button:focus-visible{background:var(--tds-btn-ghost-background-focus);border-color:var(--tds-btn-ghost-border-color-focus);color:var(--tds-btn-ghost-color-focus);outline-color:var(--tds-btn-ghost-outline-color-focus)}button.ghost:focus-visible.sc-tds-button-s>[slot=icon],button.ghost:focus-visible .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-ghost-fill-focus);color:var(--tds-btn-icon-ghost-fill-focus);fill:var(--tds-btn-icon-ghost-color-focus);color:var(--tds-btn-icon-ghost-color-focus)}button.ghost.sc-tds-button:active,button.ghost.active.sc-tds-button{background:var(--tds-btn-ghost-background-active);border-color:var(--tds-btn-ghost-border-color-active);color:var(--tds-btn-ghost-color-active);outline-color:var(--tds-btn-ghost-outline-color-active)}button.ghost:active:not(.disabled).sc-tds-button-s>[slot=icon],button.ghost:active:not(.disabled) .sc-tds-button-s>[slot=icon],button.ghost.active:not(.disabled).sc-tds-button-s>[slot=icon],button.ghost.active:not(.disabled) .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-ghost-fill-active);color:var(--tds-btn-icon-ghost-fill-active);fill:var(--tds-btn-icon-ghost-color-active);color:var(--tds-btn-icon-ghost-color-active)}button.ghost.disabled.sc-tds-button,button.ghost.sc-tds-button:disabled{background:var(--tds-btn-ghost-background-disabled);border-color:var(--tds-btn-ghost-border-color-disabled);color:var(--tds-btn-ghost-color-disabled);outline-color:var(--tds-btn-ghost-outline-color-disabled)}button.danger.sc-tds-button{background:var(--tds-btn-danger-background);border-color:var(--tds-btn-danger-border-color);color:var(--tds-btn-danger-color);outline-color:var(--tds-btn-danger-outline-color)}button.danger.icon.sc-tds-button{fill:var(--tds-btn-icon-danger-fill);color:var(--tds-btn-icon-danger-fill);fill:var(--tds-btn-icon-danger-color);color:var(--tds-btn-icon-danger-color)}button.danger.sc-tds-button:hover{background:var(--tds-btn-danger-background-hover);border-color:var(--tds-btn-danger-border-color-hover);color:var(--tds-btn-danger-color-hover);outline-color:var(--tds-btn-danger-outline-color-hover)}button.danger:hover:not(.disabled).sc-tds-button-s>[slot=icon],button.danger:hover:not(.disabled) .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-danger-fill-hover);color:var(--tds-btn-icon-danger-fill-hover);fill:var(--tds-btn-icon-danger-color-hover);color:var(--tds-btn-icon-danger-color-hover)}button.danger.sc-tds-button:focus-visible{background:var(--tds-btn-danger-background-focus);border-color:var(--tds-btn-danger-border-color-focus);color:var(--tds-btn-danger-color-focus);outline-color:var(--tds-btn-danger-outline-color-focus)}button.danger:focus-visible.sc-tds-button-s>[slot=icon],button.danger:focus-visible .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-danger-fill-focus);color:var(--tds-btn-icon-danger-fill-focus);fill:var(--tds-btn-icon-danger-color-focus);color:var(--tds-btn-icon-danger-color-focus)}button.danger.sc-tds-button:active,button.danger.active.sc-tds-button{background:var(--tds-btn-danger-background-active);border-color:var(--tds-btn-danger-border-color-active);color:var(--tds-btn-danger-color-active);outline-color:var(--tds-btn-danger-outline-color-active)}button.danger:active:not(.disabled).sc-tds-button-s>[slot=icon],button.danger:active:not(.disabled) .sc-tds-button-s>[slot=icon],button.danger.active:not(.disabled).sc-tds-button-s>[slot=icon],button.danger.active:not(.disabled) .sc-tds-button-s>[slot=icon]{fill:var(--tds-btn-icon-danger-fill-active);color:var(--tds-btn-icon-danger-fill-active);fill:var(--tds-btn-icon-danger-color-active);color:var(--tds-btn-icon-danger-color-active)}button.danger.disabled.sc-tds-button,button.danger.sc-tds-button:disabled{background:var(--tds-btn-danger-background-disabled);border-color:var(--tds-btn-danger-border-color-disabled);color:var(--tds-btn-danger-color-disabled);outline-color:var(--tds-btn-danger-outline-color-disabled)}tds-button.sc-tds-button-h{display:inline-flex;align-items:center}.sc-tds-button-htds-button.sc-tds-button-s>[slot=icon],.sc-tds-button-htds-button .sc-tds-button-s>[slot=icon]{width:var(--tds-spacing-element-20);height:var(--tds-spacing-element-20)}.sc-tds-button-htds-button .sm.sc-tds-button-s>[slot=icon],.sc-tds-button-htds-button .sm .sc-tds-button-s>[slot=icon]{width:var(--tds-spacing-element-16);height:var(--tds-spacing-element-16)}.disabled.sc-tds-button-h:active{pointer-events:none}.disabled.sc-tds-button-h button.sc-tds-button{cursor:not-allowed}.fullbleed.sc-tds-button-h{width:100%;justify-content:center}tds-button.sc-tds-button button.sc-tds-button{display:inline-flex;align-items:center}tds-button button.sm.sc-tds-button-s>[slot=icon]{margin-left:var(--tds-spacing-element-12);width:var(--tds-spacing-element-16);height:var(--tds-spacing-element-16)}tds-button button.md.sc-tds-button-s>[slot=icon]{margin-left:var(--tds-spacing-element-16);width:var(--tds-spacing-element-20);height:var(--tds-spacing-element-20)}tds-button button.lg.sc-tds-button-s>[slot=icon]{margin-left:var(--tds-spacing-element-20);width:var(--tds-spacing-element-20);height:var(--tds-spacing-element-20)}tds-button button.only-icon.sc-tds-button-s>[slot=icon]{margin-left:0}";
 const TdsButtonStyle0 = buttonCss;
 
 const TdsButton$1 = /*@__PURE__*/ proxyCustomElement(class TdsButton extends H {
@@ -24,7 +24,11 @@ const TdsButton$1 = /*@__PURE__*/ proxyCustomElement(class TdsButton extends H {
         if (!this.text && !hasLabelSlot) {
             this.onlyIcon = true;
         }
-        return (h(Host, { key: '5e4003467875c6ecbfa8111982d90582ad4f81e4', class: `${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''} `, disabled: this.disabled }, h("button", { key: 'c3271e8b3a132aa65633b7363d06d60894cf20a4', type: this.type, disabled: this.disabled, class: {
+        return (h(Host, { key: 'b50a0bfecae92e758228c3e6c17c6e04c2582df4', class: {
+                [`tds-mode-variant-${this.modeVariant}`]: Boolean(this.modeVariant),
+                disabled: Boolean(this.disabled),
+                fullbleed: Boolean(this.fullbleed),
+            }, disabled: this.disabled }, h("button", { key: 'eeef9e5533d630209b9a116e1b9ca387a4b982b7', type: this.type, disabled: this.disabled, class: {
                 'primary': this.variant === 'primary',
                 'secondary': this.variant === 'secondary',
                 'ghost': this.variant === 'ghost',
@@ -38,7 +42,7 @@ const TdsButton$1 = /*@__PURE__*/ proxyCustomElement(class TdsButton extends H {
                 'icon': hasIconSlot,
                 'only-icon': this.onlyIcon,
                 [`animation-${this.animation}`]: this.animation !== 'none',
-            } }, this.text, hasLabelSlot && !this.onlyIcon && h("slot", { key: 'faf17907cbe022e4ec0ed3662704f60de018ead2', name: "label" }), hasIconSlot && h("slot", { key: '9f9ffcb72c024ed1030a4269f4bd8af29e2901bd', name: "icon" }))));
+            } }, this.text, hasLabelSlot && !this.onlyIcon && h("slot", { key: '5174346d2a5423ba65103ace557a8ff7758fd348', name: "label" }), hasIconSlot && h("slot", { key: 'f00bff4f1412d5b5beebe3834b69792a2879a09a', name: "icon" }))));
     }
     get host() { return this; }
     static get style() { return TdsButtonStyle0; }