@sbb-esta/lyne-elements-dev 0.0.0 → 4.5.1-dev.1771849268

package/development/core/controllers/inert-controller.js

@@ -0,0 +1,106 @@
+const IGNORED_ELEMENTS = ["script", "head", "template", "style"];
+const inertElements = /* @__PURE__ */ new Set();
+const exemptedElements = /* @__PURE__ */ new Set();
+const inertOverlays = /* @__PURE__ */ new Set();
+class SbbInertController {
+  constructor(_host, _inertElements = inertElements, _inertOverlays = inertOverlays, _exemptedElements = exemptedElements) {
+    this._host = _host;
+    this._inertElements = _inertElements;
+    this._inertOverlays = _inertOverlays;
+    this._exemptedElements = _exemptedElements;
+    this._host.addController?.(this);
+  }
+  hostConnected() {
+    if (this._host.isOpen) {
+      this.activate();
+    }
+  }
+  hostDisconnected() {
+    if (this.isInert()) {
+      this.deactivate();
+    }
+  }
+  /** Applies inert state to every other element on the page except the overlay. */
+  activate() {
+    if (this._inertOverlays.size) {
+      this._removeAllInertAttributes();
+    }
+    this._inertOverlays.add(this._host);
+    this._addAllInertAttributes();
+  }
+  /** Removes inert state. */
+  deactivate() {
+    if (this._currentOverlay() !== this._host) {
+      if (this._inertOverlays.has(this._host)) {
+        this._inertOverlays.delete(this._host);
+      }
+      return;
+    }
+    this._removeAllInertAttributes();
+    this._inertOverlays.delete(this._host);
+    if (this._inertOverlays.size) {
+      this._addAllInertAttributes();
+    }
+  }
+  /** Whether the assigned host is currently inert */
+  isInert() {
+    return this._inertOverlays.has(this._host);
+  }
+  /** Temporarily removes all inert attributes from a given element. */
+  exempt(element) {
+    if (this._inertElements.has(element) && !this._exemptedElements.has(element)) {
+      this._removeInertAttributes(element);
+      this._inertElements.delete(element);
+      this._exemptedElements.add(element);
+    }
+  }
+  /** Inerts an element currently exempted from inert. */
+  restoreAllExempted() {
+    this._exemptedElements.forEach((e) => this._addInertAttributes(e));
+    this._exemptedElements.clear();
+  }
+  _currentOverlay() {
+    return [...this._inertOverlays].pop() ?? null;
+  }
+  _removeAllInertAttributes() {
+    this._inertElements.forEach((element) => this._removeInertAttributes(element));
+    this._inertElements.clear();
+  }
+  _removeInertAttributes(element) {
+    if (!element) {
+      return;
+    }
+    if (element.hasAttribute("data-sbb-inert")) {
+      element.inert = false;
+      element.removeAttribute("data-sbb-inert");
+    }
+    if (element.hasAttribute("data-sbb-aria-hidden")) {
+      element.removeAttribute("aria-hidden");
+      element.removeAttribute("data-sbb-aria-hidden");
+    }
+  }
+  _addAllInertAttributes() {
+    let element = this._currentOverlay();
+    while (element !== document.documentElement && element !== null) {
+      Array.from((element?.parentElement ?? element?.getRootNode())?.childNodes ?? []).filter((child) => child !== element && child instanceof window.HTMLElement && !IGNORED_ELEMENTS.includes(child.localName) && !child.classList.contains("sbb-live-announcer-element")).forEach((element2) => {
+        this._addInertAttributes(element2);
+      });
+      element = element?.parentElement ?? element?.getRootNode()?.host ?? null;
+    }
+  }
+  _addInertAttributes(element) {
+    this._inertElements.add(element);
+    if (!element.inert) {
+      element.inert = true;
+      element.toggleAttribute("data-sbb-inert", true);
+    }
+    if (!element.hasAttribute("aria-hidden")) {
+      element.setAttribute("aria-hidden", "true");
+      element.toggleAttribute("data-sbb-aria-hidden", true);
+    }
+  }
+}
+export {
+  SbbInertController
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5lcnQtY29udHJvbGxlci5qcyIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2VsZW1lbnRzL2NvcmUvY29udHJvbGxlcnMvaW5lcnQtY29udHJvbGxlci50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IFJlYWN0aXZlQ29udHJvbGxlciwgUmVhY3RpdmVDb250cm9sbGVySG9zdCB9IGZyb20gJ2xpdCc7XG5cbmltcG9ydCB0eXBlIHsgU2JiT3BlbkNsb3NlQmFzZUVsZW1lbnQgfSBmcm9tICcuLi9iYXNlLWVsZW1lbnRzLnRzJztcblxuY29uc3QgSUdOT1JFRF9FTEVNRU5UUyA9IFsnc2NyaXB0JywgJ2hlYWQnLCAndGVtcGxhdGUnLCAnc3R5bGUnXTtcbmNvbnN0IGluZXJ0RWxlbWVudHMgPSBuZXcgU2V0PEhUTUxFbGVtZW50PigpO1xuY29uc3QgZXhlbXB0ZWRFbGVtZW50cyA9IG5ldyBTZXQ8SFRNTEVsZW1lbnQ+KCk7XG5jb25zdCBpbmVydE92ZXJsYXlzID0gbmV3IFNldDxIVE1MRWxlbWVudD4oKTtcblxuZXhwb3J0IGNsYXNzIFNiYkluZXJ0Q29udHJvbGxlciBpbXBsZW1lbnRzIFJlYWN0aXZlQ29udHJvbGxlciB7XG4gIHB1YmxpYyBjb25zdHJ1Y3RvcihcbiAgICBwcml2YXRlIF9ob3N0OiBSZWFjdGl2ZUNvbnRyb2xsZXJIb3N0ICYgU2JiT3BlbkNsb3NlQmFzZUVsZW1lbnQsXG4gICAgcHJpdmF0ZSBfaW5lcnRFbGVtZW50cyA9IGluZXJ0RWxlbWVudHMsXG4gICAgcHJpdmF0ZSBfaW5lcnRPdmVybGF5cyA9IGluZXJ0T3ZlcmxheXMsXG4gICAgcHJpdmF0ZSBfZXhlbXB0ZWRFbGVtZW50cyA9IGV4ZW1wdGVkRWxlbWVudHMsXG4gICkge1xuICAgIHRoaXMuX2hvc3QuYWRkQ29udHJvbGxlcj8uKHRoaXMpO1xuICB9XG5cbiAgcHVibGljIGhvc3RDb25uZWN0ZWQoKTogdm9pZCB7XG4gICAgaWYgKHRoaXMuX2hvc3QuaXNPcGVuKSB7XG4gICAgICB0aGlzLmFjdGl2YXRlKCk7XG4gICAgfVxuICB9XG5cbiAgcHVibGljIGhvc3REaXNjb25uZWN0ZWQoKTogdm9pZCB7XG4gICAgaWYgKHRoaXMuaXNJbmVydCgpKSB7XG4gICAgICB0aGlzLmRlYWN0aXZhdGUoKTtcbiAgICB9XG4gIH1cblxuICAvKiogQXBwbGllcyBpbmVydCBzdGF0ZSB0byBldmVyeSBvdGhlciBlbGVtZW50IG9uIHRoZSBwYWdlIGV4Y2VwdCB0aGUgb3ZlcmxheS4gKi9cbiAgcHVibGljIGFjdGl2YXRlKCk6IHZvaWQge1xuICAgIC8vIFJlbW92ZSBpbmVydCBzdGF0ZSBmcm9tIHByZXZpb3VzIG9wZW5lZCBvdmVybGF5XG4gICAgaWYgKHRoaXMuX2luZXJ0T3ZlcmxheXMuc2l6ZSkge1xuICAgICAgdGhpcy5fcmVtb3ZlQWxsSW5lcnRBdHRyaWJ1dGVzKCk7XG4gICAgfVxuXG4gICAgdGhpcy5faW5lcnRPdmVybGF5cy5hZGQodGhpcy5faG9zdCk7XG4gICAgdGhpcy5fYWRkQWxsSW5lcnRBdHRyaWJ1dGVzKCk7XG4gIH1cblxuICAvKiogUmVtb3ZlcyBpbmVydCBzdGF0ZS4gKi9cbiAgcHVibGljIGRlYWN0aXZhdGUoKTogdm9pZCB7XG4gICAgaWYgKHRoaXMuX2N1cnJlbnRPdmVybGF5KCkgIT09IHRoaXMuX2hvc3QpIHtcbiAgICAgIC8vIElmIGUuZy4gYSBjb21wb25lbnQgZ2V0cyBkaXNjb25uZWN0ZWQsIGl0IGNvdWxkIGJlIHRoYXQgaXQgaXMgbm90IHRoZSB0b3AgbW9zdC5cbiAgICAgIC8vIEluIHRoaXMgY2FzZSwgd2UgY2FuIGRpcmVjdGx5IHJlbW92ZSBpdCwgYXMgdGhlcmUgaXMgY3VycmVudGx5IG5vIGluZXJ0IHN0YXRlIGFwcGxpZWQuXG4gICAgICBpZiAodGhpcy5faW5lcnRPdmVybGF5cy5oYXModGhpcy5faG9zdCkpIHtcbiAgICAgICAgdGhpcy5faW5lcnRPdmVybGF5cy5kZWxldGUodGhpcy5faG9zdCk7XG4gICAgICB9IGVsc2UgaWYgKGltcG9ydC5tZXRhLmVudi5ERVYpIHtcbiAgICAgICAgY29uc29sZS53YXJuKFxuICAgICAgICAgICdUcnlpbmcgdG8gcmVtb3ZlIGluZXJ0IHN0YXRlIG9mIGFuIG92ZXJsYXkgd2hpY2ggbmV2ZXIgaGFkIGFuIGFwcGxpZWQgaW5lcnQgc3RhdGUuJyxcbiAgICAgICAgICB0aGlzLl9ob3N0LFxuICAgICAgICApO1xuICAgICAgfVxuXG4gICAgICByZXR1cm47XG4gICAgfVxuXG4gICAgdGhpcy5fcmVtb3ZlQWxsSW5lcnRBdHRyaWJ1dGVzKCk7XG4gICAgdGhpcy5faW5lcnRPdmVybGF5cy5kZWxldGUodGhpcy5faG9zdCk7XG5cbiAgICAvLyBJZiB0aGVyZSBpcyBhcyBwcmV2aW91cyBvcGVuZWQgb3ZlcmxheSwgc2V0IGl0cyBpbmVydCBzdGF0ZSBhZ2Fpbi5cbiAgICBpZiAodGhpcy5faW5lcnRPdmVybGF5cy5zaXplKSB7XG4gICAgICB0aGlzLl9hZGRBbGxJbmVydEF0dHJpYnV0ZXMoKTtcbiAgICB9XG4gIH1cblxuICAvKiogV2hldGhlciB0aGUgYXNzaWduZWQgaG9zdCBpcyBjdXJyZW50bHkgaW5lcnQgKi9cbiAgcHVibGljIGlzSW5lcnQoKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIHRoaXMuX2luZXJ0T3ZlcmxheXMuaGFzKHRoaXMuX2hvc3QpO1xuICB9XG5cbiAgLyoqIFRlbXBvcmFyaWx5IHJlbW92ZXMgYWxsIGluZXJ0IGF0dHJpYnV0ZXMgZnJvbSBhIGdpdmVuIGVsZW1lbnQuICovXG4gIHB1YmxpYyBleGVtcHQoZWxlbWVudDogSFRNTEVsZW1lbnQpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5faW5lcnRFbGVtZW50cy5oYXMoZWxlbWVudCkgJiYgIXRoaXMuX2V4ZW1wdGVkRWxlbWVudHMuaGFzKGVsZW1lbnQpKSB7XG4gICAgICB0aGlzLl9yZW1vdmVJbmVydEF0dHJpYnV0ZXMoZWxlbWVudCk7XG4gICAgICB0aGlzLl9pbmVydEVsZW1lbnRzLmRlbGV0ZShlbGVtZW50KTtcbiAgICAgIHRoaXMuX2V4ZW1wdGVkRWxlbWVudHMuYWRkKGVsZW1lbnQpO1xuICAgIH1cbiAgfVxuXG4gIC8qKiBJbmVydHMgYW4gZWxlbWVudCBjdXJyZW50bHkgZXhlbXB0ZWQgZnJvbSBpbmVydC4gKi9cbiAgcHVibGljIHJlc3RvcmVBbGxFeGVtcHRlZCgpOiB2b2lkIHtcbiAgICB0aGlzLl9leGVtcHRlZEVsZW1lbnRzLmZvckVhY2goKGUpID0+IHRoaXMuX2FkZEluZXJ0QXR0cmlidXRlcyhlKSk7XG4gICAgdGhpcy5fZXhlbXB0ZWRFbGVtZW50cy5jbGVhcigpO1xuICB9XG5cbiAgcHJpdmF0ZSBfY3VycmVudE92ZXJsYXkoKTogSFRNTEVsZW1lbnQgfCBudWxsIHtcbiAgICByZXR1cm4gWy4uLnRoaXMuX2luZXJ0T3ZlcmxheXNdLnBvcCgpID8/IG51bGw7XG4gIH1cblxuICBwcml2YXRlIF9yZW1vdmVBbGxJbmVydEF0dHJpYnV0ZXMoKTogdm9pZCB7XG4gICAgdGhpcy5faW5lcnRFbGVtZW50cy5mb3JFYWNoKChlbGVtZW50OiBIVE1MRWxlbWVudCk6IHZvaWQgPT5cbiAgICAgIHRoaXMuX3JlbW92ZUluZXJ0QXR0cmlidXRlcyhlbGVtZW50KSxcbiAgICApO1xuICAgIHRoaXMuX2luZXJ0RWxlbWVudHMuY2xlYXIoKTtcbiAgfVxuXG4gIHByaXZhdGUgX3JlbW92ZUluZXJ0QXR0cmlidXRlcyhlbGVtZW50OiBIVE1MRWxlbWVudCk6IHZvaWQge1xuICAgIGlmICghZWxlbWVudCkge1xuICAgICAgcmV0dXJuO1xuICAgIH1cblxuICAgIGlmIChlbGVtZW50Lmhhc0F0dHJpYnV0ZSgnZGF0YS1zYmItaW5lcnQnKSkge1xuICAgICAgZWxlbWVudC5pbmVydCA9IGZhbHNlO1xuICAgICAgZWxlbWVudC5yZW1vdmVBdHRyaWJ1dGUoJ2RhdGEtc2JiLWluZXJ0Jyk7XG4gICAgfVxuXG4gICAgaWYgKGVsZW1lbnQuaGFzQXR0cmlidXRlKCdkYXRhLXNiYi1hcmlhLWhpZGRlbicpKSB7XG4gICAgICBlbGVtZW50LnJlbW92ZUF0dHJpYnV0ZSgnYXJpYS1oaWRkZW4nKTtcbiAgICAgIGVsZW1lbnQucmVtb3ZlQXR0cmlidXRlKCdkYXRhLXNiYi1hcmlhLWhpZGRlbicpO1xuICAgIH1cbiAgfVxuXG4gIHByaXZhdGUgX2FkZEFsbEluZXJ0QXR0cmlidXRlcygpOiB2b2lkIHtcbiAgICBsZXQgZWxlbWVudDogRWxlbWVudCB8IG51bGwgPSB0aGlzLl9jdXJyZW50T3ZlcmxheSgpO1xuXG4gICAgd2hpbGUgKGVsZW1lbnQgIT09IGRvY3VtZW50LmRvY3VtZW50RWxlbWVudCAmJiBlbGVtZW50ICE9PSBudWxsKSB7XG4gICAgICBBcnJheS5mcm9tKChlbGVtZW50Py5wYXJlbnRFbGVtZW50ID8/IGVsZW1lbnQ/LmdldFJvb3ROb2RlKCkpPy5jaGlsZE5vZGVzID8/IFtdKVxuICAgICAgICAuZmlsdGVyKFxuICAgICAgICAgIChjaGlsZCk6IGNoaWxkIGlzIEhUTUxFbGVtZW50ID0+XG4gICAgICAgICAgICBjaGlsZCAhPT0gZWxlbWVudCAmJlxuICAgICAgICAgICAgY2hpbGQgaW5zdGFuY2VvZiB3aW5kb3cuSFRNTEVsZW1lbnQgJiZcbiAgICAgICAgICAgICFJR05PUkVEX0VMRU1FTlRTLmluY2x1ZGVzKGNoaWxkLmxvY2FsTmFtZSkgJiZcbiAgICAgICAgICAgICFjaGlsZC5jbGFzc0xpc3QuY29udGFpbnMoJ3NiYi1saXZlLWFubm91bmNlci1lbGVtZW50JyksXG4gICAgICAgIClcbiAgICAgICAgLmZvckVhY2goKGVsZW1lbnQpID0+IHtcbiAgICAgICAgICB0aGlzLl9hZGRJbmVydEF0dHJpYnV0ZXMoZWxlbWVudCk7XG4gICAgICAgIH0pO1xuXG4gICAgICAvLyBXZSBuZWVkIHRvIHBpZXJjZSB0aHJvdWdoIFNoYWRvdyBET00gYm91bmRhcnlcbiAgICAgIGVsZW1lbnQgPSBlbGVtZW50Py5wYXJlbnRFbGVtZW50ID8/IChlbGVtZW50Py5nZXRSb290Tm9kZSgpIGFzIFNoYWRvd1Jvb3QpPy5ob3N0ID8/IG51bGw7XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBfYWRkSW5lcnRBdHRyaWJ1dGVzKGVsZW1lbnQ6IEhUTUxFbGVtZW50KTogdm9pZCB7XG4gICAgdGhpcy5faW5lcnRFbGVtZW50cy5hZGQoZWxlbWVudCk7XG5cbiAgICBpZiAoIWVsZW1lbnQuaW5lcnQpIHtcbiAgICAgIGVsZW1lbnQuaW5lcnQgPSB0cnVlO1xuICAgICAgZWxlbWVudC50b2dnbGVBdHRyaWJ1dGUoJ2RhdGEtc2JiLWluZXJ0JywgdHJ1ZSk7XG4gICAgfVxuXG4gICAgaWYgKCFlbGVtZW50Lmhhc0F0dHJpYnV0ZSgnYXJpYS1oaWRkZW4nKSkge1xuICAgICAgZWxlbWVudC5zZXRBdHRyaWJ1dGUoJ2FyaWEtaGlkZGVuJywgJ3RydWUnKTtcbiAgICAgIGVsZW1lbnQudG9nZ2xlQXR0cmlidXRlKCdkYXRhLXNiYi1hcmlhLWhpZGRlbicsIHRydWUpO1xuICAgIH1cbiAgfVxufVxuIl0sIm5hbWVzIjpbImVsZW1lbnQiXSwibWFwcGluZ3MiOiJBQUlBLE1BQU0sbUJBQW1CLENBQUMsVUFBVSxRQUFRLFlBQVksT0FBTztBQUMvRCxNQUFNLG9DQUFvQixJQUFBO0FBQzFCLE1BQU0sdUNBQXVCLElBQUE7QUFDN0IsTUFBTSxvQ0FBb0IsSUFBQTtNQUViLG1CQUFrQjtBQUFBLEVBQzdCLFlBQ1UsT0FDQSxpQkFBaUIsZUFDakIsaUJBQWlCLGVBQ2pCLG9CQUFvQixrQkFBZ0I7QUFIcEMsU0FBQSxRQUFBO0FBQ0EsU0FBQSxpQkFBQTtBQUNBLFNBQUEsaUJBQUE7QUFDQSxTQUFBLG9CQUFBO0FBRVIsU0FBSyxNQUFNLGdCQUFnQixJQUFJO0FBQUEsRUFDakM7QUFBQSxFQUVPLGdCQUFhO0FBQ2xCLFFBQUksS0FBSyxNQUFNLFFBQVE7QUFDckIsV0FBSyxTQUFBO0FBQUEsSUFDUDtBQUFBLEVBQ0Y7QUFBQSxFQUVPLG1CQUFnQjtBQUNyQixRQUFJLEtBQUssV0FBVztBQUNsQixXQUFLLFdBQUE7QUFBQSxJ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

package/development/core/controllers/language-controller.d.ts

@@ -0,0 +1,32 @@
+import { ReactiveController, ReactiveControllerHost } from 'lit';
+/**
+ * The LanguageController is a reactive controller that observes the "lang" attribute
+ * of the <html> tag.
+ * On change of the "lang" attribute, it will request an update of connected
+ * components.
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang
+ */
+export declare class SbbLanguageController implements ReactiveController {
+    private _host;
+    private static readonly _defaultLanguage;
+    private static readonly _supportedLocales;
+    /** A set of connected components that should be notified on language change. */
+    private static readonly _listeners;
+    /** MutationObserver that observes the "lang" attribute of the <html> element. */
+    private static readonly _observer;
+    private static readonly _observerConfig;
+    /** Get the current language. */
+    static get current(): string;
+    /** Get the current language. */
+    get current(): string;
+    private _previousLanguage?;
+    private _handlers;
+    constructor(_host: ReactiveControllerHost);
+    /** Add a language change handler. */
+    withHandler(handler: () => void): this;
+    hostConnected(): void;
+    hostDisconnected(): void;
+    private _callHandlers;
+}
+//# sourceMappingURL=language-controller.d.ts.map

package/development/core/controllers/language-controller.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"language-controller.d.ts","sourceRoot":"","sources":["../../../../../src/elements/core/controllers/language-controller.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,kBAAkB,EAAE,KAAK,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAIrF;;;;;;;GAOG;AACH,qBAAa,qBAAsB,YAAW,kBAAkB;IA4C3C,OAAO,CAAC,KAAK;IA3ChC,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,gBAAgB,CAAQ;IAChD,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,iBAAiB,CAA4B;IAErE,gFAAgF;IAChF,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,UAAU,CAAoC;IAEtE,iFAAiF;IACjF,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,SAAS,CAMxB;IACT,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAGrC;IAEF,gCAAgC;IAChC,WAAkB,OAAO,IAAI,MAAM,CAalC;IAED,gCAAgC;IAChC,IAAW,OAAO,IAAI,MAAM,CAE3B;IAED,OAAO,CAAC,iBAAiB,CAAC,CAAS;IACnC,OAAO,CAAC,SAAS,CAAsB;gBAEZ,KAAK,EAAE,sBAAsB;IAIxD,qCAAqC;IAC9B,WAAW,CAAC,OAAO,EAAE,MAAM,IAAI,GAAG,IAAI;IAOtC,aAAa,IAAI,IAAI;IAiBrB,gBAAgB,IAAI,IAAI;IAW/B,OAAO,CAAC,aAAa;CAMtB"}

package/development/core/controllers/language-controller.js

@@ -0,0 +1,69 @@
+import { isServer } from "lit";
+import { readConfig } from "../config.js";
+const _SbbLanguageController = class _SbbLanguageController {
+  /** Get the current language. */
+  static get current() {
+    const language = (readConfig().language ?? (isServer ? _SbbLanguageController._defaultLanguage : document.documentElement.getAttribute("lang"))) || _SbbLanguageController._defaultLanguage;
+    const langAttributeNormalized = language.split("-")[0];
+    return _SbbLanguageController._supportedLocales.includes(langAttributeNormalized) ? langAttributeNormalized : _SbbLanguageController._defaultLanguage;
+  }
+  /** Get the current language. */
+  get current() {
+    return _SbbLanguageController.current;
+  }
+  constructor(_host) {
+    this._host = _host;
+    this._handlers = [];
+    this._host.addController(this);
+  }
+  /** Add a language change handler. */
+  withHandler(handler) {
+    this._handlers.unshift(handler);
+    return this;
+  }
+  hostConnected() {
+    if (isServer) {
+      return;
+    }
+    if (!_SbbLanguageController._listeners.size) {
+      _SbbLanguageController._observer.observe(document.documentElement, _SbbLanguageController._observerConfig);
+    }
+    _SbbLanguageController._listeners.add(this);
+    if (this._previousLanguage !== this.current) {
+      this._callHandlers(this._previousLanguage !== void 0);
+    }
+  }
+  hostDisconnected() {
+    if (isServer) {
+      return;
+    }
+    this._previousLanguage = this.current;
+    _SbbLanguageController._listeners.delete(this);
+    if (!_SbbLanguageController._listeners.size) {
+      _SbbLanguageController._observer.disconnect();
+    }
+  }
+  _callHandlers(requestUpdate = true) {
+    this._handlers.forEach((h) => h());
+    if (requestUpdate) {
+      this._host.requestUpdate();
+    }
+  }
+};
+_SbbLanguageController._defaultLanguage = "en";
+_SbbLanguageController._supportedLocales = ["en", "de", "fr", "it"];
+_SbbLanguageController._listeners = /* @__PURE__ */ new Set();
+_SbbLanguageController._observer = !isServer ? new MutationObserver((mutations) => {
+  if (mutations[0].oldValue !== document.documentElement.getAttribute("lang")) {
+    _SbbLanguageController._listeners.forEach((l) => l._callHandlers());
+  }
+}) : null;
+_SbbLanguageController._observerConfig = {
+  attributeFilter: ["lang"],
+  attributeOldValue: true
+};
+let SbbLanguageController = _SbbLanguageController;
+export {
+  SbbLanguageController
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGFuZ3VhZ2UtY29udHJvbGxlci5qcyIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2VsZW1lbnRzL2NvcmUvY29udHJvbGxlcnMvbGFuZ3VhZ2UtY29udHJvbGxlci50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBpc1NlcnZlciwgdHlwZSBSZWFjdGl2ZUNvbnRyb2xsZXIsIHR5cGUgUmVhY3RpdmVDb250cm9sbGVySG9zdCB9IGZyb20gJ2xpdCc7XG5cbmltcG9ydCB7IHJlYWRDb25maWcgfSBmcm9tICcuLi9jb25maWcudHMnO1xuXG4vKipcbiAqIFRoZSBMYW5ndWFnZUNvbnRyb2xsZXIgaXMgYSByZWFjdGl2ZSBjb250cm9sbGVyIHRoYXQgb2JzZXJ2ZXMgdGhlIFwibGFuZ1wiIGF0dHJpYnV0ZVxuICogb2YgdGhlIDxodG1sPiB0YWcuXG4gKiBPbiBjaGFuZ2Ugb2YgdGhlIFwibGFuZ1wiIGF0dHJpYnV0ZSwgaXQgd2lsbCByZXF1ZXN0IGFuIHVwZGF0ZSBvZiBjb25uZWN0ZWRcbiAqIGNvbXBvbmVudHMuXG4gKlxuICogQHNlZSBodHRwczovL2RldmVsb3Blci5tb3ppbGxhLm9yZy9lbi1VUy9kb2NzL1dlYi9IVE1ML0dsb2JhbF9hdHRyaWJ1dGVzL2xhbmdcbiAqL1xuZXhwb3J0IGNsYXNzIFNiYkxhbmd1YWdlQ29udHJvbGxlciBpbXBsZW1lbnRzIFJlYWN0aXZlQ29udHJvbGxlciB7XG4gIHByaXZhdGUgc3RhdGljIHJlYWRvbmx5IF9kZWZhdWx0TGFuZ3VhZ2UgPSAnZW4nO1xuICBwcml2YXRlIHN0YXRpYyByZWFkb25seSBfc3VwcG9ydGVkTG9jYWxlcyA9IFsnZW4nLCAnZGUnLCAnZnInLCAnaXQnXTtcblxuICAvKiogQSBzZXQgb2YgY29ubmVjdGVkIGNvbXBvbmVudHMgdGhhdCBzaG91bGQgYmUgbm90aWZpZWQgb24gbGFuZ3VhZ2UgY2hhbmdlLiAqL1xuICBwcml2YXRlIHN0YXRpYyByZWFkb25seSBfbGlzdGVuZXJzID0gbmV3IFNldDxTYmJMYW5ndWFnZUNvbnRyb2xsZXI+KCk7XG5cbiAgLyoqIE11dGF0aW9uT2JzZXJ2ZXIgdGhhdCBvYnNlcnZlcyB0aGUgXCJsYW5nXCIgYXR0cmlidXRlIG9mIHRoZSA8aHRtbD4gZWxlbWVudC4gKi9cbiAgcHJpdmF0ZSBzdGF0aWMgcmVhZG9ubHkgX29ic2VydmVyID0gIWlzU2VydmVyXG4gICAgPyBuZXcgTXV0YXRpb25PYnNlcnZlcigobXV0YXRpb25zKSA9PiB7XG4gICAgICAgIGlmIChtdXRhdGlvbnNbMF0ub2xkVmFsdWUgIT09IGRvY3VtZW50LmRvY3VtZW50RWxlbWVudC5nZXRBdHRyaWJ1dGUoJ2xhbmcnKSkge1xuICAgICAgICAgIFNiYkxhbmd1YWdlQ29udHJvbGxlci5fbGlzdGVuZXJzLmZvckVhY2goKGwpID0+IGwuX2NhbGxIYW5kbGVycygpKTtcbiAgICAgICAgfVxuICAgICAgfSlcbiAgICA6IG51bGw7XG4gIHByaXZhdGUgc3RhdGljIHJlYWRvbmx5IF9vYnNlcnZlckNvbmZpZyA9IHtcbiAgICBhdHRyaWJ1dGVGaWx0ZXI6IFsnbGFuZyddLFxuICAgIGF0dHJpYnV0ZU9sZFZhbHVlOiB0cnVlLFxuICB9O1xuXG4gIC8qKiBHZXQgdGhlIGN1cnJlbnQgbGFuZ3VhZ2UuICovXG4gIHB1YmxpYyBzdGF0aWMgZ2V0IGN1cnJlbnQoKTogc3RyaW5nIHtcbiAgICBjb25zdCBsYW5ndWFnZSA9XG4gICAgICAocmVhZENvbmZpZygpLmxhbmd1YWdlID8/XG4gICAgICAgIChpc1NlcnZlclxuICAgICAgICAgID8gU2JiTGFuZ3VhZ2VDb250cm9sbGVyLl9kZWZhdWx0TGFuZ3VhZ2VcbiAgICAgICAgICA6IGRvY3VtZW50LmRvY3VtZW50RWxlbWVudC5nZXRBdHRyaWJ1dGUoJ2xhbmcnKSkpIHx8XG4gICAgICBTYmJMYW5ndWFnZUNvbnRyb2xsZXIuX2RlZmF1bHRMYW5ndWFnZTtcblxuICAgIC8vIFN1cHBvcnQgZS5nLiBjYXNlcyBsaWtlIGBkZS1jaGAuXG4gICAgY29uc3QgbGFuZ0F0dHJpYnV0ZU5vcm1hbGl6ZWQgPSBsYW5ndWFnZS5zcGxpdCgnLScpWzBdO1xuICAgIHJldHVybiBTYmJMYW5ndWFnZUNvbnRyb2xsZXIuX3N1cHBvcnRlZExvY2FsZXMuaW5jbHVkZXMobGFuZ0F0dHJpYnV0ZU5vcm1hbGl6ZWQpXG4gICAgICA/IGxhbmdBdHRyaWJ1dGVOb3JtYWxpemVkXG4gICAgICA6IFNiYkxhbmd1YWdlQ29udHJvbGxlci5fZGVmYXVsdExhbmd1YWdlO1xuICB9XG5cbiAgLyoqIEdldCB0aGUgY3VycmVudCBsYW5ndWFnZS4gKi9cbiAgcHVibGljIGdldCBjdXJyZW50KCk6IHN0cmluZyB7XG4gICAgcmV0dXJuIFNiYkxhbmd1YWdlQ29udHJvbGxlci5jdXJyZW50O1xuICB9XG5cbiAgcHJpdmF0ZSBfcHJldmlvdXNMYW5ndWFnZT86IHN0cmluZztcbiAgcHJpdmF0ZSBfaGFuZGxlcnM6ICgoKSA9PiB2b2lkKVtdID0gW107XG5cbiAgcHVibGljIGNvbnN0cnVjdG9yKHByaXZhdGUgX2hvc3Q6IFJlYWN0aXZlQ29udHJvbGxlckhvc3QpIHtcbiAgICB0aGlzLl9ob3N0LmFkZENvbnRyb2xsZXIodGhpcyk7XG4gIH1cblxuICAvKiogQWRkIGEgbGFuZ3VhZ2UgY2hhbmdlIGhhbmRsZXIuICovXG4gIHB1YmxpYyB3aXRoSGFuZGxlcihoYW5kbGVyOiAoKSA9PiB2b2lkKTogdGhpcyB7XG4gICAgLy8gV2UgdXNlIHVuc2hpZnQgaGVyZSwgdG8gcHJlcGVuZCBhZGRpdGlvbmFsIGhhbmRsZXJzLlxuICAgIC8vIFRoaXMgZW5zdXJlcyB0aGF0IHJlcXVlc3RVcGRhdGUgaXMgY2FsbGVkIGFmdGVyIHRoZSBvdGhlciBoYW5kbGVycy5cbiAgICB0aGlzLl9oYW5kbGVycy51bnNoaWZ0KGhhbmRsZXIpO1xuICAgIHJldHVybiB0aGlzO1xuICB9XG5cbiAgcHVibGljIGhvc3RDb25uZWN0ZWQoKTogdm9pZCB7XG4gICAgaWYgKGlzU2VydmVyKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuICAgIGlmICghU2JiTGFuZ3VhZ2VDb250cm9sbGVyLl9saXN0ZW5lcnMuc2l6ZSkge1xuICAgICAgU2JiTGFuZ3VhZ2VDb250cm9sbGVyLl9vYnNlcnZlciEub2JzZXJ2ZShcbiAgICAgICAgZG9jdW1lbnQuZG9jdW1lbnRFbGVtZW50LFxuICAgICAgICBTYmJMYW5ndWFnZUNvbnRyb2xsZXIuX29ic2VydmVyQ29uZmlnLFxuICAgICAgKTtcbiAgICB9XG5cbiAgICBTYmJMYW5ndWFnZUNvbnRyb2xsZXIuX2xpc3RlbmVycy5hZGQodGhpcyk7XG4gICAgaWYgKHRoaXMuX3ByZXZpb3VzTGFuZ3VhZ2UgIT09IHRoaXMuY3VycmVudCkge1xuICAgICAgdGhpcy5fY2FsbEhhbmRsZXJzKHRoaXMuX3ByZXZpb3VzTGFuZ3VhZ2UgIT09IHVuZGVmaW5lZCk7XG4gICAgfVxuICB9XG5cbiAgcHVibGljIGhvc3REaXNjb25uZWN0ZWQoKTogdm9pZCB7XG4gICAgaWYgKGlzU2VydmVyKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuICAgIHRoaXMuX3ByZXZpb3VzTGFuZ3VhZ2UgPSB0aGlzLmN1cnJlbnQ7XG4gICAgU2JiTGFuZ3VhZ2VDb250cm9sbGVyLl9saXN0ZW5lcnMuZGVsZXRlKHRoaXMpO1xuICAgIGlmICghU2JiTGFuZ3VhZ2VDb250cm9sbGVyLl9saXN0ZW5lcnMuc2l6ZSkge1xuICAgICAgU2JiTGFuZ3VhZ2VDb250cm9sbGVyLl9vYnNlcnZlciEuZGlzY29ubmVjdCgpO1xuICAgIH1cbiAgfVxuXG4gIHByaXZhdGUgX2NhbGxIYW5kbGVycyhyZXF1ZXN0VXBkYXRlID0gdHJ1ZSk6IHZvaWQge1xuICAgIHRoaXMuX2hhbmRsZXJzLmZvckVhY2goKGgpID0+IGgoKSk7XG4gICAgaWYgKHJlcXVlc3RVcGRhdGUpIHtcbiAgICAgIHRoaXMuX2hvc3QucmVxdWVzdFVwZGF0ZSgpO1xuICAgIH1cbiAgfVxufVxuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7O01BWWEsK0JBQUEsdUJBQXFCO0FBQUE7QUFBQSxFQXFCekIsV0FBVyxVQUFPO0FBQ3ZCLFVBQU0sWUFDSCxXQUFBLEVBQWEsYUFDWCxXQUNHLHVCQUFzQixtQkFDdEIsU0FBUyxnQkFBZ0IsYUFBYSxNQUFNLE9BQ2xELHVCQUFzQjtBQUd4QixVQUFNLDBCQUEwQixTQUFTLE1BQU0sR0FBRyxFQUFFLENBQUM7QUFDckQsV0FBTyx1QkFBc0Isa0JBQWtCLFNBQVMsdUJBQXVCLElBQzNFLDBCQUNBLHVCQUFzQjtBQUFBLEVBQzVCO0FBQUE7QUFBQSxFQUdBLElBQVcsVUFBTztBQUNoQixXQUFPLHVCQUFzQjtBQUFBLEVBQy9CO0FBQUEsRUFLQSxZQUEyQixPQUE2QjtBQUE3QixTQUFBLFFBQUE7QUFGbkIsU0FBQSxZQUE0QixDQUFBO0FBR2xDLFNBQUssTUFBTSxjQUFjLElBQUk7QUFBQSxFQUMvQjtBQUFBO0FBQUEsRUFHTyxZQUFZLFNBQW1CO0FBR3BDLFNBQUssVUFBVSxRQUFRLE9BQU87QUFDOUIsV0FBTztBQUFBLEVBQ1Q7QUFBQSxFQUVPLGdCQUFhO0FBQ2xCLFFBQUksVUFBVTtBQUNaO0FBQUEsSUFDRjtBQUNBLFFBQUksQ0FBQyx1QkFBc0IsV0FBVyxNQUFNO0FBQzFDLDZCQUFzQixVQUFXLFFBQy9CLFNBQVMsaUJBQ1QsdUJBQXNCLGVBQWU7QUFBQSxJQUV6QztBQUVBLDJCQUFzQixXQUFXLElBQUksSUFBSTtBQUN6QyxRQUFJLEtBQUssc0JBQXNCLEtBQUssU0FBUztBQUMzQyxXQUFLLGNBQWMsS0FBSyxzQkFBc0IsTUFBUztBQUFBLElBQ3pEO0FBQUEsRUFDRjtBQUFBLEVBRU8sbUJBQWdCO0FBQ3JCLFFBQUksVUFBVTtBQUNaO0FBQUEsSUFDRjtBQUNBLFNBQUssb0JBQW9CLEtBQUs7QUFDOUIsMkJBQXNCLFdBQVcsT0FBTyxJQUFJO0FBQzVDLFFBQUksQ0FBQyx1QkFBc0IsV0FBVyxNQUFNO0FBQzFDLDZCQUFzQixVQUFXLFdBQUE7QUFBQSxJQUNuQztBQUFBLEVBQ0Y7QUFBQSxFQUVRLGNBQWMsZ0JBQWdCLE1BQUk7QUFDeEMsU0FBSyxVQUFVLFFBQVEsQ0FBQyxNQUFNLEdBQUc7QUFDakMsUUFBSSxlQUFlO0FBQ2pCLFdBQUssTUFBTSxjQUFBO0FBQUEsSUFDYjtBQUFBLEVBQ0Y7O0FBeEZ3Qix1QkFBQSxtQkFBbUI7QUFDbkIsdUJBQUEsb0JBQW9CLENBQUMsTUFBTSxNQUFNLE1BQU0sSUFBSTtBQUczQyx1QkFBQSxpQ0FBaUIsSUFBQTtBQUdqQix1QkFBQSxZQUFZLENBQUMsV0FDakMsSUFBSSxpQkFBaUIsQ0FBQyxjQUFhO0FBQ2pDLE1BQUksVUFBVSxDQUFDLEVBQUUsYUFBYSxTQUFTLGdCQUFnQixhQUFhLE1BQU0sR0FBRztBQUMzRSwyQkFBc0IsV0FBVyxRQUFRLENBQUMsTUFBTSxFQUFFLGVBQWU7QUFBQSxFQUNuRTtBQUNGLENBQUMsSUFDRDtBQUNvQix1QkFBQSxrQkFBa0I7QUFBQSxFQUN4QyxpQkFBaUIsQ0FBQyxNQUFNO0FBQUEsRUFDeEIsbUJBQW1CO0FBQUE7SUFqQlY7In0=

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

@@ -0,0 +1,65 @@
+import { ReactiveController, ReactiveControllerHost } from 'lit';
+import { SbbElementInternalsMixinType } from '../mixins.ts';
+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 SbbMediaQueryBreakpointZeroAndAbove: string;
+export declare const SbbMediaQueryBreakpointSmallAndAbove: string;
+export declare const SbbMediaQueryBreakpointLargeAndAbove: string;
+export declare const SbbMediaQueryBreakpointUltraAndAbove: string;
+export declare const SbbMediaQueryBreakpointSmallAndBelow: string;
+export declare const SbbMediaQueryBreakpointLargeAndBelow: 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;
+}
+/**
+ * A specialized version of the SbbMediaMatcherController, which
+ * takes the color-scheme CSS property into account when determining
+ * the dark mode state and updates a :state(dark) on the host.
+ *
+ * @example
+ * new SbbDarkModeController(this, (isDarkMode) => doSomething(isDarkMode));
+ */
+export declare class SbbDarkModeController extends SbbMediaMatcherController {
+    private _host;
+    /** The current mode based on the class attribute of the <html> element. */
+    private static _currentMode;
+    /** MutationObserver that observes the "class" attribute of the <html> element. */
+    private static readonly _observer;
+    private static readonly _observerConfig;
+    private readonly _onChangeWithStateUpdater;
+    constructor(_host: ReactiveControllerHost & HTMLElement & SbbElementInternalsMixinType, onChange: SbbMediaMatcherHandler);
+    private static _readLightDarkClass;
+    /**
+     * Requests an update of the dark mode state. This is needed when the color-scheme
+     * CSS property changes, as the media query does not pick this up automatically.
+     */
+    static requestUpdate(): void;
+    hostConnected(): void;
+    hostDisconnected(): void;
+    matches(): boolean;
+}
+//# sourceMappingURL=media-matchers-controller.d.ts.map

package/development/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":"AAQA,OAAO,EAAY,KAAK,kBAAkB,EAAE,KAAK,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAGrF,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,cAAc,CAAC;AAGjE,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,mCAAmC,QAAyC,CAAC;AAC1F,eAAO,MAAM,oCAAoC,QAA0C,CAAC;AAC5F,eAAO,MAAM,oCAAoC,QAA0C,CAAC;AAC5F,eAAO,MAAM,oCAAoC,QAA0C,CAAC;AAC5F,eAAO,MAAM,oCAAoC,QAA0C,CAAC;AAC5F,eAAO,MAAM,oCAAoC,QAA0C,CAAC;AAG5F;;;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;IA0BhE,OAAO,CAAC,KAAK;IAzBf,2EAA2E;IAC3E,OAAO,CAAC,MAAM,CAAC,YAAY,CACE;IAE7B,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/development/core/controllers/media-matchers-controller.js

@@ -0,0 +1,141 @@
+import { S as SbbBreakpointLargeMin, a as SbbBreakpointLargeMax, b as SbbBreakpointSmallMin, c as SbbBreakpointSmallMax, d as SbbBreakpointUltraMin, e as SbbBreakpointZeroMin } from "../../sbb-tokens-DQT_xEIZ.js";
+import { isServer } from "lit";
+import { ɵstateController as _stateController } from "../mixins/element-internals-mixin.js";
+const SbbMediaQueryForcedColors = "(forced-colors: active)";
+const SbbMediaQueryDarkMode = "(prefers-color-scheme: dark)";
+const SbbMediaQueryHover = "(any-hover: hover)";
+const SbbMediaQueryPointerCoarse = "(pointer: coarse)";
+const SbbMediaQueryBreakpointZeroAndAbove = `(min-width: ${SbbBreakpointZeroMin})`;
+const SbbMediaQueryBreakpointSmallAndAbove = `(min-width: ${SbbBreakpointSmallMin})`;
+const SbbMediaQueryBreakpointLargeAndAbove = `(min-width: ${SbbBreakpointLargeMin})`;
+const SbbMediaQueryBreakpointUltraAndAbove = `(min-width: ${SbbBreakpointUltraMin})`;
+const SbbMediaQueryBreakpointSmallAndBelow = `(max-width: ${SbbBreakpointSmallMax})`;
+const SbbMediaQueryBreakpointLargeAndBelow = `(max-width: ${SbbBreakpointLargeMax})`;
+const mediaQueryRegistry = /* @__PURE__ */ new Map();
+class SbbMediaMatcherController {
+  constructor(host, _queries) {
+    this._queries = _queries;
+    host.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(query) {
+    return isServer ? null : matchMedia(query).matches;
+  }
+  hostConnected() {
+    if (isServer) {
+      return;
+    }
+    for (const [query, handler] of Object.entries(this._queries)) {
+      const mediaQuery = mediaQueryRegistry.get(query);
+      if (mediaQuery) {
+        mediaQuery.handlers.add(handler);
+      } else {
+        const mediaQueryList = matchMedia(query);
+        const handlers = /* @__PURE__ */ new Set([handler]);
+        const eventHandler = (e) => handlers.forEach((h) => h(e.matches));
+        mediaQueryList.addEventListener("change", eventHandler);
+        mediaQueryRegistry.set(query, { mediaQueryList, handlers, eventHandler });
+      }
+    }
+  }
+  hostDisconnected() {
+    for (const [query, handler] of Object.entries(this._queries)) {
+      const mediaQuery = mediaQueryRegistry.get(query);
+      if (mediaQuery) {
+        mediaQuery.handlers.delete(handler);
+        if (!mediaQuery.handlers.size) {
+          mediaQueryRegistry.delete(query);
+        }
+      }
+    }
+  }
+}
+const _SbbDarkModeController = class _SbbDarkModeController extends SbbMediaMatcherController {
+  constructor(_host, onChange) {
+    const onChangeWithStateUpdater = () => {
+      onChange(this.matches());
+      _stateController(this._host).toggle("dark", this.matches());
+    };
+    super(_host, {
+      [SbbMediaQueryDarkMode]: onChangeWithStateUpdater
+    });
+    this._host = _host;
+    this._onChangeWithStateUpdater = onChangeWithStateUpdater;
+  }
+  static _readLightDarkClass() {
+    if (isServer) {
+      return null;
+    }
+    const classList = document.documentElement.classList;
+    return ["sbb-light-dark", "sbb-dark", "sbb-light"].find((mode) => classList.contains(mode)) ?? null;
+  }
+  /**
+   * Requests an update of the dark mode state. This is needed when the color-scheme
+   * CSS property changes, as the media query does not pick this up automatically.
+   */
+  // eslint-disable-next-line lyne/needs-super-call-rule
+  static requestUpdate() {
+    const entry = mediaQueryRegistry.get(SbbMediaQueryDarkMode);
+    if (entry) {
+      entry.handlers.forEach((h) => h(entry.mediaQueryList.matches));
+    }
+  }
+  hostConnected() {
+    const isFirstListener = (mediaQueryRegistry.get(SbbMediaQueryDarkMode)?.handlers.size ?? 0) === 0;
+    super.hostConnected();
+    if (isFirstListener) {
+      _SbbDarkModeController._observer.observe(document.documentElement, _SbbDarkModeController._observerConfig);
+    }
+    this._onChangeWithStateUpdater();
+  }
+  hostDisconnected() {
+    super.hostDisconnected();
+    if ((mediaQueryRegistry.get(SbbMediaQueryDarkMode)?.handlers.size ?? 0) === 0) {
+      _SbbDarkModeController._observer.disconnect();
+    }
+  }
+  matches() {
+    if (isServer) {
+      return false;
+    }
+    const colorScheme = getComputedStyle(this._host).getPropertyValue("color-scheme");
+    const darkAvailable = colorScheme.includes("dark");
+    const darkOnly = colorScheme.trim() === "dark";
+    const preferredDarkMode = super.matches(SbbMediaQueryDarkMode);
+    return preferredDarkMode && darkAvailable || darkOnly;
+  }
+};
+_SbbDarkModeController._currentMode = _SbbDarkModeController._readLightDarkClass();
+_SbbDarkModeController._observer = !isServer ? new MutationObserver((mutations) => {
+  if (mutations[0].oldValue !== document.documentElement.getAttribute("class")) {
+    const newMode = _SbbDarkModeController._readLightDarkClass();
+    if (_SbbDarkModeController._currentMode !== newMode) {
+      _SbbDarkModeController.requestUpdate();
+      _SbbDarkModeController._currentMode = newMode;
+    }
+  }
+}) : null;
+_SbbDarkModeController._observerConfig = {
+  attributeFilter: ["class"],
+  attributeOldValue: true
+};
+let SbbDarkModeController = _SbbDarkModeController;
+export {
+  SbbDarkModeController,
+  SbbMediaMatcherController,
+  SbbMediaQueryBreakpointLargeAndAbove,
+  SbbMediaQueryBreakpointLargeAndBelow,
+  SbbMediaQueryBreakpointSmallAndAbove,
+  SbbMediaQueryBreakpointSmallAndBelow,
+  SbbMediaQueryBreakpointUltraAndAbove,
+  SbbMediaQueryBreakpointZeroAndAbove,
+  SbbMediaQueryDarkMode,
+  SbbMediaQueryForcedColors,
+  SbbMediaQueryHover,
+  SbbMediaQueryPointerCoarse
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWVkaWEtbWF0Y2hlcnMtY29udHJvbGxlci5qcyIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2VsZW1lbnRzL2NvcmUvY29udHJvbGxlcnMvbWVkaWEtbWF0Y2hlcnMtY29udHJvbGxlci50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBTYmJCcmVha3BvaW50TGFyZ2VNYXgsXG4gIFNiYkJyZWFrcG9pbnRMYXJnZU1pbixcbiAgU2JiQnJlYWtwb2ludFNtYWxsTWF4LFxuICBTYmJCcmVha3BvaW50U21hbGxNaW4sXG4gIFNiYkJyZWFrcG9pbnRVbHRyYU1pbixcbiAgU2JiQnJlYWtwb2ludFplcm9NaW4sXG59IGZyb20gJ0BzYmItZXN0YS9seW5lLWRlc2lnbi10b2tlbnMnO1xuaW1wb3J0IHsgaXNTZXJ2ZXIsIHR5cGUgUmVhY3RpdmVDb250cm9sbGVyLCB0eXBlIFJlYWN0aXZlQ29udHJvbGxlckhvc3QgfSBmcm9tICdsaXQnO1xuXG5pbXBvcnQgeyDJtXN0YXRlQ29udHJvbGxlciB9IGZyb20gJy4uL21peGlucy9lbGVtZW50LWludGVybmFscy1taXhpbi50cyc7XG5pbXBvcnQgdHlwZSB7IFNiYkVsZW1lbnRJbnRlcm5hbHNNaXhpblR5cGUgfSBmcm9tICcuLi9taXhpbnMudHMnO1xuXG4vKiBlc2xpbnQtZGlzYWJsZSBAdHlwZXNjcmlwdC1lc2xpbnQvbmFtaW5nLWNvbnZlbnRpb24gKi9cbmV4cG9ydCBjb25zdCBTYmJNZWRpYVF1ZXJ5Rm9yY2VkQ29sb3JzID0gJyhmb3JjZWQtY29sb3JzOiBhY3RpdmUpJztcbmV4cG9ydCBjb25zdCBTYmJNZWRpYVF1ZXJ5RGFya01vZGUgPSAnKHByZWZlcnMtY29sb3Itc2NoZW1lOiBkYXJrKSc7XG5leHBvcnQgY29uc3QgU2JiTWVkaWFRdWVyeUhvdmVyID0gJyhhbnktaG92ZXI6IGhvdmVyKSc7XG5leHBvcnQgY29uc3QgU2JiTWVkaWFRdWVyeVBvaW50ZXJDb2Fyc2UgPSAnKHBvaW50ZXI6IGNvYXJzZSknO1xuZXhwb3J0IGNvbnN0IFNiYk1lZGlhUXVlcnlCcmVha3BvaW50WmVyb0FuZEFib3ZlID0gYChtaW4td2lkdGg6ICR7U2JiQnJlYWtwb2ludFplcm9NaW59KWA7XG5leHBvcnQgY29uc3QgU2JiTWVkaWFRdWVyeUJyZWFrcG9pbnRTbWFsbEFuZEFib3ZlID0gYChtaW4td2lkdGg6ICR7U2JiQnJlYWtwb2ludFNtYWxsTWlufSlgO1xuZXhwb3J0IGNvbnN0IFNiYk1lZGlhUXVlcnlCcmVha3BvaW50TGFyZ2VBbmRBYm92ZSA9IGAobWluLXdpZHRoOiAke1NiYkJyZWFrcG9pbnRMYXJnZU1pbn0pYDtcbmV4cG9ydCBjb25zdCBTYmJNZWRpYVF1ZXJ5QnJlYWtwb2ludFVsdHJhQW5kQWJvdmUgPSBgKG1pbi13aWR0aDogJHtTYmJCcmVha3BvaW50VWx0cmFNaW59KWA7XG5leHBvcnQgY29uc3QgU2JiTWVkaWFRdWVyeUJyZWFrcG9pbnRTbWFsbEFuZEJlbG93ID0gYChtYXgtd2lkdGg6ICR7U2JiQnJlYWtwb2ludFNtYWxsTWF4fSlgO1xuZXhwb3J0IGNvbnN0IFNiYk1lZGlhUXVlcnlCcmVha3BvaW50TGFyZ2VBbmRCZWxvdyA9IGAobWF4LXdpZHRoOiAke1NiYkJyZWFrcG9pbnRMYXJnZU1heH0pYDtcbi8qIGVzbGludC1lbmFibGUgQHR5cGVzY3JpcHQtZXNsaW50L25hbWluZy1jb252ZW50aW9uICovXG5cbi8qKlxuICogQSBjYWxsYmFjaywgd2hpY2ggaXMgaW52b2tlZCB3aGVuIHRoZSBhc3NvY2lhdGVkIG1lZGlhIHF1ZXJ5IG1hdGNoXG4gKiBzdGF0dXMgY2hhbmdlcy5cbiAqL1xuZXhwb3J0IHR5cGUgU2JiTWVkaWFNYXRjaGVySGFuZGxlciA9IChtYXRjaGVzOiBib29sZWFuKSA9PiB2b2lkO1xuXG5pbnRlcmZhY2UgTWVkaWFRdWVyeUVudHJ5IHtcbiAgbWVkaWFRdWVyeUxpc3Q6IE1lZGlhUXVlcnlMaXN0O1xuICBldmVudEhhbmRsZXI6IChldmVudDogTWVkaWFRdWVyeUxpc3RFdmVudCkgPT4gdm9pZDtcbiAgaGFuZGxlcnM6IFNldDxTYmJNZWRpYU1hdGNoZXJIYW5kbGVyPjtcbn1cblxuLyoqXG4gKiBXZSB3YW50IHRvIGNhY2hlIE1lZGlhUXVlcnlMaXN0IGluc3RhbmNlcyBhbmQgY29ycmVzcG9uZGluZ1xuICogZXZlbnQgaGFuZGxlcnMsIGFzIGEgbXVsdGl0dWRlIG9mIGV2ZW50IGhhbmRsZXJzIG9uIGdsb2JhbCBvYmplY3RzXG4gKiBjYW4gZGVncmFkZSBwZXJmb3JtYW5jZSB3aXRoIHRpbWUuXG4gKi9cbmNvbnN0IG1lZGlhUXVlcnlSZWdpc3RyeSA9IG5ldyBNYXA8c3RyaW5nLCBNZWRpYVF1ZXJ5RW50cnk+KCk7XG5cbi8qKlxuICogVGhpcyBjb250cm9sbGVyIGFsbG93cyBsaXN0ZW5pbmcgdG8gbWVkaWEgcXVlcnkgY2hhbmdlcy5cbiAqXG4gKiBAZXhhbXBsZVxuICogbmV3IFNiYk1lZGlhTWF0Y2hlckNvbnRyb2xsZXIodGhpcywge1xuICogICBbU2JiRm9yY2VkQ29sb3JzUXVlcnldOiAobWF0Y2hlcykgPT4gZG9Tb21ldGhpbmcobWF0Y2hlcyksXG4gKiB9KVxuICovXG5leHBvcnQgY2xhc3MgU2JiTWVkaWFNYXRjaGVyQ29udHJvbGxlciBpbXBsZW1lbnRzIFJlYWN0aXZlQ29udHJvbGxlciB7XG4gIHB1YmxpYyBjb25zdHJ1Y3RvcihcbiAgICBob3N0OiBSZWFjdGl2ZUNvbnRyb2xsZXJIb3N0LFxuICAgIHByaXZhdGUgX3F1ZXJpZXM6IFJlY29yZDxzdHJpbmcsIFNiYk1lZGlhTWF0Y2hlckhhbmRsZXI+LFxuICApIHtcbiAgICBob3N0LmFkZENvbnRyb2xsZXIodGhpcyk7XG4gIH1cblxuICAvKipcbiAgICogUmV0dXJucyB3aGV0aGVyIHRoZSBnaXZlbiBxdWVyeSBtYXRjaGVzLiBSZXR1cm5zIG51bGwgd2l0aCBTU1IuXG4gICAqIEBwYXJhbSBxdWVyeSBUaGUgcXVlcnkgdG8gY2hlY2sgYWdhaW5zdC5cbiAgICogQHJldHVybnMgV2hldGhlciB0aGUgcXVlcnkgbWF0Y2hlcyBvciBudWxsIHdpdGggU1NSLlxuICAgKi9cbiAgcHVibGljIG1hdGNoZXMocXVlcnk6IHN0cmluZyk6IGJvb2xlYW4gfCBudWxsIHtcbiAgICAvLyBJZiB3ZSB1c2UgdGhlIGNhY2hlZCBpbnN0YW5jZSwgV2Via2l0IHNlZW1zIHRvIHVwZGF0ZSB0aGUgc3RhdGUgYSB0aWNrIHRvbyBsYXRlLlxuICAgIC8vIER1ZSB0byB0aGlzIHdlIGRpcmVjdGx5IHVzZSBtYXRjaE1lZGlhIGhlcmUuXG4gICAgcmV0dXJuIGlzU2VydmVyID8gbnVsbCA6IG1hdGNoTWVkaWEocXVlcnkpLm1hdGNoZXM7XG4gIH1cblxuICBwdWJsaWMgaG9zdENvbm5lY3RlZCgpOiB2b2lkIHtcbiAgICBpZiAoaXNTZXJ2ZXIpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICBmb3IgKGNvbnN0IFtxdWVyeSwgaGFuZGxlcl0gb2YgT2JqZWN0LmVudHJpZXModGhpcy5fcXVlcmllcykpIHtcbiAgICAgIGNvbnN0IG1lZGlhUXVlcnkgPSBtZWRpYVF1ZXJ5UmVnaXN0cnkuZ2V0KHF1ZXJ5KTtcbiAgICAgIGlmIChtZWRpYVF1ZXJ5KSB7XG4gICAgICAgIG1lZGlhUXVlcnkuaGFuZGxlcnMuYWRkKGhhbmRsZXIpO1xuICAgICAgfSBlbHNlIHtcbiAgICAgICAgY29uc3QgbWVkaWFRdWVyeUxpc3QgPSBtYXRjaE1lZGlhKHF1ZXJ5KTtcbiAgICAgICAgY29uc3QgaGFuZGxlcnMgPSBuZXcgU2V0KFtoYW5kbGVyXSk7XG4gICAgICAgIGNvbnN0IGV2ZW50SGFuZGxlciA9IChlOiBNZWRpYVF1ZXJ5TGlzdEV2ZW50KTogdm9pZCA9PlxuICAgICAgICAgIGhhbmRsZXJzLmZvckVhY2goKGgpID0+IGgoZS5tYXRjaGVzKSk7XG4gICAgICAgIG1lZGlhUXVlcnlMaXN0LmFkZEV2ZW50TGlzdGVuZXIoJ2NoYW5nZScsIGV2ZW50SGFuZGxlcik7XG4gICAgICAgIG1lZGlhUXVlcnlSZWdpc3RyeS5zZXQocXVlcnksIHsgbWVkaWFRdWVyeUxpc3QsIGhhbmRsZXJzLCBldmVudEhhbmRsZXIgfSk7XG4gICAgICB9XG4gICAgfVxuICB9XG5cbiAgcHVibGljIGhvc3REaXNjb25uZWN0ZWQoKTogdm9pZCB7XG4gICAgZm9yIChjb25zdCBbcXVlcnksIGhhbmRsZXJdIG9mIE9iamVjdC5lbnRyaWVzKHRoaXMuX3F1ZXJpZXMpKSB7XG4gICAgICBjb25zdCBtZWRpYVF1ZXJ5ID0gbWVkaWFRdWVyeVJlZ2lzdHJ5LmdldChxdWVyeSk7XG4gICAgICBpZiAobWVkaWFRdWVyeSkge1xuICAgICAgICBtZWRpYVF1ZXJ5LmhhbmRsZXJzLmRlbGV0ZShoYW5kbGVyKTtcbiAgICAgICAgaWYgKCFtZWRpYVF1ZXJ5LmhhbmRsZXJzLnNpemUpIHtcbiAgICAgICAgICBtZWRpYVF1ZXJ5UmVnaXN0cnkuZGVsZXRlKHF1ZXJ5KTtcbiAgICAgICAgfVxuICAgICAgfVxuICAgIH1cbiAgfVxufVxuXG4vKipcbiAqIEEgc3BlY2lhbGl6ZWQgdmVyc2lvbiBvZiB0aGUgU2JiTWVkaWFNYXRjaGVyQ29udHJvbGxlciwgd2hpY2hcbiAqIHRha2VzIHRoZSBjb2xvci1zY2hlbWUgQ1NTIHByb3BlcnR5IGludG8gYWNjb3VudCB3aGVuIGRldGVybWluaW5nXG4gKiB0aGUgZGFyayBtb2RlIHN0YXRlIGFuZCB1cGRhdGVzIGEgOnN0YXRlKGRhcmspIG9uIHRoZSBob3N0LlxuICpcbiAqIEBleGFtcGxlXG4gKiBuZXcgU2JiRGFya01vZGVDb250cm9sbGVyKHRoaXMsIChpc0RhcmtNb2RlKSA9PiBkb1NvbWV0aGluZyhpc0RhcmtNb2RlKSk7XG4gKi9cbmV4cG9ydCBjbGFzcyBTYmJEYXJrTW9kZUNvbnRyb2xsZXIgZXh0ZW5kcyBTYmJNZWRpYU1hdGNoZXJDb250cm9sbGVyIHtcbiAgLyoqIFRoZSBjdXJyZW50IG1vZGUgYmFzZWQgb24gdGhlIGNsYXNzIGF0dHJpYnV0ZSBvZiB0aGUgPGh0bWw+IGVsZW1lbnQuICovXG4gIHByaXZhdGUgc3RhdGljIF9jdXJyZW50TW9kZTogJ3NiYi1saWdodC1kYXJrJyB8ICdzYmItbGlnaHQnIHwgJ3NiYi1kYXJrJyB8IG51bGwgPVxuICAgIHRoaXMuX3JlYWRMaWdodERhcmtDbGFzcygpO1xuXG4gIC8qKiBNdXRhdGlvbk9ic2VydmVyIHRoYXQgb2JzZXJ2ZXMgdGhlIFwiY2xhc3NcIiBhdHRyaWJ1dGUgb2YgdGhlIDxodG1sPiBlbGVtZW50LiAqL1xuICBwcml2YXRlIHN0YXRpYyByZWFkb25seSBfb2JzZXJ2ZXIgPSAhaXNTZXJ2ZXJcbiAgICA/IG5ldyBNdXRhdGlvbk9ic2VydmVyKChtdXRhdGlvbnMpID0+IHtcbiAgICAgICAgaWYgKG11dGF0aW9uc1swXS5vbGRWYWx1ZSAhPT0gZG9jdW1lbnQuZG9jdW1lbnRFbGVtZW50LmdldEF0dHJpYnV0ZSgnY2xhc3MnKSkge1xuICAgICAgICAgIGNvbnN0IG5ld01vZGUgPSB0aGlzLl9yZWFkTGlnaHREYXJrQ2xhc3MoKTtcbiAgICAgICAgICBpZiAodGhpcy5fY3VycmVudE1vZGUgIT09IG5ld01vZGUpIHtcbiAgICAgICAgICAgIFNiYkRhcmtNb2RlQ29udHJvbGxlci5yZXF1ZXN0VXBkYXRlKCk7XG4gICAgICAgICAgICB0aGlzLl9jdXJyZW50TW9kZSA9IG5ld01vZGU7XG4gICAgICAgICAgfVxuICAgICAgICB9XG4gICAgICB9KVxuICAgIDogbnVsbDtcblxuICBwcml2YXRlIHN0YXRpYyByZWFkb25seSBfb2JzZXJ2ZXJDb25maWcgPSB7XG4gICAgYXR0cmlidXRlRmlsdGVyOiBbJ2NsYXNzJ10sXG4gICAgYXR0cmlidXRlT2xkVmFsdWU6IHRydWUsXG4gIH07XG5cbiAgcHJpdmF0ZSByZWFkb25seSBfb25DaGFuZ2VXaXRoU3RhdGVVcGRhdGVyOiAoKSA9PiB2b2lkO1xuXG4gIHB1YmxpYyBjb25zdHJ1Y3RvcihcbiAgICBwcml2YXRlIF9ob3N0OiBSZWFjdGl2ZUNvbnRyb2xsZXJIb3N0ICYgSFRNTEVsZW1lbnQgJiBTYmJFbGVtZW50SW50ZXJuYWxzTWl4aW5UeXBlLFxuICAgIG9uQ2hhbmdlOiBTYmJNZWRpYU1hdGNoZXJIYW5kbGVyLFxuICApIHtcbiAgICBjb25zdCBvbkNoYW5nZVdpdGhTdGF0ZVVwZGF0ZXI6ICgpID0+IHZvaWQgPSAoKSA9PiB7XG4gICAgICBvbkNoYW5nZSh0aGlzLm1hdGNoZXMoKSk7XG4gICAgICDJtXN0YXRlQ29udHJvbGxlcih0aGlzLl9ob3N0KS50b2dnbGUoJ2RhcmsnLCB0aGlzLm1hdGNoZXMoKSk7XG4gICAgfTtcbiAgICBzdXBlcihfaG9zdCwge1xuICAgICAgW1NiYk1lZGlhUXVlcnlEYXJrTW9kZV06IG9uQ2hhbmdlV2l0aFN0YXRlVXBkYXRlcixcbiAgICB9KTtcbiAgICB0aGlzLl9vbkNoYW5nZVdpdGhTdGF0ZVVwZGF0ZXIgPSBvbkNoYW5nZVdpdGhTdGF0ZVVwZGF0ZXI7XG4gIH1cblxuICBwcml2YXRlIHN0YXRpYyBfcmVhZExpZ2h0RGFya0NsYXNzKCk6ICdzYmItbGlnaHQtZGFyaycgfCAnc2JiLWxpZ2h0JyB8ICdzYmItZGFyaycgfCBudWxsIHtcbiAgICBpZiAoaXNTZXJ2ZXIpIHtcbiAgICAgIHJldHVybiBudWxsO1xuICAgIH1cbiAgICBjb25zdCBjbGFzc0xpc3QgPSBkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQuY2xhc3NMaXN0O1xuICAgIHJldHVybiAoXG4gICAgICAoWydzYmItbGlnaHQtZGFyaycsICdzYmItZGFyaycsICdzYmItbGlnaHQnXSBhcyBjb25zdCkuZmluZCgobW9kZSkgPT5cbiAgICAgICAgY2xhc3NMaXN0LmNvbnRhaW5zKG1vZGUpLFxuICAgICAgKSA/PyBudWxsXG4gICAgKTtcbiAgfVxuXG4gIC8qKlxuICAgKiBSZXF1ZXN0cyBhbiB1cGRhdGUgb2YgdGhlIGRhcmsgbW9kZSBzdGF0ZS4gVGhpcyBpcyBuZWVkZWQgd2hlbiB0aGUgY29sb3Itc2NoZW1lXG4gICAqIENTUyBwcm9wZXJ0eSBjaGFuZ2VzLCBhcyB0aGUgbWVkaWEgcXVlcnkgZG9lcyBub3QgcGljayB0aGlzIHVwIGF1dG9tYXRpY2FsbHkuXG4gICAqL1xuICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgbHluZS9uZWVkcy1zdXBlci1jYWxsLXJ1bGVcbiAgcHVibGljIHN0YXRpYyByZXF1ZXN0VXBkYXRlKCk6IHZvaWQge1xuICAgIGNvbnN0IGVudHJ5ID0gbWVkaWFRdWVyeVJlZ2lzdHJ5LmdldChTYmJNZWRpYVF1ZXJ5RGFya01vZGUpO1xuICAgIGlmIChlbnRyeSkge1xuICAgICAgZW50cnkuaGFuZGxlcnMuZm9yRWFjaCgoaCkgPT4gaChlbnRyeS5tZWRpYVF1ZXJ5TGlzdC5tYXRjaGVzKSk7XG4gICAgfVxuICB9XG5cbiAgcHVibGljIG92ZXJyaWRlIGhvc3RDb25uZWN0ZWQoKTogdm9pZCB7XG4gICAgY29uc3QgaXNGaXJzdExpc3RlbmVyID1cbiAgICAgIChtZWRpYVF1ZXJ5UmVnaXN0cnkuZ2V0KFNiYk1lZGlhUXVlcnlEYXJrTW9kZSk/LmhhbmRsZXJzLnNpemUgPz8gMCkgPT09IDA7XG4gICAgc3VwZXIuaG9zdENvbm5lY3RlZCgpO1xuXG4gICAgaWYgKGlzRmlyc3RMaXN0ZW5lcikge1xuICAgICAgU2JiRGFya01vZGVDb250cm9sbGVyLl9vYnNlcnZlciEub2JzZXJ2ZShcbiAgICAgICAgZG9jdW1lbnQuZG9jdW1lbnRFbGVtZW50LFxuICAgICAgICBTYmJEYXJrTW9kZUNvbnRyb2xsZXIuX29ic2VydmVyQ29uZmlnLFxuICAgICAgKTtcbiAgICB9XG5cbiAgICB0aGlzLl9vbkNoYW5nZVdpdGhTdGF0ZVVwZGF0ZXIoKTtcbiAgfVxuXG4gIHB1YmxpYyBvdmVycmlkZSBob3N0RGlzY29ubmVjdGVkKCk6IHZvaWQge1xuICAgIHN1cGVyLmhvc3REaXNjb25uZWN0ZWQoKTtcblxuICAgIGlmICgobWVkaWFRdWVyeVJlZ2lzdHJ5LmdldChTYmJNZWRpYVF1ZXJ5RGFya01vZGUpPy5oYW5kbGVycy5zaXplID8/IDApID09PSAwKSB7XG4gICAgICBTYmJEYXJrTW9kZUNvbnRyb2xsZXIuX29ic2VydmVyIS5kaXNjb25uZWN0KCk7XG4gICAgfVxuICB9XG5cbiAgcHVibGljIG92ZXJyaWRlIG1hdGNoZXMoKTogYm9vbGVhbiB7XG4gICAgaWYgKGlzU2VydmVyKSB7XG4gICAgICByZXR1cm4gZmFsc2U7XG4gICAgfVxuICAgIGNvbnN0IGNvbG9yU2NoZW1lID0gZ2V0Q29tcHV0ZWRTdHlsZSh0aGlzLl9ob3N0KS5nZXRQcm9wZXJ0eVZhbHVlKCdjb2xvci1zY2hlbWUnKTtcbiAgICBjb25zdCBkYXJrQXZhaWxhYmxlID0gY29sb3JTY2hlbWUuaW5jbHVkZXMoJ2RhcmsnKTtcbiAgICBjb25zdCBkYXJrT25seSA9IGNvbG9yU2NoZW1lLnRyaW0oKSA9PT0gJ2RhcmsnO1xuICAgIGNvbnN0IHByZWZlcnJlZERhcmtNb2RlID0gc3VwZXIubWF0Y2hlcyhTYmJNZWRpYVF1ZXJ5RGFya01vZGUpIGFzIGJvb2xlYW47XG5cbiAgICByZXR1cm4gKHByZWZlcnJlZERhcmtNb2RlICYmIGRhcmtBdmFpbGFibGUpIHx8IGRhcmtPbmx5O1xuICB9XG59XG4iXSwibmFtZXMiOlsiybVzdGF0ZUNvbnRyb2xsZXIiXSwibWFwcGluZ3MiOiI7OztBQWNPLE1BQU0sNEJBQTRCO0FBQ2xDLE1BQU0sd0JBQXdCO0FBQzlCLE1BQU0scUJBQXFCO0FBQzNCLE1BQU0sNkJBQTZCO0FBQ25DLE1BQU0sc0NBQXNDLGVBQWUsb0JBQW9CO0FBQy9FLE1BQU0sdUNBQXVDLGVBQWUscUJBQXFCO0FBQ2pGLE1BQU0sdUNBQXVDLGVBQWUscUJBQXFCO0FBQ2pGLE1BQU0sdUNBQXVDLGVBQWUscUJBQXFCO0FBQ2pGLE1BQU0sdUNBQXVDLGVBQWUscUJBQXFCO0FBQ2pGLE1BQU0sdUNBQXVDLGVBQWUscUJBQXFCO0FBb0J4RixNQUFNLHlDQUF5QixJQUFBO01BVWxCLDBCQUF5QjtBQUFBLEVBQ3BDLFlBQ0UsTUFDUSxVQUFnRDtBQUFoRCxTQUFBLFdBQUE7QUFFUixTQUFLLGNBQWMsSUFBSTtBQUFBLEVBQ3pCO0FB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

package/development/core/controllers/overlay-position-controller.d.ts

@@ -0,0 +1,61 @@
+import { ReactiveController, ReactiveControllerHost } from 'lit';
+import { SbbElementInternalsMixinType } from '../mixins.ts';
+/**
+ * Controller for managing overlays positioning. Also acts as a polyfill when native
+ * CSS Anchor Positioning is not supported (enough).
+ * Applies unique anchor names when using native CSS Anchor Positioning
+ * or calculates and applies correct positions in polyfill mode.
+ *
+ * Also, the controller sets the 'data-position' attribute on the overlay element.
+ * This can be used to apply specific styles based on the current position of the overlay.
+ *
+ * ### Implementation
+ * Define and apply the following CSS variables on the overlay element:
+ * ```scss
+ *   --sbb-overlay-position-area: block-end; // Default
+ *   --sbb-overlay-position-try-fallbacks: block-start, inline-end, inline-start; // Fallbacks
+ *
+ *   position-area: var(--sbb-overlay-position-area);
+ *   position-try-fallbacks: var(--sbb-overlay-position-try-fallbacks);
+ * ```
+ */
+export declare class SbbOverlayPositionController implements ReactiveController {
+    private _usePolyfill;
+    private readonly _resizeObserver;
+    private readonly _overlay;
+    private _abortController?;
+    private _anchor?;
+    private _overlayStyles?;
+    private _frame?;
+    private _anchorName;
+    private _positions;
+    private _lastPosition?;
+    /** Get the current position. (e.g. block-end, block-start, etc.) */
+    get currentPosition(): string;
+    constructor(host: ReactiveControllerHost & HTMLElement & SbbElementInternalsMixinType, _usePolyfill?: boolean);
+    hostConnected(): void;
+    hostUpdate(): void;
+    /**
+     * Connects the overlay to the given trigger element and determines the optimal position.
+     * Usually, this is called when the overlay is opened.
+     * @param anchor The anchor element.
+     */
+    connect(anchor: HTMLElement): void;
+    disconnect(): void;
+    private _requestCalculatePosition;
+    private _calculatePosition;
+    /**
+     * Calculates the optimal position that fits the overlay.
+     * @param positions The list of positions to check.
+     * @private
+     */
+    private _getOptimalPosition;
+    private _applyOverlayPosition;
+    /**
+     * Only used in polyfill mode.
+     * Reads the list of the configured positions from the CSS variables.
+     * @private
+     */
+    private _readPositionsFromCss;
+}
+//# sourceMappingURL=overlay-position-controller.d.ts.map

package/development/core/controllers/overlay-position-controller.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"overlay-position-controller.d.ts","sourceRoot":"","sources":["../../../../../src/elements/core/controllers/overlay-position-controller.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,kBAAkB,EAAE,KAAK,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAErF,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,cAAc,CAAC;AAqDjE;;;;;;;;;;;;;;;;;;GAkBG;AACH,qBAAa,4BAA6B,YAAW,kBAAkB;IAyBnE,OAAO,CAAC,YAAY;IAxBtB,OAAO,CAAC,QAAQ,CAAC,eAAe,CAEtB;IACV,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAsE;IAC/F,OAAO,CAAC,gBAAgB,CAAC,CAAkB;IAC3C,OAAO,CAAC,OAAO,CAAC,CAAc;IAC9B,OAAO,CAAC,cAAc,CAAC,CAAsB;IAC7C,OAAO,CAAC,MAAM,CAAC,CAA2C;IAC1D,OAAO,CAAC,WAAW,CAAsC;IACzD,OAAO,CAAC,UAAU,CAAgB;IAClC,OAAO,CAAC,aAAa,CAAC,CAAS;IAE/B,oEAAoE;IACpE,IAAW,eAAe,IAAI,MAAM,CAOnC;gBAGC,IAAI,EAAE,sBAAsB,GAAG,WAAW,GAAG,4BAA4B,EACjE,YAAY,UAA8B;IAM7C,aAAa,IAAI,IAAI;IASrB,UAAU,IAAI,IAAI;IAOzB;;;;OAIG;IACI,OAAO,CAAC,MAAM,EAAE,WAAW,GAAG,IAAI;IAmClC,UAAU,IAAI,IAAI;IAOzB,OAAO,CAAC,yBAAyB;IAOjC,OAAO,CAAC,kBAAkB;IAa1B;;;;OAIG;IACH,OAAO,CAAC,mBAAmB;IAkL3B,OAAO,CAAC,qBAAqB;IAM7B;;;;OAIG;IACH,OAAO,CAAC,qBAAqB;CA6B9B"}