@sbb-esta/lyne-elements 0.52.0 → 0.52.2

package/image.js

@@ -1,14 +1,14 @@
-import { css as y, LitElement as k, html as d, nothing as l } from "lit";
-import { property as s, eventOptions as _, customElement as $ } from "lit/decorators.js";
-import { ref as v } from "lit/directives/ref.js";
+import { css as y, LitElement as _, html as d, nothing as l } from "lit";
+import { property as s, eventOptions as k, customElement as v } from "lit/decorators.js";
+import { ref as $ } from "lit/directives/ref.js";
 import { hostContext as x } from "./core/dom.js";
-const S = 0, P = 359, w = 360, M = 599, z = 600, B = 839, C = 840, L = 1023, O = 1024, Q = 1279, F = 1280, D = 1439, T = 1440, E = 2579, I = 16, R = y`*,:before,:after{box-sizing:border-box}:host{--sbb-image-border-radius: var(--sbb-border-radius-4x);--sbb-image-aspect-ratio: auto;--sbb-image-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-4x) );display:block}:host([aspect-ratio="1-1"]){--sbb-image-aspect-ratio: 1 / 1}:host([aspect-ratio="1-2"]){--sbb-image-aspect-ratio: 1 / 2}:host([aspect-ratio="2-1"]){--sbb-image-aspect-ratio: 2 / 1}:host([aspect-ratio="2-3"]){--sbb-image-aspect-ratio: 2 / 3}:host([aspect-ratio="3-2"]){--sbb-image-aspect-ratio: 3 / 2}:host([aspect-ratio="3-4"]){--sbb-image-aspect-ratio: 3 / 4}:host([aspect-ratio="4-3"]){--sbb-image-aspect-ratio: 4 / 3}:host([aspect-ratio="4-5"]){--sbb-image-aspect-ratio: 4 / 5}:host([aspect-ratio="5-4"]){--sbb-image-aspect-ratio: 5 / 4}:host([aspect-ratio="16-9"]){--sbb-image-aspect-ratio: 16 / 9}:host([aspect-ratio="9-16"]){--sbb-image-aspect-ratio: 9 / 16}:host([data-teaser]){--sbb-image-aspect-ratio: 1 / 1}@media (min-width: 37.5rem){:host([data-teaser]){--sbb-image-aspect-ratio: 16 / 9}}:host(:is([border-radius=none],[data-teaser])){--sbb-image-border-radius: 0}:host([border-radius=round]:not([data-teaser])){--sbb-image-border-radius: var(--sbb-border-radius-infinity)}.sbb-image__figure{margin:0}.sbb-image__img{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.000001}:host([data-loaded]) .sbb-image__img{opacity:.999999}:host([data-loaded]) .sbb-image__blurred{opacity:0}:is(.sbb-image__img,.sbb-image__blurred){width:100%;height:100%;object-fit:cover;transition:opacity var(--sbb-image-animation-duration) var(--sbb-animation-easing)}.sbb-image__wrapper{position:relative;overflow:hidden;max-width:100%;border-radius:var(--sbb-image-border-radius);aspect-ratio:var(--sbb-image-aspect-ratio)}.sbb-image__caption{--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);margin-block-start:var(--sbb-spacing-fixed-4x)}`;
-var h = Object.freeze, u = Object.defineProperty, A = Object.getOwnPropertyDescriptor, r = (e, t, o, i) => {
-  for (var n = i > 1 ? void 0 : i ? A(t, o) : t, p = e.length - 1, c; p >= 0; p--)
-    (c = e[p]) && (n = (i ? c(t, o, n) : c(n)) || n);
-  return i && n && u(t, o, n), n;
-}, H = (e, t) => h(u(e, "raw", { value: h(e.slice()) })), g;
-const j = (e) => {
+const w = 0, S = 359, P = 360, M = 599, z = 600, C = 839, B = 840, L = 1023, O = 1024, Q = 1279, F = 1280, D = 1439, E = 1440, T = 2579, I = 16, R = y`*,:before,:after{box-sizing:border-box}:host{--sbb-image-border-radius: var(--sbb-border-radius-4x);--sbb-image-aspect-ratio: auto;--sbb-image-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-4x) );display:block}:host([aspect-ratio="1-1"]){--sbb-image-aspect-ratio: 1 / 1}:host([aspect-ratio="1-2"]){--sbb-image-aspect-ratio: 1 / 2}:host([aspect-ratio="2-1"]){--sbb-image-aspect-ratio: 2 / 1}:host([aspect-ratio="2-3"]){--sbb-image-aspect-ratio: 2 / 3}:host([aspect-ratio="3-2"]){--sbb-image-aspect-ratio: 3 / 2}:host([aspect-ratio="3-4"]){--sbb-image-aspect-ratio: 3 / 4}:host([aspect-ratio="4-3"]){--sbb-image-aspect-ratio: 4 / 3}:host([aspect-ratio="4-5"]){--sbb-image-aspect-ratio: 4 / 5}:host([aspect-ratio="5-4"]){--sbb-image-aspect-ratio: 5 / 4}:host([aspect-ratio="16-9"]){--sbb-image-aspect-ratio: 16 / 9}:host([aspect-ratio="9-16"]){--sbb-image-aspect-ratio: 9 / 16}:host([data-teaser]){--sbb-image-aspect-ratio: 1 / 1}@media (min-width: 37.5rem){:host([data-teaser]){--sbb-image-aspect-ratio: 16 / 9}}:host(:is([border-radius=none],[data-teaser])){--sbb-image-border-radius: 0}:host([border-radius=round]:not([data-teaser])){--sbb-image-border-radius: var(--sbb-border-radius-infinity)}.sbb-image__figure{margin:0}.sbb-image__img{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.000001}:host([data-loaded]) .sbb-image__img{opacity:.999999}:host([data-loaded]) .sbb-image__blurred{opacity:0}:is(.sbb-image__img,.sbb-image__blurred){width:100%;height:100%;object-fit:cover;transition:opacity var(--sbb-image-animation-duration) var(--sbb-animation-easing)}.sbb-image__wrapper{position:relative;overflow:hidden;max-width:100%;border-radius:var(--sbb-image-border-radius);aspect-ratio:var(--sbb-image-aspect-ratio)}.sbb-image__caption{--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);margin-block-start:var(--sbb-spacing-fixed-4x)}`;
+var h = Object.freeze, u = Object.defineProperty, A = Object.getOwnPropertyDescriptor, o = (e, t, r, i) => {
+  for (var n = i > 1 ? void 0 : i ? A(t, r) : t, p = e.length - 1, b; p >= 0; p--)
+    (b = e[p]) && (n = (i ? b(t, r, n) : b(n)) || n);
+  return i && n && u(t, r, n), n;
+}, U = (e, t) => h(u(e, "raw", { value: h(e.slice()) })), g;
+const H = (e) => {
   if (!e || e.length === 0)
     return [];
   let t;
@@ -21,42 +21,59 @@ const j = (e) => {
     return [];
   if (!Array.isArray(t.breakpoints))
     return [];
-  let o = !1, i = !1;
+  let r = !1, i = !1;
   const n = ["image", "mediaQueries"];
   return t.breakpoints.forEach((p) => {
-    const c = Object.keys(p);
-    c.forEach((m) => {
-      n.includes(m) || (o = !0);
+    const b = Object.keys(p);
+    b.forEach((m) => {
+      n.includes(m) || (r = !0);
     }), n.forEach((m) => {
-      c.includes(m) || (i = !0);
+      b.includes(m) || (i = !0);
     });
-  }), o || i ? [] : t.breakpoints;
-}, U = {
+  }), r || i ? [] : t.breakpoints;
+}, j = {
   once: !0,
   passive: !0
-}, b = (e) => e / I, V = {
-  "sbb-breakpoint-zero-min": b(S),
-  "sbb-breakpoint-zero-max": b(P),
-  "sbb-breakpoint-micro-min": b(w),
-  "sbb-breakpoint-micro-max": b(M),
-  "sbb-breakpoint-small-min": b(z),
-  "sbb-breakpoint-small-max": b(B),
-  "sbb-breakpoint-medium-min": b(C),
-  "sbb-breakpoint-medium-max": b(L),
-  "sbb-breakpoint-large-min": b(O),
-  "sbb-breakpoint-large-max": b(Q),
-  "sbb-breakpoint-wide-min": b(F),
-  "sbb-breakpoint-wide-max": b(D),
-  "sbb-breakpoint-ultra-min": b(T),
-  "sbb-breakpoint-ultra-max": b(E)
+}, c = (e) => e / I, V = {
+  "sbb-breakpoint-zero-min": c(w),
+  "sbb-breakpoint-zero-max": c(S),
+  "sbb-breakpoint-micro-min": c(P),
+  "sbb-breakpoint-micro-max": c(M),
+  "sbb-breakpoint-small-min": c(z),
+  "sbb-breakpoint-small-max": c(C),
+  "sbb-breakpoint-medium-min": c(B),
+  "sbb-breakpoint-medium-max": c(L),
+  "sbb-breakpoint-large-min": c(O),
+  "sbb-breakpoint-large-max": c(Q),
+  "sbb-breakpoint-wide-min": c(F),
+  "sbb-breakpoint-wide-max": c(D),
+  "sbb-breakpoint-ultra-min": c(E),
+  "sbb-breakpoint-ultra-max": c(T)
 };
-let a = class extends k {
+let a = class extends _ {
   constructor() {
     super(...arguments), this._config = {
       nonRetinaQuality: "45",
       retinaQuality: "20"
     }, this.skipLqip = !1, this.copyrightHolder = "Organization", this.customFocalPoint = !1, this.decoding = "auto", this.focalPointDebug = !1, this.focalPointX = 1, this.focalPointY = 1, this.importance = "high", this.loading = "eager", this.borderRadius = "default", this.aspectRatio = "16-9";
   }
+  /** Whether the image is finished loading or failed to load. */
+  get complete() {
+    var e, t, r;
+    return ((r = (t = (e = this.shadowRoot) == null ? void 0 : e.querySelector) == null ? void 0 : t.call(e, ".sbb-image__img")) == null ? void 0 : r.complete) ?? !1;
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.toggleAttribute(
+      "data-teaser",
+      !!x("sbb-teaser-hero", this) || !!this.closest("sbb-teaser-paid")
+    );
+  }
+  updated(e) {
+    super.updated(e), this._captionElement && (this._linksInCaption = this._captionElement.querySelectorAll("a"), this._linksInCaption && this._addFocusAbilityToLinksInCaption());
+  }
+  async firstUpdated(e) {
+    super.firstUpdated(e), await this.updateComplete, this.complete && this.toggleAttribute("data-loaded", !0);
+  }
   _logPerformanceMarks() {
     this.performanceMark && (performance.clearMarks(this.performanceMark), performance.mark(this.performanceMark));
   }
@@ -73,8 +90,8 @@ let a = class extends k {
   _prepareImageUrl(e, t = !1) {
     if (!e || e === "")
       return "";
-    const o = !!e.match(/^\w+:\/\//), i = o ? new URL(e) : new URL(`http://noop/${e}`);
-    return t ? (i.searchParams.append("blur", "100"), i.searchParams.append("w", "100"), i.searchParams.append("h", "56")) : i.searchParams.append("auto", "format,compress,cs=tinysrgb"), this.customFocalPoint && (i.searchParams.append("fit", "crop"), i.searchParams.append("crop", "focalpoint"), i.searchParams.append("fp-x", this.focalPointX.toString(10)), i.searchParams.append("fp-y", this.focalPointY.toString(10)), i.searchParams.append("fp-z", "1")), this.focalPointDebug && i.searchParams.append("fp-debug", "true"), o ? i.href : i.pathname.substring(1) + i.search;
+    const r = !!e.match(/^\w+:\/\//), i = r ? new URL(e) : new URL(`http://noop/${e}`);
+    return t ? (i.searchParams.append("blur", "100"), i.searchParams.append("w", "100"), i.searchParams.append("h", "56")) : i.searchParams.append("auto", "format,compress,cs=tinysrgb"), this.customFocalPoint && (i.searchParams.append("fit", "crop"), i.searchParams.append("crop", "focalpoint"), i.searchParams.append("fp-x", this.focalPointX.toString(10)), i.searchParams.append("fp-y", this.focalPointY.toString(10)), i.searchParams.append("fp-z", "1")), this.focalPointDebug && i.searchParams.append("fp-debug", "true"), r ? i.href : i.pathname.substring(1) + i.search;
   }
   _preparePictureSizeConfigs() {
     let e;
@@ -129,27 +146,24 @@ let a = class extends k {
             ]
           }
         ]
-      }`, j(e);
+      }`, H(e);
   }
   _createMediaQueryString(e) {
     let t = "";
-    return e.forEach((o) => {
-      const i = o.conditionFeature;
+    return e.forEach((r) => {
+      const i = r.conditionFeature;
       let n;
-      o.conditionFeatureValue.lyneDesignToken ? n = this._matchMediaQueryDesignToken(o.conditionFeatureValue.value) : n = o.conditionFeatureValue.value;
-      const p = o.conditionOperator ? ` ${o.conditionOperator} ` : "";
+      r.conditionFeatureValue.lyneDesignToken ? n = this._matchMediaQueryDesignToken(r.conditionFeatureValue.value) : n = r.conditionFeatureValue.value;
+      const p = r.conditionOperator ? ` ${r.conditionOperator} ` : "";
       t += `(${i}: ${n})${p}`;
     }), t;
   }
-  connectedCallback() {
-    super.connectedCallback(), this.toggleAttribute(
-      "data-teaser",
-      !!x("sbb-teaser-hero", this) || !!this.closest("sbb-teaser-paid")
-    );
+  _imageLoaded() {
+    this._logPerformanceMarks(), this.toggleAttribute("data-loaded", !0), this.dispatchEvent(new Event("load"));
   }
   render() {
     let { caption: e } = this, t = "";
-    const o = this._prepareImageUrl(this.imageSrc, !0), i = this._prepareImageUrl(this.imageSrc, !1);
+    const r = this._prepareImageUrl(this.imageSrc, !0), i = this._prepareImageUrl(this.imageSrc, !1);
     this.loading === "lazy" && (this.decoding = "async", this.importance = "low"), this.copyright && (e = `${this.caption} ©${this.copyright}`, t = `{
         "@context": "https://schema.org",
         "@type": "Photograph",
@@ -166,7 +180,7 @@ let a = class extends k {
           ${this.skipLqip ? l : d`<img
                 alt=""
                 class="sbb-image__blurred"
-                src=${o}
+                src=${r}
                 width="1000"
                 height="562"
                 loading=${this.loading ?? l}
@@ -176,18 +190,19 @@ let a = class extends k {
           <picture>
             <!-- render picture element sources -->
             ${n.map((p) => {
-      const c = p.image.height, m = p.image.width, f = this._createMediaQueryString(p.mediaQueries);
+      const b = p.image.height, m = p.image.width, f = this._createMediaQueryString(p.mediaQueries);
       return [
         d` <source
                   media=${`${f}`}
                   sizes=${`${m}px`}
-                  srcset=${`${i}&w=${m}&h=${c}&q=${this._config.nonRetinaQuality} ${m}w, ${i}&w=${m * 2}&h=${c * 2}&q=${this._config.retinaQuality} ${m * 2}w`}
+                  srcset=${`${i}&w=${m}&h=${b}&q=${this._config.nonRetinaQuality} ${m}w, ${i}&w=${m * 2}&h=${b * 2}&q=${this._config.retinaQuality} ${m * 2}w`}
                 ></source>`
       ];
     })}
             <img
               alt=${this.alt || ""}
               @load=${this._imageLoaded}
+              @error=${() => this.dispatchEvent(new Event("error"))}
               class="sbb-image__img"
               src=${this.imageSrc}
               width="1000"
@@ -201,78 +216,76 @@ let a = class extends k {
         ${e ? d`<figcaption
               class="sbb-image__caption"
               .innerHTML=${e}
-              ${v((p) => {
+              ${$((p) => {
       this._captionElement = p;
     })}
             ></figcaption>` : l}
-        ${t ? d(g || (g = H(['<script type="application/ld+json" .innerHTML=', "><\/script>"])), t) : l}
+        ${t ? d(g || (g = U(['<script type="application/ld+json" .innerHTML=', "><\/script>"])), t) : l}
       </figure>
     `;
   }
-  updated(e) {
-    super.updated(e), this._captionElement && (this._linksInCaption = this._captionElement.querySelectorAll("a"), this._linksInCaption && this._addFocusAbilityToLinksInCaption());
-  }
-  _imageLoaded() {
-    this._logPerformanceMarks(), this.toggleAttribute("data-loaded", !0);
-  }
 };
 a.styles = R;
-r([
+a.events = {
+  error: "error",
+  load: "load"
+};
+o([
   s()
 ], a.prototype, "alt", 2);
-r([
+o([
   s({ attribute: "skip-lqip", type: Boolean })
 ], a.prototype, "skipLqip", 2);
-r([
+o([
   s()
 ], a.prototype, "caption", 2);
-r([
+o([
   s()
 ], a.prototype, "copyright", 2);
-r([
+o([
   s({ attribute: "copyright-holder" })
 ], a.prototype, "copyrightHolder", 2);
-r([
+o([
   s({ attribute: "custom-focal-point", type: Boolean })
 ], a.prototype, "customFocalPoint", 2);
-r([
+o([
   s()
 ], a.prototype, "decoding", 2);
-r([
+o([
   s({ attribute: "focal-point-debug", type: Boolean })
 ], a.prototype, "focalPointDebug", 2);
-r([
+o([
   s({ attribute: "focal-point-x", type: Number })
 ], a.prototype, "focalPointX", 2);
-r([
+o([
   s({ attribute: "focal-point-y", type: Number })
 ], a.prototype, "focalPointY", 2);
-r([
+o([
   s({ attribute: "image-src" })
 ], a.prototype, "imageSrc", 2);
-r([
+o([
   s()
 ], a.prototype, "importance", 2);
-r([
+o([
   s()
 ], a.prototype, "loading", 2);
-r([
+o([
   s({ attribute: "performance-mark" })
 ], a.prototype, "performanceMark", 2);
-r([
+o([
   s({ attribute: "picture-sizes-config" })
 ], a.prototype, "pictureSizesConfig", 2);
-r([
+o([
   s({ attribute: "border-radius", reflect: !0 })
 ], a.prototype, "borderRadius", 2);
-r([
+o([
   s({ attribute: "aspect-ratio", reflect: !0 })
 ], a.prototype, "aspectRatio", 2);
-r([
-  _(U)
+o([
+  k(j)
 ], a.prototype, "_imageLoaded", 1);
-a = r([
-  $("sbb-image")
+a = o([
+  v("sbb-image")
 ], a);
 export {
   a as SbbImageElement

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sbb-esta/lyne-elements",
-  "version": "0.52.0",
+  "version": "0.52.2",
   "description": "Lyne Design System",
   "keywords": [
     "design system",

package/stepper/stepper/stepper.d.ts

@@ -13,8 +13,8 @@ export declare class SbbStepperElement extends LitElement {
     /** If set to true, only the current and previous labels can be clicked and selected. */
     linear: boolean;
     /** Overrides the behaviour of `orientation` property. */
-    get horizontalFrom(): SbbHorizontalFrom | undefined;
     set horizontalFrom(value: SbbHorizontalFrom);
+    get horizontalFrom(): SbbHorizontalFrom | undefined;
     private _horizontalFrom?;
     /** Steps orientation, either horizontal or vertical. */
     orientation: SbbOrientation;

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;AAClF,OAAO,KAAK,EAAE,cAAc,EAA+B,MAAM,YAAY,CAAC;AAM9E;;;;;GAKG;AACH,qBACa,iBAAkB,SAAQ,UAAU;IAC/C,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,wFAAwF;IACpD,MAAM,UAAS;IAEnD,yDAAyD;IACzD,IACW,cAAc,IAAI,iBAAiB,GAAG,SAAS,CAEzD;IACD,IAAW,cAAc,CAAC,KAAK,EAAE,iBAAiB,EAKjD;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;AAClF,OAAO,KAAK,EAAE,cAAc,EAA+B,MAAM,YAAY,CAAC;AAM9E;;;;;GAKG;AACH,qBACa,iBAAkB,SAAQ,UAAU;IAC/C,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"}

package/stepper/stepper.js

@@ -14,12 +14,12 @@ let o = class extends p {
   constructor() {
     super(...arguments), this.linear = !1, this.orientation = "horizontal", this._loaded = !1, this._abort = new _(this), this._resizeObserverTimeout = null;
   }
-  get horizontalFrom() {
-    return this._horizontalFrom;
-  }
   set horizontalFrom(e) {
     this._horizontalFrom = v.includes(e) ? e : void 0, this._horizontalFrom && this._loaded && this._checkOrientation();
   }
+  get horizontalFrom() {
+    return this._horizontalFrom;
+  }
   set selected(e) {
     this._loaded && this._select(e);
   }

package/toggle-check.js

@@ -1,25 +1,25 @@
-import { css as g, LitElement as h, html as n } from "lit";
+import { css as g, LitElement as n, html as h } from "lit";
 import { property as i, customElement as d } from "lit/decorators.js";
 import { SbbSlotStateController as k } from "./core/controllers.js";
 import { SbbFormAssociatedCheckboxMixin as v } from "./core/mixins.js";
 import { SbbIconNameMixin as f } from "./icon.js";
-const p = g`@charset "UTF-8";*,:before,:after{box-sizing:border-box}:host{display:inline-block;outline:none!important;--sbb-toggle-check-checked-color: var(--sbb-color-red);--sbb-toggle-check-background-color: var(--sbb-color-cloud);--sbb-toggle-check-icon-color: var(--sbb-toggle-check-checked-color);--sbb-toggle-check-icon-opacity: 0;--sbb-toggle-check-circle-background-color: var(--sbb-color-white);--sbb-toggle-check-circle-border-color: var(--sbb-color-smoke);--sbb-toggle-check-circle-border-style: solid;--sbb-toggle-check-circle-diameter: 1.75rem;--sbb-toggle-check-overall-height: var(--sbb-toggle-check-circle-diameter);--sbb-toggle-check-circle-transform: translate(0, -50%);--sbb-toggle-check-height: 1.5rem;--sbb-toggle-check-width: calc(2 * var(--sbb-toggle-check-height));--sbb-toggle-check-cursor: pointer;--sbb-toggle-check-flex-direction: row-reverse;--sbb-toggle-check-gap: var(--sbb-spacing-fixed-3x);--sbb-toggle-check-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-6x) )}@media (forced-colors: active){:host{--sbb-toggle-check-background-color: CanvasText;--sbb-toggle-check-circle-background-color: Canvas}}:host([size=m]){--sbb-toggle-check-overall-height: calc(1em * var(--sbb-typo-line-height-body-text))}:host([data-checked]){--sbb-toggle-check-background-color: var(--sbb-toggle-check-checked-color);--sbb-toggle-check-circle-border-color: var(--sbb-toggle-check-background-color);--sbb-toggle-check-icon-opacity: 1;--sbb-toggle-check-circle-transform: translate( calc(100% - 2 * (100% - .5 * var(--sbb-toggle-check-width))), -50% )}@media (forced-colors: active){:host([data-checked]){--sbb-toggle-check-icon-color: Highlight;--sbb-toggle-check-background-color: Highlight}}:host(:disabled){--sbb-toggle-check-background-color: var(--sbb-color-cloud);--sbb-toggle-check-circle-border-color: var(--sbb-color-smoke);--sbb-toggle-check-circle-border-style: dashed;--sbb-toggle-check-circle-background-color: var(--sbb-color-milk);--sbb-toggle-check-icon-color: var(--sbb-color-granite);--sbb-toggle-check-cursor: default}@media (forced-colors: active){:host(:disabled){--sbb-toggle-check-icon-color: GrayText;--sbb-toggle-check-background-color: GrayText;--sbb-toggle-check-circle-border-style: solid}}:host([data-checked]:disabled){--sbb-toggle-check-circle-background-color: var(--sbb-color-white)}:host([label-position=before]){--sbb-toggle-check-flex-direction: row}.sbb-toggle-check{position:relative;display:flex;color:var(--sbb-color-charcoal);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;cursor:var(--sbb-toggle-check-cursor)}.sbb-toggle-check:before{content:"​";-webkit-user-select:none;user-select:none;width:0;height:0}:host(:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-toggle-check{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width);border-radius:calc(var(--sbb-border-radius-4x) - var(--sbb-focus-outline-offset))}.sbb-toggle-check__container{--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);display:flex;flex-direction:var(--sbb-toggle-check-flex-direction);gap:var(--sbb-toggle-check-gap);align-items:start;width:100%}:host([size=m]) .sbb-toggle-check__container{--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)}.sbb-toggle-check__label{flex-grow:1;padding-block-start:calc((var(--sbb-toggle-check-circle-diameter) - var(--sbb-typo-line-height-body-text) * 1em) / 2)}:host(:not([data-slot-names~=unnamed])) .sbb-toggle-check__label{display:none}.sbb-toggle-check__track{display:inline-block;position:relative;min-width:var(--sbb-toggle-check-width);height:var(--sbb-toggle-check-height);border-radius:var(--sbb-border-radius-infinity);background-color:var(--sbb-toggle-check-background-color);margin-block:calc((var(--sbb-toggle-check-overall-height) - var(--sbb-toggle-check-height)) / 2)}.sbb-toggle-check__circle{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);position:absolute;top:50%;transform:translateY(-50%);width:var(--sbb-toggle-check-circle-diameter);height:var(--sbb-toggle-check-circle-diameter);border:var(--sbb-border-width-1x) var(--sbb-toggle-check-circle-border-style) var(--sbb-toggle-check-circle-border-color);border-radius:50%;background-color:var(--sbb-toggle-check-circle-background-color);color:var(--sbb-toggle-check-icon-color);will-change:transform;transform:var(--sbb-toggle-check-circle-transform);transition:transform ease var(--sbb-toggle-check-animation-duration)}.sbb-toggle-check__icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:var(--sbb-size-icon-ui-small);height:var(--sbb-size-icon-ui-small);opacity:var(--sbb-toggle-check-icon-opacity);transition:opacity ease var(--sbb-toggle-check-animation-duration)}`;
-var u = Object.defineProperty, m = Object.getOwnPropertyDescriptor, s = (c, t, b, r) => {
-  for (var e = r > 1 ? void 0 : r ? m(t, b) : t, l = c.length - 1, a; l >= 0; l--)
-    (a = c[l]) && (e = (r ? a(t, b, e) : a(e)) || e);
-  return r && e && u(t, b, e), e;
+const p = g`@charset "UTF-8";*,:before,:after{box-sizing:border-box}:host{display:inline-block;outline:none!important;--sbb-toggle-check-checked-color: var(--sbb-color-red);--sbb-toggle-check-background-color: var(--sbb-color-cloud);--sbb-toggle-check-icon-color: var(--sbb-toggle-check-checked-color);--sbb-toggle-check-icon-opacity: 0;--sbb-toggle-check-circle-background-color: var(--sbb-color-white);--sbb-toggle-check-circle-border-color: var(--sbb-color-smoke);--sbb-toggle-check-circle-border-style: solid;--sbb-toggle-check-circle-diameter: 1.75rem;--sbb-toggle-check-overall-height: var(--sbb-toggle-check-circle-diameter);--sbb-toggle-check-circle-transform: translate(0, -50%);--sbb-toggle-check-height: 1.5rem;--sbb-toggle-check-width: calc(2 * var(--sbb-toggle-check-height));--sbb-toggle-check-cursor: pointer;--sbb-toggle-check-flex-direction: row-reverse;--sbb-toggle-check-gap: var(--sbb-spacing-fixed-3x);--sbb-toggle-check-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-6x) )}@media (forced-colors: active){:host{--sbb-toggle-check-background-color: CanvasText;--sbb-toggle-check-circle-background-color: Canvas}}:host([size=m]){--sbb-toggle-check-overall-height: calc(1em * var(--sbb-typo-line-height-body-text))}:host([data-checked]){--sbb-toggle-check-background-color: var(--sbb-toggle-check-checked-color);--sbb-toggle-check-circle-border-color: var(--sbb-toggle-check-background-color);--sbb-toggle-check-icon-opacity: 1;--sbb-toggle-check-circle-transform: translate( calc(100% - 2 * (100% - .5 * var(--sbb-toggle-check-width))), -50% )}@media (forced-colors: active){:host([data-checked]){--sbb-toggle-check-icon-color: Highlight;--sbb-toggle-check-background-color: Highlight}}:host(:disabled){--sbb-toggle-check-background-color: var(--sbb-color-cloud);--sbb-toggle-check-circle-border-color: var(--sbb-color-smoke);--sbb-toggle-check-circle-border-style: dashed;--sbb-toggle-check-circle-background-color: var(--sbb-color-milk);--sbb-toggle-check-icon-color: var(--sbb-color-granite);--sbb-toggle-check-cursor: default}@media (forced-colors: active){:host(:disabled){--sbb-toggle-check-icon-color: GrayText;--sbb-toggle-check-background-color: GrayText;--sbb-toggle-check-circle-border-style: solid}}:host([data-checked]:disabled){--sbb-toggle-check-circle-background-color: var(--sbb-color-white)}:host([label-position=before]){--sbb-toggle-check-flex-direction: row}.sbb-toggle-check{position:relative;display:flex;color:var(--sbb-color-charcoal);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;cursor:var(--sbb-toggle-check-cursor)}.sbb-toggle-check:before{content:"​";-webkit-user-select:none;user-select:none;width:0;height:0}:host(:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-toggle-check{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width);border-radius:calc(var(--sbb-border-radius-4x) - var(--sbb-focus-outline-offset))}.sbb-toggle-check__container{--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);display:flex;flex-direction:var(--sbb-toggle-check-flex-direction);gap:var(--sbb-toggle-check-gap);align-items:start;width:100%}:host([size=m]) .sbb-toggle-check__container{--sbb-text-font-size: var(--sbb-font-size-text-m);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size)}:host([size=xs]) .sbb-toggle-check__container{--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size)}.sbb-toggle-check__label{flex-grow:1;padding-block-start:calc((var(--sbb-toggle-check-circle-diameter) - var(--sbb-typo-line-height-body-text) * 1em) / 2)}:host(:not([data-slot-names~=unnamed])) .sbb-toggle-check__label{display:none}.sbb-toggle-check__track{display:inline-block;position:relative;min-width:var(--sbb-toggle-check-width);height:var(--sbb-toggle-check-height);border-radius:var(--sbb-border-radius-infinity);background-color:var(--sbb-toggle-check-background-color);margin-block:calc((var(--sbb-toggle-check-overall-height) - var(--sbb-toggle-check-height)) / 2)}.sbb-toggle-check__circle{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);position:absolute;top:50%;transform:translateY(-50%);width:var(--sbb-toggle-check-circle-diameter);height:var(--sbb-toggle-check-circle-diameter);border:var(--sbb-border-width-1x) var(--sbb-toggle-check-circle-border-style) var(--sbb-toggle-check-circle-border-color);border-radius:50%;background-color:var(--sbb-toggle-check-circle-background-color);color:var(--sbb-toggle-check-icon-color);will-change:transform;transform:var(--sbb-toggle-check-circle-transform);transition:transform ease var(--sbb-toggle-check-animation-duration)}.sbb-toggle-check__icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:var(--sbb-size-icon-ui-small);height:var(--sbb-size-icon-ui-small);opacity:var(--sbb-toggle-check-icon-opacity);transition:opacity ease var(--sbb-toggle-check-animation-duration)}`;
+var u = Object.defineProperty, m = Object.getOwnPropertyDescriptor, b = (t, c, r, s) => {
+  for (var e = s > 1 ? void 0 : s ? m(c, r) : c, l = t.length - 1, a; l >= 0; l--)
+    (a = t[l]) && (e = (s ? a(c, r, e) : a(e)) || e);
+  return s && e && u(c, r, e), e;
 };
 let o = class extends v(
-  f(h)
+  f(n)
 ) {
   constructor() {
     super(), this.size = "s", this.iconName = "tick-small", this.labelPosition = "after", new k(this);
   }
-  async willUpdate(c) {
-    super.willUpdate(c), c.has("checked") && (this.internals.ariaChecked = `${this.checked}`, this.toggleAttribute("data-checked", this.checked));
+  async willUpdate(t) {
+    super.willUpdate(t), t.has("checked") && (this.internals.ariaChecked = `${this.checked}`, this.toggleAttribute("data-checked", this.checked));
   }
   render() {
-    return n`
+    return h`
       <span class="sbb-toggle-check">
         <span class="sbb-toggle-check__container">
           <span class="sbb-toggle-check__label">
@@ -39,16 +39,16 @@ o.styles = p;
 o.events = {
   didChange: "didChange"
 };
-s([
+b([
   i({ reflect: !0 })
 ], o.prototype, "size", 2);
-s([
+b([
   i({ attribute: "icon-name" })
 ], o.prototype, "iconName", 2);
-s([
+b([
   i({ attribute: "label-position", reflect: !0 })
 ], o.prototype, "labelPosition", 2);
-o = s([
+o = b([
   d("sbb-toggle-check")
 ], o);
 export {

package/train/train-formation.js

@@ -48,8 +48,7 @@ let n = class extends k(d) {
             wagonCount: 1,
             blockedPassageCount: 0
           });
-        } else
-          a.localName === "sbb-train-blocked-passage" && o.blockedPassageCount++;
+        } else a.localName === "sbb-train-blocked-passage" && o.blockedPassageCount++;
         return i;
       },
       [{ wagonCount: 0, blockedPassageCount: 0 }]