@sbb-esta/lyne-elements 3.0.1 → 3.2.0

package/popover/popover/popover.component.js

@@ -1,36 +1,37 @@
-var $ = (i) => {
+var B = (i) => {
   throw TypeError(i);
 };
-var R = (i, r, a) => r.has(i) || $("Cannot " + a);
-var v = (i, r, a) => (R(i, r, "read from private field"), a ? a.call(i) : r.get(i)), u = (i, r, a) => r.has(i) ? $("Cannot add the same private member more than once") : r instanceof WeakSet ? r.add(i) : r.set(i, a), l = (i, r, a, n) => (R(i, r, "write to private field"), n ? n.call(i, a) : r.set(i, a), a);
-import { __runInitializers as b, __esDecorate as g } from "tslib";
-import { css as H, isServer as L, html as O, nothing as Y } from "lit";
-import { property as T, customElement as Z } from "lit/decorators.js";
-import { ref as j } from "lit/directives/ref.js";
-import { SbbFocusTrapController as q, IS_FOCUSABLE_QUERY as W, sbbInputModalityDetector as Q, isFakeMousedownFromScreenReader as V } from "../../core/a11y.js";
-import { SbbOpenCloseBaseElement as X } from "../../core/base-elements.js";
-import { SbbMediaQueryPointerCoarse as G, SbbEscapableOverlayController as J, SbbLanguageController as K } from "../../core/controllers.js";
-import { idReference as ee, forceType as x } from "../../core/decorators.js";
-import { isZeroAnimationDuration as te } from "../../core/dom.js";
-import { composedPathHasAttribute as oe } from "../../core/eventing.js";
-import { i18nClosePopover as se } from "../../core/i18n.js";
-import { SbbHydrationMixin as ie } from "../../core/mixins.js";
-import { isEventOnElement as N, removeAriaOverlayTriggerAttributes as re, setAriaOverlayTriggerAttributes as ae, getElementPosition as ne } from "../../core/overlay.js";
+var F = (i, r, a) => r.has(i) || B("Cannot " + a);
+var y = (i, r, a) => (F(i, r, "read from private field"), a ? a.call(i) : r.get(i)), w = (i, r, a) => r.has(i) ? B("Cannot add the same private member more than once") : r instanceof WeakSet ? r.add(i) : r.set(i, a), d = (i, r, a, n) => (F(i, r, "write to private field"), n ? n.call(i, a) : r.set(i, a), a);
+import { __runInitializers as p, __esDecorate as v } from "tslib";
+import { css as U, isServer as E, html as k, nothing as $ } from "lit";
+import { property as _, customElement as R } from "lit/decorators.js";
+import { ref as N } from "lit/directives/ref.js";
+import { SbbFocusTrapController as H, IS_FOCUSABLE_QUERY as Y, sbbInputModalityDetector as Z, isFakeMousedownFromScreenReader as j } from "../../core/a11y.js";
+import { SbbOpenCloseBaseElement as q } from "../../core/base-elements.js";
+import { readConfig as M } from "../../core/config.js";
+import { SbbMediaQueryPointerCoarse as W, SbbEscapableOverlayController as Q, SbbLanguageController as V } from "../../core/controllers.js";
+import { idReference as X, forceType as T } from "../../core/decorators.js";
+import { isZeroAnimationDuration as G } from "../../core/dom.js";
+import { composedPathHasAttribute as J } from "../../core/eventing.js";
+import { i18nClosePopover as K } from "../../core/i18n.js";
+import { SbbHydrationMixin as ee } from "../../core/mixins.js";
+import { isEventOnElement as I, removeAriaOverlayTriggerAttributes as te, setAriaOverlayTriggerAttributes as oe, getElementPosition as se } from "../../core/overlay.js";
 import "../../button/secondary-button.js";
-const le = H`*,:before,:after{box-sizing:border-box}:host{--sbb-popover-position: absolute;--sbb-popover-position-x: 0;--sbb-popover-position-y: 0;--sbb-popover-arrow-size: var(--sbb-spacing-fixed-4x);--sbb-popover-arrow-position-x: 0;--sbb-popover-max-width: calc(100% - var(--sbb-spacing-fixed-2x));--sbb-popover-inset: 0 auto auto 0;--sbb-popover-border-radius: var(--sbb-border-radius-8x);--sbb-popover-padding: var(--sbb-spacing-fixed-4x);--sbb-popover-background: var(--sbb-color-white);--sbb-popover-color: var(--sbb-color-charcoal);--sbb-popover-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-popover-animation-easing: ease-out;--sbb-popover-transform: translateY(var(--sbb-spacing-fixed-2x));--sbb-focus-outline-color: var(--sbb-focus-outline-color-default);outline:none!important;display:none}:host([data-state]:not([data-state=closed])){display:block;--sbb-popover-inset: 0}:host([data-position=above]){--sbb-popover-transform: translateY(calc(var(--sbb-spacing-fixed-2x) * -1))}.sbb-popover:after,.sbb-popover__content:before{content:"";position:absolute;display:block;width:var(--sbb-popover-arrow-size);height:var(--sbb-popover-arrow-size);left:var(--sbb-popover-arrow-position-x);bottom:calc(100% - var(--sbb-popover-arrow-size) / 2);background-color:var(--sbb-popover-background);border-radius:var(--sbb-border-radius-2x) 0;transform:rotate(45deg)}.sbb-popover__container{position:fixed;inset:var(--sbb-popover-inset);pointer-events:none;z-index:var(--sbb-popover-z-index, var(--sbb-overlay-default-z-index));color:var(--sbb-popover-color)}.sbb-popover{box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-elevation-level-5-hard-2-color),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-elevation-level-5-hard-1-color);display:none;position:var(--sbb-popover-position);pointer-events:all;top:var(--sbb-popover-position-y);bottom:unset;left:var(--sbb-popover-position-x);right:unset;border:none;border-radius:var(--sbb-popover-border-radius);padding:0;max-width:var(--sbb-popover-max-width);width:max-content;background-color:var(--sbb-popover-background);outline:none}:host(:focus-visible) .sbb-popover{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width)}:host([data-state]:not([data-state=closed])) .sbb-popover{display:block;animation-name:open;animation-duration:var(--sbb-popover-animation-duration);animation-timing-function:var(--sbb-popover-animation-easing)}:host([data-state][data-state=closing]) .sbb-popover{pointer-events:none;animation-name:close;animation-duration:var(--sbb-popover-animation-duration);animation-timing-function:var(--sbb-popover-animation-easing)}.sbb-popover:after{z-index:-1;box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-elevation-level-5-hard-2-color),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-elevation-level-5-hard-1-color)}@media (forced-colors: active){.sbb-popover:after{outline:var(--sbb-border-width-1x) solid CanvasText}}:host([data-position=above]) .sbb-popover:after{top:calc(100% - var(--sbb-popover-arrow-size) / 2)}@media (forced-colors: active){.sbb-popover{outline:var(--sbb-border-width-1x) solid CanvasText}}.sbb-popover:before{content:"";display:block;position:absolute;inset:0;z-index:-1;background-color:transparent}:host([data-position=below]) .sbb-popover:before{inset-block-start:calc(-1 * var(--sbb-spacing-fixed-6x))}:host([data-position=above]) .sbb-popover:before{inset-block-end:calc(-1 * var(--sbb-spacing-fixed-6x))}.sbb-popover__content{display:flex;gap:var(--sbb-spacing-fixed-4x);border-radius:var(--sbb-popover-border-radius);padding:var(--sbb-popover-padding);outline:none;background-color:var(--sbb-popover-background);overflow:hidden;flex-direction:row-reverse}:host([data-position=above]) .sbb-popover__content:before{top:calc(100% - var(--sbb-popover-arrow-size) / 2)}@keyframes open{0%{opacity:0;transform:var(--sbb-popover-transform)}to{opacity:1;transform:translateY(0)}}@keyframes close{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:var(--sbb-popover-transform)}}`, be = 16, pe = 32;
-let he = 0;
-const k = /* @__PURE__ */ new Set(), ce = L ? !1 : matchMedia(G).matches;
-let de = (() => {
-  var c, p;
-  let i = ie(X), r, a = [], n = [];
-  return p = class extends i {
+const ie = U`*,:before,:after{box-sizing:border-box}:host{--sbb-popover-position: absolute;--sbb-popover-position-x: 0;--sbb-popover-position-y: 0;--sbb-popover-arrow-size: var(--sbb-spacing-fixed-4x);--sbb-popover-arrow-position-x: 0;--sbb-popover-max-width: calc(100% - var(--sbb-spacing-fixed-2x));--sbb-popover-inset: 0 auto auto 0;--sbb-popover-border-radius: var(--sbb-border-radius-8x);--sbb-popover-padding: var(--sbb-spacing-fixed-4x);--sbb-popover-background: var(--sbb-color-white);--sbb-popover-color: var(--sbb-color-charcoal);--sbb-popover-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-popover-animation-easing: ease-out;--sbb-popover-transform: translateY(var(--sbb-spacing-fixed-2x));--sbb-focus-outline-color: var(--sbb-focus-outline-color-default);outline:none!important;display:none}:host([data-state]:not([data-state=closed])){display:block;--sbb-popover-inset: 0}:host([data-position=above]){--sbb-popover-transform: translateY(calc(var(--sbb-spacing-fixed-2x) * -1))}.sbb-popover:after,.sbb-popover__content:before{content:"";position:absolute;display:block;width:var(--sbb-popover-arrow-size);height:var(--sbb-popover-arrow-size);left:var(--sbb-popover-arrow-position-x);bottom:calc(100% - var(--sbb-popover-arrow-size) / 2);background-color:var(--sbb-popover-background);border-radius:var(--sbb-border-radius-2x) 0;transform:rotate(45deg)}.sbb-popover__container{position:fixed;inset:var(--sbb-popover-inset);pointer-events:none;z-index:var(--sbb-popover-z-index, var(--sbb-overlay-default-z-index));color:var(--sbb-popover-color)}.sbb-popover{box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-elevation-level-5-hard-2-color),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-elevation-level-5-hard-1-color);display:none;position:var(--sbb-popover-position);pointer-events:all;top:var(--sbb-popover-position-y);bottom:unset;left:var(--sbb-popover-position-x);right:unset;border:none;border-radius:var(--sbb-popover-border-radius);padding:0;max-width:var(--sbb-popover-max-width);width:max-content;background-color:var(--sbb-popover-background);outline:none}:host(:focus-visible) .sbb-popover{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width)}:host([data-state]:not([data-state=closed])) .sbb-popover{display:block;animation-name:open;animation-duration:var(--sbb-popover-animation-duration);animation-timing-function:var(--sbb-popover-animation-easing)}:host([data-state][data-state=closing]) .sbb-popover{pointer-events:none;animation-name:close;animation-duration:var(--sbb-popover-animation-duration);animation-timing-function:var(--sbb-popover-animation-easing)}.sbb-popover:after{z-index:-1;box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-elevation-level-5-hard-2-color),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-elevation-level-5-hard-1-color)}@media (forced-colors: active){.sbb-popover:after{outline:var(--sbb-border-width-1x) solid CanvasText}}:host([data-position=above]) .sbb-popover:after{top:calc(100% - var(--sbb-popover-arrow-size) / 2)}@media (forced-colors: active){.sbb-popover{outline:var(--sbb-border-width-1x) solid CanvasText}}.sbb-popover:before{content:"";display:block;position:absolute;inset:0;z-index:-1;background-color:transparent}:host([data-position=below]) .sbb-popover:before{inset-block-start:calc(-1 * var(--sbb-spacing-fixed-6x))}:host([data-position=above]) .sbb-popover:before{inset-block-end:calc(-1 * var(--sbb-spacing-fixed-6x))}.sbb-popover__content{display:flex;gap:var(--sbb-spacing-fixed-4x);border-radius:var(--sbb-popover-border-radius);padding:var(--sbb-popover-padding);outline:none;background-color:var(--sbb-popover-background);overflow:hidden;flex-direction:row-reverse}:host([data-position=above]) .sbb-popover__content:before{top:calc(100% - var(--sbb-popover-arrow-size) / 2)}@keyframes open{0%{opacity:0;transform:var(--sbb-popover-transform)}to{opacity:1;transform:translateY(0)}}@keyframes close{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:var(--sbb-popover-transform)}}`, re = 16, ae = 32;
+let ne = 0;
+const x = /* @__PURE__ */ new Set(), le = E ? !1 : matchMedia(W).matches;
+let be = (() => {
+  var h, l;
+  let i = ee(q), r, a = [], n = [];
+  return l = class extends i {
     constructor() {
       super(...arguments);
-      u(this, c);
-      l(this, c, b(this, a, null)), this._nextFocusedElement = b(this, n), this._skipCloseFocus = !1, this._escapableOverlayController = new J(this), this._focusTrapController = new q(this), this._blurTimeout = null, this._pointerDownListener = (e) => {
-        this._isPointerDownEventOnPopover = N(this.overlay, e);
+      w(this, h);
+      d(this, h, p(this, a, null)), this._nextFocusedElement = p(this, n), this._skipCloseFocus = !1, this._escapableOverlayController = new Q(this), this._focusTrapController = new H(this), this._blurTimeout = null, this._pointerDownListener = (e) => {
+        this._isPointerDownEventOnPopover = I(this.overlay, e);
       }, this._closeOnBackdropClick = (e) => {
-        !this._isPointerDownEventOnPopover && !N(this.overlay, e) && (this._nextFocusedElement = e.composedPath().filter((s) => s instanceof window.HTMLElement).find((s) => s.matches(W)), clearTimeout(this.closeTimeout), this.close());
+        !this._isPointerDownEventOnPopover && !I(this.overlay, e) && (this._nextFocusedElement = e.composedPath().filter((s) => s instanceof window.HTMLElement).find((s) => s.matches(Y)), clearTimeout(this.closeTimeout), this.close());
       };
     }
     /**
@@ -39,15 +40,15 @@ let de = (() => {
      * For attribute usage, provide an id reference.
      */
     get trigger() {
-      return v(this, c);
+      return y(this, h);
     }
     set trigger(e) {
-      l(this, c, e);
+      d(this, h, e);
     }
     /** Opens the popover on trigger click. */
     open() {
       if (!(this.state !== "closed" && this.state !== "closing" || !this.overlay || !this.dispatchBeforeOpenEvent())) {
-        for (const e of k) {
+        for (const e of x) {
           const s = e.getAttribute("data-state");
           s && (s === "opened" || s === "opening") && e.close();
         }
@@ -59,7 +60,7 @@ let de = (() => {
       this.state !== "opened" && this.state !== "opening" || (this._popoverCloseElement = e, this.dispatchBeforeCloseEvent({ closeTarget: e ?? null }) && (this.state = "closing", this.inert = !0, this._triggerElement?.setAttribute("aria-expanded", "false"), this._isZeroAnimationDuration() && this._handleClosing()));
     }
     _isZeroAnimationDuration() {
-      return te(this, "--sbb-popover-animation-duration");
+      return G(this, "--sbb-popover-animation-duration");
     }
     _handleClosing() {
       this.state = "closed", this.hidePopover?.(), this.overlay?.firstElementChild?.scrollTo(0, 0), this.removeAttribute("tabindex"), this._skipCloseFocus || (this._nextFocusedElement || this._triggerElement)?.focus(), this._escapableOverlayController.disconnect(), this.dispatchCloseEvent({ closeTarget: this._popoverCloseElement ?? null }), this._openStateController?.abort(), this._focusTrapController.enabled = !1;
@@ -68,20 +69,20 @@ let de = (() => {
       this.state = "opened", this.inert = !1, this._attachWindowEvents(), this._escapableOverlayController.connect(), this._setPopoverFocus(), this._focusTrapController.enabled = !0, this.dispatchOpenEvent();
     }
     connectedCallback() {
-      this.popover = "manual", super.connectedCallback(), this.id ||= `sbb-popover-${++he}`, this.state = "closed", k.add(this), this.hasUpdated && this._configureTrigger();
+      this.popover = "manual", super.connectedCallback(), this.id ||= `sbb-popover-${++ne}`, this.state = "closed", x.add(this), this.hasUpdated && this._configureTrigger();
     }
-    requestUpdate(e, s, f) {
-      super.requestUpdate(e, s, f), !L && (!e || e === "trigger" || e === "hoverTrigger") && this.hasUpdated && this._configureTrigger();
+    requestUpdate(e, s, u) {
+      super.requestUpdate(e, s, u), !E && (!e || e === "trigger" || e === "hoverTrigger") && this.hasUpdated && this._configureTrigger();
     }
     firstUpdated(e) {
       super.firstUpdated(e), this._configureTrigger();
     }
     disconnectedCallback() {
-      super.disconnectedCallback(), this._triggerElement = null, this._triggerAbortController?.abort(), this._openStateController?.abort(), k.delete(this), this._blurTimeout && clearTimeout(this._blurTimeout);
+      super.disconnectedCallback(), this._triggerElement = null, this._triggerAbortController?.abort(), this._openStateController?.abort(), x.delete(this), this._blurTimeout && clearTimeout(this._blurTimeout);
     }
     // Check if the trigger is valid and attach click event listeners.
     _configureTrigger() {
-      if (!L) {
+      if (!E) {
         if (this.hydrationRequired) {
           this.hydrationComplete.then(() => this._configureTrigger());
           return;
@@ -90,7 +91,7 @@ let de = (() => {
       }
     }
     configureTrigger(e) {
-      this._triggerAbortController?.abort(), re(this._triggerElement), this._triggerElement = this.trigger, this._triggerElement && (ae(this._triggerElement, "dialog", this.id, this.state), this._triggerAbortController = new AbortController(), this.registerTriggerListeners(this._triggerAbortController.signal));
+      this._triggerAbortController?.abort(), te(this._triggerElement), this._triggerElement = this.trigger, this._triggerElement && (oe(this._triggerElement, "dialog", this.id, this.state), this._triggerAbortController = new AbortController(), this.registerTriggerListeners(this._triggerAbortController.signal));
     }
     registerTriggerListeners(e) {
       this._triggerElement.addEventListener("click", () => this.open(), { signal: e });
@@ -113,7 +114,7 @@ let de = (() => {
     }
     // Close the popover on click of any element that has the 'sbb-popover-close' attribute.
     _closeOnSbbPopoverCloseClick(e) {
-      const s = oe(e, "sbb-popover-close", this);
+      const s = J(e, "sbb-popover-close", this);
       s && !s.hasAttribute("disabled") && (clearTimeout(this.closeTimeout), this.close(s));
     }
     // Set popover position (x, y) to '0' once the popover is closed and the transition ended to prevent the
@@ -140,9 +141,9 @@ let de = (() => {
     _setPopoverPosition() {
       if (!this.overlay || !this._triggerElement)
         return;
-      const e = ne(this.overlay, this._triggerElement, this.shadowRoot.querySelector(".sbb-popover__container"), {
-        verticalOffset: be,
-        horizontalOffset: pe,
+      const e = se(this.overlay, this._triggerElement, this.shadowRoot.querySelector(".sbb-popover__container"), {
+        verticalOffset: re,
+        horizontalOffset: ae,
         centered: !0,
         responsiveHeight: !0
       });
@@ -160,13 +161,13 @@ let de = (() => {
       return this.dispatchEvent(new CustomEvent("close", { detail: e }));
     }
     render() {
-      return O`
+      return k`
       <div class="sbb-popover__container">
         <div
           @animationend=${this._onPopoverAnimationEnd}
           class="sbb-popover"
           role="tooltip"
-          ${j((e) => this.overlay = e)}
+          ${N((e) => this.overlay = e)}
         >
           <div
             @click=${(e) => this._closeOnSbbPopoverCloseClick(e)}
@@ -178,26 +179,24 @@ let de = (() => {
       </div>
     `;
     }
-  }, c = new WeakMap(), (() => {
+  }, h = new WeakMap(), (() => {
     const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(i[Symbol.metadata] ?? null) : void 0;
-    r = [ee(), T()], g(p, null, r, { kind: "accessor", name: "trigger", static: !1, private: !1, access: { has: (s) => "trigger" in s, get: (s) => s.trigger, set: (s, f) => {
-      s.trigger = f;
-    } }, metadata: e }, a, n), e && Object.defineProperty(p, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
-  })(), p.styles = le, p;
-})(), De = (() => {
-  var m, _, y, w, C, h;
-  let i = [Z("sbb-popover")], r, a = [], n, c = de, p, S = [], E = [], e, s = [], f = [], D, A = [], P = [], z, B = [], F = [], I, M = [], U = [];
-  return h = class extends c {
+    r = [X(), _()], v(l, null, r, { kind: "accessor", name: "trigger", static: !1, private: !1, access: { has: (s) => "trigger" in s, get: (s) => s.trigger, set: (s, u) => {
+      s.trigger = u;
+    } }, metadata: e }, a, n), e && Object.defineProperty(l, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
+  })(), l.styles = ie, l;
+})(), Le = (() => {
+  var g, f, m, b;
+  let i = [R("sbb-popover")], r, a = [], n, h = be, l = [], L, C = [], e = [], s, u = [], O = [], S, A, D, P = [], z = [];
+  return b = class extends h {
     constructor() {
       super(...arguments);
-      u(this, m);
-      u(this, _);
-      u(this, y);
-      u(this, w);
-      u(this, C);
-      l(this, m, b(this, S, !1)), l(this, _, (b(this, E), b(this, s, !1))), l(this, y, (b(this, f), b(this, A, 0))), l(this, w, (b(this, P), b(this, B, 0))), l(this, C, (b(this, F), b(this, M, ""))), this._hoverTrigger = (b(this, U), !1), this._language = new K(this), this._overlayAbortController = null, this._onTriggerMouseEnter = () => {
+      w(this, g);
+      w(this, f);
+      w(this, m);
+      d(this, g, (p(this, l), p(this, C, !1))), d(this, f, (p(this, e), p(this, u, !1))), this._openDelay = p(this, O), d(this, m, p(this, P, "")), this._hoverTrigger = (p(this, z), !1), this._language = new V(this), this._overlayAbortController = null, this._onTriggerMouseEnter = () => {
         this.state === "closed" || this.state === "closing" ? this._openTimeout = setTimeout(() => {
-          Q.reset(), this.open();
+          Z.reset(), this.open();
         }, this.openDelay) : clearTimeout(this.closeTimeout);
       }, this._onTriggerMouseLeave = () => {
         this.state === "opened" || this.state === "opening" ? this.closeTimeout = setTimeout(() => this.close(), this.closeDelay) : clearTimeout(this._openTimeout);
@@ -209,41 +208,51 @@ let de = (() => {
     }
     /** Whether the close button should be hidden. */
     get hideCloseButton() {
-      return v(this, m);
+      return y(this, g);
     }
     set hideCloseButton(o) {
-      l(this, m, o);
+      d(this, g, o);
     }
     /** Whether the popover should be triggered on hover. */
     get hoverTrigger() {
-      return v(this, _);
+      return y(this, f);
     }
     set hoverTrigger(o) {
-      l(this, _, o);
-    }
-    /** Open the popover after a certain delay. */
-    get openDelay() {
-      return v(this, y);
+      d(this, f, o);
     }
+    /**
+     * Open the popover after a given delay in milliseconds.
+     * Global configuration is used as default, if not set.
+     *
+     * @default 0
+     */
     set openDelay(o) {
-      l(this, y, o);
+      this._openDelay = +o;
     }
-    /** Close the popover after a certain delay. */
-    get closeDelay() {
-      return v(this, w);
+    get openDelay() {
+      return this._openDelay ?? M().popover?.openDelay ?? 0;
     }
+    /**
+     * Close the popover after a given delay in milliseconds.
+     * Global configuration is used as default, if not set.
+     *
+     * @default 0
+     */
     set closeDelay(o) {
-      l(this, w, o);
+      this._closeDelay = +o;
+    }
+    get closeDelay() {
+      return this._closeDelay ?? M().popover?.closeDelay ?? 0;
     }
     /** This will be forwarded as aria-label to the close button element. */
     get accessibilityCloseLabel() {
-      return v(this, C);
+      return y(this, m);
     }
     set accessibilityCloseLabel(o) {
-      l(this, C, o);
+      d(this, m, o);
     }
     configureTrigger(o) {
-      const t = this.hoverTrigger && !ce;
+      const t = this.hoverTrigger && !le;
       this.trigger === o && t === this._hoverTrigger || (this._hoverTrigger !== t && (this._hoverTrigger = t, this._registerOverlayListeners()), super.configureTrigger(o));
     }
     _registerOverlayListeners() {
@@ -257,17 +266,17 @@ let de = (() => {
       this._hoverTrigger && this.trigger ? (this.trigger.addEventListener("mouseenter", this._onTriggerMouseEnter, { signal: o }), this.trigger.addEventListener("mouseleave", this._onTriggerMouseLeave, { signal: o }), this.trigger.addEventListener("keydown", (t) => {
         (t.code === "Space" || t.code === "Enter") && this.open();
       }, { signal: o }), this.trigger.addEventListener("mousedown", (t) => {
-        V(t) && this.open();
+        j(t) && this.open();
       }, { signal: o })) : super.registerTriggerListeners(o);
     }
     firstUpdated(o) {
       super.firstUpdated(o), this._registerOverlayListeners();
     }
     renderContent() {
-      const o = O`
+      const o = k`
       <span class="sbb-popover__close">
         <sbb-secondary-button
-          aria-label=${this.accessibilityCloseLabel || se[this._language.current]}
+          aria-label=${this.accessibilityCloseLabel || K[this._language.current]}
           size="s"
           type="button"
           icon-name="cross-small"
@@ -275,29 +284,29 @@ let de = (() => {
         ></sbb-secondary-button>
       </span>
     `;
-      return O`
-      ${!this.hideCloseButton && !this._hoverTrigger ? o : Y}
+      return k`
+      ${!this.hideCloseButton && !this._hoverTrigger ? o : $}
       <span>
         <slot>No content</slot>
       </span>
     `;
     }
-  }, m = new WeakMap(), _ = new WeakMap(), y = new WeakMap(), w = new WeakMap(), C = new WeakMap(), n = h, (() => {
-    const o = typeof Symbol == "function" && Symbol.metadata ? Object.create(c[Symbol.metadata] ?? null) : void 0;
-    p = [x(), T({ attribute: "hide-close-button", type: Boolean })], e = [x(), T({ attribute: "hover-trigger", type: Boolean })], D = [x(), T({ attribute: "open-delay", type: Number })], z = [x(), T({ attribute: "close-delay", type: Number })], I = [x(), T({ attribute: "accessibility-close-label" })], g(h, null, p, { kind: "accessor", name: "hideCloseButton", static: !1, private: !1, access: { has: (t) => "hideCloseButton" in t, get: (t) => t.hideCloseButton, set: (t, d) => {
-      t.hideCloseButton = d;
-    } }, metadata: o }, S, E), g(h, null, e, { kind: "accessor", name: "hoverTrigger", static: !1, private: !1, access: { has: (t) => "hoverTrigger" in t, get: (t) => t.hoverTrigger, set: (t, d) => {
-      t.hoverTrigger = d;
-    } }, metadata: o }, s, f), g(h, null, D, { kind: "accessor", name: "openDelay", static: !1, private: !1, access: { has: (t) => "openDelay" in t, get: (t) => t.openDelay, set: (t, d) => {
-      t.openDelay = d;
-    } }, metadata: o }, A, P), g(h, null, z, { kind: "accessor", name: "closeDelay", static: !1, private: !1, access: { has: (t) => "closeDelay" in t, get: (t) => t.closeDelay, set: (t, d) => {
-      t.closeDelay = d;
-    } }, metadata: o }, B, F), g(h, null, I, { kind: "accessor", name: "accessibilityCloseLabel", static: !1, private: !1, access: { has: (t) => "accessibilityCloseLabel" in t, get: (t) => t.accessibilityCloseLabel, set: (t, d) => {
-      t.accessibilityCloseLabel = d;
-    } }, metadata: o }, M, U), g(null, r = { value: n }, i, { kind: "class", name: n.name, metadata: o }, null, a), n = r.value, o && Object.defineProperty(n, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: o }), b(n, a);
+  }, g = new WeakMap(), f = new WeakMap(), m = new WeakMap(), n = b, (() => {
+    const o = typeof Symbol == "function" && Symbol.metadata ? Object.create(h[Symbol.metadata] ?? null) : void 0;
+    L = [T(), _({ attribute: "hide-close-button", type: Boolean })], s = [T(), _({ attribute: "hover-trigger", type: Boolean })], S = [_({ attribute: "open-delay", type: Number })], A = [_({ attribute: "close-delay", type: Number })], D = [T(), _({ attribute: "accessibility-close-label" })], v(b, null, L, { kind: "accessor", name: "hideCloseButton", static: !1, private: !1, access: { has: (t) => "hideCloseButton" in t, get: (t) => t.hideCloseButton, set: (t, c) => {
+      t.hideCloseButton = c;
+    } }, metadata: o }, C, e), v(b, null, s, { kind: "accessor", name: "hoverTrigger", static: !1, private: !1, access: { has: (t) => "hoverTrigger" in t, get: (t) => t.hoverTrigger, set: (t, c) => {
+      t.hoverTrigger = c;
+    } }, metadata: o }, u, O), v(b, null, S, { kind: "setter", name: "openDelay", static: !1, private: !1, access: { has: (t) => "openDelay" in t, set: (t, c) => {
+      t.openDelay = c;
+    } }, metadata: o }, null, l), v(b, null, A, { kind: "setter", name: "closeDelay", static: !1, private: !1, access: { has: (t) => "closeDelay" in t, set: (t, c) => {
+      t.closeDelay = c;
+    } }, metadata: o }, null, l), v(b, null, D, { kind: "accessor", name: "accessibilityCloseLabel", static: !1, private: !1, access: { has: (t) => "accessibilityCloseLabel" in t, get: (t) => t.accessibilityCloseLabel, set: (t, c) => {
+      t.accessibilityCloseLabel = c;
+    } }, metadata: o }, P, z), v(null, r = { value: n }, i, { kind: "class", name: n.name, metadata: o }, null, a), n = r.value, o && Object.defineProperty(n, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: o }), p(n, a);
   })(), n;
 })();
 export {
-  de as SbbPopoverBaseElement,
-  De as SbbPopoverElement
+  be as SbbPopoverBaseElement,
+  Le as SbbPopoverElement
 };

package/radio-button/radio-button-panel/radio-button-panel.component.d.ts

@@ -30,15 +30,15 @@ export declare class SbbRadioButtonPanelElement<T = string> extends SbbRadioButt
      * The value of the form element
      */
     accessor value: T | null;
-    private _hasSelectionExpansionPanelElement;
+    private _hasSelectionPanelElement;
     connectedCallback(): void;
     protected willUpdate(changedProperties: PropertyValues<this>): void;
     /**
-     * As an exception, panels with an expansion-panel attached are always focusable
+     * As an exception, panels with a selection-panel attached are always focusable
      */
     protected updateFocusableRadios(): void;
     /**
-     * As an exception, radio-panels with an expansion-panel attached are not checked automatically when navigating by keyboard
+     * As an exception, radio-panels with a selection-panel attached are not checked automatically when navigating by keyboard
      */
     protected navigateByKeyboard(next: SbbRadioButtonPanelElement): Promise<void>;
     private _dispatchChangeEvent;
@@ -48,6 +48,9 @@ declare global {
     interface HTMLElementTagNameMap {
         'sbb-radio-button-panel': SbbRadioButtonPanelElement;
     }
+    interface GlobalEventHandlersEventMap {
+        statechange: CustomEvent<SbbStateChange>;
+    }
 }
 export {};
 //# sourceMappingURL=radio-button-panel.component.d.ts.map

package/radio-button/radio-button-panel/radio-button-panel.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"radio-button-panel.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/radio-button/radio-button-panel/radio-button-panel.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EAEV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAKb,OAAO,KAAK,EACV,qBAAqB,EACrB,sBAAsB,EACtB,cAAc,EACf,MAAM,0BAA0B,CAAC;AAClC,OAAO,EAGL,KAAK,YAAY,EAElB,MAAM,sBAAsB,CAAC;AAG9B,OAAO,6BAA6B,CAAC;AAErC,MAAM,MAAM,yBAAyB,GAAG,OAAO,CAC7C,cAAc,EACd,sBAAsB,GAAG,qBAAqB,CAC/C,CAAC;;AAEF;;;;;;;;;;;GAWG;AACH,qBAGM,0BAA0B,CAAC,CAAC,GAAG,MAAM,CAAE,SAAQ,+BAEpD;IACC,OAAuB,MAAM,EAAE,cAAc,CAA8C;IAG3F,gBAAuB,MAAM;;;MAGlB;IAEX;;;OAGG;IACH,SAEgB,IAAI,EAAE,YAAY,CAAwB;IAE1D;;OAEG;IACH,SACgB,KAAK,EAAE,CAAC,GAAG,IAAI,CAAQ;IAEvC,OAAO,CAAC,kCAAkC,CAAkB;IAE5C,iBAAiB,IAAI,IAAI;cAKtB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAkB5E;;OAEG;cACgB,qBAAqB,IAAI,IAAI;IAShD;;OAEG;cACsB,kBAAkB,CAAC,IAAI,EAAE,0BAA0B,GAAG,OAAO,CAAC,IAAI,CAAC;IAQ5F,OAAO,CAAC,oBAAoB;cAST,MAAM,IAAI,cAAc;CAmB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,wBAAwB,EAAE,0BAA0B,CAAC;KACtD;CACF"}
+{"version":3,"file":"radio-button-panel.component.d.ts","sourceRoot":"","sources":["../../../../src/elements/radio-button/radio-button-panel/radio-button-panel.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EAEV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAKb,OAAO,KAAK,EACV,qBAAqB,EACrB,sBAAsB,EACtB,cAAc,EACf,MAAM,0BAA0B,CAAC;AAClC,OAAO,EAGL,KAAK,YAAY,EAElB,MAAM,sBAAsB,CAAC;AAG9B,OAAO,6BAA6B,CAAC;AAErC,MAAM,MAAM,yBAAyB,GAAG,OAAO,CAC7C,cAAc,EACd,sBAAsB,GAAG,qBAAqB,CAC/C,CAAC;;AAEF;;;;;;;;;;;GAWG;AACH,qBAGM,0BAA0B,CAAC,CAAC,GAAG,MAAM,CAAE,SAAQ,+BAEpD;IACC,OAAuB,MAAM,EAAE,cAAc,CAA8C;IAG3F,gBAAuB,MAAM;;;MAGlB;IAEX;;;OAGG;IACH,SAEgB,IAAI,EAAE,YAAY,CAAwB;IAE1D;;OAEG;IACH,SACgB,KAAK,EAAE,CAAC,GAAG,IAAI,CAAQ;IAEvC,OAAO,CAAC,yBAAyB,CAAkB;IAEnC,iBAAiB,IAAI,IAAI;cAOtB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAkB5E;;OAEG;cACgB,qBAAqB,IAAI,IAAI;IAShD;;OAEG;cACsB,kBAAkB,CAAC,IAAI,EAAE,0BAA0B,GAAG,OAAO,CAAC,IAAI,CAAC;IAQ5F,OAAO,CAAC,oBAAoB;cAST,MAAM,IAAI,cAAc;CAmB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,wBAAwB,EAAE,0BAA0B,CAAC;KACtD;IAED,UAAU,2BAA2B;QACnC,WAAW,EAAE,WAAW,CAAC,cAAc,CAAC,CAAC;KAC1C;CACF"}

package/radio-button/radio-button-panel/radio-button-panel.component.js

@@ -1,8 +1,8 @@
-var E = (s) => {
+var S = (s) => {
   throw TypeError(s);
 };
-var S = (s, a, i) => a.has(s) || E("Cannot " + i);
-var b = (s, a, i) => (S(s, a, "read from private field"), i ? i.call(s) : a.get(s)), h = (s, a, i) => a.has(s) ? E("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(s) : a.set(s, i), d = (s, a, i, l) => (S(s, a, "write to private field"), l ? l.call(s, i) : a.set(s, i), i);
+var E = (s, a, i) => a.has(s) || S("Cannot " + i);
+var b = (s, a, i) => (E(s, a, "read from private field"), i ? i.call(s) : a.get(s)), h = (s, a, i) => a.has(s) ? S("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(s) : a.set(s, i), d = (s, a, i, l) => (E(s, a, "write to private field"), l ? l.call(s, i) : a.set(s, i), i);
 import { __runInitializers as u, __esDecorate as m } from "tslib";
 import { LitElement as C, nothing as B, html as x } from "lit";
 import { customElement as w, property as k } from "lit/decorators.js";
@@ -19,7 +19,7 @@ let N = (() => {
       super(...arguments);
       h(this, o);
       h(this, r);
-      d(this, o, u(this, f, D() ? "s" : "m")), d(this, r, (u(this, v), u(this, y, null))), this._hasSelectionExpansionPanelElement = (u(this, z), !1);
+      d(this, o, u(this, f, D() ? "s" : "m")), d(this, r, (u(this, v), u(this, y, null))), this._hasSelectionPanelElement = (u(this, z), !1);
     }
     /**
      * Size variant, either s or m.
@@ -41,22 +41,22 @@ let N = (() => {
       d(this, r, e);
     }
     connectedCallback() {
-      super.connectedCallback(), this._hasSelectionExpansionPanelElement = !!this.closest?.("sbb-selection-expansion-panel");
+      super.connectedCallback(), this._hasSelectionPanelElement = !!this.closest?.("sbb-selection-expansion-panel, sbb-selection-action-panel");
     }
     willUpdate(e) {
       super.willUpdate(e), e.has("checked") && (this.toggleAttribute("data-checked", this.checked), this.checked !== e.get("checked") && this._dispatchChangeEvent({ type: "checked", checked: this.checked })), e.has("disabled") && this.disabled !== e.get("disabled") && this._dispatchChangeEvent({ type: "disabled", disabled: this.disabled });
     }
     /**
-     * As an exception, panels with an expansion-panel attached are always focusable
+     * As an exception, panels with a selection-panel attached are always focusable
      */
     updateFocusableRadios() {
-      super.updateFocusableRadios(), Array.from(this.associatedRadioButtons ?? []).filter((t) => !t.disabled && t._hasSelectionExpansionPanelElement).forEach((t) => t.tabIndex = 0);
+      super.updateFocusableRadios(), Array.from(this.associatedRadioButtons ?? []).filter((t) => !t.disabled && t._hasSelectionPanelElement).forEach((t) => t.tabIndex = 0);
     }
     /**
-     * As an exception, radio-panels with an expansion-panel attached are not checked automatically when navigating by keyboard
+     * As an exception, radio-panels with a selection-panel attached are not checked automatically when navigating by keyboard
      */
     async navigateByKeyboard(e) {
-      this._hasSelectionExpansionPanelElement ? e.focus() : await super.navigateByKeyboard(e);
+      this._hasSelectionPanelElement ? e.focus() : await super.navigateByKeyboard(e);
     }
     _dispatchChangeEvent(e) {
       this.dispatchEvent(new CustomEvent("statechange", { bubbles: !0, detail: e }));

package/select/select.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"select.component.d.ts","sourceRoot":"","sources":["../../../src/elements/select/select.component.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"select.component.d.ts","sourceRoot":"","sources":["../../../src/elements/select/select.component.ts"],"names":[],"mappings":"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"}

package/select/select.component.js

@@ -224,7 +224,7 @@ let Oe = 0, Ne = (() => {
       return Promise.all(e.getAll(this.name).map(async (t) => t instanceof Blob ? JSON.parse(await t.text()) : t));
     }
     _syncProperties() {
-      this.querySelectorAll?.("sbb-divider").forEach((e) => e.negative = this.negative), this.querySelectorAll?.("sbb-option, sbb-optgroup").forEach((e) => {
+      this.querySelectorAll?.("sbb-divider, sbb-option-hint").forEach((e) => e.negative = this.negative), this.querySelectorAll?.("sbb-option, sbb-optgroup").forEach((e) => {
         e.toggleAttribute("data-negative", this.negative), e.toggleAttribute("data-multiple", this.multiple);
       }), this.querySelectorAll?.("sbb-option, sbb-optgroup").forEach((e) => e.requestUpdate?.());
     }

package/selection-action-panel/selection-action-panel.component.d.ts

@@ -0,0 +1,22 @@
+import { CSSResultGroup, LitElement, TemplateResult } from 'lit';
+declare const SbbSelectionActionPanelElement_base: import('../core/mixins.js').AbstractConstructor<import('../core/mixins.js').SbbSelectionPanelMixinType & import('../core/mixins.js').SbbElementInternalsMixinType> & import('../core/mixins.js').AbstractConstructor<import('../core/mixins.js').SbbHydrationMixinType> & typeof LitElement;
+/**
+ * It displays a panel connected to a `sbb-checkbox` or to a `sbb-radio-button`.
+ * It can also contain an action element (e.g. an `sbb-button`)
+ *
+ * @slot - Use this slot to render a `sbb-checkbox-panel` or `sbb-radio-button-panel` element and the action element.
+ * @slot badge - Use this slot to render a `sbb-card-badge` component.
+ */
+export declare class SbbSelectionActionPanelElement extends SbbSelectionActionPanelElement_base {
+    static styles: CSSResultGroup;
+    constructor();
+    connectedCallback(): void;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-selection-action-panel': SbbSelectionActionPanelElement;
+    }
+}
+export {};
+//# sourceMappingURL=selection-action-panel.component.d.ts.map

package/selection-action-panel/selection-action-panel.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"selection-action-panel.component.d.ts","sourceRoot":"","sources":["../../../src/elements/selection-action-panel/selection-action-panel.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAQ,UAAU,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAOjF,OAAO,eAAe,CAAC;;AAEvB;;;;;;GAMG;AACH,qBAEM,8BAA+B,SAAQ,mCAAqD;IAChG,OAAuB,MAAM,EAAE,cAAc,CAAS;;IAOtC,iBAAiB,IAAI,IAAI;cAStB,MAAM,IAAI,cAAc;CAU5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,4BAA4B,EAAE,8BAA8B,CAAC;KAC9D;CACF"}

package/selection-action-panel/selection-action-panel.component.js

@@ -0,0 +1,34 @@
+import { __esDecorate as r, __runInitializers as i } from "tslib";
+import { css as b, LitElement as c, html as d } from "lit";
+import { customElement as p } from "lit/decorators.js";
+import { SbbSelectionPanelMixin as u, SbbHydrationMixin as h } from "../core/mixins.js";
+import "../divider.js";
+const m = b`*,:before,:after{box-sizing:border-box}:host{--sbb-selection-action-panel-background: var(--sbb-color-white);--sbb-selection-action-panel-border-color: var(--sbb-color-cloud);--sbb-selection-panel-inner-background: transparent;--sbb-selection-panel-inner-border-width: 0px;--sbb-selection-action-panel-border-width: var(--sbb-border-width-1x);--sbb-selection-action-panel-border-radius: var(--sbb-border-radius-4x);--sbb-focus-outline-color: var(--sbb-focus-outline-color-default);display:block;position:relative;flex:1 1 auto;width:100%}:host([color=milk]){--sbb-selection-action-panel-background: var(--sbb-color-milk)}:host(:where(:state(checked),[state--checked]):not(:where(:state(disabled),[state--disabled]))){--sbb-selection-action-panel-border-color: var(--sbb-color-charcoal);--sbb-selection-action-panel-border-width: var(--sbb-border-width-2x)}:host([borderless]:not(:where(:state(checked),[state--checked]))){--sbb-selection-action-panel-border-color: transparent}:host(:is(:state(with-expansion-panel),[state--with-expansion-panel])){--sbb-selection-action-panel-background: transparent;--sbb-selection-action-panel-border-color: transparent}::slotted(:is(sbb-checkbox-panel,sbb-radio-button-panel)){flex:auto}::slotted([data-action]){align-self:center;margin-inline:var(--sbb-spacing-responsive-xxs)}.sbb-selection-action-panel{display:flex;background-color:var(--sbb-selection-action-panel-background);border-radius:var(--sbb-selection-action-panel-border-radius);box-shadow:inset 0 0 0 var(--sbb-selection-action-panel-border-width) var(--sbb-selection-action-panel-border-color)}.sbb-selection-action-panel__badge{-webkit-user-select:none;user-select:none;pointer-events:none;position:absolute;inset:0;border-radius:var(--sbb-selection-action-panel-border-radius);overflow:hidden}`;
+let w = (() => {
+  var t;
+  let l = [p("sbb-selection-action-panel")], a, n = [], e, s = u(h(c));
+  return t = class extends s {
+    constructor() {
+      super(), this.addEventListener?.("statechange", (o) => this.onInputStateChange(o));
+    }
+    connectedCallback() {
+      super.connectedCallback(), this.toggleState("with-expansion-panel", this.parentElement?.localName === "sbb-selection-expansion-panel");
+    }
+    render() {
+      return d`
+      <div class="sbb-selection-action-panel__badge">
+        <slot name="badge"></slot>
+      </div>
+      <div class="sbb-selection-action-panel">
+        <slot></slot>
+      </div>
+    `;
+    }
+  }, e = t, (() => {
+    const o = typeof Symbol == "function" && Symbol.metadata ? Object.create(s[Symbol.metadata] ?? null) : void 0;
+    r(null, a = { value: e }, l, { kind: "class", name: e.name, metadata: o }, null, n), e = a.value, o && Object.defineProperty(e, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: o });
+  })(), t.styles = m, i(e, n), e;
+})();
+export {
+  w as SbbSelectionActionPanelElement
+};

package/selection-action-panel.d.ts

@@ -0,0 +1,5 @@
+/**
+ * @entrypoint
+ */
+export * from './selection-action-panel/selection-action-panel.component.js';
+//# sourceMappingURL=selection-action-panel.d.ts.map

package/selection-action-panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"selection-action-panel.d.ts","sourceRoot":"","sources":["../../src/elements/selection-action-panel.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,cAAc,8DAA8D,CAAC"}

package/selection-action-panel.js

@@ -0,0 +1,4 @@
+import { SbbSelectionActionPanelElement as o } from "./selection-action-panel/selection-action-panel.component.js";
+export {
+  o as SbbSelectionActionPanelElement
+};

package/selection-expansion-panel/selection-expansion-panel.component.d.ts

@@ -1,5 +1,6 @@
 import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
-declare const SbbSelectionExpansionPanelElement_base: import('../core/mixins.js').AbstractConstructor<import('../core/mixins.js').SbbHydrationMixinType> & typeof LitElement;
+import { SbbStateChange } from '../core/interfaces.js';
+declare const SbbSelectionExpansionPanelElement_base: import('../core/mixins.js').AbstractConstructor<import('../core/mixins.js').SbbSelectionPanelMixinType & import('../core/mixins.js').SbbElementInternalsMixinType> & import('../core/mixins.js').AbstractConstructor<import('../core/mixins.js').SbbHydrationMixinType> & typeof LitElement;
 /**
  * It displays an expandable panel connected to a `sbb-checkbox` or to a `sbb-radio-button`.
  *
@@ -14,45 +15,24 @@ export declare class SbbSelectionExpansionPanelElement extends SbbSelectionExpan
         readonly beforeclose: "beforeclose";
         readonly close: "close";
     };
-    /** The background color of the panel. */
-    accessor color: 'white' | 'milk';
     /** Whether the content section is always visible. */
     accessor forceOpen: boolean;
-    /** Whether the unselected panel has a border. */
-    accessor borderless: boolean;
     /** The state of the selection panel. */
     private set _state(value);
     private get _state();
-    /** Whether the selection panel is checked. */
-    private set _checked(value);
-    private get _checked();
-    /** Whether the selection panel is disabled. */
-    private set _disabled(value);
     private _language;
-    private _sizeAttributeObserver;
     /** Whether it has an expandable content */
     private get _hasContent();
-    private get _group();
-    constructor();
     connectedCallback(): void;
-    disconnectedCallback(): void;
     protected willUpdate(changedProperties: PropertyValues<this>): void;
+    protected initFromInput(event: Event): void;
+    protected onInputStateChange(event: CustomEvent<SbbStateChange>): void;
     private _updateState;
     private _open;
     private _close;
     private _isZeroAnimationDuration;
     private _handleClosing;
     private _handleOpening;
-    private _initFromInput;
-    /**
-     * Set the data-size in two cases:
-     * - if there's no group, so the size change comes directly from a change on the inner panel;
-     * - if there's a wrapper group and its size changes, syncing it with the panel size.
-     *
-     * On the other hand, if there's a wrapper group and the size changes on the inner panel, the data-size doesn't change.
-     */
-    private _onSizeAttributesChange;
-    private _onInputStateChange;
     private _onAnimationEnd;
     private _updateExpandedLabel;
     protected render(): TemplateResult;