@scania/tegel 1.5.0 → 1.6.1

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

@@ -1,7 +1,8 @@
-import { r as registerInstance, c as createEvent, h, g as getElement } from './index-6e6ff771.js';
+import { r as registerInstance, c as createEvent, h, g as getElement } from './index-ab4edc4a.js';
 import { g as generateUniqueId } from './generateUniqueId-7934d315.js';
 
 const checkboxCss = ".sc-tds-checkbox-h{align-items:center;position:relative;box-sizing:border-box}.tds-checkbox.sc-tds-checkbox{box-sizing:border-box;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);color:var(--tds-checkbox-text);display:flex;align-items:center;margin-left:-4px}.tds-checkbox.sc-tds-checkbox *.sc-tds-checkbox{box-sizing:border-box}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox{appearance:none;outline:none;margin:0;border:0;border-radius:2px;width:24px;height:24px;position:relative;cursor:pointer;flex-shrink:0;align-self:flex-start}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox+label.sc-tds-checkbox{color:var(--tds-checkbox-color);padding-left:var(--tds-spacing-element-4);padding-top:var(--tds-spacing-element-4);padding-bottom:var(--tds-spacing-element-4);cursor:pointer;display:flex;align-items:center}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox+label.sc-tds-checkbox::before{content:\"\";position:absolute;width:100%;height:100%;left:0;top:0}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox::after{content:\"\";position:absolute;box-sizing:border-box}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox::before{width:24px;height:24px;left:0;top:0;border-radius:4px}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox::after{border:1px solid var(--tds-checkbox-interaction-01);background-color:var(--tds-checkbox-interaction-02);width:16px;height:16px;left:4px;top:4px;border-radius:2px}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:hover::before{background-color:var(--tds-checkbox-background-hover);opacity:var(--tds-checkbox-background-opacity-hover)}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:focus::before{background-color:var(--tds-checkbox-background-focus);opacity:var(--tds-checkbox-background-opacity-focus);transition:opacity 0.2s ease-in-out}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:disabled,.tds-checkbox.sc-tds-checkbox input[type=checkbox].disabled.sc-tds-checkbox{cursor:not-allowed}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:disabled::after,.tds-checkbox.sc-tds-checkbox input[type=checkbox].disabled.sc-tds-checkbox::after{border-color:var(--tds-checkbox-border-color-disabled-after)}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:disabled+label.sc-tds-checkbox,.tds-checkbox.sc-tds-checkbox input[type=checkbox].disabled.sc-tds-checkbox+label.sc-tds-checkbox{color:var(--tds-grey-600);cursor:not-allowed}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:disabled:hover::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].disabled.sc-tds-checkbox:hover::before{display:none}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked::after{background-image:var(--tds-checkbox-background-img);background-color:var(--tds-checkbox-interaction-01);background-repeat:no-repeat;background-position:center}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked:hover::before{background-color:var(--tds-checkbox-background-hover);opacity:var(--tds-checkbox-background-opacity-hover)}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked:disabled:hover::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked:disabled::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked.disabled:hover::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked.disabled::before{display:block;width:16px;height:16px;left:4px;top:4px;border:1px solid #b0b7c4}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked:disabled::after,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:checked.disabled::after{background-image:var(--tds-checkbox-background-img-disabled);background-color:var(--tds-checkbox-interaction-02);color:var(--tds-checkbox-color-disabled-after)}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:indeterminate::after{background-image:var(--tds-checkbox-background-img-indeterminate);background-color:var(--tds-checkbox-interaction-01);background-repeat:no-repeat;background-position:center}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:indeterminate:disabled:hover::before,.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:indeterminate:disabled::before{display:block;width:16px;height:16px;left:4px;top:4px;border:1px solid #b0b7c4}.tds-checkbox.sc-tds-checkbox input[type=checkbox].sc-tds-checkbox:indeterminate:disabled::after{background-image:var(--tds-checkbox-background-img-indeterminate-disabled);background-color:var(--tds-checkbox-interaction-02);color:var(--tds-checkbox-color-disabled-after)}";
