@sbb-esta/lyne-elements 4.0.0-next.1 → 4.0.0-next.3

package/status/status.component.d.ts

@@ -1,6 +1,6 @@
 import { CSSResultGroup, TemplateResult, LitElement } from 'lit';
 export type SbbStatusType = 'info' | 'success' | 'warning' | 'error' | 'pending' | 'incomplete' | 'not-started' | 'in-progress';
-declare const SbbStatusElement_base: import('../core/mixins.js').AbstractConstructor<import('../icon.js').SbbIconNameMixinType> & import('../core/mixins.js').AbstractConstructor<import('../core/mixins.js').SbbElementInternalsMixinType> & typeof LitElement & import('../core/mixins.js').SbbElementInternalsConstructor;
+declare const SbbStatusElement_base: import('../core/mixins.ts').AbstractConstructor<import('../icon.ts').SbbIconNameMixinType> & import('../core/mixins.ts').AbstractConstructor<import('../core/mixins.ts').SbbElementInternalsMixinType> & typeof LitElement & import('../core/mixins.ts').SbbElementInternalsConstructor;
 /**
  * Displays a message to the user's attention.
  *

package/status/status.component.js

@@ -1,15 +1,15 @@
-var y = (t) => {
+var h = (t) => {
   throw TypeError(t);
 };
-var h = (t, s, e) => s.has(t) || y("Cannot " + e);
-var f = (t, s, e) => (h(t, s, "read from private field"), e ? e.call(t) : s.get(t)), _ = (t, s, e) => s.has(t) ? y("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(t) : s.set(t, e), n = (t, s, e, r) => (h(t, s, "write to private field"), r ? r.call(t, e) : s.set(t, e), e);
+var y = (t, s, e) => s.has(t) || h("Cannot " + e);
+var f = (t, s, e) => (y(t, s, "read from private field"), e ? e.call(t) : s.get(t)), _ = (t, s, e) => s.has(t) ? h("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(t) : s.set(t, e), n = (t, s, e, r) => (y(t, s, "write to private field"), r ? r.call(t, e) : s.set(t, e), e);
 import { __esDecorate as g, __runInitializers as b } from "tslib";
 import { css as v, LitElement as x, html as S } from "lit";
 import { customElement as z, property as k } from "lit/decorators.js";
 import { SbbElementInternalsMixin as I } from "../core/mixins.js";
 import { boxSizingStyles as E } from "../core/styles.js";
 import { SbbIconNameMixin as w } from "../icon.js";
-const N = v`:host{--sbb-status-color: var(--sbb-color-4);--sbb-status-gap: var(--sbb-spacing-fixed-1x);--sbb-status-text-color: var(--sbb-status-color);--_sbb-status-icon-color: var(--sbb-status-color);display:block}:host([type=error]){--sbb-status-color: var(--sbb-color-error)}:host([type=success]){--sbb-status-color: var(--sbb-color-success)}:host([type=warning]){--sbb-status-color: var(--sbb-color-2)}:host([type=pending]){--sbb-status-color: var(--sbb-color-sky)}:host([type=incomplete]){--sbb-status-color: var(--sbb-color-error)}:host([type=not-started]){--sbb-status-color: var(--sbb-color-5);--sbb-status-text-color: var(--sbb-color-2)}:host([type=in-progress]){--sbb-status-color: var(--sbb-color-pink)}.sbb-status{--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);display:flex;gap:var(--sbb-status-gap);color:var(--_sbb-status-text-color-override, var(--sbb-status-text-color))}.sbb-status__icon{display:flex;flex-shrink:0;color:var(--_sbb-status-icon-color);margin-block-start:calc((var(--_sbb-status-title-font-size, var(--sbb-font-size-text-s)) * var(--_sbb-status-title-line-height, var(--sbb-typo-line-height-body-text)) - var(--sbb-size-icon-ui-small)) / 2)}.sbb-status__content-slot{display:inline;margin:0;padding:0}::slotted(sbb-title){margin-block:0}`;
+const N = v`:host{--sbb-status-color: var(--sbb-color-4);--sbb-status-gap: var(--sbb-spacing-fixed-1x);--sbb-status-text-color: var(--sbb-status-color);--_sbb-status-icon-color: var(--sbb-status-color);display:block}:host([type=error]){--sbb-status-color: var(--sbb-color-error)}:host([type=success]){--sbb-status-color: var(--sbb-color-success)}:host([type=warning]){--sbb-status-color: var(--sbb-color-2)}:host([type=pending]){--sbb-status-color: var(--sbb-color-sky)}:host([type=incomplete]){--sbb-status-color: var(--sbb-color-error)}:host([type=not-started]){--sbb-status-color: var(--sbb-color-5);--sbb-status-text-color: var(--sbb-color-2)}:host([type=in-progress]){--sbb-status-color: var(--sbb-color-pink)}.sbb-status{--sbb-text-font-size: var(--sbb-text-font-size-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);display:flex;gap:var(--sbb-status-gap);color:var(--_sbb-status-text-color-override, var(--sbb-status-text-color))}.sbb-status__icon{display:flex;flex-shrink:0;color:var(--_sbb-status-icon-color);margin-block-start:calc((var(--_sbb-status-title-font-size, var(--sbb-text-font-size-s)) * var(--_sbb-status-title-line-height, var(--sbb-typo-line-height-text)) - var(--sbb-size-icon-ui-small)) / 2)}.sbb-status__content-slot{display:inline;margin:0;padding:0}::slotted(sbb-title){margin-block:0}`;
 let P = (() => {
   var i, l;
   let t = [z("sbb-status")], s, e = [], r, p = w(I(x)), u, m = [], d = [];

package/status.d.ts

@@ -1,5 +1,5 @@
 /**
  * @entrypoint
  */
-export * from './status/status.component.js';
+export * from './status/status.component.ts';
 //# sourceMappingURL=status.d.ts.map

package/stepper/step/step.component.d.ts

@@ -1,12 +1,12 @@
 import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
-import { SbbStepLabelElement } from '../step-label.js';
+import { SbbStepLabelElement } from '../step-label.ts';
 export type SbbStepValidateEventDetails = {
     currentIndex: number | null;
     currentStep: SbbStepElement | null;
     nextIndex: number | null;
     nextStep: SbbStepElement | null;
 };
