@sbb-esta/lyne-elements 1.6.0 → 1.8.0

package/header/header.js

@@ -4,7 +4,7 @@ import { SbbFocusVisibleWithinController as m } from "../core/a11y.js";
 import { findReferencedElement as p } from "../core/dom.js";
 import { SbbHydrationMixin as g } from "../core/mixins.js";
 import "../logo.js";
-const _ = h`*,:before,:after{box-sizing:border-box}:host{--sbb-logo-height: 1rem;--sbb-header-position: fixed;--sbb-header-transition-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-6x) );--sbb-header-inset-inline-end: 0;display:block;height:var(--sbb-header-height)}@media (min-width: 52.5rem){:host{--sbb-logo-height: 1.25rem}}:host([hide-on-scroll]){--sbb-header-position: absolute}:host([hide-on-scroll][data-fixed]){--sbb-header-position: fixed;--sbb-header-animation-name: hide;--sbb-header-transform: translate3d(0, -100%, 0);--sbb-header-inset-inline-end: var(--sbb-scrollbar-width, 0)}:host([hide-on-scroll][data-fixed][data-animated]){--sbb-header-transition-timing: cubic-bezier(.4, 0, 1, 1)}:host([hide-on-scroll][data-fixed][data-visible]){--sbb-header-animation-name: show;--sbb-header-transform: translate3d(0, 0, 0);--sbb-header-transition-timing: cubic-bezier(0, 0, .2, 1)}:host([hide-on-scroll][data-fixed][data-has-visible-focus-within]){--sbb-header-transition-duration: 0;--sbb-header-transform: translate3d(0, 0, 0)}.sbb-header{position:var(--sbb-header-position);inset:0 var(--sbb-header-inset-inline-end) auto 0;background:var(--sbb-color-white);z-index:var(--sbb-header-z-index, 10);transform:var(--sbb-header-transform);transition-property:box-shadow;transition-duration:var(--sbb-header-transition-duration);transition-timing-function:var(--sbb-header-transition-timing);animation-name:var(--sbb-header-animation-name);animation-duration:var(--sbb-header-transition-duration);animation-timing-function:var(--sbb-header-transition-timing)}:host(:is([data-shadow],[data-has-visible-focus-within][data-fixed])) .sbb-header{box-shadow:var(--sbb-shadow-elevation-level-9-shadow-2-offset-x) var(--sbb-shadow-elevation-level-9-shadow-2-offset-y) var(--sbb-shadow-elevation-level-9-shadow-2-blur) var(--sbb-shadow-elevation-level-9-shadow-2-spread) var(--sbb-shadow-elevation-level-9-soft-2-color),var(--sbb-shadow-elevation-level-9-shadow-1-offset-x) var(--sbb-shadow-elevation-level-9-shadow-1-offset-y) var(--sbb-shadow-elevation-level-9-shadow-1-blur) var(--sbb-shadow-elevation-level-9-shadow-1-spread) var(--sbb-shadow-elevation-level-9-soft-1-color)}@media (forced-colors: active){.sbb-header{border-block-end:var(--sbb-border-width-1x) solid CanvasText}}.sbb-header__wrapper{display:flex;align-items:center;justify-content:flex-start;height:var(--sbb-header-height)}:host(:not([expanded])) .sbb-header__wrapper{padding-inline:var(--sbb-layout-base-offset-responsive);margin-inline:auto;width:100%}@media (min-width: 90rem){:host(:not([expanded])) .sbb-header__wrapper{max-width:calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive))}}:host([expanded]) .sbb-header__wrapper{padding-inline:var(--sbb-spacing-responsive-xxs)}.sbb-header__logo{flex:0 0 auto;margin-inline-start:auto;padding-inline-start:var(--sbb-spacing-responsive-s)}::slotted(:is(sbb-header-button,sbb-header-link):first-child){margin-inline-start:var(--sbb-header-first-item-margin-inline-start)}::slotted(*){flex:0 0 auto}::slotted(.sbb-header-shrinkable){flex-shrink:1;min-width:0}::slotted(.sbb-header-spacer){flex-grow:1}::slotted(a[slot=logo]){display:block;padding-block:var(--sbb-spacing-fixed-3x);position:relative;outline:none!important}::slotted(a[slot=logo]):before{content:"";display:block;position:absolute;inset:var(--sbb-spacing-fixed-3x) 0}::slotted(a[slot=logo]:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])):before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width);outline-offset:var(--sbb-spacing-fixed-3x);border-radius:1px}@keyframes show{0%{transform:translate3d(0,-100%,0)}to{transform:translateZ(0)}}@keyframes hide{0%{transform:translateZ(0)}to{transform:translate3d(0,-100%,0)}}`;
+const _ = h`*,:before,:after{box-sizing:border-box}:host{display:block;height:var(--sbb-header-height);--sbb-logo-height: 1rem;--sbb-header-position: fixed;--sbb-header-transition-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-6x) );--sbb-header-inset-inline-end: 0}@media (min-width: 52.5rem){:host{--sbb-logo-height: 1.25rem}}:host([hide-on-scroll]){--sbb-header-position: absolute}:host([hide-on-scroll][data-fixed]){--sbb-header-position: fixed;--sbb-header-animation-name: hide;--sbb-header-transform: translate3d(0, -100%, 0);--sbb-header-inset-inline-end: var(--sbb-scrollbar-width, 0)}:host([hide-on-scroll][data-fixed][data-animated]){--sbb-header-transition-timing: cubic-bezier(.4, 0, 1, 1)}:host([hide-on-scroll][data-fixed][data-visible]){--sbb-header-animation-name: show;--sbb-header-transform: translate3d(0, 0, 0);--sbb-header-transition-timing: cubic-bezier(0, 0, .2, 1)}:host([hide-on-scroll][data-fixed][data-has-visible-focus-within]){--sbb-header-transition-duration: 0;--sbb-header-transform: translate3d(0, 0, 0)}.sbb-header{position:var(--sbb-header-position);inset:0 var(--sbb-header-inset-inline-end) auto 0;background:var(--sbb-color-white);z-index:var(--sbb-header-z-index, 10);transform:var(--sbb-header-transform);transition-property:box-shadow;transition-duration:var(--sbb-header-transition-duration);transition-timing-function:var(--sbb-header-transition-timing);animation-name:var(--sbb-header-animation-name);animation-duration:var(--sbb-header-transition-duration);animation-timing-function:var(--sbb-header-transition-timing)}:host(:is([data-shadow],[data-has-visible-focus-within][data-fixed])) .sbb-header{box-shadow:var(--sbb-shadow-elevation-level-9-shadow-2-offset-x) var(--sbb-shadow-elevation-level-9-shadow-2-offset-y) var(--sbb-shadow-elevation-level-9-shadow-2-blur) var(--sbb-shadow-elevation-level-9-shadow-2-spread) var(--sbb-shadow-elevation-level-9-soft-2-color),var(--sbb-shadow-elevation-level-9-shadow-1-offset-x) var(--sbb-shadow-elevation-level-9-shadow-1-offset-y) var(--sbb-shadow-elevation-level-9-shadow-1-blur) var(--sbb-shadow-elevation-level-9-shadow-1-spread) var(--sbb-shadow-elevation-level-9-soft-1-color)}@media (forced-colors: active){.sbb-header{border-block-end:var(--sbb-border-width-1x) solid CanvasText}}.sbb-header__wrapper{display:flex;align-items:center;justify-content:flex-start;height:var(--sbb-header-height)}:host(:not([expanded])) .sbb-header__wrapper{padding-inline:var(--sbb-layout-base-offset-responsive);margin-inline:auto;width:100%}@media (min-width: 90rem){:host(:not([expanded])) .sbb-header__wrapper{max-width:calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive))}}:host([expanded]) .sbb-header__wrapper{padding-inline:var(--sbb-spacing-responsive-xxs)}.sbb-header__logo{flex:0 0 auto;margin-inline-start:auto;padding-inline-start:var(--sbb-spacing-responsive-s)}::slotted(:is(sbb-header-button,sbb-header-link):first-child){margin-inline-start:var(--sbb-header-first-item-margin-inline-start)}::slotted(*){flex:0 0 auto}::slotted(.sbb-header-shrinkable){flex-shrink:1;min-width:0}::slotted(.sbb-header-spacer){flex-grow:1}::slotted(a[slot=logo]){display:block;padding-block:var(--sbb-spacing-fixed-3x);position:relative;outline:none!important}::slotted(a[slot=logo]):before{content:"";display:block;position:absolute;inset:var(--sbb-spacing-fixed-3x) 0}::slotted(a[slot=logo]:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])):before{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width);outline-offset:var(--sbb-spacing-fixed-3x);border-radius:1px}@keyframes show{0%{transform:translate3d(0,-100%,0)}to{transform:translateZ(0)}}@keyframes hide{0%{transform:translateZ(0)}to{transform:translate3d(0,-100%,0)}}`;
 var w = Object.defineProperty, x = Object.getOwnPropertyDescriptor, a = (e, t, s, r) => {
   for (var o = r > 1 ? void 0 : r ? x(t, s) : t, l = e.length - 1, n; l >= 0; l--)
     (n = e[l]) && (o = (r ? n(t, s, o) : n(o)) || o);

package/icon/icon-base.d.ts

@@ -1,5 +1,4 @@
 import { CSSResultGroup, PropertyValues, TemplateResult, LitElement } from 'lit';
-
 /**
  * @cssprop [--sbb-icon-svg-width=auto] - Can be used to set a custom width.
  * @cssprop [--sbb-icon-svg-height=auto] - Can be used to set a custom height.

package/icon/icon-name-mixin.d.ts

@@ -1,6 +1,5 @@
 import { LitElement, TemplateResult } from 'lit';
 import { AbstractConstructor } from '../core/mixins.js';
-
 export declare class SbbIconNameMixinType {
     iconName?: string;
     protected renderIconSlot(classname?: string): TemplateResult;

package/icon/icon.d.ts

@@ -1,6 +1,5 @@
 import { PropertyValues, TemplateResult } from 'lit';
 import { SbbIconBase } from './icon-base.js';
-
 /**
  * It displays an icon loaded from a registered namespace.
  */

package/image/image.d.ts

@@ -1,5 +1,4 @@
 import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
-
 export interface InterfaceImageAttributesSizesConfig {
     breakpoints: InterfaceImageAttributesSizesConfigBreakpoint[];
 }

package/image.js

@@ -4,8 +4,8 @@ import { ref as $ } from "lit/directives/ref.js";
 import { hostContext as x } from "./core/dom.js";
 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{display:flex;flex-direction:column;gap:var(--sbb-spacing-fixed-4x);margin:0;height:100%}.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;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;overflow:hidden;width:100%;height:100%;aspect-ratio:var(--sbb-image-aspect-ratio);border-radius:var(--sbb-image-border-radius)}.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)}`;
 var h = Object.freeze, u = Object.defineProperty, j = Object.getOwnPropertyDescriptor, o = (e, t, r, i) => {
-  for (var n = i > 1 ? void 0 : i ? j(t, r) : t, p = e.length - 1, b; p >= 0; p--)
-    (b = e[p]) && (n = (i ? b(t, r, n) : b(n)) || n);
+  for (var n = i > 1 ? void 0 : i ? j(t, r) : t, c = e.length - 1, b; c >= 0; c--)
+    (b = e[c]) && (n = (i ? b(t, r, n) : b(n)) || n);
   return i && n && u(t, r, n), n;
 }, A = (e, t) => h(u(e, "raw", { value: h(e.slice()) })), g;
 const U = (e) => {
@@ -23,8 +23,8 @@ const U = (e) => {
     return [];
   let r = !1, i = !1;
   const n = ["image", "mediaQueries"];
-  return t.breakpoints.forEach((p) => {
-    const b = Object.keys(p);
+  return t.breakpoints.forEach((c) => {
+    const b = Object.keys(c);
     b.forEach((l) => {
       n.includes(l) || (r = !0);
     }), n.forEach((l) => {
@@ -34,21 +34,21 @@ const U = (e) => {
 }, H = {
   once: !0,
   passive: !0
-}, 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)
+}, p = (e) => e / I, V = {
+  "sbb-breakpoint-zero-min": p(w),
+  "sbb-breakpoint-zero-max": p(S),
+  "sbb-breakpoint-micro-min": p(P),
+  "sbb-breakpoint-micro-max": p(M),
+  "sbb-breakpoint-small-min": p(z),
+  "sbb-breakpoint-small-max": p(C),
+  "sbb-breakpoint-medium-min": p(B),
+  "sbb-breakpoint-medium-max": p(L),
+  "sbb-breakpoint-large-min": p(O),
+  "sbb-breakpoint-large-max": p(Q),
+  "sbb-breakpoint-wide-min": p(F),
+  "sbb-breakpoint-wide-max": p(D),
+  "sbb-breakpoint-ultra-min": p(E),
+  "sbb-breakpoint-ultra-max": p(T)
 };
 let a = class extends _ {
   constructor() {
@@ -154,8 +154,8 @@ let a = class extends _ {
       const i = r.conditionFeature;
       let n;
       r.conditionFeatureValue.lyneDesignToken ? n = this._matchMediaQueryDesignToken(r.conditionFeatureValue.value) : n = r.conditionFeatureValue.value;
-      const p = r.conditionOperator ? ` ${r.conditionOperator} ` : "";
-      t += `(${i}: ${n})${p}`;
+      const c = r.conditionOperator ? ` ${r.conditionOperator} ` : "";
+      t += `(${i}: ${n})${c}`;
     }), t;
   }
   _imageLoaded() {
@@ -189,8 +189,8 @@ let a = class extends _ {
 
           <picture>
             <!-- render picture element sources -->
-            ${n.map((p) => {
-      const b = p.image.height, l = p.image.width, f = this._createMediaQueryString(p.mediaQueries);
+            ${n.map((c) => {
+      const b = c.image.height, l = c.image.width, f = this._createMediaQueryString(c.mediaQueries);
       return [
         d` <source
                   media=${`${f}`}
