@sbb-esta/lyne-elements 3.0.0-next.2 → 3.0.0

package/slider/slider.component.js

@@ -1,31 +1,27 @@
-var $ = (t) => {
+var V = (t) => {
   throw TypeError(t);
 };
-var C = (t, i, r) => i.has(t) || $("Cannot " + r);
-var _ = (t, i, r) => (C(t, i, "read from private field"), r ? r.call(t) : i.get(t)), f = (t, i, r) => i.has(t) ? $("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(t) : i.set(t, r), v = (t, i, r, n) => (C(t, i, "write to private field"), n ? n.call(t, r) : i.set(t, r), r);
+var $ = (t, i, r) => i.has(t) || V("Cannot " + r);
+var m = (t, i, r) => ($(t, i, "read from private field"), r ? r.call(t) : i.get(t)), _ = (t, i, r) => i.has(t) ? V("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(t) : i.set(t, r), v = (t, i, r, n) => ($(t, i, "write to private field"), n ? n.call(t, r) : i.set(t, r), r);
 import { __esDecorate as o, __runInitializers as c } from "tslib";
-import { css as T, LitElement as O, nothing as p, html as g } from "lit";
-import { customElement as U, property as h } from "lit/decorators.js";
-import { ref as B } from "lit/directives/ref.js";
-import { hostAttributes as F, forceType as D } from "../core/decorators.js";
-import { EventEmitter as R, forwardEvent as G } from "../core/eventing.js";
-import { SbbDisabledMixin as L, SbbReadonlyMixin as P, SbbFormAssociatedMixin as j, SbbElementInternalsMixin as H } from "../core/mixins.js";
+import { css as C, LitElement as T, nothing as p, html as f } from "lit";
+import { customElement as O, property as h } from "lit/decorators.js";
+import { ref as U } from "lit/directives/ref.js";
+import { hostAttributes as B, forceType as D } from "../core/decorators.js";
+import { SbbDisabledMixin as F, SbbReadonlyMixin as R, SbbFormAssociatedMixin as G, SbbElementInternalsMixin as L } from "../core/mixins.js";
 import "../icon.js";
-const K = T`@charset "UTF-8";*,:before,:after{box-sizing:border-box}:host{outline:none!important;display:inline-block;min-width:9.375rem;width:min(25rem,100%);--sbb-slider-line-height: .25rem;--sbb-slider-value-fraction: 0;--sbb-slider-knob-size: 1.75rem;--sbb-slider-knob-size-active: 1.9375rem;--sbb-slider-knob-border-size: .1875rem;--sbb-slider-knob-border-style: solid;--sbb-slider-knob-color: var(--sbb-color-white);--sbb-slider-knob-border-color: var(--sbb-color-red);--sbb-slider-icon-color: var(--sbb-color-black);--sbb-slider-selected-line-color: var(--sbb-color-red);--sbb-slider-selected-line-disabled-color: var(--sbb-color-smoke);--sbb-slider-line-color: var(--sbb-color-smoke);--sbb-slider-line-disabled-color: var(--sbb-color-graphite)}@media (forced-colors: active){:host{--sbb-slider-selected-line-color: Highlight;--sbb-slider-line-color: CanvasText}}:host(:disabled){--sbb-slider-icon-color: var(--sbb-color-graphite);--sbb-slider-knob-border-color: var(--sbb-color-smoke);--sbb-slider-knob-border-size: var(--sbb-border-width-2x);--sbb-slider-knob-border-style: dashed}:host([readonly]){--sbb-slider-icon-color: var(--sbb-color-smoke);--sbb-slider-knob-border-color: var(--sbb-slider-selected-line-disabled-color)}:host(:disabled),:host([readonly]){--sbb-slider-line-color: var(--sbb-slider-line-disabled-color);--sbb-slider-selected-line-color: var(--sbb-slider-selected-line-disabled-color)}@media (forced-colors: active){:host(:disabled),:host([readonly]){--sbb-slider-icon-color: GrayText;--sbb-slider-selected-line-disabled-color: GrayText;--sbb-slider-line-disabled-color: GrayText}}.sbb-slider__height-container{display:flex;flex-direction:column}.sbb-slider__height-container:before{content:"​";-webkit-user-select:none;user-select:none;width:0;height:0}.sbb-slider__wrapper{display:flex;gap:var(--sbb-spacing-fixed-2x);padding-block:calc(var(--sbb-spacing-fixed-1x) / 2);color:var(--sbb-slider-icon-color)}.sbb-slider__container{position:relative;min-height:var(--sbb-size-icon-ui-small);flex-grow:1}.sbb-slider__range-input{position:absolute;width:100%;inset:0;opacity:0;margin:0}.sbb-slider__line{position:absolute;top:50%;transform:translateY(-50%);height:var(--sbb-slider-line-height);width:100%;background-color:var(--sbb-slider-line-color);border-radius:var(--sbb-slider-line-height);overflow:hidden;pointer-events:none}.sbb-slider__selected-line{position:relative;height:100%;background-color:var(--sbb-slider-selected-line-color);width:calc(var(--sbb-slider-value-fraction) * 100%)}.sbb-slider__knob{position:absolute;top:50%;transform:translateY(-50%);box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-elevation-level-5-hard-2-color),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-elevation-level-5-hard-1-color);width:var(--sbb-slider-knob-size);height:var(--sbb-slider-knob-size);inset-inline-start:calc(var(--sbb-slider-value-fraction) * 100% - var(--sbb-slider-knob-size) * var(--sbb-slider-value-fraction));transition-property:width,height;transition-duration:var(--sbb-disable-animation-duration, var(--sbb-animation-duration-1x));transition-timing-function:ease-in;background-color:var(--sbb-slider-knob-color);border:var(--sbb-slider-knob-border-size) var(--sbb-slider-knob-border-style) var(--sbb-slider-knob-border-color);border-radius:50%;pointer-events:none}:host(:focus-visible) .sbb-slider__knob{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-slider-knob-size: var(--sbb-slider-knob-size-active)}:host(:not(:is(:disabled,[readonly]))) .sbb-slider__range-input:active~.sbb-slider__knob{--sbb-slider-knob-size: var(--sbb-slider-knob-size-active)}`;
-let ie = (() => {
+const P = C`@charset "UTF-8";*,:before,:after{box-sizing:border-box}:host{outline:none!important;display:inline-block;min-width:9.375rem;width:min(25rem,100%);--sbb-slider-line-height: .25rem;--sbb-slider-value-fraction: 0;--sbb-slider-knob-size: 1.75rem;--sbb-slider-knob-size-active: 1.9375rem;--sbb-slider-knob-border-size: .1875rem;--sbb-slider-knob-border-style: solid;--sbb-slider-knob-color: var(--sbb-color-white);--sbb-slider-knob-border-color: var(--sbb-color-red);--sbb-slider-icon-color: var(--sbb-color-black);--sbb-slider-selected-line-color: var(--sbb-color-red);--sbb-slider-selected-line-disabled-color: var(--sbb-color-smoke);--sbb-slider-line-color: var(--sbb-color-smoke);--sbb-slider-line-disabled-color: var(--sbb-color-graphite)}@media (forced-colors: active){:host{--sbb-slider-selected-line-color: Highlight;--sbb-slider-line-color: CanvasText}}:host(:disabled){--sbb-slider-icon-color: var(--sbb-color-graphite);--sbb-slider-knob-border-color: var(--sbb-color-smoke);--sbb-slider-knob-border-size: var(--sbb-border-width-2x);--sbb-slider-knob-border-style: dashed}:host([readonly]){--sbb-slider-icon-color: var(--sbb-color-smoke);--sbb-slider-knob-border-color: var(--sbb-slider-selected-line-disabled-color)}:host(:disabled),:host([readonly]){--sbb-slider-line-color: var(--sbb-slider-line-disabled-color);--sbb-slider-selected-line-color: var(--sbb-slider-selected-line-disabled-color)}@media (forced-colors: active){:host(:disabled),:host([readonly]){--sbb-slider-icon-color: GrayText;--sbb-slider-selected-line-disabled-color: GrayText;--sbb-slider-line-disabled-color: GrayText}}.sbb-slider__height-container{display:flex;flex-direction:column}.sbb-slider__height-container:before{content:"​";-webkit-user-select:none;user-select:none;width:0;height:0}.sbb-slider__wrapper{display:flex;gap:var(--sbb-spacing-fixed-2x);padding-block:calc(var(--sbb-spacing-fixed-1x) / 2);color:var(--sbb-slider-icon-color)}.sbb-slider__container{position:relative;min-height:var(--sbb-size-icon-ui-small);flex-grow:1}.sbb-slider__range-input{position:absolute;width:100%;inset:0;opacity:0;margin:0}.sbb-slider__line{position:absolute;top:50%;transform:translateY(-50%);height:var(--sbb-slider-line-height);width:100%;background-color:var(--sbb-slider-line-color);border-radius:var(--sbb-slider-line-height);overflow:hidden;pointer-events:none}.sbb-slider__selected-line{position:relative;height:100%;background-color:var(--sbb-slider-selected-line-color);width:calc(var(--sbb-slider-value-fraction) * 100%)}.sbb-slider__knob{position:absolute;top:50%;transform:translateY(-50%);box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-elevation-level-5-hard-2-color),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-elevation-level-5-hard-1-color);width:var(--sbb-slider-knob-size);height:var(--sbb-slider-knob-size);inset-inline-start:calc(var(--sbb-slider-value-fraction) * 100% - var(--sbb-slider-knob-size) * var(--sbb-slider-value-fraction));transition-property:width,height;transition-duration:var(--sbb-disable-animation-duration, var(--sbb-animation-duration-1x));transition-timing-function:ease-in;background-color:var(--sbb-slider-knob-color);border:var(--sbb-slider-knob-border-size) var(--sbb-slider-knob-border-style) var(--sbb-slider-knob-border-color);border-radius:50%;pointer-events:none}:host(:focus-visible) .sbb-slider__knob{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-slider-knob-size: var(--sbb-slider-knob-size-active)}:host(:not(:is(:disabled,[readonly]))) .sbb-slider__range-input:active~.sbb-slider__knob{--sbb-slider-knob-size: var(--sbb-slider-knob-size-active)}`;
+let Z = (() => {
   var b, d, a;
-  let t = [U("sbb-slider"), F({
+  let t = [O("sbb-slider"), B({
     tabindex: "0"
-  })], i, r = [], n, x = L(P(j(H(O)))), u = [], w, k, y, I, z, N = [], S = [], M, E = [], A = [];
-  var m = (a = class extends x {
+  })], i, r = [], n, g = F(R(G(L(T)))), u = [], x, w, k, y, I, z = [], N = [], E, M = [], S = [];
+  return a = class extends g {
     constructor() {
       super();
-      f(this, b);
-      f(this, d);
-      this._value = (c(this, u), null), this._min = "0", this._max = "100", v(this, b, c(this, N, "")), v(this, d, (c(this, S), c(this, E, ""))), this._didChange = (c(this, A), new R(this, m.events.didChange, {
-        bubbles: !0,
-        cancelable: !0
-      })), this.addEventListener?.("keydown", (e) => this._handleKeydown(e));
+      _(this, b);
+      _(this, d);
+      this._value = (c(this, u), null), this._min = "0", this._max = "100", v(this, b, c(this, z, "")), v(this, d, (c(this, N), c(this, M, ""))), this._rangeInput = c(this, S), this.addEventListener?.("keydown", (e) => this._handleKeydown(e));
     }
     /**
      * Value of the form element.
@@ -68,14 +64,14 @@ let ie = (() => {
     }
     /** Name of the icon at component's start, which will be forward to the nested `sbb-icon`. */
     get startIcon() {
-      return _(this, b);
+      return m(this, b);
     }
     set startIcon(e) {
       v(this, b, e);
     }
     /** Name of the icon at component's end, which will be forward to the nested `sbb-icon`. */
     get endIcon() {
-      return _(this, d);
+      return m(this, d);
     }
     set endIcon(e) {
       v(this, d, e);
@@ -120,8 +116,8 @@ let ie = (() => {
       return Math.max(+this.min, Math.min(+this.max, +e)).toString();
     }
     _valueFraction() {
-      const e = this.valueAsNumber, s = +this.min, l = +this.max, V = (e - s) / (l - s);
-      return isNaN(V) ? 0 : Math.max(0, Math.min(1, V));
+      const e = this.valueAsNumber, s = +this.min, l = +this.max, A = (e - s) / (l - s);
+      return isNaN(A) ? 0 : Math.max(0, Math.min(1, A));
     }
     async _handleKeydown(e) {
       if (e.key !== "Tab" && e.preventDefault(), !this.readOnly) {
@@ -143,15 +139,15 @@ let ie = (() => {
       }
     }
     /** Emits the change event. */
-    _emitChange(e) {
-      G(e, this), this._didChange.emit();
+    _dispatchChangeEvent() {
+      this.dispatchEvent(new Event("change", { bubbles: !0 })), this.dispatchEvent(new Event("didChange", { bubbles: !0 }));
     }
     render() {
-      return g`
+      return f`
       <div class="sbb-slider__height-container">
         <div class="sbb-slider__wrapper">
           <slot name="prefix">
-            ${this.startIcon ? g`<sbb-icon name="${this.startIcon}"></sbb-icon>` : p}
+            ${this.startIcon ? f`<sbb-icon name="${this.startIcon}"></sbb-icon>` : p}
           </slot>
           <div class="sbb-slider__container">
             <input
@@ -162,9 +158,9 @@ let ie = (() => {
               value=${this.value || p}
               class="sbb-slider__range-input"
               type="range"
-              @change=${(e) => this._emitChange(e)}
+              @change=${() => this._dispatchChangeEvent()}
               @input=${() => this.value = this._rangeInput.value}
-              ${B((e) => this._rangeInput = e)}
+              ${U((e) => this._rangeInput = e)}
             />
             <div class="sbb-slider__line">
               <div class="sbb-slider__selected-line"></div>
@@ -172,32 +168,31 @@ let ie = (() => {
             <div class="sbb-slider__knob"></div>
           </div>
           <slot name="suffix">
-            ${this.endIcon ? g`<sbb-icon name="${this.endIcon}"></sbb-icon>` : p}
+            ${this.endIcon ? f`<sbb-icon name="${this.endIcon}"></sbb-icon>` : p}
           </slot>
         </div>
       </div>
     `;
     }
   }, b = new WeakMap(), d = new WeakMap(), n = a, (() => {
-    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(x[Symbol.metadata] ?? null) : void 0;
-    w = [h()], k = [h({ attribute: "value-as-number", type: Number })], y = [h()], I = [h()], z = [D(), h({ attribute: "start-icon" })], M = [D(), h({ attribute: "end-icon" })], o(a, null, w, { kind: "setter", name: "value", static: !1, private: !1, access: { has: (s) => "value" in s, set: (s, l) => {
+    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(g[Symbol.metadata] ?? null) : void 0;
+    x = [h()], w = [h({ attribute: "value-as-number", type: Number })], k = [h()], y = [h()], I = [D(), h({ attribute: "start-icon" })], E = [D(), h({ attribute: "end-icon" })], o(a, null, x, { kind: "setter", name: "value", static: !1, private: !1, access: { has: (s) => "value" in s, set: (s, l) => {
       s.value = l;
-    } }, metadata: e }, null, u), o(a, null, k, { kind: "setter", name: "valueAsNumber", static: !1, private: !1, access: { has: (s) => "valueAsNumber" in s, set: (s, l) => {
+    } }, metadata: e }, null, u), o(a, null, w, { kind: "setter", name: "valueAsNumber", static: !1, private: !1, access: { has: (s) => "valueAsNumber" in s, set: (s, l) => {
       s.valueAsNumber = l;
-    } }, metadata: e }, null, u), o(a, null, y, { kind: "setter", name: "min", static: !1, private: !1, access: { has: (s) => "min" in s, set: (s, l) => {
+    } }, metadata: e }, null, u), o(a, null, k, { kind: "setter", name: "min", static: !1, private: !1, access: { has: (s) => "min" in s, set: (s, l) => {
       s.min = l;
-    } }, metadata: e }, null, u), o(a, null, I, { kind: "setter", name: "max", static: !1, private: !1, access: { has: (s) => "max" in s, set: (s, l) => {
+    } }, metadata: e }, null, u), o(a, null, y, { kind: "setter", name: "max", static: !1, private: !1, access: { has: (s) => "max" in s, set: (s, l) => {
       s.max = l;
-    } }, metadata: e }, null, u), o(a, null, z, { kind: "accessor", name: "startIcon", static: !1, private: !1, access: { has: (s) => "startIcon" in s, get: (s) => s.startIcon, set: (s, l) => {
+    } }, metadata: e }, null, u), o(a, null, I, { kind: "accessor", name: "startIcon", static: !1, private: !1, access: { has: (s) => "startIcon" in s, get: (s) => s.startIcon, set: (s, l) => {
       s.startIcon = l;
-    } }, metadata: e }, N, S), o(a, null, M, { kind: "accessor", name: "endIcon", static: !1, private: !1, access: { has: (s) => "endIcon" in s, get: (s) => s.endIcon, set: (s, l) => {
+    } }, metadata: e }, z, N), o(a, null, E, { kind: "accessor", name: "endIcon", static: !1, private: !1, access: { has: (s) => "endIcon" in s, get: (s) => s.endIcon, set: (s, l) => {
       s.endIcon = l;
-    } }, metadata: e }, E, A), o(null, i = { value: n }, t, { kind: "class", name: n.name, metadata: e }, null, r), m = n = i.value, e && Object.defineProperty(n, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
-  })(), a.role = "slider", a.styles = K, a.events = {
+    } }, metadata: e }, M, S), o(null, i = { value: n }, t, { kind: "class", name: n.name, metadata: e }, null, r), n = i.value, e && Object.defineProperty(n, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
+  })(), a.role = "slider", a.styles = P, a.events = {
     didChange: "didChange"
-  }, c(n, r), a);
-  return m = n;
+  }, c(n, r), n;
 })();
 export {
-  ie as SbbSliderElement
+  Z as SbbSliderElement
 };

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

@@ -11,26 +11,17 @@ declare const SbbStepElement_base: import('../../core/mixins.js').AbstractConstr
  * Combined with a `sbb-stepper`, it displays a step's content.
  *
  * @slot - Use the unnamed slot to provide content.
- * @event {CustomEvent<SbbStepValidateEventDetails>} validate - Emits whenever step switch is triggered. Can be canceled.
  */
 export declare class SbbStepElement extends SbbStepElement_base {
     static readonly role = "tabpanel";
     static styles: CSSResultGroup;
     static readonly events: {
         readonly validate: "validate";
-        readonly resizeChange: "resizeChange";
+        readonly resizechange: "resizechange";
     };
-    /** Emits whenever step switch is triggered. */
-    private _validate;
-    /**
-     * @internal
-     * Emits when a resize happens, used to avoid setting the height of the stepper from the step component.
-     */
-    private _resizeChange;
     private _stepper;
     private _stepResizeObserver;
     /** The label of the step. */
-    private set label(value);
     get label(): SbbStepLabelElement | null;
     private _label;
     constructor();
@@ -59,9 +50,9 @@ export declare class SbbStepElement extends SbbStepElement_base {
     private _isGoNextElement;
     private _isGoPreviousElement;
     private _onStepElementResize;
-    private _getStepLabel;
     connectedCallback(): void;
     protected firstUpdated(changedProperties: PropertyValues<this>): void;
+    private _assignLabel;
     protected render(): TemplateResult;
 }
 declare global {
@@ -71,7 +62,7 @@ declare global {
 }
 declare global {
     interface GlobalEventHandlersEventMap {
-        resizeChange: CustomEvent<void>;
+        resizechange: CustomEvent<void>;
     }
 }
 export {};

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

@@ -1 +1 @@
-{"version":3,"file":"step.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/stepper/step/step.component.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EACV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AASb,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAO5D,MAAM,MAAM,2BAA2B,GAAG;IACxC,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,WAAW,EAAE,cAAc,GAAG,IAAI,CAAC;IACnC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,QAAQ,EAAE,cAAc,GAAG,IAAI,CAAC;CACjC,CAAC;;AAEF;;;;;GAKG;AACH,qBAEM,cAAe,SAAQ,mBAAoC;IAC/D,gBAAgC,IAAI,cAAc;IAClD,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;;MAGlB;IAEX,+CAA+C;IAC/C,OAAO,CAAC,SAAS,CAGf;IAEF;;;OAGG;IACH,OAAO,CAAC,aAAa,CAInB;IAEF,OAAO,CAAC,QAAQ,CAAkC;IAMlD,OAAO,CAAC,mBAAmB,CAIxB;IAEH,6BAA6B;IAE7B,OAAO,KAAK,KAAK,QAUhB;IACD,IAAW,KAAK,IAAI,mBAAmB,GAAG,IAAI,CAE7C;IACD,OAAO,CAAC,MAAM,CAAoC;;IAOlD;;;OAGG;IACI,MAAM,IAAI,IAAI;IAQrB;;;OAGG;IACI,QAAQ,IAAI,IAAI;IAQvB;;;OAGG;IACI,QAAQ,CAAC,SAAS,EAAE,2BAA2B,GAAG,OAAO;IAIhE;;;OAGG;IACI,SAAS,CAAC,aAAa,EAAE,OAAO,GAAG,IAAI;IAM9C,iGAAiG;IACjG,OAAO,CAAC,YAAY;IAWpB,OAAO,CAAC,gBAAgB;IAIxB,OAAO,CAAC,oBAAoB;IAI5B,OAAO,CAAC,oBAAoB;IAO5B,OAAO,CAAC,aAAa;IAQL,iBAAiB,IAAI,IAAI;cAQtB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAO3D,MAAM,IAAI,cAAc;CAS5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,UAAU,EAAE,cAAc,CAAC;KAC5B;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,2BAA2B;QACnC,YAAY,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC;KACjC;CACF"}
+{"version":3,"file":"step.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/stepper/step/step.component.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EACV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAQb,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAO5D,MAAM,MAAM,2BAA2B,GAAG;IACxC,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,WAAW,EAAE,cAAc,GAAG,IAAI,CAAC;IACnC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,QAAQ,EAAE,cAAc,GAAG,IAAI,CAAC;CACjC,CAAC;;AAEF;;;;GAIG;AACH,qBAEM,cAAe,SAAQ,mBAAoC;IAC/D,gBAAgC,IAAI,cAAc;IAClD,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;;MAGlB;IAEX,OAAO,CAAC,QAAQ,CAAkC;IAMlD,OAAO,CAAC,mBAAmB,CAIxB;IAEH,6BAA6B;IAC7B,IAAW,KAAK,IAAI,mBAAmB,GAAG,IAAI,CAE7C;IACD,OAAO,CAAC,MAAM,CAAoC;;IAOlD;;;OAGG;IACI,MAAM,IAAI,IAAI;IAQrB;;;OAGG;IACI,QAAQ,IAAI,IAAI;IAQvB;;;OAGG;IACI,QAAQ,CAAC,SAAS,EAAE,2BAA2B,GAAG,OAAO;IAehE;;;OAGG;IACI,SAAS,CAAC,aAAa,EAAE,OAAO,GAAG,IAAI;IAM9C,iGAAiG;IACjG,OAAO,CAAC,YAAY;IAWpB,OAAO,CAAC,gBAAgB;IAIxB,OAAO,CAAC,oBAAoB;IAI5B,OAAO,CAAC,oBAAoB;IAYZ,iBAAiB,IAAI,IAAI;cAQtB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAO9E,OAAO,CAAC,YAAY;cAkBD,MAAM,IAAI,cAAc;CAS5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,UAAU,EAAE,cAAc,CAAC;KAC5B;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,2BAA2B;QACnC,YAAY,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC;KACjC;CACF"}

package/stepper/step/step.component.js

@@ -1,24 +1,19 @@
-import { __esDecorate as h, __runInitializers as d } from "tslib";
-import { ResizeController as c } from "@lit-labs/observers/resize-controller.js";
-import { css as m, LitElement as u, html as v } from "lit";
-import { customElement as g } from "lit/decorators.js";
-import { EventEmitter as o } from "../../core/eventing.js";
-import { SbbElementInternalsMixin as y, removeAriaElements as f, appendAriaElements as _ } from "../../core/mixins.js";
-const E = m`*,:before,:after{box-sizing:border-box}: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;--sbb-step-color: var(--sbb-color-iron);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);color:var(--sbb-step-color);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 x = 0, A = (() => {
+import { __esDecorate as l, __runInitializers as p } from "tslib";
+import { ResizeController as d } from "@lit-labs/observers/resize-controller.js";
+import { css as c, LitElement as h, 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";
+const f = c`*,:before,:after{box-sizing:border-box}: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;--sbb-step-color: var(--sbb-color-iron);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);color:var(--sbb-step-color);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 _ = 0, k = (() => {
   var e;
-  let p = [g("sbb-step")], n, r = [], s, b = y(u);
-  var a = (e = class extends b {
+  let o = [u("sbb-step")], n, r = [], s, b = v(h);
+  return e = class extends b {
     /** The label of the step. */
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    set label(t) {
-      this.internals.ariaLabelledByElements = f(this.internals.ariaLabelledByElements, this._label), this._label = t instanceof Element ? t : null, this.internals.ariaLabelledByElements = _(this.internals.ariaLabelledByElements, this._label);
-    }
     get label() {
       return this._label;
     }
     constructor() {
-      super(), this._validate = new o(this, a.events.validate), this._resizeChange = new o(this, a.events.resizeChange, { bubbles: !0 }), this._stepper = null, this._stepResizeObserver = new c(this, {
+      super(), this._stepper = null, this._stepResizeObserver = new d(this, {
         target: null,
         skipInitial: !0,
         callback: () => setTimeout(() => this._onStepElementResize())
@@ -43,19 +38,24 @@ let x = 0, A = (() => {
      * @internal
      */
     validate(t) {
-      return !!this._validate.emit(t);
+      return this.dispatchEvent(new CustomEvent("validate", {
+        bubbles: !0,
+        composed: !0,
+        cancelable: !0,
+        detail: t
+      }));
     }
     /**
      * Configures the step.
      * @internal
      */
     configure(t) {
-      t && (this.label = this._getStepLabel());
+      t && this._assignLabel();
     }
     /** Watches for clicked elements with `sbb-stepper-next` or `sbb-stepper-previous` attributes. */
     _handleClick(t) {
-      const l = t.composedPath().filter((i) => i instanceof window.HTMLElement);
-      l.some((i) => this._isGoNextElement(i)) ? this._stepper?.next() : l.some((i) => this._isGoPreviousElement(i)) && this._stepper?.previous();
+      const i = t.composedPath().filter((a) => a instanceof window.HTMLElement);
+      i.some((a) => this._isGoNextElement(a)) ? this._stepper?.next() : i.some((a) => this._isGoPreviousElement(a)) && this._stepper?.previous();
     }
     _isGoNextElement(t) {
       return t.hasAttribute("sbb-stepper-next") && !t.hasAttribute("disabled");
@@ -64,24 +64,25 @@ let x = 0, A = (() => {
       return t.hasAttribute("sbb-stepper-previous") && !t.hasAttribute("disabled");
     }
     _onStepElementResize() {
-      this.hasAttribute("data-selected") && this._resizeChange.emit();
-    }
-    _getStepLabel() {
-      let t = this.previousElementSibling;
-      for (; t && t.localName !== "sbb-step-label"; )
-        t = t.previousElementSibling;
-      return t;
+      this.hasAttribute("data-selected") && this.dispatchEvent(new Event("resizechange", { bubbles: !0 }));
     }
     connectedCallback() {
-      super.connectedCallback(), this.id ||= `sbb-step-${x++}`, this.slot ||= "step", this._stepper = this.closest("sbb-stepper"), this.label = this._getStepLabel();
+      super.connectedCallback(), this.id ||= `sbb-step-${_++}`, this.slot ||= "step", this._stepper = this.closest("sbb-stepper"), this._assignLabel();
     }
     firstUpdated(t) {
       super.firstUpdated(t), this.updateComplete.then(() => {
         this._stepResizeObserver.observe(this.shadowRoot.querySelector(".sbb-step"));
       });
     }
+    _assignLabel() {
+      let t = this.previousElementSibling;
+      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);
+    }
     render() {
-      return v`
+      return m`
       <div class="sbb-step--wrapper">
         <div class="sbb-step">
           <slot></slot>
@@ -91,13 +92,12 @@ let x = 0, A = (() => {
     }
   }, s = e, (() => {
     const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(b[Symbol.metadata] ?? null) : void 0;
-    h(null, n = { value: s }, p, { kind: "class", name: s.name, metadata: t }, null, r), a = s = n.value, t && Object.defineProperty(s, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
-  })(), e.role = "tabpanel", e.styles = E, e.events = {
+    l(null, n = { value: s }, o, { kind: "class", name: s.name, metadata: t }, null, r), s = n.value, t && Object.defineProperty(s, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
+  })(), e.role = "tabpanel", e.styles = f, e.events = {
     validate: "validate",
-    resizeChange: "resizeChange"
-  }, d(s, r), e);
-  return a = s;
+    resizechange: "resizechange"
+  }, p(s, r), s;
 })();
 export {
-  A as SbbStepElement
+  k as SbbStepElement
 };

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

@@ -7,18 +7,15 @@ declare const SbbStepLabelElement_base: import('../../core/mixins.js').AbstractC
  *
  * @slot - Use the unnamed slot to provide a label.
  * @slot icon - Use this to display an icon in the label bubble.
- * @overrideType value - string
  */
 export declare class SbbStepLabelElement extends SbbStepLabelElement_base {
     static readonly role = "tab";
     static styles: CSSResultGroup;
     /** The step controlled by the label. */
-    private set step(value);
     get step(): SbbStepElement | null;
     private _step;
     private _stepper;
     constructor();
-    private _getStep;
     connectedCallback(): void;
     /**
      * Selects and configures the step label.
@@ -35,6 +32,7 @@ export declare class SbbStepLabelElement extends SbbStepLabelElement_base {
      * @internal
      */
     configure(posInSet: number, setSize: number, stepperLoaded: boolean): void;
+    private _assignStep;
     protected render(): TemplateResult;
 }
 declare global {

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

@@ -1 +1 @@
-{"version":3,"file":"step-label.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/stepper/step-label/step-label.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAQ,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAGrE,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAGnE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;;AAOjD;;;;;;GAMG;AACH,qBAEM,mBAAoB,SAAQ,wBAAwD;IACxF,gBAAgC,IAAI,SAAS;IAC7C,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,wCAAwC;IAExC,OAAO,KAAK,IAAI,QAUf;IACD,IAAW,IAAI,IAAI,cAAc,GAAG,IAAI,CAEvC;IACD,OAAO,CAAC,KAAK,CAA+B;IAE5C,OAAO,CAAC,QAAQ,CAAkC;;IAWlD,OAAO,CAAC,QAAQ;IAQA,iBAAiB,IAAI,IAAI;IAazC;;;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"}
+{"version":3,"file":"step-label.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/stepper/step-label/step-label.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAQ,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAGrE,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAGnE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;;AAOjD;;;;;GAKG;AACH,qBAEM,mBAAoB,SAAQ,wBAAwD;IACxF,gBAAgC,IAAI,SAAS;IAC7C,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,wCAAwC;IACxC,IAAW,IAAI,IAAI,cAAc,GAAG,IAAI,CAEvC;IACD,OAAO,CAAC,KAAK,CAA+B;IAE5C,OAAO,CAAC,QAAQ,CAAkC;;IAWlC,iBAAiB,IAAI,IAAI;IAazC;;;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,WAAW;cAkBA,MAAM,IAAI,cAAc;CAQ5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,gBAAgB,EAAE,mBAAmB,CAAC;KACvC;CACF"}

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

@@ -7,13 +7,9 @@ import { SbbIconNameMixin as u } from "../../icon.js";
 const g = c`*,:before,:after{box-sizing:border-box}:host{--sbb-step-label-color: var(--sbb-color-iron);--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-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){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}`;
 let y = 0, I = (() => {
   var e;
-  let b = [f("sbb-step-label")], a, i = [], s, r = u(v(h));
-  return e = class extends r {
+  let o = [f("sbb-step-label")], i, r = [], s, b = u(v(h));
+  return e = class extends b {
     /** The step controlled by the label. */
-    // eslint-disable-next-line @typescript-eslint/naming-convention
-    set step(t) {
-      this.internals.ariaControlsElements = x(this.internals.ariaControlsElements, this._step), this._step = t instanceof Element ? t : null, this.internals.ariaControlsElements = m(this.internals.ariaControlsElements, this._step);
-    }
     get step() {
       return this._step;
     }
@@ -22,14 +18,8 @@ let y = 0, I = (() => {
         this._stepper && this.step && (this._stepper.selected = this.step);
       });
     }
-    _getStep() {
-      let t = this.nextElementSibling;
-      for (; t && t.localName !== "sbb-step"; )
-        t = t.nextElementSibling;
-      return t;
-    }
     connectedCallback() {
-      super.connectedCallback(), this.id ||= `sbb-step-label-${y++}`, this.slot ||= "step-label", this.internals.ariaSelected = "false", this.tabIndex = -1, this._stepper = this.closest("sbb-stepper"), this.step = this._getStep(), this.toggleAttribute("data-disabled", this.hasAttribute("disabled"));
+      super.connectedCallback(), this.id ||= `sbb-step-label-${y++}`, this.slot ||= "step-label", this.internals.ariaSelected = "false", this.tabIndex = -1, this._stepper = this.closest("sbb-stepper"), this._assignStep(), this.toggleAttribute("data-disabled", this.hasAttribute("disabled"));
     }
     /**
      * Selects and configures the step label.
@@ -49,8 +39,15 @@ let y = 0, I = (() => {
      * Configures the step label.
      * @internal
      */
-    configure(t, o, l) {
-      l && (this.step = this._getStep()), this.internals.ariaPosInSet = `${t}`, this.internals.ariaSetSize = `${o}`;
+    configure(t, a, l) {
+      l && this._assignStep(), this.internals.ariaPosInSet = `${t}`, this.internals.ariaSetSize = `${a}`;
+    }
+    _assignStep() {
+      let t = this.nextElementSibling;
+      for (; t && t.localName !== "sbb-step"; )
+        t = t.nextElementSibling;
+      const a = t;
+      this.internals.ariaControlsElements = x(this.internals.ariaControlsElements, this._step), this._step = a instanceof Element ? a : null, this.internals.ariaControlsElements = m(this.internals.ariaControlsElements, this._step);
     }
     render() {
       return d`
@@ -61,9 +58,9 @@ let y = 0, I = (() => {
     `;
     }
   }, s = e, (() => {
-    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(r[Symbol.metadata] ?? null) : void 0;
-    n(null, a = { value: s }, b, { kind: "class", name: s.name, metadata: t }, null, i), s = a.value, t && Object.defineProperty(s, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
-  })(), e.role = "tab", e.styles = g, p(s, i), s;
+    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(b[Symbol.metadata] ?? null) : void 0;
+    n(null, i = { value: s }, o, { kind: "class", name: s.name, metadata: t }, null, r), s = i.value, t && Object.defineProperty(s, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
+  })(), e.role = "tab", e.styles = g, p(s, r), s;
 })();
 export {
   I as SbbStepLabelElement

package/stepper/stepper/stepper.component.js

@@ -4,14 +4,14 @@ var T = (s) => {
 var M = (s, r, a) => r.has(s) || T("Cannot " + a);
 var f = (s, r, a) => (M(s, r, "read from private field"), a ? a.call(s) : r.get(s)), m = (s, r, a) => r.has(s) ? T("Cannot add the same private member more than once") : r instanceof WeakSet ? r.add(s) : r.set(s, a), d = (s, r, a, n) => (M(s, r, "write to private field"), n ? n.call(s, a) : r.set(s, a), a);
 import { __esDecorate as h, __runInitializers as o } from "tslib";
-import { IntersectionController as H } from "@lit-labs/observers/intersection-controller.js";
+import { IntersectionController as C } from "@lit-labs/observers/intersection-controller.js";
 import { css as R, LitElement as D, html as U } from "lit";
 import { customElement as q, property as u } from "lit/decorators.js";
 import { isArrowKeyPressed as B, getNextElementIndex as N } from "../../core/a11y.js";
 import { forceType as $ } from "../../core/decorators.js";
 import { breakpoints as j, isLean as K, isBreakpoint as P } from "../../core/dom.js";
 import { SbbHydrationMixin as V } from "../../core/mixins.js";
-const W = R`*,: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-duration, 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-duration: 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}`, C = 150;
+const W = R`*,: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-duration, 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-duration: 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}`, H = 150;
 let re = (() => {
   var c, b, p, l;
   let s = [q("sbb-stepper")], r, a = [], n, z = V(D), _ = [], x, v = [], k = [], S, I, y = [], w = [], E, A = [], F = [], L, O;
@@ -21,7 +21,7 @@ let re = (() => {
       m(this, c);
       m(this, b);
       m(this, p);
-      this._observer = (o(this, _), new H(this, {
+      this._observer = (o(this, _), new C(this, {
         target: null,
         callback: (e) => {
           e.forEach((t) => {
@@ -29,8 +29,8 @@ let re = (() => {
           });
         }
       })), d(this, c, o(this, v, !1)), this._horizontalFrom = (o(this, k), null), d(this, b, o(this, y, "horizontal")), d(this, p, (o(this, w), o(this, A, K() ? "s" : "m"))), this._loaded = (o(this, F), !1), this._resizeObserverTimeout = null, this._onStepperResize = () => {
-        this._checkOrientation(), this._setStepperHeight(this.selected), clearTimeout(this._resizeObserverTimeout), this.toggleAttribute("data-disable-animation", !0), this._resizeObserverTimeout = setTimeout(() => this.toggleAttribute("data-disable-animation", !1), C);
-      }, this.addEventListener?.("keydown", (e) => this._handleKeyDown(e)), this.addEventListener?.("resizeChange", (e) => this._onSelectedStepResize(e));
+        this._checkOrientation(), this._setStepperHeight(this.selected), clearTimeout(this._resizeObserverTimeout), this.toggleAttribute("data-disable-animation", !0), this._resizeObserverTimeout = setTimeout(() => this.toggleAttribute("data-disable-animation", !1), H);
+      }, this.addEventListener?.("keydown", (e) => this._handleKeyDown(e)), this.addEventListener?.("resizechange", (e) => this._onSelectedStepResize(e));
     }
     /** If set to true, only the current and previous labels can be clicked and selected. */
     get linear() {
@@ -179,7 +179,7 @@ let re = (() => {
     }
     firstUpdated(e) {
       super.firstUpdated(e), this.updateComplete.then(() => {
-        this._loaded = !0, this.selectedIndex = this.linear ? 0 : Number(this.getAttribute("selected-index")) || 0, this._observer.observe(this), this._checkOrientation(), setTimeout(() => this.toggleAttribute("data-disable-animation", !1), C);
+        this._loaded = !0, this.selectedIndex = this.linear ? 0 : Number(this.getAttribute("selected-index")) || 0, this._observer.observe(this), this._checkOrientation(), setTimeout(() => this.toggleAttribute("data-disable-animation", !1), H);
       });
     }
     willUpdate(e) {

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

@@ -30,12 +30,11 @@ declare const SbbTabGroupElement_base: import('../../core/mixins.js').AbstractCo
  *
  * @slot - Use the unnamed slot to add content to the `sbb-tab-group` via
  * `sbb-tab-label` and `sbb-tab` instances.
- * @event {CustomEvent<SbbTabChangedEventDetails>} didChange - Emits an event on selected tab change.
  */
 export declare class SbbTabGroupElement extends SbbTabGroupElement_base {
     static styles: CSSResultGroup;
     static readonly events: {
-        readonly didChange: "didChange";
+        readonly tabchange: "tabchange";
     };
     private _tabs;
     private _selectedTab?;
@@ -56,8 +55,6 @@ export declare class SbbTabGroupElement extends SbbTabGroupElement_base {
      * the tab group, the first enabled tab will be selected.
      */
     accessor initialSelectedIndex: number;
-    /** Emits an event on selected tab change. */
-    private _selectedTabChanged;
     constructor();
     protected firstUpdated(changedProperties: PropertyValues<this>): void;
     /**

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

@@ -1 +1 @@
-{"version":3,"file":"tab-group.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/tabs/tab-group/tab-group.component.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AASvC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAI1C,MAAM,MAAM,yBAAyB,GAAG;IACtC,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,kBAAkB,CAAC;IACnC,SAAS,EAAE,aAAa,CAAC;IACzB,aAAa,EAAE,MAAM,CAAC;IACtB,gBAAgB,EAAE,kBAAkB,GAAG,SAAS,CAAC;IACjD,WAAW,EAAE,aAAa,GAAG,SAAS,CAAC;CACxC,CAAC;AAEF,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,IAAI,IAAI,CAAC;IACjB,UAAU,IAAI,IAAI,CAAC;IACnB,MAAM,IAAI,IAAI,CAAC;IACf,OAAO,IAAI,IAAI,CAAC;IAChB,MAAM,IAAI,IAAI,CAAC;CAChB;AAED,MAAM,WAAW,uBAAwB,SAAQ,kBAAkB;IACjE,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,GAAG,CAAC,EAAE,aAAa,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,2BAA2B,CAAC;IAC9C,IAAI,EAAE,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;CACxB;;AAQD;;;;;;GAMG;AACH,qBAEM,kBAAmB,SAAQ,uBAA6B;IAC5D,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;MAElB;IAEX,OAAO,CAAC,KAAK,CAAiC;IAC9C,OAAO,CAAC,YAAY,CAAC,CAA0B;IAC/C,OAAO,CAAC,gBAAgB,CAAe;IACvC,OAAO,CAAC,kBAAkB,CAAe;IACzC,OAAO,CAAC,qBAAqB,CAI1B;IACH,OAAO,CAAC,uBAAuB,CAI5B;IACH,OAAO,CAAC,yBAAyB,CAI9B;IAEH;;;OAGG;IACH,IACW,IAAI,CAAC,KAAK,EAAE,uBAAuB,CAAC,MAAM,CAAC,EAGrD;IACD,IAAW,IAAI,IAAI,uBAAuB,CAAC,MAAM,CAAC,CAEjD;IACD,OAAO,CAAC,KAAK,CAAyD;IAEtE;;;OAGG;IACH,SAEgB,oBAAoB,EAAE,MAAM,CAAK;IAGjD,6CAA6C;IAC7C,OAAO,CAAC,mBAAmB,CAGzB;;cAOiB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAS9E;;;OAGG;IACI,UAAU,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI;IAIzC;;;OAGG;IACI,SAAS,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI;IAIxC;;;OAGG;IACI,WAAW,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI;IAI1C,OAAO,CAAC,QAAQ;IAMhB,OAAO,CAAC,YAAY;IAIpB,OAAO,CAAC,WAAW;IAMnB,OAAO,CAAC,oBAAoB,CAY1B;IAEF,OAAO,CAAC,iBAAiB,CAavB;IAEF,OAAO,CAAC,SAAS;IAIjB,OAAO,CAAC,cAAc;IAYtB,OAAO,CAAC,sBAAsB;IAwB9B,OAAO,CAAC,wBAAwB;IAgBhC,OAAO,CAAC,0BAA0B;IAWlC,OAAO,CAAC,UAAU;IAiGlB,OAAO,CAAC,cAAc;cAoBH,MAAM,IAAI,cAAc;CAe5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,eAAe,EAAE,kBAAkB,CAAC;KACrC;CACF"}
+{"version":3,"file":"tab-group.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/tabs/tab-group/tab-group.component.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AASvC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAI1C,MAAM,MAAM,yBAAyB,GAAG;IACtC,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,kBAAkB,CAAC;IACnC,SAAS,EAAE,aAAa,CAAC;IACzB,aAAa,EAAE,MAAM,CAAC;IACtB,gBAAgB,EAAE,kBAAkB,GAAG,SAAS,CAAC;IACjD,WAAW,EAAE,aAAa,GAAG,SAAS,CAAC;CACxC,CAAC;AAEF,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,IAAI,IAAI,CAAC;IACjB,UAAU,IAAI,IAAI,CAAC;IACnB,MAAM,IAAI,IAAI,CAAC;IACf,OAAO,IAAI,IAAI,CAAC;IAChB,MAAM,IAAI,IAAI,CAAC;CAChB;AAED,MAAM,WAAW,uBAAwB,SAAQ,kBAAkB;IACjE,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,GAAG,CAAC,EAAE,aAAa,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,2BAA2B,CAAC;IAC9C,IAAI,EAAE,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;CACxB;;AAQD;;;;;GAKG;AACH,qBAEM,kBAAmB,SAAQ,uBAA6B;IAC5D,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;MAElB;IAEX,OAAO,CAAC,KAAK,CAAiC;IAC9C,OAAO,CAAC,YAAY,CAAC,CAA0B;IAC/C,OAAO,CAAC,gBAAgB,CAAe;IACvC,OAAO,CAAC,kBAAkB,CAAe;IACzC,OAAO,CAAC,qBAAqB,CAI1B;IACH,OAAO,CAAC,uBAAuB,CAI5B;IACH,OAAO,CAAC,yBAAyB,CAI9B;IAEH;;;OAGG;IACH,IACW,IAAI,CAAC,KAAK,EAAE,uBAAuB,CAAC,MAAM,CAAC,EAGrD;IACD,IAAW,IAAI,IAAI,uBAAuB,CAAC,MAAM,CAAC,CAEjD;IACD,OAAO,CAAC,KAAK,CAAyD;IAEtE;;;OAGG;IACH,SAEgB,oBAAoB,EAAE,MAAM,CAAK;;cAO9B,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAS9E;;;OAGG;IACI,UAAU,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI;IAIzC;;;OAGG;IACI,SAAS,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI;IAIxC;;;OAGG;IACI,WAAW,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI;IAI1C,OAAO,CAAC,QAAQ;IAMhB,OAAO,CAAC,YAAY;IAIpB,OAAO,CAAC,WAAW;IAMnB,OAAO,CAAC,oBAAoB,CAY1B;IAEF,OAAO,CAAC,iBAAiB,CAavB;IAEF,OAAO,CAAC,SAAS;IAIjB,OAAO,CAAC,cAAc;IAYtB,OAAO,CAAC,sBAAsB;IAwB9B,OAAO,CAAC,wBAAwB;IAgBhC,OAAO,CAAC,0BAA0B;IAWlC,OAAO,CAAC,UAAU;IA4GlB,OAAO,CAAC,cAAc;cAoBH,MAAM,IAAI,cAAc;CAe5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,eAAe,EAAE,kBAAkB,CAAC;KACrC;CACF"}