@sbb-esta/lyne-elements 3.13.0 → 4.0.0-next.1

package/container/sticky-bar/sticky-bar.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sticky-bar.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/container/sticky-bar/sticky-bar.component.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EACV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;;AAUb;;;;;;;;;;GAUG;AACH,qBAEM,mBAAoB,SAAQ,wBAAmC;IACnE,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,gBAAuB,MAAM;;;;;MAKlB;IAEX,2DAA2D;IAC3D,SAA6C,KAAK,EAC9C,OAAO,GACP,MAAM,GACN,UAAU,GACV,UAAU,GACV,IAAI,CAAQ;IAEhB;;;OAGG;IACH,SAA6C,IAAI,EAAE,GAAG,GAAG,GAAG,CAAwB;IAEpF,kCAAkC;IAClC,OAAO,KAAK,MAAM,QAEjB;IACD,OAAO,KAAK,MAAM,GAEjB;IAED,OAAO,CAAC,YAAY,CAAC,CAAkB;IACvC,OAAO,CAAC,SAAS,CAKd;IAEa,iBAAiB,IAAI,IAAI;IAiBzB,oBAAoB,IAAI,IAAI;cAMzB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAU9E,OAAO,CAAC,wBAAwB;IAIhC,OAAO,CAAC,kBAAkB;IA+B1B,wEAAwE;IACjE,KAAK,IAAI,IAAI;IAWpB,mEAAmE;IAC5D,OAAO,IAAI,IAAI;IAYtB,OAAO,CAAC,eAAe;IAOvB,OAAO,CAAC,iBAAiB;IAMzB,OAAO,CAAC,eAAe;IAWvB,OAAO,CAAC,yBAAyB;IAKjC,OAAO,CAAC,2BAA2B;cAKhB,MAAM,IAAI,cAAc;CAU5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,gBAAgB,EAAE,mBAAmB,CAAC;KACvC;CACF"}
+{"version":3,"file":"sticky-bar.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/container/sticky-bar/sticky-bar.component.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EACV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;;AAWb;;;;;;;;;;GAUG;AACH,qBAEM,mBAAoB,SAAQ,wBAAmC;IACnE,OAAuB,MAAM,EAAE,cAAc,CAA4B;IAEzE,gBAAuB,MAAM;;;;;MAKlB;IAEX,2DAA2D;IAC3D,SAA6C,KAAK,EAC9C,OAAO,GACP,MAAM,GACN,UAAU,GACV,UAAU,GACV,IAAI,CAAQ;IAEhB;;;OAGG;IACH,SAA6C,IAAI,EAAE,GAAG,GAAG,GAAG,CAAwB;IAEpF,kCAAkC;IAClC,OAAO,KAAK,MAAM,QAEjB;IACD,OAAO,KAAK,MAAM,GAEjB;IAED,OAAO,CAAC,YAAY,CAAC,CAAkB;IACvC,OAAO,CAAC,SAAS,CAKd;IAEa,iBAAiB,IAAI,IAAI;IAiBzB,oBAAoB,IAAI,IAAI;cAMzB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAU9E,OAAO,CAAC,wBAAwB;IAIhC,OAAO,CAAC,kBAAkB;IA+B1B,wEAAwE;IACjE,KAAK,IAAI,IAAI;IAWpB,mEAAmE;IAC5D,OAAO,IAAI,IAAI;IAYtB,OAAO,CAAC,eAAe;IAOvB,OAAO,CAAC,iBAAiB;IAMzB,OAAO,CAAC,eAAe;IAWvB,OAAO,CAAC,yBAAyB;IAKjC,OAAO,CAAC,2BAA2B;cAKhB,MAAM,IAAI,cAAc;CAU5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,gBAAgB,EAAE,mBAAmB,CAAC;KACvC;CACF"}

package/container/sticky-bar/sticky-bar.component.js

