@scania/tegel 1.34.0-design.tokens.beta.test.0 → 1.34.0-internal-variables-demo.0

package/dist/collection/components/slider/slider.css

@@ -37,15 +37,11 @@ tds-slider .slider-secondary .tds-slider .tds-slider__input-values .tds-slider__
 }
 
 .tds-slider-wrapper.slider-success .tds-slider__input-values .tds-slider__input-field-wrapper input.tds-slider__input-field {
-  border-left: 1px solid var(--slider-border-left-success);
-  border-right: 1px solid var(--slider-border-right-success);
-  border-bottom: 1px solid var(--slider-border-bottom-success);
-  border-top: 1px solid var(--slider-border-top-success);
+  box-shadow: var(--slider-input-field-box-shadow-success);
   color: var(--slider-input-success-text);
-  box-shadow: var(--slider-border-success);
 }
 .tds-slider-wrapper.slider-success .tds-slider__input-values .tds-slider__input-field-wrapper input.tds-slider__input-field:hover {
-  box-shadow: var(--slider-border-success);
+  box-shadow: var(--slider-input-field-box-shadow-success);
 }
 
 .tds-slider-wrapper:focus-within {
@@ -118,26 +114,19 @@ tds-slider .slider-secondary .tds-slider .tds-slider__input-values .tds-slider__
   border-bottom: 1px solid var(--slider-border-bottom);
   border-top: 1px solid var(--slider-border-top);
   border-radius: var(--slider-border-radius);
-  box-shadow: var(--slider-border-appearance);
+  box-shadow: var(--slider-input-field-box-shadow);
   color: var(--slider-input-inputfield);
   border: 0;
   background-color: transparent;
   text-align: center;
   padding: 12px;
+  transition: box-shadow 200ms ease;
 }
 .tds-slider .tds-slider__input-values .tds-slider__input-field-wrapper input.tds-slider__input-field:hover {
-  border-left: 1px solid var(--slider-border-left-hover);
-  border-right: 1px solid var(--slider-border-right-hover);
-  border-bottom: 1px solid var(--slider-border-bottom-hover);
-  border-top: 1px solid var(--slider-border-top-hover);
-  box-shadow: var(--slider-border-hover);
+  box-shadow: var(--slider-input-field-box-shadow-hover);
 }
 .tds-slider .tds-slider__input-values .tds-slider__input-field-wrapper input.tds-slider__input-field:focus {
-  border-left: 1px solid var(--slider-border-left-focus);
-  border-right: 1px solid var(--slider-border-right-focus);
-  border-bottom: 1px solid var(--slider-border-bottom-focus);
-  border-top: 1px solid var(--slider-border-top-focus);
-  box-shadow: var(--slider-border-focus);
+  box-shadow: var(--slider-input-field-box-shadow-focus);
   outline: var(--slider-border-outline);
 }
 .tds-slider label {

package/dist/collection/components/slider/slider.js

@@ -403,34 +403,34 @@ export class TdsSlider {
     }
     render() {
         const ariaLabel = this.readOnly ? this.tdsReadOnlyAriaLabel : this.label || this.tdsAriaLabel;
-        return (h("div", { key: '715e34fce10a8431f444f4e31600a43a691760a9', class: {
+        return (h("div", { key: 'bd4183c7e9ab8598f2f1e00ff7d6d395847400d5', class: {
                 'tds-slider-wrapper': true,
                 'read-only': this.readOnly,
                 'slider-default': this.state === 'default',
                 'slider-success': this.state === 'success',
                 'slider-primary': this.modeVariant === 'primary',
                 'slider-secondary': this.modeVariant === 'secondary',
-            } }, h("input", { key: 'bbb03b06fb9ee3c9d15f7888907eeb1df2e1812c', class: "tds-slider-native-element", type: "range", name: this.name, min: this.min, max: this.max, step: this.step, value: this.value, disabled: this.disabled }), h("div", { key: '5d3f484389748702214078aa29c425959cefc699', class: "sr-only", "aria-live": "assertive", ref: (el) => {
+            } }, h("input", { key: '26336c8cae0fa98a4afd3971c85d606bc19ef1d8', class: "tds-slider-native-element", type: "range", name: this.name, min: this.min, max: this.max, step: this.step, value: this.value, disabled: this.disabled }), h("div", { key: '81b4037332a2cd014499aab8e0a736f6b29466ad', class: "sr-only", "aria-live": "assertive", ref: (el) => {
                 this.ariaLiveElement = el;
-            } }), h("div", { key: '0084722a4767cf16b16af7b845b0990c66a68152', class: {
+            } }), h("div", { key: '45076b1377c6ed50ca30bb54ea6813e0bbe86823', class: {
                 'tds-slider': true,
                 'disabled': this.disabled,
                 'tds-slider-small': this.useSmall,
             }, ref: (el) => {
                 this.wrapperElement = el;
-            }, "aria-disabled": this.disabled ? 'true' : 'false' }, h("label", { key: '436d227707358c9459e87437f1a6152a8690521b', id: `${this.sliderId}-label`, class: this.showTickNumbers && 'offset' }, this.label), this.useInput && (h("div", { key: 'd95bd64d13310a061699e5c462d0b7c1d4fe8fb6', class: "tds-slider__input-values" }, h("div", { key: 'dcdc740f99194c02629c98f44b6b38f81d63704f', class: "tds-slider__input-value min-value" }, this.min))), this.useControls && (h("div", { key: 'd9a9495e45681cd5974ac1bbfed4690a9026db40', class: "tds-slider__controls" }, h("div", { key: 'a856d6150e600f767a5de856583a191f5bd9978c', class: "tds-slider__control tds-slider__control-minus", onClick: (event) => this.stepLeft(event), role: "button", "aria-label": "Decrease value", tabindex: this.disabled || this.readOnly ? '-1' : '0' }, h("tds-icon", { key: '70f49886c665c70f568011dca856615b31b5b175', name: "minus", size: "16px" })))), h("div", { key: '65bea558bd5451e7cd83764443307e710aac0608', class: "tds-slider-inner", tabIndex: -1 }, this.tickValues.length > 0 && (h("div", { key: 'a6f63b8e0d6ee9a1c72417dff877a94176ca7879', class: "tds-slider__value-dividers-wrapper" }, h("div", { key: '0a47b1b774438f3af9f815f91f0338651490a739', class: "tds-slider__value-dividers" }, this.tickValues.map((value) => (h("div", { class: "tds-slider__value-divider" }, this.showTickNumbers && h("span", null, value))))))), h("div", { key: '6be0fedd7c9fabea6bd6021d5ab4796e269c5002', class: "tds-slider__track", ref: (el) => {
+            }, "aria-disabled": this.disabled ? 'true' : 'false' }, h("label", { key: '986444a64e1254c9fe7e48d92439dfbf68e1cd9c', id: `${this.sliderId}-label`, class: this.showTickNumbers && 'offset' }, this.label), this.useInput && (h("div", { key: '78958c70f9f18a68e5a652cab122ce69390a7638', class: "tds-slider__input-values" }, h("div", { key: '7488b615ae3f989e89819418e95a0e50f6870f39', class: "tds-slider__input-value min-value" }, this.min))), this.useControls && (h("div", { key: 'b13a12af4fa8b1256bff7df615f870295604fcb8', class: "tds-slider__controls" }, h("div", { key: '6d8f516d30ef263971969b2034d132e47254e7a8', class: "tds-slider__control tds-slider__control-minus", onClick: (event) => this.stepLeft(event), role: "button", "aria-label": "Decrease value", tabindex: this.disabled || this.readOnly ? '-1' : '0' }, h("tds-icon", { key: '29be5d68dc58887ca806d2e871e21abd49f8bc6b', name: "minus", size: "16px" })))), h("div", { key: '2082aa0ebf30e5e32c9d5f2dcfc092cf51f486f7', class: "tds-slider-inner", tabIndex: -1 }, this.tickValues.length > 0 && (h("div", { key: '78894f9a5ec898237bad37507ceb0e719829e835', class: "tds-slider__value-dividers-wrapper" }, h("div", { key: '28b5650b22efe479753a15585266daba70e8fe99', class: "tds-slider__value-dividers" }, this.tickValues.map((value) => (h("div", { class: "tds-slider__value-divider" }, this.showTickNumbers && h("span", null, value))))))), h("div", { key: '4c3345c0729d8b2fc8dc41d7d341649a3456e431', class: "tds-slider__track", ref: (el) => {
                 this.trackElement = el;
             }, tabindex: this.disabled ? '-1' : '0', role: "presentation", onFocus: () => {
                 if (this.thumbElement) {
                     this.thumbElement.focus();
                 }
-            } }, h("div", { key: 'd21c081bdc2519364297e81afb4dc42570924108', class: "tds-slider__track-fill", ref: (el) => {
+            } }, h("div", { key: '93c0ab45f73c0c2ee8dbdaf75dcc0b36a5d8c5e6', class: "tds-slider__track-fill", ref: (el) => {
                 this.trackFillElement = el;
-            } }), h("div", { key: 'd5889d39ac0dd7dd0db2d121a4f006f5dab0b820', class: "tds-slider__thumb", ref: (el) => {
+            } }), h("div", { key: '0ad854c25663ba050dc1aedb737a209d43046e50', class: "tds-slider__thumb", ref: (el) => {
                 this.thumbElement = el;
-            }, onMouseDown: () => this.grabThumb(), onTouchStart: () => this.grabThumb(), role: "slider", "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": this.value, "aria-valuetext": `${this.value} of ${this.max}`, "aria-labelledby": `${this.sliderId}-label`, "aria-grabbed": this.thumbGrabbed ? 'true' : 'false', "aria-label": ariaLabel, tabindex: this.disabled ? '-1' : '0' }, this.tooltip && (h("div", { key: 'b5f7e229f9b8ac62903b47c8c78e4892952c687a', class: "tds-slider__value" }, this.value, h("svg", { key: '0c017b4600c7a1d43d093f34a45728f0325f357a', width: "18", height: "14", viewBox: "0 0 18 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '7621d32d782565d97dd760391ba13048b25cd064', d: "M8.15882 12.6915L0.990487 1.54076C0.562658 0.875246 1.0405 0 1.83167 0H16.1683C16.9595 0 17.4373 0.875246 17.0095 1.54076L9.84118 12.6915C9.44754 13.3038 8.55246 13.3038 8.15882 12.6915Z", fill: "currentColor" })))), h("div", { key: '959efc065763750af541bcd2bc5427d4f2615d1e', class: "tds-slider__thumb-inner", ref: (el) => {
+            }, onMouseDown: () => this.grabThumb(), onTouchStart: () => this.grabThumb(), role: "slider", "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": this.value, "aria-valuetext": `${this.value} of ${this.max}`, "aria-labelledby": `${this.sliderId}-label`, "aria-grabbed": this.thumbGrabbed ? 'true' : 'false', "aria-label": ariaLabel, tabindex: this.disabled ? '-1' : '0' }, this.tooltip && (h("div", { key: 'b80b3f6e542820507f5b75cc458475ded9f3d917', class: "tds-slider__value" }, this.value, h("svg", { key: 'e3144dc00d812cb4ea7c2b1be1ac5e79e70d9022', width: "18", height: "14", viewBox: "0 0 18 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '940b3dc10755cb6b66d793e1fe03201a4661dbfd', d: "M8.15882 12.6915L0.990487 1.54076C0.562658 0.875246 1.0405 0 1.83167 0H16.1683C16.9595 0 17.4373 0.875246 17.0095 1.54076L9.84118 12.6915C9.44754 13.3038 8.55246 13.3038 8.15882 12.6915Z", fill: "currentColor" })))), h("div", { key: 'a6da99482099afd5b4a36f51e43cd83184a80e4f', class: "tds-slider__thumb-inner", ref: (el) => {
                 this.thumbInnerElement = el;
-            } })))), this.useInput && (h("div", { key: '93429de6f4b06b34d46b5897c36be2daa0c944e9', class: "tds-slider__input-values" }, h("div", { key: 'da03b4b36ddf882c0f07d1f6ff15ab1d7b8aadc7', class: "tds-slider__input-value", onClick: (event) => this.stepLeft(event) }, this.max), h("div", { key: 'fc90336048ed2b9f98b8afe7ffa8f9b193817cb5', class: "tds-slider__input-field-wrapper" }, h("input", { key: '93be2292f0b6285f1bb57699d80913ba07f9d267', size: this.calculateInputSizeFromMax(), class: "tds-slider__input-field", value: this.value, "aria-label": this.readOnly ? this.tdsReadOnlyAriaLabel : undefined, onBlur: (event) => this.updateSliderValueOnInputChange(event), onKeyDown: (event) => this.handleInputFieldEnterPress(event), type: "number", min: this.min, max: this.max, step: this.step })))), this.useControls && (h("div", { key: '9dfbe87c4bdbc632cff5b093d81f68fd9629a6eb', class: "tds-slider__controls" }, h("div", { key: 'b78da8c73e51773e0b00c86cbd3143d543b272ca', class: "tds-slider__control tds-slider__control-plus", onClick: (event) => this.stepRight(event), role: "button", "aria-label": "Increase value", tabindex: this.disabled || this.readOnly ? '-1' : '0' }, h("tds-icon", { key: '9f2d1d93a14c1c10f7c7317283aec3a66e5818b1', name: "plus", size: "16px" })))))));
+            } })))), this.useInput && (h("div", { key: 'c80e10049d55a5457ddbfdbccc107e26a48d44b1', class: "tds-slider__input-values" }, h("div", { key: '31892d55b7ffb5db331bbb273ff9ade5ff5ce187', class: "tds-slider__input-value", onClick: (event) => this.stepLeft(event) }, this.max), h("div", { key: '5cfd66b7016d413a52b884d61ba585e25e6d8e53', class: "tds-slider__input-field-wrapper" }, h("input", { key: '0110bd5e6bf77baf28e621145fa4b683b488ee62', size: this.calculateInputSizeFromMax(), class: "tds-slider__input-field", value: this.value, "aria-label": this.readOnly ? this.tdsReadOnlyAriaLabel : undefined, onBlur: (event) => this.updateSliderValueOnInputChange(event), onKeyDown: (event) => this.handleInputFieldEnterPress(event), type: "number", min: this.min, max: this.max, step: this.step })))), this.useControls && (h("div", { key: 'b4acf1abc7c3ec847e385ce3e71c396975efbbc0', class: "tds-slider__controls" }, h("div", { key: '41d053f1471824dc3e6acdd143dc15a3b29dcb62', class: "tds-slider__control tds-slider__control-plus", onClick: (event) => this.stepRight(event), role: "button", "aria-label": "Increase value", tabindex: this.disabled || this.readOnly ? '-1' : '0' }, h("tds-icon", { key: '9f78191d97f05e5e3ee1dc10243beb5435671116', name: "plus", size: "16px" })))))));
     }
     static get is() { return "tds-slider"; }
     static get originalStyleUrls() {

package/dist/collection/components/spinner/spinner.js

@@ -5,7 +5,7 @@ export class TdsSpinner {
         this.variant = 'standard';
     }
     render() {
-        return (h(Host, { key: 'bf2c551b6aae9bb2c6b8c67154fd8a81bb331c6e', "aria-live": "assertive", role: "status", "aria-label": "loading" }, h("svg", { key: 'ddfe38e85892d3bd72d56dd6c9483f22d164e415', class: `tds-spinner-svg tds-spinner-svg-${this.size}`, "aria-hidden": "true" }, h("circle", { key: 'e2ba6926fdb28d085bdd0f0a23170fc5fb908e9e', class: `tds-spinner-circle tds-spinner-circle-${this.variant}` }))));
+        return (h(Host, { key: '258284f4a0e66ef317ebf68f1e84535bf4525b2f', "aria-live": "assertive", role: "status", "aria-label": "loading" }, h("svg", { key: '4c5543d50a45c97f658d9328df8ed957d1e074c9', class: `tds-spinner-svg tds-spinner-svg-${this.size}`, "aria-hidden": "true" }, h("circle", { key: 'ccf4e40860c20df27d693e2c613a965278ac1d6c', class: `tds-spinner-circle tds-spinner-circle-${this.variant}` }))));
     }
     static get is() { return "tds-spinner"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/stepper/step/step.js

@@ -40,7 +40,7 @@ export class TdsStep {
         }
     }
     render() {
-        return (h(Host, { key: 'f049d976121a1179979026cd3087ad459183de06' }, h("div", { key: '1f961578e8e54ffc9e0d0c2966c86e3e32f8ddd8', role: "listitem", "aria-disabled": this.state === 'upcoming' ? 'true' : 'false', "aria-current": this.tdsAriaCurrent, tabIndex: -1, "aria-label": `Step ${this.index}: ${this.state}`, class: `${this.size} ${this.orientation} text-${this.labelPosition} ${this.hideLabels ? 'hide-labels' : ''}` }, h("span", { key: 'f83033e0a0761227d911ac77cac9c64c31fe4c11', class: `${this.state} content-container` }, this.state === 'success' || this.state === 'error' ? (h("tds-icon", { "aria-hidden": "true", svgTitle: `tds-step-icon-${this.stepperId}`, class: 'tds-step-icon', name: this.state === 'success' ? 'tick' : 'warning', size: this.size === 'lg' ? '20px' : '16px' })) : (h("span", { "aria-hidden": "true", class: "index-container" }, this.index))), !this.hideLabels && (h("div", { key: '83c92f388cfebe37e0fb94c81d14adc391fbbbfa', "aria-hidden": "true", class: `label ${this.size} ${this.state}` }, h("slot", { key: '1c6381a25f8af42afe54c0c8eaff4090bf14ee80', name: "label" }))))));
+        return (h(Host, { key: '63f48cb400926167cb53d6913e1b0edac574c2dc' }, h("div", { key: 'a9483ebdd03951cf1828cdac06ef86cd6b4e27ba', role: "listitem", "aria-disabled": this.state === 'upcoming' ? 'true' : 'false', "aria-current": this.tdsAriaCurrent, tabIndex: -1, "aria-label": `Step ${this.index}: ${this.state}`, class: `${this.size} ${this.orientation} text-${this.labelPosition} ${this.hideLabels ? 'hide-labels' : ''}` }, h("span", { key: 'a23c61ecdf87f217d94264e93318de8020e30fc7', class: `${this.state} content-container` }, this.state === 'success' || this.state === 'error' ? (h("tds-icon", { "aria-hidden": "true", svgTitle: `tds-step-icon-${this.stepperId}`, class: 'tds-step-icon', name: this.state === 'success' ? 'tick' : 'warning', size: this.size === 'lg' ? '20px' : '16px' })) : (h("span", { "aria-hidden": "true", class: "index-container" }, this.index))), !this.hideLabels && (h("div", { key: '0366447fa1a632cc011de046eaf1577c30bca23f', "aria-hidden": "true", class: `label ${this.size} ${this.state}` }, h("slot", { key: '4cc352a04e2851c9517099a974451cc75ed4d87e', name: "label" }))))));
     }
     static get is() { return "tds-step"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/table-body/table-body.js

@@ -60,12 +60,12 @@ export class TdsTableBody {
         }
     }
     render() {
-        return (h(Host, { key: '22e2e49b6db83c7c71e1e674b3dbfcb1ffd04e66', "data-selected-rows": this.multiselectArrayJSON, class: {
+        return (h(Host, { key: '1a7e07924ed9f36b8c4359789148963ab3851ae7', "data-selected-rows": this.multiselectArrayJSON, class: {
                 'tds-table--zebra-mode-rows-odd': this.zebraMode === 'rows-odd',
                 'tds-table--zebra-mode-rows-even': this.zebraMode === 'rows-even',
                 'tds-table--zebra-mode-columns-odd': this.zebraMode === 'columns-odd',
                 'tds-table--zebra-mode-columns-even': this.zebraMode === 'columns-even',
-            } }, h("slot", { key: 'deb2aa129f332b48f7b9a38b0de25c2076fd86d9' })));
+            } }, h("slot", { key: 'a8da63114252a56f50b4823baf90a9eae0eb414b' })));
     }
     static get is() { return "tds-table-body"; }
     static get originalStyleUrls() {

package/dist/collection/components/table/table-body-cell/table-body-cell.js

@@ -83,13 +83,13 @@ export class TdsTableBodyCell {
             // Conditionally set padding style
             padding: paddingStyle,
         };
-        return (h(Host, { key: '726912df89435650c3ad1f39729fdff7d2a497e3', class: {
+        return (h(Host, { key: '353d08afb49ccbae4a9e96212491770089670eb1', 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, role: "cell" }, this.cellValue, h("slot", { key: 'ff6fb6613f29e94552916cfa75932b670e22ea80' })));
+            }, style: dynamicStyles, role: "cell" }, this.cellValue, h("slot", { key: 'f95a7ad598989fa63646a80a2cc30a46583e1f93' })));
     }
     static get is() { return "tds-body-cell"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/table-body-input-wrapper/table-body-input-wrapper.js

@@ -81,11 +81,11 @@ export class TdsTableBodyInputWrapper {
         }
     }
     render() {
-        return (h(Host, { key: '47496dfe7467e43cede5af53d6c30fe17c116eaf', class: {
+        return (h(Host, { key: '9fabe030017ee975b37b1d0c26adbffa092bb739', class: {
                 'focused-input-wrapper': this.inputFocused,
                 'show-icon': this.showIcon,
                 'tds-table__compact': this.compactDesign,
-            } }, this.renderSlot && h("slot", { key: 'ef7332417d9f9c0c2e2e9f4b030b84b0f67b251a', onSlotchange: () => this.handleSlotChange() }), this.showIcon && h("tds-icon", { key: '102e26b6821c0987244a7452341865259ce5f5d7', class: "edit-icon", slot: "icon", size: "16px", name: "edit" })));
+            } }, this.renderSlot && h("slot", { key: 'bf8e229f4e82bf5cfff7f10e6a42122c55c571a3', onSlotchange: () => this.handleSlotChange() }), this.showIcon && h("tds-icon", { key: '1f03e14af874769b376c3fb3c631791d80bb8eef', class: "edit-icon", slot: "icon", size: "16px", name: "edit" })));
     }
     static get is() { return "tds-table-body-input-wrapper"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/table-body-row/table-body-row.js

@@ -68,13 +68,13 @@ export class TdsTableBodyRow {
         }
     }
     render() {
-        return (h(Host, { key: 'e9e619ee732dc9d3f3f34cc47abf84ae1d194e1d', tabindex: this.clickable ? '0' : null, class: {
+        return (h(Host, { key: '7ba4597616440e7767243890c79864259f494809', tabindex: this.clickable ? '0' : null, class: {
                 'tds-table__row': true,
                 'tds-table__row--selected': this.selected,
                 'tds-table__compact': this.compactDesign,
                 'tds-table--divider': this.verticalDividers,
                 'tds-table__row--clickable': this.clickable,
-            }, onClick: (e) => this.handleRowClick(e), onKeyDown: (e) => this.handleKeyDown(e), role: "row" }, this.multiselect && (h("td", { key: 'b8be33901f5097ae612521cda831db3c5ff7334a', class: "tds-table__body-cell tds-table__body-cell--checkbox tds-form-label tds-form-label--table" }, h("tds-checkbox", { key: '62b918b9aca497c5187a90ffbe8a91ac3b83c1f5', onTdsChange: (event) => this.handleCheckboxChange(event), checked: this.selected, disabled: this.disabled }))), h("slot", { key: '570b47dae5bae13f75b7cab00a1b8b2c51912cd5' })));
+            }, onClick: (e) => this.handleRowClick(e), onKeyDown: (e) => this.handleKeyDown(e), role: "row" }, this.multiselect && (h("td", { key: 'd21a3062ed62bf5f3ecfbcf0fdecf09164b51a2f', class: "tds-table__body-cell tds-table__body-cell--checkbox tds-form-label tds-form-label--table" }, h("tds-checkbox", { key: 'c77ff16d0a994cc06ea7cb2268e519b86d64f085', onTdsChange: (event) => this.handleCheckboxChange(event), checked: this.selected, disabled: this.disabled }))), h("slot", { key: 'f17bed1fc5675e091e18d51745f654189773f11d' })));
     }
     static get is() { return "tds-table-body-row"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/table-body-row-expandable/table-body-row-expandable.js

@@ -101,26 +101,26 @@ export class TdsTableBodyRowExpandable {
         this.sendValue();
     }
     render() {
-        return (h(Host, { key: 'da3c577b253c47cd33ee07d3d028efd923fdb25d', class: {
+        return (h(Host, { key: 'ce2f0459371d7b5ae0e61850a023eb550ea1918b', class: {
                 'tds-table__row': true,
                 'tds-table__row-expand--active': this.isExpanded,
                 'tds-table__compact': this.compactDesign,
                 'tds-table--divider': this.verticalDividers,
-            } }, h("tr", { key: '7f97fa880a101483167624cfc75d522444ad0824', id: `expandable-content-${this.rowId}`, class: {
+            } }, h("tr", { key: '945cc2da086748eeb743c2b953cbc2439187ff2a', id: `expandable-content-${this.rowId}`, class: {
                 'tds-table__row': true,
                 'tds-table__row--expanded': this.isExpanded,
-            }, part: "row" }, h("td", { key: 'e51d8a91442882c1ae412d32524fdc7d1db32714', class: {
+            }, part: "row" }, h("td", { key: 'f6ef8298bf105ca9d2f3370f82ac374237b67a41', class: {
                 'tds-table__cell-expand': true,
-            } }, h("label", { key: '4ad4a3c78f1494f27874b305b1c04a4ed4a0bf5c', class: "tds-table__expand-control-container" }, h("input", { key: '853ffba9075c6b4e78f79fe965cb52a71b1db8dd', class: "tds-table__expand-input", type: "checkbox", onChange: (event) => this.onChangeHandler(event), checked: this.isExpanded, "aria-expanded": this.isExpanded ? 'true' : 'false', "aria-controls": `expandable-content-${this.rowId}`, "aria-label": this.tdsAriaLabelExpandButton }), h("span", { key: '870e9118534a8bd6772d3edc81ed6b58326ea56d', class: "tds-expendable-row-icon" }, h("svg", { key: 'a09133d67f9b768747da1c962e21107c0e6403c1', fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 32 32" }, h("path", { key: '32d527f58e37c9fd797fd8437eb55dd5ae65495b', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M4.273 9.783a1 1 0 0 1 1.415 0l9.888 9.888a.6.6 0 0 0 .848 0l9.888-9.888a1 1 0 1 1 1.415 1.414l-9.889 9.889a2.6 2.6 0 0 1-3.677 0l-9.888-9.889a1 1 0 0 1 0-1.414Z", fill: "currentColor" }))))), h("slot", { key: 'd4be14761d18b718cf976749771c3252b7f3d873' })), h("tr", { key: '58c0d4956ff101d90ac48efe2fe748efa1b4d6b9', class: {
+            } }, h("label", { key: '9952502bf560b48421ee37ae122ece5f0da3ef97', class: "tds-table__expand-control-container" }, h("input", { key: 'a7369527c6b2ef079837c63b22274dda8e62fefc', class: "tds-table__expand-input", type: "checkbox", onChange: (event) => this.onChangeHandler(event), checked: this.isExpanded, "aria-expanded": this.isExpanded ? 'true' : 'false', "aria-controls": `expandable-content-${this.rowId}`, "aria-label": this.tdsAriaLabelExpandButton }), h("span", { key: 'de8cc51db3ea6d5ff6936fe34664d5d96fc60ab3', class: "tds-expendable-row-icon" }, h("svg", { key: '62b247929999b2a01f05592826835bd70048d370', fill: "none", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 32 32" }, h("path", { key: '843c725fd0f9404752d4f4e7694c342f44f687c5', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M4.273 9.783a1 1 0 0 1 1.415 0l9.888 9.888a.6.6 0 0 0 .848 0l9.888-9.888a1 1 0 1 1 1.415 1.414l-9.889 9.889a2.6 2.6 0 0 1-3.677 0l-9.888-9.889a1 1 0 0 1 0-1.414Z", fill: "currentColor" }))))), h("slot", { key: '210f15581be86a7b1ec185eddb3127052011b5dd' })), h("tr", { key: 'e5093efd395986a9756d8642e9df1acf61102bae', class: {
                 'tds-table__row-expand': true,
                 'tds-table__row-expand--expanded': this.isExpanded,
-            }, part: "expand-row" }, h("td", { key: '29264749d12132c22ec96574eaeb8d2384ad653c', class: {
+            }, part: "expand-row" }, h("td", { key: 'e3c982507e9a9e9d188c546d28b2eaf1a35ea483', class: {
                 'tds-table__cell-expand': true,
                 'tds-table__cell-expand--overflow-hidden': this.overflow === 'hidden',
                 'tds-table__cell-expand--overflow-visible': this.overflow === 'visible',
-            }, part: "expand-row-cell", colSpan: this.columnsNumber }, h("div", { key: 'd11b97f03ac06b1f1d64c183619bf56e62b064e8', style: {
+            }, part: "expand-row-cell", colSpan: this.columnsNumber }, h("div", { key: 'f56682afa6d59fd03d42526859309e286458b539', style: {
                 overflow: this.overflow,
-            } }, h("slot", { key: 'c2feed89d38a97a47a0f07823ab4bca9bb8ae283', name: "expand-row" }))))));
+            } }, h("slot", { key: '722cbdebb09838b5e1ea045f6d3066d24368e419', name: "expand-row" }))))));
     }
     static get is() { return "tds-table-body-row-expandable"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/table-footer/table-footer.js

@@ -127,12 +127,12 @@ export class TdsTableFooter {
     }
     render() {
         var _a;
-        return (h(Host, { key: '7cfc3ea42663922b79d37538e0649c19ebc712ff', class: {
+        return (h(Host, { key: 'ef10157de8bd21d020eab709b8b1cfbd0497cf12', class: {
                 'tds-table--compact': this.compactDesign,
                 'footer__horizontal-scroll': !!this.horizontalScrollWidth,
-            }, style: this.getStyles() }, h("tr", { key: '3ad36497b515800372f57dcaf92589620d69b42b', class: "tds-table__footer-row" }, h("td", { key: '622408b38d7ea483d50283679d8ee9d3a42098aa', class: "tds-table__footer-cell", colSpan: this.columnsNumber }, this.pagination && (h("div", { key: '3f119143b7000a692b4b9575eae1bc0c7909d681', class: "tds-table__pagination" }, h("div", { key: '8c4a3e17f23a3febf61702aef85b9e2eb6588612', class: "tds-table__row-selector" }, this.rowsperpage && ((_a = this.rowsPerPageValues) === null || _a === void 0 ? void 0 : _a.length) > 0 && (h("div", { key: '04a80b602eb4af3cb4a5857152dfde0fc2763713', class: "rows-per-page" }, h("p", { key: '97e08ed3804491bbc8f3ed906fec42a02dfc4346' }, "Rows per page"), h("tds-dropdown", { key: 'df2b970e5175c21927fea11f22e991c50f998c25', modeVariant: "secondary", id: "rows-dropdown", class: "page-dropdown", size: "xs", defaultValue: `${this.rowsPerPageValues[0]}`, onTdsChange: (event) => this.rowsPerPageChange(event) }, this.rowsPerPageValues.map((value) => {
+            }, style: this.getStyles() }, h("tr", { key: '25987ea6cf6cdb1116fa1a18303553e168675a26', class: "tds-table__footer-row" }, h("td", { key: 'dc2e516eb866d3f8618593cb902b1616be26702e', class: "tds-table__footer-cell", colSpan: this.columnsNumber }, this.pagination && (h("div", { key: '1f72626867f49dd3dfb6a75d1c5c9ae442a5dca0', class: "tds-table__pagination" }, h("div", { key: '46c99c1e03eaa2c72b01b5476097f67542dcf873', class: "tds-table__row-selector" }, this.rowsperpage && ((_a = this.rowsPerPageValues) === null || _a === void 0 ? void 0 : _a.length) > 0 && (h("div", { key: '4126adc0bc4629e7f9244c5f74fa9c03b8ca9475', class: "rows-per-page" }, h("p", { key: '795fe282730d46353c66c3aca916760d7bf5ad56' }, "Rows per page"), h("tds-dropdown", { key: '43e70ffc5418c48d87fb69c7b070d84ac78b4a2e', modeVariant: "secondary", id: "rows-dropdown", class: "page-dropdown", size: "xs", defaultValue: `${this.rowsPerPageValues[0]}`, onTdsChange: (event) => this.rowsPerPageChange(event) }, this.rowsPerPageValues.map((value) => {
             return (h("tds-dropdown-option", { value: `${value}` }, value));
-        }))))), h("div", { key: '22ed5e4131d22d961f6742c8fa21c648b5738de5', class: "tds-table__page-selector" }, h("input", { key: 'bc43dd6fed5f554013872f9774c11da89be10a2f', ref: (element) => (this.inputElement = element), class: "tds-table__page-selector-input", type: "number", min: "1", max: this.pages, value: this.paginationValue, pattern: "[0-9]+", dir: "rtl", onChange: (event) => this.paginationInputChange(event), onAnimationEnd: removeShakeAnimation }), h("p", { key: '6c4ccd34133a5b14a8d3bbeb47a6c75c7604fcb0', class: "tds-table__footer-text" }, "of ", h("span", { key: 'c136a3bbb26e0d915d4a009c85b9b2c03f3cf018' }, this.pages), " pages"), h("button", { key: '16dafa158dc8181c56031cad5253a36104ae2df5', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue <= 1, onClick: () => this.firstPage() }, h("tds-icon", { key: 'f2a5edf16a2b164c2bd85801d2582f85c8d5aa22', name: "skip_backwards", size: "20px" })), h("button", { key: 'e7a73b61dfe85440cce8a76917bc68cde05241bd', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue <= 1, onClick: () => this.previousPage() }, h("tds-icon", { key: '55d7e648e0d731dec4e6aabe99d5e19a77d59d7b', name: "chevron_left", size: "20px" })), h("button", { key: '61856f668fed5d3085a9718204607f1e753fe7f1', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue >= this.pages, onClick: () => this.nextPage() }, h("tds-icon", { key: 'f468fde63814f4f906b85390979aed45163f6705', name: "chevron_right", size: "20px" })), h("button", { key: '35cfa4a7f8f680abb7a77c035f4cc8a7920e5d67', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue >= this.pages, onClick: () => this.lastPage() }, h("tds-icon", { key: '44dba6b889241055ce393f021b1b68cb7ed5e162', name: "skip_forward", size: "20px" })))))))));
+        }))))), h("div", { key: '8e5ad50f7acde8786633ae3e1bfc743e3dcff64c', class: "tds-table__page-selector" }, h("input", { key: 'fd91b13f5c9c9ef0a6ecce7613cf9e1805c90a60', ref: (element) => (this.inputElement = element), class: "tds-table__page-selector-input", type: "number", min: "1", max: this.pages, value: this.paginationValue, pattern: "[0-9]+", dir: "rtl", onChange: (event) => this.paginationInputChange(event), onAnimationEnd: removeShakeAnimation }), h("p", { key: '6a14f3235cf6d95e7b733b424c94a91304ea9a6e', class: "tds-table__footer-text" }, "of ", h("span", { key: 'b844edce0c9d68ba0a4b3bcf95be7b6acbb17616' }, this.pages), " pages"), h("button", { key: 'f808fa27c7ce60ec963355442550b2ee4b684254', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue <= 1, onClick: () => this.firstPage() }, h("tds-icon", { key: '8b795215e40ff0f5dffd3c053c791b9bc19035aa', name: "skip_backwards", size: "20px" })), h("button", { key: 'f30422518268f30195f8411b70c91dd58cd8ea3c', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue <= 1, onClick: () => this.previousPage() }, h("tds-icon", { key: '2d024cea17fd5a7e021fc0c7e244ffaecdb10062', name: "chevron_left", size: "20px" })), h("button", { key: 'c6e8733c92c9d36fe807916c1af69e2f0e3a9604', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue >= this.pages, onClick: () => this.nextPage() }, h("tds-icon", { key: '23e0c5bd4c97ded51a5d346e1492997dedf77fa5', name: "chevron_right", size: "20px" })), h("button", { key: '81fcc39bbf208f610d06151614c90fbd0bb1951e', type: "button", class: "tds-table__footer-btn", disabled: this.paginationValue >= this.pages, onClick: () => this.lastPage() }, h("tds-icon", { key: 'ce19da46b8345c9ceb69ff2e775a85d78ad3b6fb', name: "skip_forward", size: "20px" })))))))));
     }
     static get is() { return "tds-table-footer"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/table-header/table-header.js

@@ -82,11 +82,11 @@ export class TdsTableHeaderRow {
         });
     }
     render() {
-        return (h(Host, { key: '6f2fe80cd2493ad5c3bba50129c5d9f673e71897', class: {
+        return (h(Host, { key: '75f1971a9e5da0235c05bd6df404e00ef5e00ebe', class: {
                 'tds-table--compact': this.compactDesign,
                 'tds-table--divider': this.verticalDividers,
                 'tds-table--toolbar-available': this.enableToolbarDesign,
-            } }, h("tr", { key: 'b409f610aca3da5fa322e7e69f6efc06ab82165a' }, this.multiselect && (h("th", { key: '89e063b17bc2fa11ba2425b88d7a4896deef164d', class: "tds-table__header-cell tds-table__header-cell--checkbox" }, h("div", { key: 'eb44702a1169731a5587adaf7f4d0a28beb4b6db', class: "tds-form-label tds-form-label--table" }, h("tds-checkbox", { key: '5a3bb99a515fb6e87f39de70e530a67c10c3e2f7', checked: this.allSelected || this.selected, disabled: this.disabled, indeterminate: this.indeterminate, onTdsChange: (event) => this.handleCheckboxChange(event) })))), this.expandableRows && (h("th", { key: '8463b7990b37ffb6eb36eaffe9e3f3e159fdf5ba', class: "tds-table__header-cell tds-table__header-cell--checkbox" })), h("slot", { key: '2f31f807f5f3744ffe05c0eebac93c6c8374b046' }))));
+            } }, h("tr", { key: 'b5a11da2da4150e10670bd337d54a52ff374f0c4' }, this.multiselect && (h("th", { key: '4e3306cac508165e6275f1d25003ded464f46d96', class: "tds-table__header-cell tds-table__header-cell--checkbox" }, h("div", { key: '3a56745e002253a5c5600f84c1ca5079a7f3b337', class: "tds-form-label tds-form-label--table" }, h("tds-checkbox", { key: 'fdcaf57c308efe9fef3ac0769903cd0803b48b71', checked: this.allSelected || this.selected, disabled: this.disabled, indeterminate: this.indeterminate, onTdsChange: (event) => this.handleCheckboxChange(event) })))), this.expandableRows && (h("th", { key: 'fa98bc0ad7ae71ab5e0dc68aee1d75ca36b1e83a', class: "tds-table__header-cell tds-table__header-cell--checkbox" })), h("slot", { key: '0b5f62c41e92984f42db820a57a89be2f5a57993' }))));
     }
     static get is() { return "tds-table-header"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/table-header-cell/table-header-cell.js

@@ -113,7 +113,7 @@ export class TdsTableHeaderCell {
         return 'none';
     }
     render() {
-        return (h(Host, { key: '9306f586f70affe65e63f3c7545285cf58e05a92', class: {
+        return (h(Host, { key: '18922f48d3b403ee3e1f244ddcc6a56f5cbd3ac2', class: {
                 'tds-table__header-cell': true,
                 'tds-table__header-cell--sortable': this.sortable,
                 'tds-table__header-cell--is-sorted': this.sortedByMyKey,

package/dist/collection/components/table/table-header-input-wrapper/table-header-input-wrapper.js

@@ -63,7 +63,7 @@ export class TdsTableHeaderInputWrapper {
         }
     }
     render() {
-        return (h(Host, { key: '5a8057029e82d223a8174544fd374b8e3151d624', class: {
+        return (h(Host, { key: '13e05f7cd1dbe0a06611ffacc4e4b842d6469eba', class: {
                 'focused-input-wrapper': this.inputFocused,
                 'show-icon': this.showIcon,
                 'tds-table__compact': this.compactDesign,

package/dist/collection/components/table/table-toolbar/table-toolbar.js

@@ -68,10 +68,10 @@ export class TdsTableToolbar {
         return styles;
     }
     render() {
-        return (h(Host, { key: '7cf6fffdb988f525b5ff9fca25588f2b4770f9df', class: {
+        return (h(Host, { key: '7b33de1426988b4bf97d3856c135945859783b6f', class: {
                 'tds-table--compact': this.compactDesign,
                 'toolbar__horizontal-scroll': !!this.horizontalScrollWidth,
-            }, style: this.getStyles(), "aria-labelledby": "table-toolbar-title" }, h("div", { key: 'd071dcc92ba9d045c7322eec7bde32afc16616d6', class: "tds-table__upper-bar-flex" }, h("div", { key: '9cee0628c8c81614fb43ec2453644f7dd5001f54', class: "tds-table__actionbar-left" }, this.tableTitle && (h("caption", { key: '90949e76eb225021d4dd9645968bd544b6ec9e71', id: "table-toolbar-title", class: "tds-table__title" }, this.tableTitle)), h("slot", { key: 'fe27e4a5f5fb81040deb6df122fafa9172fc2c54', name: "start" })), h("div", { key: '2d146dfb716542c6c44a67404e2b537dfd730887', class: "tds-table__actionbar" }, this.filter && (h("div", { key: 'a2aee3c2a1dc9873c66e9e916af036a5e4851cf5', class: "tds-table__searchbar" }, h("input", { key: 'a8d9cc52b1e90d43ef9be1d198962d2c8bc54ea8', class: "tds-table__searchbar-input", type: "text", onKeyUp: (event) => this.handleSearch(event), "aria-label": this.tdsSearchAriaLabel }), h("span", { key: '77bf8cff14864f3f36a2e94d34cbcbba361b700c', class: "tds-table__searchbar-icon" }, h("tds-icon", { key: 'a4de427ffa05d9d08b183ecedfd6105abe9d9e35', name: "search", size: "20px" })))), h("slot", { key: '95c49753b2cc07b4dc211dc8b18ae88eb1170838', name: "end" })))));
+            }, style: this.getStyles(), "aria-labelledby": "table-toolbar-title" }, h("div", { key: '7c176540ee9476479de7a818de7f46258c94142d', class: "tds-table__upper-bar-flex" }, h("div", { key: '95eef4de54dd8d5507354f695b8420a4951f4c1b', class: "tds-table__actionbar-left" }, this.tableTitle && (h("caption", { key: 'c58973635367598d3f8b4a52881003157381d94a', id: "table-toolbar-title", class: "tds-table__title" }, this.tableTitle)), h("slot", { key: 'e39d96b2f21a7f1645041acbd99b618debde089e', name: "start" })), h("div", { key: '24df42114518c53b2ed16376272207d02a8631d8', class: "tds-table__actionbar" }, this.filter && (h("div", { key: '58860c836dfd8baecb98f9ee494c34a542bde347', class: "tds-table__searchbar" }, h("input", { key: '418e9cbc47efa12dbef046b08adb4ef676b1b9ca', class: "tds-table__searchbar-input", type: "text", onKeyUp: (event) => this.handleSearch(event), "aria-label": this.tdsSearchAriaLabel }), h("span", { key: '6c090c782535c42fd0e7ccd439835f550ddfaa0b', class: "tds-table__searchbar-icon" }, h("tds-icon", { key: 'e0e115652f69cc8a39d77b2e81f94e7789d868e6', name: "search", size: "20px" })))), h("slot", { key: '50e519e153bcb2d3a56303171e9db06c47735dd6', name: "end" })))));
     }
     static get is() { return "tds-table-toolbar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tabs/folder-tabs/folder-tab/folder-tab.js

@@ -35,10 +35,10 @@ export class TdsFolderTab {
         }
     }
     render() {
-        return (h(Host, { key: '584a1fcf43299d27e3fb2150214830c7964e3895', "aria-selected": this.selected }, h("div", { key: 'ed0f0d8acafaf35c36a22d34ef4c9ac240ba5311', class: {
+        return (h(Host, { key: '905e43147cabbdb2bbdf3e9fc934767e2c1fc429', "aria-selected": this.selected }, h("div", { key: '76d42a91d3af1425a33a5cc15bef5d6f721a4c96', class: {
                 selected: this.selected,
                 disabled: this.disabled,
-            }, style: { width: `${this.tabWidth}px` } }, h("slot", { key: 'ac2fb5ed4062e9e83297e9a6c2f3ea6b9f514b06' }))));
+            }, style: { width: `${this.tabWidth}px` } }, h("slot", { key: '5d8577fbb00f65b69a6431dc69679cb7c2e9b784' }))));
     }
     static get is() { return "tds-folder-tab"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tabs/folder-tabs/folder-tabs.js

@@ -162,9 +162,9 @@ export class TdsFolderTabs {
         this.removeEventListenerFromTabs();
     }
     render() {
-        return (h(Host, { key: 'f97a75dc1b7bf12757a7e96e4075387c27459e7e', role: "tablist", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: '92299f0dc356d448d901569d314fa6afaa21fdb1', class: "wrapper", ref: (el) => {
+        return (h(Host, { key: '3a004f2892daa4ecf795bfbb6194cc8ea7b9c89a', role: "tablist", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: '50a4ece90a4b78b00623b61c509e5ec2f2ab7da3', class: "wrapper", ref: (el) => {
                 this.navWrapperElement = el;
-            } }, h("button", { key: 'f00e92acb5a9071173c25d2c8334fa32cc32cca8', "aria-label": this.tdsScrollLeftAriaLabel, class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, disabled: !this.showLeftScroll, onClick: () => this.scrollLeft() }, h("tds-icon", { key: 'eb113eeecf5c89a9b6e3e3c4306f3557c574b3e7', name: "chevron_left", size: "20px" })), h("slot", { key: '4136a2b52af81b9406cffc74a6ad84f428d18273', onSlotchange: () => this.handleSlotChange() }), h("button", { key: '0d5177b9eff827616a3252992a6dc7e79e58f5e1', "aria-label": this.tdsScrollRightAriaLabel, class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, disabled: !this.showRightScroll, onClick: () => this.scrollRight() }, h("tds-icon", { key: 'a575af766f02d2427760aa1f5911e63f32c28d1d', name: "chevron_right", size: "20px" })))));
+            } }, h("button", { key: '90dc518ee3e0d6cd812f8a422d56df7194c53f31', "aria-label": this.tdsScrollLeftAriaLabel, class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, disabled: !this.showLeftScroll, onClick: () => this.scrollLeft() }, h("tds-icon", { key: '66e45376ed912abc63b581b5439bf6f84e1199eb', name: "chevron_left", size: "20px" })), h("slot", { key: 'd1ec9259a6e3d6e5776fdab80395491c3e771ae7', onSlotchange: () => this.handleSlotChange() }), h("button", { key: 'b85b5f3006673aa67a3c87094b31a8cae7646109', "aria-label": this.tdsScrollRightAriaLabel, class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, disabled: !this.showRightScroll, onClick: () => this.scrollRight() }, h("tds-icon", { key: 'eef334c52ec845dea3b7473a4b84b7a3cb053846', name: "chevron_right", size: "20px" })))));
     }
     static get is() { return "tds-folder-tabs"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tabs/inline-tabs/inline-tab/inline-tab.js

@@ -30,11 +30,11 @@ export class TdsInlineTab {
         }
     }
     render() {
-        return (h(Host, { key: 'a907b7c8f2bfcf9f4930fef152a9b6cb8b63c090', "aria-selected": this.selected }, h("div", { key: '6401ba8aaccdf59aaf457d3c6684e1f98119d25b', class: {
+        return (h(Host, { key: 'da941abad830e5fb5db0004d66b05fb1d53f1d26', "aria-selected": this.selected }, h("div", { key: '7ab6002c424dda4e25513164bb6d1dd04607cbf0', class: {
                 'inline-tab-item': true,
                 'selected': this.selected,
                 'disabled': this.disabled,
-            } }, h("slot", { key: '6bca555b29cac021978fcb5c9feacbc014c731b1' }))));
+            } }, h("slot", { key: '1dfbfd01d9a0e8dff97b5d5af4a136765b99dcff' }))));
     }
     static get is() { return "tds-inline-tab"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tabs/inline-tabs/inline-tabs.js

@@ -169,9 +169,9 @@ export class TdsInlineTabs {
         this.removeEventListenerFromTabs();
     }
     render() {
-        return (h(Host, { key: 'ffa1e0a85855080f19e5beadf00dd608728574f1', role: "tablist", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: '98bc41d5bc921882facd666c207e57c1d5b1a087', class: "wrapper", ref: (el) => {
+        return (h(Host, { key: '7ea7321faa7f49a67383dfd9629d2ee679a004fc', role: "tablist", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: '294c6e7522ca34a4eae1bd379870af84e72366f9', class: "wrapper", ref: (el) => {
                 this.navWrapperElement = el;
-            }, style: { paddingLeft: `${this.leftPadding}px` } }, h("button", { key: 'd500b299f2758ec13c4451859c51e9a961c42039', "aria-label": this.tdsScrollLeftAriaLabel, class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, h("tds-icon", { key: 'd84805f953384f3f59ec26ff74b79b84885bb4d4', name: "chevron_left", size: "20px" })), h("slot", { key: 'd392fafeb4bf2f7bb129a2e55eddee128ebd2ce7', onSlotchange: () => this.handleSlotChange() }), h("button", { key: 'ceada0ebd126600199b675bc5251762e29f6b4d6', "aria-label": this.tdsScrollRightAriaLabel, class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, h("tds-icon", { key: '9175ce89c1c65a3ab7cd779483020555161e530f', name: "chevron_right", size: "20px" })))));
+            }, style: { paddingLeft: `${this.leftPadding}px` } }, h("button", { key: 'e932cd2540b51a1a452b11c1d0630a68d79d818f', "aria-label": this.tdsScrollLeftAriaLabel, class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, h("tds-icon", { key: 'de83215d0aa0526d6bc6f37fe922b1e0b79b9fe9', name: "chevron_left", size: "20px" })), h("slot", { key: '187bb660c592992e98ce1eb73671e641e7f25642', onSlotchange: () => this.handleSlotChange() }), h("button", { key: '0285a00869154edba228b473609f555964570690', "aria-label": this.tdsScrollRightAriaLabel, class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, h("tds-icon", { key: '2e7fccd7823e47105248ee1e97aba623409f7e3c', name: "chevron_right", size: "20px" })))));
     }
     static get is() { return "tds-inline-tabs"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tabs/navigation-tabs/navigation-tab/navigation-tab.js

@@ -30,8 +30,8 @@ export class TdsNavigationTab {
         }
     }
     render() {
-        return (h(Host, { key: 'dc5a2d7616f927f2519664e4f98674b995889789' }, h("div", { key: '0a6aab0c2eeb77b1376a0d0abfbd4d825cf9449e', class: `navigation-tab-item  ${this.selected ? 'selected' : ''}
-           ${this.disabled ? 'disabled' : ''}` }, h("slot", { key: '6525c55249fb9fff0db0b1fc8140339f7550e838' }))));
+        return (h(Host, { key: 'b4cd140a8267485566719cd26c66ae2e9a0a6b5c' }, h("div", { key: 'd8f94aca25079426436da1918d9e0ef1c6e94560', class: `navigation-tab-item  ${this.selected ? 'selected' : ''}
+           ${this.disabled ? 'disabled' : ''}` }, h("slot", { key: '95a56fbbb701726994b5dc91309401f5d70aee36' }))));
     }
     static get is() { return "tds-navigation-tab"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tabs/navigation-tabs/navigation-tabs.js

@@ -169,15 +169,15 @@ export class TdsNavigationTabs {
         this.removeEventListenerFromTabs();
     }
     render() {
-        return (h(Host, { key: '510a2d554f93a011f5281730aa6ef7a91112f683', role: "tablist", class: { [`tds-mode-variant-${this.modeVariant}`]: this.modeVariant !== null } }, h("div", { key: '56cebbe8cc41c197c5c0ff521e3cad213355907c', class: "wrapper", ref: (el) => {
+        return (h(Host, { key: 'c05fdc4edba8e4863a01a8f8ddfb612d836d015e', role: "tablist", class: { [`tds-mode-variant-${this.modeVariant}`]: this.modeVariant !== null } }, h("div", { key: '5a19c88129168e18bbf0e9c01d75536e38f3f9cb', class: "wrapper", ref: (el) => {
                 this.navWrapperElement = el;
-            }, style: { paddingLeft: `${this.leftPadding}px` } }, h("button", { key: '74a5fb3b9b09987d7e9f368ecdf4dc3af49e9128', "aria-label": this.tdsScrollLeftAriaLabel, class: {
+            }, style: { paddingLeft: `${this.leftPadding}px` } }, h("button", { key: '479fa60c5acda8497eb76e14377c3bd58e374c8b', "aria-label": this.tdsScrollLeftAriaLabel, class: {
                 'scroll-left-button': true,
                 'show': this.showLeftScroll,
-            }, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, h("tds-icon", { key: 'a14c88213417a161d90cb3db00105c63e5aab2e0', name: "chevron_left", size: "20px" })), h("slot", { key: 'c8eb07f136a9057a7962957a0bcc8bf1ababb579', onSlotchange: () => this.handleSlotChange() }), h("button", { key: '7a681cbdbacc3f2e536035910d3f486cdff738f0', "aria-label": this.tdsScrollRightAriaLabel, class: {
+            }, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, h("tds-icon", { key: '2966dfb37f0912fe60e5528736a505043a7060cf', name: "chevron_left", size: "20px" })), h("slot", { key: 'b73673566f5cd2834590b5283fa82e83c61c35ec', onSlotchange: () => this.handleSlotChange() }), h("button", { key: '85e4ea10f52b287116195226a379722fad59a880', "aria-label": this.tdsScrollRightAriaLabel, class: {
                 'scroll-right-button': true,
                 'show': this.showRightScroll,
-            }, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, h("tds-icon", { key: '93e3d0530d4402b249f8f3da4541bac913b15ff6', name: "chevron_right", size: "20px" })))));
+            }, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, h("tds-icon", { key: '987796cbfbddd0b1f998526da9923884440e0c11', name: "chevron_right", size: "20px" })))));
     }
     static get is() { return "tds-navigation-tabs"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/text-field/text-field.css

@@ -1,6 +1,35 @@
 /* Typography Usage mixins */
 /* Centralized map of typography types */
 /* Utility mixin */
+/* Typography Usage mixins */
+/* Centralized map of typography types */
+/* Utility mixin */
+:host {
+  --tds-scrollbar-width-standard: thin;
+  --tds-scrollbar-width: 10px;
+  --tds-scrollbar-height: 10px;
+  --tds-scrollbar-thumb-border-width: 3px;
+  --tds-scrollbar-thumb-border-hover-width: 2px;
+}
+
+body {
+  scrollbar-width: thin;
+}
+
+@keyframes tds-shake-animation {
+  10%, 90% {
+    transform: translate3d(-1px, 0, 0);
+  }
+  20%, 80% {
+    transform: translate3d(2px, 0, 0);
+  }
+  30%, 50%, 70% {
+    transform: translate3d(-4px, 0, 0);
+  }
+  40%, 60% {
+    transform: translate3d(4px, 0, 0);
+  }
+}
 .text-field-input {
   all: unset;
   border-radius: var(--text-field-border-radius);

package/dist/collection/components/text-field/text-field.js

@@ -76,7 +76,7 @@ export class TdsTextField {
         var _a;
         const usesPrefixSlot = hasSlot('prefix', this.host);
         const usesSuffixSlot = hasSlot('suffix', this.host);
-        return (h("div", { key: 'a7034149f1d340077c362924a96dea0e3d910174', class: {
+        return (h("div", { key: '8755d2f9fbbae4ba86587d0ff759b303a8933c87', class: {
                 'form-text-field': true,
                 'form-text-field-nomin': this.noMinWidth,
                 'text-field-focus': this.focusInput && !this.disabled,
@@ -94,12 +94,12 @@ export class TdsTextField {
                 'form-text-field-sm': this.size === 'sm',
                 'form-text-field-error': this.state === 'error',
                 'form-text-field-success': this.state === 'success',
-            } }, this.labelPosition === 'outside' && (h("div", { key: '711e4ae521ba6719f60857284b26e15a722b4503', class: "text-field-label-outside" }, h("label", { key: 'c4293a6bedb427dd5ee2ee3b5e8a74fe547fc402', htmlFor: `text-field-input-element-${this.uuid}` }, this.label))), h("div", { key: 'a3d2697898eab72ce3019970affca5325eecf60c', onClick: () => this.textInput.focus(), class: "text-field-container" }, usesPrefixSlot && (h("div", { key: '97eddc6db8b78040d23fc93f87130934031e7292', class: {
+            } }, this.labelPosition === 'outside' && (h("div", { key: '5ea1087cce259d7fa7831520cfad2b61eb2b6977', class: "text-field-label-outside" }, h("label", { key: 'aa93180025a17cdd68c53a62c0f92d9c608a2fd4', htmlFor: `text-field-input-element-${this.uuid}` }, this.label))), h("div", { key: '7eea38fdd39d7a5d409595eff4831352316bbd06', onClick: () => this.textInput.focus(), class: "text-field-container" }, usesPrefixSlot && (h("div", { key: 'bf93437bf95aefc5c458182bffdc28bae2e39204', class: {
                 'text-field-slot-wrap-prefix': true,
                 'text-field-error': this.state === 'error',
                 'text-field-success': this.state === 'success',
                 'text-field-default': this.state === 'default',
-            } }, h("slot", { key: 'fe5190eb82d0424e392d31fdf178630218eab87f', name: "prefix" }))), h("div", { key: 'dbbb4000d41a088793f69fe0e50671af3f9e3c3c', class: "text-field-input-container" }, h("input", { key: '549b76c06d00bff3ec358275928d59b0bb96c186', ref: (inputEl) => {
+            } }, h("slot", { key: '1c29047bfcce9bc92bab6d0805a4490fb8f3b1b0', name: "prefix" }))), h("div", { key: '2c3eb1a0a58deecf78ae84c040e34ca26b891dee', class: "text-field-input-container" }, h("input", { key: 'cd537efca0ae390d6a72f5d17df89c5b9e79872a', ref: (inputEl) => {
                 this.textInput = inputEl;
             }, class: {
                 'text-field-input': true,
@@ -114,16 +114,16 @@ export class TdsTextField {
                 if (!this.readOnly) {
                     this.handleBlur(event);
                 }
-            }, "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label, "aria-describedby": `text-field-helper-element-${this.uuid}`, "aria-readonly": this.readOnly, id: `text-field-input-element-${this.uuid}` }), this.labelPosition === 'inside' && this.size !== 'sm' && (h("label", { key: '0c88d0caca0b0681af69dffbc7bd427de04cb17d', class: {
+            }, "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label, "aria-describedby": `text-field-helper-element-${this.uuid}`, "aria-readonly": this.readOnly, id: `text-field-input-element-${this.uuid}` }), this.labelPosition === 'inside' && this.size !== 'sm' && (h("label", { key: 'd211a62fdc2f3eb1d343eb27dd728554132a6664', class: {
                 'text-field-label-inside': true,
                 'text-field-label-inside-placeholder': this.placeholder === '',
-            }, htmlFor: `text-field-input-element-${this.uuid}` }, this.label))), usesSuffixSlot && (h("div", { key: 'fa00ee8a8dc53b674c77073e64f76ca07719f154', class: {
+            }, htmlFor: `text-field-input-element-${this.uuid}` }, this.label))), usesSuffixSlot && (h("div", { key: '189eecde9dace623bf724220ac1c9fc3f024c7a3', class: {
                 'text-field-slot-wrap-suffix': true,
                 'text-field-error': this.state === 'error',
                 'text-field-success': this.state === 'success',
                 'text-field-default': this.state === 'default',
                 'tds-u-display-none': this.readOnly,
-            } }, h("slot", { key: 'cf68556452cba54c5ce502ea26e6ac5962613521', name: "suffix" }))), this.readOnly && !this.hideReadOnlyIcon && (h("span", { key: '4f37f24e66e33db77892fb7dfe1014c9ef2a8da9', class: "text-field-icon__readonly" }, h("tds-tooltip", { key: '2ea44f621df38ca45d069d20460eddde5806b046', placement: "top-end", text: "This field is non-editable", selector: "#readonly-tooltip" }), h("tds-icon", { key: '7600bca41d29b320b08bb63d2f5db64db05df6e6', id: "readonly-tooltip", name: "edit_inactive", size: "20px" })))), h("div", { key: 'ad558d2263e7120319e05e0b3fba707c8871153c', class: "text-field-bar" }), h("div", { key: '09fadc6e812970a39b1b9526ec5cfaa443359946', "aria-live": "assertive" }, (this.helper || this.maxLength > 0) && (h("div", { key: '5f4d574d9bee1765d78deac6cae96bc3de64f67b', class: "text-field-helper", id: `text-field-helper-element-${this.uuid}` }, this.state === 'error' && (h("div", { key: 'd269519996cff54f5abf05a074e5b14a5ba6e717', class: "text-field-helper-error-state" }, !this.readOnly && h("tds-icon", { key: '139b181c13b213906c6d8afa1505083dc1e3f6ca', name: "error", size: "16px" }), this.helper)), this.state !== 'error' && this.helper, !this.readOnly && this.maxLength > 0 && (h("span", { key: '07d91f398252d0e58ef2eb40306e9dca34b7e66b', class: {
+            } }, h("slot", { key: '14aba4f9a131fed1b71317dc6e167923fc4dfb30', name: "suffix" }))), this.readOnly && !this.hideReadOnlyIcon && (h("span", { key: '923b49e0906c68e29e4d2ef7f0f74a52a29d0c9d', class: "text-field-icon__readonly" }, h("tds-tooltip", { key: '30651b869b7618edfc99d70da97386a875a456f0', placement: "top-end", text: "This field is non-editable", selector: "#readonly-tooltip" }), h("tds-icon", { key: 'e9d4f090f8de0be64567e21ff998bd9c152f69e8', id: "readonly-tooltip", name: "edit_inactive", size: "20px" })))), h("div", { key: '8b04bf35b202ae1023025bf84eaf2b185f1511ec', class: "text-field-bar" }), h("div", { key: 'd607d23d4f3559e9655cf65b4146ade9cec96174', "aria-live": "assertive" }, (this.helper || this.maxLength > 0) && (h("div", { key: 'e6bd818f42a23ba0b9e23c6379748efd2c80faae', class: "text-field-helper", id: `text-field-helper-element-${this.uuid}` }, this.state === 'error' && (h("div", { key: '6646975561f9f59017b648f50cf7384bdbced8b2', class: "text-field-helper-error-state" }, !this.readOnly && h("tds-icon", { key: 'ff633a41fec84da6b59ee3896d4cd7e60932c9e6', name: "error", size: "16px" }), this.helper)), this.state !== 'error' && this.helper, !this.readOnly && this.maxLength > 0 && (h("span", { key: '01295a87689d2a535b86d1f83753958adb0a3a3b', class: {
                 'text-field-textcounter-divider': true,
                 'text-field-textcounter-disabled': this.disabled,
             } }, this.value === null ? 0 : (_a = this.value) === null || _a === void 0 ? void 0 : _a.length, " / ", this.maxLength)))))));

package/dist/collection/components/textarea/textarea.css

@@ -1,6 +1,32 @@
 /* Typography Usage mixins */
 /* Centralized map of typography types */
 /* Utility mixin */
+:host {
+  --tds-scrollbar-width-standard: thin;
+  --tds-scrollbar-width: 10px;
+  --tds-scrollbar-height: 10px;
+  --tds-scrollbar-thumb-border-width: 3px;
+  --tds-scrollbar-thumb-border-hover-width: 2px;
+}
+
+body {
+  scrollbar-width: thin;
+}
+
+@keyframes tds-shake-animation {
+  10%, 90% {
+    transform: translate3d(-1px, 0, 0);
+  }
+  20%, 80% {
+    transform: translate3d(2px, 0, 0);
+  }
+  30%, 50%, 70% {
+    transform: translate3d(-4px, 0, 0);
+  }
+  40%, 60% {
+    transform: translate3d(4px, 0, 0);
+  }
+}
 .textarea-container {
   border-radius: var(--textarea-border-radius);
   position: relative;
@@ -221,6 +247,7 @@
 
 .textarea-disabled {
   cursor: not-allowed;
+  background-color: var(--textarea-disabled-background);
 }
 .textarea-disabled .textarea-input {
   box-shadow: var(--textarea-box-shadow-disabled);