+const TdsCheckboxStyle0 = checkboxCss;
 
 const TdsCheckbox = class {
     constructor(hostRef) {
@@ -48,18 +49,17 @@ const TdsCheckbox = class {
         this.tdsBlur.emit(event);
     }
     render() {
-        return (h("div", { class: "tds-checkbox" }, h("input", {
+        return (h("div", { key: '7f6c5e5b86e6253436ecdab246bb16bca35ac033', class: "tds-checkbox" }, h("input", { key: '7d0743b1f01a4c5b87c99ba8756d068ed5e79dbf',
             // 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", { htmlFor: this.checkboxId }, h("slot", { name: "label" }))));
+            } }), h("label", { key: '74f9f1be873f228c20fa8aa526f7c067c77ed662', htmlFor: this.checkboxId }, h("slot", { key: '676ba34f3edd4bad011dd54433bc82066c19c90c', name: "label" }))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
         "indeterminate": ["handleIndeterminateState"]
     }; }
 };
-TdsCheckbox.style = checkboxCss;
+TdsCheckbox.style = TdsCheckboxStyle0;
 
 export { TdsCheckbox as tds_checkbox };

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

@@ -1,8 +1,9 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-6e6ff771.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-ab4edc4a.js';
 import { g as generateUniqueId } from './generateUniqueId-7934d315.js';
 import { h as hasSlot } from './hasSlot-d52114d0.js';
 
 const chipCss = ".sc-tds-chip-s>*{display:inline-flex;align-items:center}.sc-tds-chip-h.sc-tds-chip-s>[slot=label],.sc-tds-chip-h .sc-tds-chip-s>[slot=label]{padding-top:2px}.component.sc-tds-chip .tds-chip-component.sc-tds-chip{display:inline-flex}.component.sc-tds-chip .tds-chip-component.sc-tds-chip label.sc-tds-chip{background-color:var(--tds-chips-background);color:var(--tds-chips-color);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);display:inline-flex;align-items:center;border-radius:16px;cursor:pointer;white-space:nowrap}.component.sc-tds-chip .tds-chip-component.sc-tds-chip label.sc-tds-chip:hover{background-color:var(--tds-chips-background-hover)}.component.sc-tds-chip .tds-chip-component.lg.sc-tds-chip label.sc-tds-chip{height:32px;padding:0 16px;gap:8px}.component.sc-tds-chip .tds-chip-component.sm.sc-tds-chip label.sc-tds-chip{height:24px;padding:0 12px;gap:6px}.component.sc-tds-chip .tds-chip-component.sm.prefix.sc-tds-chip label.sc-tds-chip{padding:0 12px 0 6px}.component.sc-tds-chip .tds-chip-component.sm.suffix.sc-tds-chip label.sc-tds-chip{padding:0 6px 0 12px}.component.sc-tds-chip .tds-chip-component.lg.prefix.sc-tds-chip label.sc-tds-chip{padding:0 16px 0 8px}.component.sc-tds-chip .tds-chip-component.lg.suffix.sc-tds-chip label.sc-tds-chip{padding:0 8px 0 16px}.component.sc-tds-chip .tds-chip-component.lg.prefix.suffix.sc-tds-chip label.sc-tds-chip{padding:0 8px}.component.sc-tds-chip .tds-chip-component.sm.prefix.suffix.sc-tds-chip label.sc-tds-chip{padding:0 6px}.component.sc-tds-chip .tds-chip-component.sc-tds-chip input.sc-tds-chip{opacity:0;position:absolute;z-index:-1}.component.sc-tds-chip .tds-chip-component.sc-tds-chip input.sc-tds-chip:focus-visible+label.sc-tds-chip{outline:2px solid var(--tds-blue-400);outline-offset:-2px;background-color:var(--tds-chips-background-focus)}.component.sc-tds-chip .tds-chip-component.sc-tds-chip input.sc-tds-chip:checked+label.sc-tds-chip{background-color:var(--tds-chips-background-active);color:var(--tds-chips-color-active)}.component.sc-tds-chip .tds-chip-component.sc-tds-chip input.sc-tds-chip:checked+label.sc-tds-chip:hover{background-color:var(--tds-chips-background-active-hover)}";
+const TdsChipStyle0 = chipCss;
 
 const TdsChip = class {
     constructor(hostRef) {
@@ -57,16 +58,16 @@ const TdsChip = class {
         const hasPrefixSlot = hasSlot('prefix', this.host);
         const hasLabelSlot = hasSlot('label', this.host);
         const hasSuffixSlot = hasSlot('suffix', this.host);
-        return (h(Host, null, h("div", { class: "component" }, h("div", { class: {
+        return (h(Host, { key: '9bbcbc750f70b6644985fab7c3e480d626c77e02' }, h("div", { key: '37633a4897ae7a657e65474a4aa1525ec1d3ee85', class: "component" }, h("div", { key: '89239d3f8f0e215f91154927b65ae054eacfcbd2', class: {
                 'tds-chip-component': true,
                 'sm': this.size === 'sm',
                 'lg': this.size === 'lg',
                 'prefix': hasPrefixSlot,
                 'suffix': hasSuffixSlot,
-            } }, h("input", Object.assign({ type: this.type, id: this.chipId }, inputAttributes)), h("label", { onClick: (event) => event.stopPropagation(), htmlFor: this.chipId }, hasPrefixSlot && h("slot", { name: "prefix" }), hasLabelSlot && h("slot", { name: "label" }), hasSuffixSlot && h("slot", { name: "suffix" }))))));
+            } }, h("input", Object.assign({ key: '09f4aa0094cababe19a96e1a3c33d96d75bb97fc', type: this.type, id: this.chipId }, inputAttributes)), h("label", { key: '2a45508bf2ae0dcf28d02d049815022154c17cb0', onClick: (event) => event.stopPropagation(), htmlFor: this.chipId }, hasPrefixSlot && h("slot", { name: "prefix" }), hasLabelSlot && h("slot", { name: "label" }), hasSuffixSlot && h("slot", { name: "suffix" }))))));
     }
     get host() { return getElement(this); }
 };
-TdsChip.style = chipCss;
+TdsChip.style = TdsChipStyle0;
 
 export { TdsChip as tds_chip };

package/dist/esm/tds-core-header-item_2.entry.js

@@ -1,19 +1,21 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-6e6ff771.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-ab4edc4a.js';
 import { d as dfs } from './dfs-1e574d5f.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) {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, null, h("div", { class: "item" }, h("slot", null))));
+        return (h(Host, { key: '5518d7a3359d48ac323fa1a87e9c014911deb806' }, h("div", { key: '9d6ae88a87fdfecf92df14095b8bd5b844a1ff41', class: "item" }, h("slot", { key: 'cd3045dc6b892cb19c8d489e341897ff298be743' }))));
     }
 };
-TdsCoreHeaderItem.style = coreHeaderItemCss;
+TdsCoreHeaderItem.style = TdsCoreHeaderItemStyle0;
 
 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;
 
 const TdsHeaderItem = class {
     constructor(hostRef) {
@@ -50,13 +52,13 @@ const TdsHeaderItem = class {
         this.slotEl.addEventListener('slotchange', this.updateSlottedElements);
     }
     render() {
-        return (h(Host, null, h("tds-core-header-item", { class: {
+        return (h(Host, { key: 'e9db124a8c8140b9d0e0f948f46f7ad3629a7b65' }, h("tds-core-header-item", { key: '84fd45fb90adb59ca67aee61970f74f756e359c5', class: {
                 'component-active': this.active,
                 'component-selected': this.selected,
-            } }, h("slot", null))));
+            } }, h("slot", { key: '3ae05ca1b481bc0805ad348c461cfd4fcb99ba72' }))));
     }
     get host() { return getElement(this); }
 };
-TdsHeaderItem.style = headerItemCss;
+TdsHeaderItem.style = TdsHeaderItemStyle0;
 
 export { TdsCoreHeaderItem as tds_core_header_item, TdsHeaderItem as tds_header_item };

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

@@ -1,6 +1,7 @@
-import { r as registerInstance, c as createEvent, h } from './index-6e6ff771.js';
+import { r as registerInstance, c as createEvent, h } from './index-ab4edc4a.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;
 
 const TdsDatetime = class {
     constructor(hostRef) {
@@ -8,6 +9,7 @@ const TdsDatetime = class {
         this.tdsChange = createEvent(this, "tdsChange", 6);
         this.tdsBlur = createEvent(this, "tdsBlur", 6);
         this.tdsFocus = createEvent(this, "tdsFocus", 6);
+        this.tdsInput = createEvent(this, "tdsInput", 6);
         this.getDefaultValue = () => {
             const dateTimeObj = {
                 year: this.defaultValue.slice(0, 4),
@@ -43,6 +45,10 @@ const TdsDatetime = class {
         this.helper = '';
         this.focusInput = undefined;
     }
+    /** Method that sets the value of the datetime element */
+    async setValue(newValue) {
+        this.value = newValue;
+    }
     componentWillLoad() {
         if (this.defaultValue !== 'none') {
             this.value = this.getDefaultValue();
@@ -59,7 +65,7 @@ const TdsDatetime = class {
     // Data input event in value prop
     handleInput(e) {
         this.value = e.target.value;
-        this.tdsChange.emit(e);
+        this.tdsInput.emit(e);
     }
     // Change event isn't a composed:true by default in for input
     handleChange(e) {
@@ -83,7 +89,7 @@ const TdsDatetime = class {
         if (this.size === 'sm') {
             className += `${className}-sm`;
         }
-        return (h("div", { class: `
+        return (h("div", { key: '9b718024979e3b9832c8ca0ff06d7323f843aeea', 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' : ''}
@@ -93,9 +99,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 && (h("label", { htmlFor: this.name, class: "tds-datetime-label" }, this.label)), h("div", { onClick: (e) => this.handleFocusClick(e), class: "tds-datetime-container" }, h("div", { class: "tds-datetime-input-container" }, h("input", { 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) }), h("div", { class: "datetime-icon icon-datetime-local" }, h("tds-icon", { size: "20px", name: "calendar" })), h("div", { class: "datetime-icon icon-time" }, h("tds-icon", { size: "20px", name: "clock" }))), h("div", { class: "tds-datetime-bar" })), this.helper && (h("div", { class: "tds-datetime-helper" }, h("div", { class: "tds-helper" }, this.state === 'error' && h("tds-icon", { name: "error", size: "16px" }), this.helper)))));
+        ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, this.label && (h("label", { htmlFor: this.name, class: "tds-datetime-label" }, this.label)), h("div", { key: 'dcee80da3ff4538aa1a0437643ce91b07c46d968', onClick: (e) => this.handleFocusClick(e), class: "tds-datetime-container" }, h("div", { key: '61ccbe13370a32ff54380ba8704d0044f1b2c904', class: "tds-datetime-input-container" }, h("input", { key: '78268cb880af401218303b65bce2d0c761de640f', 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) }), h("div", { key: 'e161409fd2ea7f3f1da695b87062580275d94afb', class: "datetime-icon icon-datetime-local" }, h("tds-icon", { key: 'bb439960caf01ce31eba02f78669965392f65c19', size: "20px", name: "calendar" })), h("div", { key: 'c8967bc660ac4d1cf724cf6bf6651d2756041756', class: "datetime-icon icon-time" }, h("tds-icon", { key: '27cbb876130856fbada4602c4c783580aa7d95b9', size: "20px", name: "clock" }))), h("div", { key: '0309a22195d629a5e1b551f4e848dbc37596b647', class: "tds-datetime-bar" })), this.helper && (h("div", { class: "tds-datetime-helper" }, h("div", { class: "tds-helper" }, this.state === 'error' && h("tds-icon", { name: "error", size: "16px" }), this.helper)))));
     }
 };
-TdsDatetime.style = datetimeCss;
+TdsDatetime.style = TdsDatetimeStyle0;
 
 export { TdsDatetime as tds_datetime };

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

@@ -1,6 +1,7 @@
-import { r as registerInstance, h, H as Host } from './index-6e6ff771.js';
+import { r as registerInstance, h, H as Host } from './index-ab4edc4a.js';
 
 const dividerCss = ".divider{box-sizing:border-box}.divider *{box-sizing:border-box}.divider.horizontal{background-color:var(--tds-divider-background);width:100%;height:1px}.divider.vertical{background-color:var(--tds-divider-background);height:100%;width:1px}";
+const TdsDividerStyle0 = dividerCss;
 
 const Divider = class {
     constructor(hostRef) {
@@ -8,9 +9,9 @@ const Divider = class {
         this.orientation = 'horizontal';
     }
     render() {
-        return (h(Host, { role: "separator", "aria-orientation": this.orientation === 'vertical' ? 'vertical' : undefined }, h("div", { class: `divider ${this.orientation}` })));
+        return (h(Host, { key: 'eb45210dcf3ac030988c99afe5c66573d111ffa4', role: "separator", "aria-orientation": this.orientation === 'vertical' ? 'vertical' : undefined }, h("div", { key: 'c68d6b7ab37c04c93d261286a09189e9843ef1ab', class: `divider ${this.orientation}` })));
     }
 };
-Divider.style = dividerCss;
+Divider.style = TdsDividerStyle0;
 
 export { Divider as tds_divider };

package/dist/esm/tds-dropdown-option.entry.js

@@ -1,6 +1,7 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-6e6ff771.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-ab4edc4a.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;
 
 const TdsDropdownOption = class {
     constructor(hostRef) {
@@ -66,7 +67,7 @@ const TdsDropdownOption = class {
         this.selected = selected;
     }
     render() {
-        return (h(Host, { role: "option", "aria-disabled": this.disabled, "aria-selected": this.selected }, h("div", { class: `dropdown-option 
+        return (h(Host, { key: '1f5f9d34955f65caa0ba5ec261368fa20277fc8f', role: "option", "aria-disabled": this.disabled, "aria-selected": this.selected }, h("div", { key: 'ccab6344954996ec23558a2e39826008873d2827', class: `dropdown-option 
           ${this.size}
           ${this.selected ? 'selected' : ''}
           ${this.disabled ? 'disabled' : ''}
@@ -85,6 +86,6 @@ const TdsDropdownOption = class {
     static get delegatesFocus() { return true; }
     get host() { return getElement(this); }
 };
-TdsDropdownOption.style = dropdownOptionCss;
+TdsDropdownOption.style = TdsDropdownOptionStyle0;
 
 export { TdsDropdownOption as tds_dropdown_option };

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-6e6ff771.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-ab4edc4a.js';
 
 /**
  * Find the next focusable element index in a list of focusable elements.
@@ -59,6 +59,7 @@ const appendHiddenInput = (element, name, value, disabled, additionalAttributes)
 };
 
 const dropdownCss = "@charset \"UTF-8\";:host button{all:unset;height:100%;width:100%;background-color:var(--tds-dropdown-bg);border-bottom:1px solid var(--tds-dropdown-border-bottom);border-radius:4px 4px 0 0}:host button:hover{border-bottom:1px solid var(--tds-dropdown-border-bottom-hover)}:host button .value-wrapper{padding:0 16px;display:flex;align-items:center;justify-content:space-between}:host button.placeholder{color:var(--tds-dropdown-placeholder-color);line-height:1.3}:host button.value{color:var(--tds-dropdown-value-color);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);line-height:1.3}:host button:focus{border-bottom-color:var(--tds-dropdown-border-bottom-open)}:host button:focus::before{content:\"\";position:absolute;bottom:0;left:0;width:100%;height:1px;background:var(--tds-dropdown-border-bottom-open)}:host button.error{border-bottom:1px solid var(--tds-negative)}:host button.error:focus{border-bottom-color:transparent}:host button.error:focus::before{content:\"\";position:absolute;bottom:0;left:0;width:100%;height:2px;background:var(--tds-negative)}:host button:disabled{color:var(--tds-dropdown-disabled-color);border-bottom:1px solid transparent}:host .filter{display:flex;align-items:center;justify-content:space-between;height:100%;background-color:var(--tds-dropdown-bg);border-bottom:1px solid var(--tds-dropdown-border-bottom);padding-left:16px;border-radius:4px 4px 0 0}:host .filter:hover{border-bottom:1px solid var(--tds-dropdown-border-bottom-hover)}:host .filter.disabled{color:var(--tds-dropdown-disabled-color);border-bottom:1px solid transparent}:host .filter .value-wrapper{display:flex;width:100%;height:100%}:host .filter .label-inside-as-placeholder{position:absolute;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);line-height:1.3;color:var(--tds-dropdown-placeholder-color)}:host .filter .label-inside-as-placeholder.lg{top:20px}:host .filter .label-inside-as-placeholder.md{top:16px}:host .filter .label-inside-as-placeholder.sm{display:none}:host .filter .label-inside-as-placeholder.selected{font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:all 0.2s ease-in-out}:host .filter .label-inside-as-placeholder.selected.lg{top:12px}:host .filter .label-inside-as-placeholder.selected.md{top:8px}:host .filter .label-inside-as-placeholder.selected.sm{display:none}:host .filter .label-inside-as-placeholder.selected+.placeholder:not(.sm){margin-top:8px}:host .filter.focus{border-bottom-color:transparent}:host .filter.focus::before{content:\"\";position:absolute;bottom:0;left:0;width:100%;height:2px;background:var(--tds-dropdown-border-bottom-open)}:host .filter.error{border-bottom:1px solid var(--tds-negative)}:host .filter.error.focus{border-bottom-color:transparent}:host .filter.error.focus::before{content:\"\";position:absolute;bottom:0;left:0;width:100%;height:2px;background:var(--tds-negative)}:host .filter input{flex:1;all:unset;width:100%}:host .filter input::placeholder{color:var(--tds-dropdown-placeholder-color)}:host .filter input:disabled::placeholder{color:var(--tds-dropdown-disabled-color)}:host .filter tds-icon{margin-right:16px}:host{display:block;position:relative;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls)}:host .label-outside{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);color:var(--tds-dropdown-label-color);margin-bottom:8px}:host .label-outside.disabled{color:var(--tds-dropdown-disabled-color)}:host .dropdown-select{position:relative}:host .dropdown-select.disabled .label-inside,:host .dropdown-select.disabled .placeholder,:host .dropdown-select.disabled .label-inside-as-placeholder,:host .dropdown-select.disabled .value-wrapper{color:var(--tds-dropdown-disabled-color)}:host .dropdown-select .label-inside{position:absolute;font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);color:var(--tds-dropdown-label-inside-color)}:host .dropdown-select .label-inside.lg{top:12px;left:16px}:host .dropdown-select .label-inside.md{top:8px;left:16px}:host .dropdown-select .label-inside.sm{display:none}:host .dropdown-select .label-inside+.placeholder:not(.sm){margin-top:8px}:host .dropdown-select .placeholder{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .dropdown-select .label-inside-as-placeholder{color:var(--tds-dropdown-placeholder-color)}:host .dropdown-select .label-inside-as-placeholder.selected{position:absolute;font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:all 0.2s ease-in-out}:host .dropdown-select .label-inside-as-placeholder.selected.lg{top:12px}:host .dropdown-select .label-inside-as-placeholder.selected.md{top:8px}:host .dropdown-select .label-inside-as-placeholder.selected.sm{display:none}:host .dropdown-select .label-inside-as-placeholder.selected+.placeholder:not(.sm){margin-top:8px}:host .dropdown-select.lg{height:55px}:host .dropdown-select.md{height:47px}:host .dropdown-select.sm{height:39px}:host .helper{margin-top:4px;color:var(--tds-dropdown-helper-color);font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);display:flex;align-items:center;gap:8px}:host .helper.error{color:var(--tds-negative)}:host .helper.disabled{color:var(--tds-dropdown-disabled-color)}:host .dropdown-list{z-index:100;position:absolute;margin-top:1px;width:100%;transform-origin:top;transition:transform 0.2s ease-in-out;box-shadow:rgba(0, 0, 0, 0.1) 0 2px 3px 0;border-radius:0 0 4px 4px;overflow-y:auto}:host .dropdown-list::-webkit-scrollbar{width:4px;background-color:inherit}:host .dropdown-list::-webkit-scrollbar-thumb{background-color:var(--tds-grey-300)}:host .dropdown-list ::-webkit-scrollbar-button{height:0;width:0}:host .dropdown-list.lg{max-height:312px}:host .dropdown-list.md{max-height:312px}:host .dropdown-list.sm{max-height:260px}:host .dropdown-list.up{bottom:100%;margin-top:0;margin-bottom:1px;transform-origin:bottom;display:flex;flex-direction:column-reverse;box-shadow:rgba(0, 0, 0, 0.1) 0 -1px 3px 0;border-radius:4px 4px 0 0}:host .dropdown-list.up.label-outside{bottom:calc(100% - 24px)}:host .dropdown-list.closed{transform:scaleY(0);visibility:hidden}:host .dropdown-list.open{transform:scaleY(1)}:host .dropdown-list .no-result{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);display:flex;align-items:center;padding:0 16px;background-color:var(--tds-dropdown-bg)}:host .dropdown-list .no-result.lg{height:56px}:host .dropdown-list .no-result.md{height:48px}:host .dropdown-list .no-result.sm{height:40px}:host tds-icon{transition:transform 0.2s ease-in-out}:host tds-icon.open{transform:rotateZ(180deg)}";
+const TdsDropdownStyle0 = dropdownCss;
 
 const TdsDropdown = class {
     constructor(hostRef) {
@@ -389,7 +390,7 @@ const TdsDropdown = class {
     render() {
         var _a, _b, _c, _d;
         appendHiddenInput(this.host, this.name, (_a = this.value) === null || _a === void 0 ? void 0 : _a.map((value) => value).toString(), this.disabled);
-        return (h(Host, { role: "select", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, this.label && this.labelPosition === 'outside' && (h("div", { class: `label-outside ${this.disabled ? 'disabled' : ''}` }, this.label)), h("div", { class: `dropdown-select ${this.size} ${this.disabled ? 'disabled' : ''}` }, this.filter ? (h("div", { class: {
+        return (h(Host, { key: '75d4f203d87f8ecd1b79c859f72f7377888254af', role: "select", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, this.label && this.labelPosition === 'outside' && (h("div", { class: `label-outside ${this.disabled ? 'disabled' : ''}` }, this.label)), h("div", { key: '4595633d41ca7a108e345370b8e53bbf4a81380a', class: `dropdown-select ${this.size} ${this.disabled ? 'disabled' : ''}` }, this.filter ? (h("div", { class: {
                 filter: true,
                 focus: this.filterFocus,
                 disabled: this.disabled,
@@ -424,17 +425,17 @@ const TdsDropdown = class {
                     label-inside-as-placeholder
                     ${this.size}
                     ${((_c = this.value) === null || _c === void 0 ? void 0 : _c.length) ? 'selected' : ''}
-                    ` }, this.label)), h("div", { class: `placeholder ${this.size}` }, ((_d = this.value) === null || _d === void 0 ? void 0 : _d.length) ? this.getValue() : this.placeholder), h("tds-icon", { class: `${this.open ? 'open' : 'closed'}`, name: "chevron_down", size: "16px" }))))), h("div", { ref: (element) => (this.dropdownList = element), class: `dropdown-list
+                    ` }, this.label)), h("div", { class: `placeholder ${this.size}` }, ((_d = this.value) === null || _d === void 0 ? void 0 : _d.length) ? this.getValue() : this.placeholder), h("tds-icon", { class: `${this.open ? 'open' : 'closed'}`, name: "chevron_down", size: "16px" }))))), h("div", { key: 'dea4c89cf74b5a264e080d94332dccbc7cbd8c98', ref: (element) => (this.dropdownList = element), class: `dropdown-list
             ${this.size}
             ${this.open ? 'open' : 'closed'}
             ${this.getOpenDirection()}
-            ${this.label && this.labelPosition === 'outside' ? 'label-outside' : ''}` }, h("slot", null), this.filterResult === 0 && this.noResultText !== '' && (h("div", { class: `no-result ${this.size}` }, this.noResultText))), this.helper && (h("div", { class: `helper ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}` }, this.error && h("tds-icon", { name: "error", size: "16px" }), this.helper))));
+            ${this.label && this.labelPosition === 'outside' ? 'label-outside' : ''}` }, h("slot", { key: '4fd5b25fe610dd65fd2ca3e74b50afc5cb8131d9' }), this.filterResult === 0 && this.noResultText !== '' && (h("div", { class: `no-result ${this.size}` }, this.noResultText))), this.helper && (h("div", { class: `helper ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}` }, this.error && h("tds-icon", { name: "error", size: "16px" }), this.helper))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
         "open": ["handleOpenState"]
     }; }
 };
-TdsDropdown.style = dropdownCss;
+TdsDropdown.style = TdsDropdownStyle0;
 
 export { TdsDropdown as tds_dropdown };

package/dist/esm/tds-folder-tab.entry.js

@@ -1,6 +1,7 @@
-import { r as registerInstance, h, H as Host } from './index-6e6ff771.js';
+import { r as registerInstance, h, H as Host } from './index-ab4edc4a.js';
 
 const folderTabCss = ":host{box-sizing:border-box;position:relative}:host *{box-sizing:border-box}:host ::slotted(*){all:unset;min-width:142px;display:block;width:calc(100% - 32px);font:var(--tds-headline-07) !important;letter-spacing:var(--tds-headline-07-ls) !important;cursor:pointer;padding:16px;white-space:nowrap;text-decoration:none;text-align:left;outline:none;border:none;border-left:1px solid;border-left-color:transparent}:host ::slotted(*:focus-visible){outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host div:not(.selected){background-color:var(--tds-folder-tab-background)}:host div:not(.selected) ::slotted(*){border-left-color:var(--tds-folder-tab-divider-color);border-top:2px solid var(--tds-folder-tab-background);color:var(--tds-folder-tab-item-color)}:host div:not(.selected):hover:not(.disabled){background-color:var(--tds-folder-tab-background-hover);cursor:pointer}:host div:not(.selected):hover:not(.disabled) ::slotted(*){border-top-color:var(--tds-folder-tab-background-hover);color:var(--tds-folder-tab-color)}:host div:not(.selected).disabled ::slotted(*){color:var(--tds-folder-tab-item-color-disabled)}:host div:not(.selected).disabled ::slotted(*:focus-visible){outline:none}:host div:not(.selected).disabled ::slotted(*:hover){cursor:not-allowed}:host div:not(.selected).disabled ::slotted(*::after){content:none}:host .selected{background-color:var(--tds-folder-tab-background-selected);border-top:2px solid var(--tds-folder-tab-border-selected)}:host .selected::after{content:\" \";background-color:var(--tds-folder-tab-background-selected);width:1px;top:0;bottom:0;right:-1px;display:block;position:absolute;z-index:1}:host .selected ::slotted(*){color:var(--tds-folder-tab-color)}:host(.first) :not(.selected) ::slotted(*){border-left-color:transparent}";
+const TdsFolderTabStyle0 = folderTabCss;
 
 const TdsFolderTab = class {
     constructor(hostRef) {
@@ -18,10 +19,10 @@ const TdsFolderTab = class {
         this.selected = selected;
     }
     render() {
-        return (h(Host, { role: "listitem" }, h("div", { class: `${this.disabled ? 'disabled' : ''}
-                  ${this.selected ? 'selected' : ''}`, style: { width: `${this.tabWidth}px` } }, h("slot", null))));
+        return (h(Host, { key: '032b4d95a93760db31444194d7b21a0b9b581009', role: "listitem" }, h("div", { key: '2c7b72725e53390bce85ba156adb3ba05fe5e406', class: `${this.disabled ? 'disabled' : ''}
+                  ${this.selected ? 'selected' : ''}`, style: { width: `${this.tabWidth}px` } }, h("slot", { key: '372ea4281495f89a49099001f6c15e9ecb9caa34' }))));
     }
 };
-TdsFolderTab.style = folderTabCss;
+TdsFolderTab.style = TdsFolderTabStyle0;
 
 export { TdsFolderTab as tds_folder_tab };

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

@@ -1,6 +1,7 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-6e6ff771.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-ab4edc4a.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;
 
 const TdsFolderTabs = class {
     constructor(hostRef) {
@@ -155,15 +156,15 @@ const TdsFolderTabs = class {
         this.addResizeObserver();
     }
     render() {
-        return (h(Host, { role: "list", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { class: "wrapper", ref: (el) => {
+        return (h(Host, { key: 'eb1635179f54af77e7438282c76e3eaa11d53bd8', role: "list", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: '615a36341f659d538ee48742cb565357d4bc4f89', class: "wrapper", ref: (el) => {
                 this.navWrapperElement = el;
-            } }, h("button", { class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, disabled: !this.showLeftScroll, onClick: () => this.scrollLeft() }, h("tds-icon", { name: "chevron_left", size: "20px" })), h("slot", null), h("button", { class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, disabled: !this.showRightScroll, onClick: () => this.scrollRight() }, h("tds-icon", { name: "chevron_right", size: "20px" })))));
+            } }, h("button", { key: 'e2c7ac86a3fd268d9f81c9429df110e01007297a', class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, disabled: !this.showLeftScroll, onClick: () => this.scrollLeft() }, h("tds-icon", { key: 'c3f4cfdadfdc0e727405741a0255573bfac48e77', name: "chevron_left", size: "20px" })), h("slot", { key: 'c8a92e5d6ceabf50f4a8275282c4f49b8b21e232' }), h("button", { key: 'af855609041ab58deb465d35e2f03fe5c49e68ed', class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, disabled: !this.showRightScroll, onClick: () => this.scrollRight() }, h("tds-icon", { key: 'd212ddb172369557a9cb06cf26533c4eba8e7108', name: "chevron_right", size: "20px" })))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
         "selectedIndex": ["handleSelectedIndexUpdate"]
     }; }
 };
-TdsFolderTabs.style = folderTabsCss;
+TdsFolderTabs.style = TdsFolderTabsStyle0;
 
 export { TdsFolderTabs as tds_folder_tabs };

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

@@ -1,6 +1,7 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-6e6ff771.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-ab4edc4a.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;
 
 const TdsFooterGroup = class {
     constructor(hostRef) {
@@ -20,14 +21,14 @@ const TdsFooterGroup = class {
         }
     }
     render() {
-        return (h(Host, null, this.titleText && this.topPartGroup && (h("div", { class: "footer-top-title" }, this.titleText)), this.titleText && this.topPartGroup && (h("button", { onClick: () => {
+        return (h(Host, { key: 'a59951e61ce6b70ee19a5f807eb54482c0a43245' }, this.titleText && this.topPartGroup && (h("div", { class: "footer-top-title" }, this.titleText)), this.titleText && this.topPartGroup && (h("button", { onClick: () => {
                 this.open = !this.open;
-            }, class: `footer-top-title-button  ${this.open ? 'expanded' : 'closed'}` }, this.titleText, h("tds-icon", { name: "chevron_down", size: "20px" }))), h("div", { role: "list", class: `${this.slotPosition ? this.slotPosition : ''}
+            }, class: `footer-top-title-button  ${this.open ? 'expanded' : 'closed'}` }, this.titleText, h("tds-icon", { name: "chevron_down", size: "20px" }))), h("div", { key: 'd9d098c9ec27205e58d16a871e17c9647d92dd4c', role: "list", class: `${this.slotPosition ? this.slotPosition : ''}
             ${this.topPartGroup ? 'top-part-child' : ''}
-            ${this.open ? 'expanded' : 'closed'}` }, h("slot", null))));
+            ${this.open ? 'expanded' : 'closed'}` }, h("slot", { key: 'dc4f4984872471034c397bd13c535fbc423fdf6d' }))));
     }
     get host() { return getElement(this); }
 };
-TdsFooterGroup.style = footerGroupCss;
+TdsFooterGroup.style = TdsFooterGroupStyle0;
 
 export { TdsFooterGroup as tds_footer_group };

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

@@ -1,6 +1,7 @@
-import { r as registerInstance, h, g as getElement } from './index-6e6ff771.js';
+import { r as registerInstance, h, g as getElement } from './index-ab4edc4a.js';
 
 const footerItemCss = "[role=listitem] ::slotted(a),[role=listitem] ::slotted(button){font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);color:var(--tds-footer-main-links);opacity:var(--tds-footer-main-links-opacity);text-decoration:none}[role=listitem] ::slotted(a:focus-visible),[role=listitem] ::slotted(button:focus-visible){outline:2px solid var(--tds-blue-400);outline-offset:-2px}[role=listitem] ::slotted(a:hover),[role=listitem] ::slotted(button:hover){text-decoration:underline}[role=listitem].top-part-child ::slotted(a),[role=listitem].top-part-child ::slotted(button){font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);color:var(--tds-footer-top-links)}[role=listitem].top-part-child ::slotted(a:focus-visible),[role=listitem].top-part-child ::slotted(button:focus-visible){outline:2px solid var(--tds-blue-400);outline-offset:-2px}@media all and (max-width: 992px){[role=listitem].top-part-child{border-bottom:1px solid var(--tds-footer-top-divider)}[role=listitem].top-part-child ::slotted(a),[role=listitem].top-part-child ::slotted(button){display:block;height:100%;padding:19px 40px;font-weight:normal}[role=listitem].top-part-child ::slotted(a:hover),[role=listitem].top-part-child ::slotted(button:hover){text-decoration:underline;background-color:var(--tds-footer-top-links-background-hover)}[role=listitem].top-part-child ::slotted(a:focus-visible),[role=listitem].top-part-child ::slotted(button:focus-visible){outline:2px solid var(--tds-blue-400);outline-offset:-2px}}";
+const TdsFooterItemStyle0 = footerItemCss;
 
 const TdsFooterItem = class {
     constructor(hostRef) {
@@ -11,10 +12,10 @@ const TdsFooterItem = class {
         this.parentIsTopPart = this.host.closest('tds-footer-group').parentElement.slot === 'top';
     }
     render() {
-        return (h("div", { role: "listitem", class: `${this.parentIsTopPart ? 'top-part-child' : ''}` }, h("slot", null)));
+        return (h("div", { key: '5e5e0fab636900a4a5abc91fef8d9423d7995b37', role: "listitem", class: `${this.parentIsTopPart ? 'top-part-child' : ''}` }, h("slot", { key: '435a9db05aee42f8e92879b5bdca2a615e683d1b' })));
     }
     get host() { return getElement(this); }
 };
-TdsFooterItem.style = footerItemCss;
+TdsFooterItem.style = TdsFooterItemStyle0;
 
 export { TdsFooterItem as tds_footer_item };

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

@@ -1,7 +1,8 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-6e6ff771.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-ab4edc4a.js';
 import { h as hasSlot } from './hasSlot-d52114d0.js';
 
 const footerCss = ":host{display:block}:host slot[name=top]::slotted(*){box-sizing:border-box;background-color:var(--tds-footer-top-background);padding:40px;display:grid;grid-template-columns:repeat(4, 1fr);row-gap:40px;width:100%}:host .footer-main{background-color:var(--tds-footer-main-background);padding:0 40px}:host .footer-main-top{padding:40px 0;display:flex;justify-content:space-between}:host slot[name=start]::slotted(*),:host slot[name=end]::slotted(*){display:flex;column-gap:24px}:host .footer-main-bottom{padding:40px 0;display:flex;justify-content:space-between;border-top:1px solid var(--tds-footer-main-divider)}:host .footer-main-bottom small.copyright{margin:0;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);color:var(--tds-footer-main-copyright)}:host .footer-main-bottom .brand{background-image:var(--tds-background-image-scania-wordmark-white-svg);background-repeat:no-repeat;background-size:117px;background-position:right;width:117px;height:20px}:host .footer-main-bottom .brand p{color:transparent;padding:0;margin:0;height:100%;visibility:hidden}@media all and (max-width: 992px){:host slot[name=top]::slotted(*){display:block;width:100%;padding:0}:host .footer-main{padding:0 24px}:host .footer-main-top{flex-direction:column;row-gap:48px;padding:24px 0}:host slot[name=end]::slotted(*){flex-direction:row;gap:8px}:host .footer-main-bottom{flex-direction:column;padding-bottom:32px}:host .footer-main-bottom p.copyright{padding-bottom:96px}:host .footer-main-bottom .brand{width:100%}}";
+const TdsFooterStyle0 = footerCss;
 
 const TdsFooter = class {
     constructor(hostRef) {
@@ -14,10 +15,10 @@ const TdsFooter = class {
         const usesStartSlot = hasSlot('start', this.host);
         const usesEndSlot = hasSlot('end', this.host);
         const usesCopyrightSlot = hasSlot('copyright', this.host);
-        return (h(Host, { class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("footer", null, usesTopSlot && h("slot", { name: "top" }), h("div", { class: "footer-main" }, h("div", { class: "footer-main-top" }, usesStartSlot && h("slot", { name: "start" }), usesEndSlot && h("slot", { name: "end" })), h("div", { class: "footer-main-bottom" }, h("small", { class: "copyright" }, usesCopyrightSlot ? h("slot", { name: "copyright" }) : this.copyrightText), h("div", { class: "brand" }, h("p", null, "Scania")))))));
+        return (h(Host, { key: '0f916c49a2a4c3904ebcf5bad2593c5a4928880a', class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("footer", { key: '44e23c34001ff656ea572ca69a536adfc1b620f7' }, usesTopSlot && h("slot", { name: "top" }), h("div", { key: 'f20390b2f8dae54532e29e39c58b27ef6fe5cb6a', class: "footer-main" }, h("div", { key: '5fbbaabdc8e023447ba8eb35e7cfadf2c959e5b0', class: "footer-main-top" }, usesStartSlot && h("slot", { name: "start" }), usesEndSlot && h("slot", { name: "end" })), h("div", { key: '6276e651cc7cdc3fd9cb48b4c868b89c67c1ad4e', class: "footer-main-bottom" }, h("small", { key: '0bcac7160e866a43faca21ee3389e07042231d0b', class: "copyright" }, usesCopyrightSlot ? h("slot", { name: "copyright" }) : this.copyrightText), h("div", { key: 'bff874e1ff2898071a5ff31b1ca861848836ddfd', class: "brand" }, h("p", { key: '0dcec703e1207bef407fe909db64d6f1df7d5dd2' }, "Scania")))))));
     }
     get host() { return getElement(this); }
 };
-TdsFooter.style = footerCss;
+TdsFooter.style = TdsFooterStyle0;
 
 export { TdsFooter as tds_footer };

package/dist/esm/tds-header-brand-symbol.entry.js

@@ -1,16 +1,17 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-6e6ff771.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-ab4edc4a.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;
 
 const TdsHeaderBrandSymbol = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, null, h("tds-header-item", null, h("slot", null))));
+        return (h(Host, { key: '327b11c15448a5092c4dd698b53cdfca2063097b' }, h("tds-header-item", { key: 'c3709372cb856c73209cc87d1cb552fa87c17fc0' }, h("slot", { key: '25571704bd91411b649eceb5716fe22278193fc0' }))));
     }
     get host() { return getElement(this); }
 };
-TdsHeaderBrandSymbol.style = headerBrandSymbolCss;
+TdsHeaderBrandSymbol.style = TdsHeaderBrandSymbolStyle0;
 
 export { TdsHeaderBrandSymbol as tds_header_brand_symbol };

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

@@ -1,6 +1,7 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-6e6ff771.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-ab4edc4a.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:0 16px;margin: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--right-align) .tds-table__header-button{text-align:right;justify-content:end;flex-direction:row-reverse}: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__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;
 
 const relevantTableProps = [
     'multiselect',
@@ -116,7 +117,7 @@ const TdsTableHeaderCell = class {
             this.host.closest('tds-table').getElementsByTagName('tds-table-toolbar').length >= 1;
     }
     render() {
-        return (h(Host, { class: {
+        return (h(Host, { key: 'd09c42078df2774f9bae1e9e2906abdf9e52f5ac', class: {
                 'tds-table__header-cell': true,
                 'tds-table__header-cell--sortable': this.sortable,
                 'tds-table__header-cell--is-sorted': this.sortedByMyKey,
@@ -133,6 +134,6 @@ const TdsTableHeaderCell = class {
     }
     get host() { return getElement(this); }
 };
-TdsTableHeaderCell.style = tableHeaderCellCss;
+TdsTableHeaderCell.style = TdsHeaderCellStyle0;
 
 export { TdsTableHeaderCell as tds_header_cell };

package/dist/esm/tds-header-dropdown-list-item.entry.js

@@ -1,6 +1,7 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-6e6ff771.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-ab4edc4a.js';
 
 const headerDropdownListItemCss = ":host{display:block;box-sizing:border-box;height:var(--tds-header-list-item-md-height);width:100%}:host .component{height:100%}:host .component ::slotted(a),:host .component ::slotted(button){all:unset;box-sizing:border-box;border:none;display:flex;align-items:center;height:100%;padding:0 24px;width:100%;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);background-color:var(--tds-nav-dropdown-item-background);color:var(--tds-header-nav-item-dropdown-opened-color)}:host .component ::slotted(a:hover){background-color:var(--tds-nav-item-background-hover);cursor:pointer}:host .component ::slotted(a:focus-visible){outline:2px solid var(--tds-blue-400);outline-offset:-2px}:host .component-selected{background-color:var(--tds-nav-item-background-selected);padding-right:4px;border-left-width:4px;border-left-style:solid;border-left-color:var(--tds-nav-item-border-color-active)}:host .component-selected ::slotted(a),:host .component-selected ::slotted(button){background-color:var(--tds-nav-item-background-selected)}:host(:not(:last-child)){border-bottom:1px solid var(--tds-nav-dropdown-item-border-color)}:host([size=lg]){height:var(--tds-header-height)}:host([size=lg]) ::slotted(a),:host([size=lg]) ::slotted(button){padding:0 16px;color:var(--tds-header-app-launcher-item-color)}";
+const TdsHeaderDropdownListItemStyle0 = headerDropdownListItemCss;
 
 const TdsHeaderDropdownListItem = class {
     constructor(hostRef) {
@@ -9,13 +10,13 @@ const TdsHeaderDropdownListItem = class {
         this.size = 'md';
     }
     render() {
-        return (h(Host, null, h("div", { class: {
+        return (h(Host, { key: '774697d96ed26eea5c5416c748812850482bbe08' }, h("div", { key: 'b3e69475f88fcdfbea2cd685f9804a0412938594', class: {
                 'component': true,
                 'component-selected': this.selected,
-            } }, h("slot", null))));
+            } }, h("slot", { key: '53edf8eee9b251320f0764e351ab233d90dd9ea1' }))));
     }
     get host() { return getElement(this); }
 };
-TdsHeaderDropdownListItem.style = headerDropdownListItemCss;
+TdsHeaderDropdownListItem.style = TdsHeaderDropdownListItemStyle0;
 
 export { TdsHeaderDropdownListItem as tds_header_dropdown_list_item };

package/dist/esm/tds-header-dropdown-list-user.entry.js

@@ -1,6 +1,7 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-6e6ff771.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-ab4edc4a.js';
 
 const headerDropdownListUserCss = ":host{background-color:var(--tds-header-avatar-item-background);display:flex;height:84px}:host .user-box{gap:16px;width:100%;padding:0 16px;display:flex;align-items:center;border-bottom:1px solid var(--tds-nav-dropdown-item-border-color)}:host img,:host slot[name=thumbnail]::slotted(*){width:34px;border-radius:100%}:host .user-content{display:flex;flex-direction:column;gap:4px}:host .user-content .header{font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls)}:host .user-content .subheader{font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);color:var(--tds-header-avatar-item-color)}";
+const TdsHeaderDropdownListUserStyle0 = headerDropdownListUserCss;
 
 const TdsHeaderDropdownListLgUser = class {
     constructor(hostRef) {
@@ -11,10 +12,10 @@ const TdsHeaderDropdownListLgUser = class {
         this.subheader = undefined;
     }
     render() {
-        return (h(Host, { role: "listitem" }, h("div", { class: "user-box" }, this.imgUrl && h("img", { src: this.imgUrl, alt: this.imgAlt }), h("slot", { name: "thumbanil" }), h("div", { class: "user-content" }, h("div", { class: "header" }, this.header, h("slot", { name: "header" })), h("div", { class: "subheader" }, this.subheader, h("slot", { name: "subheader" }))))));
+        return (h(Host, { key: '68abd3a9a18eb07df40f2f6b2b36059ab20a4108', role: "listitem" }, h("div", { key: '4c0547202b1bd79abf176b23367b09d25d88d575', class: "user-box" }, this.imgUrl && h("img", { src: this.imgUrl, alt: this.imgAlt }), h("slot", { key: '37c0fd2aeaf2249a4209c96ca84dd2e5a78dfc5e', name: "thumbanil" }), h("div", { key: 'feb5534d000c66c69d6a589428c7ea875932c974', class: "user-content" }, h("div", { key: 'fe6c84e6b39f3b5da49700dca2a84190e2edfcff', class: "header" }, this.header, h("slot", { key: 'cbab5a0251b8181b0ad9012d5d310da2d730a37f', name: "header" })), h("div", { key: '0992f9330ec9000a04033fba561b04fb7d4f01db', class: "subheader" }, this.subheader, h("slot", { key: 'f884e86e6e77ee67430b3c6e7696ba48a0b0fa13', name: "subheader" }))))));
     }
     get host() { return getElement(this); }
 };
-TdsHeaderDropdownListLgUser.style = headerDropdownListUserCss;
+TdsHeaderDropdownListLgUser.style = TdsHeaderDropdownListUserStyle0;
 
 export { TdsHeaderDropdownListLgUser as tds_header_dropdown_list_user };

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

@@ -1,8 +1,9 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-6e6ff771.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-ab4edc4a.js';
 import { g as getPreviousNestedChildOfSiblingsMatching, i as isHeadingElement } from './isHeadingElement-8efea284.js';
 import './dfs-1e574d5f.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}";
+const TdsHeaderDropdownListStyle0 = headerDropdownListCss;
 
 const TdsHeaderDropdownList = class {
     constructor(hostRef) {
@@ -73,10 +74,10 @@ const TdsHeaderDropdownList = class {
             'role': 'list',
             'aria-labelledby': (_a = this.headingElement) === null || _a === void 0 ? void 0 : _a.id,
         };
-        return (h(Host, Object.assign({}, attributes), h("slot", null)));
+        return (h(Host, Object.assign({ key: '1811afd66a144c882c0d2d29d3bb01df601911cb' }, attributes), h("slot", { key: '4b1cee3cd03339a3371f87785b87eae665d76a47' })));
     }
     get host() { return getElement(this); }
 };
-TdsHeaderDropdownList.style = headerDropdownListCss;
+TdsHeaderDropdownList.style = TdsHeaderDropdownListStyle0;
 
 export { TdsHeaderDropdownList as tds_header_dropdown_list };