@@ -1,24 +1,25 @@
-var w = (a) => {
+var x = (a) => {
   throw TypeError(a);
 };
-var x = (a, s, e) => s.has(a) || w("Cannot " + e);
-var k = (a, s, e) => (x(a, s, "read from private field"), e ? e.call(a) : s.get(a)), u = (a, s, e) => s.has(a) ? w("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(a) : s.set(a, e), d = (a, s, e, r) => (x(a, s, "write to private field"), r ? r.call(a, e) : s.set(a, e), e);
-import { __runInitializers as l, __esDecorate as h } from "tslib";
+var w = (a, i, e) => i.has(a) || x("Cannot " + e);
+var k = (a, i, e) => (w(a, i, "read from private field"), e ? e.call(a) : i.get(a)), u = (a, i, e) => i.has(a) ? x("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(a) : i.set(a, e), d = (a, i, e, r) => (w(a, i, "write to private field"), r ? r.call(a, e) : i.set(a, e), e);
+import { __runInitializers as l, __esDecorate as y } from "tslib";
 import { IntersectionController as S } from "@lit-labs/observers/intersection-controller.js";
 import { css as A, LitElement as C, html as R } from "lit";
 import { customElement as B, property as z } from "lit/decorators.js";
 import { isLean as I, isZeroAnimationDuration as D } from "../../core/dom.js";
 import { SbbUpdateSchedulerMixin as U } from "../../core/mixins.js";
-const T = A`*,:before,:after{box-sizing:border-box}:host{--sbb-sticky-bar-position: sticky;--sbb-sticky-bar-padding-block: var(--sbb-spacing-responsive-xs);--sbb-sticky-bar-border-radius: var(--sbb-border-radius-8x);--sbb-sticky-bar-animation-easing: var(--sbb-animation-easing);--sbb-sticky-bar-fade-in-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-5x) );--sbb-sticky-bar-fade-out-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-sticky-bar-slide-vertically-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-sticky-bar-slide-vertically-animation-easing: ease-out;--sbb-sticky-bar-slide-vertically-animation-delay: 0s;--sbb-sticky-bar-slide-vertically-animation-name: unset;--_sbb-sticky-bar-background-animation-duration: var( --sbb-sticky-bar-fade-out-animation-duration );--_sbb-sticky-bar-intersector-background-color: transparent;--_sbb-sticky-bar-forced-colors-border: none;display:contents}:host([size=s]){--sbb-sticky-bar-padding-block: var(--sbb-spacing-responsive-xxxs)}:host([data-sticking]:not([data-state=unsticky])){--sbb-sticky-bar-sticky-background-color: var( --sbb-container-background-color, var(--sbb-background-color-1) );--_sbb-sticky-bar-intersector-background-color: var(--sbb-sticky-bar-sticky-background-color);--_sbb-sticky-bar-background-animation-duration: var(--sbb-sticky-bar-fade-in-animation-duration)}@media(forced-colors:active){:host([data-sticking]:not([data-state=unsticky])){--_sbb-sticky-bar-forced-colors-border: var(--sbb-border-width-1x) solid CanvasText}}:host([data-sticking]:not([data-state=unsticky])[color=white]){--sbb-sticky-bar-sticky-background-color: var(--sbb-background-color-1)}:host([data-sticking]:not([data-state=unsticky])[color=milk]){--sbb-sticky-bar-sticky-background-color: var(--sbb-background-color-3)}:host([data-sticking]:not([data-state=unsticky])[color=midnight]){--sbb-sticky-bar-sticky-background-color: var(--sbb-background-color-1-negative)}:host([data-sticking]:not([data-state=unsticky])[color=charcoal]){--sbb-sticky-bar-sticky-background-color: var(--sbb-background-color-2-negative)}:host(:is([data-sticking]:is([data-slide-vertically],[data-state=sticking],[data-state=unsticking]),[data-state=unsticky])){--_sbb-sticky-bar-background-animation-duration: 0s}:host([data-sticking]:is([data-slide-vertically]:not([data-state=unsticky],[data-state=unsticking]),[data-state=sticking])){--sbb-sticky-bar-slide-vertically-animation-name: slide-in}:host([data-sticking][data-state=unsticking]){--sbb-sticky-bar-slide-vertically-animation-name: slide-out}:host(:is(:not([data-initialized]),[data-state=unsticky])){--sbb-sticky-bar-position: relative}.sbb-sticky-bar__wrapper{position:var(--sbb-sticky-bar-position);inset-block-end:0;display:block;z-index:var(--sbb-sticky-bar-z-index);animation-name:var(--sbb-sticky-bar-slide-vertically-animation-name);animation-duration:var(--sbb-sticky-bar-slide-vertically-animation-duration);animation-timing-function:var(--sbb-sticky-bar-slide-vertically-animation-easing);animation-delay:var(--sbb-sticky-bar-slide-vertically-animation-delay);animation-fill-mode:backwards}.sbb-sticky-bar__wrapper:after,.sbb-sticky-bar__wrapper:before{content:"";inset:0;position:absolute;display:block;z-index:-1}.sbb-sticky-bar__wrapper:before{background-color:var(--sbb-container-background-color);padding:0!important}:host(:not([data-expanded])) .sbb-sticky-bar__wrapper:before{padding-inline:var(--sbb-page-spacing-padding, var(--sbb-layout-base-offset-responsive));margin-inline:auto;width:100%}@media(min-width:90rem){:host(:not([data-expanded])) .sbb-sticky-bar__wrapper:before{max-width:var(--sbb-spacing-max-width, calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive)))}}.sbb-sticky-bar__wrapper:after{background-color:var(--sbb-sticky-bar-sticky-background-color, transparent);border-start-start-radius:var(--sbb-sticky-bar-border-radius);border-start-end-radius:var(--sbb-sticky-bar-border-radius);transition:background-color var(--_sbb-sticky-bar-background-animation-duration) var(--sbb-sticky-bar-animation-easing);border:var(--_sbb-sticky-bar-forced-colors-border)}.sbb-sticky-bar{display:flex;padding-block:var(--sbb-sticky-bar-padding-block);margin-block-end:-1px}.sbb-sticky-bar:before{content:"";position:absolute;inset:0;z-index:-1;border-start-start-radius:var(--sbb-sticky-bar-border-radius);border-start-end-radius:var(--sbb-sticky-bar-border-radius);transition:box-shadow var(--_sbb-sticky-bar-background-animation-duration) var(--sbb-sticky-bar-animation-easing);clip-path:polygon(-50% calc(-1 * var(--sbb-shadow-elevation-level-11-shadow-1-blur)),150% calc(-1 * var(--sbb-shadow-elevation-level-11-shadow-1-blur)),150% 50%,-50% 50%)}:host([data-sticking]:not([data-state=unsticky])) .sbb-sticky-bar:before{box-shadow:var(--sbb-shadow-elevation-level-11-shadow-2-offset-x) var(--sbb-shadow-elevation-level-11-shadow-2-offset-y) var(--sbb-shadow-elevation-level-11-shadow-2-blur) var(--sbb-shadow-elevation-level-11-shadow-2-spread) var(--sbb-shadow-color-soft-2),var(--sbb-shadow-elevation-level-11-shadow-1-offset-x) var(--sbb-shadow-elevation-level-11-shadow-1-offset-y) var(--sbb-shadow-elevation-level-11-shadow-1-blur) var(--sbb-shadow-elevation-level-11-shadow-1-spread) var(--sbb-shadow-color-soft-1)}:host(:not([data-expanded])) .sbb-sticky-bar{padding-inline:var(--sbb-page-spacing-padding, var(--sbb-layout-base-offset-responsive));margin-inline:auto;width:100%}@media(min-width:90rem){:host(:not([data-expanded])) .sbb-sticky-bar{max-width:var(--sbb-spacing-max-width, calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive)))}}:host([data-expanded]) .sbb-sticky-bar{padding-inline:var(--sbb-page-spacing-padding, var(--sbb-spacing-responsive-xxs))}.sbb-sticky-bar__intersector{height:1px}.sbb-sticky-bar__intersector:after{content:"";display:block;position:absolute;width:100%;height:calc(var(--sbb-sticky-bar-bottom-overlapping-height, 0) + 1px);background-color:var(--_sbb-sticky-bar-intersector-background-color);pointer-events:none;transition:background-color var(--_sbb-sticky-bar-background-animation-duration) var(--sbb-sticky-bar-animation-easing)}@keyframes slide-in{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes slide-out{0%{transform:translateY(0)}to{transform:translateY(100%)}}`;
-let M = (() => {
-  var n, b, o;
-  let a = [B("sbb-sticky-bar")], s, e = [], r, y = U(C), v, g = [], m = [], p, _ = [], f = [];
-  return o = class extends y {
+import { boxSizingStyles as T } from "../../core/styles.js";
+const H = A`:host{--sbb-sticky-bar-position: sticky;--sbb-sticky-bar-padding-block: var(--sbb-spacing-responsive-xs);--sbb-sticky-bar-border-radius: var(--sbb-border-radius-8x);--sbb-sticky-bar-animation-easing: var(--sbb-animation-easing);--sbb-sticky-bar-fade-in-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-5x) );--sbb-sticky-bar-fade-out-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-sticky-bar-slide-vertically-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-sticky-bar-slide-vertically-animation-easing: ease-out;--sbb-sticky-bar-slide-vertically-animation-delay: 0s;--sbb-sticky-bar-slide-vertically-animation-name: unset;--_sbb-sticky-bar-background-animation-duration: var( --sbb-sticky-bar-fade-out-animation-duration );--_sbb-sticky-bar-intersector-background-color: transparent;--_sbb-sticky-bar-forced-colors-border: none;display:contents}:host([size=s]){--sbb-sticky-bar-padding-block: var(--sbb-spacing-responsive-xxxs)}:host([data-sticking]:not([data-state=unsticky])){--sbb-sticky-bar-sticky-background-color: var( --sbb-container-background-color, var(--sbb-background-color-1) );--_sbb-sticky-bar-intersector-background-color: var(--sbb-sticky-bar-sticky-background-color);--_sbb-sticky-bar-background-animation-duration: var(--sbb-sticky-bar-fade-in-animation-duration)}@media(forced-colors:active){:host([data-sticking]:not([data-state=unsticky])){--_sbb-sticky-bar-forced-colors-border: var(--sbb-border-width-1x) solid CanvasText}}:host([data-sticking]:not([data-state=unsticky])[color=white]){--sbb-sticky-bar-sticky-background-color: var(--sbb-background-color-1)}:host([data-sticking]:not([data-state=unsticky])[color=milk]){--sbb-sticky-bar-sticky-background-color: var(--sbb-background-color-3)}:host([data-sticking]:not([data-state=unsticky])[color=midnight]){--sbb-sticky-bar-sticky-background-color: var(--sbb-background-color-1-negative)}:host([data-sticking]:not([data-state=unsticky])[color=charcoal]){--sbb-sticky-bar-sticky-background-color: var(--sbb-background-color-2-negative)}:host(:is([data-sticking]:is([data-slide-vertically],[data-state=sticking],[data-state=unsticking]),[data-state=unsticky])){--_sbb-sticky-bar-background-animation-duration: 0s}:host([data-sticking]:is([data-slide-vertically]:not([data-state=unsticky],[data-state=unsticking]),[data-state=sticking])){--sbb-sticky-bar-slide-vertically-animation-name: slide-in}:host([data-sticking][data-state=unsticking]){--sbb-sticky-bar-slide-vertically-animation-name: slide-out}:host(:is(:not([data-initialized]),[data-state=unsticky])){--sbb-sticky-bar-position: relative}.sbb-sticky-bar__wrapper{position:var(--sbb-sticky-bar-position);inset-block-end:0;display:block;z-index:var(--sbb-sticky-bar-z-index);animation-name:var(--sbb-sticky-bar-slide-vertically-animation-name);animation-duration:var(--sbb-sticky-bar-slide-vertically-animation-duration);animation-timing-function:var(--sbb-sticky-bar-slide-vertically-animation-easing);animation-delay:var(--sbb-sticky-bar-slide-vertically-animation-delay);animation-fill-mode:backwards}.sbb-sticky-bar__wrapper:after,.sbb-sticky-bar__wrapper:before{content:"";inset:0;position:absolute;display:block;z-index:-1}.sbb-sticky-bar__wrapper:before{background-color:var(--sbb-container-background-color);padding:0!important}:host(:not([data-expanded])) .sbb-sticky-bar__wrapper:before{padding-inline:var(--sbb-page-spacing-padding, var(--sbb-layout-base-offset-responsive));margin-inline:auto;width:100%}@media(min-width:90rem){:host(:not([data-expanded])) .sbb-sticky-bar__wrapper:before{max-width:var(--sbb-spacing-max-width, calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive)))}}.sbb-sticky-bar__wrapper:after{background-color:var(--sbb-sticky-bar-sticky-background-color, transparent);border-start-start-radius:var(--sbb-sticky-bar-border-radius);border-start-end-radius:var(--sbb-sticky-bar-border-radius);transition:background-color var(--_sbb-sticky-bar-background-animation-duration) var(--sbb-sticky-bar-animation-easing);border:var(--_sbb-sticky-bar-forced-colors-border)}.sbb-sticky-bar{display:flex;padding-block:var(--sbb-sticky-bar-padding-block);margin-block-end:-1px}.sbb-sticky-bar:before{content:"";position:absolute;inset:0;z-index:-1;border-start-start-radius:var(--sbb-sticky-bar-border-radius);border-start-end-radius:var(--sbb-sticky-bar-border-radius);transition:box-shadow var(--_sbb-sticky-bar-background-animation-duration) var(--sbb-sticky-bar-animation-easing);clip-path:polygon(-50% calc(-1 * var(--sbb-shadow-elevation-level-11-shadow-1-blur)),150% calc(-1 * var(--sbb-shadow-elevation-level-11-shadow-1-blur)),150% 50%,-50% 50%)}:host([data-sticking]:not([data-state=unsticky])) .sbb-sticky-bar:before{box-shadow:var(--sbb-box-shadow-level-11-soft)}:host(:not([data-expanded])) .sbb-sticky-bar{padding-inline:var(--sbb-page-spacing-padding, var(--sbb-layout-base-offset-responsive));margin-inline:auto;width:100%}@media(min-width:90rem){:host(:not([data-expanded])) .sbb-sticky-bar{max-width:var(--sbb-spacing-max-width, calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive)))}}:host([data-expanded]) .sbb-sticky-bar{padding-inline:var(--sbb-page-spacing-padding, var(--sbb-spacing-responsive-xxs))}.sbb-sticky-bar__intersector{height:1px}.sbb-sticky-bar__intersector:after{content:"";display:block;position:absolute;width:100%;height:calc(var(--sbb-sticky-bar-bottom-overlapping-height, 0) + 1px);background-color:var(--_sbb-sticky-bar-intersector-background-color);pointer-events:none;transition:background-color var(--_sbb-sticky-bar-background-animation-duration) var(--sbb-sticky-bar-animation-easing)}@keyframes slide-in{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes slide-out{0%{transform:translateY(0)}to{transform:translateY(100%)}}`;
+let $ = (() => {
+  var o, b, n;
+  let a = [B("sbb-sticky-bar")], i, e = [], r, h = U(C), g, m = [], v = [], p, _ = [], f = [];
+  return n = class extends h {
     constructor() {
       super(...arguments);
-      u(this, n);
+      u(this, o);
       u(this, b);
-      d(this, n, l(this, g, null)), d(this, b, (l(this, m), l(this, _, I() ? "s" : "m"))), this._intersector = l(this, f), this._observer = new S(this, {
+      d(this, o, l(this, m, null)), d(this, b, (l(this, v), l(this, _, I() ? "s" : "m"))), this._intersector = l(this, f), this._observer = new S(this, {
         // Although `this` is observed, we have to postpone observing
         // into firstUpdated() to achieve a correct initial state.
         target: null,
@@ -27,10 +28,10 @@ let M = (() => {
     }
     /** Color of the container, like transparent, white etc. */
     get color() {
-      return k(this, n);
+      return k(this, o);
     }
     set color(t) {
-      d(this, n, t);
+      d(this, o, t);
     }
     /**
      * Size of the container.
@@ -65,8 +66,8 @@ let M = (() => {
     }
     _detectStickyState(t) {
       this.toggleAttribute("data-initialized", !0);
-      const i = !t.isIntersecting && t.boundingClientRect.top > 0, c = this._intersector?.getBoundingClientRect(), E = this.shadowRoot.querySelector(".sbb-sticky-bar__wrapper").getBoundingClientRect();
-      this.toggleAttribute("data-slide-vertically", i && this._intersector && Math.abs(c.bottom - E.bottom) > 30), this.toggleAttribute("data-sticking", i), this.completeUpdate();
+      const s = !t.isIntersecting && t.boundingClientRect.top > 0, c = this._intersector?.getBoundingClientRect(), E = this.shadowRoot.querySelector(".sbb-sticky-bar__wrapper").getBoundingClientRect();
+      this.toggleAttribute("data-slide-vertically", s && this._intersector && Math.abs(c.bottom - E.bottom) > 30), this.toggleAttribute("data-sticking", s), this.completeUpdate();
     }
     /** Animates from normal content flow position to `position: sticky`. */
     stick() {
@@ -101,14 +102,14 @@ let M = (() => {
       <div class="sbb-sticky-bar__intersector"></div>
     `;
     }
-  }, n = new WeakMap(), b = new WeakMap(), r = o, (() => {
-    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(y[Symbol.metadata] ?? null) : void 0;
-    v = [z({ reflect: !0 })], p = [z({ reflect: !0 })], h(o, null, v, { kind: "accessor", name: "color", static: !1, private: !1, access: { has: (i) => "color" in i, get: (i) => i.color, set: (i, c) => {
-      i.color = c;
-    } }, metadata: t }, g, m), h(o, null, p, { kind: "accessor", name: "size", static: !1, private: !1, access: { has: (i) => "size" in i, get: (i) => i.size, set: (i, c) => {
-      i.size = c;
-    } }, metadata: t }, _, f), h(null, s = { value: r }, a, { kind: "class", name: r.name, metadata: t }, null, e), r = s.value, t && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
-  })(), o.styles = T, o.events = {
+  }, o = new WeakMap(), b = new WeakMap(), r = n, (() => {
+    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(h[Symbol.metadata] ?? null) : void 0;
+    g = [z({ reflect: !0 })], p = [z({ reflect: !0 })], y(n, null, g, { kind: "accessor", name: "color", static: !1, private: !1, access: { has: (s) => "color" in s, get: (s) => s.color, set: (s, c) => {
+      s.color = c;
+    } }, metadata: t }, m, v), y(n, null, p, { kind: "accessor", name: "size", static: !1, private: !1, access: { has: (s) => "size" in s, get: (s) => s.size, set: (s, c) => {
+      s.size = c;
+    } }, metadata: t }, _, f), y(null, i = { value: r }, a, { kind: "class", name: r.name, metadata: t }, null, e), r = i.value, t && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
+  })(), n.styles = [T, H], n.events = {
     beforestick: "beforestick",
     stick: "stick",
     beforeunstick: "beforeunstick",
@@ -116,5 +117,5 @@ let M = (() => {
   }, l(r, e), r;
 })();
 export {
-  M as SbbStickyBarElement
+  $ as SbbStickyBarElement
 };

package/core/controllers/media-matchers-controller.d.ts

@@ -4,8 +4,8 @@ export declare const SbbMediaQueryForcedColors = "(forced-colors: active)";
 export declare const SbbMediaQueryDarkMode = "(prefers-color-scheme: dark)";
 export declare const SbbMediaQueryHover = "(any-hover: hover)";
 export declare const SbbMediaQueryPointerCoarse = "(pointer: coarse)";
-export declare const SbbMediaQueryBreakpointMediumAndAbove: string;
-export declare const SbbMediaQueryBreakpointMediumAndBelow: string;
+export declare const SbbMediaQueryBreakpointLargeAndAbove: string;
+export declare const SbbMediaQueryBreakpointLargeAndBelow: string;
 export declare const SbbMediaQueryBreakpointSmallAndBelow: string;
 /**
  * A callback, which is invoked when the associated media query match

package/core/controllers/media-matchers-controller.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"media-matchers-controller.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/controllers/media-matchers-controller.ts"],"names":[],"mappings":"AAMA,OAAO,EAAY,KAAK,kBAAkB,EAAE,KAAK,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAErF,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,cAAc,CAAC;AAKjE,eAAO,MAAM,yBAAyB,4BAA4B,CAAC;AACnE,eAAO,MAAM,qBAAqB,iCAAiC,CAAC;AACpE,eAAO,MAAM,kBAAkB,uBAAuB,CAAC;AACvD,eAAO,MAAM,0BAA0B,sBAAsB,CAAC;AAC9D,eAAO,MAAM,qCAAqC,QAAuD,CAAC;AAC1G,eAAO,MAAM,qCAAqC,QAAuD,CAAC;AAC1G,eAAO,MAAM,oCAAoC,QAAsD,CAAC;AAGxG;;;GAGG;AACH,MAAM,MAAM,sBAAsB,GAAG,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;AAehE;;;;;;;GAOG;AACH,qBAAa,yBAA0B,YAAW,kBAAkB;IAGhE,OAAO,CAAC,QAAQ;gBADhB,IAAI,EAAE,sBAAsB,EACpB,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,sBAAsB,CAAC;IAK1D;;;;OAIG;IACI,OAAO,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,GAAG,IAAI;IAMtC,aAAa,IAAI,IAAI;IAoBrB,gBAAgB,IAAI,IAAI;CAWhC;AAED;;;;;;;GAOG;AACH,qBAAa,qBAAsB,SAAQ,yBAAyB;IAyBhE,OAAO,CAAC,KAAK;IAxBf,2EAA2E;IAC3E,OAAO,CAAC,MAAM,CAAC,YAAY,CAAsE;IAEjG,kFAAkF;IAClF,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,SAAS,CAUxB;IAET,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAGrC;IAEF,OAAO,CAAC,QAAQ,CAAC,yBAAyB,CAAa;gBAG7C,KAAK,EAAE,sBAAsB,GAAG,WAAW,GAAG,4BAA4B,EAClF,QAAQ,EAAE,sBAAsB;IAYlC,OAAO,CAAC,MAAM,CAAC,mBAAmB;IAYlC;;;OAGG;WAEW,aAAa,IAAI,IAAI;IAOnB,aAAa,IAAI,IAAI;IAerB,gBAAgB,IAAI,IAAI;IAQxB,OAAO,IAAI,OAAO;CAWnC"}
+{"version":3,"file":"media-matchers-controller.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/controllers/media-matchers-controller.ts"],"names":[],"mappings":"AAMA,OAAO,EAAY,KAAK,kBAAkB,EAAE,KAAK,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAErF,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,cAAc,CAAC;AAKjE,eAAO,MAAM,yBAAyB,4BAA4B,CAAC;AACnE,eAAO,MAAM,qBAAqB,iCAAiC,CAAC;AACpE,eAAO,MAAM,kBAAkB,uBAAuB,CAAC;AACvD,eAAO,MAAM,0BAA0B,sBAAsB,CAAC;AAC9D,eAAO,MAAM,oCAAoC,QAAsD,CAAC;AACxG,eAAO,MAAM,oCAAoC,QAAsD,CAAC;AACxG,eAAO,MAAM,oCAAoC,QAAsD,CAAC;AAGxG;;;GAGG;AACH,MAAM,MAAM,sBAAsB,GAAG,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;AAehE;;;;;;;GAOG;AACH,qBAAa,yBAA0B,YAAW,kBAAkB;IAGhE,OAAO,CAAC,QAAQ;gBADhB,IAAI,EAAE,sBAAsB,EACpB,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,sBAAsB,CAAC;IAK1D;;;;OAIG;IACI,OAAO,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,GAAG,IAAI;IAMtC,aAAa,IAAI,IAAI;IAoBrB,gBAAgB,IAAI,IAAI;CAWhC;AAED;;;;;;;GAOG;AACH,qBAAa,qBAAsB,SAAQ,yBAAyB;IAyBhE,OAAO,CAAC,KAAK;IAxBf,2EAA2E;IAC3E,OAAO,CAAC,MAAM,CAAC,YAAY,CAAsE;IAEjG,kFAAkF;IAClF,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,SAAS,CAUxB;IAET,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAGrC;IAEF,OAAO,CAAC,QAAQ,CAAC,yBAAyB,CAAa;gBAG7C,KAAK,EAAE,sBAAsB,GAAG,WAAW,GAAG,4BAA4B,EAClF,QAAQ,EAAE,sBAAsB;IAYlC,OAAO,CAAC,MAAM,CAAC,mBAAmB;IAYlC;;;OAGG;WAEW,aAAa,IAAI,IAAI;IAOnB,aAAa,IAAI,IAAI;IAerB,gBAAgB,IAAI,IAAI;IAQxB,OAAO,IAAI,OAAO;CAWnC"}

package/core/controllers/media-matchers-controller.js

@@ -1,7 +1,7 @@
-import { S as p, a as b, b as g, c as y } from "../../sbb-tokens-B3Eka-Tz.js";
-import { isServer as n } from "lit";
-const c = (d) => d / p, k = "(forced-colors: active)", i = "(prefers-color-scheme: dark)", Q = "(any-hover: hover)", w = "(pointer: coarse)", L = `(min-width: ${c(y)}rem)`, B = `(max-width: ${c(b)}rem)`, C = `(max-width: ${c(g)}rem)`, a = /* @__PURE__ */ new Map();
-class M {
+import { S as p, a as g, b, c as y } from "../../sbb-tokens-CB1Hgctn.js";
+import { isServer as i } from "lit";
+const c = (d) => d / p, L = "(forced-colors: active)", n = "(prefers-color-scheme: dark)", k = "(any-hover: hover)", Q = "(pointer: coarse)", w = `(min-width: ${c(y)}rem)`, B = `(max-width: ${c(g)}rem)`, C = `(max-width: ${c(b)}rem)`, a = /* @__PURE__ */ new Map();
+class v {
   constructor(e, t) {
     this._queries = t, e.addController(this);
   }
@@ -11,10 +11,10 @@ class M {
    * @returns Whether the query matches or null with SSR.
    */
   matches(e) {
-    return n ? null : matchMedia(e).matches;
+    return i ? null : matchMedia(e).matches;
   }
   hostConnected() {
-    if (!n)
+    if (!i)
       for (const [e, t] of Object.entries(this._queries)) {
         const r = a.get(e);
         if (r)
@@ -32,17 +32,17 @@ class M {
     }
   }
 }
-const s = class s extends M {
+const s = class s extends v {
   constructor(e, t) {
     const r = () => {
       t(this.matches()), this._host.toggleState("dark", this.matches());
     };
     super(e, {
-      [i]: r
+      [n]: r
     }), this._host = e, this._onChangeWithStateUpdater = r;
   }
   static _readLightDarkClass() {
-    if (n)
+    if (i)
       return null;
     const e = document.documentElement.classList;
     return ["light-dark", "dark", "light"].find((t) => e.contains(`sbb-${t}`)) ?? null;
@@ -53,24 +53,24 @@ const s = class s extends M {
    */
   // eslint-disable-next-line lyne/needs-super-call-rule
   static requestUpdate() {
-    const e = a.get(i);
+    const e = a.get(n);
     e && e.handlers.forEach((t) => t(e.mediaQueryList.matches));
   }
   hostConnected() {
-    const e = (a.get(i)?.handlers.size ?? 0) === 0;
+    const e = (a.get(n)?.handlers.size ?? 0) === 0;
     super.hostConnected(), e && s._observer.observe(document.documentElement, s._observerConfig), this._onChangeWithStateUpdater();
   }
   hostDisconnected() {
-    super.hostDisconnected(), (a.get(i)?.handlers.size ?? 0) === 0 && s._observer.disconnect();
+    super.hostDisconnected(), (a.get(n)?.handlers.size ?? 0) === 0 && s._observer.disconnect();
   }
   matches() {
-    if (n)
+    if (i)
       return !1;
     const e = getComputedStyle(this._host).getPropertyValue("color-scheme"), t = e.includes("dark"), r = e.trim() === "dark";
-    return super.matches(i) && t || r;
+    return super.matches(n) && t || r;
   }
 };
-s._currentMode = s._readLightDarkClass(), s._observer = n ? null : new MutationObserver((e) => {
+s._currentMode = s._readLightDarkClass(), s._observer = i ? null : new MutationObserver((e) => {
   if (e[0].oldValue !== document.documentElement.getAttribute("class")) {
     const t = s._readLightDarkClass();
     s._currentMode !== t && (s.requestUpdate(), s._currentMode = t);
@@ -82,12 +82,12 @@ s._currentMode = s._readLightDarkClass(), s._observer = n ? null : new MutationO
 let l = s;
 export {
   l as SbbDarkModeController,
-  M as SbbMediaMatcherController,
-  L as SbbMediaQueryBreakpointMediumAndAbove,
-  B as SbbMediaQueryBreakpointMediumAndBelow,
+  v as SbbMediaMatcherController,
+  w as SbbMediaQueryBreakpointLargeAndAbove,
+  B as SbbMediaQueryBreakpointLargeAndBelow,
   C as SbbMediaQueryBreakpointSmallAndBelow,
-  i as SbbMediaQueryDarkMode,
-  k as SbbMediaQueryForcedColors,
-  Q as SbbMediaQueryHover,
-  w as SbbMediaQueryPointerCoarse
+  n as SbbMediaQueryDarkMode,
+  L as SbbMediaQueryForcedColors,
+  k as SbbMediaQueryHover,
+  Q as SbbMediaQueryPointerCoarse
 };

package/core/controllers/slot-state-controller.d.ts

@@ -1,33 +1,45 @@
 import { ReactiveController, ReactiveControllerHost } from 'lit';
+export declare class SbbSlottedChangeEvent extends Event {
+    readonly slot: HTMLSlotElement;
+    constructor(slot: HTMLSlotElement);
+}
 /**
- * This controller checks for slotted children. From these it generates
- * a list of used slot names (`unnamed` for children without a slot attribute)
- * and adds this to the `data-slot-names` attribute, as a space separated list.
+ * This controller checks for slotted children. From these it updates
+ * the ElementInternals states with the pattern `slotted-<name>` or `slotted`
+ * for the unnamed slot.
  *
- * This allows CSS attribute selector to display/hide/configure a section
- * of the component as required (see [attr~=value] selector specifically).
+ * This allows a :state(slotted-<name>) CSS selector to display/hide/configure
+ * a section of the component as required.
  *
  * @example
  * .example {
  *   display: none;
  *
- *   :host([data-slot-names~="icon"]) & {
+ *   :host(:state(slotted-icon)) & {
  *     display: inline;
  *   }
  * }
  *
- * https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors
+ * https://developer.mozilla.org/en-US/docs/Web/CSS/:state
  */
 export declare class SbbSlotStateController implements ReactiveController {
     private _host;
-    private _onChangeCallback;
-    readonly slots: Set<string>;
+    private _internals;
     private _textObserver;
-    constructor(_host: ReactiveControllerHost & HTMLElement, _onChangeCallback?: (() => void) | null);
-    hostConnected(): void;
-    hostDisconnected(): void;
+    constructor(_host: ReactiveControllerHost & HTMLElement, _internals: ElementInternals);
+    hostConnected: ReactiveController['hostConnected'];
     private _slotchangeHandler;
-    private _syncSlots;
-    private _updateSlotNameAttribute;
+    private _handleSlotChange;
+    private _updateSlottedState;
+    private _observeTextNodesInSlot;
+    private _hasSlottedContent;
+}
+declare global {
+    interface HTMLElementEventMap {
+        slottedchange: SbbSlottedChangeEvent;
+    }
+    interface ShadowRootEventMap {
+        slottedchange: SbbSlottedChangeEvent;
+    }
 }
 //# sourceMappingURL=slot-state-controller.d.ts.map

package/core/controllers/slot-state-controller.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"slot-state-controller.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/controllers/slot-state-controller.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,kBAAkB,EAAE,KAAK,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAErF;;;;;;;;;;;;;;;;;;GAkBG;AACH,qBAAa,sBAAuB,YAAW,kBAAkB;IAmB7D,OAAO,CAAC,KAAK;IACb,OAAO,CAAC,iBAAiB;IAnB3B,SAAgB,KAAK,cAAqB;IAE1C,OAAO,CAAC,aAAa,CAahB;gBAGK,KAAK,EAAE,sBAAsB,GAAG,WAAW,EAC3C,iBAAiB,GAAE,CAAC,MAAM,IAAI,CAAC,GAAG,IAAW;IAKhD,aAAa,IAAI,IAAI;IAKrB,gBAAgB,IAAI,IAAI;IAO/B,OAAO,CAAC,kBAAkB,CAExB;IAEF,OAAO,CAAC,UAAU;IA2BlB,OAAO,CAAC,wBAAwB;CAajC"}
+{"version":3,"file":"slot-state-controller.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/controllers/slot-state-controller.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,kBAAkB,EAAE,KAAK,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAErF,qBAAa,qBAAsB,SAAQ,KAAK;aACX,IAAI,EAAE,eAAe;gBAArB,IAAI,EAAE,eAAe;CAGzD;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,qBAAa,sBAAuB,YAAW,kBAAkB;IAa7D,OAAO,CAAC,KAAK;IACb,OAAO,CAAC,UAAU;IAbpB,OAAO,CAAC,aAAa,CAShB;gBAGK,KAAK,EAAE,sBAAsB,GAAG,WAAW,EAC3C,UAAU,EAAE,gBAAgB;IAK/B,aAAa,EAAE,kBAAkB,CAAC,eAAe,CAAC,CAavD;IAEF,OAAO,CAAC,kBAAkB;IAc1B,OAAO,CAAC,iBAAiB;IAOzB,OAAO,CAAC,mBAAmB;IAY3B,OAAO,CAAC,uBAAuB;IAc/B,OAAO,CAAC,kBAAkB;CAW3B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,mBAAmB;QAC3B,aAAa,EAAE,qBAAqB,CAAC;KACtC;IACD,UAAU,kBAAkB;QAC1B,aAAa,EAAE,qBAAqB,CAAC;KACtC;CACF"}

package/core/controllers/slot-state-controller.js

@@ -1,31 +1,37 @@
-import { isServer as n } from "lit";
-class h {
-  constructor(s, t = null) {
-    this._host = s, this._onChangeCallback = t, this.slots = /* @__PURE__ */ new Set(), this._textObserver = !n && new MutationObserver(() => {
-      Array.from(this._host.childNodes).filter((e) => e.nodeType === e.TEXT_NODE).some((e) => e.textContent?.trim()) ? this.slots.add("unnamed") : Array.from(this._host.children).every((e) => e.slot) && this.slots.delete("unnamed"), this._updateSlotNameAttribute();
-    }), this._slotchangeHandler = (o) => {
-      this._syncSlots(o.target);
+import { isServer as h } from "lit";
+class n extends Event {
+  constructor(e) {
+    super("slottedchange", { composed: !0 }), this.slot = e;
+  }
+}
+class r {
+  constructor(e, t) {
+    this._host = e, this._internals = t, this._textObserver = !h && new MutationObserver(() => {
+      const s = this._host.shadowRoot.querySelector("slot:not([name])");
+      s ? this._updateSlottedState(s) : this._textObserver.disconnect();
+    }), this.hostConnected = () => {
+      this._host.shadowRoot?.addEventListener("slotchange", (s) => this._slotchangeHandler(s, s.target)), this._host.shadowRoot?.addEventListener("slottedchange", (s) => this._slotchangeHandler(s, s.slot), { capture: !0 }), this._internals.shadowRoot?.querySelectorAll("slot").forEach((s) => this._handleSlotChange(s)), this.hostConnected = void 0;
     }, this._host.addController(this);
   }
-  hostConnected() {
-    this._syncSlots(...this._host.shadowRoot?.querySelectorAll?.("slot") ?? []), this._host.shadowRoot?.addEventListener("slotchange", this._slotchangeHandler);
+  _slotchangeHandler(e, t) {
+    const s = this._host.shadowRoot.contains(t) ? t : e.composedPath().find((o) => o instanceof HTMLSlotElement && this._host.shadowRoot.contains(o));
+    s && this._handleSlotChange(s);
+  }
+  _handleSlotChange(e) {
+    this._updateSlottedState(e), e.name || this._observeTextNodesInSlot(e);
   }
-  hostDisconnected() {
-    this._host.shadowRoot?.removeEventListener("slotchange", this._slotchangeHandler), this._textObserver.disconnect();
+  _updateSlottedState(e) {
+    const t = e.name ? `slotted-${e.name}` : "slotted", s = this._hasSlottedContent(e);
+    s && !this._internals.states.has(t) ? (this._internals.states.add(t), this._host.dispatchEvent(new n(e))) : !s && this._internals.states.has(t) && (this._internals.states.delete(t), this._host.dispatchEvent(new n(e)));
   }
-  _syncSlots(...s) {
-    this._textObserver.disconnect();
-    for (const t of s) {
-      const o = t.name || "unnamed";
-      t.assignedNodes().some((e) => "tagName" in e || e.textContent?.trim()) ? this.slots.add(o) : this.slots.delete(o), this._updateSlotNameAttribute();
-    }
-    s.find((t) => !t.name)?.assignedNodes().filter((t) => t.nodeType === t.TEXT_NODE).forEach((t) => this._textObserver.observe(t, { characterData: !0 }));
+  _observeTextNodesInSlot(e) {
+    this._textObserver.disconnect(), e.assignedNodes().filter((t) => t.nodeType === t.TEXT_NODE).forEach((t) => this._textObserver.observe(t, { characterData: !0 }));
   }
-  _updateSlotNameAttribute() {
-    const s = this._host.getAttribute("data-slot-names"), t = [...this.slots].sort().join(" ");
-    t ? this._host.getAttribute("data-slot-names") !== t && this._host.setAttribute("data-slot-names", t) : this._host.removeAttribute("data-slot-names"), t !== s && this._onChangeCallback?.();
+  _hasSlottedContent(e) {
+    return e.name ? e.assignedElements().some((t) => !(t instanceof HTMLSlotElement) || this._hasSlottedContent(t)) : e.assignedNodes().some((t) => t instanceof HTMLSlotElement ? this._hasSlottedContent(t) : t.nodeType !== t.TEXT_NODE || !!t.textContent?.trim());
   }
 }
 export {
-  h as SbbSlotStateController
+  r as SbbSlotStateController,
+  n as SbbSlottedChangeEvent
 };

package/core/controllers.js

@@ -1,24 +1,25 @@
 import { SbbEscapableOverlayController as o } from "./controllers/escapable-overlay-controller.js";
-import { SbbIdReferenceController as l } from "./controllers/id-reference-controller.js";
-import { SbbInertController as a } from "./controllers/inert-controller.js";
+import { SbbIdReferenceController as t } from "./controllers/id-reference-controller.js";
+import { SbbInertController as l } from "./controllers/inert-controller.js";
 import { SbbLanguageController as S } from "./controllers/language-controller.js";
-import { SbbDarkModeController as i, SbbMediaMatcherController as M, SbbMediaQueryBreakpointMediumAndAbove as p, SbbMediaQueryBreakpointMediumAndBelow as m, SbbMediaQueryBreakpointSmallAndBelow as u, SbbMediaQueryDarkMode as C, SbbMediaQueryForcedColors as y, SbbMediaQueryHover as f, SbbMediaQueryPointerCoarse as x } from "./controllers/media-matchers-controller.js";
-import { SbbSlotStateController as k } from "./controllers/slot-state-controller.js";
-import { SbbOverlayPositionController as c } from "./controllers/overlay-position-controller.js";
+import { SbbDarkModeController as i, SbbMediaMatcherController as p, SbbMediaQueryBreakpointLargeAndAbove as C, SbbMediaQueryBreakpointLargeAndBelow as M, SbbMediaQueryBreakpointSmallAndBelow as y, SbbMediaQueryDarkMode as f, SbbMediaQueryForcedColors as m, SbbMediaQueryHover as u, SbbMediaQueryPointerCoarse as x } from "./controllers/media-matchers-controller.js";
+import { SbbSlotStateController as g, SbbSlottedChangeEvent as k } from "./controllers/slot-state-controller.js";
+import { SbbOverlayPositionController as B } from "./controllers/overlay-position-controller.js";
 export {
   i as SbbDarkModeController,
   o as SbbEscapableOverlayController,
-  l as SbbIdReferenceController,
-  a as SbbInertController,
+  t as SbbIdReferenceController,
+  l as SbbInertController,
   S as SbbLanguageController,
-  M as SbbMediaMatcherController,
-  p as SbbMediaQueryBreakpointMediumAndAbove,
-  m as SbbMediaQueryBreakpointMediumAndBelow,
-  u as SbbMediaQueryBreakpointSmallAndBelow,
-  C as SbbMediaQueryDarkMode,
-  y as SbbMediaQueryForcedColors,
-  f as SbbMediaQueryHover,
+  p as SbbMediaMatcherController,
+  C as SbbMediaQueryBreakpointLargeAndAbove,
+  M as SbbMediaQueryBreakpointLargeAndBelow,
+  y as SbbMediaQueryBreakpointSmallAndBelow,
+  f as SbbMediaQueryDarkMode,
+  m as SbbMediaQueryForcedColors,
+  u as SbbMediaQueryHover,
   x as SbbMediaQueryPointerCoarse,
-  c as SbbOverlayPositionController,
-  k as SbbSlotStateController
+  B as SbbOverlayPositionController,
+  g as SbbSlotStateController,
+  k as SbbSlottedChangeEvent
 };

package/core/decorators.d.ts

@@ -8,5 +8,4 @@ export * from './decorators/host-attributes.js';
 export * from './decorators/id-reference.js';
 export * from './decorators/omit-empty-converter.js';
 export * from './decorators/plain-date.js';
-export * from './decorators/slot-state.js';
 //# sourceMappingURL=decorators.d.ts.map

package/core/decorators.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"decorators.d.ts","sourceRoot":"","sources":["../../../src/elements/core/decorators.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,cAAc,4BAA4B,CAAC;AAC3C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,wCAAwC,CAAC;AACvD,cAAc,iCAAiC,CAAC;AAChD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,sCAAsC,CAAC;AACrD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC"}
+{"version":3,"file":"decorators.d.ts","sourceRoot":"","sources":["../../../src/elements/core/decorators.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,cAAc,4BAA4B,CAAC;AAC3C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,wCAAwC,CAAC;AACvD,cAAc,iCAAiC,CAAC;AAChD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,sCAAsC,CAAC;AACrD,cAAc,4BAA4B,CAAC"}

package/core/decorators.js

@@ -3,17 +3,15 @@ import { getOverride as p } from "./decorators/get-override.js";
 import { handleDistinctChange as m } from "./decorators/handle-distinct-change.js";
 import { hostAttributes as n } from "./decorators/host-attributes.js";
 import { idReference as a } from "./decorators/id-reference.js";
-import { omitEmptyConverter as s } from "./decorators/omit-empty-converter.js";
-import { plainDate as d, plainDateConverter as h } from "./decorators/plain-date.js";
-import { slotState as C } from "./decorators/slot-state.js";
+import { omitEmptyConverter as d } from "./decorators/omit-empty-converter.js";
+import { plainDate as l, plainDateConverter as s } from "./decorators/plain-date.js";
 export {
   t as forceType,
   p as getOverride,
   m as handleDistinctChange,
   n as hostAttributes,
   a as idReference,
-  s as omitEmptyConverter,
-  d as plainDate,
-  h as plainDateConverter,
-  C as slotState
+  d as omitEmptyConverter,
+  l as plainDate,
+  s as plainDateConverter
 };

package/core/dom/breakpoint.d.ts

@@ -1,4 +1,4 @@
-export declare const breakpoints: readonly ["zero", "micro", "small", "medium", "large", "wide", "ultra"];
+export declare const breakpoints: readonly ["zero", "small", "large", "ultra"];
 export type Breakpoint = (typeof breakpoints)[number];
 /**
  * Checks whether the document matches a particular media query.

package/core/dom/breakpoint.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"breakpoint.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/dom/breakpoint.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,WAAW,yEAA0E,CAAC;AACnG,MAAM,MAAM,UAAU,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC;AAEtD;;;;;;;;GAQG;AACH,wBAAgB,YAAY,CAC1B,IAAI,CAAC,EAAE,UAAU,EACjB,EAAE,CAAC,EAAE,UAAU,EACf,UAAU,CAAC,EAAE;IAAE,oBAAoB,EAAE,OAAO,CAAA;CAAE,GAC7C,OAAO,GAAG,IAAI,CAsBhB"}
+{"version":3,"file":"breakpoint.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/dom/breakpoint.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,WAAW,8CAA+C,CAAC;AACxE,MAAM,MAAM,UAAU,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC;AAEtD;;;;;;;;GAQG;AACH,wBAAgB,YAAY,CAC1B,IAAI,CAAC,EAAE,UAAU,EACjB,EAAE,CAAC,EAAE,UAAU,EACf,UAAU,CAAC,EAAE;IAAE,oBAAoB,EAAE,OAAO,CAAA;CAAE,GAC7C,OAAO,GAAG,IAAI,CAsBhB"}

package/core/dom/breakpoint.js

@@ -1,12 +1,12 @@
 import { isServer as d } from "lit";
-const s = ["zero", "micro", "small", "medium", "large", "wide", "ultra"];
-function u(n, i, a) {
+const s = ["zero", "small", "large", "ultra"];
+function p(n, a, i) {
   if (d)
     return null;
-  const o = getComputedStyle(document.documentElement), t = n ? o.getPropertyValue(`--sbb-breakpoint-${n}-min`) : "", e = i ? `${parseFloat(o.getPropertyValue(`--sbb-breakpoint-${i}-${a?.includeMaxBreakpoint ? "max" : "min"}`)) - (a?.includeMaxBreakpoint ? 0 : 0.0625)}rem` : "", r = t && `(min-width: ${t})`, m = e && `(max-width: ${e})`, c = t && e && " and ";
+  const o = getComputedStyle(document.documentElement), t = n ? o.getPropertyValue(`--sbb-breakpoint-${n}-min`) : "", e = a ? `${parseFloat(o.getPropertyValue(`--sbb-breakpoint-${a}-${i?.includeMaxBreakpoint ? "max" : "min"}`)) - (i?.includeMaxBreakpoint ? 0 : 0.0625)}rem` : "", r = t && `(min-width: ${t})`, m = e && `(max-width: ${e})`, c = t && e && " and ";
   return window.matchMedia(`${r}${c}${m}`).matches;
 }
 export {
   s as breakpoints,
-  u as isBreakpoint
+  p as isBreakpoint
 };

package/core/i18n/i18n.js

@@ -49,7 +49,7 @@ const i = {
 }, d = {
   de: "Wagen",
   en: "Train coach",
-  fr: "Wagon du train",
+  fr: "Wagon",
   it: "Carrozza del treno"
 }, u = {
   de: "Nummer",
@@ -400,7 +400,7 @@ const i = {
 }, Y = {
   de: "Nächster Tag",
   en: "Next day",
-  fr: "Le prochain jour",
+  fr: "Jour suivant",
   it: "Giorno successivo"
 }, X = {
   de: "Vorheriger Tag",
@@ -480,7 +480,7 @@ const i = {
 }), ue = {
   de: "erweitert",
   en: "expanded",
-  fr: "est tiré",
+  fr: "étendu",
   it: "espanso"
 }, fe = {
   de: "reduziert",
@@ -495,7 +495,7 @@ const i = {
 }, ge = {
   de: "Mehr Breadcrumbs anzeigen",
   en: "Show more breadcrumbs",
-  fr: "Afficher plus breadcrumbs",
+  fr: "Afficher plus de fils d’Ariane",
   it: "Mostra più breadcrumbs"
 }, pe = {
   de: "Feldinhalt löschen",
@@ -550,7 +550,7 @@ const i = {
 }, Te = {
   de: "Nächste Seite",
   en: "Next page",
-  fr: "Prochaine page",
+  fr: "Page suivante",
   it: "Pagina successiva"
 }, we = {
   de: "Vorherige Seite",
@@ -585,7 +585,7 @@ const i = {
 }, ke = {
   de: "Muss gesetzt sein.",
   en: "Must be checked.",
-  fr: "Doit être défini.",
+  fr: "Doit être cochée.",
   it: "Deve essere impostato."
 }, Fe = {
   de: "Auswahl erforderlich.",

package/core/interfaces/types.d.ts

@@ -1,6 +1,6 @@
 export type SbbLanguage = 'de' | 'en' | 'fr' | 'it';
 export type SbbTime = `${number}:${number}:${number}`;
-export type SbbHorizontalFrom = 'zero' | 'micro' | 'small' | 'medium' | 'large' | 'wide' | 'ultra';
+export type SbbHorizontalFrom = 'zero' | 'small' | 'large' | 'ultra';
 export type SbbIconPlacement = 'start' | 'end';
 export type SbbOccupancy = 'high' | 'medium' | 'low' | 'none';
 export type SbbOrientation = 'horizontal' | 'vertical';

package/core/interfaces/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/interfaces/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEpD,MAAM,MAAM,OAAO,GAAG,GAAG,MAAM,IAAI,MAAM,IAAI,MAAM,EAAE,CAAC;AAEtD,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;AAEnG,MAAM,MAAM,gBAAgB,GAAG,OAAO,GAAG,KAAK,CAAC;AAE/C,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,QAAQ,GAAG,KAAK,GAAG,MAAM,CAAC;AAE9D,MAAM,MAAM,cAAc,GAAG,YAAY,GAAG,UAAU,CAAC;AAEvD,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AAE7D,MAAM,MAAM,cAAc,GAAG,qBAAqB,GAAG,sBAAsB,GAAG,mBAAmB,CAAC;AAElG,MAAM,MAAM,sBAAsB,GAAG,aAAa,GAAG,cAAc,CAAC;AAEpE,MAAM,MAAM,oBAAoB,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;AAE/E,MAAM,WAAW,qBAAqB;IACpC,IAAI,EAAE,SAAS,CAAC;IAChB,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,UAAU,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/interfaces/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEpD,MAAM,MAAM,OAAO,GAAG,GAAG,MAAM,IAAI,MAAM,IAAI,MAAM,EAAE,CAAC;AAEtD,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;AAErE,MAAM,MAAM,gBAAgB,GAAG,OAAO,GAAG,KAAK,CAAC;AAE/C,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,QAAQ,GAAG,KAAK,GAAG,MAAM,CAAC;AAE9D,MAAM,MAAM,cAAc,GAAG,YAAY,GAAG,UAAU,CAAC;AAEvD,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AAE7D,MAAM,MAAM,cAAc,GAAG,qBAAqB,GAAG,sBAAsB,GAAG,mBAAmB,CAAC;AAElG,MAAM,MAAM,sBAAsB,GAAG,aAAa,GAAG,cAAc,CAAC;AAEpE,MAAM,MAAM,oBAAoB,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;AAE/E,MAAM,WAAW,qBAAqB;IACpC,IAAI,EAAE,SAAS,CAAC;IAChB,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,UAAU,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB"}

package/core/mixins/element-internals-mixin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"element-internals-mixin.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/mixins/element-internals-mixin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,UAAU,EAA2B,MAAM,KAAK,CAAC;AAEzE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AA8C5D,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,SAAS;QACjB,2BAA2B,EAAE,OAAO,GAAG,IAAI,CAAC;QAC5C,oBAAoB,EAAE,SAAS,OAAO,EAAE,GAAG,IAAI,CAAC;QAChD,uBAAuB,EAAE,SAAS,OAAO,EAAE,GAAG,IAAI,CAAC;QACnD,mBAAmB,EAAE,SAAS,OAAO,EAAE,GAAG,IAAI,CAAC;QAC/C,wBAAwB,EAAE,SAAS,OAAO,EAAE,GAAG,IAAI,CAAC;QACpD,sBAAsB,EAAE,SAAS,OAAO,EAAE,GAAG,IAAI,CAAC;QAClD,gBAAgB,EAAE,SAAS,OAAO,EAAE,GAAG,IAAI,CAAC;KAC7C;CACF;AAyKD,MAAM,WAAW,8BAA8B;IAC7C,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;CACjC;AAED,MAAM,CAAC,OAAO,CAAC,QAAQ,OAAO,4BAA4B;IACxD,SAAS,CAAC,QAAQ,CAAC,SAAS,EAAE,gBAAgB,CAAC;IAC/C,SAAS,CAAC,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,OAAO,GAAG,IAAI;CAC5D;AAED;;;GAGG;AACH,eAAO,MAAM,kBAAkB,GAC7B,WAAW,SAAS,OAAO,EAAE,GAAG,IAAI,EACpC,GAAG,aAAa,CAAC,OAAO,GAAG,IAAI,CAAC,EAAE,KACjC,OAAO,EAAE,GAAG,IAGd,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,kBAAkB,GAC7B,WAAW,SAAS,OAAO,EAAE,GAAG,IAAI,EACpC,GAAG,mBAAmB,CAAC,OAAO,GAAG,IAAI,CAAC,EAAE,KACvC,OAAO,EAAE,GAAG,IAId,CAAC;AAEF;;;GAGG;AAEH,eAAO,MAAM,wBAAwB,GAAI,CAAC,SAAS,mBAAmB,CAAC,UAAU,CAAC,EAChF,YAAY,CAAC,KACZ,mBAAmB,CAAC,4BAA4B,CAAC,GAAG,CAAC,GAAG,8BA2C1D,CAAC"}
+{"version":3,"file":"element-internals-mixin.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/mixins/element-internals-mixin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,UAAU,EAA2B,MAAM,KAAK,CAAC;AAIzE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AA8C5D,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,SAAS;QACjB,2BAA2B,EAAE,OAAO,GAAG,IAAI,CAAC;QAC5C,oBAAoB,EAAE,SAAS,OAAO,EAAE,GAAG,IAAI,CAAC;QAChD,uBAAuB,EAAE,SAAS,OAAO,EAAE,GAAG,IAAI,CAAC;QACnD,mBAAmB,EAAE,SAAS,OAAO,EAAE,GAAG,IAAI,CAAC;QAC/C,wBAAwB,EAAE,SAAS,OAAO,EAAE,GAAG,IAAI,CAAC;QACpD,sBAAsB,EAAE,SAAS,OAAO,EAAE,GAAG,IAAI,CAAC;QAClD,gBAAgB,EAAE,SAAS,OAAO,EAAE,GAAG,IAAI,CAAC;KAC7C;CACF;AAyKD,MAAM,WAAW,8BAA8B;IAC7C,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;CACjC;AAED,MAAM,CAAC,OAAO,CAAC,QAAQ,OAAO,4BAA4B;IACxD,SAAS,CAAC,QAAQ,CAAC,SAAS,EAAE,gBAAgB,CAAC;IAC/C,SAAS,CAAC,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,OAAO,GAAG,IAAI;CAC5D;AAED;;;GAGG;AACH,eAAO,MAAM,kBAAkB,GAC7B,WAAW,SAAS,OAAO,EAAE,GAAG,IAAI,EACpC,GAAG,aAAa,CAAC,OAAO,GAAG,IAAI,CAAC,EAAE,KACjC,OAAO,EAAE,GAAG,IAGd,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,kBAAkB,GAC7B,WAAW,SAAS,OAAO,EAAE,GAAG,IAAI,EACpC,GAAG,mBAAmB,CAAC,OAAO,GAAG,IAAI,CAAC,EAAE,KACvC,OAAO,EAAE,GAAG,IAId,CAAC;AAEF;;;GAGG;AAEH,eAAO,MAAM,wBAAwB,GAAI,CAAC,SAAS,mBAAmB,CAAC,UAAU,CAAC,EAChF,YAAY,CAAC,KACZ,mBAAmB,CAAC,4BAA4B,CAAC,GAAG,CAAC,GAAG,8BA4C1D,CAAC"}

package/core/mixins/element-internals-mixin.js

@@ -1,5 +1,6 @@
-import { isServer as E } from "lit";
-const g = E || !CSS.supports("selector(:state(loading))") ? class extends Set {
+import { isServer as p } from "lit";
+import { SbbSlotStateController as E } from "../controllers.js";
+const g = p || !CSS.supports("selector(:state(loading))") ? class extends Set {
   constructor(e) {
     super(), this._host = e, this._host.addController(this);
   }
@@ -19,7 +20,7 @@ const g = E || !CSS.supports("selector(:state(loading))") ? class extends Set {
     this._host.toggleAttribute(`state--${e}`, a);
   }
 } : null;
-if (!E) {
+if (!p) {
   let h = 0;
   const e = (r) => r.shadowRoot?.host ?? (r instanceof Element ? r : (() => {
     throw new Error("Unable to resolve related element! This should never happen.");
@@ -95,10 +96,10 @@ if (!E) {
       }
   }
 }
-const y = (h, ...e) => {
+const S = (h, ...e) => {
   const a = e.filter((c) => !!c);
   return h?.length ? h.concat(a) : e.length ? a : null;
-}, O = (h, ...e) => {
+}, w = (h, ...e) => {
   e = e.filter((c) => !!c);
   const a = h?.filter((c) => !e.includes(c)) ?? null;
   return a?.length ? a : null;
@@ -116,7 +117,7 @@ const y = (h, ...e) => {
         for (const r of this.getAttributeNames().filter((d) => d.startsWith("state--")))
           this.internals.states.add(r.slice(7)), this.removeAttribute(r);
       const u = this.constructor.role;
-      u && (this.internals.role = u);
+      u && (this.internals.role = u), this.addController(new E(this, this.internals));
     }
     toggleState(c, u) {
       u || u !== !1 && !this.internals.states.has(c) ? this.internals.states.add(c) : this.internals.states.delete(c);
@@ -126,6 +127,6 @@ const y = (h, ...e) => {
 };
 export {
   A as SbbElementInternalsMixin,
-  y as appendAriaElements,
-  O as removeAriaElements
+  S as appendAriaElements,
+  w as removeAriaElements
 };