-declare const SbbStepElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbElementInternalsMixinType> & typeof LitElement & import('../../core/mixins.js').SbbElementInternalsConstructor;
+declare const SbbStepElement_base: import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbElementInternalsMixinType> & typeof LitElement & import('../../core/mixins.ts').SbbElementInternalsConstructor;
 /**
  * Combined with a `sbb-stepper`, it displays a step's content.
  *

package/stepper/step/step.component.js

@@ -2,9 +2,9 @@ import { __esDecorate as o, __runInitializers as p } from "tslib";
 import { ResizeController as d } from "@lit-labs/observers/resize-controller.js";
 import { css as h, LitElement as c, html as m } from "lit";
 import { customElement as u } from "lit/decorators.js";
-import { SbbElementInternalsMixin as v, removeAriaElements as y, appendAriaElements as g } from "../../core/mixins.js";
+import { SbbElementInternalsMixin as v, removeAriaElements as g, appendAriaElements as y } from "../../core/mixins.js";
 import { boxSizingStyles as f } from "../../core/styles.js";
-const _ = h`:host{--sbb-step-position: initial;--sbb-step-inset-block-start: unset;--sbb-step-opacity: 0;--sbb-step-display: none;--sbb-step-height: 0;--sbb-step-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-step-animation-delay: 0;display:contents}:host([data-selected]){--sbb-step-opacity: 1;--sbb-step-display: block;--sbb-step-height: fit-content;--sbb-step-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-step-animation-delay: var(--sbb-step-animation-duration)}:host([data-orientation=horizontal]){--sbb-step-position: absolute;--sbb-step-inset-block-start: 0}:host([data-orientation=vertical]) .sbb-step--wrapper{margin-inline-start:var(--sbb-spacing-fixed-4x);opacity:0;height:0;transition:display var(--sbb-step-animation-duration) var(--sbb-animation-easing),height var(--sbb-stepper-animation-duration) var(--sbb-animation-easing),opacity var(--sbb-step-animation-duration) var(--sbb-animation-easing);transition-behavior:allow-discrete}:host([data-selected][data-orientation=vertical]) .sbb-step--wrapper{opacity:1;height:var(--sbb-stepper-content-height);transition:display var(--sbb-step-animation-duration) var(--sbb-animation-easing),height var(--sbb-stepper-animation-duration) var(--sbb-animation-easing),opacity var(--sbb-step-animation-duration) var(--sbb-stepper-animation-duration) var(--sbb-animation-easing);transition-behavior:allow-discrete}.sbb-step{--sbb-text-font-size: var(--sbb-font-size-text-m);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);position:var(--sbb-step-position);width:100%;inset-block-start:var(--sbb-step-inset-block-start);opacity:var(--sbb-step-opacity);display:var(--sbb-step-display);height:var(--sbb-step-height);transition-property:display,opacity;transition-duration:var(--sbb-step-animation-duration);transition-delay:var(--sbb-step-animation-delay);transition-timing-function:var(--sbb-animation-easing);transition-behavior:allow-discrete}@starting-style{.sbb-step{--sbb-step-opacity: 0}}`;
+const _ = h`:host{--sbb-step-position: initial;--sbb-step-inset-block-start: unset;--sbb-step-opacity: 0;--sbb-step-display: none;--sbb-step-height: 0;--sbb-step-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-step-animation-delay: 0;display:contents}:host([data-selected]){--sbb-step-opacity: 1;--sbb-step-display: block;--sbb-step-height: fit-content;--sbb-step-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-step-animation-delay: var(--sbb-step-animation-duration)}:host([data-orientation=horizontal]){--sbb-step-position: absolute;--sbb-step-inset-block-start: 0}:host([data-orientation=vertical]) .sbb-step--wrapper{margin-inline-start:var(--sbb-spacing-fixed-4x);opacity:0;height:0;transition:display var(--sbb-step-animation-duration) var(--sbb-animation-easing),height var(--sbb-stepper-animation-duration) var(--sbb-animation-easing),opacity var(--sbb-step-animation-duration) var(--sbb-animation-easing);transition-behavior:allow-discrete}:host([data-selected][data-orientation=vertical]) .sbb-step--wrapper{opacity:1;height:var(--sbb-stepper-content-height);transition:display var(--sbb-step-animation-duration) var(--sbb-animation-easing),height var(--sbb-stepper-animation-duration) var(--sbb-animation-easing),opacity var(--sbb-step-animation-duration) var(--sbb-stepper-animation-duration) var(--sbb-animation-easing);transition-behavior:allow-discrete}.sbb-step{--sbb-text-font-size: var(--sbb-text-font-size-m);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);position:var(--sbb-step-position);width:100%;inset-block-start:var(--sbb-step-inset-block-start);opacity:var(--sbb-step-opacity);display:var(--sbb-step-display);height:var(--sbb-step-height);transition-property:display,opacity;transition-duration:var(--sbb-step-animation-duration);transition-delay:var(--sbb-step-animation-delay);transition-timing-function:var(--sbb-animation-easing);transition-behavior:allow-discrete}@starting-style{.sbb-step{--sbb-step-opacity: 0}}`;
 let E = 0, A = (() => {
   var e;
   let b = [u("sbb-step")], n, r = [], s, l = v(c);
@@ -80,7 +80,7 @@ let E = 0, A = (() => {
       for (; t && t.localName !== "sbb-step-label"; )
         t = t.previousElementSibling;
       const i = t;
-      this.internals.ariaLabelledByElements = y(this.internals.ariaLabelledByElements, this._label), this._label = i instanceof Element ? i : null, this.internals.ariaLabelledByElements = g(this.internals.ariaLabelledByElements, this._label);
+      this.internals.ariaLabelledByElements = g(this.internals.ariaLabelledByElements, this._label), this._label = i instanceof Element ? i : null, this.internals.ariaLabelledByElements = y(this.internals.ariaLabelledByElements, this._label);
     }
     render() {
       return m`

package/stepper/step-label/step-label.component.d.ts

@@ -1,7 +1,7 @@
 import { CSSResultGroup, TemplateResult } from 'lit';
-import { SbbButtonBaseElement } from '../../core/base-elements.js';
-import { SbbStepElement } from '../step.js';
-declare const SbbStepLabelElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../icon.js').SbbIconNameMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbButtonBaseElement;
+import { SbbButtonBaseElement } from '../../core/base-elements.ts';
+import { SbbStepElement } from '../step.ts';
+declare const SbbStepLabelElement_base: import('../../core/mixins.ts').AbstractConstructor<import('../../icon.ts').SbbIconNameMixinType> & import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbDisabledMixinType> & typeof SbbButtonBaseElement;
 /**
  * Combined with a `sbb-stepper`, it displays a step's label.
  *

package/stepper/step-label/step-label.component.js

@@ -5,7 +5,7 @@ import { SbbButtonBaseElement as h } from "../../core/base-elements.js";
 import { SbbDisabledMixin as v, removeAriaElements as x, appendAriaElements as m } from "../../core/mixins.js";
 import { boxSizingStyles as u } from "../../core/styles.js";
 import { SbbIconNameMixin as g } from "../../icon.js";
-const y = c`:host{--sbb-step-label-color: var(--sbb-color-4);--sbb-step-label-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-step-label-prefix-size: var(--sbb-size-element-xxs);--sbb-step-label-prefix-border-style: solid;--sbb-step-label-prefix-border-color: var(--sbb-border-color-4-inverted);--sbb-step-label-prefix-background-color: var(--sbb-background-color-1);--sbb-step-label-gap: var(--sbb-spacing-fixed-4x);position:relative;min-width:0;max-width:fit-content}:host:before{--sbb-text-font-size: var(--sbb-font-size-text-xxs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);cursor:var(--sbb-step-label-cursor);color:var(--sbb-step-label-color);inset-block-start:calc(var(--sbb-font-size-text-l) * var(--sbb-typo-line-height-body-text) / 2 + var(--sbb-border-width-1x) / 2);inset-inline-start:calc(var(--sbb-step-label-prefix-size) / 2);line-height:1;z-index:1;transform:translate(-50%,calc(-50% + var(--sbb-step-label-translate-y-content-hover, 0rem)));transition:transform var(--sbb-step-label-animation-duration) var(--sbb-animation-easing)}@media(forced-colors:active){:host{--sbb-step-label-color: ButtonText;--sbb-step-label-prefix-border-color: ButtonText}}:host([data-selected]){--sbb-text-font-size: var(--sbb-font-size-text-xxs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);font-weight:700;--sbb-step-label-color: var(--sbb-color-3)}@media(forced-colors:active){:host([data-selected]){--sbb-step-label-color: Highlight !important}}:host([data-size=s]){--sbb-step-label-gap: var(--sbb-spacing-fixed-3x);--sbb-step-label-prefix-size: var(--sbb-size-element-xxxs)}:host([data-size=s]):before{inset-block-start:calc(var(--sbb-font-size-text-m) * var(--sbb-typo-line-height-body-text) / 2 + var(--sbb-border-width-1x) / 2)}:host(:disabled){--sbb-step-label-color: var(--sbb-color-granite);--sbb-step-label-color: light-dark(var(--sbb-color-granite), var(--sbb-color-graphite));--sbb-step-label-prefix-border-style: dashed}@media(forced-colors:active){:host(:disabled){--sbb-step-label-color: GrayText !important}}@media(any-hover:hover){:host(:hover:not(:disabled)){--sbb-step-label-cursor: var(--sbb-cursor-pointer);--sbb-step-label-prefix-background-color: var(--sbb-background-color-3);--sbb-step-label-translate-y-content-hover: -.0625rem;--sbb-step-label-prefix-size-grow-hover: calc(var(--sbb-border-width-2x) * -1)}}:host(:focus-visible){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);border-radius:var(--sbb-border-radius-1x)}:host([data-orientation=vertical]){transition:margin var(--sbb-stepper-animation-duration) var(--sbb-animation-easing)}:host([data-orientation=vertical]:not(:first-of-type)){margin-block-start:var(--sbb-spacing-fixed-6x)}:host([data-selected][data-orientation=vertical]){margin-block-end:var(--sbb-spacing-fixed-8x)}.sbb-step-label{--sbb-text-font-size: var(--sbb-font-size-text-l);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);font-weight:700;cursor:var(--sbb-step-label-cursor);position:relative;display:flex;gap:var(--sbb-step-label-gap);color:var(--sbb-step-label-color)}:host([data-size=s]) .sbb-step-label{--sbb-text-font-size: var(--sbb-font-size-text-m);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);font-weight:700}.sbb-step-label__prefix{position:relative;display:flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--sbb-step-label-prefix-size);height:var(--sbb-step-label-prefix-size);inset-block-start:calc(1em * var(--sbb-typo-line-height-body-text) / 2 + var(--sbb-border-width-1x) / 2 - var(--sbb-step-label-prefix-size) / 2)}.sbb-step-label__prefix:before{content:"";position:absolute;inset:calc(var(--sbb-step-label-prefix-size-grow-hover, 0rem));border-radius:var(--sbb-border-radius-infinity);border:var(--sbb-border-width-1x) var(--sbb-step-label-prefix-border-style) var(--sbb-step-label-prefix-border-color);background-color:var(--sbb-step-label-prefix-background-color);transition-duration:var(--sbb-step-label-animation-duration);transition-timing-function:var(--sbb-animation-easing);transition-property:background-color,inset}:host([data-orientation=horizontal]) .sbb-step-label__text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}::slotted(sbb-icon),sbb-icon{z-index:1;background-color:var(--sbb-step-label-prefix-background-color);border-radius:var(--sbb-border-radius-infinity);transform:translateY(var(--sbb-step-label-translate-y-content-hover, 0rem));transition-duration:var(--sbb-step-label-animation-duration);transition-timing-function:var(--sbb-animation-easing);transition-property:background-color,transform}`;
+const y = c`:host{--sbb-step-label-color: var(--sbb-color-4);--sbb-step-label-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-step-label-prefix-size: var(--sbb-size-element-xxs);--sbb-step-label-prefix-border-style: solid;--sbb-step-label-prefix-border-color: var(--sbb-border-color-4-inverted);--sbb-step-label-prefix-background-color: var(--sbb-background-color-1);--sbb-step-label-gap: var(--sbb-spacing-fixed-4x);position:relative;min-width:0;max-width:fit-content}:host:before{--sbb-text-font-size: var(--sbb-text-font-size-xxs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);cursor:var(--sbb-step-label-cursor);color:var(--sbb-step-label-color);inset-block-start:calc(var(--sbb-text-font-size-l) * var(--sbb-typo-line-height-text) / 2 + var(--sbb-border-width-1x) / 2);inset-inline-start:calc(var(--sbb-step-label-prefix-size) / 2);line-height:1;z-index:1;transform:translate(-50%,calc(-50% + var(--sbb-step-label-translate-y-content-hover, 0rem)));transition:transform var(--sbb-step-label-animation-duration) var(--sbb-animation-easing)}@media(forced-colors:active){:host{--sbb-step-label-color: ButtonText;--sbb-step-label-prefix-border-color: ButtonText}}:host([data-selected]){--sbb-text-font-size: var(--sbb-text-font-size-xxs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);font-weight:700;--sbb-step-label-color: var(--sbb-color-3)}@media(forced-colors:active){:host([data-selected]){--sbb-step-label-color: Highlight !important}}:host([data-size=s]){--sbb-step-label-gap: var(--sbb-spacing-fixed-3x);--sbb-step-label-prefix-size: var(--sbb-size-element-xxxs)}:host([data-size=s]):before{inset-block-start:calc(var(--sbb-text-font-size-m) * var(--sbb-typo-line-height-text) / 2 + var(--sbb-border-width-1x) / 2)}:host(:disabled){--sbb-step-label-color: var(--sbb-color-granite);--sbb-step-label-color: light-dark(var(--sbb-color-granite), var(--sbb-color-graphite));--sbb-step-label-prefix-border-style: dashed}@media(forced-colors:active){:host(:disabled){--sbb-step-label-color: GrayText !important}}@media(any-hover:hover){:host(:hover:not(:disabled)){--sbb-step-label-cursor: var(--sbb-cursor-pointer);--sbb-step-label-prefix-background-color: var(--sbb-background-color-3);--sbb-step-label-translate-y-content-hover: -.0625rem;--sbb-step-label-prefix-size-grow-hover: calc(var(--sbb-border-width-2x) * -1)}}:host(:focus-visible){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);border-radius:var(--sbb-border-radius-1x)}:host([data-orientation=vertical]){transition:margin var(--sbb-stepper-animation-duration) var(--sbb-animation-easing)}:host([data-orientation=vertical]:not(:first-of-type)){margin-block-start:var(--sbb-spacing-fixed-6x)}:host([data-selected][data-orientation=vertical]){margin-block-end:var(--sbb-spacing-fixed-8x)}.sbb-step-label{--sbb-text-font-size: var(--sbb-text-font-size-l);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);font-weight:700;cursor:var(--sbb-step-label-cursor);position:relative;display:flex;gap:var(--sbb-step-label-gap);color:var(--sbb-step-label-color)}:host([data-size=s]) .sbb-step-label{--sbb-text-font-size: var(--sbb-text-font-size-m);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);font-weight:700}.sbb-step-label__prefix{position:relative;display:flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--sbb-step-label-prefix-size);height:var(--sbb-step-label-prefix-size);inset-block-start:calc(1em * var(--sbb-typo-line-height-text) / 2 + var(--sbb-border-width-1x) / 2 - var(--sbb-step-label-prefix-size) / 2)}.sbb-step-label__prefix:before{content:"";position:absolute;inset:calc(var(--sbb-step-label-prefix-size-grow-hover, 0rem));border-radius:var(--sbb-border-radius-infinity);border:var(--sbb-border-width-1x) var(--sbb-step-label-prefix-border-style) var(--sbb-step-label-prefix-border-color);background-color:var(--sbb-step-label-prefix-background-color);transition-duration:var(--sbb-step-label-animation-duration);transition-timing-function:var(--sbb-animation-easing);transition-property:background-color,inset}:host([data-orientation=horizontal]) .sbb-step-label__text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}::slotted(sbb-icon),sbb-icon{z-index:1;background-color:var(--sbb-step-label-prefix-background-color);border-radius:var(--sbb-border-radius-infinity);transform:translateY(var(--sbb-step-label-translate-y-content-hover, 0rem));transition-duration:var(--sbb-step-label-animation-duration);transition-timing-function:var(--sbb-animation-easing);transition-property:background-color,transform}`;
 let z = 0, C = (() => {
   var e;
   let o = [f("sbb-step-label")], i, r = [], s, b = g(v(h));

package/stepper/step-label.d.ts

@@ -1,5 +1,5 @@
 /**
  * @entrypoint
  */
