@sbb-esta/lyne-elements 1.8.0 → 1.10.0

package/standard-theme.css

@@ -1,17 +1,4 @@
 @charset "UTF-8";
-/**
- * Better font rendering (on OS X)
- * http://maximilianhoffmann.com/posts/better-font-rendering-on-osx
- *
- * Usage:
- *
- * .var_dark_on_light {
- * 	@include font-smoothing;
- * }
- * .var_light_on_dark {
- * 	@include font-smoothing-reset;
- * }
- */
 sub, sup {
   font-size: 60%;
   line-height: 0;
@@ -218,7 +205,7 @@ summary {
 
 /**
  * Do not edit directly
- * Generated on Mon, 15 Jul 2024 09:40:16 GMT
+ * Generated on Mon, 02 Sep 2024 15:45:11 GMT
  */
 *,
 ::before,
@@ -394,6 +381,7 @@ summary {
    * Original Value: 3px
    */
   --sbb-focus-outline-offset: 0.1875rem;
+  --sbb-hover-image-brightness: 1.075;
   --sbb-layout-base-grid-columns-zero: 4;
   --sbb-layout-base-grid-columns-micro: 4;
   --sbb-layout-base-grid-columns-small: 4;
@@ -1321,6 +1309,7 @@ summary {
   --sbb-train-formation-wagon-gap: var(--sbb-spacing-fixed-1x);
   --sbb-header-height: var(--sbb-spacing-fixed-14x);
   --sbb-time-input-max-width: 3.625rem;
+  --sbb-time-input-s-max-width: 3.1875rem;
   --sbb-overlay-default-z-index: 1000;
   --sbb-border-radius-infinity: 10000000em;
 }
@@ -1328,6 +1317,7 @@ summary {
   :root {
     --sbb-header-height: var(--sbb-spacing-fixed-24x);
     --sbb-time-input-max-width: 4.0625rem;
+    --sbb-time-input-s-max-width: 3.625rem;
   }
 }
 
@@ -1486,6 +1476,9 @@ sbb-title + p {
 input[data-sbb-time-input] {
   max-width: var(--sbb-time-input-max-width);
 }
+sbb-form-field[size=s] input[data-sbb-time-input] {
+  max-width: var(--sbb-time-input-s-max-width);
+}
 
 sub {
   bottom: -0.36em;
@@ -1685,6 +1678,7 @@ sup {
   --sbb-step-list-padding-block: var(--sbb-spacing-fixed-3x);
   --sbb-step-list-padding-inline: var(--sbb-spacing-responsive-xxs);
   --sbb-step-list-marker-to-text-gap: var(--sbb-spacing-responsive-xxxs);
+  --sbb-step-list-border-radius: var(--sbb-border-radius-4x);
   --sbb-step-list-text-to-marker-block-offset: calc(
     0.5 *
       (
@@ -1714,11 +1708,18 @@ sup {
   position: relative;
   counter-increment: steps;
   background-color: var(--sbb-color-milk);
-  border-radius: var(--sbb-border-radius-4x);
   padding-block: calc(var(--sbb-step-list-padding-block) + var(--sbb-step-list-text-to-marker-block-offset)) var(--sbb-step-list-padding-block);
   padding-inline: calc(var(--sbb-step-list-padding-inline) + var(--sbb-step-list-marker-dimensions) + var(--sbb-step-list-marker-to-text-gap)) var(--sbb-step-list-padding-inline);
   min-height: calc(var(--sbb-step-list-marker-dimensions) + 2 * var(--sbb-step-list-padding-block));
 }
+.sbb-step-list > li:first-of-type {
+  border-start-start-radius: var(--sbb-step-list-border-radius);
+  border-start-end-radius: var(--sbb-step-list-border-radius);
+}
+.sbb-step-list > li:last-of-type {
+  border-end-start-radius: var(--sbb-step-list-border-radius);
+  border-end-end-radius: var(--sbb-step-list-border-radius);
+}
 .sbb-step-list > li::before {
   --sbb-text-font-size: var(--sbb-font-size-text-xxs);
   font-family: var(--sbb-typo-font-family);
@@ -1752,7 +1753,8 @@ sup {
 
 .sbb-table,
 .sbb-table-m,
-.sbb-table-s {
+.sbb-table-s,
+.sbb-table-xs {
   --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
   --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
   --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
@@ -1760,12 +1762,14 @@ sup {
 }
 .sbb-table tbody tr:nth-child(odd),
 .sbb-table-m tbody tr:nth-child(odd),
-.sbb-table-s tbody tr:nth-child(odd) {
+.sbb-table-s tbody tr:nth-child(odd),
+.sbb-table-xs tbody tr:nth-child(odd) {
   background-color: var(--sbb-table-row-striped-color);
 }
 .sbb-table,
 .sbb-table-m,
-.sbb-table-s {
+.sbb-table-s,
+.sbb-table-xs {
   --sbb-table-border: var(--sbb-border-width-1x) solid var(--sbb-table-border-color);
   --sbb-table-border-color: var(--sbb-color-cloud);
   --sbb-table-border-radius: var(--sbb-border-radius-4x);
@@ -1784,7 +1788,8 @@ sup {
 }
 .sbb-table thead > tr > th,
 .sbb-table-m thead > tr > th,
-.sbb-table-s 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);
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
@@ -1800,17 +1805,20 @@ sup {
 }
 .sbb-table thead > tr > th:last-of-type,
 .sbb-table-m thead > tr > th:last-of-type,
-.sbb-table-s thead > tr > th:last-of-type {
+.sbb-table-s thead > tr > th:last-of-type,
+.sbb-table-xs thead > tr > th:last-of-type {
   border-right: none;
 }
 .sbb-table tbody > tr:first-of-type td,
 .sbb-table-m tbody > tr:first-of-type td,
-.sbb-table-s tbody > tr:first-of-type td {
+.sbb-table-s tbody > tr:first-of-type td,
+.sbb-table-xs tbody > tr:first-of-type td {
   border-top: none;
 }
 .sbb-table tbody > tr > td,
 .sbb-table-m tbody > tr > td,
-.sbb-table-s 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);
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
@@ -1824,12 +1832,14 @@ sup {
 }
 .sbb-table tbody > tr > td:last-of-type,
 .sbb-table-m tbody > tr > td:last-of-type,
-.sbb-table-s tbody > tr > td:last-of-type {
+.sbb-table-s tbody > tr > td:last-of-type,
+.sbb-table-xs tbody > tr > td:last-of-type {
   border-right: none;
 }
 .sbb-table caption,
 .sbb-table-m caption,
-.sbb-table-s caption {
+.sbb-table-s caption,
+.sbb-table-xs caption {
   --sbb-text-font-size: var(--sbb-font-size-text-xs);
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
@@ -1863,6 +1873,21 @@ sup {
   font-size: var(--sbb-text-font-size);
 }
 
+.sbb-table-xs {
+  --sbb-table-header-padding-block: 0;
+  --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-1x);
+  --sbb-table-cell-padding-block: 0;
+  --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);
+  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);
+  font-size: var(--sbb-text-font-size);
+}
+
 sbb-table-wrapper[negative] .sbb-table,
 .sbb-table--negative {
   --sbb-table-border-color: var(--sbb-color-anthracite);

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

@@ -14,6 +14,12 @@ export declare class SbbStepLabelElement extends SbbStepLabelElement_base {
     private readonly _internals;
     /** The step controlled by the label. */
     get step(): SbbStepElement | null;
+    private _abort;
+    private _stepper;
+    private _step;
+    private _getStep;
+    connectedCallback(): void;
+    protected firstUpdated(changedProperties: PropertyValues<this>): void;
     /**
      * Selects and configures the step label.
      * @internal
@@ -29,12 +35,6 @@ export declare class SbbStepLabelElement extends SbbStepLabelElement_base {
      * @internal
      */
     configure(posInSet: number, setSize: number, stepperLoaded: boolean): void;
-    private _abort;
-    private _stepper;
-    private _step;
-    private _getStep;
-    connectedCallback(): void;
-    protected firstUpdated(changedProperties: PropertyValues<this>): void;
     protected render(): TemplateResult;
 }
 declare global {

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

@@ -1 +1 @@
-{"version":3,"file":"step-label.d.ts","sourceRoot":"","sources":["../../../../src/elements/stepper/step-label/step-label.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAQ,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1F,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAKnE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;;AAOjD;;;;;GAKG;AACH,qBAMa,mBAAoB,SAAQ,wBAAwD;IAC/F,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,gBAAgB;IAChB,OAAO,CAAC,QAAQ,CAAC,UAAU,CAA4C;IAEvE,wCAAwC;IACxC,IAAW,IAAI,IAAI,cAAc,GAAG,IAAI,CAEvC;IAED;;;OAGG;IACI,MAAM,IAAI,IAAI;IAMrB;;;OAGG;IACI,QAAQ,IAAI,IAAI;IAMvB;;;OAGG;IACI,SAAS,CAAC,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,OAAO,GAAG,IAAI;IAQjF,OAAO,CAAC,MAAM,CAAyC;IACvD,OAAO,CAAC,QAAQ,CAAkC;IAClD,OAAO,CAAC,KAAK,CAA+B;IAE5C,OAAO,CAAC,QAAQ;IAQA,iBAAiB,IAAI,IAAI;cAqBtB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAO3D,MAAM,IAAI,cAAc;CAQ5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,gBAAgB,EAAE,mBAAmB,CAAC;KACvC;CACF"}
+{"version":3,"file":"step-label.d.ts","sourceRoot":"","sources":["../../../../src/elements/stepper/step-label/step-label.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAQ,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1F,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAKnE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;;AAOjD;;;;;GAKG;AACH,qBAMa,mBAAoB,SAAQ,wBAAwD;IAC/F,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,gBAAgB;IAChB,OAAO,CAAC,QAAQ,CAAC,UAAU,CAA4C;IAEvE,wCAAwC;IACxC,IAAW,IAAI,IAAI,cAAc,GAAG,IAAI,CAEvC;IAED,OAAO,CAAC,MAAM,CAAyC;IACvD,OAAO,CAAC,QAAQ,CAAkC;IAClD,OAAO,CAAC,KAAK,CAA+B;IAE5C,OAAO,CAAC,QAAQ;IAQA,iBAAiB,IAAI,IAAI;cAqBtB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAO9E;;;OAGG;IACI,MAAM,IAAI,IAAI;IAMrB;;;OAGG;IACI,QAAQ,IAAI,IAAI;IAMvB;;;OAGG;IACI,SAAS,CAAC,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,OAAO,GAAG,IAAI;cAQ9D,MAAM,IAAI,cAAc;CAQ5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,gBAAgB,EAAE,mBAAmB,CAAC;KACvC;CACF"}

package/stepper/step-label.js

@@ -5,13 +5,13 @@ import { SbbConnectedAbortController as d } from "../core/controllers.js";
 import { hostAttributes as f } from "../core/decorators.js";
 import { SbbDisabledMixin as h } from "../core/mixins.js";
 import { SbbIconNameMixin as v } from "../icon.js";
-const x = l`*,:before,:after{box-sizing:border-box}:host{--sbb-step-label-color: var(--sbb-color-iron);--sbb-step-label-animation-duration: var( --sbb-disable-animation-zero-time, 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-color-cloud);--sbb-step-label-prefix-background-color: var(--sbb-color-white);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-charcoal)}@media (forced-colors: active){:host([data-selected]){--sbb-step-label-color: Highlight !important}}:host([disabled]){--sbb-step-label-color: var(--sbb-color-granite);--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: pointer;--sbb-step-label-prefix-background-color: var(--sbb-color-milk);--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:not([data-focus-origin=mouse],[data-focus-origin=touch])){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) 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-spacing-fixed-4x);color:var(--sbb-step-label-color)}.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}`;
-var u = Object.defineProperty, m = Object.getOwnPropertyDescriptor, g = (t, s, r, i) => {
-  for (var e = i > 1 ? void 0 : i ? m(s, r) : s, a = t.length - 1, o; a >= 0; a--)
-    (o = t[a]) && (e = (i ? o(s, r, e) : o(e)) || e);
-  return i && e && u(s, r, e), e;
+const x = l`*,:before,:after{box-sizing:border-box}:host{--sbb-step-label-color: var(--sbb-color-iron);--sbb-step-label-animation-duration: var( --sbb-disable-animation-zero-time, 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-color-cloud);--sbb-step-label-prefix-background-color: var(--sbb-color-white);--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-charcoal)}@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-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: pointer;--sbb-step-label-prefix-background-color: var(--sbb-color-milk);--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:not([data-focus-origin=mouse],[data-focus-origin=touch])){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) 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}`;
+var g = Object.defineProperty, m = Object.getOwnPropertyDescriptor, u = (t, s, r, i) => {
+  for (var e = i > 1 ? void 0 : i ? m(s, r) : s, b = t.length - 1, a; b >= 0; b--)
+    (a = t[b]) && (e = (i ? a(s, r, e) : a(e)) || e);
+  return i && e && g(s, r, e), e;
 };
-let y = 0, b = class extends v(h(c)) {
+let y = 0, o = class extends v(h(c)) {
   constructor() {
     super(...arguments), this._internals = this.attachInternals(), this._abort = new d(this), this._stepper = null, this._step = null;
   }
@@ -19,6 +19,26 @@ let y = 0, b = class extends v(h(c)) {
   get step() {
     return this._step;
   }
+  _getStep() {
+    let t = this.nextElementSibling;
+    for (; t && t.localName !== "sbb-step"; )
+      t = t.nextElementSibling;
+    return t;
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    const t = this._abort.signal;
+    this.id = this.id || `sbb-step-label-${y++}`, this._internals.ariaSelected = "false", this._stepper = this.closest("sbb-stepper"), this._step = this._getStep(), this.toggleAttribute("data-disabled", this.hasAttribute("disabled")), this.addEventListener(
+      "click",
+      () => {
+        this._stepper && this._step && (this._stepper.selected = this._step);
+      },
+      { signal: t }
+    );
+  }
+  firstUpdated(t) {
+    super.firstUpdated(t), this.step && this.setAttribute("aria-controls", this.step.id);
+  }
   /**
    * Selects and configures the step label.
    * @internal
@@ -40,26 +60,6 @@ let y = 0, b = class extends v(h(c)) {
   configure(t, s, r) {
     r && (this._step = this._getStep()), this._internals.ariaPosInSet = `${t}`, this._internals.ariaSetSize = `${s}`;
   }
-  _getStep() {
-    let t = this.nextElementSibling;
-    for (; t && t.localName !== "sbb-step"; )
-      t = t.nextElementSibling;
-    return t;
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    const t = this._abort.signal;
-    this.id = this.id || `sbb-step-label-${y++}`, this._internals.ariaSelected = "false", this._stepper = this.closest("sbb-stepper"), this._step = this._getStep(), this.toggleAttribute("data-disabled", this.hasAttribute("disabled")), this.addEventListener(
-      "click",
-      () => {
-        this._stepper && this._step && (this._stepper.selected = this._step);
-      },
-      { signal: t }
-    );
-  }
-  firstUpdated(t) {
-    super.firstUpdated(t), this.step && this.setAttribute("aria-controls", this.step.id);
-  }
   render() {
     return n`
       <div class="sbb-step-label">
@@ -69,15 +69,15 @@ let y = 0, b = class extends v(h(c)) {
     `;
   }
 };
-b.styles = x;
-b = g([
+o.styles = x;
+o = u([
   p("sbb-step-label"),
   f({
     slot: "step-label",
     tabindex: "-1",
     role: "tab"
   })
-], b);
+], o);
 export {
-  b as SbbStepLabelElement
+  o as SbbStepLabelElement
 };

package/stepper/stepper/stepper.d.ts

@@ -18,6 +18,8 @@ export declare class SbbStepperElement extends SbbStepperElement_base {
     private _horizontalFrom?;
     /** Steps orientation, either horizontal or vertical. */
     orientation: SbbOrientation;
+    /** Size variant, either s or m. */
+    size: 's' | 'm';
     /** The currently selected step. */
     set selected(step: SbbStepElement);
     get selected(): SbbStepElement | undefined;
@@ -27,15 +29,15 @@ export declare class SbbStepperElement extends SbbStepperElement_base {
     /** The steps of the stepper. */
     get steps(): SbbStepElement[];
     private get _enabledSteps();
+    private _loaded;
+    private _abort;
+    private _resizeObserverTimeout;
     /** Selects the next step. */
     next(): void;
     /** Selects the previous step. */
     previous(): void;
     /** Resets the form in which the stepper is nested or every form of each step, if any. */
     reset(): void;
-    private _loaded;
-    private _abort;
-    private _resizeObserverTimeout;
     private _isValidStep;
     private _select;
     private _setMarkerSize;
@@ -48,6 +50,7 @@ export declare class SbbStepperElement extends SbbStepperElement_base {
     connectedCallback(): void;
     protected firstUpdated(changedProperties: PropertyValues<this>): Promise<void>;
     protected willUpdate(changedProperties: PropertyValues<this>): void;
+    private _proxySize;
     private _handleKeyDown;
     protected render(): TemplateResult;
 }

package/stepper/stepper/stepper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stepper.d.ts","sourceRoot":"","sources":["../../../../src/elements/stepper/stepper/stepper.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EACV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAMb,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAElF,OAAO,KAAK,EAAE,cAAc,EAA+B,MAAM,YAAY,CAAC;;AAM9E;;;;;GAKG;AACH,qBACa,iBAAkB,SAAQ,sBAA6B;IAClE,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,wFAAwF;IACpD,MAAM,UAAS;IAEnD,yDAAyD;IACzD,IACW,cAAc,CAAC,KAAK,EAAE,iBAAiB,EAKjD;IACD,IAAW,cAAc,IAAI,iBAAiB,GAAG,SAAS,CAEzD;IACD,OAAO,CAAC,eAAe,CAAC,CAAgC;IAExD,wDAAwD;IAEjD,WAAW,EAAE,cAAc,CAAgB;IAElD,mCAAmC;IACnC,IACW,QAAQ,CAAC,IAAI,EAAE,cAAc,EAIvC;IACD,IAAW,QAAQ,IAAI,cAAc,GAAG,SAAS,CAEhD;IAED,yCAAyC;IACzC,IACW,aAAa,CAAC,KAAK,EAAE,MAAM,EAIrC;IACD,IAAW,aAAa,IAAI,MAAM,GAAG,SAAS,CAE7C;IAED,gCAAgC;IAChC,IAAW,KAAK,IAAI,cAAc,EAAE,CAEnC;IAED,OAAO,KAAK,aAAa,GAExB;IAED,6BAA6B;IACtB,IAAI,IAAI,IAAI;IAMnB,iCAAiC;IAC1B,QAAQ,IAAI,IAAI;IAMvB,yFAAyF;IAClF,KAAK,IAAI,IAAI;IAcpB,OAAO,CAAC,OAAO,CAAkB;IACjC,OAAO,CAAC,MAAM,CAAyC;IACvD,OAAO,CAAC,sBAAsB,CAA8C;IAE5E,OAAO,CAAC,YAAY;IAiBpB,OAAO,CAAC,OAAO;IAwBf,OAAO,CAAC,cAAc;IAiBtB,OAAO,CAAC,wBAAwB;IAoBhC,OAAO,CAAC,UAAU;IAYlB,OAAO,CAAC,aAAa;IAQrB,OAAO,CAAC,iBAAiB;IASzB,OAAO,CAAC,gBAAgB;IAYxB,OAAO,CAAC,oBAAoB;IAUZ,iBAAiB,IAAI,IAAI;cAWhB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;cAU1E,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAW5E,OAAO,CAAC,cAAc;cAmBH,MAAM,IAAI,cAAc;CAY5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,aAAa,EAAE,iBAAiB,CAAC;KAClC;CACF"}
+{"version":3,"file":"stepper.d.ts","sourceRoot":"","sources":["../../../../src/elements/stepper/stepper/stepper.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EACV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAMb,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAElF,OAAO,KAAK,EAAE,cAAc,EAA+B,MAAM,YAAY,CAAC;;AAM9E;;;;;GAKG;AACH,qBACa,iBAAkB,SAAQ,sBAA6B;IAClE,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,wFAAwF;IACpD,MAAM,UAAS;IAEnD,yDAAyD;IACzD,IACW,cAAc,CAAC,KAAK,EAAE,iBAAiB,EAKjD;IACD,IAAW,cAAc,IAAI,iBAAiB,GAAG,SAAS,CAEzD;IACD,OAAO,CAAC,eAAe,CAAC,CAAgC;IAExD,wDAAwD;IAEjD,WAAW,EAAE,cAAc,CAAgB;IAElD,mCAAmC;IACC,IAAI,EAAE,GAAG,GAAG,GAAG,CAAO;IAE1D,mCAAmC;IACnC,IACW,QAAQ,CAAC,IAAI,EAAE,cAAc,EAIvC;IACD,IAAW,QAAQ,IAAI,cAAc,GAAG,SAAS,CAEhD;IAED,yCAAyC;IACzC,IACW,aAAa,CAAC,KAAK,EAAE,MAAM,EAIrC;IACD,IAAW,aAAa,IAAI,MAAM,GAAG,SAAS,CAE7C;IAED,gCAAgC;IAChC,IAAW,KAAK,IAAI,cAAc,EAAE,CAEnC;IAED,OAAO,KAAK,aAAa,GAExB;IAED,OAAO,CAAC,OAAO,CAAkB;IACjC,OAAO,CAAC,MAAM,CAAyC;IACvD,OAAO,CAAC,sBAAsB,CAA8C;IAE5E,6BAA6B;IACtB,IAAI,IAAI,IAAI;IAMnB,iCAAiC;IAC1B,QAAQ,IAAI,IAAI;IAMvB,yFAAyF;IAClF,KAAK,IAAI,IAAI;IAcpB,OAAO,CAAC,YAAY;IAiBpB,OAAO,CAAC,OAAO;IAwBf,OAAO,CAAC,cAAc;IAiBtB,OAAO,CAAC,wBAAwB;IAoBhC,OAAO,CAAC,UAAU;IAalB,OAAO,CAAC,aAAa;IAQrB,OAAO,CAAC,iBAAiB;IASzB,OAAO,CAAC,gBAAgB;IAYxB,OAAO,CAAC,oBAAoB;IAUZ,iBAAiB,IAAI,IAAI;cAWhB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;cAU1E,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAgB5E,OAAO,CAAC,UAAU;IAMlB,OAAO,CAAC,cAAc;cAmBH,MAAM,IAAI,cAAc;CAY5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,aAAa,EAAE,iBAAiB,CAAC;KAClC;CACF"}

package/stepper/stepper.js

@@ -1,19 +1,19 @@
 import { css as h, LitElement as p, html as c } from "lit";
-import { property as l, customElement as f } from "lit/decorators.js";
+import { property as n, customElement as f } from "lit/decorators.js";
 import { isArrowKeyPressed as u, getNextElementIndex as m } from "../core/a11y.js";
 import { SbbConnectedAbortController as _ } from "../core/controllers.js";
-import { breakpoints as v, isBreakpoint as g } from "../core/dom.js";
-import { SbbHydrationMixin as x } from "../core/mixins.js";
+import { breakpoints as v, isBreakpoint as x } from "../core/dom.js";
+import { SbbHydrationMixin as g } from "../core/mixins.js";
 const z = h`*,:before,:after{box-sizing:border-box}:host{--sbb-stepper-orientation: row;--sbb-stepper-border-width: var(--sbb-border-width-1x);--sbb-stepper-marker-size: 0;--sbb-stepper-marker-width: var(--sbb-border-width-3x);--sbb-stepper-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-6x) );--sbb-stepper-marker-color: var(--sbb-color-charcoal);display:block;position:relative;counter-reset:step-label}@media (forced-colors: active){:host{--sbb-stepper-marker-color: ButtonText}}:host([data-disable-animation]){--sbb-disable-animation-time: .1ms;--sbb-disable-animation-zero-time: 0s}:host([orientation=vertical]){--sbb-stepper-orientation: column}.sbb-stepper{width:100%}.sbb-stepper__labels{display:flex;flex-direction:var(--sbb-stepper-orientation);position:relative;justify-content:space-between;margin-block-end:var(--sbb-spacing-responsive-m)}.sbb-stepper__labels:before{content:"";position:absolute;inset-inline-start:calc(var(--sbb-stepper-border-width) * -1);background-color:var(--sbb-stepper-marker-color)}:host([orientation=horizontal]) .sbb-stepper__labels{gap:var(--sbb-spacing-fixed-4x);padding-block-end:var(--sbb-spacing-fixed-4x);border-block-end:var(--sbb-stepper-border-width) solid var(--sbb-color-cloud)}:host([orientation=horizontal]) .sbb-stepper__labels:before{inset-block-end:calc(var(--sbb-stepper-border-width) * -1);height:var(--sbb-stepper-marker-width);width:var(--sbb-stepper-marker-size);transition:width var(--sbb-stepper-animation-duration) var(--sbb-animation-easing)}:host([orientation=vertical]) .sbb-stepper__labels{padding-inline-start:var(--sbb-spacing-fixed-4x);border-inline-start:var(--sbb-stepper-border-width) solid var(--sbb-color-cloud)}:host([orientation=vertical]) .sbb-stepper__labels:before{inset-block-start:0;width:var(--sbb-stepper-marker-width);height:var(--sbb-stepper-marker-size);transition:height var(--sbb-stepper-animation-duration) var(--sbb-animation-easing)}.sbb-stepper__steps{position:relative}:host([orientation=horizontal]) .sbb-stepper__steps{height:var(--sbb-stepper-content-height);transition:height var(--sbb-stepper-animation-duration) var(--sbb-animation-easing)}::slotted(sbb-step-label):before{content:counter(step-label);counter-increment:step-label}`;
-var w = Object.defineProperty, y = Object.getOwnPropertyDescriptor, n = (e, t, s, i) => {
-  for (var r = i > 1 ? void 0 : i ? y(t, s) : t, a = e.length - 1, d; a >= 0; a--)
-    (d = e[a]) && (r = (i ? d(t, s, r) : d(r)) || r);
-  return i && r && w(t, s, r), r;
+var y = Object.defineProperty, w = Object.getOwnPropertyDescriptor, a = (e, t, s, i) => {
+  for (var r = i > 1 ? void 0 : i ? w(t, s) : t, l = e.length - 1, d; l >= 0; l--)
+    (d = e[l]) && (r = (i ? d(t, s, r) : d(r)) || r);
+  return i && r && y(t, s, r), r;
 };
 const b = 150;
-let o = class extends x(p) {
+let o = class extends g(p) {
   constructor() {
-    super(...arguments), this.linear = !1, this.orientation = "horizontal", this._loaded = !1, this._abort = new _(this), this._resizeObserverTimeout = null;
+    super(...arguments), this.linear = !1, this.orientation = "horizontal", this.size = "m", this._loaded = !1, this._abort = new _(this), this._resizeObserverTimeout = null;
   }
   set horizontalFrom(e) {
     this._horizontalFrom = v.includes(e) ? e : void 0, this._horizontalFrom && this._loaded && this._checkOrientation();
@@ -72,7 +72,7 @@ let o = class extends x(p) {
     return !0;
   }
   _select(e) {
-    var i, r, a;
+    var i, r, l;
     if (!this._isValidStep(e))
       return;
     const t = {
@@ -84,7 +84,7 @@ let o = class extends x(p) {
     if (this.selected && !this.selected.validate(t))
       return;
     const s = this.selected;
-    s == null || s.deselect(), e.select(), this._setMarkerSize(), this._configureLinearMode(), ((i = document.activeElement) == null ? void 0 : i.closest("sbb-stepper")) === this && ((a = (r = this.selected) == null ? void 0 : r.label) == null || a.focus());
+    s == null || s.deselect(), e.select(), this._setMarkerSize(), this._configureLinearMode(), ((i = document.activeElement) == null ? void 0 : i.closest("sbb-stepper")) === this && ((l = (r = this.selected) == null ? void 0 : r.label) == null || l.focus());
   }
   _setMarkerSize() {
     if (!this._loaded || !this.selected || this.selectedIndex === void 0 || !this.selected.label)
@@ -107,7 +107,7 @@ let o = class extends x(p) {
     const e = this.steps;
     e.forEach((t) => t.configure(this._loaded)), e.filter((t) => t.label).map((t) => t.label).forEach((t, s, i) => {
       t.configure(s + 1, i.length, this._loaded);
-    }), this._select(this.selected || this._enabledSteps[0]);
+    }), this._select(this.selected || this._enabledSteps[0]), this._proxySize();
   }
   _updateLabels() {
     this.steps.forEach((e) => {
@@ -116,7 +116,7 @@ let o = class extends x(p) {
     });
   }
   _checkOrientation() {
-    this.horizontalFrom && (this.orientation = g(this.horizontalFrom) ? "horizontal" : "vertical", this._updateLabels()), setTimeout(() => this._setMarkerSize(), 0);
+    this.horizontalFrom && (this.orientation = x(this.horizontalFrom) ? "horizontal" : "vertical", this._updateLabels()), setTimeout(() => this._setMarkerSize(), 0);
   }
   _onStepperResize() {
     this._checkOrientation(), clearTimeout(this._resizeObserverTimeout), this.toggleAttribute("data-disable-animation", !0), this._resizeObserverTimeout = setTimeout(
@@ -145,7 +145,13 @@ let o = class extends x(p) {
     super.firstUpdated(e), await this.updateComplete, this._loaded = !0, this.selectedIndex = this.linear ? 0 : Number(this.getAttribute("selected-index")) || 0, this._checkOrientation(), setTimeout(() => this.toggleAttribute("data-disable-animation", !1), b);
   }
   willUpdate(e) {
-    super.willUpdate(e), e.has("orientation") && !this.horizontalFrom && (this._updateLabels(), this._setMarkerSize()), e.has("linear") && this._loaded && this._configureLinearMode();
+    super.willUpdate(e), e.has("orientation") && !this.horizontalFrom && (this._updateLabels(), this._setMarkerSize()), e.has("linear") && this._loaded && this._configureLinearMode(), e.has("size") && (this._proxySize(), this._setMarkerSize());
+  }
+  _proxySize() {
+    this.steps.forEach((e) => {
+      var t;
+      (t = e.label) == null || t.setAttribute("data-size", this.size);
+    });
   }
   _handleKeyDown(e) {
     const t = this._enabledSteps;
@@ -169,22 +175,25 @@ let o = class extends x(p) {
   }
 };
 o.styles = z;
-n([
-  l({ type: Boolean })
+a([
+  n({ type: Boolean })
 ], o.prototype, "linear", 2);
-n([
-  l({ attribute: "horizontal-from", reflect: !0 })
+a([
+  n({ attribute: "horizontal-from", reflect: !0 })
 ], o.prototype, "horizontalFrom", 1);
-n([
-  l({ reflect: !0 })
+a([
+  n({ reflect: !0 })
 ], o.prototype, "orientation", 2);
-n([
-  l({ attribute: !1 })
+a([
+  n({ reflect: !0 })
+], o.prototype, "size", 2);
+a([
+  n({ attribute: !1 })
 ], o.prototype, "selected", 1);
-n([
-  l({ attribute: "selected-index", type: Number })
+a([
+  n({ attribute: "selected-index", type: Number })
 ], o.prototype, "selectedIndex", 1);
-o = n([
+o = a([
   f("sbb-stepper")
 ], o);
 export {

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

@@ -54,9 +54,10 @@ export declare class SbbTabGroupElement extends SbbTabGroupElement_base {
      * the tab group, the first enabled tab will be selected.
      */
     initialSelectedIndex: number;
-    private _updateSize;
     /** Emits an event on selected tab change. */
     private _selectedTabChanged;
+    connectedCallback(): void;
+    protected firstUpdated(changedProperties: PropertyValues<this>): void;
     /**
      * Disables a tab by index.
      * @param tabIndex The index of the tab you want to disable.
@@ -73,10 +74,9 @@ export declare class SbbTabGroupElement extends SbbTabGroupElement_base {
      */
     activateTab(tabIndex: number): void;
     private _getTabs;
-    private get _enabledTabs();
-    connectedCallback(): void;
-    protected firstUpdated(changedProperties: PropertyValues<this>): void;
+    private _enabledTabs;
     disconnectedCallback(): void;
+    private _updateSize;
     private _onContentSlotChange;
     private _onTabsSlotChange;
     private _assignId;

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

@@ -1 +1 @@
-{"version":3,"file":"tab-group.d.ts","sourceRoot":"","sources":["../../../../src/elements/tabs/tab-group/tab-group.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"tab-group.d.ts","sourceRoot":"","sources":["../../../../src/elements/tabs/tab-group/tab-group.ts"],"names":[],"mappings":"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"}

package/tabs/tab-group.js

@@ -45,9 +45,13 @@ let S = 0, a = class extends x(u) {
   get size() {
     return this._size;
   }
-  _updateSize() {
-    for (const t of this._tabs)
-      t.setAttribute("data-size", this.size);
+  connectedCallback() {
+    super.connectedCallback();
+    const t = this._abort.signal;
+    this.addEventListener("keydown", (i) => this._handleKeyDown(i), { signal: t });
+  }
+  firstUpdated(t) {
+    super.firstUpdated(t), this._tabs = this._getTabs(), this._tabs.forEach((i) => this._configure(i)), this._initSelection(), this._tabGroupResizeObserver.observe(this._tabGroupElement);
   }
   /**
    * Disables a tab by index.
@@ -78,26 +82,22 @@ let S = 0, a = class extends x(u) {
       (t) => /^sbb-tab-label$/u.test(t.localName)
     );
   }
-  get _enabledTabs() {
+  _enabledTabs() {
     return this._tabs.filter((t) => !t.hasAttribute("disabled"));
   }
-  connectedCallback() {
-    super.connectedCallback();
-    const t = this._abort.signal;
-    this.addEventListener("keydown", (i) => this._handleKeyDown(i), { signal: t });
-  }
-  firstUpdated(t) {
-    super.firstUpdated(t), this._tabs = this._getTabs(), this._tabs.forEach((i) => this._configure(i)), this._initSelection(), this._tabGroupResizeObserver.observe(this._tabGroupElement);
-  }
   disconnectedCallback() {
     super.disconnectedCallback(), this._tabAttributeObserver.disconnect(), this._tabContentResizeObserver.disconnect(), this._tabGroupResizeObserver.disconnect();
   }
+  _updateSize() {
+    for (const t of this._tabs)
+      t.setAttribute("data-size", this.size);
+  }
   _assignId() {
     return `sbb-tab-panel-${++S}`;
   }
   _initSelection() {
     var t, i, e;
-    this.initialSelectedIndex >= 0 && this.initialSelectedIndex < this._tabs.length && !this._tabs[this.initialSelectedIndex].disabled ? (t = this._tabs[this.initialSelectedIndex].tabGroupActions) == null || t.select() : (e = (i = this._enabledTabs[0]) == null ? void 0 : i.tabGroupActions) == null || e.select();
+    this.initialSelectedIndex >= 0 && this.initialSelectedIndex < this._tabs.length && !this._tabs[this.initialSelectedIndex].disabled ? (t = this._tabs[this.initialSelectedIndex].tabGroupActions) == null || t.select() : (e = (i = this._enabledTabs()[0]) == null ? void 0 : i.tabGroupActions) == null || e.select();
   }
   _onTabAttributesChange(t) {
     var i, e, n;
@@ -137,7 +137,7 @@ let S = 0, a = class extends x(u) {
       },
       disable: () => {
         var e, n, s;
-        t.disabled || (t.hasAttribute("disabled") || t.toggleAttribute("disabled", !0), t.disabled = !0, t.tabIndex = -1, t.setAttribute("aria-selected", "false"), (e = t.tab) == null || e.removeAttribute("active"), t.active && (t.removeAttribute("active"), t.active = !1, (s = (n = this._enabledTabs[0]) == null ? void 0 : n.tabGroupActions) == null || s.select()));
+        t.disabled || (t.hasAttribute("disabled") || t.toggleAttribute("disabled", !0), t.disabled = !0, t.tabIndex = -1, t.setAttribute("aria-selected", "false"), (e = t.tab) == null || e.removeAttribute("active"), t.active && (t.removeAttribute("active"), t.active = !1, (s = (n = this._enabledTabs()[0]) == null ? void 0 : n.tabGroupActions) == null || s.select()));
       },
       enable: () => {
         t.disabled && (t.removeAttribute("disabled"), t.disabled = !1);
@@ -165,7 +165,7 @@ let S = 0, a = class extends x(u) {
   }
   _handleKeyDown(t) {
     var e, n, s;
-    const i = this._enabledTabs;
+    const i = this._enabledTabs();
     if (!(!i || // don't trap nested handling
     t.target !== this && t.target.parentElement !== this) && _(t)) {
       const r = i.findIndex((l) => l.active), o = g(t, r, i.length);