@sbb-esta/lyne-elements 2.6.0 → 2.7.0

package/core/mixins.js

@@ -1,976 +1,32 @@
-var L = (d) => {
-  throw TypeError(d);
-};
-var F = (d, v, c) => v.has(d) || L("Cannot " + c);
-var C = (d, v, c) => (F(d, v, "read from private field"), c ? c.call(d) : v.get(d)), E = (d, v, c) => v.has(d) ? L("Cannot add the same private member more than once") : v instanceof WeakSet ? v.add(d) : v.set(d, c), S = (d, v, c, l) => (F(d, v, "write to private field"), l ? l.call(d, c) : v.set(d, c), c);
-import { __esDecorate as y, __runInitializers as _ } from "tslib";
-import { property as k, state as N, eventOptions as G } from "lit/decorators.js";
-import { forceType as I, getOverride as H, hostAttributes as K } from "./decorators.js";
-import { defaultConverter as T, isServer as A, html as R, nothing as O, css as W } from "lit";
-import { SbbLanguageController as M, SbbConnectedAbortController as X } from "./controllers.js";
-import { preventScrollOnSpacebarPress as Y, EventEmitter as J } from "./eventing.js";
-import { i18nCheckboxRequired as Q, i18nInputRequired as Z, i18nSelectionRequired as ee } from "./i18n.js";
-import { isWebkit as j } from "./dom.js";
-import { sbbInputModalityDetector as te, interactivityChecker as se, isArrowKeyPressed as ae, getNextElementIndex as ie } from "./a11y.js";
-import "../screen-reader-only.js";
-const ye = (d) => {
-  class v extends d {
-    constructor() {
-      super(...arguments), this.isAnimating = !1, this._animationPromise = Promise.resolve();
-    }
-    /**
-     * Returns a promise which completes whenever an animation ends.
-     * When a new animation starts, a new Promise is returned.
-     */
-    get animationComplete() {
-      return this._animationPromise;
-    }
-    disconnectedCallback() {
-      super.disconnectedCallback(), this.stopAnimation();
-    }
-    startAnimation() {
-      this.isAnimating || (this._animationPromise = this._enqueueAnimation());
-    }
-    /**
-     * Overriding stopAnimation() breaks functionality.
-     */
-    stopAnimation() {
-    }
-    async _enqueueAnimation() {
-      this.isAnimating = !0;
-      const l = this.stopAnimation, f = new Promise((n) => {
-        this.stopAnimation = () => {
-          l(), this.isAnimating = !1, n();
-        };
-      });
-      try {
-        await this._animationPromise;
-      } catch (n) {
-        Promise.reject(n);
-      }
-      return f;
-    }
-  }
-  return v;
-}, B = (d) => (() => {
-  var b, t;
-  let c = d, l, f = [], n = [];
-  return t = class extends c {
-    constructor() {
-      super(...arguments);
-      E(this, b, _(this, f, !1));
-      _(this, n);
-    }
-    /** Whether the component is disabled. */
-    get disabled() {
-      return C(this, b);
-    }
-    set disabled(e) {
-      S(this, b, e);
-    }
-    /**
-     * Will be used as 'or' check to the current disabled state.
-     * Can e.g. be used to read disabled state of a group.
-     */
-    isDisabledExternally() {
-      return !1;
-    }
-  }, b = new WeakMap(), (() => {
-    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(c[Symbol.metadata] ?? null) : void 0;
-    l = [I(), k({ reflect: !0, type: Boolean }), H((s, a) => a || s.isDisabledExternally())], y(t, null, l, { kind: "accessor", name: "disabled", static: !1, private: !1, access: { has: (s) => "disabled" in s, get: (s) => s.disabled, set: (s, a) => {
-      s.disabled = a;
-    } }, metadata: e }, f, n), e && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
-  })(), t;
-})(), re = (d) => (() => {
-  var b, t;
-  let c = d, l, f = [], n = [];
-  return t = class extends c {
-    constructor() {
-      super(...arguments);
-      E(this, b, _(this, f, !1));
-      _(this, n);
-    }
-    /** Whether the button should be aria-disabled but stay interactive. */
-    get disabledInteractive() {
-      return C(this, b);
-    }
-    set disabledInteractive(e) {
-      S(this, b, e);
-    }
-  }, b = new WeakMap(), (() => {
-    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(c[Symbol.metadata] ?? null) : void 0;
-    l = [I(), k({ attribute: "disabled-interactive", type: Boolean, reflect: !0 })], y(t, null, l, { kind: "accessor", name: "disabledInteractive", static: !1, private: !1, access: { has: (s) => "disabledInteractive" in s, get: (s) => s.disabledInteractive, set: (s, a) => {
-      s.disabledInteractive = a;
-    } }, metadata: e }, f, n), e && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
-  })(), t;
-})(), Se = (d) => {
-  class v extends re(B(d)) {
-    willUpdate(l) {
-      super.willUpdate(l), l.has("disabledInteractive") && (this.internals.ariaDisabled = this.disabledInteractive ? "true" : null), l.has("disabled") && (this.disabled ? this.removeAttribute("tabindex") : this.setAttribute("tabindex", "0"));
-    }
-  }
-  return v;
-}, $ = {
-  badInput: !1,
-  customError: !1,
-  patternMismatch: !1,
-  rangeOverflow: !1,
-  rangeUnderflow: !1,
-  stepMismatch: !1,
-  tooLong: !1,
-  tooShort: !1,
-  typeMismatch: !1,
-  valueMissing: !1
-};
-if (typeof ValidityState > "u") {
-  const d = class {
-    get valid() {
-      return !0;
-    }
-    constructor() {
-      throw new TypeError("Illegal constructor");
-    }
-  };
-  Object.entries($).forEach(([v, c]) => Object.assign(d.prototype, {
-    get [v]() {
-      return c;
-    }
-  })), globalThis.ValidityState = d;
-}
-const V = (d) => (() => {
-  var u, e;
-  let c = d, l = [], f, n, b, t = [], r = [];
-  return e = class extends c {
-    constructor(...i) {
-      var o;
-      super(...i);
-      E(this, u);
-      this._value = (_(this, l), null), this.internals = this.attachInternals(), this._validityStates = /* @__PURE__ */ new Map(), S(this, u, _(this, t, !1)), _(this, r), (o = this.addEventListener) == null || o.call(this, "invalid", (p) => p.preventDefault());
-    }
-    /**
-     * Returns the form owner of this element.
-     */
-    get form() {
-      return this.internals.form;
-    }
-    /**
-     * Name of the form element. Will be read from name attribute.
-     *
-     * @description Developer note: In this case updating the attribute must be synchronous.
-     * Due to this it is implemented as a getter/setter and the attributeChangedCallback() handles the diff check.
-     */
-    set name(i) {
-      this.setAttribute("name", `${i}`), this.updateFormValue();
-    }
-    get name() {
-      return this.getAttribute("name") ?? "";
-    }
-    /** @internal */
-    get type() {
-      return this.localName;
-    }
-    /** Value of the form element. */
-    set value(i) {
-      this._value = i, this.updateFormValue();
-    }
-    get value() {
-      return this._value;
-    }
-    /**
-     * Returns the ValidityState object for this element.
-     */
-    get validity() {
-      return this.internals.validity;
-    }
-    /**
-     * Returns the current error message, if available, which corresponds
-     * to the current validation state.
-     * Please note that only one message is returned at a time (e.g. if
-     * multiple validity states are invalid, only the chronologically first one
-     * is returned until it is fixed, at which point the next message might be
-     * returned, if it is still applicable). Also a custom validity message
-     * (see below) has precedence over native validation messages.
-     */
-    get validationMessage() {
-      return this.internals.validationMessage;
-    }
-    /**
-     * Returns true if this element will be validated
-     * when the form is submitted; false otherwise.
-     */
-    get willValidate() {
-      return this.internals.willValidate;
-    }
-    /** Whenever a surrounding form or fieldset is changing its disabled state. */
-    get formDisabled() {
-      return C(this, u);
-    }
-    set formDisabled(i) {
-      S(this, u, i);
-    }
-    attributeChangedCallback(i, o, p) {
-      (i !== "name" || o !== p) && super.attributeChangedCallback(i, o, p);
-    }
-    /**
-     * Returns true if this element has no validity problems; false otherwise.
-     * Fires an invalid event at the element in the latter case.
-     */
-    checkValidity() {
-      return this.internals.checkValidity();
-    }
-    /**
-     * Returns true if this element has no validity problems; otherwise,
-     * returns false, fires an invalid event at the element,
-     * and (if the event isn't canceled) reports the problem to the user.
-     */
-    reportValidity() {
-      return this.internals.reportValidity();
-    }
-    /**
-     * Sets the custom validity message for this element. Use the empty string
-     * to indicate that the element does not have a custom validity error.
-     */
-    setCustomValidity(i) {
-      i ? this.setValidityFlag("customError", i) : this.removeValidityFlag("customError");
-    }
-    /**
-     * Is called whenever a surrounding form / fieldset changes disabled state.
-     * @param disabled
-     *
-     * @internal
-     */
-    formDisabledCallback(i) {
-      Promise.resolve().then(() => {
-        this.formDisabled = i;
-      });
-    }
-    requestUpdate(i, o, p) {
-      super.requestUpdate(i, o, p), this.hasUpdated && this.shouldValidate(i) && this.validate();
-    }
-    firstUpdated(i) {
-      super.firstUpdated(i), this.validate();
-    }
-    /**
-     * Marks this element as suffering from the constraint indicated by the
-     * flag argument and associates the given message to it.
-     * Note that only one message is displayed at a time and custom messages by
-     * consumers are always displayed before internal messages and internal
-     * messages are displayed in the order they were added.
-     * To set/define custom validity state flags, you need to extend the
-     * ValidityState prototype (and the CustomValidityState interface).
-     *
-     * @example
-     *
-     *   // The type of the custom validity state does not need to be boolean.
-     *   Object.assign(ValidityState.prototype, {
-     *     get myError(): boolean {
-     *       return false;
-     *     },
-     *   });
-     *
-     *   declare global {
-     *     interface CustomValidityState {
-     *       myError: boolean;
-     *     }
-     *   }
-     */
-    setValidityFlag(i, o, p) {
-      p ?? (p = !0);
-      const x = this._validityStates.get(i);
-      (!x || x.message !== o || x.flagValue !== p) && (this._validityStates.set(i, { flagValue: p, message: o }), this._setInternalValidity());
-    }
-    /** Removes the validity state flag entry and updates validity state. */
-    removeValidityFlag(i) {
-      this._validityStates.has(i) && (this._validityStates.delete(i), this._setInternalValidity());
-    }
-    /** To be called whenever the current element needs to be validated. */
-    validate() {
-    }
-    /** Whether validation should be run on a property change with the given name. */
-    shouldValidate(i) {
-      return !i;
-    }
-    _setInternalValidity() {
-      var x;
-      let i = (x = this._validityStates.get("customError")) == null ? void 0 : x.message;
-      const o = {};
-      this._validityStates.forEach(({ flagValue: m, message: g }, h) => {
-        o[h] = m, i || (i = g);
-      });
-      const p = Object.keys(ValidityState.prototype).filter((m) => !(m in $) && m !== "valid");
-      for (const m of p) {
-        const g = m in o ? o[m] : !1;
-        Object.defineProperty(this.internals.validity, m, { value: g, configurable: !0 }), g && (o.customError = !0);
-      }
-      this.internals.setValidity(o, i), j && Object.defineProperty(this.internals.validity, "customError", {
-        value: this._validityStates.has("customError") || !!o.customError,
-        configurable: !0
-      });
-    }
-  }, u = new WeakMap(), (() => {
-    const i = typeof Symbol == "function" && Symbol.metadata ? Object.create(c[Symbol.metadata] ?? null) : void 0;
-    f = [k()], n = [k()], b = [N()], y(e, null, f, { kind: "setter", name: "name", static: !1, private: !1, access: { has: (o) => "name" in o, set: (o, p) => {
-      o.name = p;
-    } }, metadata: i }, null, l), y(e, null, n, { kind: "setter", name: "value", static: !1, private: !1, access: { has: (o) => "value" in o, set: (o, p) => {
-      o.value = p;
-    } }, metadata: i }, null, l), y(e, null, b, { kind: "accessor", name: "formDisabled", static: !1, private: !1, access: { has: (o) => "formDisabled" in o, get: (o) => o.formDisabled, set: (o, p) => {
-      o.formDisabled = p;
-    } }, metadata: i }, t, r), i && Object.defineProperty(e, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: i });
-  })(), e.formAssociated = !0, e;
-})(), D = (d) => (() => {
-  var n;
-  let c = d, l = [], f;
-  return n = class extends c {
-    constructor() {
-      super(...arguments), this._required = (_(this, l), !1);
-    }
-    /** Whether the component is required. */
-    set required(t) {
-      this._required = !!t;
-    }
-    get required() {
-      return this._required || this.isRequiredExternally();
-    }
-    willUpdate(t) {
-      super.willUpdate(t), t.has("required") && (this.internals.ariaRequired = `${this.required}`);
-    }
-    /**
-     * Will be used as 'or' check to the current required state.
-     * Can e.g. be used to read required state of a group.
-     */
-    isRequiredExternally() {
-      return !1;
-    }
-  }, (() => {
-    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(c[Symbol.metadata] ?? null) : void 0;
-    f = [k({ reflect: !0, type: Boolean })], y(n, null, f, { kind: "setter", name: "required", static: !1, private: !1, access: { has: (r) => "required" in r, set: (r, u) => {
-      r.required = u;
-    } }, metadata: t }, null, l), t && Object.defineProperty(n, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
-  })(), n;
-})(), xe = (d) => (() => {
-  var u;
-  let c = [K({
-    tabindex: "0"
-  })], l, f = [], n, b = B(D(V(d))), t = [], r;
-  return u = class extends b {
-    /** Whether the checkbox is checked. */
-    set checked(s) {
-      const a = typeof s == "object" ? s.attribute : !1;
-      a && (s = s.value), this.hasUpdated && !a && (this._attributeMutationBlocked = !0), this._checked = !!s, this.updateFormValue();
-    }
-    get checked() {
-      return this._checked;
-    }
-    /**
-     * Form type of element.
-     * @default 'checkbox'
-     */
-    get type() {
-      return "checkbox";
-    }
-    constructor() {
-      var s, a, i;
-      super(), this._attributeMutationBlocked = (_(this, t), !1), this._languageController = new M(this), this._checked = !1, this._handleKeyboardInteraction = (o) => {
-        o.key === " " && this._handleUserInteraction();
-      }, this._handleUserInteraction = () => {
-        var o;
-        this.disabled || ((o = this.withUserInteraction) == null || o.call(this), this.checked = !this.checked, this._attributeMutationBlocked = !0, this.dispatchEvent(new InputEvent("input", { composed: !0, bubbles: !0 })), this.dispatchEvent(new Event("change", { bubbles: !0 })));
-      }, this.internals.role = "checkbox", (s = this.addEventListener) == null || s.call(this, "click", this._handleUserInteraction), (a = this.addEventListener) == null || a.call(this, "keydown", Y), (i = this.addEventListener) == null || i.call(this, "keyup", this._handleKeyboardInteraction);
-    }
-    attributeChangedCallback(s, a, i) {
-      (s !== "checked" || !this._attributeMutationBlocked) && super.attributeChangedCallback(s, a, i);
-    }
-    /**
-     * Is called whenever the form is being reset.
-     *
-     * @internal
-     */
-    formResetCallback() {
-      this.checked = this.hasAttribute("checked"), this._attributeMutationBlocked = !1;
-    }
-    /**
-     *  Called when the browser is trying to restore element’s state to state in which case
-     *  reason is "restore", or when the browser is trying to fulfill autofill on behalf of
-     *  user in which case reason is "autocomplete".
-     *  In the case of "restore", state is a string, File, or FormData object
-     *  previously set as the second argument to setFormValue.
-     *
-     * @internal
-     */
-    formStateRestoreCallback(s, a) {
-      s && (this.checked = s === "true");
-    }
-    updateFormValue() {
-      this.checked ? this.internals.setFormValue(this.value, `${this.checked}`) : this.internals.setFormValue(null);
-    }
-    shouldValidate(s) {
-      return super.shouldValidate(s) || s === "checked" || s === "required";
-    }
-    validate() {
-      super.validate(), this.required && !this.checked ? this.setValidityFlag("valueMissing", Q[this._languageController.current]) : this.removeValidityFlag("valueMissing");
-    }
-  }, n = u, (() => {
-    const s = typeof Symbol == "function" && Symbol.metadata ? Object.create(b[Symbol.metadata] ?? null) : void 0;
-    r = [k({
-      type: Boolean,
-      converter: {
-        ...T,
-        // We need to pass information to the setter so that we know it was called by attribute change.
-        fromAttribute: (a, i) => {
-          var p, x;
-          return { value: (x = (p = T).fromAttribute) == null ? void 0 : x.call(p, a, i), attribute: !0 };
-        }
-      }
-    })], y(u, null, r, { kind: "setter", name: "checked", static: !1, private: !1, access: { has: (a) => "checked" in a, set: (a, i) => {
-      a.checked = i;
-    } }, metadata: s }, null, t), y(null, l = { value: n }, c, { kind: "class", name: n.name, metadata: s }, null, f), n = l.value, s && Object.defineProperty(n, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: s }), _(n, f);
-  })(), n;
-})(), ne = () => {
-  if (A)
-    return !1;
-  const d = document.createElement("div");
-  return d.setAttribute("contenteditable", "PLAINTEXT-ONLY"), d.contentEditable === "plaintext-only";
-}, le = ne(), Ce = (d) => (() => {
-  var r;
-  let c = D(V(d)), l = [], f, n, b, t;
-  return r = class extends c {
-    /**
-     * Form type of element.
-     * @default 'text'
-     */
-    get type() {
-      return "text";
-    }
-    /**
-     * The text value of the input element.
-     */
-    set value(e) {
-      super.value = this._cleanText(e), this.hasUpdated && (this.innerHTML = super.value);
-    }
-    get value() {
-      return super.value ?? "";
-    }
-    /**
-     * Whether the component is readonly.
-     * @attr readonly
-     * @default false
-     */
-    set readOnly(e) {
-      this.toggleAttribute("readonly", !!e), this.internals.ariaReadOnly = e ? "true" : null, this._updateContenteditable();
-    }
-    get readOnly() {
-      return this.hasAttribute("readonly");
-    }
-    /**
-     * Whether the component is disabled.
-     * @attr disabled
-     * @default false
-     */
-    set disabled(e) {
-      this.toggleAttribute("disabled", !!e), this.internals.ariaDisabled = e ? "true" : null, this._updateContenteditable();
-    }
-    get disabled() {
-      return this.hasAttribute("disabled");
-    }
-    set placeholder(e) {
-      e ? this.setAttribute("placeholder", e) : this.removeAttribute("placeholder"), this.internals.ariaPlaceholder = e || null;
-    }
-    get placeholder() {
-      return this.getAttribute("placeholder") ?? "";
-    }
-    constructor() {
-      var e, s, a, i, o, p, x;
-      super(), this._interacted = (_(this, l), !1), this._shouldEmitChange = !1, this._shouldTriggerSubmit = !1, this.language = new M(this), this.internals.role = "textbox", (e = this.addEventListener) == null || e.call(this, "input", () => {
-        super.value = this._cleanText(this.textContent ?? ""), this._interacted = !0, this._shouldEmitChange = !0;
-      }, { capture: !0 }), (s = this.addEventListener) == null || s.call(this, "change", () => this._shouldEmitChange = !1, { capture: !0 }), (a = this.addEventListener) == null || a.call(this, "keydown", (m) => {
-        var g;
-        if ((m.key === "Enter" || m.key === `
-`) && m.isTrusted)
-          m.preventDefault(), m.stopImmediatePropagation(), this._shouldTriggerSubmit = this.dispatchEvent(new KeyboardEvent("keydown", m));
-        else if (j && this.value && (m.key === "Backspace" || m.key === "Delete") && m.isTrusted) {
-          if (m.preventDefault(), m.stopImmediatePropagation(), !this.dispatchEvent(new KeyboardEvent("keydown", m)))
-            return;
-          const h = (g = window.getSelection()) == null ? void 0 : g.getRangeAt(0);
-          if (!h)
-            return;
-          h.startOffset !== h.endOffset ? (h.deleteContents(), this._dispatchInputEvent()) : m.key === "Backspace" && h.startOffset > 0 ? (h.setStart(h.startContainer, h.startOffset - 1), h.deleteContents(), this._dispatchInputEvent()) : m.key === "Delete" && h.endOffset < this.value.length && (h.setEnd(h.endContainer, h.endOffset + 1), h.deleteContents(), this._dispatchInputEvent());
-        }
-      }, { capture: !0 }), (i = this.addEventListener) == null || i.call(this, "keyup", (m) => {
-        var g;
-        (m.key === "Enter" || m.key === `
-`) && (this._emitChangeIfNecessary(), this._shouldTriggerSubmit && (this._shouldTriggerSubmit = !1, (g = this.form) == null || g.requestSubmit()));
-      }, { capture: !0 }), (o = this.addEventListener) == null || o.call(this, "paste", (m) => {
-        var w, q;
-        m.preventDefault();
-        const g = this._cleanText(((w = m.clipboardData) == null ? void 0 : w.getData("text/plain")) ?? ""), h = (q = window.getSelection()) == null ? void 0 : q.getRangeAt(0);
-        !h || !g || (h.deleteContents(), h.insertNode(document.createTextNode(g)), h.setStart(h.endContainer, h.endOffset), this._dispatchInputEvent());
-      }), (p = this.addEventListener) == null || p.call(this, "focus", () => {
-        var m;
-        te.mostRecentModality === "keyboard" && ((m = window.getSelection()) == null || m.selectAllChildren(this));
-      }), (x = this.addEventListener) == null || x.call(this, "blur", () => {
-        var m;
-        (m = window.getSelection()) == null || m.removeAllRanges(), this._emitChangeIfNecessary(), this.scrollLeft = 0;
-      }, { capture: !0 });
-    }
-    connectedCallback() {
-      super.connectedCallback(), this.internals.ariaMultiLine = "false", this._updateContenteditable(), this.innerHTML = this.value;
-    }
-    focus(e) {
-      if (super.focus(e), !A && !this.disabled && !this.readOnly && this.value) {
-        const s = window.getSelection();
-        if (!s)
-          return;
-        let a = s.rangeCount > 0 ? s.getRangeAt(0) : null;
-        if (a && a.startOffset !== 0)
-          return;
-        a = document.createRange(), a.setStart(this.firstChild, this.textContent.length), a.collapse(!0), s.removeAllRanges(), s.addRange(a);
-      }
-    }
-    attributeChangedCallback(e, s, a) {
-      (e !== "value" || !this._interacted) && super.attributeChangedCallback(e, s, a);
-    }
-    /**
-     * Is called whenever the form is being reset.
-     *
-     * @internal
-     */
-    formResetCallback() {
-      this._interacted = !1, this.value = this.getAttribute("value") ?? "";
-    }
-    /**
-     *  Called when the browser is trying to restore element’s state to state in which case
-     *  reason is "restore", or when the browser is trying to fulfill autofill on behalf of
-     *  user in which case reason is "autocomplete".
-     *  In the case of "restore", state is a string, File, or FormData object
-     *  previously set as the second argument to setFormValue.
-     *
-     * @internal
-     */
-    formStateRestoreCallback(e, s) {
-      e && typeof e == "string" && (this.value = e);
-    }
-    async firstUpdated(e) {
-      super.firstUpdated(e), this.value && !this.innerHTML.length && (this.innerHTML = this.value);
-    }
-    updateFormValue() {
-      this.internals.setFormValue(this.value, this.value);
-    }
-    shouldValidate(e) {
-      return super.shouldValidate(e) || e === "value" || e === "required";
-    }
-    validate() {
-      super.validate(), this.required && !this.value ? this.setValidityFlag("valueMissing", Z[this.language.current]) : this.removeValidityFlag("valueMissing");
-    }
-    _cleanText(e) {
-      return `${e}`.replace(/[\n\r]+/g, "");
-    }
-    _dispatchInputEvent() {
-      this.dispatchEvent(new InputEvent("input", { bubbles: !0, composed: !0 }));
-    }
-    _cleanChildren() {
-      if (this.childElementCount)
-        for (const e of this.children)
-          e.remove();
-    }
-    _updateContenteditable() {
-      if (!A && this.isConnected) {
-        const e = this.disabled || this.readOnly ? "false" : le ? "plaintext-only" : "true";
-        this.setAttribute("contenteditable", e), this.readOnly ? this.setAttribute("tabindex", "0") : this.removeAttribute("tabindex");
-      }
-    }
-    _emitChangeIfNecessary() {
-      this._shouldEmitChange && (this._shouldEmitChange = !1, this.dispatchEvent(new Event("change", { bubbles: !0 })));
-    }
-    render() {
-      return R`<slot @slotchange=${this._cleanChildren}></slot>`;
-    }
-  }, (() => {
-    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(c[Symbol.metadata] ?? null) : void 0;
-    f = [k({ type: Boolean })], n = [k({ type: Boolean })], b = [k({ attribute: !1 })], t = [G({ passive: !0 })], y(r, null, f, { kind: "setter", name: "readOnly", static: !1, private: !1, access: { has: (s) => "readOnly" in s, set: (s, a) => {
-      s.readOnly = a;
-    } }, metadata: e }, null, l), y(r, null, n, { kind: "setter", name: "disabled", static: !1, private: !1, access: { has: (s) => "disabled" in s, set: (s, a) => {
-      s.disabled = a;
-    } }, metadata: e }, null, l), y(r, null, b, { kind: "setter", name: "placeholder", static: !1, private: !1, access: { has: (s) => "placeholder" in s, set: (s, a) => {
-      s.placeholder = a;
-    } }, metadata: e }, null, l), y(r, null, t, { kind: "method", name: "_cleanChildren", static: !1, private: !1, access: { has: (s) => "_cleanChildren" in s, get: (s) => s._cleanChildren }, metadata: e }, null, l), e && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
-  })(), r;
-})(), P = /* @__PURE__ */ new WeakMap(), Ee = (d) => (() => {
-  var n;
-  let c = B(D(V(d))), l = [], f;
-  return n = class extends c {
-    /**
-     * Whether the radio button is checked.
-     */
-    set checked(t) {
-      this._checked = !!t, this.toggleAttribute("data-checked", this.checked), this.internals.ariaChecked = this.checked.toString(), this.updateFormValue(), this._synchronizeGroupState();
-    }
-    get checked() {
-      return this._checked;
-    }
-    set name(t) {
-      super.name = t, this._disconnectFromRegistry(), this._connectToRegistry(), this._synchronizeGroupState();
-    }
-    get name() {
-      return super.name;
-    }
-    /**
-     * Form type of element.
-     * @default 'radio'
-     */
-    get type() {
-      return "radio";
-    }
-    constructor() {
-      var t;
-      super(), this._checked = (_(this, l), !1), this.abort = new X(this), this._languageController = new M(this), this.internals.role = "radio", (t = this.addEventListener) == null || t.call(this, "keydown", (r) => this._handleArrowKeyDown(r));
-    }
-    connectedCallback() {
-      super.connectedCallback(), this._connectToRegistry(), this._synchronizeGroupState();
-    }
-    disconnectedCallback() {
-      super.disconnectedCallback(), this._disconnectFromRegistry();
-    }
-    /**
-     * Is called whenever the form is being reset.
-     * @internal
-     */
-    formResetCallback() {
-      this.checked = this.hasAttribute("checked");
-    }
-    /**
-     *  Called when the browser is trying to restore element’s state to state in which case
-     *  reason is "restore", or when the browser is trying to fulfill autofill on behalf of
-     *  user in which case reason is "autocomplete".
-     * @internal
-     */
-    formStateRestoreCallback(t, r) {
-      t && (this.checked = t === this.value);
-    }
-    willUpdate(t) {
-      super.willUpdate(t), t.has("disabled") && this.updateFocusableRadios();
-    }
-    firstUpdated(t) {
-      super.firstUpdated(t), this.updateFocusableRadios();
-    }
-    /**
-     * Called on `value` change
-     * If 'checked', update the value. Otherwise, do nothing.
-     */
-    updateFormValue() {
-      this.checked ? this.internals.setFormValue(this.value, this.value) : this.internals.setFormValue(null);
-    }
-    shouldValidate(t) {
-      return super.shouldValidate(t) || t === "checked" || t === "required";
-    }
-    /**
-     * Sets the validity of all associated radio buttons.
-     * If any radio button is required, all associated are required as well.
-     */
-    validate() {
-      if (super.validate(), !this.associatedRadioButtons)
-        return;
-      let t = !1, r = !1;
-      for (const u of this.associatedRadioButtons)
-        t || (t = u.required), r || (r = u.checked);
-      t && !r ? this.associatedRadioButtons.forEach((u) => u.setValidityFlag("valueMissing", ee[this._languageController.current])) : this.associatedRadioButtons.forEach((u) => u.removeValidityFlag("valueMissing"));
-    }
-    /**
-     * Only a single radio should be focusable in the group. Defined as:
-     * - the checked radio;
-     * - the first non-disabled radio in DOM order;
-     */
-    updateFocusableRadios() {
-      if (!this.hasUpdated)
-        return;
-      const t = this._interactableGroupedRadios(), r = t.findIndex((e) => e.checked && !e.disabled && !e.formDisabled), u = r !== -1 ? r : t.findIndex((e) => !e.disabled && !e.formDisabled);
-      u !== -1 && (t[u].tabIndex = 0, t.splice(u, 1)), t.forEach((e) => e.removeAttribute("tabindex"));
-    }
-    async navigateByKeyboard(t) {
-      t.checked = !0, this.emitChangeEvents(), await t.updateComplete, t.focus();
-    }
-    emitChangeEvents() {
-      this.dispatchEvent(new InputEvent("input", { bubbles: !0, cancelable: !0, composed: !0 })), this.dispatchEvent(new Event("change", { bubbles: !0 }));
-    }
-    _synchronizeGroupState() {
-      this.checked && this._deselectGroupedRadios(), this.updateFocusableRadios();
-    }
-    /**
-     * Add `this` to the radioButton registry
-     */
-    _connectToRegistry() {
-      if (!this.name || A)
-        return;
-      const t = this.form ?? this.getRootNode();
-      this._radioButtonGroupsMap = P.get(t), this._radioButtonGroupsMap || (this._radioButtonGroupsMap = /* @__PURE__ */ new Map(), P.set(t, this._radioButtonGroupsMap)), this.associatedRadioButtons = this._radioButtonGroupsMap.get(this.name), this.associatedRadioButtons || (this.associatedRadioButtons = /* @__PURE__ */ new Set(), this._radioButtonGroupsMap.set(this.name, this.associatedRadioButtons));
-      const r = Array.from(this.associatedRadioButtons);
-      this.associatedRadioButtons.clear();
-      const u = r.findIndex((e) => this.compareDocumentPosition(e) & Node.DOCUMENT_POSITION_FOLLOWING);
-      u !== -1 ? r.splice(u, 0, this) : r.push(this), r.forEach((e) => this.associatedRadioButtons.add(e)), this.validate();
-    }
-    /**
-     * Remove `this` from the radioButton registry and, if the group is empty, delete the entry from the groups Map
-     */
-    _disconnectFromRegistry() {
-      var t, r, u;
-      (t = this.associatedRadioButtons) == null || t.delete(this), ((r = this.associatedRadioButtons) == null ? void 0 : r.size) === 0 ? (u = this._radioButtonGroupsMap) == null || u.delete(this.name) : this.validate(), this.associatedRadioButtons = void 0, this._radioButtonGroupsMap = void 0;
-    }
-    /**
-     * Return a list of 'interactable' grouped radios, ordered in DOM order
-     */
-    _interactableGroupedRadios() {
-      return Array.from(this.associatedRadioButtons ?? []).filter((t) => se.isVisible(t));
-    }
-    /**
-     * Deselect other radio of the same group
-     */
-    _deselectGroupedRadios() {
-      Array.from(this.associatedRadioButtons ?? []).filter((t) => t !== this).forEach((t) => t.checked = !1);
-    }
-    async _handleArrowKeyDown(t) {
-      if (!ae(t))
-        return;
-      t.preventDefault();
-      const r = this._interactableGroupedRadios().filter((s) => !s.disabled && !s.formDisabled), u = r.indexOf(this), e = ie(t, u, r.length);
-      await this.navigateByKeyboard(r[e]);
-    }
-  }, (() => {
-    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(c[Symbol.metadata] ?? null) : void 0;
-    f = [k({ type: Boolean })], y(n, null, f, { kind: "setter", name: "checked", static: !1, private: !1, access: { has: (r) => "checked" in r, set: (r, u) => {
-      r.checked = u;
-    } }, metadata: t }, null, l), t && Object.defineProperty(n, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
-  })(), n;
-})(), oe = (d) => {
-  class v extends d {
-    /**
-     * Returns a Promise that resolves when the element has completed hydration.
-     * The Promise value is a boolean that is `true` if the element required hydration
-     * and `false` if not.
-     *
-     * @return A promise of a boolean that resolves to true once the hydration completed.
-     * @internal
-     */
-    get hydrationComplete() {
-      return this._hydrationComplete;
-    }
-    /** Returns whether hydration is required and not completed. */
-    get hydrationRequired() {
-      return this._hydrationRequired;
-    }
-    constructor(...l) {
-      var f;
-      if (super(...l), this._hydrationComplete = new Promise((n) => this._resolveHydration = n), this._hydrationRequired = !!this.shadowRoot, !this._hydrationRequired)
-        this._resolveHydration(!1);
-      else {
-        const n = (r) => {
-          this._hydrationRequired && r.stopImmediatePropagation();
-        }, b = { capture: !0 }, t = (f = this.shadowRoot) == null ? void 0 : f.querySelectorAll("slot");
-        t != null && t.length && (t.forEach((r) => r.addEventListener("slotchange", n, b)), this.hydrationComplete.then(() => t.forEach((r) => {
-          r.removeEventListener("slotchange", n, b), r.assignedNodes().length && r.dispatchEvent(new Event("slotchange", { bubbles: !0 }));
-        })));
-      }
-    }
-    update(l) {
-      super.update(l), this._hydrationRequired && (this._hydrationRequired = !1, this._resolveHydration(!0));
-    }
-  }
-  return v;
-}, U = "data-ssr-child-count", z = "li", we = (d) => (() => {
-  var b, t;
-  let c = oe(d), l, f = [], n = [];
-  return t = class extends c {
-    constructor() {
-      super(...arguments);
-      E(this, b);
-      S(this, b, _(this, f, [])), this._handleSlotchange = (_(this, n), () => {
-        const e = Array.from(this.children ?? []).filter((s) => this.listChildLocalNames.includes(s.localName));
-        e.length === this.listChildren.length && this.listChildren.every((s, a) => e[a] === s) || (this.listChildren.filter((s) => !e.includes(s)).forEach((s) => s.removeAttribute("slot")), this.listChildren = e, this.listChildren.forEach((s, a) => s.setAttribute("slot", `${z}-${a}`)), this.removeAttribute(U));
-      });
-    }
-    /**
-     * A list of children with the defined tag names.
-     * This array is only updated if there is an actual change
-     * to the child elements.
-     */
-    get listChildren() {
-      return C(this, b);
-    }
-    set listChildren(e) {
-      S(this, b, e);
-    }
-    connectedCallback() {
-      var e;
-      super.connectedCallback(), (e = this.shadowRoot) == null || e.addEventListener("slotchange", this._handleSlotchange, { passive: !0 });
-    }
-    disconnectedCallback() {
-      var e;
-      super.disconnectedCallback(), (e = this.shadowRoot) == null || e.removeEventListener("slotchange", this._handleSlotchange);
-    }
-    /**
-     * Renders list and list slots for slotted children or a number of list slots
-     * corresponding to the `data-ssr-child-count` attribute value.
-     *
-     * This is a possible optimization for SSR, as in an SSR Lit environment
-     * other elements are not available, but might be available in the meta
-     * framework wrapper (like e.g. React). This allows to provide the number of
-     * children to be passed via the `data-ssr-child-count` attribute value.
-     */
-    renderList(e = {}, s = {}) {
-      const a = this.listSlotEntries(s);
-      return a.length >= 2 ? R`
-          <ul
-            class=${e.class || this.localName}
-            aria-label=${e.ariaLabel || O}
-            aria-labelledby=${e.ariaLabelledby || O}
-          >
-            ${a.map((i) => R`
-                <li aria-hidden=${i.ariaHidden || O}>
-                  <slot name=${i.name}></slot>
-                </li>
-              `)}
-          </ul>
-          ${this.renderHiddenSlot()}
-        ` : a.length === 1 ? R`<sbb-screen-reader-only>${e.ariaLabel}</sbb-screen-reader-only>
-          <span class=${e.class || this.localName}>
-            <span><slot name=${a[0].name}></slot></span>
-          </span>
-          ${this.renderHiddenSlot()} ` : this.renderHiddenSlot();
-    }
-    /**
-     * Returns an array of SbbNamedSlotProperties, which holds the list slot names and the hidden property;
-     * its length corresponds to the number of matched children or the `data-ssr-child-count` attribute value.
-     *
-     * This is a possible optimization for SSR, as in an SSR Lit environment
-     * other elements are not available, but might be available in the meta
-     * framework wrapper (like e.g. React). This allows to provide the number of
-     * children to be passed via the `data-ssr-child-count` attribute value.
-     */
-    listSlotEntries(e) {
-      return (this.listChildren.length ? this.listChildren : Array.from({ length: +(this.getAttribute(U) ?? 0) })).map((a, i) => {
-        var o;
-        return {
-          name: `${z}-${i}`,
-          ariaHidden: ((o = e == null ? void 0 : e.localNameVisualOnly) == null ? void 0 : o.includes(a.localName)) ?? !1
-        };
-      });
-    }
-    /**
-     * Returns a hidden slot, which is intended as the children change detection.
-     * When an element without a slot attribute is slotted to the element, it triggers
-     * the slotchange event, which can be used to assign it to the appropriate named slot.
-     */
-    renderHiddenSlot() {
-      return R`<span hidden><slot></slot></span>`;
-    }
-  }, b = new WeakMap(), (() => {
-    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(c[Symbol.metadata] ?? null) : void 0;
-    l = [N()], y(t, null, l, { kind: "accessor", name: "listChildren", static: !1, private: !1, access: { has: (s) => "listChildren" in s, get: (s) => s.listChildren, set: (s, a) => {
-      s.listChildren = a;
-    } }, metadata: e }, f, n), e && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
-  })(), t;
-})(), Re = (d) => (() => {
-  var b, t;
-  let c = d, l, f = [], n = [];
-  return t = class extends c {
-    constructor() {
-      super(...arguments);
-      E(this, b, _(this, f, !1));
-      _(this, n);
-    }
-    /** Negative coloring variant flag. */
-    get negative() {
-      return C(this, b);
-    }
-    set negative(e) {
-      S(this, b, e);
-    }
-  }, b = new WeakMap(), (() => {
-    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(c[Symbol.metadata] ?? null) : void 0;
-    l = [I(), k({ reflect: !0, type: Boolean })], y(t, null, l, { kind: "accessor", name: "negative", static: !1, private: !1, access: { has: (s) => "negative" in s, get: (s) => s.negative, set: (s, a) => {
-      s.negative = a;
-    } }, metadata: e }, f, n), e && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
-  })(), t;
-})(), Ie = (d) => (() => {
-  var a, i, o, p;
-  let c = d, l, f = [], n = [], b, t = [], r = [], u, e = [], s = [];
-  return p = class extends c {
-    constructor() {
-      super(...arguments);
-      E(this, a);
-      E(this, i);
-      E(this, o);
-      S(this, a, _(this, f, "white")), S(this, i, (_(this, n), _(this, t, !1))), S(this, o, (_(this, r), _(this, e, ""))), this._panelConnected = (_(this, s), new J(this, p.events.panelConnected, { bubbles: !0 }));
-    }
-    /** The background color of the panel. */
-    get color() {
-      return C(this, a);
-    }
-    set color(g) {
-      S(this, a, g);
-    }
-    /** Whether the unselected panel has a border. */
-    get borderless() {
-      return C(this, i);
-    }
-    set borderless(g) {
-      S(this, i, g);
-    }
-    /** @internal used for accessibility label when in expansion panel */
-    get expansionState() {
-      return C(this, o);
-    }
-    set expansionState(g) {
-      S(this, o, g);
-    }
-    connectedCallback() {
-      var g, h;
-      super.connectedCallback(), this._panelConnected.emit(), (h = (g = this.closest) == null ? void 0 : g.call(this, "sbb-radio-button-group, sbb-checkbox-group")) == null || h.toggleAttribute("data-has-panel", !0);
-    }
-  }, a = new WeakMap(), i = new WeakMap(), o = new WeakMap(), (() => {
-    const g = typeof Symbol == "function" && Symbol.metadata ? Object.create(c[Symbol.metadata] ?? null) : void 0;
-    l = [k({ reflect: !0 })], b = [I(), k({ reflect: !0, type: Boolean })], u = [I(), k()], y(p, null, l, { kind: "accessor", name: "color", static: !1, private: !1, access: { has: (h) => "color" in h, get: (h) => h.color, set: (h, w) => {
-      h.color = w;
-    } }, metadata: g }, f, n), y(p, null, b, { kind: "accessor", name: "borderless", static: !1, private: !1, access: { has: (h) => "borderless" in h, get: (h) => h.borderless, set: (h, w) => {
-      h.borderless = w;
-    } }, metadata: g }, t, r), y(p, null, u, { kind: "accessor", name: "expansionState", static: !1, private: !1, access: { has: (h) => "expansionState" in h, get: (h) => h.expansionState, set: (h, w) => {
-      h.expansionState = w;
-    } }, metadata: g }, e, s), g && Object.defineProperty(p, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: g });
-  })(), p.events = {
-    panelConnected: "panelConnected"
-  }, p;
-})(), Ae = (d) => {
-  class v extends d {
-    constructor() {
-      super(...arguments), this._updatePromise = Promise.resolve(), this._updateResolve = () => {
-      };
-    }
-    startUpdate() {
-      this._updatePromise = new Promise((l) => this._updateResolve = l);
-    }
-    completeUpdate() {
-      this._updateResolve();
-    }
-    async getUpdateComplete() {
-      const l = await super.getUpdateComplete();
-      return await this._updatePromise, l;
-    }
-  }
-  return v;
-}, Oe = W`:host{--sbb-selection-panel-background: var( --sbb-selection-expansion-panel-inner-background, var(--sbb-color-white) );--sbb-selection-panel-border-color: var(--sbb-color-cloud);--sbb-selection-panel-border-radius: var( --sbb-selection-expansion-panel-border-radius, var(--sbb-border-radius-4x) );--sbb-selection-panel-border-width: var( --sbb-selection-expansion-panel-inner-border-width, var(--sbb-border-width-1x) );--sbb-selection-panel-input-padding: var(--sbb-spacing-responsive-xs) var(--sbb-spacing-responsive-xxs);--sbb-selection-panel-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-selection-panel-cursor: pointer;--sbb-selection-panel-suffix-color: var(--sbb-color-charcoal);--sbb-selection-panel-subtext-color: var(--sbb-color-granite);display:block;outline:none!important}:host([size=s]){--sbb-selection-panel-input-padding: var(--sbb-spacing-responsive-xxs) var(--sbb-spacing-responsive-xxxs)}:host([color=milk]){--sbb-selection-panel-background: var( --sbb-selection-expansion-panel-inner-background, var(--sbb-color-milk) )}:host([borderless]:not([data-checked])){--sbb-selection-panel-border-color: transparent}:host(:is([data-checked]):not(:disabled,[disabled])){--sbb-selection-panel-border-color: var(--sbb-color-charcoal);--sbb-selection-panel-border-width: var( --sbb-selection-expansion-panel-inner-border-width, var(--sbb-border-width-2x) )}:host(:is(:disabled,[disabled])){--sbb-selection-panel-cursor: default}.sbb-selection-panel{display:block;cursor:var(--sbb-selection-panel-cursor);position:relative;border-radius:var(--sbb-selection-panel-border-radius);box-shadow:inset 0 0 0 var(--sbb-selection-panel-border-width) var(--sbb-selection-panel-border-color);padding:var(--sbb-selection-panel-input-padding);background-color:var(--sbb-selection-panel-background);transition-duration:var(--sbb-selection-panel-animation-duration);transition-timing-function:var(--sbb-animation-easing);transition-property:box-shadow}@media (forced-colors: active){.sbb-selection-panel:after{content:"";display:block;position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;border:var(--sbb-selection-panel-border-width) solid var(--sbb-selection-panel-border-color);border-radius:var(--sbb-selection-panel-border-radius)}}:host(:focus-visible) .sbb-selection-panel{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}.sbb-selection-panel__badge{-webkit-user-select:none;user-select:none;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--sbb-selection-panel-border-radius);overflow:hidden}slot[name=suffix]{color:var(--sbb-selection-panel-suffix-color)}slot[name=subtext]{display:block;color:var(--sbb-selection-panel-subtext-color);padding-inline-start:var(--sbb-spacing-fixed-8x)}:host(:not([data-slot-names~=subtext])) slot[name=subtext]{display:none}`;
+import { SbbAnimationCompleteMixin as r } from "./mixins/animation-complete-mixin.js";
+import { SbbDisabledInteractiveMixin as a, SbbDisabledMixin as t, SbbDisabledTabIndexActionMixin as l } from "./mixins/disabled-mixin.js";
+import { SbbFormAssociatedCheckboxMixin as c } from "./mixins/form-associated-checkbox-mixin.js";
+import { SbbFormAssociatedInputMixin as u } from "./mixins/form-associated-input-mixin.js";
+import { SbbFormAssociatedMixin as v } from "./mixins/form-associated-mixin.js";
+import { SbbFormAssociatedRadioButtonMixin as f, radioButtonRegistry as h } from "./mixins/form-associated-radio-button-mixin.js";
+import { SbbHydrationMixin as S } from "./mixins/hydration-mixin.js";
+import { SbbNamedSlotListMixin as w } from "./mixins/named-slot-list-mixin.js";
+import { SbbNegativeMixin as y } from "./mixins/negative-mixin.js";
+import { SbbPanelMixin as C } from "./mixins/panel-mixin.js";
+import { SbbRequiredMixin as D } from "./mixins/required-mixin.js";
+import { SbbUpdateSchedulerMixin as R } from "./mixins/update-scheduler-mixin.js";
+import { css as e } from "lit";
+const s = e`:host{--sbb-selection-panel-background: var( --sbb-selection-expansion-panel-inner-background, var(--sbb-color-white) );--sbb-selection-panel-border-color: var(--sbb-color-cloud);--sbb-selection-panel-border-radius: var( --sbb-selection-expansion-panel-border-radius, var(--sbb-border-radius-4x) );--sbb-selection-panel-border-width: var( --sbb-selection-expansion-panel-inner-border-width, var(--sbb-border-width-1x) );--sbb-selection-panel-input-padding: var(--sbb-spacing-responsive-xs) var(--sbb-spacing-responsive-xxs);--sbb-selection-panel-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-selection-panel-cursor: pointer;--sbb-selection-panel-suffix-color: var(--sbb-color-charcoal);--sbb-selection-panel-subtext-color: var(--sbb-color-granite);display:block;outline:none!important}:host([size=s]){--sbb-selection-panel-input-padding: var(--sbb-spacing-responsive-xxs) var(--sbb-spacing-responsive-xxxs)}:host([color=milk]){--sbb-selection-panel-background: var( --sbb-selection-expansion-panel-inner-background, var(--sbb-color-milk) )}:host([borderless]:not([data-checked])){--sbb-selection-panel-border-color: transparent}:host(:is([data-checked]):not(:disabled,[disabled])){--sbb-selection-panel-border-color: var(--sbb-color-charcoal);--sbb-selection-panel-border-width: var( --sbb-selection-expansion-panel-inner-border-width, var(--sbb-border-width-2x) )}:host(:is(:disabled,[disabled])){--sbb-selection-panel-cursor: default}.sbb-selection-panel{display:block;cursor:var(--sbb-selection-panel-cursor);position:relative;border-radius:var(--sbb-selection-panel-border-radius);box-shadow:inset 0 0 0 var(--sbb-selection-panel-border-width) var(--sbb-selection-panel-border-color);padding:var(--sbb-selection-panel-input-padding);background-color:var(--sbb-selection-panel-background);transition-duration:var(--sbb-selection-panel-animation-duration);transition-timing-function:var(--sbb-animation-easing);transition-property:box-shadow}@media (forced-colors: active){.sbb-selection-panel:after{content:"";display:block;position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;border:var(--sbb-selection-panel-border-width) solid var(--sbb-selection-panel-border-color);border-radius:var(--sbb-selection-panel-border-radius)}}:host(:focus-visible) .sbb-selection-panel{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width)}.sbb-selection-panel__badge{-webkit-user-select:none;user-select:none;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--sbb-selection-panel-border-radius);overflow:hidden}slot[name=suffix]{color:var(--sbb-selection-panel-suffix-color)}slot[name=subtext]{display:block;color:var(--sbb-selection-panel-subtext-color);padding-inline-start:var(--sbb-spacing-fixed-8x)}:host(:not([data-slot-names~=subtext])) slot[name=subtext]{display:none}`;
 export {
-  ye as SbbAnimationCompleteMixin,
-  re as SbbDisabledInteractiveMixin,
-  B as SbbDisabledMixin,
-  Se as SbbDisabledTabIndexActionMixin,
-  xe as SbbFormAssociatedCheckboxMixin,
-  Ce as SbbFormAssociatedInputMixin,
-  V as SbbFormAssociatedMixin,
-  Ee as SbbFormAssociatedRadioButtonMixin,
-  oe as SbbHydrationMixin,
-  we as SbbNamedSlotListMixin,
-  Re as SbbNegativeMixin,
-  Ie as SbbPanelMixin,
+  r as SbbAnimationCompleteMixin,
+  a as SbbDisabledInteractiveMixin,
+  t as SbbDisabledMixin,
+  l as SbbDisabledTabIndexActionMixin,
+  c as SbbFormAssociatedCheckboxMixin,
+  u as SbbFormAssociatedInputMixin,
+  v as SbbFormAssociatedMixin,
+  f as SbbFormAssociatedRadioButtonMixin,
+  S as SbbHydrationMixin,
+  w as SbbNamedSlotListMixin,
+  y as SbbNegativeMixin,
+  C as SbbPanelMixin,
   D as SbbRequiredMixin,
-  Ae as SbbUpdateSchedulerMixin,
-  Oe as panelCommonStyle,
-  P as radioButtonRegistry
+  R as SbbUpdateSchedulerMixin,
+  s as panelCommonStyle,
+  h as radioButtonRegistry
 };