@scania/tegel 1.53.0 → 1.54.0-btn-icon-beta.0

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

@@ -1,5 +1,6 @@
+/* Typography Usage mixins */
 .textarea-container {
-  border-radius: 4px 4px 0 0;
+  border-radius: calc(var(--component--input-border-radius-top-left) * 1px) calc(var(--component--input-border-radius-top-right) * 1px) calc(var(--component--input-border-radius-bottom-right) * 1px) calc(var(--component--input-border-radius-bottom-left) * 1px);
   position: relative;
   box-sizing: border-box;
   height: auto;
@@ -21,7 +22,7 @@
 }
 
 .textarea-input {
-  border-radius: 4px 4px 0 0;
+  border-radius: calc(var(--component--input-border-radius-top-left) * 1px) calc(var(--component--input-border-radius-top-right) * 1px) calc(var(--component--input-border-radius-bottom-right) * 1px) calc(var(--component--input-border-radius-bottom-left) * 1px);
   width: 100%;
   box-sizing: border-box;
   margin: 0;
@@ -30,13 +31,20 @@
   height: 100%;
   color: var(--tds-textarea-color);
   background-color: var(--tds-textarea-background);
-  font: var(--tds-detail-02);
+  font-family: var(--detail-02-font-family);
+  font-size: var(--detail-02-font-size);
+  line-height: var(--detail-02-line-height);
+  font-weight: var(--detail-02-font-weight);
+  letter-spacing: var(--detail-02-letter-spacing);
+  text-transform: var(--detail-02-text-transform);
   letter-spacing: var(--tds-detail-02-ls);
   padding: var(--tds-spacing-element-20) var(--tds-spacing-element-16);
   display: block;
   resize: vertical;
-  border-bottom: 1px solid var(--tds-textarea-border-bottom);
-  transition: border-bottom-color 200ms ease;
+  border-style: solid;
+  border-color: var(--tds-textarea-border-bottom);
+  border-width: calc(var(--component--input-border-width-top) * 1px) calc(var(--component--input-border-width-right) * 1px) calc(var(--component--input-border-width-bottom) * 1px) calc(var(--component--input-border-width-left) * 1px);
+  transition: border-color 200ms ease;
 }
 .textarea-input:read-only {
   background-color: var(--tds-textarea-read-only-background);
@@ -47,29 +55,22 @@
   transition: color 200ms ease;
 }
 .textarea-input:disabled {
-  background-color: var(--tds-textarea-disabled-background);
-  color: var(--tds-textarea-disabled-color);
   cursor: not-allowed;
 }
-.textarea-input:disabled::placeholder {
-  color: var(--tds-textarea-disabled-placeholder);
-}
 .textarea-input::-webkit-resizer {
   display: none;
 }
 .textarea-input:hover {
-  border-bottom-color: var(--tds-textarea-border-bottom-hover);
+  border-color: var(--tds-textarea-border-bottom-hover);
 }
 .textarea-input:hover::placeholder {
   color: var(--tds-textarea-placeholder-hover);
 }
 .textarea-input:focus {
-  outline: 2px solid var(--tds-focus-outline-color);
-  box-shadow: 0 0 0 1px var(--tds-white);
+  outline: 2px solid var(--component--focus-ring-color-strong);
+  box-shadow: 0 0 0 1px var(--component--focus-ring-color-discrete);
   outline-offset: 1px;
   z-index: 1;
-  border-radius: 0;
-  border-bottom: 1px solid transparent;
 }
 
 .textarea-resizer-icon {
@@ -85,10 +86,17 @@
 }
 .textarea-resizer-icon svg {
   display: block;
+  width: calc(var(--component-textarea-size-resize-width) * 1px);
+  height: calc(var(--component-textarea-size-resize-height) * 1px);
 }
 
 .textarea-label {
-  font: var(--tds-detail-05);
+  font-family: var(--detail-05-font-family);
+  font-size: var(--detail-05-font-size);
+  line-height: var(--detail-05-line-height);
+  font-weight: var(--detail-05-font-weight);
+  letter-spacing: var(--detail-05-letter-spacing);
+  text-transform: var(--detail-05-text-transform);
   letter-spacing: var(--tds-detail-05-ls);
   display: block;
   z-index: 1;
@@ -97,7 +105,12 @@
 }
 
 .textarea-container.textarea-label-inside .textarea-label {
-  font: var(--tds-detail-02);
+  font-family: var(--detail-02-font-family);
+  font-size: var(--detail-02-font-size);
+  line-height: var(--detail-02-line-height);
+  font-weight: var(--detail-02-font-weight);
+  letter-spacing: var(--detail-02-letter-spacing);
+  text-transform: var(--detail-02-text-transform);
   letter-spacing: var(--tds-detail-02-ls);
   transition: 0.1s ease all;
   color: var(--tds-textarea-label-inside-color);
@@ -105,9 +118,6 @@
   top: var(--tds-spacing-element-20);
   left: var(--tds-spacing-element-16);
 }