-export * from './step-label/step-label.component.js';
+export * from './step-label/step-label.component.ts';
 //# sourceMappingURL=step-label.d.ts.map

package/stepper/step.d.ts

@@ -1,5 +1,5 @@
 /**
  * @entrypoint
  */
-export * from './step/step.component.js';
+export * from './step/step.component.ts';
 //# sourceMappingURL=step.d.ts.map

package/stepper/stepper/stepper.component.d.ts

@@ -1,7 +1,7 @@
 import { CSSResultGroup, LitElement, TemplateResult, PropertyValues } from 'lit';
-import { SbbHorizontalFrom, SbbOrientation } from '../../core/interfaces.js';
-import { SbbStepElement } from '../step.js';
-declare const SbbStepperElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbHydrationMixinType> & typeof LitElement;
+import { SbbHorizontalFrom, SbbOrientation } from '../../core/interfaces.ts';
+import { SbbStepElement } from '../step.ts';
+declare const SbbStepperElement_base: import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbHydrationMixinType> & typeof LitElement;
 /**
  * Provides a structured, step-by-step workflow for user interactions.
  * @slot - Provide a `sbb-expansion-panel-header` and a `sbb-expansion-panel-content` to the stepper.

package/stepper/stepper.d.ts

@@ -1,5 +1,5 @@
 /**
  * @entrypoint
  */
