@scania/tegel 1.24.0-value-prop.beta.6 → 1.25.0-beta.0

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: '733f9d487fd530eea4b597368c5ecdc46fd8dedd', class: {
+        return (h(Host, { key: '04c6b46892b719c0f66525ddcacae57dceb3b9ff', 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

@@ -63,10 +63,10 @@ export class TdsTableToolbar {
         return styles;
     }
     render() {
-        return (h(Host, { key: 'c3488722c0a27313efa13acafeab81ca23c6c765', class: {
+        return (h(Host, { key: '6350a9feb5812921105edb7bb5951d03d0c32a24', class: {
                 'tds-table--compact': this.compactDesign,
                 'toolbar__horizontal-scroll': !!this.horizontalScrollWidth,
-            }, style: this.getStyles() }, h("div", { key: '688e2903c9b447cb0770a8ee15dc8d1c4d3608d3', class: "tds-table__upper-bar-flex" }, h("caption", { key: 'a9c57a3b3cdbc61d7176163310cd8acda8ed58a2', class: "tds-table__title" }, this.tableTitle), h("div", { key: 'ae28004762b94923faa433a9f13245ab8595493b', class: "tds-table__actionbar" }, this.filter && (h("div", { key: '0d85e682ee8a733fc61df0855ed1a56bd7356069', class: "tds-table__searchbar" }, h("input", { key: '50b9c945f34cb13d440ed448f8be58ea2900f9f7', class: "tds-table__searchbar-input", type: "text", onKeyUp: (event) => this.handleSearch(event) }), h("span", { key: 'eff520922329f0379f22cb31171b81887c6bbdf7', class: "tds-table__searchbar-icon" }, h("tds-icon", { key: '09c7d084aed40ec2a3a25dc1ca86d978b8ef39ec', name: "search", size: "20px" })))), h("slot", { key: '1b7dc61ec5ec9d5ac7e5ea116cedfd6a773d5628', name: "end" })))));
+            }, style: this.getStyles() }, h("div", { key: '1cb6c95719546ea0bbde729e6b26ab34dd3ae55f', class: "tds-table__upper-bar-flex" }, h("caption", { key: '37ca396778dbe93ca622564f4374a0561348c243', class: "tds-table__title" }, this.tableTitle), h("div", { key: 'aa129f0aca461d85dfad97fa0682975787512d53', class: "tds-table__actionbar" }, this.filter && (h("div", { key: '447cd5e4ad047f1424180e7456093b43f5b23e09', class: "tds-table__searchbar" }, h("input", { key: 'c9798ebec2c279516f34bb8c25912e7959c3abfd', class: "tds-table__searchbar-input", type: "text", onKeyUp: (event) => this.handleSearch(event) }), h("span", { key: 'a6c16f3162e654aff742634a4bb77eb8a886fbad', class: "tds-table__searchbar-icon" }, h("tds-icon", { key: 'c1bcb6cfa93140a3e1b2cced582cdb62eb184623', name: "search", size: "20px" })))), h("slot", { key: 'fd86cec3c8e2cbd8c0198005883c1d2b64acd51b', 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

@@ -17,8 +17,10 @@ export class TdsFolderTab {
         this.selected = selected;
     }
     render() {
-        return (h(Host, { key: '37ae53ec0d9c0bc3674365d14d61c6b1fbafe168', role: "listitem" }, h("div", { key: 'a977243b499569668ef7428829644f3f2ca23033', class: `${this.disabled ? 'disabled' : ''}
-                  ${this.selected ? 'selected' : ''}`, style: { width: `${this.tabWidth}px` } }, h("slot", { key: '1e8b9cc10f032a64ffef70bb061f57ddc8a4a1a5' }))));
+        return (h(Host, { key: '919cd453da1e3649fb5da8783ab8fabc47322d47', role: "listitem" }, h("div", { key: 'f00bf3eea1ee0d670d8989e23e27d6c54fbe7c17', class: {
+                selected: this.selected,
+                disabled: this.disabled,
+            }, style: { width: `${this.tabWidth}px` } }, h("slot", { key: '3e3bd62fd02c922fa0592dc0f2dae5a8b49d6c4c' }))));
     }
     static get is() { return "tds-folder-tab"; }
     static get encapsulation() { return "shadow"; }

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

@@ -160,9 +160,9 @@ export class TdsFolderTabs {
         this.removeEventListenerFromTabs();
     }
     render() {
-        return (h(Host, { key: '3164044436f7029d85c4eed0ff7e0cc2b4e35752', role: "list", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: '59beaa0776ff83a30e84b69c5715a2f0d62ec6d9', class: "wrapper", ref: (el) => {
+        return (h(Host, { key: '19b773750f13304194341caf79242c7be95b41be', role: "list", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: '915b525f1d8fc67f3edf82f0841ea89cfd8424bc', class: "wrapper", ref: (el) => {
                 this.navWrapperElement = el;
-            } }, h("button", { key: '0bd461d469592983e08043c23e295c21df04c80f', class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, disabled: !this.showLeftScroll, onClick: () => this.scrollLeft() }, h("tds-icon", { key: 'd21448eea9cab4d73087fec72d29270b52bf0999', name: "chevron_left", size: "20px" })), h("slot", { key: 'efe348a98b964486a73d1aac235ce894277c6249', onSlotchange: () => this.handleSlotChange() }), h("button", { key: 'ea819f59668994e328410941b5b7455620ecb321', class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, disabled: !this.showRightScroll, onClick: () => this.scrollRight() }, h("tds-icon", { key: 'c52241bb7c77eabbdb8de5a19bb4400c32aa2062', name: "chevron_right", size: "20px" })))));
+            } }, h("button", { key: '806f5ce973b4b9bf842ae4c3fdf42c6160255db4', class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, disabled: !this.showLeftScroll, onClick: () => this.scrollLeft() }, h("tds-icon", { key: '4762c8fcfb5f7bb9a67ce2515fc3cab557180ca8', name: "chevron_left", size: "20px" })), h("slot", { key: '498f04374cb1ad240df2a6e02830eba9bc6c3c8d', onSlotchange: () => this.handleSlotChange() }), h("button", { key: '47f114815e98c22f26b021df2b5f53f4498ba24b', class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, disabled: !this.showRightScroll, onClick: () => this.scrollRight() }, h("tds-icon", { key: 'b4f3a0e137c84b996bdf7eb7e497e788637ac401', 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

@@ -12,8 +12,11 @@ export class TdsInlineTab {
         this.selected = selected;
     }
     render() {
-        return (h(Host, { key: 'd15c7d658b9f90d01743d8f4fe6d14714a73e3f8', role: "listitem" }, h("div", { key: 'cc3324aa2ee065c9c9fd78c0e55c5c096a975d4d', class: `inline-tab-item  ${this.selected ? 'selected' : ''}
-           ${this.disabled ? 'disabled' : ''}` }, h("slot", { key: '68bed317582717cb72d40f6b91d304a3a3df9d47' }))));
+        return (h(Host, { key: '4bb1d313b0d2b7e3bc612474201b0a3e06dd6555', role: "listitem" }, h("div", { key: 'c49a2745c5c6de9276807e670c9886130f5e5dbd', class: {
+                'inline-tab-item': true,
+                'selected': this.selected,
+                'disabled': this.disabled,
+            } }, h("slot", { key: 'caa1851fd0a992f38e04fb4872e52c90a3731e6a' }))));
     }
     static get is() { return "tds-inline-tab"; }
     static get encapsulation() { return "shadow"; }

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

@@ -167,9 +167,9 @@ export class TdsInlineTabs {
         this.removeEventListenerFromTabs();
     }
     render() {
-        return (h(Host, { key: '71f42e22f75a1fe4ca4f906b2151ed1a4c324e51', role: "list", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: '33e457be72862e642f2a867243f6325f94d210e8', class: "wrapper", ref: (el) => {
+        return (h(Host, { key: 'cd482509c07b6074d81a35eb9447ef561ce7c84a', role: "list", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: '63590b1fec8637f1000897f62962dae2efdcc05d', class: "wrapper", ref: (el) => {
                 this.navWrapperElement = el;
-            }, style: { paddingLeft: `${this.leftPadding}px` } }, h("button", { key: '786a1655c5efe5f2a079c62cb89300a99149c3fb', class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, h("tds-icon", { key: 'df2f3798cb6cb4ea446932cdf8ce84ac068c57ff', name: "chevron_left", size: "20px" })), h("slot", { key: 'b5e14ca573a2ac7a4e20defd05b412a941e72f0b', onSlotchange: () => this.handleSlotChange() }), h("button", { key: 'da0b823e674c5eacd325f69e98e14f4def9c477f', class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, h("tds-icon", { key: '2bdd7110bb4b22c4dfabc1a5ef2acf9e7592b9b9', name: "chevron_right", size: "20px" })))));
+            }, style: { paddingLeft: `${this.leftPadding}px` } }, h("button", { key: '349a8cc729442d4307f800c69abe36adeb7f7e0c', class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, h("tds-icon", { key: 'feacf20411c38c0b9d80b25a1a19ef89e812b81d', name: "chevron_left", size: "20px" })), h("slot", { key: '78727b46e6adc0c516cbbfb4dc072f59330c8635', onSlotchange: () => this.handleSlotChange() }), h("button", { key: '580d1416f7329133c58f5bfaaa7169623e1dd001', class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, h("tds-icon", { key: 'f9d1c4f717303f0c1c2eb4b33b361be8fa2f15ab', 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

@@ -12,8 +12,8 @@ export class TdsNavigationTab {
         this.selected = selected;
     }
     render() {
-        return (h(Host, { key: '46ce3b8e878eca4c970f29371cb17a0c7ec1789a', role: "listitem" }, h("div", { key: '51331675d8898d5bca9758ed9c09194c6dbfde23', class: `navigation-tab-item  ${this.selected ? 'selected' : ''}
-           ${this.disabled ? 'disabled' : ''}` }, h("slot", { key: 'd326748125d8e6a366268c581139bb859ef8feeb' }))));
+        return (h(Host, { key: '58749f71c75a0026b58645df3ccaa6ebd5e5dc9f', role: "listitem" }, h("div", { key: 'ed4cc04c74a69470c95f9ec3ba034c7ad6b9f2d3', class: `navigation-tab-item  ${this.selected ? 'selected' : ''}
+           ${this.disabled ? 'disabled' : ''}` }, h("slot", { key: 'ee7c740413087d0da51bdfc8da4509d482f1faeb' }))));
     }
     static get is() { return "tds-navigation-tab"; }
     static get encapsulation() { return "shadow"; }

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

@@ -167,9 +167,15 @@ export class TdsNavigationTabs {
         this.removeEventListenerFromTabs();
     }
     render() {
-        return (h(Host, { key: 'fa440271f692e4893d4374ccd081308b5b4623e5', role: "list", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: '434fba65da78ac84c018252c52440d20984ab7b3', class: "wrapper", ref: (el) => {
+        return (h(Host, { key: '0ca3544da4ef897b44bd2f55b0dc03edf7921818', role: "list", class: { [`tds-mode-variant-${this.modeVariant}`]: this.modeVariant !== null } }, h("div", { key: '3eff9e0fc6b416171d0928e3e1933fed626fb3ec', class: "wrapper", ref: (el) => {
                 this.navWrapperElement = el;
-            }, style: { paddingLeft: `${this.leftPadding}px` } }, h("button", { key: '29d8d76a06c82f06b1c2aa15a3d023d238b05f10', class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, h("tds-icon", { key: '1936dee5d3476a0d2c46b4d64a7a26848320c9d7', name: "chevron_left", size: "20px" })), h("slot", { key: '9e4cffce9188a7d517636e4b32ef8574a8bea78a', onSlotchange: () => this.handleSlotChange() }), h("button", { key: '3af05aee3183425bdcd5c2f5f65f0c8920ba8622', class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, h("tds-icon", { key: '075726ba4074a4e9452248115968d3b21104e929', name: "chevron_right", size: "20px" })))));
+            }, style: { paddingLeft: `${this.leftPadding}px` } }, h("button", { key: '730023259356eec4ec037e56a495dfea4f8d469c', class: {
+                'scroll-left-button': true,
+                'show': this.showLeftScroll,
+            }, onClick: () => this.scrollLeft(), disabled: !this.showLeftScroll }, h("tds-icon", { key: '5e601f5e4a3aa308e5a5a636fc08c7b32387dbd9', name: "chevron_left", size: "20px" })), h("slot", { key: '43c9228e6c328b4cc651a9ffbd7dd8dbbfd592fe', onSlotchange: () => this.handleSlotChange() }), h("button", { key: '7eca0796fed3a98043abbbe306c29eed10cd8c5d', class: {
+                'scroll-right-button': true,
+                'show': this.showRightScroll,
+            }, onClick: () => this.scrollRight(), disabled: !this.showRightScroll }, h("tds-icon", { key: '9b84ae33c083f41ce6d8a83da1f1edb37c95de55', 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.js

@@ -1,5 +1,5 @@
-import hasSlot from "../../utils/hasSlot";
 import { h } from "@stencil/core";
+import hasSlot from "../../utils/hasSlot";
 /**
  * @slot prefix - Slot for the prefix in the component.
  * @slot suffix - Slot for the suffix in the component. Suffix is hidden when the input is in readonly state.
@@ -54,7 +54,7 @@ export class TdsTextField {
         var _a;
         const usesPrefixSlot = hasSlot('prefix', this.host);
         const usesSuffixSlot = hasSlot('suffix', this.host);
-        return (h("div", { key: 'fbbf85f381d4322a3806e26fd0d5fc99f418798d', class: {
+        return (h("div", { key: '9a746f9a955c02adbc1154e02dc82fc6062d4eeb', class: {
                 'form-text-field': true,
                 'form-text-field-nomin': this.noMinWidth,
                 'text-field-focus': this.focusInput && !this.disabled,
@@ -68,12 +68,14 @@ 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: '56af5e0e26cd43abbbea49de990bc07c6bb5b18c', class: "text-field-label-outside" }, h("div", { key: '874e3561ccf253e30f6b09902d76174293a1f332' }, this.label))), h("div", { key: 'fc43c855f7f374a2761feda34a6374be1a37ff90', onClick: () => this.textInput.focus(), class: "text-field-container" }, usesPrefixSlot && (h("div", { key: '7b5590cf8cb856942e30fd80c3115bf133062998', class: {
+            } }, this.labelPosition === 'outside' && (h("div", { key: '4a6a898131f86115c6cbf07f6e67058ac548fdfb', class: "text-field-label-outside" }, h("div", { key: '868b1372153ac1d27e0d407a5199c8cb6659d21a' }, this.label))), h("div", { key: '917a0691663c81418cb8adfc2963e2514f6a228d', onClick: () => this.textInput.focus(), class: "text-field-container" }, usesPrefixSlot && (h("div", { key: 'e11cb3a273a9899972b035b1296deda841145928', 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: 'df3ff67a7f8195e3317c6bef103ee19b98628fe3', name: "prefix" }))), h("div", { key: '7727642d6c2bc664785043f730d652a2ca21657c', class: "text-field-input-container" }, h("input", { key: '58ec947e5d401cc40224be16bd987c9d1a31237f', ref: (inputEl) => (this.textInput = inputEl), class: {
+            } }, h("slot", { key: 'a6336094ef22454c6d7b782b78690773dfcc444a', name: "prefix" }))), h("div", { key: 'cee83edde0b7189258aa7f1aaa3573d27b4e0d06', class: "text-field-input-container" }, h("input", { key: '27c52fc9ffa89f57578d152a5eaf8bd25c4b48d7', ref: (inputEl) => {
+                this.textInput = inputEl;
+            }, class: {
                 'text-field-input': true,
                 'text-field-input-sm': this.size === 'sm',
                 'text-field-input-md': this.size === 'md',
@@ -86,16 +88,16 @@ export class TdsTextField {
                 if (!this.readOnly) {
                     this.handleBlur(event);
                 }
-            } }), this.labelPosition === 'inside' && this.size !== 'sm' && (h("label", { key: '4ff4a198eea2803a08f3336c860a07788a4f7ca1', class: "text-field-label-inside" }, this.label))), h("div", { key: '734de1fb01e8f9c0a270af04d567b2fe0d891172', class: "text-field-bar" }), usesSuffixSlot && (h("div", { key: 'acd385a1e926ac1c66e4185e156ab47f796d3c5f', class: {
+            } }), this.labelPosition === 'inside' && this.size !== 'sm' && (h("label", { key: '00fdc9f7231bb1991afb37d3477ac6267594ccb5', class: "text-field-label-inside" }, this.label))), h("div", { key: 'a5c349a2e3695122244feb4daacf9c0a523656d6', class: "text-field-bar" }), usesSuffixSlot && (h("div", { key: 'f4812d2d9162330bb9e9a480a6f1c6fb0f1603b4', 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: '98e3ad6a1083ace81fd102a4386236321372158f', name: "suffix" }))), h("span", { key: 'c1020a1fb2ea2ec06f1cc3478328ff09f5dde12f', class: "text-field-icon__readonly" }, h("tds-icon", { key: '2fa99d139b21034cff9699f8ca359b85333c048b', name: "edit_inactive", size: "20px" })), h("span", { key: '1bef6d45afd4586fca10e188b2ccadd4504750fc', class: "text-field-icon__readonly-label" }, "This field is non-editable")), (this.helper || this.maxLength > 0) && (h("div", { key: 'b43c0ed2778672b5ea587214f45f353425030a45', class: "text-field-helper" }, this.state === 'error' && (h("div", { key: '6943b70f8ee2fe98a7ade493f62b1be9245c053b', class: "text-field-helper-error-state" }, h("tds-icon", { key: '1e4a5820aa41c0918aee84488476afa2d9bb27c4', name: "error", size: "16px" }), this.helper)), this.state !== 'error' && this.helper, this.maxLength > 0 && (h("div", { key: 'e0f6a4ba6b781e1307f5abba906abba9a6631a74', class: {
+            } }, h("slot", { key: '2583307a640ff3b1badd3b528db408bb9aeb4ca2', name: "suffix" }))), h("span", { key: '04fe8fb44155eacd3a2e24e84783f2145f244c9c', class: "text-field-icon__readonly" }, h("tds-icon", { key: '68a92868b1c5828c41f36eaddd97532e14a82f68', name: "edit_inactive", size: "20px" })), h("span", { key: 'a7f89ce9d3bab3b89787a9baf59c35dba06f023e', class: "text-field-icon__readonly-label" }, "This field is non-editable")), (this.helper || this.maxLength > 0) && (h("div", { key: 'ba89f1650e5ebbb45f0dbc06548ed86add1d4971', class: "text-field-helper" }, this.state === 'error' && (h("div", { key: 'dc9368caca14d7fdb4e0ad061181352daeae235b', class: "text-field-helper-error-state" }, h("tds-icon", { key: '07d99458b372b6edb1f9268dcc66f88840005a92', name: "error", size: "16px" }), this.helper)), this.state !== 'error' && this.helper, this.maxLength > 0 && (h("div", { key: 'c1d143899e66bddb364322537ab3940f7498d63d', class: {
                 'text-field-textcounter': true,
                 'text-field-textcounter-disabled': this.disabled,
-            } }, this.value === null ? 0 : (_a = this.value) === null || _a === void 0 ? void 0 : _a.length, h("span", { key: 'ae2a52268ca86705b853043fb35bc0da19c7e2ae', class: {
+            } }, this.value === null ? 0 : (_a = this.value) === null || _a === void 0 ? void 0 : _a.length, h("span", { key: '9bd585768330df043bdcba388fbfb13ec087522d', class: {
                 'text-field-textcounter-divider': true,
                 'text-field-textcounter-disabled': this.disabled,
             } }, ' ', "/", ' '), this.maxLength))))));

package/dist/collection/components/textarea/textarea.js

@@ -38,17 +38,19 @@ export class TdsTextarea {
     }
     render() {
         var _a;
-        return (h("div", { key: 'fc3599b1d61b75327840068968001f2df6ec6b05', class: `
-        textarea-container
-        ${this.labelPosition === 'inside' ? 'textarea-label-inside' : ''}
-        ${this.focusInput ? 'textarea-focus' : ''}
-        ${this.disabled ? 'textarea-disabled' : ''}
-        ${this.readOnly ? 'textarea-readonly' : ''}
-        ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}
-        ${this.value ? 'textarea-data' : ''}
-        ${this.state === 'error' || this.state === 'success' ? `textarea-${this.state}` : ''}
-        ${this.noMinWidth ? 'no-min-width' : ''}
-        ` }, this.labelPosition !== 'no-label' && h("span", { key: '5ac3d5ef752a55f241865fe51bdb7aa96416731b', class: 'textarea-label' }, this.label), h("div", { key: '310c4a2a51391c366e17eca98ee22903d1620b16', class: "textarea-wrapper" }, h("textarea", { key: '4b83ff31486dea966a4a4a9df35d83043ad1a616', class: 'textarea-input', ref: (inputEl) => (this.textEl = inputEl), disabled: this.disabled, readonly: this.readOnly, placeholder: this.placeholder, value: this.value, name: this.name, autofocus: this.autofocus, maxlength: this.maxLength, cols: this.cols, rows: this.rows, onFocus: (event) => {
+        return (h("div", { key: '20555ab5f931d14f485a30e1dd817143ae5a5b88', class: {
+                'textarea-container': true,
+                'textarea-label-inside': this.labelPosition === 'inside',
+                'textarea-focus': this.focusInput,
+                'textarea-disabled': this.disabled,
+                'textarea-readonly': this.readOnly,
+                [`tds-mode-variant-${this.modeVariant}`]: this.modeVariant !== null,
+                'textarea-data': this.value !== '',
+                [`textarea-${this.state}`]: this.state === 'error' || this.state === 'success',
+                'no-min-width': this.noMinWidth,
+            } }, this.labelPosition !== 'no-label' && h("span", { key: '5da3048c718ddb65116fdf42d4b11a5f0718c1db', class: 'textarea-label' }, this.label), h("div", { key: '5c7103748771190a3e761cf0f2979c92d68432b4', class: "textarea-wrapper" }, h("textarea", { key: '97a036edf21ec7dad9f52abea52562b6a55ca109', class: 'textarea-input', ref: (inputEl) => {
+                this.textEl = inputEl;
+            }, disabled: this.disabled, readonly: this.readOnly, placeholder: this.placeholder, value: this.value, name: this.name, autofocus: this.autofocus, maxlength: this.maxLength, cols: this.cols, rows: this.rows, onFocus: (event) => {
                 if (!this.readOnly) {
                     this.handleFocus(event);
                 }
@@ -56,7 +58,7 @@ export class TdsTextarea {
                 if (!this.readOnly) {
                     this.handleBlur(event);
                 }
-            }, onInput: (event) => this.handleInput(event), onChange: (event) => this.handleChange(event) }), h("span", { key: '7718db97412e86796819e23584037833d762d6ce', class: "textarea-resizer-icon" }, h("svg", { key: '2b59b518d8bb6a61f6cbbbfb9bd2ec67938e91b6', width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '99c42c62b8e6a17c6acf6824d6e08ae88a3ed2bf', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.8536 0.853553C12.0488 0.658291 12.0488 0.341709 11.8536 0.146447C11.6583 -0.0488155 11.3417 -0.0488155 11.1464 0.146447L0.146447 11.1464C-0.0488155 11.3417 -0.0488155 11.6583 0.146447 11.8536C0.341709 12.0488 0.658291 12.0488 0.853553 11.8536L11.8536 0.853553ZM11.8536 4.64645C12.0488 4.84171 12.0488 5.15829 11.8536 5.35355L5.35355 11.8536C5.15829 12.0488 4.84171 12.0488 4.64645 11.8536C4.45118 11.6583 4.45118 11.3417 4.64645 11.1464L11.1464 4.64645C11.3417 4.45118 11.6583 4.45118 11.8536 4.64645ZM11.8536 8.64645C12.0488 8.84171 12.0488 9.15829 11.8536 9.35355L9.35355 11.8536C9.15829 12.0488 8.84171 12.0488 8.64645 11.8536C8.45118 11.6583 8.45118 11.3417 8.64645 11.1464L11.1464 8.64645C11.3417 8.45118 11.6583 8.45118 11.8536 8.64645Z", fill: "currentColor" }))), h("span", { key: '5c4a4cad4aa805df35ce264c34f9cdde678b1804', class: "textarea-icon__readonly" }, h("tds-icon", { key: 'c5fe3371e08431c38a3979c226f64b79c35fed23', name: "edit_inactive" })), h("span", { key: 'e4261be8ce8cf8fc9cba5f25e6d4c52de4503f67', class: "textarea-icon__readonly-label" }, "This field is non-editable")), h("span", { key: 'a58d64d87a5f971f3e51356a839beea73dfff4b4', class: 'textarea-helper' }, this.state === 'error' && h("tds-icon", { key: '39dfd4c2c356817e5f3b39af7f4e90334de79ac0', name: "error", size: "16px" }), this.helper), this.maxLength > 0 && (h("div", { key: '8df0493b694ddce5cd3669f00527329df2c29e06', class: 'textarea-textcounter' }, this.value === null ? 0 : (_a = this.value) === null || _a === void 0 ? void 0 : _a.length, h("span", { key: '8604248491d68a2b70531c028661573de48deb27', class: "textfield-textcounter-divider" }, " / "), " ", this.maxLength))));
+            }, onInput: (event) => this.handleInput(event), onChange: (event) => this.handleChange(event) }), h("span", { key: 'bc1422693b7be09e7057e11b76ae781d7b0f4fad', class: "textarea-resizer-icon" }, h("svg", { key: '3836f33d521ec1f35a6dceb3240a61bc750ca875', width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '75f1a8d478002b9b3a1febd3ff433c14b4f6470f', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.8536 0.853553C12.0488 0.658291 12.0488 0.341709 11.8536 0.146447C11.6583 -0.0488155 11.3417 -0.0488155 11.1464 0.146447L0.146447 11.1464C-0.0488155 11.3417 -0.0488155 11.6583 0.146447 11.8536C0.341709 12.0488 0.658291 12.0488 0.853553 11.8536L11.8536 0.853553ZM11.8536 4.64645C12.0488 4.84171 12.0488 5.15829 11.8536 5.35355L5.35355 11.8536C5.15829 12.0488 4.84171 12.0488 4.64645 11.8536C4.45118 11.6583 4.45118 11.3417 4.64645 11.1464L11.1464 4.64645C11.3417 4.45118 11.6583 4.45118 11.8536 4.64645ZM11.8536 8.64645C12.0488 8.84171 12.0488 9.15829 11.8536 9.35355L9.35355 11.8536C9.15829 12.0488 8.84171 12.0488 8.64645 11.8536C8.45118 11.6583 8.45118 11.3417 8.64645 11.1464L11.1464 8.64645C11.3417 8.45118 11.6583 8.45118 11.8536 8.64645Z", fill: "currentColor" }))), h("span", { key: '43899208bb06e613eff34d4a9d73b7003d4e0df4', class: "textarea-icon__readonly" }, h("tds-icon", { key: 'd8610ee288753d67e20571fce9707d9b9f2e4ccc', name: "edit_inactive" })), h("span", { key: '208ada20b1053f93db759d7cc9c7dc653735135a', class: "textarea-icon__readonly-label" }, "This field is non-editable")), h("span", { key: 'f5aee4903c0bf3e7612af6dc84eab08ce0e09180', class: 'textarea-helper' }, this.state === 'error' && h("tds-icon", { key: '4581239d829a9e07dc91f3352042220ab3d334b0', name: "error", size: "16px" }), this.helper), this.maxLength > 0 && (h("div", { key: 'b06905f370babfe0470e914df045c72ef7e12041', class: 'textarea-textcounter' }, this.value === null ? 0 : (_a = this.value) === null || _a === void 0 ? void 0 : _a.length, h("span", { key: 'd45f87ccf1ccf4198276b3e2c7fe465aeeb9fe17', class: "textfield-textcounter-divider" }, " / "), " ", this.maxLength))));
     }
     static get is() { return "tds-textarea"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/toast/toast.js

@@ -58,12 +58,12 @@ export class TdsToast {
         const usesHeaderSlot = hasSlot('header', this.host);
         const usesSubheaderSlot = hasSlot('subheader', this.host);
         const usesActionsSlot = hasSlot('actions', this.host);
-        return (h(Host, { key: 'ee07540896c1aae0d8025b16e6b7794f1c5d8f4a', toastRole: this.toastRole, "aria-describedby": this.host.getAttribute('aria-describedby'), class: {
+        return (h(Host, { key: '47e0159502e048c0359a5a17677f0456aa69a4da', toastRole: this.toastRole, "aria-describedby": this.host.getAttribute('aria-describedby'), class: {
                 hide: this.hidden,
                 show: !this.hidden,
-            } }, h("div", { key: '20a502c69ea5923dbd53fb8749c0c03a4aa4977b', class: `
+            } }, h("div", { key: '6ae5a9da5c89de7a2336f48f495d61cc11286495', class: `
             wrapper
-            ${this.variant}` }, h("tds-icon", { key: '4167e597b4603cdb7d522a8b86dcc9c5c382ecaa', name: this.getIconName(), size: "20px" }), h("div", { key: '31921a5a61b34711669cbc93583291581e95c86f', class: `content` }, h("div", { key: '6d45456ec0c53cba6714af755a6fc2fa4db4405a', class: "header-subheader" }, this.header && h("div", { key: '3ac77ce9dfea028f0207214d99221ea5de0025cd', class: "header" }, this.header), usesHeaderSlot && h("slot", { key: 'c746b1e1bd696fa8ed85e39bea4b6df0404a1a14', name: "header" }), this.subheader && h("div", { key: '3f6496b6942d9a6ff9a425cd60e396d813f4da1b', class: "subheader" }, this.subheader), usesSubheaderSlot && h("slot", { key: '8c3c3a8f926dbc077c63a562cd54afba693d6ea6', name: "subheader" })), usesActionsSlot && (h("div", { key: 'dc5e027546c10825168bf0907280479f29688c3d', class: `toast-bottom ${usesSubheaderSlot || this.subheader ? 'subheader' : 'no-subheader'}` }, h("slot", { key: 'e7593549992a4842a7f6c35ab93c06b902ad469b', name: "actions" })))), this.closable && (h("button", { key: '7b3d02c1b27263f550445a18a3f94a5064375a78', onClick: this.handleClose, class: "close" }, h("tds-icon", { key: '69dffbd7b7e6be0dabd264683ea1bbf7c9413fae', name: "cross", size: "20px" }))))));
+            ${this.variant}` }, h("tds-icon", { key: 'c6ce5ea135bddef0ad0f7172ac8d7be6725a3597', name: this.getIconName(), size: "20px" }), h("div", { key: 'b3db26a1314c8a2d55c7d028cdc2f4951a738eaf', class: `content` }, h("div", { key: '3418ea02c85852fe548130c6c653a8dacdd9437a', class: "header-subheader" }, this.header && h("div", { key: '0a50b5e2a487be36a00ad89ad4f14cf1af83477d', class: "header" }, this.header), usesHeaderSlot && h("slot", { key: 'df199798748ed7ade9cbda7f7ce798bb6f8fa995', name: "header" }), this.subheader && h("div", { key: '4978346a3726aea3af0aa7bb98487c36873045d3', class: "subheader" }, this.subheader), usesSubheaderSlot && h("slot", { key: '49651b229907504dfca5aec35589595b421f6e1b', name: "subheader" })), usesActionsSlot && (h("div", { key: '6dbfa25c49118e92c2a254fb01156a95004f0738', class: `toast-bottom ${usesSubheaderSlot || this.subheader ? 'subheader' : 'no-subheader'}` }, h("slot", { key: '85235296f757e0a6306d76ef83c855c3e9bb6cb4', name: "actions" })))), this.closable && (h("button", { key: 'd6946c5ff592b494be06dcb7b46dfc56b5eb5efc', onClick: this.handleClose, class: "close" }, h("tds-icon", { key: '51a93ef789343f24686183ba1747fc853e6d9e04', name: "cross", size: "20px" }))))));
     }
     static get is() { return "tds-toast"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/toggle/toggle.js

@@ -19,6 +19,7 @@ export class TdsToggle {
         this.headline = undefined;
         this.disabled = false;
         this.toggleId = generateUniqueId();
+        this.tdsAriaLabel = undefined;
     }
     /** Toggles the Toggle. */
     async toggle() {
@@ -28,8 +29,19 @@ export class TdsToggle {
             checked: this.checked,
         };
     }
+    componentWillLoad() {
+        this.labelSlot = this.host.querySelector("[slot='label']");
+    }
+    connectedCallback() {
+        if (!this.tdsAriaLabel) {
+            console.warn('Tegel Toggle component: tdsAriaLabel prop is missing');
+        }
+    }
     render() {
-        return (h("div", { key: 'a740337f48412e83ddb8518fd88b7bfa9fb56930', class: "tds-toggle" }, this.headline && (h("div", { key: 'f768b325a07cbadb06bdf8a7ae3e41586b9e5d1b', class: `toggle-headline ${this.disabled ? 'disabled' : ''}` }, this.headline)), h("input", { key: 'e10313611123f0f6ab5f0477ff533218289096e4', "aria-describedby": this.host.getAttribute('aria-describedby'), "aria-labelledby": this.host.getAttribute('aria-labelledby'), "aria-checked": this.checked, "aria-required": this.required, onChange: () => this.handleToggle(), class: `${this.size}`, checked: this.checked, disabled: this.disabled, required: this.required, type: "checkbox", name: this.name, id: this.toggleId, role: "switch" }), h("label", { key: '5a46a186950ce374c963da377d41b64431c249af', class: `${this.disabled ? 'disabled' : ''}`, htmlFor: this.toggleId }, h("slot", { key: '103d423193d379770333a78844e733c05402b010', name: "label" }))));
+        return (h("div", { key: '8f8a77827f524c049aa004d15372a78e7fad41e2', class: "tds-toggle" }, this.headline && (h("div", { key: '8e254412e80362807046a893fc3f7c42a0c376ba', class: {
+                'toggle-headline': true,
+                'disabled': this.disabled,
+            } }, this.headline)), h("input", { key: '47ed1307b67b61b1594006449fb1b4ccf6d031b8', "aria-label": this.tdsAriaLabel, "aria-describedby": this.host.getAttribute('aria-describedby'), "aria-labelledby": this.host.getAttribute('aria-labelledby'), "aria-checked": this.checked, "aria-required": this.required, onChange: () => this.handleToggle(), class: `${this.size}`, checked: this.checked, disabled: this.disabled, required: this.required, type: "checkbox", name: this.name, id: this.toggleId, role: "switch" }), this.labelSlot && (h("label", { key: '75964d686710d6b4f8bbe365cc51c8aab3234d26', class: { disabled: this.disabled }, htmlFor: this.toggleId }, h("slot", { key: 'aeeaed1f37a160ce792df3f5115c75eaa0fd2c0a', name: "label" })))));
     }
     static get is() { return "tds-toggle"; }
     static get encapsulation() { return "scoped"; }
@@ -168,6 +180,23 @@ export class TdsToggle {
                 "attribute": "toggle-id",
                 "reflect": false,
                 "defaultValue": "generateUniqueId()"
+            },
+            "tdsAriaLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Defines aria-label attribute for input"
+                },
+                "attribute": "tds-aria-label",
+                "reflect": false
             }
         };
     }

package/dist/collection/components/tooltip/tooltip.js

@@ -52,7 +52,7 @@ export class TdsTooltip {
     }
     render() {
         var _a;
-        return (h(Host, { key: '9e3e3840a62647a01b23e7044dd60477febc13a3' }, h("tds-popover-core", Object.assign({ key: 'dfacc8db0d6f8895d7c62f46bffb83c24e6ad368' }, this.inheritedAttributes, { class: {
+        return (h(Host, { key: '963a6dc4a3816d01ca9a1efc76ba06b98faba9f0' }, h("tds-popover-core", Object.assign({ key: '6bc8ffb25e5d31c2c3d9dda9867104990ae8ff18' }, this.inheritedAttributes, { class: {
                 'tds-tooltip': true,
                 [`tds-tooltip-${this.border}`]: true,
                 [(_a = this.inheritedAttributes.class) !== null && _a !== void 0 ? _a : '']: true,
@@ -61,7 +61,7 @@ export class TdsTooltip {
                 this.show = true;
             }, onInternalTdsClose: () => {
                 this.show = false;
-            }, defaultShow: this.defaultShow }), this.text, h("slot", { key: '8a4bda8a105e6cc253cb3c3f1e4363077e6ec8a9' }))));
+            }, defaultShow: this.defaultShow }), this.text, h("slot", { key: '5df9224787bb470653278d121ceed41ea48b957a' }))));
     }
     static get is() { return "tds-tooltip"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/tooltip-beta/tooltip-beta.css

@@ -0,0 +1,40 @@
+:host {
+  position: absolute;
+}
+
+.tds-tooltip {
+  box-sizing: border-box;
+  font: var(--tds-detail-05);
+  letter-spacing: var(--tds-detail-05-ls);
+  color: var(--tds-tooltip-color);
+  background-color: var(--tds-tooltip-background);
+  border-radius: 4px;
+  padding: 8px;
+  word-wrap: break-word;
+  white-space: normal;
+  max-width: 192px;
+  z-index: 900;
+  opacity: 0;
+  visibility: hidden;
+  transition: opacity 200ms ease-in, visibility 200ms ease-in;
+}
+.tds-tooltip * {
+  box-sizing: border-box;
+}
+.tds-tooltip.tds-tooltip-top-left {
+  border-radius: 0 4px 4px;
+}
+.tds-tooltip.tds-tooltip-top-right {
+  border-radius: 4px 0 4px 4px;
+}
+.tds-tooltip.tds-tooltip-bottom-right {
+  border-radius: 4px 4px 0;
+}
+.tds-tooltip.tds-tooltip-bottom-left {
+  border-radius: 4px 4px 4px 0;
+}
+
+.tds-tooltip-show {
+  opacity: 1;
+  visibility: visible;
+}