-.textarea-container.textarea-label-inside.textarea-disabled .textarea-label {
-  color: var(--tds-textarea-disabled-label);
-}
 .textarea-container.textarea-label-inside .textarea-input::placeholder {
   color: transparent;
 }
@@ -119,18 +129,33 @@
   color: var(--tds-textarea-placeholder);
 }
 .textarea-container.textarea-focus.textarea-label-inside .textarea-label {
-  font: var(--tds-detail-07);
+  font-family: var(--detail-07-font-family);
+  font-size: var(--detail-07-font-size);
+  line-height: var(--detail-07-line-height);
+  font-weight: var(--detail-07-font-weight);
+  letter-spacing: var(--detail-07-letter-spacing);
+  text-transform: var(--detail-07-text-transform);
   letter-spacing: var(--tds-detail-07-ls);
   top: var(--tds-spacing-element-8);
 }
 .textarea-container.textarea-data.textarea-label-inside .textarea-label {
-  font: var(--tds-detail-07);
+  font-family: var(--detail-07-font-family);
+  font-size: var(--detail-07-font-size);
+  line-height: var(--detail-07-line-height);
+  font-weight: var(--detail-07-font-weight);
+  letter-spacing: var(--detail-07-letter-spacing);
+  text-transform: var(--detail-07-text-transform);
   letter-spacing: var(--tds-detail-07-ls);
   top: var(--tds-spacing-element-8);
 }
 
 .textarea-textcounter {
-  font: var(--tds-detail-05);
+  font-family: var(--detail-05-font-family);
+  font-size: var(--detail-05-font-size);
+  line-height: var(--detail-05-line-height);
+  font-weight: var(--detail-05-font-weight);
+  letter-spacing: var(--detail-05-letter-spacing);
+  text-transform: var(--detail-05-text-transform);
   letter-spacing: var(--tds-detail-05-ls);
   color: var(--tds-textarea-textcounter);
   float: right;
@@ -139,13 +164,23 @@
   padding-top: var(--tds-spacing-element-4);
 }
 .textarea-textcounter .textfield-textcounter-divider {
-  font: var(--tds-detail-05);
+  font-family: var(--detail-05-font-family);
+  font-size: var(--detail-05-font-size);
+  line-height: var(--detail-05-line-height);
+  font-weight: var(--detail-05-font-weight);
+  letter-spacing: var(--detail-05-letter-spacing);
+  text-transform: var(--detail-05-text-transform);
   letter-spacing: var(--tds-detail-05-ls);
   color: var(--tds-textarea-textcounter-divider);
 }
 
 .textarea-helper {
-  font: var(--tds-detail-05);
+  font-family: var(--detail-05-font-family);
+  font-size: var(--detail-05-font-size);
+  line-height: var(--detail-05-line-height);
+  font-weight: var(--detail-05-font-weight);
+  letter-spacing: var(--detail-05-letter-spacing);
+  text-transform: var(--detail-05-text-transform);
   letter-spacing: var(--tds-detail-05-ls);
   display: flex;
   gap: 8px;
@@ -160,27 +195,30 @@
 }
 
 .textarea-success .textarea-input {
-  border-bottom-color: var(--tds-textarea-border-bottom-success);
+  border-color: var(--tds-textarea-border-bottom-success);
 }
 
 .textarea-error .textarea-input {
-  border-bottom-color: var(--tds-textarea-border-bottom-error);
+  border-color: var(--tds-textarea-border-bottom-error);
 }
 .textarea-error .textarea-helper {
   color: var(--tds-textarea-helper-error);
 }
+.textarea-error .textarea-helper tds-icon {
+  color: var(--tds-textarea-icon-error);
+}
 
 .textarea-disabled {
   cursor: not-allowed;
 }