-export * from './stepper/stepper.component.js';
+export * from './stepper/stepper.component.ts';
 //# sourceMappingURL=stepper.d.ts.map

package/stepper.d.ts

@@ -1,7 +1,7 @@
 /**
  * @entrypoint
  */
-export * from './stepper/step.js';
-export * from './stepper/step-label.js';
-export * from './stepper/stepper.js';
+export * from './stepper/step.ts';
+export * from './stepper/step-label.ts';
+export * from './stepper/stepper.ts';
 //# sourceMappingURL=stepper.d.ts.map

package/table/table-wrapper/table-wrapper.component.d.ts

@@ -1,5 +1,5 @@
 import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
-declare const SbbTableWrapperElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbNegativeMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbElementInternalsMixinType> & typeof LitElement & import('../../core/mixins.js').SbbElementInternalsConstructor;
+declare const SbbTableWrapperElement_base: import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbNegativeMixinType> & import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbElementInternalsMixinType> & typeof LitElement & import('../../core/mixins.ts').SbbElementInternalsConstructor;
 /**
  * Wraps a table to enhance its functionality.
  *

package/table/table-wrapper.d.ts

@@ -1,5 +1,5 @@
 /**
  * @entrypoint
  */
-export * from './table-wrapper/table-wrapper.component.js';
+export * from './table-wrapper/table-wrapper.component.ts';
 //# sourceMappingURL=table-wrapper.d.ts.map

package/table.css

@@ -50,11 +50,11 @@
 .sbb-table-m thead > tr > th,
 .sbb-table-s thead > tr > th,
 .sbb-table-xs thead > tr > th {
-  --sbb-text-font-size: var(--sbb-font-size-text-xs);
+  --sbb-text-font-size: var(--sbb-text-font-size-xs);
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
-  line-height: var(--sbb-typo-line-height-body-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-body-text);
+  line-height: var(--sbb-typo-line-height-text);
+  letter-spacing: var(--sbb-typo-letter-spacing-text);
   font-size: var(--sbb-text-font-size);
   font-weight: bold;
   background-color: var(--sbb-table-background-color);
@@ -73,11 +73,11 @@
 .sbb-table-m tbody > tr > td,
 .sbb-table-s tbody > tr > td,
 .sbb-table-xs tbody > tr > td {
-  --sbb-text-font-size: var(--sbb-font-size-text-s);
+  --sbb-text-font-size: var(--sbb-text-font-size-s);
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
-  line-height: var(--sbb-typo-line-height-body-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-body-text);
+  line-height: var(--sbb-typo-line-height-text);
+  letter-spacing: var(--sbb-typo-letter-spacing-text);
   font-size: var(--sbb-text-font-size);
   background-color: var(--sbb-table-background-color);
   border-block-end: var(--sbb-table-border);
@@ -95,11 +95,11 @@
 .sbb-table-m caption,
 .sbb-table-s caption,
 .sbb-table-xs caption {
-  --sbb-text-font-size: var(--sbb-font-size-text-xs);
+  --sbb-text-font-size: var(--sbb-text-font-size-xs);
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
-  line-height: var(--sbb-typo-line-height-body-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-body-text);
+  line-height: var(--sbb-typo-line-height-text);
+  letter-spacing: var(--sbb-typo-letter-spacing-text);
   font-size: var(--sbb-text-font-size);
   --sbb-table-caption-color-fallback: var(--sbb-color-granite);
   --sbb-table-caption-color-fallback: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
@@ -122,11 +122,11 @@
   --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
 }
 .sbb-table-s tbody > tr > td {
-  --sbb-text-font-size: var(--sbb-font-size-text-xs);
+  --sbb-text-font-size: var(--sbb-text-font-size-xs);
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
-  line-height: var(--sbb-typo-line-height-body-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-body-text);
+  line-height: var(--sbb-typo-line-height-text);
+  letter-spacing: var(--sbb-typo-letter-spacing-text);
   font-size: var(--sbb-text-font-size);
 }
 
@@ -137,11 +137,11 @@
   --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-1x);
 }
 .sbb-table-xs tbody > tr > td {
-  --sbb-text-font-size: var(--sbb-font-size-text-xs);
+  --sbb-text-font-size: var(--sbb-text-font-size-xs);
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
-  line-height: var(--sbb-typo-line-height-body-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-body-text);
+  line-height: var(--sbb-typo-line-height-text);
+  letter-spacing: var(--sbb-typo-letter-spacing-text);
   font-size: var(--sbb-text-font-size);
 }
 