@@ -216,8 +216,8 @@ let a = class extends _ {
         ${e ? d`<figcaption
               class="sbb-image__caption"
               .innerHTML=${e}
-              ${$((p) => {
-      this._captionElement = p;
+              ${$((c) => {
+      this._captionElement = c;
     })}
             ></figcaption>` : m}
         ${t ? d(g || (g = A(['<script type="application/ld+json" .innerHTML=', "><\/script>"])), t) : m}

package/index.d.ts

@@ -15,6 +15,7 @@ import { SbbButtonElement } from "./button/button.js";
 import { SbbButtonLinkElement } from "./button/button-link.js";
 import { SbbButtonStaticElement } from "./button/button-static.js";
 import { SbbMiniButtonElement } from "./button/mini-button.js";
+import { SbbMiniButtonGroupElement } from "./button/mini-button-group.js";
 import { SbbSecondaryButtonElement } from "./button/secondary-button.js";
 import { SbbSecondaryButtonLinkElement } from "./button/secondary-button-link.js";
 import { SbbSecondaryButtonStaticElement } from "./button/secondary-button-static.js";
@@ -63,7 +64,8 @@ import { SbbIconElement } from "./icon.js";
 import { SbbImageElement } from "./image.js";
 import { SbbJourneyHeaderElement } from "./journey-header.js";
 import { SbbLeadContainerElement } from "./lead-container.js";
-import { SbbLinkListElement } from "./link-list.js";
+import { SbbLinkListElement } from "./link-list/link-list.js";
+import { SbbLinkListAnchorElement } from "./link-list/link-list-anchor.js";
 import { SbbBlockLinkElement } from "./link/block-link.js";
 import { SbbBlockLinkButtonElement } from "./link/block-link-button.js";
 import { SbbBlockLinkStaticElement } from "./link/block-link-static.js";
@@ -109,6 +111,9 @@ import { SbbTabLabelElement } from "./tabs/tab-label.js";
 import { SbbTagElement } from "./tag/tag.js";
 import { SbbTagGroupElement } from "./tag/tag-group.js";
 import { SbbTeaserElement } from "./teaser.js";
+import { SbbTeaserHeroElement } from "./teaser-hero.js";
+import { SbbTeaserProductElement } from "./teaser-product/teaser-product.js";
+import { SbbTeaserProductStaticElement } from "./teaser-product/teaser-product-static.js";
 import { SbbTimeInputElement } from "./time-input.js";
 import { SbbTimetableOccupancyElement } from "./timetable-occupancy.js";
 import { SbbTimetableOccupancyIconElement } from "./timetable-occupancy-icon.js";
@@ -141,6 +146,7 @@ declare global {
   var SbbButtonLinkElement: SbbButtonLinkElement;
   var SbbButtonStaticElement: SbbButtonStaticElement;
   var SbbMiniButtonElement: SbbMiniButtonElement;
+  var SbbMiniButtonGroupElement: SbbMiniButtonGroupElement;
   var SbbSecondaryButtonElement: SbbSecondaryButtonElement;
   var SbbSecondaryButtonLinkElement: SbbSecondaryButtonLinkElement;
   var SbbSecondaryButtonStaticElement: SbbSecondaryButtonStaticElement;
@@ -190,6 +196,7 @@ declare global {
   var SbbJourneyHeaderElement: SbbJourneyHeaderElement;
   var SbbLeadContainerElement: SbbLeadContainerElement;
   var SbbLinkListElement: SbbLinkListElement;
+  var SbbLinkListAnchorElement: SbbLinkListAnchorElement;
   var SbbBlockLinkElement: SbbBlockLinkElement;
   var SbbBlockLinkButtonElement: SbbBlockLinkButtonElement;
   var SbbBlockLinkStaticElement: SbbBlockLinkStaticElement;
@@ -235,6 +242,9 @@ declare global {
   var SbbTagElement: SbbTagElement;
   var SbbTagGroupElement: SbbTagGroupElement;
   var SbbTeaserElement: SbbTeaserElement;
+  var SbbTeaserHeroElement: SbbTeaserHeroElement;
+  var SbbTeaserProductElement: SbbTeaserProductElement;
+  var SbbTeaserProductStaticElement: SbbTeaserProductStaticElement;
   var SbbTimeInputElement: SbbTimeInputElement;
   var SbbTimetableOccupancyElement: SbbTimetableOccupancyElement;
   var SbbTimetableOccupancyIconElement: SbbTimetableOccupancyIconElement;

package/index.js

@@ -15,6 +15,7 @@ import { SbbButtonElement } from "./button/button.js";
 import { SbbButtonLinkElement } from "./button/button-link.js";
 import { SbbButtonStaticElement } from "./button/button-static.js";
 import { SbbMiniButtonElement } from "./button/mini-button.js";
+import { SbbMiniButtonGroupElement } from "./button/mini-button-group.js";
 import { SbbSecondaryButtonElement } from "./button/secondary-button.js";
 import { SbbSecondaryButtonLinkElement } from "./button/secondary-button-link.js";
 import { SbbSecondaryButtonStaticElement } from "./button/secondary-button-static.js";
@@ -63,7 +64,8 @@ import { SbbIconElement } from "./icon.js";
 import { SbbImageElement } from "./image.js";
 import { SbbJourneyHeaderElement } from "./journey-header.js";
 import { SbbLeadContainerElement } from "./lead-container.js";
-import { SbbLinkListElement } from "./link-list.js";
+import { SbbLinkListElement } from "./link-list/link-list.js";
+import { SbbLinkListAnchorElement } from "./link-list/link-list-anchor.js";
 import { SbbBlockLinkElement } from "./link/block-link.js";
 import { SbbBlockLinkButtonElement } from "./link/block-link-button.js";
 import { SbbBlockLinkStaticElement } from "./link/block-link-static.js";
@@ -109,6 +111,9 @@ import { SbbTabLabelElement } from "./tabs/tab-label.js";
 import { SbbTagElement } from "./tag/tag.js";
 import { SbbTagGroupElement } from "./tag/tag-group.js";
 import { SbbTeaserElement } from "./teaser.js";
+import { SbbTeaserHeroElement } from "./teaser-hero.js";
+import { SbbTeaserProductElement } from "./teaser-product/teaser-product.js";
+import { SbbTeaserProductStaticElement } from "./teaser-product/teaser-product-static.js";
 import { SbbTimeInputElement } from "./time-input.js";
 import { SbbTimetableOccupancyElement } from "./timetable-occupancy.js";
 import { SbbTimetableOccupancyIconElement } from "./timetable-occupancy-icon.js";
@@ -140,6 +145,7 @@ globalThis.SbbButtonElement = SbbButtonElement;
 globalThis.SbbButtonLinkElement = SbbButtonLinkElement;
 globalThis.SbbButtonStaticElement = SbbButtonStaticElement;
 globalThis.SbbMiniButtonElement = SbbMiniButtonElement;
+globalThis.SbbMiniButtonGroupElement = SbbMiniButtonGroupElement;
 globalThis.SbbSecondaryButtonElement = SbbSecondaryButtonElement;
 globalThis.SbbSecondaryButtonLinkElement = SbbSecondaryButtonLinkElement;
 globalThis.SbbSecondaryButtonStaticElement = SbbSecondaryButtonStaticElement;
@@ -189,6 +195,7 @@ globalThis.SbbImageElement = SbbImageElement;
 globalThis.SbbJourneyHeaderElement = SbbJourneyHeaderElement;
 globalThis.SbbLeadContainerElement = SbbLeadContainerElement;
 globalThis.SbbLinkListElement = SbbLinkListElement;
+globalThis.SbbLinkListAnchorElement = SbbLinkListAnchorElement;
 globalThis.SbbBlockLinkElement = SbbBlockLinkElement;
 globalThis.SbbBlockLinkButtonElement = SbbBlockLinkButtonElement;
 globalThis.SbbBlockLinkStaticElement = SbbBlockLinkStaticElement;
@@ -234,6 +241,9 @@ globalThis.SbbTabLabelElement = SbbTabLabelElement;
 globalThis.SbbTagElement = SbbTagElement;
 globalThis.SbbTagGroupElement = SbbTagGroupElement;
 globalThis.SbbTeaserElement = SbbTeaserElement;
+globalThis.SbbTeaserHeroElement = SbbTeaserHeroElement;
+globalThis.SbbTeaserProductElement = SbbTeaserProductElement;
+globalThis.SbbTeaserProductStaticElement = SbbTeaserProductStaticElement;
 globalThis.SbbTimeInputElement = SbbTimeInputElement;
 globalThis.SbbTimetableOccupancyElement = SbbTimetableOccupancyElement;
 globalThis.SbbTimetableOccupancyIconElement = SbbTimetableOccupancyIconElement;

package/journey-header/journey-header.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup, TemplateResult, LitElement } from 'lit';
 import { SbbTitleLevel } from '../title.js';
-
 export type JourneyHeaderSize = 's' | 'm' | 'l';
 declare const SbbJourneyHeaderElement_base: import('../core/mixins.js').AbstractConstructor<import('../core/mixins.js').SbbNegativeMixinType> & typeof LitElement;
 /**

package/lead-container/lead-container.d.ts

@@ -1,5 +1,4 @@
 import { CSSResultGroup, LitElement, TemplateResult } from 'lit';
-
 /**
  * The `sbb-lead-container` can be used for product pages to display a lead image and following content.
  *

package/lead-container.js

@@ -1,6 +1,6 @@
 import { css as t, LitElement as d, html as l } from "lit";
 import { customElement as c } from "lit/decorators.js";
-const m = t`*,:before,:after{box-sizing:border-box}:host{display:block;--sbb-lead-container-background-color: var(--sbb-color-white);--sbb-lead-container-image-ratio: 2 / 1;--sbb-lead-container-image-overlap: var(--sbb-spacing-fixed-24x);--sbb-lead-container-padding-block: var(--sbb-spacing-responsive-l);--sbb-lead-container-padding-inline: var(--sbb-layout-base-offset-responsive);--sbb-lead-container-border-radius: var(--sbb-border-radius-6x);--sbb-lead-container-image-border-radius: 0}@media (min-width: 80rem){:host{--sbb-lead-container-image-ratio: 21 / 9}}@media (min-width: 90rem){:host{--sbb-lead-container-image-border-radius: var(--sbb-lead-container-border-radius)}}.sbb-lead-container{padding-block-end:var(--sbb-spacing-responsive-l)}::slotted(sbb-image[slot=image]){--sbb-image-aspect-ratio: var(--sbb-lead-container-image-ratio);--sbb-image-border-radius: var(--sbb-lead-container-image-border-radius)}::slotted(:is(img[slot=image],picture[slot=image])){display:block;width:100%;object-fit:cover;aspect-ratio:var(--sbb-lead-container-image-ratio);border-radius:var(--sbb-lead-container-image-border-radius)}::slotted(:is(sbb-breadcrumb-group,sbb-block-link).sbb-lead-container-spacing){margin-block-end:var(--sbb-spacing-fixed-4x)}::slotted(:is(sbb-alert,sbb-alert-group).sbb-lead-container-spacing){margin-block-end:var(--sbb-spacing-responsive-m)}::slotted(sbb-title.sbb-lead-container-spacing){margin-block-start:0}::slotted(.sbb-lead-container-lead-text){margin-block:0 var(--sbb-spacing-responsive-s)}@media (min-width: 90rem){.sbb-lead-container-image{max-width:calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive));margin-inline:auto}}.sbb-lead-container-content-wrapper{display:grid;gap:var(--sbb-grid-base-gutter-responsive);grid-template-columns:repeat(var(--sbb-grid-base-columns),1fr);padding-inline:var(--sbb-layout-base-offset-responsive);margin-inline:auto;width:100%;background-color:var(--sbb-lead-container-background-color)}@media (min-width: 90rem){.sbb-lead-container-content-wrapper{max-width:calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive))}}@media (min-width: 64rem){.sbb-lead-container-content-wrapper{background-color:transparent}}.sbb-lead-container-content{z-index:1;border-radius:var(--sbb-lead-container-border-radius);padding-block:var(--sbb-lead-container-padding-block);background-color:var(--sbb-lead-container-background-color);grid-column:1/-1}@media (min-width: 52.5rem){.sbb-lead-container-content{grid-column:2/-2}}@media (min-width: 64rem){.sbb-lead-container-content{margin-block-start:calc(-1 * var(--sbb-lead-container-image-overlap));padding-inline:var(--sbb-lead-container-padding-inline);margin-inline:calc(-1 * var(--sbb-lead-container-padding-inline))}}@media (min-width: 80rem){.sbb-lead-container-content{grid-column:3/-3}}@media (min-width: 90rem){.sbb-lead-container-content{grid-column:4/-4}}`;
+const m = t`*,:before,:after{box-sizing:border-box}:host{display:block;--sbb-lead-container-background-color: var(--sbb-color-white);--sbb-lead-container-image-ratio: 2 / 1;--sbb-lead-container-image-overlap: var(--sbb-spacing-fixed-24x);--sbb-lead-container-padding-block: var(--sbb-spacing-responsive-l);--sbb-lead-container-padding-inline: var(--sbb-layout-base-offset-responsive);--sbb-lead-container-border-radius: var(--sbb-border-radius-6x);--sbb-lead-container-image-border-radius: 0}@media (min-width: 80rem){:host{--sbb-lead-container-image-ratio: 21 / 9}}@media (min-width: 90rem){:host{--sbb-lead-container-image-border-radius: var(--sbb-lead-container-border-radius)}}.sbb-lead-container{padding-block-end:var(--sbb-spacing-responsive-l)}::slotted(sbb-image[slot=image]){--sbb-image-aspect-ratio: var(--sbb-lead-container-image-ratio);--sbb-image-border-radius: var(--sbb-lead-container-image-border-radius)}::slotted(:is(img[slot=image],picture[slot=image])){display:block;width:100%;object-fit:cover;aspect-ratio:var(--sbb-lead-container-image-ratio);border-radius:var(--sbb-lead-container-image-border-radius)}::slotted(:is(sbb-breadcrumb-group,sbb-block-link).sbb-lead-container-spacing){margin-block-end:var(--sbb-spacing-fixed-4x)}::slotted(:is(sbb-alert,sbb-alert-group).sbb-lead-container-spacing){margin-block-end:var(--sbb-spacing-responsive-m)}::slotted(sbb-title.sbb-lead-container-spacing){margin-block-start:0}::slotted(sbb-notification.sbb-lead-container-spacing){margin-block-end:var(--sbb-spacing-responsive-xxxs)}::slotted(.sbb-lead-container-lead-text){margin-block:0 var(--sbb-spacing-responsive-s)}@media (min-width: 90rem){.sbb-lead-container-image{max-width:calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive));margin-inline:auto}}.sbb-lead-container-content-wrapper{background-color:var(--sbb-lead-container-background-color);display:grid;gap:var(--sbb-grid-base-gutter-responsive);grid-template-columns:repeat(var(--sbb-grid-base-columns),1fr);padding-inline:var(--sbb-layout-base-offset-responsive);margin-inline:auto;width:100%}@media (min-width: 90rem){.sbb-lead-container-content-wrapper{max-width:calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive))}}@media (min-width: 64rem){.sbb-lead-container-content-wrapper{background-color:transparent}}.sbb-lead-container-content{z-index:1;border-radius:var(--sbb-lead-container-border-radius);padding-block:var(--sbb-lead-container-padding-block);background-color:var(--sbb-lead-container-background-color);grid-column:1/-1}@media (min-width: 52.5rem){.sbb-lead-container-content{grid-column:2/-2}}@media (min-width: 64rem){.sbb-lead-container-content{margin-block-start:calc(-1 * var(--sbb-lead-container-image-overlap));padding-inline:var(--sbb-lead-container-padding-inline);margin-inline:calc(-1 * var(--sbb-lead-container-padding-inline))}}@media (min-width: 80rem){.sbb-lead-container-content{grid-column:3/-3}}@media (min-width: 90rem){.sbb-lead-container-content{grid-column:4/-4}}`;
 var g = Object.defineProperty, p = Object.getOwnPropertyDescriptor, v = (o, a, i, r) => {
   for (var e = r > 1 ? void 0 : r ? p(a, i) : a, n = o.length - 1, b; n >= 0; n--)
     (b = o[n]) && (e = (r ? b(a, i, e) : b(e)) || e);

package/link/block-link/block-link.d.ts

@@ -1,5 +1,4 @@
 import { SbbLinkBaseElement } from '../../core/base-elements.js';
-
 declare const SbbBlockLinkElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbBlockLinkCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbLinkBaseElement;
 /**
  * It displays a link enhanced with the SBB Design.

package/link/block-link-button/block-link-button.d.ts

@@ -1,5 +1,4 @@
 import { SbbButtonBaseElement } from '../../core/base-elements.js';
-
 declare const SbbBlockLinkButtonElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbBlockLinkCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbButtonBaseElement;
 /**
  * It displays a link enhanced with the SBB Design, which will behave as a button.

package/link/block-link-static/block-link-static.d.ts

@@ -1,5 +1,4 @@
 import { SbbActionBaseElement } from '../../core/base-elements.js';
-
 declare const SbbBlockLinkStaticElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbBlockLinkCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbActionBaseElement;
 /**
  * It displays a static link enhanced with the SBB Design.

package/link/common/block-link-common.d.ts

@@ -2,7 +2,6 @@ import { SbbActionBaseElement } from '../../core/base-elements.js';
 import { SbbIconPlacement } from '../../core/interfaces.js';
 import { AbstractConstructor } from '../../core/mixins.js';
 import { SbbLinkCommonElementMixinType } from './link-common.js';
-
 export declare class SbbBlockLinkCommonElementMixinType extends SbbLinkCommonElementMixinType {
     iconName?: string;
     iconPlacement?: SbbIconPlacement;

package/link/common/inline-link-common.d.ts

@@ -1,7 +1,6 @@
 import { SbbActionBaseElement } from '../../core/base-elements.js';
 import { AbstractConstructor } from '../../core/mixins.js';
 import { SbbLinkCommonElementMixinType } from './link-common.js';
-
 export declare class SbbInlineLinkCommonElementMixinType extends SbbLinkCommonElementMixinType {
 }
 export declare const SbbInlineLinkCommonElementMixin: <T extends AbstractConstructor<SbbActionBaseElement>>(superClass: T) => AbstractConstructor<SbbInlineLinkCommonElementMixinType> & T;

package/link/common/link-common.d.ts

@@ -1,6 +1,5 @@
 import { SbbActionBaseElement } from '../../core/base-elements.js';
 import { SbbNegativeMixinType, AbstractConstructor } from '../../core/mixins.js';
-
 export type SbbLinkSize = 'xs' | 's' | 'm';
 export declare class SbbLinkCommonElementMixinType extends SbbNegativeMixinType {
     size?: SbbLinkSize;

package/link/common.js

@@ -1,16 +1,16 @@
 import { property as c } from "lit/decorators.js";
 import { html as f } from "lit/static-html.js";
-import { SbbIconNameMixin as v } from "../icon.js";
+import { SbbIconNameMixin as h } from "../icon.js";
 import { hostAttributes as d, slotState as u } from "../core/decorators.js";
 import { SbbNegativeMixin as p } from "../core/mixins.js";
 import { css as b } from "lit";
-const a = b`*,:before,:after{box-sizing:border-box}:host{outline:none!important}@media (forced-colors: active){:host([role=button]){--sbb-link-color-normal: ButtonText;--sbb-link-color-hover: ButtonText;--sbb-link-color-active: ButtonText}}.sbb-action-base{color:var(--sbb-link-color-normal);text-decoration:var(--sbb-link-text-decoration, underline);-webkit-user-select:none;user-select:none;display:flex;align-items:center;word-break:break-word;width:100%;cursor:pointer;padding:var(--sbb-link-padding, 0);outline:none}@media (forced-colors: active){.sbb-action-base{text-decoration:underline}}:host([disabled]) .sbb-action-base{pointer-events:none;cursor:default}@media (forced-colors: active){:host([disabled]) .sbb-action-base{color:GrayText}}:host(:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-action-base,:host(:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-action-base:focus-visible{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))}@media (any-hover: hover){:host(:hover:not([disabled])) .sbb-action-base{color:var(--sbb-link-color-hover);text-decoration:underline}}:host(:is(:active,[data-active]):not([disabled])) .sbb-action-base{color:var(--sbb-link-color-active)}`;
+const a = b`*,:before,:after{box-sizing:border-box}:host{outline:none!important}@media (forced-colors: active){:host([role=button]){--sbb-link-color-normal: ButtonText;--sbb-link-color-hover: ButtonText;--sbb-link-color-active: ButtonText}}.sbb-action-base{color:var(--sbb-link-color-normal);text-decoration:var(--sbb-link-text-decoration, underline);-webkit-user-select:none;user-select:none}@media (forced-colors: active){.sbb-action-base{text-decoration:underline}}.sbb-action-base{display:flex;align-items:center;word-break:break-word;width:100%;cursor:pointer;padding:var(--sbb-link-padding, 0);outline:none}:host([disabled]) .sbb-action-base{pointer-events:none;cursor:default}@media (forced-colors: active){:host([disabled]) .sbb-action-base{color:GrayText}}:host(:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-action-base,:host(:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-action-base:focus-visible{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))}@media (any-hover: hover){:host(:hover:not([disabled])) .sbb-action-base{color:var(--sbb-link-color-hover);text-decoration:var(--sbb-link-hover-text-decoration, underline)}}:host(:is(:active,[data-active]):not([disabled])) .sbb-action-base{color:var(--sbb-link-color-active)}`;
 var m = Object.defineProperty, g = Object.getOwnPropertyDescriptor, l = (i, t, o, n) => {
   for (var e = n > 1 ? void 0 : n ? g(t, o) : t, s = i.length - 1, r; s >= 0; s--)
     (r = i[s]) && (e = (n ? r(t, o, e) : r(e)) || e);
   return n && e && m(t, o, e), e;
 };
-const h = (i) => {
+const v = (i) => {
   let t = class extends p(i) {
     constructor() {
       super(...arguments), this.size = "s";
@@ -32,7 +32,7 @@ var y = Object.defineProperty, k = (i, t, o, n) => {
   return e && y(t, o, e), e;
 };
 const O = (i) => {
-  const o = class o extends h(v(i)) {
+  const o = class o extends v(h(i)) {
     constructor() {
       super(...arguments), this.iconPlacement = "start";
     }
@@ -49,7 +49,7 @@ const O = (i) => {
     c({ attribute: "icon-placement", reflect: !0 })
   ], t.prototype, "iconPlacement"), t;
 }, z = b`:host{font-family:inherit;font-weight:inherit;line-height:inherit;letter-spacing:inherit;font-size:inherit;text-align:inherit;--sbb-link-color-normal: inherit;--sbb-link-color-hover: var(--sbb-color-red125);--sbb-link-color-active: var(--sbb-color-red150);color:inherit;display:inline-block}:host([negative]){--sbb-link-color-hover: var(--sbb-color-graphite);--sbb-link-color-active: var(--sbb-color-metal);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark)}.sbb-action-base{font-family:inherit;font-weight:inherit;line-height:inherit;letter-spacing:inherit;font-size:inherit;text-align:inherit}`, j = (i) => {
-  const o = class o extends h(i) {
+  const o = class o extends v(i) {
   };
   o.styles = [a, z];
   let t = o;
@@ -58,5 +58,5 @@ const O = (i) => {
 export {
   O as SbbBlockLinkCommonElementMixin,
   j as SbbInlineLinkCommonElementMixin,
-  h as SbbLinkCommonElementMixin
+  v as SbbLinkCommonElementMixin
 };

package/link/link/link.d.ts

@@ -1,5 +1,4 @@
 import { SbbLinkBaseElement } from '../../core/base-elements.js';
-
 declare const SbbLinkElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbInlineLinkCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbLinkBaseElement;
 /**
  * It displays a link enhanced with the SBB Design.

package/link/link-button/link-button.d.ts

@@ -1,5 +1,4 @@
 import { SbbButtonBaseElement } from '../../core/base-elements.js';
-
 declare const SbbLinkButtonElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbInlineLinkCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbButtonBaseElement;
 /**
  * It displays a link enhanced with the SBB Design, which will behave as a button.

package/link/link-static/link-static.d.ts

@@ -1,5 +1,4 @@
 import { SbbActionBaseElement } from '../../core/base-elements.js';
-
 declare const SbbLinkStaticElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbInlineLinkCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbActionBaseElement;
 /**
  * It displays a static link enhanced with the SBB Design.

package/link-list/common/link-list-base.d.ts

@@ -0,0 +1,27 @@
+import { PropertyValues, TemplateResult, LitElement } from 'lit';
+import { WithListChildren } from '../../core/mixins.js';
+import { SbbBlockLinkButtonElement, SbbBlockLinkElement, SbbBlockLinkStaticElement, SbbLinkSize } from '../../link.js';
+import { SbbTitleLevel } from '../../title.js';
+declare const SbbLinkListBaseElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbNegativeMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbNamedSlotListMixinType<SbbBlockLinkElement | SbbBlockLinkButtonElement | SbbBlockLinkStaticElement>> & typeof LitElement;
+/**
+ * It displays a list of `sbb-block-link`.
+ *
+ * @slot - Use the unnamed slot to add one or more `sbb-block-link`.
+ * @slot title - Use this slot to provide a title.
+ */
+export declare class SbbLinkListBaseElement extends SbbLinkListBaseElement_base {
+    protected readonly listChildLocalNames: string[];
+    /** The title text we want to show before the list. */
+    titleContent?: string;
+    /** The semantic level of the title, e.g. 2 = h2. */
+    titleLevel: SbbTitleLevel;
+    /**
+     * Text size of the nested sbb-block-link instances.
+     * This will overwrite the size attribute of nested sbb-block-link instances.
+     */
+    size: SbbLinkSize;
+    protected willUpdate(changedProperties: PropertyValues<WithListChildren<this>>): void;
+    protected render(): TemplateResult;
+}
+export {};
+//# sourceMappingURL=link-list-base.d.ts.map

package/link-list/common/link-list-base.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-list-base.d.ts","sourceRoot":"","sources":["../../../../src/elements/link-list/common/link-list-base.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1D,OAAO,EAAQ,UAAU,EAAW,MAAM,KAAK,CAAC;AAIhD,OAAO,EAGL,KAAK,gBAAgB,EACtB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,KAAK,EACV,yBAAyB,EACzB,mBAAmB,EACnB,yBAAyB,EACzB,WAAW,EACZ,MAAM,eAAe,CAAC;AACvB,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAEpD,OAAO,gBAAgB,CAAC;;AAExB;;;;;GAKG;AACH,qBACa,sBAAuB,SAAQ,2BAK3C;IACC,mBAA4B,mBAAmB,WAI7C;IAEF,sDAAsD;IACU,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtF,oDAAoD;IACL,UAAU,EAAE,aAAa,CAAO;IAE/E;;;OAGG;IACiC,IAAI,EAAE,WAAW,CAAO;cAEzC,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,GAAG,IAAI;cAe3E,MAAM,IAAI,cAAc;CAgB5C"}

package/link-list/common.d.ts

@@ -0,0 +1,2 @@
+export * from './common/link-list-base.js';
+//# sourceMappingURL=common.d.ts.map

package/link-list/common.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../../../src/elements/link-list/common.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC;AAE3C,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,yCAAyC,CAAC"}

package/link-list/common.js

@@ -0,0 +1,59 @@
+import { LitElement as p, html as v, nothing as c, css as f } from "lit";
+import { property as a } from "lit/decorators.js";
+import { slotState as m } from "../core/decorators.js";
+import { SbbNegativeMixin as h, SbbNamedSlotListMixin as d } from "../core/mixins.js";
+import "../title.js";
+var u = Object.defineProperty, k = Object.getOwnPropertyDescriptor, n = (t, e, r, s) => {
+  for (var i = s > 1 ? void 0 : s ? k(e, r) : e, o = t.length - 1, b; o >= 0; o--)
+    (b = t[o]) && (i = (s ? b(e, r, i) : b(i)) || i);
+  return s && i && u(e, r, i), i;
+};
+let l = class extends h(
+  d(p)
+) {
+  constructor() {
+    super(...arguments), this.listChildLocalNames = [
+      "sbb-block-link",
+      "sbb-block-link-button",
+      "sbb-block-link-static"
+    ], this.titleLevel = "2", this.size = "s";
+  }
+  willUpdate(t) {
+    if (super.willUpdate(t), t.has("size") || t.has("negative") || t.has("listChildren"))
+      for (const e of this.listChildren)
+        e.negative = this.negative, e.size = this.size;
+  }
+  render() {
+    return v`
+      <div class="sbb-link-list-wrapper">
+        <sbb-title
+          class="sbb-link-list-title"
+          level=${this.titleLevel || c}
+          visual-level="5"
+          ?negative=${this.negative}
+          id="sbb-link-list-title-id"
+        >
+          <slot name="title">${this.titleContent}</slot>
+        </sbb-title>
+        ${this.renderList({ ariaLabelledby: "sbb-link-list-title-id" })}
+      </div>
+    `;
+  }
+};
+n([
+  a({ attribute: "title-content", reflect: !0 })
+], l.prototype, "titleContent", 2);
+n([
+  a({ attribute: "title-level" })
+], l.prototype, "titleLevel", 2);
+n([
+  a({ reflect: !0 })
+], l.prototype, "size", 2);
+l = n([
+  m()
+], l);
+const z = f`*,:before,:after{box-sizing:border-box}:host{display:block}.sbb-link-list-wrapper{display:flex;flex-direction:column;gap:var(--sbb-spacing-fixed-3x)}.sbb-link-list-title{margin:0}:host(:not([data-slot-names~=title],[title-content])) .sbb-link-list-title{display:none}`;
+export {
+  l as SbbLinkListBaseElement,
+  z as linkListBaseStyle
+};

package/link-list/link-list/link-list.d.ts

@@ -0,0 +1,22 @@
+import { CSSResultGroup } from 'lit';
+import { SbbHorizontalFrom, SbbOrientation } from '../../core/interfaces.js';
+import { SbbLinkListBaseElement } from '../common.js';
+/**
+ * It displays a list of `sbb-block-link`.
+ *
+ * @slot - Use the unnamed slot to add one or more `sbb-block-link`.
+ * @slot title - Use this slot to provide a title.
+ */
+export declare class SbbLinkListElement extends SbbLinkListBaseElement {
+    static styles: CSSResultGroup;
+    /** Selected breakpoint from which the list is rendered horizontally. */
+    horizontalFrom?: SbbHorizontalFrom;
+    /** The orientation in which the list will be shown vertical or horizontal. */
+    orientation: SbbOrientation;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-link-list': SbbLinkListElement;
+    }
+}
+//# sourceMappingURL=link-list.d.ts.map

package/link-list/link-list/link-list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-list.d.ts","sourceRoot":"","sources":["../../../../src/elements/link-list/link-list/link-list.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1C,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAClF,OAAO,EAAqB,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAIzE;;;;;GAKG;AACH,qBACa,kBAAmB,SAAQ,sBAAsB;IAC5D,OAAuB,MAAM,EAAE,cAAc,CAA8B;IAE3E,wEAAwE;IAEjE,cAAc,CAAC,EAAE,iBAAiB,CAAC;IAE1C,8EAA8E;IAC1C,WAAW,EAAE,cAAc,CAAc;CAC9E;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,eAAe,EAAE,kBAAkB,CAAC;KACrC;CACF"}

package/link-list/link-list-anchor/index.d.ts

@@ -0,0 +1,2 @@
+export * from './link-list-anchor.js';
+//# sourceMappingURL=index.d.ts.map

package/link-list/link-list-anchor/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/link-list/link-list-anchor/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC"}

package/link-list/link-list-anchor/link-list-anchor.d.ts

@@ -0,0 +1,17 @@
+import { CSSResultGroup } from 'lit';
+import { SbbLinkListBaseElement } from '../common.js';
+/**
+ * It displays a list of `sbb-block-link`.
+ *
+ * @slot - Use the unnamed slot to add one or more `sbb-block-link`.
+ * @slot title - Use this slot to provide a title.
+ */
+export declare class SbbLinkListAnchorElement extends SbbLinkListBaseElement {
+    static styles: CSSResultGroup;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-link-list-anchor': SbbLinkListAnchorElement;
+    }
+}
+//# sourceMappingURL=link-list-anchor.d.ts.map

package/link-list/link-list-anchor/link-list-anchor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-list-anchor.d.ts","sourceRoot":"","sources":["../../../../src/elements/link-list/link-list-anchor/link-list-anchor.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1C,OAAO,EAAqB,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAIzE;;;;;GAKG;AACH,qBACa,wBAAyB,SAAQ,sBAAsB;IAClE,OAAuB,MAAM,EAAE,cAAc,CAA8B;CAC5E;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,sBAAsB,EAAE,wBAAwB,CAAC;KAClD;CACF"}

package/link-list/link-list-anchor.d.ts

@@ -0,0 +1,2 @@
+export * from './link-list-anchor/link-list-anchor.js';
+//# sourceMappingURL=link-list-anchor.d.ts.map

package/link-list/link-list-anchor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-list-anchor.d.ts","sourceRoot":"","sources":["../../../src/elements/link-list/link-list-anchor.ts"],"names":[],"mappings":"AAAA,cAAc,wCAAwC,CAAC"}

package/link-list/link-list-anchor.js

@@ -0,0 +1,18 @@
+import { customElement as a } from "lit/decorators.js";
+import { linkListBaseStyle as n, SbbLinkListBaseElement as c } from "./common.js";
+import { css as d } from "lit";
+const v = d`:host{--sbb-link-list-anchor-border-color: var(--sbb-color-cloud)}:host([negative]){--sbb-link-list-anchor-border-color: var(--sbb-color-granite)}::slotted([data-link]){--sbb-link-text-decoration: none;--sbb-link-hover-text-decoration: none;--sbb-link-padding: var(--sbb-spacing-fixed-1x) 0 var(--sbb-spacing-fixed-1x) var(--sbb-spacing-fixed-4x);--sbb-link-color-hover: var(--sbb-color-charcoal);--sbb-link-color-active: var(--sbb-color-granite);border-inline-start:var(--sbb-border-width-1x) solid var(--sbb-link-list-anchor-border-color)}:host([negative]) ::slotted([data-link]){--sbb-link-color-normal: var(--sbb-color-smoke);--sbb-link-color-hover: var(--sbb-color-milk);--sbb-link-color-active: var(--sbb-color-smoke)}::slotted([data-link]:is(:active,[data-active]):not([disabled])){--sbb-link-list-anchor-border-color: var(--sbb-color-iron)}:host([negative]) ::slotted([data-link]:is(:active,[data-active]):not([disabled])){--sbb-link-list-anchor-border-color: var(--sbb-color-silver)}::slotted([data-link]:hover:not([disabled])){--sbb-link-list-anchor-border-color: var(--sbb-color-charcoal)}:host([negative]) ::slotted([data-link]:hover:not([disabled])){--sbb-link-list-anchor-border-color: var(--sbb-color-milk)}.sbb-link-list-anchor{list-style:none;margin:0;padding:0;font-size:inherit;display:flex;flex-flow:column}.sbb-link-list-anchor>li{margin-inline-start:var(--sbb-spacing-fixed-4x)}`;
+var h = Object.defineProperty, k = Object.getOwnPropertyDescriptor, m = (e, r, s, l) => {
+  for (var o = l > 1 ? void 0 : l ? k(r, s) : r, i = e.length - 1, b; i >= 0; i--)
+    (b = e[i]) && (o = (l ? b(r, s, o) : b(o)) || o);
+  return l && o && h(r, s, o), o;
+};
+let t = class extends c {
+};
+t.styles = [n, v];
+t = m([
+  a("sbb-link-list-anchor")
+], t);
+export {
+  t as SbbLinkListAnchorElement
+};