+.textarea-disabled .textarea-wrapper,
+.textarea-disabled .textarea-label {
+  opacity: var(--tds-textarea-opacity-disabled);
+}
 .textarea-disabled .textarea-input {
-  border-bottom-color: transparent;
   pointer-events: none;
   user-select: none;
 }
-.textarea-disabled .textarea-label {
-  color: var(--tds-textarea-disabled-label);
-}
 .textarea-disabled .textarea-helper {
   color: var(--tds-textarea-helper-disabled);
 }
@@ -203,7 +241,12 @@
   position: absolute;
   right: 18px;
   top: 48px;
-  font: var(--tds-detail-05);
+  font-family: var(--detail-05-font-family);
+  font-size: var(--detail-05-font-size);
+  line-height: var(--detail-05-line-height);
+  font-weight: var(--detail-05-font-weight);
+  letter-spacing: var(--detail-05-letter-spacing);
+  text-transform: var(--detail-05-text-transform);
   letter-spacing: var(--tds-detail-05-ls);
   padding: 8px;
   color: var(--tds-textarea-icon-read-only-label-color);
@@ -216,7 +259,7 @@
   display: block;
 }
 .textarea-readonly .textarea-input {
-  border-bottom-color: var(--tds-textarea-border-bottom-read-only-color);
+  border-color: var(--tds-textarea-border-bottom-read-only-color);
 }
 .textarea-readonly .textfield-container {
   background-color: transparent;

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

@@ -70,7 +70,7 @@ export class TdsTextarea {
     }
     render() {
         var _a, _b;
-        return (h("div", { key: '09cd1df4c73550cbe10f6de7127e2835e8e8e90f', class: {
+        return (h("div", { key: '17e5f048546531899316fb6941dd56c4c0eec86b', class: {
                 'textarea-container': true,
                 'textarea-label-inside': this.labelPosition === 'inside',
                 'textarea-focus': this.focusInput,
@@ -80,7 +80,7 @@ export class TdsTextarea {
                 'textarea-data': this.value !== '',
                 [`textarea-${this.state}`]: this.state === 'error' || this.state === 'success',
                 'no-min-width': this.noMinWidth,
-            } }, this.labelPosition !== 'no-label' && (h("label", { key: '16f1f2dc1993c0056aee8bfd82de399292ea1496', htmlFor: `textarea-element-${this.uuid}`, class: 'textarea-label' }, this.label)), h("div", { key: '86fcb4db0544d59bdc62f313a2ad1b7bec232456', class: "textarea-wrapper" }, h("textarea", { key: '43addcf60de1c7de4dd5fd71b2d4e448cc36d0e8', id: `textarea-element-${this.uuid}`, class: 'textarea-input', ref: (inputEl) => {
+            } }, this.labelPosition !== 'no-label' && (h("label", { key: '7acbaff8c9b834537667a2f00fd43bd207ec4a94', htmlFor: `textarea-element-${this.uuid}`, class: 'textarea-label' }, this.label)), h("div", { key: '9e1a35a149e87ef132544bccee4ef68708a043b5', class: "textarea-wrapper" }, h("textarea", { key: '1ac5b68781eb3678b286217d4be05db6b3fed343', id: `textarea-element-${this.uuid}`, class: 'textarea-input', ref: (inputEl) => {
                 this.textEl = inputEl;
             }, disabled: this.disabled, readonly: !this.disabled && 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) {
@@ -90,7 +90,7 @@ export class TdsTextarea {
                 if (!this.readOnly) {
                     this.handleBlur(event);
                 }
-            }, onInput: (event) => this.handleInput(event), onChange: (event) => this.handleChange(event), "aria-invalid": getAriaInvalid(this.host, this.state), "aria-readonly": this.readOnly ? 'true' : 'false', "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label, "aria-describedby": `textarea-helper-element-${this.uuid}` }), h("span", { key: '79003f45831eab0125d36f3cae8e5e94016737ab', class: "textarea-resizer-icon" }, h("svg", { key: '215bb650c9d5755fb1efc60fb8f860cbd320ff81', width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'e7eee0f9e40c8000232f922f20461f898d3ee897', "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" }))), !this.disabled && !this.hideReadOnlyIcon && this.readOnly && (h("span", { key: 'ee804d2983da6c42e3ce071b1e1cf1183a47500b', class: "textarea-icon__readonly" }, h("tds-tooltip", { key: '581368602f2ffcedc7af6b54c406999a731854a8', placement: "top-end", text: "This field is non-editable", selector: "#readonly-tooltip" }), h("tds-icon", { key: '58de6e587437522439676f57fee5143ba28a9763', id: "readonly-tooltip", name: "edit_inactive", svgTitle: "inactive" })))), h("span", { key: '0d266c48b18cb493ac1b70268bdaceb0228397d8', class: 'textarea-helper', "aria-live": "assertive", id: `textarea-helper-element-${this.uuid}` }, this.state === 'error' && this.helper && !this.readOnly && (h("tds-icon", { key: 'cbc610ddb25b27dcb9ec84357594289335edf21a', name: "error", size: "16px" })), this.helper), ((_a = this.maxLength) !== null && _a !== void 0 ? _a : 0) > 0 && (h("div", { key: 'f600283d05fad5e2ac4d14e759008021ff9a3c25', class: 'textarea-textcounter' }, this.value === null ? 0 : (_b = this.value) === null || _b === void 0 ? void 0 : _b.length, h("span", { key: '2a4d1ed0e0a6ece6d2fc0943d6f44a897f8bfcfb', class: "textfield-textcounter-divider" }, " / "), " ", this.maxLength))));
+            }, onInput: (event) => this.handleInput(event), onChange: (event) => this.handleChange(event), "aria-invalid": getAriaInvalid(this.host, this.state), "aria-readonly": this.readOnly ? 'true' : 'false', "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label, "aria-describedby": `textarea-helper-element-${this.uuid}` }), h("span", { key: 'bdb08af97c50672145daf0f2aebca2b3dc0b6f8f', class: "textarea-resizer-icon" }, h("svg", { key: '7239c0246d6d3b9d83cddcfeba33929c52306c46', width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'eb4d0058060a9e023d664b0e4ead6932b4d0fb7c', "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" }))), !this.disabled && !this.hideReadOnlyIcon && this.readOnly && (h("span", { key: 'a961358d976093ef4fcab24bd59822a19f121110', class: "textarea-icon__readonly" }, h("tds-tooltip", { key: '41b20bd51f8d597d38eff89f696f9b89a1be3c5e', placement: "top-end", text: "This field is non-editable", selector: "#readonly-tooltip" }), h("tds-icon", { key: '05bb88941fb674e6d636eff3e036ded3d91b8f76', id: "readonly-tooltip", name: "edit_inactive", svgTitle: "inactive" })))), h("span", { key: 'e380047364c71512ec6290ddc3acce7ccf0c4a92', class: 'textarea-helper', "aria-live": "assertive", id: `textarea-helper-element-${this.uuid}` }, this.state === 'error' && this.helper && !this.readOnly && (h("tds-icon", { key: 'ab76d1518a9bda2251eb2c9e0ea765c2039da5aa', name: "error", size: "16px" })), this.helper), ((_a = this.maxLength) !== null && _a !== void 0 ? _a : 0) > 0 && (h("div", { key: '96ec8a42970fcacc3c9a8bca8c5be24530880888', class: 'textarea-textcounter' }, this.value === null ? 0 : (_b = this.value) === null || _b === void 0 ? void 0 : _b.length, h("span", { key: '8c6d15477056e04403a611c99db97da4d3c27e6b', class: "textfield-textcounter-divider" }, " / "), " ", this.maxLength))));
     }
     static get is() { return "tds-textarea"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/toast/toast.css

@@ -10,28 +10,31 @@
   display: flex;
   width: 348px;
   background-color: var(--tds-toast-background-color);
-  border-radius: 4px;
+  border-radius: var(--tds-toast-border-radius);
 }
 :host .wrapper.information {
-  border-left: 4px solid var(--tds-toast-color-info);
+  border-left: var(--tds-toast-border-width) solid var(--tds-toast-color-info);
 }
 :host .wrapper.information tds-icon {
-  color: var(--tds-toast-color-info);
+  color: var(--tds-toast-icon-color-info);
 }
 :host .wrapper.success {
-  border-left: 4px solid var(--tds-toast-color-success);
+  background-color: var(--tds-toast-background-success);
+  border-left: var(--tds-toast-border-width) solid var(--tds-toast-color-success);
 }
 :host .wrapper.success tds-icon {
-  color: var(--tds-toast-color-success);
+  color: var(--tds-toast-icon-color-success);
 }
 :host .wrapper.error {
-  border-left: 4px solid var(--tds-toast-color-error);
+  background-color: var(--tds-toast-background-error);
+  border-left: var(--tds-toast-border-width) solid var(--tds-toast-color-error);
 }
 :host .wrapper.error tds-icon {
-  color: var(--tds-toast-color-error);
+  color: var(--tds-toast-icon-color-error);
 }
 :host .wrapper.warning {
-  border-left: 4px solid var(--tds-toast-color-warning);
+  background-color: var(--tds-toast-background-warning);
+  border-left: var(--tds-toast-border-width) solid var(--tds-toast-color-warning);
 }
 :host .wrapper.warning tds-icon {
   color: var(--tds-toast-icon-color-warning);
@@ -50,8 +53,8 @@
   cursor: pointer;
 }
 :host .wrapper button.close:focus {
-  outline: 2px solid var(--tds-focus-outline-color);
-  box-shadow: 0 0 0 1px var(--tds-white);
+  outline: 2px solid var(--component--focus-ring-color-strong);
+  box-shadow: 0 0 0 1px var(--component--focus-ring-color-discrete);
   outline-offset: 1px;
   z-index: 1;
 }
@@ -95,10 +98,4 @@
 }
 :host .content .toast-bottom {
   padding-top: 12px;
-}
-:host .tds-mode-variant-primary {
-  --tds-toast-background: var(--tds-toast-background-primary);
-}
-:host .tds-mode-variant-secondary {
-  --tds-toast-background: var(--tds-toast-background-secondary);
 }

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

@@ -68,12 +68,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: '0835688f4f40b81c9117a29849b1843cdcbdbbf1', "aria-live": this.tdsAriaLive, toastRole: this.toastRole, "aria-describedby": this.host.getAttribute('aria-describedby'), class: {
+        return (h(Host, { key: 'b422fc996e88e7d5d0a72d07971b29150cae7714', "aria-live": this.tdsAriaLive, toastRole: this.toastRole, "aria-describedby": this.host.getAttribute('aria-describedby'), class: {
                 hide: this.hidden,
                 show: !this.hidden,
-            } }, h("div", { key: 'a57942ecd8e8603b93a2c6c762942488f1bdf572', class: `
+            } }, h("div", { key: '4a473ab10edcce6938e981e25bf1c9f152721a29', class: `
             wrapper
-            ${this.variant}` }, h("tds-icon", { key: '7d214ebc4f832028a0d4947518741801ea8d6c2a', name: this.getIconName(), size: "20px", svgTitle: this.getIconName() }), h("div", { key: '5e98237b18d5b20532f9c10124db1b71514f633e', class: `content` }, h("div", { key: 'be552f6baad706519327675a83030019bdc31e01', class: "header-subheader" }, this.header && h("div", { key: '937da56fb92a01902d944633429863c8a6ebb746', class: "header" }, this.header), usesHeaderSlot && h("slot", { key: '4da7b907aaba71f0c597921332ec960e3d4658c1', name: "header" }), this.subheader && h("div", { key: '27da7407725a08b5fea764e035f0145a61f18a6c', class: "subheader" }, this.subheader), usesSubheaderSlot && h("slot", { key: '8cf0036dcf12a361d436287ee108fa966c3242e3', name: "subheader" })), usesActionsSlot && (h("div", { key: '49ea6249170e0e57a5f194cd05d319ee39f8a259', class: `toast-bottom ${usesSubheaderSlot || this.subheader ? 'subheader' : 'no-subheader'}` }, h("slot", { key: '0152c8e793f592c594f9c964e847ff9e6968121d', name: "actions" })))), this.closable && (h("button", { key: '331a00084a268346fd7350204a666a314a200c13', id: "my-button", "aria-label": this.tdsCloseAriaLabel, onClick: this.handleClose, class: "close" }, h("tds-icon", { key: 'a0fcd31377ce27940d7a6db1c7086791a54f548c', name: "cross", size: "20px", svgTitle: "cross" }))))));
+            ${this.variant}` }, h("tds-icon", { key: '30935de82074fbb0f980161662993939a6b6580e', name: this.getIconName(), size: "20px", svgTitle: this.getIconName() }), h("div", { key: '088ead78b9d39e91062efe3bd7dc7c084b81a921', class: `content` }, h("div", { key: 'b09535d0d741057672ddfcb885d6f389acdf65c9', class: "header-subheader" }, this.header && h("div", { key: '35e54d127fb9ed18c9abed9af147c133cc99b5aa', class: "header" }, this.header), usesHeaderSlot && h("slot", { key: '3f7bf2678d673e6b85a16501b47f1fbd51bb034f', name: "header" }), this.subheader && h("div", { key: 'b419ace2f16e606db38f0c2cd59f00de1173d6c3', class: "subheader" }, this.subheader), usesSubheaderSlot && h("slot", { key: 'a26f22ac7fc1ba369750273d69d31da6a793d261', name: "subheader" })), usesActionsSlot && (h("div", { key: '99c8d320a5ea1d992b7a7a4679610cdfad679c93', class: `toast-bottom ${usesSubheaderSlot || this.subheader ? 'subheader' : 'no-subheader'}` }, h("slot", { key: '3b6d1833ada42234f4d88ccd47694f41cfe61642', name: "actions" })))), this.closable && (h("button", { key: 'b7817f902d836bf4b0175c9e00b5818549acbce3', id: "my-button", "aria-label": this.tdsCloseAriaLabel, onClick: this.handleClose, class: "close" }, h("tds-icon", { key: '43b8d46ea0c3747a274bdaa370fd2867dcf05133', name: "cross", size: "20px", svgTitle: "cross" }))))));
     }
     static get is() { return "tds-toast"; }
     static get encapsulation() { return "shadow"; }

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

@@ -41,13 +41,13 @@ export class TdsToggle {
         this.labelSlot = this.host.querySelector("[slot='label']");
     }
     render() {
-        return (h("div", { key: '84bc1933154949cee35a800438eee3e938c70b33', class: "tds-toggle" }, this.headline && (h("div", { key: '72a2dd88cc952e4c69dd2c63a4f07039701ed9e1', class: {
+        return (h("div", { key: '53ced027584d0c53406ffd3666cc427f2c8c8151', class: "tds-toggle" }, this.headline && (h("div", { key: '9b059811d239d1c6689bd833fb029d99be011d91', class: {
                 'toggle-headline': true,
                 'disabled': this.disabled,
-            } }, this.headline)), h("input", { key: 'c1a6d43bc1580ee9d8a539da383991b415fc9a37', ref: (inputEl) => {
+            } }, this.headline)), h("input", { key: '547392983cf52e45e77b755c96bd0233a223e848', ref: (inputEl) => {
                 if (inputEl)
                     this.inputElement = inputEl;
-            }, "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: 'a99e706b380c94f3cf4225e143ea089a6849dcd5', class: { disabled: this.disabled }, htmlFor: this.toggleId }, h("slot", { key: 'fe70e2b3c7da93ad09d613dbbb91047caecfef61', name: "label" })))));
+            }, "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: 'f11d96fdbd4fa15528504b7cdc2a4d60cb04c48a', class: { disabled: this.disabled }, htmlFor: this.toggleId }, h("slot", { key: '38f16f00d2ffec77e1729aa03163be49d17a27db', name: "label" })))));
     }
     static get is() { return "tds-toggle"; }
     static get encapsulation() { return "scoped"; }

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

@@ -64,7 +64,7 @@ export class TdsTooltip {
     }
     render() {
         var _a;
-        return (h(Host, { key: '37b0078f12fc026bcb8c69c5bb3a8e33bbc7c20f', role: "tooltip", "aria-describedby": this.tdsAriaDescribedby, "aria-label": this.text }, h("tds-popover-core", Object.assign({ key: '1766cc066aead022511bf9adc94e1d5bf19fd261' }, this.inheritedAttributes, { class: {
+        return (h(Host, { key: '411cb8009557df87c9441f79463ace29ca6c9dfb', role: "tooltip", "aria-describedby": this.tdsAriaDescribedby, "aria-label": this.text }, h("tds-popover-core", Object.assign({ key: 'eee455fb2952a27257f7efc10d3216c199db4563' }, this.inheritedAttributes, { class: {
                 'tds-tooltip': true,
                 [`tds-tooltip-${this.border}`]: true,
                 [(_a = this.inheritedAttributes.class) !== null && _a !== void 0 ? _a : '']: true,
@@ -73,7 +73,7 @@ export class TdsTooltip {
                 this.show = true;
             }, onInternalTdsClose: () => {
                 this.show = false;
-            }, defaultShow: this.defaultShow }), this.text, h("slot", { key: '2ee57dc01f144f19bad5296d915e120ab815e57d' }))));
+            }, defaultShow: this.defaultShow }), this.text, h("slot", { key: 'd8e87c4d8b208cedf3d2cb2daa13145e183494f6' }))));
     }
     static get is() { return "tds-tooltip"; }
     static get encapsulation() { return "scoped"; }