@@ -177,11 +177,11 @@ sbb-table-wrapper[negative] .sbb-table,
 }
 
 .sbb-table-header-cell {
-  --sbb-text-font-size: var(--sbb-font-size-text-xs);
+  --sbb-text-font-size: var(--sbb-text-font-size-xs);
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
-  line-height: var(--sbb-typo-line-height-body-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-body-text);
+  line-height: var(--sbb-typo-line-height-text);
+  letter-spacing: var(--sbb-typo-letter-spacing-text);
   font-size: var(--sbb-text-font-size);
   font-weight: bold;
   background-color: var(--sbb-table-background-color);
@@ -196,11 +196,11 @@ sbb-table-wrapper[negative] .sbb-table,
 }
 
 .sbb-table-data-cell {
-  --sbb-text-font-size: var(--sbb-font-size-text-s);
+  --sbb-text-font-size: var(--sbb-text-font-size-s);
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
-  line-height: var(--sbb-typo-line-height-body-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-body-text);
+  line-height: var(--sbb-typo-line-height-text);
+  letter-spacing: var(--sbb-typo-letter-spacing-text);
   font-size: var(--sbb-text-font-size);
   background-color: var(--sbb-table-background-color);
   border-block-end: var(--sbb-table-border);
@@ -210,11 +210,11 @@ sbb-table-wrapper[negative] .sbb-table,
 }
 
 .sbb-table-caption {
-  --sbb-text-font-size: var(--sbb-font-size-text-xs);
+  --sbb-text-font-size: var(--sbb-text-font-size-xs);
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
-  line-height: var(--sbb-typo-line-height-body-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-body-text);
+  line-height: var(--sbb-typo-line-height-text);
+  letter-spacing: var(--sbb-typo-letter-spacing-text);
   font-size: var(--sbb-text-font-size);
   --sbb-table-caption-color-fallback: var(--sbb-color-granite);
   --sbb-table-caption-color-fallback: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
@@ -272,10 +272,10 @@ html.sbb-lean .sbb-table:not(.sbb-table-xs, .sbb-table-m) {
   --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
 }
 html.sbb-lean .sbb-table:not(.sbb-table-xs, .sbb-table-m) tbody > tr > td {
-  --sbb-text-font-size: var(--sbb-font-size-text-xs);
+  --sbb-text-font-size: var(--sbb-text-font-size-xs);
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
-  line-height: var(--sbb-typo-line-height-body-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-body-text);
+  line-height: var(--sbb-typo-line-height-text);
+  letter-spacing: var(--sbb-typo-letter-spacing-text);
   font-size: var(--sbb-text-font-size);
 }

package/table.d.ts

@@ -1,5 +1,5 @@
 /**
  * @entrypoint
  */
-export * from './table/table-wrapper.js';
+export * from './table/table-wrapper.ts';
 //# sourceMappingURL=table.d.ts.map

package/tabs/tab/tab.component.d.ts

@@ -1,7 +1,7 @@
 import { CSSResultGroup, TemplateResult, LitElement } from 'lit';
-import { SbbTabGroupElement } from '../tab-group/tab-group.component.js';
-import { SbbTabLabelElement } from '../tab-label.js';
-declare const SbbTabElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbElementInternalsMixinType> & typeof LitElement & import('../../core/mixins.js').SbbElementInternalsConstructor;
+import { SbbTabGroupElement } from '../tab-group/tab-group.component.ts';
+import { SbbTabLabelElement } from '../tab-label.ts';
+declare const SbbTabElement_base: import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbElementInternalsMixinType> & typeof LitElement & import('../../core/mixins.ts').SbbElementInternalsConstructor;
 /**
  * Combined with a `sbb-tab-group` and `sbb-tab-label`, it displays a tab's content.
  *

package/tabs/tab-group/tab-group.component.d.ts

@@ -1,6 +1,6 @@
 import { CSSResultGroup, PropertyValues, TemplateResult, LitElement } from 'lit';
-import { SbbTabLabelElement } from '../tab-label.js';
-import { SbbTabElement } from '../tab.js';
+import { SbbTabLabelElement } from '../tab-label.ts';
+import { SbbTabElement } from '../tab.ts';
 export type SbbTabChangedEventDetails = {
     activeIndex: number;
     activeTabLabel: SbbTabLabelElement;
@@ -30,7 +30,7 @@ export interface InterfaceSbbTabGroupTab extends SbbTabLabelElement {
     tabGroupActions?: InterfaceSbbTabGroupActions;
     size: 's' | 'l' | 'xl';
 }
-declare const SbbTabGroupElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbElementInternalsMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbHydrationMixinType> & typeof LitElement & import('../../core/mixins.js').SbbElementInternalsConstructor;
+declare const SbbTabGroupElement_base: import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbElementInternalsMixinType> & import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbHydrationMixinType> & typeof LitElement & import('../../core/mixins.ts').SbbElementInternalsConstructor;
 /**
  * It displays one or more tabs, each one with a label and some content.
  *

package/tabs/tab-group.d.ts

@@ -1,5 +1,5 @@
 /**
  * @entrypoint
  */
-export * from './tab-group/tab-group.component.js';
+export * from './tab-group/tab-group.component.ts';
 //# sourceMappingURL=tab-group.d.ts.map

package/tabs/tab-label/tab-label.component.d.ts

@@ -1,8 +1,8 @@
 import { CSSResultGroup, PropertyValues, TemplateResult, LitElement } from 'lit';
-import { SbbTitleLevel } from '../../title.js';
-import { SbbTabElement } from '../tab/tab.component.js';
-import { SbbTabGroupElement } from '../tab-group.js';
-declare const SbbTabLabelElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../icon.js').SbbIconNameMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbElementInternalsMixinType> & typeof LitElement & import('../../core/mixins.js').SbbElementInternalsConstructor;
+import { SbbTitleLevel } from '../../title.ts';
+import { SbbTabElement } from '../tab/tab.component.ts';
+import { SbbTabGroupElement } from '../tab-group.ts';
+declare const SbbTabLabelElement_base: import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbDisabledMixinType> & import('../../core/mixins.ts').AbstractConstructor<import('../../icon.ts').SbbIconNameMixinType> & import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbElementInternalsMixinType> & typeof LitElement & import('../../core/mixins.ts').SbbElementInternalsConstructor;
 /**
  * Combined with a `sbb-tab-group`, it displays a tab's title.
  *

package/tabs/tab-label/tab-label.component.js

@@ -2,7 +2,7 @@ var S = (a) => {
   throw TypeError(a);
 };
 var E = (a, s, b) => s.has(a) || S("Cannot " + b);
-var h = (a, s, b) => (E(a, s, "read from private field"), b ? b.call(a) : s.get(a)), m = (a, s, b) => s.has(a) ? S("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(a) : s.set(a, b), n = (a, s, b, o) => (E(a, s, "write to private field"), o ? o.call(a, b) : s.set(a, b), b);
+var d = (a, s, b) => (E(a, s, "read from private field"), b ? b.call(a) : s.get(a)), m = (a, s, b) => s.has(a) ? S("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(a) : s.set(a, b), n = (a, s, b, o) => (E(a, s, "write to private field"), o ? o.call(a, b) : s.set(a, b), b);
 import { __esDecorate as u, __runInitializers as r } from "tslib";
 import { css as B, LitElement as C } from "lit";
 import { customElement as D, property as f } from "lit/decorators.js";
@@ -11,41 +11,41 @@ import { forceType as $, omitEmptyConverter as N } from "../../core/decorators.j
 import { SbbDisabledMixin as A, SbbElementInternalsMixin as G } from "../../core/mixins.js";
 import { boxSizingStyles as j } from "../../core/styles.js";
 import { SbbIconNameMixin as O } from "../../icon.js";
-const U = B`:host{--sbb-tab-label-height: var(--sbb-size-element-m);--sbb-tab-label-color: var(--sbb-color-granite);--sbb-tab-label-color: light-dark(var(--sbb-color-granite), var(--sbb-color-graphite));--sbb-tab-label-line-color: var(--sbb-border-color-4-inverted);--sbb-tab-label-cursor: var(--sbb-cursor-pointer);--sbb-tab-label-pointer-events: unset;--sbb-tab-label-inset: 0;--sbb-tab-label-inline-padding: var(--sbb-spacing-responsive-xs);--sbb-tab-label-marker-transform: scale(0);--sbb-tab-label-text-decoration: none;--sbb-tab-label-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-tab-label-animation-easing: var(--sbb-animation-easing);--sbb-tab-label-amount-color: var(--sbb-color-metal);--sbb-tab-label-amount-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));display:inline-block;max-width:100%;pointer-events:var(--sbb-tab-label-pointer-events);-webkit-tap-highlight-color:transparent;outline:none!important}@media(forced-colors:active){:host{--sbb-tab-label-color: ButtonText;--sbb-tab-label-amount-color: ButtonText}}:host([data-size=s]){--sbb-tab-label-height: var(--sbb-size-element-xs);--sbb-tab-label-inline-padding: var(--sbb-spacing-responsive-xxxs)}:host([disabled]){--sbb-tab-label-cursor: unset;--sbb-tab-label-pointer-events: none;--sbb-tab-label-text-decoration: line-through}@media(forced-colors:active){:host([disabled]){--sbb-tab-label-color: GrayText;--sbb-tab-label-amount-color: GrayText}}:host([active]:not([disabled])){--sbb-tab-label-color: var(--sbb-color-3);--sbb-tab-label-cursor: unset;--sbb-tab-label-pointer-events: none;--sbb-tab-label-marker-transform: scale(1)}@media(forced-colors:active){:host([active]:not([disabled])){--sbb-tab-label-color: ButtonText;--sbb-tab-label-amount-color: ButtonText}}@media(any-hover:hover){:host(:hover:not([disabled])){--sbb-tab-label-marker-transform: scale(1)}}:host(:active){--sbb-tab-label-color: var(--sbb-color-3)}.sbb-tab-label__wrapper{position:relative}:host(:focus-visible) .sbb-tab-label__wrapper:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);content:"";position:absolute;display:block;inset:0;z-index:1;border-radius:calc(var(--sbb-border-radius-2x) - var(--sbb-focus-outline-offset))}.sbb-tab-label{position:relative;margin:0;min-height:var(--sbb-tab-label-height);display:flex;align-items:center;padding-inline:var(--sbb-tab-label-inline-padding);gap:var(--sbb-spacing-fixed-2x);-webkit-user-select:none;user-select:none;cursor:var(--sbb-tab-label-cursor);transition:color var(--sbb-tab-label-animation-duration) var(--sbb-tab-label-animation-easing)}:host([data-has-divider]) .sbb-tab-label:after{content:"";position:absolute;inset-inline-start:0;inset-block-end:0;width:var(--sbb-tab-group-width);height:var(--sbb-border-width-1x);background-color:var(--sbb-tab-label-line-color)}.sbb-tab-label:before{position:absolute;content:"";inset-inline:0;inset-block-end:0;height:var(--sbb-border-width-3x);background-color:var(--sbb-tab-label-color);transform:var(--sbb-tab-label-marker-transform);transition-duration:var(--sbb-tab-label-animation-duration);transition-timing-function:var(--sbb-tab-label-animation-easing);transition-property:transform,background-color;z-index:1}.sbb-tab-label__icon,.sbb-tab-label__text,.sbb-tab-label__amount{text-decoration:var(--sbb-tab-label-text-decoration)}.sbb-tab-label__icon{display:flex;flex-shrink:0;color:var(--sbb-tab-label-color);transition:color var(--sbb-tab-label-animation-duration) var(--sbb-tab-label-animation-easing)}:host(:not(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-tab-label__icon{display:none}.sbb-tab-label__text{color:var(--sbb-tab-label-color);transition:color var(--sbb-tab-label-animation-duration) var(--sbb-tab-label-animation-easing);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;--sbb-text-font-size: var(--sbb-font-size-text-m);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);font-weight:700}:host([data-size=s]) .sbb-tab-label__text{--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);font-weight:700}:host([data-size=xl]) .sbb-tab-label__text{--sbb-text-font-size: var(--sbb-font-size-text-xl);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);font-weight:700}:host(:not(:is(:state(slotted),[state--slotted]))) .sbb-tab-label__text{display:none}.sbb-tab-label__amount{display:flex;color:var(--sbb-tab-label-amount-color);transition:color var(--sbb-tab-label-animation-duration) var(--sbb-tab-label-animation-easing);--sbb-text-font-size: var(--sbb-font-size-text-m);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size)}:host(:not(:is(:state(slotted-amount),[state--slotted-amount]),[amount])) .sbb-tab-label__amount{display:none}:host([data-size=s]) .sbb-tab-label__amount{--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size)}:host([data-size=xl]) .sbb-tab-label__amount{--sbb-text-font-size: var(--sbb-font-size-text-xl);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size)}`;
+const U = B`:host{--sbb-tab-label-height: var(--sbb-size-element-m);--sbb-tab-label-color: var(--sbb-color-granite);--sbb-tab-label-color: light-dark(var(--sbb-color-granite), var(--sbb-color-graphite));--sbb-tab-label-line-color: var(--sbb-border-color-4-inverted);--sbb-tab-label-cursor: var(--sbb-cursor-pointer);--sbb-tab-label-pointer-events: unset;--sbb-tab-label-inline-padding: var(--sbb-spacing-responsive-xs);--sbb-tab-label-marker-transform: scale(0);--sbb-tab-label-text-decoration: none;--sbb-tab-label-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-tab-label-animation-easing: var(--sbb-animation-easing);--sbb-tab-label-amount-color: var(--sbb-color-metal);--sbb-tab-label-amount-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));display:inline-block;max-width:100%;pointer-events:var(--sbb-tab-label-pointer-events);-webkit-tap-highlight-color:transparent;outline:none!important}@media(forced-colors:active){:host{--sbb-tab-label-color: ButtonText;--sbb-tab-label-amount-color: ButtonText}}:host([data-size=s]){--sbb-tab-label-height: var(--sbb-size-element-xs);--sbb-tab-label-inline-padding: var(--sbb-spacing-responsive-xxxs)}:host([disabled]){--sbb-tab-label-cursor: unset;--sbb-tab-label-pointer-events: none;--sbb-tab-label-text-decoration: line-through}@media(forced-colors:active){:host([disabled]){--sbb-tab-label-color: GrayText;--sbb-tab-label-amount-color: GrayText}}:host([active]:not([disabled])){--sbb-tab-label-color: var(--sbb-color-3);--sbb-tab-label-cursor: unset;--sbb-tab-label-pointer-events: none;--sbb-tab-label-marker-transform: scale(1)}@media(forced-colors:active){:host([active]:not([disabled])){--sbb-tab-label-color: ButtonText;--sbb-tab-label-amount-color: ButtonText}}@media(any-hover:hover){:host(:hover:not([disabled])){--sbb-tab-label-marker-transform: scale(1)}}:host(:active){--sbb-tab-label-color: var(--sbb-color-3)}.sbb-tab-label__wrapper{position:relative}:host(:focus-visible) .sbb-tab-label__wrapper:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);content:"";position:absolute;display:block;inset:0;z-index:1;border-radius:calc(var(--sbb-border-radius-2x) - var(--sbb-focus-outline-offset))}.sbb-tab-label{position:relative;margin:0;min-height:var(--sbb-tab-label-height);display:flex;align-items:center;padding-inline:var(--sbb-tab-label-inline-padding);gap:var(--sbb-spacing-fixed-2x);-webkit-user-select:none;user-select:none;cursor:var(--sbb-tab-label-cursor);transition:color var(--sbb-tab-label-animation-duration) var(--sbb-tab-label-animation-easing)}:host([data-has-divider]) .sbb-tab-label:after{content:"";position:absolute;inset-inline-start:0;inset-block-end:0;width:var(--sbb-tab-group-width);height:var(--sbb-border-width-1x);background-color:var(--sbb-tab-label-line-color)}.sbb-tab-label:before{position:absolute;content:"";inset-inline:0;inset-block-end:0;height:var(--sbb-border-width-3x);background-color:var(--sbb-tab-label-color);transform:var(--sbb-tab-label-marker-transform);transition-duration:var(--sbb-tab-label-animation-duration);transition-timing-function:var(--sbb-tab-label-animation-easing);transition-property:transform,background-color;z-index:1}.sbb-tab-label__icon,.sbb-tab-label__text,.sbb-tab-label__amount{text-decoration:var(--sbb-tab-label-text-decoration)}.sbb-tab-label__icon{display:flex;flex-shrink:0;color:var(--sbb-tab-label-color);transition:color var(--sbb-tab-label-animation-duration) var(--sbb-tab-label-animation-easing)}:host(:not(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-tab-label__icon{display:none}.sbb-tab-label__text{color:var(--sbb-tab-label-color);transition:color var(--sbb-tab-label-animation-duration) var(--sbb-tab-label-animation-easing);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;--sbb-text-font-size: var(--sbb-text-font-size-m);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);font-weight:700}:host([data-size=s]) .sbb-tab-label__text{--sbb-text-font-size: var(--sbb-text-font-size-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);font-weight:700}:host([data-size=xl]) .sbb-tab-label__text{--sbb-text-font-size: var(--sbb-text-font-size-xl);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);font-weight:700}:host(:not(:is(:state(slotted),[state--slotted]))) .sbb-tab-label__text{display:none}.sbb-tab-label__amount{display:flex;color:var(--sbb-tab-label-amount-color);transition:color var(--sbb-tab-label-animation-duration) var(--sbb-tab-label-animation-easing);--sbb-text-font-size: var(--sbb-text-font-size-m);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size)}:host(:not(:is(:state(slotted-amount),[state--slotted-amount]),[amount])) .sbb-tab-label__amount{display:none}:host([data-size=s]) .sbb-tab-label__amount{--sbb-text-font-size: var(--sbb-text-font-size-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size)}:host([data-size=xl]) .sbb-tab-label__amount{--sbb-text-font-size: var(--sbb-text-font-size-xl);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size)}`;
 let Y = (() => {
-  var c, v, d, i;
+  var c, v, h, i;
   let a = [D("sbb-tab-label")], s, b = [], o, p = A(O(G(C))), x, g = [], _ = [], y, z = [], w = [], k, T = [], I = [];
   return i = class extends p {
     constructor() {
       super();
       m(this, c);
       m(this, v);
-      m(this, d);
-      this._selected = !1, n(this, c, r(this, g, "1")), n(this, v, (r(this, _), r(this, z, !1))), n(this, d, (r(this, w), r(this, T, ""))), r(this, I), this.addEventListener("click", () => this.activate());
+      m(this, h);
+      this._selected = !1, n(this, c, r(this, g, "1")), n(this, v, (r(this, _), r(this, z, !1))), n(this, h, (r(this, w), r(this, T, ""))), r(this, I), this.addEventListener("click", () => this.activate());
     }
     /**
      * The level will correspond to the heading tag generated in the title.
      * Use this property to generate the appropriate header tag, taking SEO into consideration.
      */
     get level() {
-      return h(this, c);
+      return d(this, c);
     }
     set level(t) {
       n(this, c, t);
     }
     /** Active tab state. */
     get active() {
-      return h(this, v);
+      return d(this, v);
     }
     set active(t) {
       n(this, v, t);
     }
     /** Amount displayed inside the tab. */
     get amount() {
-      return h(this, d);
+      return d(this, h);
     }
     set amount(t) {
-      n(this, d, t);
+      n(this, h, t);
     }
     /** Get the `sbb-tab` related to the `sbb-tab-label`. */
     get tab() {
@@ -107,7 +107,7 @@ let Y = (() => {
       </div>
     `;
     }
-  }, c = new WeakMap(), v = new WeakMap(), d = new WeakMap(), o = i, (() => {
+  }, c = new WeakMap(), v = new WeakMap(), h = new WeakMap(), o = i, (() => {
     const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(p[Symbol.metadata] ?? null) : void 0;
     x = [f()], y = [$(), f({ reflect: !0, type: Boolean })], k = [$(), f({ reflect: !0, converter: N })], u(i, null, x, { kind: "accessor", name: "level", static: !1, private: !1, access: { has: (e) => "level" in e, get: (e) => e.level, set: (e, l) => {
       e.level = l;

package/tabs/tab-label.d.ts

@@ -1,5 +1,5 @@
 /**
  * @entrypoint
  */
-export * from './tab-label/tab-label.component.js';
+export * from './tab-label/tab-label.component.ts';
 //# sourceMappingURL=tab-label.d.ts.map

package/tabs/tab.d.ts

@@ -1,5 +1,5 @@
 /**
  * @entrypoint
  */
-export * from './tab/tab.component.js';
+export * from './tab/tab.component.ts';
 //# sourceMappingURL=tab.d.ts.map

package/tabs.d.ts

@@ -1,7 +1,7 @@
 /**
  * @entrypoint
  */
-export * from './tabs/tab.js';
-export * from './tabs/tab-group.js';
-export * from './tabs/tab-label.js';
+export * from './tabs/tab.ts';
+export * from './tabs/tab-group.ts';
+export * from './tabs/tab-label.ts';
 //# sourceMappingURL=tabs.d.ts.map

package/tag/tag/tag.component.d.ts

@@ -1,8 +1,8 @@
 import { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
-import { SbbButtonLikeBaseElement } from '../../core/base-elements.js';
-import { FormRestoreReason, FormRestoreState } from '../../core/mixins.js';
+import { SbbButtonLikeBaseElement } from '../../core/base-elements.ts';
+import { FormRestoreReason, FormRestoreState } from '../../core/mixins.ts';
 export type SbbTagSize = 's' | 'm';
-declare const SbbTagElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../icon.js').SbbIconNameMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType & import('../../core/mixins.js').SbbDisabledInteractiveMixinType> & typeof SbbButtonLikeBaseElement;
+declare const SbbTagElement_base: import('../../core/mixins.ts').AbstractConstructor<import('../../icon.ts').SbbIconNameMixinType> & import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbDisabledMixinType & import('../../core/mixins.ts').SbbDisabledInteractiveMixinType> & typeof SbbButtonLikeBaseElement;
 /**
  * It displays a selectable element which can be used as a filter.
  *

package/tag/tag/tag.component.js

@@ -12,7 +12,7 @@ import { isLean as j } from "../../core/dom.js";
 import { SbbDisabledTabIndexActionMixin as M } from "../../core/mixins.js";
 import { boxSizingStyles as R } from "../../core/styles.js";
 import { SbbIconNameMixin as U } from "../../icon.js";
-const Y = V`:host{display:inline-block;outline:none!important;max-width:100%;--sbb-tag-border-radius: var(--sbb-border-radius-infinity);--sbb-tag-background-color: var(--sbb-background-color-1);--sbb-tag-border-color: var(--sbb-border-color-4-inverted);--sbb-tag-border-style: solid;--sbb-tag-border-width: var(--sbb-border-width-1x);--sbb-tag-text-color: var(--sbb-color-2);--sbb-tag-amount-color: var(--sbb-color-metal);--sbb-tag-amount-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));--sbb-tag-height: var(--sbb-size-element-xs);--sbb-tag-inset: 0;--sbb-tag-cursor: var(--sbb-cursor-pointer);--sbb-tag-content-shift: translateY(0);--sbb-tag-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-tag-animation-easing: var(--sbb-animation-easing);--sbb-tag-padding-inline: var(--sbb-spacing-fixed-5x);--sbb-tag-gap: var(--sbb-spacing-fixed-2x)}@media(forced-colors:active){:host{--sbb-tag-background-color: Canvas !important;--sbb-tag-text-color: ButtonText;--sbb-tag-amount-color: ButtonText;--sbb-tag-border-color: CanvasText;--sbb-tag-border-width: var(--sbb-border-width-2x)}}:host([data-checked]){--sbb-tag-border-color: var(--sbb-border-color-3);--sbb-tag-border-width: var(--sbb-border-width-2x)}@media(forced-colors:active){:host([data-checked]){--sbb-tag-border-color: Highlight !important;--sbb-tag-border-width: var(--sbb-border-width-4x)}}:host(:is(:disabled,[disabled-interactive])){--sbb-tag-text-color: var(--sbb-color-granite);--sbb-tag-text-color: light-dark(var(--sbb-color-granite), var(--sbb-color-aluminium));--sbb-tag-amount-color: var(--sbb-tag-text-color);--sbb-tag-background-color: var(--sbb-background-color-3);--sbb-tag-border-color: var(--sbb-color-cement);--sbb-tag-border-color: light-dark(var(--sbb-color-cement), var(--sbb-color-smoke));--sbb-tag-border-style: dashed;--sbb-tag-cursor: unset;--sbb-tag-pointer-events: none}@media(forced-colors:active){:host(:is(:disabled,[disabled-interactive])){--sbb-tag-text-color: GrayText;--sbb-tag-amount-color: GrayText;--sbb-tag-border-color: GrayText}}:host([data-checked]:is(:disabled,[disabled-interactive])){--sbb-tag-border-color: var(--sbb-color-metal);--sbb-tag-border-color: light-dark(var(--sbb-color-metal), var(--sbb-color-cement));--sbb-tag-border-style: dashed}@media(any-hover:hover){:host(:hover:not(:disabled,[disabled-interactive],:active,[data-active])){--sbb-tag-background-color: var(--sbb-background-color-3);--sbb-tag-inset: calc(var(--sbb-border-width-2x) * -1);--sbb-tag-content-shift: translateY(calc(var(--sbb-border-width-1x) * -1))}}@media(any-hover:hover)and (forced-colors:active){:host(:hover:not(:disabled,[disabled-interactive],:active,[data-active])){--sbb-tag-border-color: Highlight}}:host(:is(:active,[data-active]):not(:disabled,[disabled-interactive])){--sbb-tag-background-color: var(--sbb-background-color-3);--sbb-tag-border-color: var(--sbb-color-iron);--sbb-tag-border-color: light-dark(var(--sbb-color-iron), var(--sbb-color-storm));--sbb-tag-border-width: var(--sbb-border-width-2x);--sbb-tag-text-color: var(--sbb-color-4)}@media(forced-colors:active){:host(:is(:active,[data-active]):not(:disabled,[disabled-interactive])){--sbb-tag-border-color: Highlight;--sbb-tag-text-color: ButtonText}}:host([size=s]){--sbb-tag-height: var(--sbb-size-element-xxxs);--sbb-tag-padding-inline: var(--sbb-spacing-fixed-3x)}.sbb-tag{--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);font-weight:700;position:relative;display:flex;align-items:center;height:var(--sbb-tag-height);max-width:100%;gap:var(--sbb-tag-gap);padding-inline:var(--sbb-tag-padding-inline);cursor:var(--sbb-tag-cursor);border-radius:var(--sbb-tag-border-radius);color:var(--sbb-tag-text-color);transition:color var(--sbb-tag-animation-duration) var(--sbb-tag-animation-easing);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;pointer-events:var(--sbb-tag-pointer-events, unset)}.sbb-tag:before{content:"";position:absolute;inset:var(--sbb-tag-inset);background-color:var(--sbb-tag-background-color);border:var(--sbb-tag-border-width) var(--sbb-tag-border-style) var(--sbb-tag-border-color);border-radius:var(--sbb-tag-border-radius);transition-duration:var(--sbb-tag-animation-duration);transition-timing-function:var(--sbb-tag-animation-easing);transition-property:inset,background-color,border-color,box-shadow}:host(:focus-visible) .sbb-tag:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width)}.sbb-tag__icon{display:flex;align-items:center;height:calc(var(--sbb-typo-line-height-body-text) * 1em);flex-shrink:0}:host(:not(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-tag__icon{display:none}.sbb-tag__text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sbb-tag__amount{--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);color:var(--sbb-tag-amount-color)}:host(:not(:is(:state(slotted-amount),[state--slotted-amount]),[amount])) .sbb-tag__amount{display:none}.sbb-tag--shift{transition:transform var(--sbb-tag-animation-duration) var(--sbb-tag-animation-easing);transform:var(--sbb-tag-content-shift);will-change:transform}`;
+const Y = V`:host{display:inline-block;outline:none!important;max-width:100%;--sbb-tag-border-radius: var(--sbb-border-radius-infinity);--sbb-tag-background-color: var(--sbb-background-color-1);--sbb-tag-border-color: var(--sbb-border-color-4-inverted);--sbb-tag-border-style: solid;--sbb-tag-border-width: var(--sbb-border-width-1x);--sbb-tag-text-color: var(--sbb-color-2);--sbb-tag-amount-color: var(--sbb-color-metal);--sbb-tag-amount-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));--sbb-tag-height: var(--sbb-size-element-xs);--sbb-tag-inset: 0;--sbb-tag-cursor: var(--sbb-cursor-pointer);--sbb-tag-content-shift: translateY(0);--sbb-tag-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-tag-animation-easing: var(--sbb-animation-easing);--sbb-tag-padding-inline: var(--sbb-spacing-fixed-5x);--sbb-tag-gap: var(--sbb-spacing-fixed-2x)}@media(forced-colors:active){:host{--sbb-tag-background-color: Canvas !important;--sbb-tag-text-color: ButtonText;--sbb-tag-amount-color: ButtonText;--sbb-tag-border-color: CanvasText;--sbb-tag-border-width: var(--sbb-border-width-2x)}}:host([data-checked]){--sbb-tag-border-color: var(--sbb-border-color-3);--sbb-tag-border-width: var(--sbb-border-width-2x)}@media(forced-colors:active){:host([data-checked]){--sbb-tag-border-color: Highlight !important;--sbb-tag-border-width: var(--sbb-border-width-4x)}}:host(:is(:disabled,[disabled-interactive])){--sbb-tag-text-color: var(--sbb-color-granite);--sbb-tag-text-color: light-dark(var(--sbb-color-granite), var(--sbb-color-aluminium));--sbb-tag-amount-color: var(--sbb-tag-text-color);--sbb-tag-background-color: var(--sbb-background-color-3);--sbb-tag-border-color: var(--sbb-color-cement);--sbb-tag-border-color: light-dark(var(--sbb-color-cement), var(--sbb-color-smoke));--sbb-tag-border-style: dashed;--sbb-tag-cursor: unset;--sbb-tag-pointer-events: none}@media(forced-colors:active){:host(:is(:disabled,[disabled-interactive])){--sbb-tag-text-color: GrayText;--sbb-tag-amount-color: GrayText;--sbb-tag-border-color: GrayText}}:host([data-checked]:is(:disabled,[disabled-interactive])){--sbb-tag-border-color: var(--sbb-color-metal);--sbb-tag-border-color: light-dark(var(--sbb-color-metal), var(--sbb-color-cement));--sbb-tag-border-style: dashed}@media(any-hover:hover){:host(:hover:not(:disabled,[disabled-interactive],:active,[data-active])){--sbb-tag-background-color: var(--sbb-background-color-3);--sbb-tag-inset: calc(var(--sbb-border-width-2x) * -1);--sbb-tag-content-shift: translateY(calc(var(--sbb-border-width-1x) * -1))}}@media(any-hover:hover)and (forced-colors:active){:host(:hover:not(:disabled,[disabled-interactive],:active,[data-active])){--sbb-tag-border-color: Highlight}}:host(:is(:active,[data-active]):not(:disabled,[disabled-interactive])){--sbb-tag-background-color: var(--sbb-background-color-3);--sbb-tag-border-color: var(--sbb-color-iron);--sbb-tag-border-color: light-dark(var(--sbb-color-iron), var(--sbb-color-storm));--sbb-tag-border-width: var(--sbb-border-width-2x);--sbb-tag-text-color: var(--sbb-color-4)}@media(forced-colors:active){:host(:is(:active,[data-active]):not(:disabled,[disabled-interactive])){--sbb-tag-border-color: Highlight;--sbb-tag-text-color: ButtonText}}:host([size=s]){--sbb-tag-height: var(--sbb-size-element-xxxs);--sbb-tag-padding-inline: var(--sbb-spacing-fixed-3x)}.sbb-tag{--sbb-text-font-size: var(--sbb-text-font-size-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);font-weight:700;position:relative;display:flex;align-items:center;height:var(--sbb-tag-height);max-width:100%;gap:var(--sbb-tag-gap);padding-inline:var(--sbb-tag-padding-inline);cursor:var(--sbb-tag-cursor);border-radius:var(--sbb-tag-border-radius);color:var(--sbb-tag-text-color);transition:color var(--sbb-tag-animation-duration) var(--sbb-tag-animation-easing);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;pointer-events:var(--sbb-tag-pointer-events, unset)}.sbb-tag:before{content:"";position:absolute;inset:var(--sbb-tag-inset);background-color:var(--sbb-tag-background-color);border:var(--sbb-tag-border-width) var(--sbb-tag-border-style) var(--sbb-tag-border-color);border-radius:var(--sbb-tag-border-radius);transition-duration:var(--sbb-tag-animation-duration);transition-timing-function:var(--sbb-tag-animation-easing);transition-property:inset,background-color,border-color,box-shadow}:host(:focus-visible) .sbb-tag:before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width)}.sbb-tag__icon{display:flex;align-items:center;height:calc(var(--sbb-typo-line-height-text) * 1em);flex-shrink:0}:host(:not(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-tag__icon{display:none}.sbb-tag__text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sbb-tag__amount{--sbb-text-font-size: var(--sbb-text-font-size-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);color:var(--sbb-tag-amount-color)}:host(:not(:is(:state(slotted-amount),[state--slotted-amount]),[amount])) .sbb-tag__amount{display:none}.sbb-tag--shift{transition:transform var(--sbb-tag-animation-duration) var(--sbb-tag-animation-easing);transform:var(--sbb-tag-content-shift);will-change:transform}`;
 let at = (() => {
   var c, d, h, g, i;
   let a = [A("sbb-tag")], s, r = [], b, f = U(M(H)), x, _ = [], k = [], y, w = [], z = [], E, S = [], C = [], T, I = [], B = [];

package/tag/tag-group/tag-group.component.d.ts

@@ -1,7 +1,7 @@
 import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
-import { WithListChildren } from '../../core/mixins.js';
-import { SbbTagElement, SbbTagSize } from '../tag.js';
-declare const SbbTagGroupElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbNamedSlotListMixinType<SbbTagElement<string>>> & typeof LitElement;
+import { WithListChildren } from '../../core/mixins.ts';
+import { SbbTagElement, SbbTagSize } from '../tag.ts';
+declare const SbbTagGroupElement_base: import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbDisabledMixinType> & import('../../core/mixins.ts').AbstractConstructor<import('../../core/mixins.ts').SbbNamedSlotListMixinType<SbbTagElement<string>>> & typeof LitElement;
 /**
  * It can be used as a container for one or more `sbb-tag`.
  *

package/tag/tag-group.d.ts

@@ -1,5 +1,5 @@
 /**
  * @entrypoint
  */
-export * from './tag-group/tag-group.component.js';
+export * from './tag-group/tag-group.component.ts';
 //# sourceMappingURL=tag-group.d.ts.map

package/tag/tag.d.ts

@@ -1,5 +1,5 @@
 /**
  * @entrypoint
  */
-export * from './tag/tag.component.js';
+export * from './tag/tag.component.ts';
 //# sourceMappingURL=tag.d.ts.map