@sbb-esta/lyne-elements 4.3.1 → 4.5.0

package/image/image.component.js

@@ -1,14 +1,14 @@
-var be = (o) => {
+var fe = (o) => {
   throw TypeError(o);
 };
-var _e = (o, r, l) => r.has(o) || be("Cannot " + l);
-var d = (o, r, l) => (_e(o, r, "read from private field"), l ? l.call(o) : r.get(o)), h = (o, r, l) => r.has(o) ? be("Cannot add the same private member more than once") : r instanceof WeakSet ? r.add(o) : r.set(o, l), s = (o, r, l, m) => (_e(o, r, "write to private field"), m ? m.call(o, l) : r.set(o, l), l);
+var _e = (o, r, l) => r.has(o) || fe("Cannot " + l);
+var d = (o, r, l) => (_e(o, r, "read from private field"), l ? l.call(o) : r.get(o)), h = (o, r, l) => r.has(o) ? fe("Cannot add the same private member more than once") : r instanceof WeakSet ? r.add(o) : r.set(o, l), s = (o, r, l, m) => (_e(o, r, "write to private field"), m ? m.call(o, l) : r.set(o, l), l);
 import { __esDecorate as p, __runInitializers as a } from "tslib";
 import { f as Pe, d as ye, a as Se, S as ze, c as ve, b as xe, g as $e, e as we } from "../sbb-tokens-HiNSQasB.js";
-import { css as Me, LitElement as Ie, nothing as C, html as q } from "lit";
-import { customElement as Le, property as g, eventOptions as Ce } from "lit/decorators.js";
+import { css as Me, LitElement as Ie, nothing as F, html as q } from "lit";
+import { customElement as Le, property as g, eventOptions as Fe } from "lit/decorators.js";
 import { forceType as u } from "../core/decorators.js";
-import { SbbElementInternalsMixin as Fe } from "../core/mixins.js";
+import { SbbElementInternalsMixin as Ce } from "../core/mixins.js";
 import { boxSizingStyles as De } from "../core/styles.js";
 const Ee = Me`:host{--sbb-image-aspect-ratio: 16 / 9;--sbb-image-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-image-object-fit: cover;display:block;border-radius:var(--sbb-border-radius-4x)}.sbb-image__img{opacity:.000001}:host(:is(:state(loaded),[state--loaded])) .sbb-image__img{opacity:.999999}:host(:not([skip-lqip])) .sbb-image__img{position:absolute;inset:0}:host(:is(:state(loaded),[state--loaded])) .sbb-image__blurred{opacity:0}picture{display:contents}:is(.sbb-image__img,.sbb-image__blurred){width:100%;height:100%;object-fit:var(--sbb-image-object-fit);object-position:var(--sbb-image-object-position);transition:opacity var(--sbb-image-animation-duration) var(--sbb-animation-easing)}.sbb-image__wrapper{display:flex;position:relative;width:100%;height:100%;aspect-ratio:var(--sbb-image-aspect-ratio);border-radius:inherit;overflow:hidden}`, qe = (o) => {
   if (!o || o.length === 0)
@@ -24,17 +24,16 @@ const Ee = Me`:host{--sbb-image-aspect-ratio: 16 / 9;--sbb-image-animation-durat
   if (!Array.isArray(r.breakpoints))
     return [];
   let l = !1, m = !1;
-  const F = ["image", "mediaQueries"];
+  const C = ["image", "mediaQueries"];
   return r.breakpoints.forEach((E) => {
     const D = Object.keys(E);
-    D.forEach((b) => {
-      F.includes(b) || (l = !0);
-    }), F.forEach((b) => {
-      D.includes(b) || (m = !0);
+    D.forEach((f) => {
+      C.includes(f) || (l = !0);
+    }), C.forEach((f) => {
+      D.includes(f) || (m = !0);
     });
   }), l || m ? [] : r.breakpoints;
 }, Qe = {
-  once: !0,
   passive: !0
 }, Oe = {
   "sbb-breakpoint-zero-min": we,
@@ -48,8 +47,8 @@ const Ee = Me`:host{--sbb-image-aspect-ratio: 16 / 9;--sbb-image-animation-durat
 };
 let Ke = (() => {
   var _, k, P, y, S, z, v, x, $, w, M, I, n;
-  let o = [Le("sbb-image")], r, l = [], m, F = Fe(Ie), E = [], D, b = [], Q = [], O, B = [], X = [], Y, j = [], U = [], T, V = [], A = [], R, K = [], N = [], H, W = [], Z = [], G, J = [], ee = [], te, ie = [], ae = [], se, re = [], oe = [], ne, ce = [], le = [], pe, me = [], de = [], he, ge = [], ue = [], fe;
-  return n = class extends F {
+  let o = [Le("sbb-image")], r, l = [], m, C = Ce(Ie), E = [], D, f = [], Q = [], O, B = [], X = [], Y, j = [], T = [], U, V = [], A = [], R, K = [], N = [], H, W = [], Z = [], G, J = [], ee = [], te, ie = [], ae = [], se, re = [], oe = [], ne, ce = [], le = [], pe, me = [], de = [], he, ge = [], ue = [], be;
+  return n = class extends C {
     constructor() {
       super(...arguments);
       h(this, _);
@@ -67,7 +66,7 @@ let Ke = (() => {
       this._captionElement = a(this, E), this._config = {
         nonRetinaQuality: "45",
         retinaQuality: "20"
-      }, s(this, _, a(this, b, "")), s(this, k, (a(this, Q), a(this, B, !1))), s(this, P, (a(this, X), a(this, j, !1))), s(this, y, (a(this, U), a(this, V, "auto"))), s(this, S, (a(this, A), a(this, K, !1))), s(this, z, (a(this, N), a(this, W, 1))), s(this, v, (a(this, Z), a(this, J, 1))), s(this, x, (a(this, ee), a(this, ie, ""))), s(this, $, (a(this, ae), a(this, re, "high"))), s(this, w, (a(this, oe), a(this, ce, "eager"))), s(this, M, (a(this, le), a(this, me, ""))), s(this, I, (a(this, de), a(this, ge, ""))), a(this, ue);
+      }, s(this, _, a(this, f, "")), s(this, k, (a(this, Q), a(this, B, !1))), s(this, P, (a(this, X), a(this, j, !1))), s(this, y, (a(this, T), a(this, V, "auto"))), s(this, S, (a(this, A), a(this, K, !1))), s(this, z, (a(this, N), a(this, W, 1))), s(this, v, (a(this, Z), a(this, J, 1))), s(this, x, (a(this, ee), a(this, ie, ""))), s(this, $, (a(this, ae), a(this, re, "high"))), s(this, w, (a(this, oe), a(this, ce, "eager"))), s(this, M, (a(this, le), a(this, me, ""))), s(this, I, (a(this, de), a(this, ge, ""))), a(this, ue);
     }
     /**
      * An alt text is not always necessary (e.g. in teaser cards when
@@ -294,11 +293,6 @@ let Ke = (() => {
     updated(t) {
       super.updated(t), this._captionElement && (this._linksInCaption = this._captionElement.querySelectorAll("a"), this._linksInCaption && this._addFocusAbilityToLinksInCaption());
     }
-    firstUpdated(t) {
-      super.firstUpdated(t), this.updateComplete.then(() => {
-        this.complete && this.internals.states.add("loaded");
-      });
-    }
     _logPerformanceMarks() {
       this.performanceMark && (performance.clearMarks(this.performanceMark), performance.mark(this.performanceMark));
     }
@@ -374,8 +368,8 @@ let Ke = (() => {
         const c = i.conditionFeature;
         let L;
         i.conditionFeatureValue.lyneDesignToken ? L = Oe[i.conditionFeatureValue.value] ?? "" : L = i.conditionFeatureValue.value;
-        const f = i.conditionOperator ? ` ${i.conditionOperator} ` : "";
-        e += `(${c}: ${L})${f}`;
+        const b = i.conditionOperator ? ` ${i.conditionOperator} ` : "";
+        e += `(${c}: ${L})${b}`;
       }), e;
     }
     _imageLoaded() {
@@ -387,25 +381,25 @@ let Ke = (() => {
       const i = this._preparePictureSizeConfigs();
       return q`
       <div class="sbb-image__wrapper">
-        ${this.skipLqip ? C : q`<img
+        ${this.skipLqip ? F : q`<img
               alt=""
               class="sbb-image__blurred"
               src=${t}
               width="1000"
               height="562"
-              loading=${this.loading ?? C}
-              decoding=${this.decoding ?? C}
+              loading=${this.loading ?? F}
+              decoding=${this.decoding ?? F}
             />`}
 
         <picture>
           <!-- render picture element sources -->
           ${i.map((c) => {
-        const L = c.image.height, f = c.image.width, ke = this._createMediaQueryString(c.mediaQueries);
+        const L = c.image.height, b = c.image.width, ke = this._createMediaQueryString(c.mediaQueries);
         return q`
               <source
                 media=${`${ke}`}
-                sizes=${`${f}px`}
-                srcset=${`${e}&w=${f}&h=${L}&q=${this._config.nonRetinaQuality} ${f}w, ${e}&w=${f * 2}&h=${L * 2}&q=${this._config.retinaQuality} ${f * 2}w`}
+                sizes=${`${b}px`}
+                srcset=${`${e}&w=${b}&h=${L}&q=${this._config.nonRetinaQuality} ${b}w, ${e}&w=${b * 2}&h=${L * 2}&q=${this._config.retinaQuality} ${b * 2}w`}
               ></source>`;
       })}
           <img
@@ -416,23 +410,23 @@ let Ke = (() => {
             src=${this.imageSrc}
             width="1000"
             height="562"
-            loading=${this.loading ?? C}
-            decoding=${this.decoding ?? C}
-            .fetchPriority=${this.importance ?? C}
+            loading=${this.loading ?? F}
+            decoding=${this.decoding ?? F}
+            .fetchPriority=${this.importance ?? F}
           />
         </picture>
       </div>
     `;
     }
   }, _ = new WeakMap(), k = new WeakMap(), P = new WeakMap(), y = new WeakMap(), S = new WeakMap(), z = new WeakMap(), v = new WeakMap(), x = new WeakMap(), $ = new WeakMap(), w = new WeakMap(), M = new WeakMap(), I = new WeakMap(), m = n, (() => {
-    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(F[Symbol.metadata] ?? null) : void 0;
-    D = [u(), g()], O = [u(), g({ attribute: "skip-lqip", type: Boolean, reflect: !0 })], Y = [u(), g({ attribute: "custom-focal-point", type: Boolean })], T = [g()], R = [u(), g({ attribute: "focal-point-debug", type: Boolean })], H = [u(), g({ attribute: "focal-point-x", type: Number })], G = [u(), g({ attribute: "focal-point-y", type: Number })], te = [u(), g({ attribute: "image-src" })], se = [g()], ne = [g()], pe = [u(), g({ attribute: "performance-mark" })], he = [u(), g({ attribute: "picture-sizes-config" })], fe = [Ce(Qe)], p(n, null, D, { kind: "accessor", name: "alt", static: !1, private: !1, access: { has: (e) => "alt" in e, get: (e) => e.alt, set: (e, i) => {
+    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(C[Symbol.metadata] ?? null) : void 0;
+    D = [u(), g()], O = [u(), g({ attribute: "skip-lqip", type: Boolean, reflect: !0 })], Y = [u(), g({ attribute: "custom-focal-point", type: Boolean })], U = [g()], R = [u(), g({ attribute: "focal-point-debug", type: Boolean })], H = [u(), g({ attribute: "focal-point-x", type: Number })], G = [u(), g({ attribute: "focal-point-y", type: Number })], te = [u(), g({ attribute: "image-src" })], se = [g()], ne = [g()], pe = [u(), g({ attribute: "performance-mark" })], he = [u(), g({ attribute: "picture-sizes-config" })], be = [Fe(Qe)], p(n, null, D, { kind: "accessor", name: "alt", static: !1, private: !1, access: { has: (e) => "alt" in e, get: (e) => e.alt, set: (e, i) => {
       e.alt = i;
-    } }, metadata: t }, b, Q), p(n, null, O, { kind: "accessor", name: "skipLqip", static: !1, private: !1, access: { has: (e) => "skipLqip" in e, get: (e) => e.skipLqip, set: (e, i) => {
+    } }, metadata: t }, f, Q), p(n, null, O, { kind: "accessor", name: "skipLqip", static: !1, private: !1, access: { has: (e) => "skipLqip" in e, get: (e) => e.skipLqip, set: (e, i) => {
       e.skipLqip = i;
     } }, metadata: t }, B, X), p(n, null, Y, { kind: "accessor", name: "customFocalPoint", static: !1, private: !1, access: { has: (e) => "customFocalPoint" in e, get: (e) => e.customFocalPoint, set: (e, i) => {
       e.customFocalPoint = i;
-    } }, metadata: t }, j, U), p(n, null, T, { kind: "accessor", name: "decoding", static: !1, private: !1, access: { has: (e) => "decoding" in e, get: (e) => e.decoding, set: (e, i) => {
+    } }, metadata: t }, j, T), p(n, null, U, { kind: "accessor", name: "decoding", static: !1, private: !1, access: { has: (e) => "decoding" in e, get: (e) => e.decoding, set: (e, i) => {
       e.decoding = i;
     } }, metadata: t }, V, A), p(n, null, R, { kind: "accessor", name: "focalPointDebug", static: !1, private: !1, access: { has: (e) => "focalPointDebug" in e, get: (e) => e.focalPointDebug, set: (e, i) => {
       e.focalPointDebug = i;
@@ -450,7 +444,7 @@ let Ke = (() => {
       e.performanceMark = i;
     } }, metadata: t }, me, de), p(n, null, he, { kind: "accessor", name: "pictureSizesConfig", static: !1, private: !1, access: { has: (e) => "pictureSizesConfig" in e, get: (e) => e.pictureSizesConfig, set: (e, i) => {
       e.pictureSizesConfig = i;
-    } }, metadata: t }, ge, ue), p(n, null, fe, { kind: "method", name: "_imageLoaded", static: !1, private: !1, access: { has: (e) => "_imageLoaded" in e, get: (e) => e._imageLoaded }, metadata: t }, null, E), p(null, r = { value: m }, o, { kind: "class", name: m.name, metadata: t }, null, l), m = r.value, t && Object.defineProperty(m, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
+    } }, metadata: t }, ge, ue), p(n, null, be, { kind: "method", name: "_imageLoaded", static: !1, private: !1, access: { has: (e) => "_imageLoaded" in e, get: (e) => e._imageLoaded }, metadata: t }, null, E), p(null, r = { value: m }, o, { kind: "class", name: m.name, metadata: t }, null, l), m = r.value, t && Object.defineProperty(m, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
   })(), n.styles = [De, Ee], n.events = {
     error: "error",
     load: "load"

package/index.d.ts

@@ -1,161 +1,160 @@
-import { SbbVisualCheckboxElement } from "./visual-checkbox/visual-checkbox.component.js";
-import { SbbTrainWagonElement } from "./train/train-wagon/train-wagon.component.js";
-import { SbbTrainFormationElement } from "./train/train-formation/train-formation.component.js";
-import { SbbTrainBlockedPassageElement } from "./train/train-blocked-passage/train-blocked-passage.component.js";
-import { SbbTrainElement } from "./train/train/train.component.js";
-import { SbbTooltipElement } from "./tooltip/tooltip.component.js";
-import { SbbToggleCheckElement } from "./toggle-check/toggle-check.component.js";
-import { SbbToggleOptionElement } from "./toggle/toggle-option/toggle-option.component.js";
-import { SbbToggleElement } from "./toggle/toggle/toggle.component.js";
-import { SbbToastElement } from "./toast/toast.component.js";
-import { SbbTitleElement } from "./title/title.component.js";
-import { SbbTimetableOccupancyIconElement } from "./timetable-occupancy-icon/timetable-occupancy-icon.component.js";
-import { SbbTimetableOccupancyElement } from "./timetable-occupancy/timetable-occupancy.component.js";
-import { SbbTimetableFormSwapButtonElement } from "./timetable-form/timetable-form-swap-button/timetable-form-swap-button.component.js";
-import { SbbTimetableFormFieldElement } from "./timetable-form/timetable-form-field/timetable-form-field.component.js";
-import { SbbTimetableFormDetailsElement } from "./timetable-form/timetable-form-details/timetable-form-details.component.js";
-import { SbbTimetableFormElement } from "./timetable-form/timetable-form/timetable-form.component.js";
-import { SbbTimeInputElement } from "./time-input/time-input.component.js";
-import { SbbTeaserProductStaticElement } from "./teaser-product/teaser-product-static/teaser-product-static.component.js";
-import { SbbTeaserProductElement } from "./teaser-product/teaser-product/teaser-product.component.js";
-import { SbbTeaserHeroElement } from "./teaser-hero/teaser-hero.component.js";
-import { SbbTeaserElement } from "./teaser/teaser.component.js";
-import { SbbTagGroupElement } from "./tag/tag-group/tag-group.component.js";
-import { SbbTagElement } from "./tag/tag/tag.component.js";
-import { SbbTabNavBarElement } from "./tabs/tab-nav-bar/tab-nav-bar.component.js";
-import { SbbTabLabelElement } from "./tabs/tab-label/tab-label.component.js";
-import { SbbTabGroupElement } from "./tabs/tab-group/tab-group.component.js";
-import { SbbTabElement } from "./tabs/tab/tab.component.js";
-import { SbbTableWrapperElement } from "./table/table-wrapper/table-wrapper.component.js";
-import { SbbStepperElement } from "./stepper/stepper/stepper.component.js";
-import { SbbStepLabelElement } from "./stepper/step-label/step-label.component.js";
-import { SbbStepElement } from "./stepper/step/step.component.js";
-import { SbbStatusElement } from "./status/status.component.js";
-import { SbbSliderElement } from "./slider/slider.component.js";
-import { SbbSkiplinkListElement } from "./skiplink-list/skiplink-list.component.js";
-import { SbbSignetElement } from "./signet/signet.component.js";
-import { SbbSidebarTitleElement } from "./sidebar/sidebar-title/sidebar-title.component.js";
-import { SbbSidebarContentElement } from "./sidebar/sidebar-content/sidebar-content.component.js";
-import { SbbSidebarContainerElement } from "./sidebar/sidebar-container/sidebar-container.component.js";
-import { SbbSidebarCloseButtonElement } from "./sidebar/sidebar-close-button/sidebar-close-button.component.js";
-import { SbbSidebarElement } from "./sidebar/sidebar/sidebar.component.js";
-import { SbbSelectionExpansionPanelElement } from "./selection-expansion-panel/selection-expansion-panel.component.js";
-import { SbbSelectionActionPanelElement } from "./selection-action-panel/selection-action-panel.component.js";
-import { SbbSelectElement } from "./select/select.component.js";
-import { SbbScreenReaderOnlyElement } from "./screen-reader-only/screen-reader-only.component.js";
-import { SbbRadioButtonPanelElement } from "./radio-button/radio-button-panel/radio-button-panel.component.js";
-import { SbbRadioButtonGroupElement } from "./radio-button/radio-button-group/radio-button-group.component.js";
-import { SbbRadioButtonElement } from "./radio-button/radio-button/radio-button.component.js";
-import { SbbPopoverElement } from "./popover/popover.component.js";
-import { SbbPaginatorElement } from "./paginator/paginator/paginator.component.js";
-import { SbbCompactPaginatorElement } from "./paginator/compact-paginator/compact-paginator.component.js";
-import { SbbOverlayElement } from "./overlay/overlay.component.js";
-import { SbbOptionHintElement } from "./option/option-hint/option-hint.component.js";
-import { SbbOptionElement } from "./option/option/option.component.js";
-import { SbbOptGroupElement } from "./option/optgroup/optgroup.component.js";
-import { SbbNotificationElement } from "./notification/notification.component.js";
-import { SbbNavigationSectionElement } from "./navigation/navigation-section/navigation-section.component.js";
-import { SbbNavigationMarkerElement } from "./navigation/navigation-marker/navigation-marker.component.js";
-import { SbbNavigationListElement } from "./navigation/navigation-list/navigation-list.component.js";
-import { SbbNavigationLinkElement } from "./navigation/navigation-link/navigation-link.component.js";
-import { SbbNavigationButtonElement } from "./navigation/navigation-button/navigation-button.component.js";
-import { SbbNavigationElement } from "./navigation/navigation/navigation.component.js";
-import { SbbMiniCalendarMonthElement } from "./mini-calendar/mini-calendar-month/mini-calendar-month.component.js";
-import { SbbMiniCalendarDayElement } from "./mini-calendar/mini-calendar-day/mini-calendar-day.component.js";
-import { SbbMiniCalendarElement } from "./mini-calendar/mini-calendar/mini-calendar.component.js";
-import { SbbMessageElement } from "./message/message.component.js";
-import { SbbMenuLinkElement } from "./menu/menu-link/menu-link.component.js";
-import { SbbMenuButtonElement } from "./menu/menu-button/menu-button.component.js";
-import { SbbMenuElement } from "./menu/menu/menu.component.js";
-import { SbbMapContainerElement } from "./map-container/map-container.component.js";
-import { SbbLogoElement } from "./logo/logo.component.js";
-import { SbbLoadingIndicatorCircleElement } from "./loading-indicator-circle/loading-indicator-circle.component.js";
-import { SbbLoadingIndicatorElement } from "./loading-indicator/loading-indicator.component.js";
-import { SbbLinkListAnchorElement } from "./link-list/link-list-anchor/link-list-anchor.component.js";
-import { SbbLinkListElement } from "./link-list/link-list/link-list.component.js";
-import { SbbLinkStaticElement } from "./link/link-static/link-static.component.js";
-import { SbbLinkButtonElement } from "./link/link-button/link-button.component.js";
-import { SbbLinkElement } from "./link/link/link.component.js";
-import { SbbBlockLinkStaticElement } from "./link/block-link-static/block-link-static.component.js";
-import { SbbBlockLinkButtonElement } from "./link/block-link-button/block-link-button.component.js";
-import { SbbBlockLinkElement } from "./link/block-link/block-link.component.js";
-import { SbbLeadContainerElement } from "./lead-container/lead-container.component.js";
-import { SbbJourneyHeaderElement } from "./journey-header/journey-header.component.js";
-import { SbbImageElement } from "./image/image.component.js";
-import { SbbIconSidebarLinkElement } from "./icon-sidebar/icon-sidebar-link/icon-sidebar-link.component.js";
-import { SbbIconSidebarContentElement } from "./icon-sidebar/icon-sidebar-content/icon-sidebar-content.component.js";
-import { SbbIconSidebarContainerElement } from "./icon-sidebar/icon-sidebar-container/icon-sidebar-container.component.js";
-import { SbbIconSidebarButtonElement } from "./icon-sidebar/icon-sidebar-button/icon-sidebar-button.component.js";
-import { SbbIconSidebarElement } from "./icon-sidebar/icon-sidebar/icon-sidebar.component.js";
-import { SbbIconElement } from "./icon/icon.component.js";
-import { SbbHeaderLinkElement } from "./header/header-link/header-link.component.js";
-import { SbbHeaderEnvironmentElement } from "./header/header-environment/header-environment.component.js";
-import { SbbHeaderButtonElement } from "./header/header-button/header-button.component.js";
-import { SbbHeaderElement } from "./header/header/header.component.js";
-import { SbbFormFieldClearElement } from "./form-field/form-field-clear/form-field-clear.component.js";
-import { SbbFormFieldElement } from "./form-field/form-field/form-field.component.js";
-import { SbbErrorElement } from "./form-field/error/error.component.js";
-import { SbbFooterElement } from "./footer/footer.component.js";
-import { SbbFlipCardSummaryElement } from "./flip-card/flip-card-summary/flip-card-summary.component.js";
-import { SbbFlipCardDetailsElement } from "./flip-card/flip-card-details/flip-card-details.component.js";
-import { SbbFlipCardElement } from "./flip-card/flip-card/flip-card.component.js";
-import { SbbFileSelectorDropzoneElement } from "./file-selector/file-selector-dropzone/file-selector-dropzone.component.js";
-import { SbbFileSelectorElement } from "./file-selector/file-selector/file-selector.component.js";
-import { SbbExpansionPanelHeaderElement } from "./expansion-panel/expansion-panel-header/expansion-panel-header.component.js";
-import { SbbExpansionPanelContentElement } from "./expansion-panel/expansion-panel-content/expansion-panel-content.component.js";
-import { SbbExpansionPanelElement } from "./expansion-panel/expansion-panel/expansion-panel.component.js";
-import { SbbDividerElement } from "./divider/divider.component.js";
-import { SbbDialogTitleElement } from "./dialog/dialog-title/dialog-title.component.js";
-import { SbbDialogContentElement } from "./dialog/dialog-content/dialog-content.component.js";
-import { SbbDialogCloseButtonElement } from "./dialog/dialog-close-button/dialog-close-button.component.js";
-import { SbbDialogActionsElement } from "./dialog/dialog-actions/dialog-actions.component.js";
-import { SbbDialogElement } from "./dialog/dialog/dialog.component.js";
-import { SbbDatepickerToggleElement } from "./datepicker/datepicker-toggle/datepicker-toggle.component.js";
-import { SbbDatepickerPreviousDayElement } from "./datepicker/datepicker-previous-day/datepicker-previous-day.component.js";
-import { SbbDatepickerNextDayElement } from "./datepicker/datepicker-next-day/datepicker-next-day.component.js";
-import { SbbDatepickerElement } from "./datepicker/datepicker/datepicker.component.js";
-import { SbbDateInputElement } from "./date-input/date-input.component.js";
-import {  } from "./core/decorators/host-attributes.js";
-import { SbbStickyBarElement } from "./container/sticky-bar/sticky-bar.component.js";
-import { SbbContainerElement } from "./container/container/container.component.js";
-import { SbbClockElement } from "./clock/clock.component.js";
-import { SbbChipLabelElement } from "./chip-label/chip-label.component.js";
-import { SbbChipGroupElement } from "./chip/chip-group/chip-group.component.js";
-import { SbbChipElement } from "./chip/chip/chip.component.js";
-import { SbbCheckboxPanelElement } from "./checkbox/checkbox-panel/checkbox-panel.component.js";
-import { SbbCheckboxGroupElement } from "./checkbox/checkbox-group/checkbox-group.component.js";
-import { SbbCheckboxElement } from "./checkbox/checkbox/checkbox.component.js";
-import { SbbCarouselListElement } from "./carousel/carousel-list/carousel-list.component.js";
-import { SbbCarouselItemElement } from "./carousel/carousel-item/carousel-item.component.js";
-import { SbbCarouselElement } from "./carousel/carousel/carousel.component.js";
-import { SbbCardLinkElement } from "./card/card-link/card-link.component.js";
-import { SbbCardButtonElement } from "./card/card-button/card-button.component.js";
-import { SbbCardBadgeElement } from "./card/card-badge/card-badge.component.js";
-import { SbbCardElement } from "./card/card/card.component.js";
-import { SbbCalendarElement } from "./calendar/calendar.component.js";
-import { SbbTransparentButtonStaticElement } from "./button/transparent-button-static/transparent-button-static.component.js";
-import { SbbTransparentButtonLinkElement } from "./button/transparent-button-link/transparent-button-link.component.js";
-import { SbbTransparentButtonElement } from "./button/transparent-button/transparent-button.component.js";
-import { SbbSecondaryButtonStaticElement } from "./button/secondary-button-static/secondary-button-static.component.js";
-import { SbbSecondaryButtonLinkElement } from "./button/secondary-button-link/secondary-button-link.component.js";
-import { SbbSecondaryButtonElement } from "./button/secondary-button/secondary-button.component.js";
-import { SbbMiniButtonLinkElement } from "./button/mini-button-link/mini-button-link.component.js";
-import { SbbMiniButtonGroupElement } from "./button/mini-button-group/mini-button-group.component.js";
-import { SbbMiniButtonElement } from "./button/mini-button/mini-button.component.js";
-import { SbbButtonStaticElement } from "./button/button-static/button-static.component.js";
-import { SbbButtonLinkElement } from "./button/button-link/button-link.component.js";
-import { SbbButtonElement } from "./button/button/button.component.js";
-import { SbbAccentButtonStaticElement } from "./button/accent-button-static/accent-button-static.component.js";
-import { SbbAccentButtonLinkElement } from "./button/accent-button-link/accent-button-link.component.js";
-import { SbbAccentButtonElement } from "./button/accent-button/accent-button.component.js";
-import { SbbBreadcrumbGroupElement } from "./breadcrumb/breadcrumb-group/breadcrumb-group.component.js";
-import { SbbBreadcrumbElement } from "./breadcrumb/breadcrumb/breadcrumb.component.js";
+import { SbbAccordionElement } from "./accordion/accordion.component.js";
+import { SbbActionGroupElement } from "./action-group/action-group.component.js";
 import { SbbAutocompleteElement } from "./autocomplete/autocomplete.component.js";
-import { SbbAlertGroupElement } from "./alert/alert-group/alert-group.component.js";
+import { SbbCalendarElement } from "./calendar/calendar.component.js";
+import { SbbChipLabelElement } from "./chip-label/chip-label.component.js";
+import { SbbClockElement } from "./clock/clock.component.js";
+import { SbbDateInputElement } from "./date-input/date-input.component.js";
+import { SbbDividerElement } from "./divider/divider.component.js";
+import { SbbFooterElement } from "./footer/footer.component.js";
+import { SbbIconElement } from "./icon/icon.component.js";
+import { SbbImageElement } from "./image/image.component.js";
+import { SbbJourneyHeaderElement } from "./journey-header/journey-header.component.js";
+import { SbbLeadContainerElement } from "./lead-container/lead-container.component.js";
+import { SbbLoadingIndicatorElement } from "./loading-indicator/loading-indicator.component.js";
+import { SbbLoadingIndicatorCircleElement } from "./loading-indicator-circle/loading-indicator-circle.component.js";
+import { SbbLogoElement } from "./logo/logo.component.js";
+import { SbbMapContainerElement } from "./map-container/map-container.component.js";
+import { SbbMessageElement } from "./message/message.component.js";
+import { SbbNotificationElement } from "./notification/notification.component.js";
+import { SbbOverlayElement } from "./overlay/overlay.component.js";
+import { SbbPopoverElement } from "./popover/popover.component.js";
+import { SbbScreenReaderOnlyElement } from "./screen-reader-only/screen-reader-only.component.js";
+import { SbbSelectElement } from "./select/select.component.js";
+import { SbbSelectionActionPanelElement } from "./selection-action-panel/selection-action-panel.component.js";
+import { SbbSelectionExpansionPanelElement } from "./selection-expansion-panel/selection-expansion-panel.component.js";
+import { SbbSignetElement } from "./signet/signet.component.js";
+import { SbbSkiplinkListElement } from "./skiplink-list/skiplink-list.component.js";
+import { SbbSliderElement } from "./slider/slider.component.js";
+import { SbbStatusElement } from "./status/status.component.js";
+import { SbbTeaserElement } from "./teaser/teaser.component.js";
+import { SbbTeaserHeroElement } from "./teaser-hero/teaser-hero.component.js";
+import { SbbTimeInputElement } from "./time-input/time-input.component.js";
+import { SbbTimetableOccupancyElement } from "./timetable-occupancy/timetable-occupancy.component.js";
+import { SbbTimetableOccupancyIconElement } from "./timetable-occupancy-icon/timetable-occupancy-icon.component.js";
+import { SbbTitleElement } from "./title/title.component.js";
+import { SbbToastElement } from "./toast/toast.component.js";
+import { SbbToggleCheckElement } from "./toggle-check/toggle-check.component.js";
+import { SbbTooltipElement } from "./tooltip/tooltip.component.js";
+import { SbbVisualCheckboxElement } from "./visual-checkbox/visual-checkbox.component.js";
 import { SbbAlertElement } from "./alert/alert/alert.component.js";
-import { SbbActionGroupElement } from "./action-group/action-group.component.js";
-import { SbbAccordionElement } from "./accordion/accordion.component.js";
-
+import { SbbAlertGroupElement } from "./alert/alert-group/alert-group.component.js";
+import { SbbBreadcrumbElement } from "./breadcrumb/breadcrumb/breadcrumb.component.js";
+import { SbbBreadcrumbGroupElement } from "./breadcrumb/breadcrumb-group/breadcrumb-group.component.js";
+import { SbbAccentButtonElement } from "./button/accent-button/accent-button.component.js";
+import { SbbAccentButtonLinkElement } from "./button/accent-button-link/accent-button-link.component.js";
+import { SbbAccentButtonStaticElement } from "./button/accent-button-static/accent-button-static.component.js";
+import { SbbButtonElement } from "./button/button/button.component.js";
+import { SbbButtonLinkElement } from "./button/button-link/button-link.component.js";
+import { SbbButtonStaticElement } from "./button/button-static/button-static.component.js";
+import { SbbMiniButtonElement } from "./button/mini-button/mini-button.component.js";
+import { SbbMiniButtonGroupElement } from "./button/mini-button-group/mini-button-group.component.js";
+import { SbbMiniButtonLinkElement } from "./button/mini-button-link/mini-button-link.component.js";
+import { SbbSecondaryButtonElement } from "./button/secondary-button/secondary-button.component.js";
+import { SbbSecondaryButtonLinkElement } from "./button/secondary-button-link/secondary-button-link.component.js";
+import { SbbSecondaryButtonStaticElement } from "./button/secondary-button-static/secondary-button-static.component.js";
+import { SbbTransparentButtonElement } from "./button/transparent-button/transparent-button.component.js";
+import { SbbTransparentButtonLinkElement } from "./button/transparent-button-link/transparent-button-link.component.js";
+import { SbbTransparentButtonStaticElement } from "./button/transparent-button-static/transparent-button-static.component.js";
+import { SbbCardElement } from "./card/card/card.component.js";
+import { SbbCardBadgeElement } from "./card/card-badge/card-badge.component.js";
+import { SbbCardButtonElement } from "./card/card-button/card-button.component.js";
+import { SbbCardLinkElement } from "./card/card-link/card-link.component.js";
+import { SbbCarouselElement } from "./carousel/carousel/carousel.component.js";
+import { SbbCarouselItemElement } from "./carousel/carousel-item/carousel-item.component.js";
+import { SbbCarouselListElement } from "./carousel/carousel-list/carousel-list.component.js";
+import { SbbCheckboxElement } from "./checkbox/checkbox/checkbox.component.js";
+import { SbbCheckboxGroupElement } from "./checkbox/checkbox-group/checkbox-group.component.js";
+import { SbbCheckboxPanelElement } from "./checkbox/checkbox-panel/checkbox-panel.component.js";
+import { SbbChipElement } from "./chip/chip/chip.component.js";
+import { SbbChipGroupElement } from "./chip/chip-group/chip-group.component.js";
+import { SbbContainerElement } from "./container/container/container.component.js";
+import { SbbStickyBarElement } from "./container/sticky-bar/sticky-bar.component.js";
+import {  } from "./core/decorators/host-attributes.js";
+import { SbbDatepickerElement } from "./datepicker/datepicker/datepicker.component.js";
+import { SbbDatepickerNextDayElement } from "./datepicker/datepicker-next-day/datepicker-next-day.component.js";
+import { SbbDatepickerPreviousDayElement } from "./datepicker/datepicker-previous-day/datepicker-previous-day.component.js";
+import { SbbDatepickerToggleElement } from "./datepicker/datepicker-toggle/datepicker-toggle.component.js";
+import { SbbDialogElement } from "./dialog/dialog/dialog.component.js";
+import { SbbDialogActionsElement } from "./dialog/dialog-actions/dialog-actions.component.js";
+import { SbbDialogCloseButtonElement } from "./dialog/dialog-close-button/dialog-close-button.component.js";
+import { SbbDialogContentElement } from "./dialog/dialog-content/dialog-content.component.js";
+import { SbbDialogTitleElement } from "./dialog/dialog-title/dialog-title.component.js";
+import { SbbExpansionPanelElement } from "./expansion-panel/expansion-panel/expansion-panel.component.js";
+import { SbbExpansionPanelContentElement } from "./expansion-panel/expansion-panel-content/expansion-panel-content.component.js";
+import { SbbExpansionPanelHeaderElement } from "./expansion-panel/expansion-panel-header/expansion-panel-header.component.js";
+import { SbbFileSelectorElement } from "./file-selector/file-selector/file-selector.component.js";
+import { SbbFileSelectorDropzoneElement } from "./file-selector/file-selector-dropzone/file-selector-dropzone.component.js";
+import { SbbFlipCardElement } from "./flip-card/flip-card/flip-card.component.js";
+import { SbbFlipCardDetailsElement } from "./flip-card/flip-card-details/flip-card-details.component.js";
+import { SbbFlipCardSummaryElement } from "./flip-card/flip-card-summary/flip-card-summary.component.js";
+import { SbbErrorElement } from "./form-field/error/error.component.js";
+import { SbbFormFieldElement } from "./form-field/form-field/form-field.component.js";
+import { SbbFormFieldClearElement } from "./form-field/form-field-clear/form-field-clear.component.js";
+import { SbbHeaderElement } from "./header/header/header.component.js";
+import { SbbHeaderButtonElement } from "./header/header-button/header-button.component.js";
+import { SbbHeaderEnvironmentElement } from "./header/header-environment/header-environment.component.js";
+import { SbbHeaderLinkElement } from "./header/header-link/header-link.component.js";
+import { SbbIconSidebarElement } from "./icon-sidebar/icon-sidebar/icon-sidebar.component.js";
+import { SbbIconSidebarButtonElement } from "./icon-sidebar/icon-sidebar-button/icon-sidebar-button.component.js";
+import { SbbIconSidebarContainerElement } from "./icon-sidebar/icon-sidebar-container/icon-sidebar-container.component.js";
+import { SbbIconSidebarContentElement } from "./icon-sidebar/icon-sidebar-content/icon-sidebar-content.component.js";
+import { SbbIconSidebarLinkElement } from "./icon-sidebar/icon-sidebar-link/icon-sidebar-link.component.js";
+import { SbbBlockLinkElement } from "./link/block-link/block-link.component.js";
+import { SbbBlockLinkButtonElement } from "./link/block-link-button/block-link-button.component.js";
+import { SbbBlockLinkStaticElement } from "./link/block-link-static/block-link-static.component.js";
+import { SbbLinkElement } from "./link/link/link.component.js";
+import { SbbLinkButtonElement } from "./link/link-button/link-button.component.js";
+import { SbbLinkStaticElement } from "./link/link-static/link-static.component.js";
+import { SbbLinkListElement } from "./link-list/link-list/link-list.component.js";
+import { SbbLinkListAnchorElement } from "./link-list/link-list-anchor/link-list-anchor.component.js";
+import { SbbMenuElement } from "./menu/menu/menu.component.js";
+import { SbbMenuButtonElement } from "./menu/menu-button/menu-button.component.js";
+import { SbbMenuLinkElement } from "./menu/menu-link/menu-link.component.js";
+import { SbbMiniCalendarElement } from "./mini-calendar/mini-calendar/mini-calendar.component.js";
+import { SbbMiniCalendarDayElement } from "./mini-calendar/mini-calendar-day/mini-calendar-day.component.js";
+import { SbbMiniCalendarMonthElement } from "./mini-calendar/mini-calendar-month/mini-calendar-month.component.js";
+import { SbbNavigationElement } from "./navigation/navigation/navigation.component.js";
+import { SbbNavigationButtonElement } from "./navigation/navigation-button/navigation-button.component.js";
+import { SbbNavigationLinkElement } from "./navigation/navigation-link/navigation-link.component.js";
+import { SbbNavigationListElement } from "./navigation/navigation-list/navigation-list.component.js";
+import { SbbNavigationMarkerElement } from "./navigation/navigation-marker/navigation-marker.component.js";
+import { SbbNavigationSectionElement } from "./navigation/navigation-section/navigation-section.component.js";
+import { SbbOptGroupElement } from "./option/optgroup/optgroup.component.js";
+import { SbbOptionElement } from "./option/option/option.component.js";
+import { SbbOptionHintElement } from "./option/option-hint/option-hint.component.js";
+import { SbbCompactPaginatorElement } from "./paginator/compact-paginator/compact-paginator.component.js";
+import { SbbPaginatorElement } from "./paginator/paginator/paginator.component.js";
+import { SbbRadioButtonElement } from "./radio-button/radio-button/radio-button.component.js";
+import { SbbRadioButtonGroupElement } from "./radio-button/radio-button-group/radio-button-group.component.js";
+import { SbbRadioButtonPanelElement } from "./radio-button/radio-button-panel/radio-button-panel.component.js";
+import { SbbSidebarElement } from "./sidebar/sidebar/sidebar.component.js";
+import { SbbSidebarCloseButtonElement } from "./sidebar/sidebar-close-button/sidebar-close-button.component.js";
+import { SbbSidebarContainerElement } from "./sidebar/sidebar-container/sidebar-container.component.js";
+import { SbbSidebarContentElement } from "./sidebar/sidebar-content/sidebar-content.component.js";
+import { SbbSidebarTitleElement } from "./sidebar/sidebar-title/sidebar-title.component.js";
+import { SbbStepElement } from "./stepper/step/step.component.js";
+import { SbbStepLabelElement } from "./stepper/step-label/step-label.component.js";
+import { SbbStepperElement } from "./stepper/stepper/stepper.component.js";
+import { SbbTableWrapperElement } from "./table/table-wrapper/table-wrapper.component.js";
+import { SbbTabElement } from "./tabs/tab/tab.component.js";
+import { SbbTabGroupElement } from "./tabs/tab-group/tab-group.component.js";
+import { SbbTabLabelElement } from "./tabs/tab-label/tab-label.component.js";
+import { SbbTabNavBarElement } from "./tabs/tab-nav-bar/tab-nav-bar.component.js";
+import { SbbTagElement } from "./tag/tag/tag.component.js";
+import { SbbTagGroupElement } from "./tag/tag-group/tag-group.component.js";
+import { SbbTeaserProductElement } from "./teaser-product/teaser-product/teaser-product.component.js";
+import { SbbTeaserProductStaticElement } from "./teaser-product/teaser-product-static/teaser-product-static.component.js";
+import { SbbTimetableFormElement } from "./timetable-form/timetable-form/timetable-form.component.js";
+import { SbbTimetableFormDetailsElement } from "./timetable-form/timetable-form-details/timetable-form-details.component.js";
+import { SbbTimetableFormFieldElement } from "./timetable-form/timetable-form-field/timetable-form-field.component.js";
+import { SbbTimetableFormSwapButtonElement } from "./timetable-form/timetable-form-swap-button/timetable-form-swap-button.component.js";
+import { SbbToggleElement } from "./toggle/toggle/toggle.component.js";
+import { SbbToggleOptionElement } from "./toggle/toggle-option/toggle-option.component.js";
+import { SbbTrainElement } from "./train/train/train.component.js";
+import { SbbTrainBlockedPassageElement } from "./train/train-blocked-passage/train-blocked-passage.component.js";
+import { SbbTrainFormationElement } from "./train/train-formation/train-formation.component.js";
+import { SbbTrainWagonElement } from "./train/train-wagon/train-wagon.component.js";
 declare global {
   var SbbAccentButtonElement: SbbAccentButtonElement;
   var SbbAccentButtonLinkElement: SbbAccentButtonLinkElement;