@sbb-esta/lyne-elements 1.14.0 → 1.15.0

package/checkbox/checkbox-panel/checkbox-panel.d.ts

@@ -31,7 +31,7 @@ export declare class SbbCheckboxPanelElement extends SbbCheckboxPanelElement_bas
      * in relation to the parent selection panel changes.
      */
     protected stateChange: EventEmitter<SbbCheckboxPanelStateChange>;
-    protected willUpdate(changedProperties: PropertyValues<this>): Promise<void>;
+    protected willUpdate(changedProperties: PropertyValues<this>): void;
     protected render(): TemplateResult;
 }
 declare global {

package/checkbox/checkbox-panel/checkbox-panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox-panel.d.ts","sourceRoot":"","sources":["../../../../src/elements/checkbox/checkbox-panel/checkbox-panel.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EAEV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAIb,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AACtD,OAAO,KAAK,EACV,qBAAqB,EACrB,sBAAsB,EACtB,cAAc,EACf,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAGL,KAAK,YAAY,EAElB,MAAM,sBAAsB,CAAC;AAG9B,OAAO,6BAA6B,CAAC;AACrC,OAAO,0BAA0B,CAAC;AAElC,MAAM,MAAM,2BAA2B,GAAG,OAAO,CAC/C,cAAc,EACd,sBAAsB,GAAG,qBAAqB,CAC/C,CAAC;;AAEF;;;;;;;;;;;GAWG;AACH,qBAGM,uBAAwB,SAAQ,4BAErC;IACC,OAAuB,MAAM,EAAE,cAAc,CAA2C;IAGxF,gBAAuB,MAAM;;;;MAIlB;IAEX,oBAAoB;IACpB,SAEgB,IAAI,EAAE,YAAY,CAAO;IAEzC;;;;OAIG;IACH,SAAS,CAAC,WAAW,EAAE,YAAY,CAAC,2BAA2B,CAAC,CAI9D;cAEuB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;cAkBxE,MAAM,IAAI,cAAc;CA8B5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,oBAAoB,EAAE,uBAAuB,CAAC;KAC/C;CACF"}
+{"version":3,"file":"checkbox-panel.d.ts","sourceRoot":"","sources":["../../../../src/elements/checkbox/checkbox-panel/checkbox-panel.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EAEV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAIb,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AACtD,OAAO,KAAK,EACV,qBAAqB,EACrB,sBAAsB,EACtB,cAAc,EACf,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAGL,KAAK,YAAY,EAElB,MAAM,sBAAsB,CAAC;AAG9B,OAAO,6BAA6B,CAAC;AACrC,OAAO,0BAA0B,CAAC;AAElC,MAAM,MAAM,2BAA2B,GAAG,OAAO,CAC/C,cAAc,EACd,sBAAsB,GAAG,qBAAqB,CAC/C,CAAC;;AAEF;;;;;;;;;;;GAWG;AACH,qBAGM,uBAAwB,SAAQ,4BAErC;IACC,OAAuB,MAAM,EAAE,cAAc,CAA2C;IAGxF,gBAAuB,MAAM;;;;MAIlB;IAEX,oBAAoB;IACpB,SAEgB,IAAI,EAAE,YAAY,CAAO;IAEzC;;;;OAIG;IACH,SAAS,CAAC,WAAW,EAAE,YAAY,CAAC,2BAA2B,CAAC,CAI9D;cAEiB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAkBzD,MAAM,IAAI,cAAc;CA8B5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,oBAAoB,EAAE,uBAAuB,CAAC;KAC/C;CACF"}

package/checkbox/checkbox-panel.js

@@ -4,8 +4,8 @@ var k = (e) => {
 var x = (e, t, s) => t.has(e) || k("Cannot " + s);
 var f = (e, t, s) => (x(e, t, "read from private field"), s ? s.call(e) : t.get(e)), g = (e, t, s) => t.has(e) ? k("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(e) : t.set(e, s), b = (e, t, s, i) => (x(e, t, "write to private field"), i ? i.call(e, s) : t.set(e, s), s);
 import { __runInitializers as h, __esDecorate as z } from "tslib";
-import { LitElement as S, html as C, nothing as y } from "lit";
-import { customElement as v, property as E } from "lit/decorators.js";
+import { LitElement as S, html as C, nothing as v } from "lit";
+import { customElement as y, property as E } from "lit/decorators.js";
 import { slotState as w, getOverride as $ } from "../core/decorators.js";
 import { EventEmitter as D } from "../core/eventing.js";
 import { SbbPanelMixin as I, SbbUpdateSchedulerMixin as M, panelCommonStyle as O } from "../core/mixins.js";
@@ -14,7 +14,7 @@ import "../screen-reader-only.js";
 import "../visual-checkbox.js";
 let P = (() => {
   var c, l;
-  let e = [v("sbb-checkbox-panel"), w()], t, s = [], i, d = I(U(M(S))), m, p = [], u = [];
+  let e = [y("sbb-checkbox-panel"), w()], t, s = [], i, d = I(U(M(S))), m, p = [], u = [];
   var o = (l = class extends d {
     constructor() {
       super(...arguments);
@@ -28,7 +28,7 @@ let P = (() => {
     set size(a) {
       b(this, c, a);
     }
-    async willUpdate(a) {
+    willUpdate(a) {
       super.willUpdate(a), a.has("checked") && (this.toggleAttribute("data-checked", this.checked), this.checked !== a.get("checked") && this.stateChange.emit({ type: "checked", checked: this.checked })), a.has("disabled") && this.disabled !== a.get("disabled") && this.stateChange.emit({ type: "disabled", disabled: this.disabled });
     }
     render() {
@@ -53,7 +53,7 @@ let P = (() => {
               </span>
             </span>
             <slot name="subtext"></slot>
-            ${this.expansionState ? C`<sbb-screen-reader-only>${this.expansionState}</sbb-screen-reader-only>` : y}
+            ${this.expansionState ? C`<sbb-screen-reader-only>${this.expansionState}</sbb-screen-reader-only>` : v}
           </span>
         </span>
       </span>

package/checkbox/common.js

@@ -31,7 +31,7 @@ const q = (e) => (() => {
     connectedCallback() {
       super.connectedCallback(), this._group = this.closest("sbb-checkbox-group"), ["disabled", "required", "size"].forEach((t) => this.requestUpdate(t));
     }
-    async willUpdate(t) {
+    willUpdate(t) {
       super.willUpdate(t), (t.has("checked") || t.has("indeterminate")) && (this.internals.ariaChecked = this.indeterminate ? "mixed" : `${this.checked}`);
     }
     isDisabledExternally() {

package/clock/clock.d.ts

@@ -28,7 +28,7 @@ export declare class SbbClockElement extends LitElement {
     private _moveHoursHandFn;
     /** Callback function for minutes hand. */
     private _moveMinutesHandFn;
-    protected willUpdate(changedProperties: PropertyValues<this>): Promise<void>;
+    protected willUpdate(changedProperties: PropertyValues<this>): void;
     protected firstUpdated(changedProperties: PropertyValues<this>): Promise<void>;
     disconnectedCallback(): void;
     private _handlePageVisibilityChange;

package/clock/clock.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"clock.d.ts","sourceRoot":"","sources":["../../../src/elements/clock/clock.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAkB,UAAU,EAAE,MAAM,KAAK,CAAC;AAIjD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AA2CrD;;GAEG;AACH,qBAEM,eAAgB,SAAQ,UAAU;IACtC,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD;;;OAGG;IACH,SAA4B,GAAG,EAAE,OAAO,GAAG,IAAI,CAAQ;IAEvD,kCAAkC;IAClC,OAAO,CAAC,eAAe,CAAe;IAEtC,oCAAoC;IACpC,OAAO,CAAC,iBAAiB,CAAe;IAExC,oCAAoC;IACpC,OAAO,CAAC,iBAAiB,CAAe;IAExC,wCAAwC;IACxC,OAAO,CAAC,MAAM,CAAU;IAExB,0CAA0C;IAC1C,OAAO,CAAC,QAAQ,CAAU;IAE1B,0CAA0C;IAC1C,OAAO,CAAC,QAAQ,CAAU;IAE1B,0CAA0C;IAC1C,OAAO,CAAC,aAAa,CAAC,CAAiC;IAEvD,wCAAwC;IACxC,OAAO,CAAC,gBAAgB,CAAqC;IAE7D,0CAA0C;IAC1C,OAAO,CAAC,kBAAkB,CAAuC;cAExC,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;cAQlE,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;IAS7E,oBAAoB,IAAI,IAAI;IAK5C,OAAO,CAAC,2BAA2B,CAMjC;YAEY,sBAAsB;IAUpC,6FAA6F;YAC/E,WAAW;IAsBzB,sDAAsD;YACxC,UAAU;IAcxB,uEAAuE;IACvE,OAAO,CAAC,yBAAyB;IA4CjC,yGAAyG;IACzG,OAAO,CAAC,kBAAkB;IAW1B,sDAAsD;IACtD,OAAO,CAAC,eAAe;IAOvB,6CAA6C;IAC7C,OAAO,CAAC,cAAc;IAYtB,+CAA+C;IAC/C,OAAO,CAAC,gBAAgB;IAaxB,OAAO,CAAC,sBAAsB;IAK9B;;;;OAIG;IACH,OAAO,CAAC,0BAA0B;IAWlC,OAAO,CAAC,qBAAqB;IAO7B,OAAO,CAAC,2BAA2B;IAMnC,OAAO,CAAC,6BAA6B;cAOlB,MAAM,IAAI,cAAc;CA4B5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,WAAW,EAAE,eAAe,CAAC;KAC9B;CACF"}
+{"version":3,"file":"clock.d.ts","sourceRoot":"","sources":["../../../src/elements/clock/clock.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAkB,UAAU,EAAE,MAAM,KAAK,CAAC;AAIjD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AA2CrD;;GAEG;AACH,qBAEM,eAAgB,SAAQ,UAAU;IACtC,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD;;;OAGG;IACH,SAA4B,GAAG,EAAE,OAAO,GAAG,IAAI,CAAQ;IAEvD,kCAAkC;IAClC,OAAO,CAAC,eAAe,CAAe;IAEtC,oCAAoC;IACpC,OAAO,CAAC,iBAAiB,CAAe;IAExC,oCAAoC;IACpC,OAAO,CAAC,iBAAiB,CAAe;IAExC,wCAAwC;IACxC,OAAO,CAAC,MAAM,CAAU;IAExB,0CAA0C;IAC1C,OAAO,CAAC,QAAQ,CAAU;IAE1B,0CAA0C;IAC1C,OAAO,CAAC,QAAQ,CAAU;IAE1B,0CAA0C;IAC1C,OAAO,CAAC,aAAa,CAAC,CAAiC;IAEvD,wCAAwC;IACxC,OAAO,CAAC,gBAAgB,CAAqC;IAE7D,0CAA0C;IAC1C,OAAO,CAAC,kBAAkB,CAAuC;cAE9C,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAQnD,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;IAS7E,oBAAoB,IAAI,IAAI;IAK5C,OAAO,CAAC,2BAA2B,CAMjC;YAEY,sBAAsB;IAUpC,6FAA6F;YAC/E,WAAW;IAsBzB,sDAAsD;YACxC,UAAU;IAcxB,uEAAuE;IACvE,OAAO,CAAC,yBAAyB;IA4CjC,yGAAyG;IACzG,OAAO,CAAC,kBAAkB;IAW1B,sDAAsD;IACtD,OAAO,CAAC,eAAe;IAOvB,6CAA6C;IAC7C,OAAO,CAAC,cAAc;IAYtB,+CAA+C;IAC/C,OAAO,CAAC,gBAAgB;IAaxB,OAAO,CAAC,sBAAsB;IAK9B;;;;OAIG;IACH,OAAO,CAAC,0BAA0B;IAWlC,OAAO,CAAC,qBAAqB;IAO7B,OAAO,CAAC,2BAA2B;IAMnC,OAAO,CAAC,6BAA6B;cAOlB,MAAM,IAAI,cAAc;CA4B5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,WAAW,EAAE,eAAe,CAAC;KAC9B;CACF"}

package/clock.js

@@ -36,8 +36,8 @@ let it = (() => {
     set now(t) {
       h(this, r, t);
     }
-    async willUpdate(t) {
-      super.willUpdate(t), !E && t.has("now") && await this._startOrConfigureClock();
+    willUpdate(t) {
+      super.willUpdate(t), !E && t.has("now") && this._startOrConfigureClock();
     }
     async firstUpdated(t) {
       super.firstUpdated(t), E || (document.addEventListener("visibilitychange", this._handlePageVisibilityChange, !1), await this._startOrConfigureClock());

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

@@ -1,8 +1,13 @@
 import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
+declare const SbbStickyBarElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbUpdateSchedulerMixinType> & typeof LitElement;
 /**
  * A container that sticks to the bottom of the page if slotted into `sbb-container`.
  *
  * @slot - Use the unnamed slot to add content to the sticky bar.
+ * @event {CustomEvent<void>} willStick - Emits when the animation from normal content flow to `position: sticky` starts. Can be canceled.
+ * @event {CustomEvent<void>} didStick - Emits when the animation from normal content flow to `position: sticky` ends.
+ * @event {CustomEvent<void>} willUnstick - Emits when the animation from `position: sticky` to normal content flow starts. Can be canceled.
+ * @event {CustomEvent<void>} didUnstick - Emits when the animation from `position: sticky` to normal content flow ends.
  * @cssprop [--sbb-sticky-bar-padding-block=var(--sbb-spacing-responsive-xs)] - Block padding of the sticky bar.
  * @cssprop [--sbb-sticky-bar-bottom-overlapping-height=0px] - Define an additional area where
  * the sticky bar overlaps the following content on the bottom.
@@ -10,15 +15,36 @@ import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit'
  * @cssprop [--sbb-sticky-bar-z-index] - To specify a custom stack order,
  * the `z-index` can be overridden by defining this CSS variable.
  */
-export declare class SbbStickyBarElement extends LitElement {
+export declare class SbbStickyBarElement extends SbbStickyBarElement_base {
     static styles: CSSResultGroup;
+    static readonly events: {
+        readonly willStick: "willStick";
+        readonly didStick: "didStick";
+        readonly willUnstick: "willUnstick";
+        readonly didUnstick: "didUnstick";
+    };
     /** Color of the container, like transparent, white etc. */
     accessor color: 'white' | 'milk' | null;
+    /** The state of the component. */
+    private set _state(value);
+    private get _state();
+    private _willStick;
+    private _didStick;
+    private _willUnstick;
+    private _didUnstick;
     private _intersector?;
     private _observer;
     connectedCallback(): void;
+    disconnectedCallback(): void;
     protected firstUpdated(changedProperties: PropertyValues<this>): void;
-    private _toggleShadowVisibility;
+    private _detectStickyState;
+    /** Animates from normal content flow position to `position: sticky`. */
+    stick(): void;
+    /** Animates `position: sticky` to normal content flow position. */
+    unstick(): void;
+    private _stickyCallback;
+    private _unstickyCallback;
+    private _onAnimationEnd;
     protected render(): TemplateResult;
 }
 declare global {
@@ -26,4 +52,5 @@ declare global {
         'sbb-sticky-bar': SbbStickyBarElement;
     }
 }
+export {};
 //# sourceMappingURL=sticky-bar.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"sticky-bar.d.ts","sourceRoot":"","sources":["../../../../src/elements/container/sticky-bar/sticky-bar.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EACV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAOb;;;;;;;;;;GAUG;AACH,qBAKM,mBAAoB,SAAQ,UAAU;IAC1C,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,2DAA2D;IAC3D,SAA6C,KAAK,EAAE,OAAO,GAAG,MAAM,GAAG,IAAI,CAAQ;IAEnF,OAAO,CAAC,YAAY,CAAC,CAAkB;IACvC,OAAO,CAAC,SAAS,CAKd;IAEa,iBAAiB,IAAI,IAAI;cAYtB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAU9E,OAAO,CAAC,uBAAuB;cAOZ,MAAM,IAAI,cAAc;CAU5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,gBAAgB,EAAE,mBAAmB,CAAC;KACvC;CACF"}
+{"version":3,"file":"sticky-bar.d.ts","sourceRoot":"","sources":["../../../../src/elements/container/sticky-bar/sticky-bar.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EACV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;;AAWb;;;;;;;;;;;;;;GAcG;AACH,qBAKM,mBAAoB,SAAQ,wBAAmC;IACnE,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,gBAAuB,MAAM;;;;;MAKlB;IAEX,2DAA2D;IAC3D,SAA6C,KAAK,EAAE,OAAO,GAAG,MAAM,GAAG,IAAI,CAAQ;IAEnF,kCAAkC;IAClC,OAAO,KAAK,MAAM,QAEjB;IACD,OAAO,KAAK,MAAM,GAEjB;IAED,OAAO,CAAC,UAAU,CAA8E;IAChG,OAAO,CAAC,SAAS,CAA6E;IAC9F,OAAO,CAAC,YAAY,CAGlB;IACF,OAAO,CAAC,WAAW,CAA+E;IAElG,OAAO,CAAC,YAAY,CAAC,CAAkB;IACvC,OAAO,CAAC,SAAS,CAKd;IAEa,iBAAiB,IAAI,IAAI;IAgBzB,oBAAoB,IAAI,IAAI;cAMzB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAU9E,OAAO,CAAC,kBAAkB;IA+B1B,wEAAwE;IACjE,KAAK,IAAI,IAAI;IAWpB,mEAAmE;IAC5D,OAAO,IAAI,IAAI;IAYtB,OAAO,CAAC,eAAe;IAKvB,OAAO,CAAC,iBAAiB;IAKzB,OAAO,CAAC,eAAe;cAWJ,MAAM,IAAI,cAAc;CAU5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,gBAAgB,EAAE,mBAAmB,CAAC;KACvC;CACF"}

package/container/sticky-bar.js

@@ -1,51 +1,83 @@
-var h = (a) => {
+var _ = (a) => {
   throw TypeError(a);
 };
-var p = (a, s, r) => s.has(a) || h("Cannot " + r);
-var u = (a, s, r) => (p(a, s, "read from private field"), r ? r.call(a) : s.get(a)), y = (a, s, r) => s.has(a) ? h("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(a) : s.set(a, r), n = (a, s, r, e) => (p(a, s, "write to private field"), e ? e.call(a, r) : s.set(a, r), r);
-import { __runInitializers as c, __esDecorate as m } from "tslib";
-import { IntersectionController as f } from "@lit-labs/observers/intersection-controller.js";
-import { css as _, html as w, LitElement as x } from "lit";
-import { customElement as z, property as S } from "lit/decorators.js";
-import { hostAttributes as C } from "../core/decorators.js";
-const I = _`*,:before,:after{box-sizing:border-box}:host{--sbb-sticky-bar-padding-block: var(--sbb-spacing-responsive-xs);--sbb-sticky-bar-fade-in-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-5x) );--sbb-sticky-bar-fade-out-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-2x) );--sbb-sticky-bar-animation-easing: var(--sbb-animation-easing);--sbb-sticky-bar-border-radius: var(--sbb-border-radius-8x);display:contents}:host([data-sticking]){--sbb-sticky-bar-sticky-background-color: var( --sbb-container-background-color, var(--sbb-color-white) )}:host([data-sticking][color=white]){--sbb-sticky-bar-sticky-background-color: var(--sbb-color-white)}:host([data-sticking][color=milk]){--sbb-sticky-bar-sticky-background-color: var(--sbb-color-milk)}.sbb-sticky-bar__wrapper{position:sticky;inset-block-end:0;display:block;z-index:var(--sbb-sticky-bar-z-index)}.sbb-sticky-bar__wrapper:after,.sbb-sticky-bar__wrapper:before{content:"";top:0;right:0;bottom:0;left: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-layout-base-offset-responsive);margin-inline:auto;width:100%}@media (min-width: 90rem){:host(:not([data-expanded])) .sbb-sticky-bar__wrapper:before{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);transition:background-color var(--sbb-sticky-bar-fade-out-animation-duration) var(--sbb-sticky-bar-animation-easing);border-start-start-radius:var(--sbb-sticky-bar-border-radius);border-start-end-radius:var(--sbb-sticky-bar-border-radius)}:host([data-sticking]) .sbb-sticky-bar__wrapper:after{transition-duration:var(--sbb-sticky-bar-fade-in-animation-duration)}@media (forced-colors: active){:host([data-sticking]) .sbb-sticky-bar__wrapper:after{border-block-start:var(--sbb-border-width-1x) solid CanvasText;border-radius:0}}.sbb-sticky-bar{display:flex;padding-block:var(--sbb-sticky-bar-padding-block);margin-block-end:-1px}.sbb-sticky-bar:before{content:"";position:absolute;top:0;right:0;bottom:0;left: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-fade-out-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]) .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-elevation-level-11-soft-2-color),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-elevation-level-11-soft-1-color);transition-duration:var(--sbb-sticky-bar-fade-in-animation-duration)}:host(:not([data-expanded])) .sbb-sticky-bar{padding-inline:var(--sbb-layout-base-offset-responsive);margin-inline:auto;width:100%}@media (min-width: 90rem){:host(:not([data-expanded])) .sbb-sticky-bar{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-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:transparent;pointer-events:none;transition:background-color var(--sbb-sticky-bar-fade-out-animation-duration) var(--sbb-sticky-bar-animation-easing)}:host([data-sticking]) .sbb-sticky-bar__intersector:after{transition-duration:var(--sbb-sticky-bar-fade-in-animation-duration);background-color:var(--sbb-sticky-bar-sticky-background-color)}`;
-let U = (() => {
-  var o, i;
-  let a = [z("sbb-sticky-bar"), C({
+var p = (a, i, s) => i.has(a) || _("Cannot " + s);
+var g = (a, i, s) => (p(a, i, "read from private field"), s ? s.call(a) : i.get(a)), f = (a, i, s) => i.has(a) ? _("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(a) : i.set(a, s), d = (a, i, s, e) => (p(a, i, "write to private field"), e ? e.call(a, s) : i.set(a, s), s);
+import { __runInitializers as k, __esDecorate as w } from "tslib";
+import { IntersectionController as S } from "@lit-labs/observers/intersection-controller.js";
+import { css as C, LitElement as z, html as E } from "lit";
+import { customElement as U, property as A } from "lit/decorators.js";
+import { hostAttributes as R } from "../core/decorators.js";
+import { EventEmitter as c } from "../core/eventing.js";
+import { SbbUpdateSchedulerMixin as I } from "../core/mixins.js";
+const T = C`*,: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-zero-time, var(--sbb-animation-duration-5x) );--sbb-sticky-bar-fade-out-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-2x) );--sbb-sticky-bar-slide-vertically-animation-duration: var( --sbb-disable-animation-zero-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([data-sticking]:not([data-state=unsticky])){--sbb-sticky-bar-sticky-background-color: var( --sbb-container-background-color, var(--sbb-color-white) );--_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-color-white)}:host([data-sticking]:not([data-state=unsticky])[color=milk]){--sbb-sticky-bar-sticky-background-color: var(--sbb-color-milk)}: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:"";top:0;right:0;bottom:0;left: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-layout-base-offset-responsive);margin-inline:auto;width:100%}@media (min-width: 90rem){:host(:not([data-expanded])) .sbb-sticky-bar__wrapper:before{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;top:0;right:0;bottom:0;left: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-elevation-level-11-soft-2-color),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-elevation-level-11-soft-1-color)}:host(:not([data-expanded])) .sbb-sticky-bar{padding-inline:var(--sbb-layout-base-offset-responsive);margin-inline:auto;width:100%}@media (min-width: 90rem){:host(:not([data-expanded])) .sbb-sticky-bar{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-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 b, r;
+  let a = [U("sbb-sticky-bar"), R({
     slot: "sticky-bar"
-  })], s, r = [], e, l = x, d, v = [], k = [];
-  return i = class extends l {
+  })], i, s = [], e, y = I(z), u, h = [], v = [];
+  var n = (r = class extends y {
     constructor() {
       super(...arguments);
-      y(this, o);
-      n(this, o, c(this, v, null)), this._intersector = c(this, k), this._observer = new f(this, {
+      f(this, b);
+      d(this, b, k(this, h, null)), this._willStick = (k(this, v), new c(this, n.events.willStick)), this._didStick = new c(this, n.events.didStick), this._willUnstick = new c(this, n.events.willUnstick), this._didUnstick = new c(this, n.events.didUnstick), this._observer = new S(this, {
         // Although `this` is observed, we have to postpone observing
         // into firstUpdated() to achieve a correct initial state.
         target: null,
-        callback: (t) => this._toggleShadowVisibility(t[0])
+        callback: (t) => this._detectStickyState(t[0])
       });
     }
     /** Color of the container, like transparent, white etc. */
     get color() {
-      return u(this, o);
+      return g(this, b);
     }
     set color(t) {
-      n(this, o, t);
+      d(this, b, t);
+    }
+    /** The state of the component. */
+    set _state(t) {
+      this.setAttribute("data-state", t);
+    }
+    get _state() {
+      return this.getAttribute("data-state");
     }
     connectedCallback() {
-      super.connectedCallback();
+      super.connectedCallback(), this._state = "sticky", this.startUpdate();
       const t = this.closest("sbb-container");
       t && this.toggleAttribute("data-expanded", t.expanded), this._intersector && this._observer.observe(this._intersector);
     }
+    disconnectedCallback() {
+      super.disconnectedCallback(), this.toggleAttribute("data-initialized", !1);
+    }
     firstUpdated(t) {
       super.firstUpdated(t), this._intersector || (this._intersector = this.shadowRoot.querySelector(".sbb-sticky-bar__intersector"), this._observer.observe(this._intersector)), this._observer.observe(this);
     }
-    _toggleShadowVisibility(t) {
-      this.toggleAttribute("data-sticking", !t.isIntersecting && t.boundingClientRect.top > 0);
+    _detectStickyState(t) {
+      var m;
+      this.toggleAttribute("data-initialized", !0);
+      const o = !t.isIntersecting && t.boundingClientRect.top > 0, l = (m = this._intersector) == null ? void 0 : m.getBoundingClientRect(), x = this.shadowRoot.querySelector(".sbb-sticky-bar__wrapper").getBoundingClientRect();
+      this.toggleAttribute("data-slide-vertically", o && this._intersector && Math.abs(l.bottom - x.bottom) > 30), this.toggleAttribute("data-sticking", o), this.completeUpdate();
+    }
+    /** Animates from normal content flow position to `position: sticky`. */
+    stick() {
+      this._state !== "unsticky" || !this._willStick.emit() || (this._state = "sticking", this.hasAttribute("data-sticking") || this._stickyCallback());
+    }
+    /** Animates `position: sticky` to normal content flow position. */
+    unstick() {
+      this._state !== "sticky" || !this._willUnstick.emit() || (this._state = "unsticking", this.hasAttribute("data-sticking") || this._unstickyCallback());
+    }
+    _stickyCallback() {
+      this._state = "sticky", this._didStick.emit();
+    }
+    _unstickyCallback() {
+      this._didUnstick.emit(), this._state = "unsticky";
+    }
+    _onAnimationEnd(t) {
+      (this._state === "sticking" || this._state === "sticky") && t.animationName === "slide-in" ? this._stickyCallback() : this._state === "unsticking" && t.animationName === "slide-out" && this._unstickyCallback();
     }
     render() {
-      return w`
-      <div class="sbb-sticky-bar__wrapper">
+      return E`
+      <div class="sbb-sticky-bar__wrapper" @animationend=${this._onAnimationEnd}>
         <div class="sbb-sticky-bar">
           <slot></slot>
         </div>
@@ -53,13 +85,19 @@ let U = (() => {
       <div class="sbb-sticky-bar__intersector"></div>
     `;
     }
-  }, o = new WeakMap(), e = i, (() => {
-    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(l[Symbol.metadata] ?? null) : void 0;
-    d = [S({ reflect: !0 })], m(i, null, d, { kind: "accessor", name: "color", static: !1, private: !1, access: { has: (b) => "color" in b, get: (b) => b.color, set: (b, g) => {
-      b.color = g;
-    } }, metadata: t }, v, k), m(null, s = { value: e }, a, { kind: "class", name: e.name, metadata: t }, null, r), e = s.value, t && Object.defineProperty(e, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
-  })(), i.styles = I, c(e, r), e;
+  }, b = new WeakMap(), e = r, (() => {
+    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(y[Symbol.metadata] ?? null) : void 0;
+    u = [A({ reflect: !0 })], w(r, null, u, { kind: "accessor", name: "color", static: !1, private: !1, access: { has: (o) => "color" in o, get: (o) => o.color, set: (o, l) => {
+      o.color = l;
+    } }, metadata: t }, h, v), w(null, i = { value: e }, a, { kind: "class", name: e.name, metadata: t }, null, s), n = e = i.value, t && Object.defineProperty(e, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
+  })(), r.styles = T, r.events = {
+    willStick: "willStick",
+    didStick: "didStick",
+    willUnstick: "willUnstick",
+    didUnstick: "didUnstick"
+  }, k(e, s), r);
+  return n = e;
 })();
 export {
-  U as SbbStickyBarElement
+  M as SbbStickyBarElement
 };

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

@@ -0,0 +1,32 @@
+import { ReactiveController, ReactiveControllerHost } from 'lit';
+export declare const SbbMediaQueryForcedColors = "(forced-colors: active)";
+export declare const SbbMediaQueryHover = "(any-hover: hover)";
+export declare const SbbMediaQueryPointerCoarse = "(pointer: coarse)";
+export declare const SbbMediaQueryBreakpointMediumAndAbove: string;
+export declare const SbbMediaQueryBreakpointSmallAndBelow: string;
+/**
+ * A callback, which is invoked when the associated media query match
+ * status changes.
+ */
+export type SbbMediaMatcherHandler = (matches: boolean) => void;
+/**
+ * This controller allows listening to media query changes.
+ *
+ * @example
+ * new SbbMediaMatcherController(this, {
+ *   [SbbForcedColorsQuery]: (matches) => doSomething(matches),
+ * })
+ */
+export declare class SbbMediaMatcherController implements ReactiveController {
+    private _queries;
+    constructor(host: ReactiveControllerHost, _queries: Record<string, SbbMediaMatcherHandler>);
+    /**
+     * Returns whether the given query matches. Returns null with SSR.
+     * @param query The query to check against.
+     * @returns Whether the query matches or null with SSR.
+     */
+    matches(query: string): boolean | null;
+    hostConnected(): void;
+    hostDisconnected(): void;
+}
+//# sourceMappingURL=media-matchers-controller.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"media-matchers-controller.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/controllers/media-matchers-controller.ts"],"names":[],"mappings":"AAKA,OAAO,EAAY,KAAK,kBAAkB,EAAE,KAAK,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAKrF,eAAO,MAAM,yBAAyB,4BAA4B,CAAC;AACnE,eAAO,MAAM,kBAAkB,uBAAuB,CAAC;AACvD,eAAO,MAAM,0BAA0B,sBAAsB,CAAC;AAC9D,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;IAYtC,aAAa,IAAI,IAAI;IAoBrB,gBAAgB,IAAI,IAAI;CAWhC"}

package/core/controllers.d.ts

@@ -1,5 +1,6 @@
 export * from './controllers/connected-abort-controller.js';
 export * from './controllers/inert-controller.js';
 export * from './controllers/language-controller.js';
+export * from './controllers/media-matchers-controller.js';
 export * from './controllers/slot-state-controller.js';
 //# sourceMappingURL=controllers.d.ts.map

package/core/controllers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"controllers.d.ts","sourceRoot":"","sources":["../../../src/elements/core/controllers.ts"],"names":[],"mappings":"AAAA,cAAc,6CAA6C,CAAC;AAC5D,cAAc,mCAAmC,CAAC;AAClD,cAAc,sCAAsC,CAAC;AACrD,cAAc,wCAAwC,CAAC"}
+{"version":3,"file":"controllers.d.ts","sourceRoot":"","sources":["../../../src/elements/core/controllers.ts"],"names":[],"mappings":"AAAA,cAAc,6CAA6C,CAAC;AAC5D,cAAc,mCAAmC,CAAC;AAClD,cAAc,sCAAsC,CAAC;AACrD,cAAc,4CAA4C,CAAC;AAC3D,cAAc,wCAAwC,CAAC"}

package/core/controllers.js

@@ -1,6 +1,7 @@
 import { isServer as n } from "lit";
-import { readConfig as u } from "./config.js";
-class m {
+import { readConfig as b } from "./config.js";
+import { S as f, g as m, f as v } from "../sbb-tokens-Dx20OtVg.js";
+class S {
   get signal() {
     var t;
     return (t = this._abortController) == null ? void 0 : t.signal;
@@ -16,11 +17,11 @@ class m {
     (t = this._abortController) == null || t.abort(), this._abortController = void 0;
   }
 }
-const _ = ["script", "head", "template", "style"], b = /* @__PURE__ */ new Set(), f = /* @__PURE__ */ new Set();
-class A {
-  constructor(t, i = b, r = f) {
+const g = ["script", "head", "template", "style"], y = /* @__PURE__ */ new Set(), A = /* @__PURE__ */ new Set();
+class O {
+  constructor(t, e = y, i = A) {
     var s, o;
-    this._host = t, this._inertElements = i, this._inertOverlays = r, (o = (s = this._host).addController) == null || o.call(s, this);
+    this._host = t, this._inertElements = e, this._inertOverlays = i, (o = (s = this._host).addController) == null || o.call(s, this);
   }
   hostConnected() {
     this._host.isOpen && this.activate();
@@ -49,23 +50,23 @@ class A {
     }), this._inertElements.clear();
   }
   _addInertAttributes() {
-    var i, r;
+    var e, i;
     let t = this._currentOverlay();
     for (; t !== document.documentElement && t !== null; )
-      Array.from(((i = (t == null ? void 0 : t.parentElement) ?? (t == null ? void 0 : t.getRootNode())) == null ? void 0 : i.childNodes) ?? []).filter((s) => s !== t && s instanceof window.HTMLElement && !_.includes(s.localName)).forEach((s) => {
+      Array.from(((e = (t == null ? void 0 : t.parentElement) ?? (t == null ? void 0 : t.getRootNode())) == null ? void 0 : e.childNodes) ?? []).filter((s) => s !== t && s instanceof window.HTMLElement && !g.includes(s.localName)).forEach((s) => {
         this._inertElements.add(s), s.inert || (s.inert = !0, s.toggleAttribute("data-sbb-inert", !0)), s.hasAttribute("aria-hidden") || (s.setAttribute("aria-hidden", "true"), s.toggleAttribute("data-sbb-aria-hidden", !0));
-      }), t = (t == null ? void 0 : t.parentElement) ?? ((r = t == null ? void 0 : t.getRootNode()) == null ? void 0 : r.host) ?? null;
+      }), t = (t == null ? void 0 : t.parentElement) ?? ((i = t == null ? void 0 : t.getRootNode()) == null ? void 0 : i.host) ?? null;
   }
 }
-const e = class e {
+const r = class r {
   /** Get the current language. */
   static get current() {
-    const i = ((u().language ?? (n ? e._defaultLanguage : document.documentElement.getAttribute("lang"))) || e._defaultLanguage).split("-")[0];
-    return e._supportedLocales.includes(i) ? i : e._defaultLanguage;
+    const e = ((b().language ?? (n ? r._defaultLanguage : document.documentElement.getAttribute("lang"))) || r._defaultLanguage).split("-")[0];
+    return r._supportedLocales.includes(e) ? e : r._defaultLanguage;
   }
   /** Get the current language. */
   get current() {
-    return e.current;
+    return r.current;
   }
   constructor(t) {
     this._host = t, this._handlers = [], this._host.addController(this);
@@ -75,26 +76,61 @@ const e = class e {
     return this._handlers.unshift(t), this;
   }
   hostConnected() {
-    n || (e._listeners.size || e._observer.observe(document.documentElement, e._observerConfig), e._listeners.add(this), this._previousLanguage !== this.current && this._callHandlers(this._previousLanguage !== void 0));
+    n || (r._listeners.size || r._observer.observe(document.documentElement, r._observerConfig), r._listeners.add(this), this._previousLanguage !== this.current && this._callHandlers(this._previousLanguage !== void 0));
   }
   hostDisconnected() {
-    n || (this._previousLanguage = this.current, e._listeners.delete(this), e._listeners.size || e._observer.disconnect());
+    n || (this._previousLanguage = this.current, r._listeners.delete(this), r._listeners.size || r._observer.disconnect());
   }
   _callHandlers(t = !0) {
-    this._handlers.forEach((i) => i()), t && this._host.requestUpdate();
+    this._handlers.forEach((e) => e()), t && this._host.requestUpdate();
   }
 };
-e._defaultLanguage = "en", e._supportedLocales = ["en", "de", "fr", "it"], e._listeners = /* @__PURE__ */ new Set(), e._observer = n ? null : new MutationObserver((t) => {
-  t[0].oldValue !== document.documentElement.getAttribute("lang") && e._listeners.forEach((i) => i._callHandlers());
-}), e._observerConfig = {
+r._defaultLanguage = "en", r._supportedLocales = ["en", "de", "fr", "it"], r._listeners = /* @__PURE__ */ new Set(), r._observer = n ? null : new MutationObserver((t) => {
+  t[0].oldValue !== document.documentElement.getAttribute("lang") && r._listeners.forEach((e) => e._callHandlers());
+}), r._observerConfig = {
   attributeFilter: ["lang"],
   attributeOldValue: !0
 };
-let c = e;
-class C {
-  constructor(t, i = null) {
-    this._host = t, this._onChangeCallback = i, this.slots = /* @__PURE__ */ new Set(), this._slotchangeHandler = (r) => {
-      this._syncSlots(r.target);
+let u = r;
+const _ = (a) => a / f, w = "(forced-colors: active)", M = "(any-hover: hover)", N = "(pointer: coarse)", Q = `(min-width: ${_(m)}rem)`, H = `(max-width: ${_(v)}rem)`, l = /* @__PURE__ */ new Map();
+class L {
+  constructor(t, e) {
+    this._queries = e, t.addController(this);
+  }
+  /**
+   * Returns whether the given query matches. Returns null with SSR.
+   * @param query The query to check against.
+   * @returns Whether the query matches or null with SSR.
+   */
+  matches(t) {
+    if (n)
+      return null;
+    const e = l.get(t);
+    return e ? e.mediaQueryList.matches : matchMedia(t).matches;
+  }
+  hostConnected() {
+    if (!n)
+      for (const [t, e] of Object.entries(this._queries)) {
+        const i = l.get(t);
+        if (i)
+          i.handlers.add(e);
+        else {
+          const s = matchMedia(t), o = /* @__PURE__ */ new Set([e]), h = (d) => o.forEach((c) => c(d.matches));
+          s.addEventListener("change", h), l.set(t, { mediaQueryList: s, handlers: o, eventHandler: h });
+        }
+      }
+  }
+  hostDisconnected() {
+    for (const [t, e] of Object.entries(this._queries)) {
+      const i = l.get(t);
+      i && (i.handlers.delete(e), i.handlers.size || l.delete(t));
+    }
+  }
+}
+class I {
+  constructor(t, e = null) {
+    this._host = t, this._onChangeCallback = e, this.slots = /* @__PURE__ */ new Set(), this._slotchangeHandler = (i) => {
+      this._syncSlots(i.target);
     }, this._host.addController(this);
   }
   hostConnected() {
@@ -109,18 +145,24 @@ class C {
     var s;
     for (const o of t) {
       const h = o.name || "unnamed";
-      o.assignedNodes().some((l) => {
-        var d;
-        return "tagName" in l || ((d = l.textContent) == null ? void 0 : d.trim());
+      o.assignedNodes().some((d) => {
+        var c;
+        return "tagName" in d || ((c = d.textContent) == null ? void 0 : c.trim());
       }) ? this.slots.add(h) : this.slots.delete(h);
     }
-    const i = this._host.getAttribute("data-slot-names"), r = [...this.slots].sort().join(" ");
-    r ? this._host.getAttribute("data-slot-names") !== r && this._host.setAttribute("data-slot-names", r) : this._host.removeAttribute("data-slot-names"), r !== i && ((s = this._onChangeCallback) == null || s.call(this));
+    const e = this._host.getAttribute("data-slot-names"), i = [...this.slots].sort().join(" ");
+    i ? this._host.getAttribute("data-slot-names") !== i && this._host.setAttribute("data-slot-names", i) : this._host.removeAttribute("data-slot-names"), i !== e && ((s = this._onChangeCallback) == null || s.call(this));
   }
 }
 export {
-  m as SbbConnectedAbortController,
-  A as SbbInertController,
-  c as SbbLanguageController,
-  C as SbbSlotStateController
+  S as SbbConnectedAbortController,
+  O as SbbInertController,
+  u as SbbLanguageController,
+  L as SbbMediaMatcherController,
+  Q as SbbMediaQueryBreakpointMediumAndAbove,
+  H as SbbMediaQueryBreakpointSmallAndBelow,
+  w as SbbMediaQueryForcedColors,
+  M as SbbMediaQueryHover,
+  N as SbbMediaQueryPointerCoarse,
+  I as SbbSlotStateController
 };

package/core/dom/breakpoint.d.ts

@@ -6,9 +6,10 @@ export type Breakpoint = (typeof breakpoints)[number];
  *
  * @param from The breakpoint corresponding to the `min-width` value of the media query (optional).
  * @param to The breakpoint corresponding to the `max-width` value of the media query (optional).
+ * @param properties Whether the max breakpoint should be included
  * @returns A boolean indicating whether the window matches the breakpoint.
  */
 export declare function isBreakpoint(from?: Breakpoint, to?: Breakpoint, properties?: {
     includeMaxBreakpoint: boolean;
-}): boolean;
+}): boolean | null;
 //# sourceMappingURL=breakpoint.d.ts.map

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;;;;;;;GAOG;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,CAuBT"}
+{"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"}

package/core/dom.js

@@ -2,8 +2,8 @@ import { isServer as e } from "lit";
 const v = ["zero", "micro", "small", "medium", "wide", "large", "ultra"];
 function E(t, n, o) {
   if (e)
-    return !1;
-  const i = getComputedStyle(document.documentElement), s = t ? i.getPropertyValue(`--sbb-breakpoint-${t}-min`) : "", r = n ? `${parseFloat(i.getPropertyValue(`--sbb-breakpoint-${n}-${o != null && o.includeMaxBreakpoint ? "max" : "min"}`)) - (o != null && o.includeMaxBreakpoint ? 0 : 0.0625)}rem` : "", m = s && `(min-width: ${s})`, f = r && `(max-width: ${r})`, y = s && r && " and ";
+    return null;
+  const i = getComputedStyle(document.documentElement), r = t ? i.getPropertyValue(`--sbb-breakpoint-${t}-min`) : "", s = n ? `${parseFloat(i.getPropertyValue(`--sbb-breakpoint-${n}-${o != null && o.includeMaxBreakpoint ? "max" : "min"}`)) - (o != null && o.includeMaxBreakpoint ? 0 : 0.0625)}rem` : "", m = r && `(min-width: ${r})`, f = s && `(max-width: ${s})`, y = r && s && " and ";
   return window.matchMedia(`${m}${y}${f}`).matches;
 }
 function g(t) {
@@ -33,13 +33,13 @@ function x(t, n) {
 function k(t, n, o) {
   o ? t.setAttribute(n, o) : t.removeAttribute(n);
 }
-let a;
+let c;
 try {
-  a = typeof Intl < "u" && Intl.v8BreakIterator;
+  c = typeof Intl < "u" && Intl.v8BreakIterator;
 } catch {
-  a = !1;
+  c = !1;
 }
-const u = !e && /(edge)/i.test(navigator.userAgent), c = !e && /(msie|trident)/i.test(navigator.userAgent), b = !e && !!(window.chrome || a) && typeof CSS < "u" && !u && !c, h = !e && /AppleWebKit/i.test(navigator.userAgent) && !b && !u && !c, I = !e && /iPad|iPhone|iPod/.test(navigator.userAgent) && !("MSStream" in window), $ = !e && /(firefox|minefield)/i.test(navigator.userAgent), M = !e && /android/i.test(navigator.userAgent) && !c, _ = !e && /safari/i.test(navigator.userAgent) && h, W = b, B = () => !!globalThis.next;
+const u = !e && /(edge)/i.test(navigator.userAgent), a = !e && /(msie|trident)/i.test(navigator.userAgent), b = !e && !!(window.chrome || c) && typeof CSS < "u" && !u && !a, h = !e && /AppleWebKit/i.test(navigator.userAgent) && !b && !u && !a, I = !e && /iPad|iPhone|iPod/.test(navigator.userAgent) && !("MSStream" in window), $ = !e && /(firefox|minefield)/i.test(navigator.userAgent), M = !e && /android/i.test(navigator.userAgent) && !a, _ = !e && /safari/i.test(navigator.userAgent) && h, W = b, B = () => !!globalThis.next;
 function l() {
   return document.body.hasAttribute("data-sbb-scroll-disabled");
 }
@@ -86,7 +86,7 @@ export {
   I as isIOS,
   B as isNextjs,
   _ as isSafari,
-  c as isTrident,
+  a as isTrident,
   h as isWebkit,
   l as pageScrollDisabled,
   k as setOrRemoveAttribute

package/core/mixins/form-associated-checkbox-mixin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"form-associated-checkbox-mixin.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/mixins/form-associated-checkbox-mixin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,UAAU,EAAE,MAAM,KAAK,CAAC;AAMxD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AACpD,OAAO,EAAoB,KAAK,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAClF,OAAO,EACL,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,EAErB,KAAK,0BAA0B,EAChC,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAoB,KAAK,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAIlF,MAAM,CAAC,OAAO,CAAC,QAAQ,OAAO,kCAC5B,SAAQ,0BACR,YAAW,OAAO,CAAC,oBAAoB,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC;IAEvE,IAAW,OAAO,IAAI,OAAO,CAAC;IAC9B,IAAW,OAAO,CAAC,KAAK,EAAE,OAAO,EAAE;IAEnC,IAAW,QAAQ,CAAC,KAAK,EAAE,OAAO,EAAE;IACpC,IAAW,QAAQ,IAAI,OAAO,CAAC;IAE/B,IAAW,QAAQ,CAAC,KAAK,EAAE,OAAO,EAAE;IACpC,IAAW,QAAQ,IAAI,OAAO,CAAC;IAExB,iBAAiB,IAAI,IAAI;IACzB,wBAAwB,CAAC,KAAK,EAAE,gBAAgB,GAAG,IAAI,EAAE,MAAM,EAAE,iBAAiB,GAAG,IAAI;IAEhG,SAAS,CAAC,oBAAoB,IAAI,OAAO;IACzC,SAAS,CAAC,oBAAoB,IAAI,OAAO;IACzC,SAAS,CAAC,mBAAmB,CAAC,IAAI,IAAI;IACtC,SAAS,CAAC,eAAe,IAAI,IAAI;CAClC;AAED;;;;GAIG;AAEH,eAAO,MAAM,8BAA8B,GAAI,CAAC,SAAS,WAAW,CAAC,UAAU,CAAC,cAClE,CAAC,KACZ,WAAW,CAAC,kCAAkC,CAAC,GAAG,CA6IpD,CAAC"}
+{"version":3,"file":"form-associated-checkbox-mixin.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/mixins/form-associated-checkbox-mixin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,UAAU,EAAE,MAAM,KAAK,CAAC;AAMxD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AACpD,OAAO,EAAoB,KAAK,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAClF,OAAO,EACL,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,EAErB,KAAK,0BAA0B,EAChC,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAoB,KAAK,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAIlF,MAAM,CAAC,OAAO,CAAC,QAAQ,OAAO,kCAC5B,SAAQ,0BACR,YAAW,OAAO,CAAC,oBAAoB,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC;IAEvE,IAAW,OAAO,IAAI,OAAO,CAAC;IAC9B,IAAW,OAAO,CAAC,KAAK,EAAE,OAAO,EAAE;IAEnC,IAAW,QAAQ,CAAC,KAAK,EAAE,OAAO,EAAE;IACpC,IAAW,QAAQ,IAAI,OAAO,CAAC;IAE/B,IAAW,QAAQ,CAAC,KAAK,EAAE,OAAO,EAAE;IACpC,IAAW,QAAQ,IAAI,OAAO,CAAC;IAExB,iBAAiB,IAAI,IAAI;IACzB,wBAAwB,CAAC,KAAK,EAAE,gBAAgB,GAAG,IAAI,EAAE,MAAM,EAAE,iBAAiB,GAAG,IAAI;IAEhG,SAAS,CAAC,oBAAoB,IAAI,OAAO;IACzC,SAAS,CAAC,oBAAoB,IAAI,OAAO;IACzC,SAAS,CAAC,mBAAmB,CAAC,IAAI,IAAI;IACtC,SAAS,CAAC,eAAe,IAAI,IAAI;CAClC;AAED;;;;GAIG;AAEH,eAAO,MAAM,8BAA8B,GAAI,CAAC,SAAS,WAAW,CAAC,UAAU,CAAC,cAClE,CAAC,KACZ,WAAW,CAAC,kCAAkC,CAAC,GAAG,CAqJpD,CAAC"}