@sbb-esta/lyne-elements 1.5.0 → 1.7.0

package/accordion/accordion.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup, PropertyValues, TemplateResult, LitElement } from 'lit';
 import { SbbTitleLevel } from '../title.js';
-
 declare const SbbAccordionElement_base: import('../core/mixins.js').AbstractConstructor<import('../core/mixins.js').SbbHydrationMixinType> & typeof LitElement;
 /**
  * It can be used as a container for one or more `sbb-expansion-panel` component.

package/action-group/action-group.d.ts

@@ -2,7 +2,6 @@ import { CSSResultGroup, PropertyValues, TemplateResult, LitElement } from 'lit'
 import { SbbButtonSize } from '../button.js';
 import { SbbHorizontalFrom, SbbOrientation } from '../core/interfaces.js';
 import { SbbLinkSize } from '../link.js';
-
 /**
  * It can be used as a container for one or more action element, like `sbb-button` or `sbb-block-link`.
  *

package/alert/alert/alert.d.ts

@@ -1,16 +1,17 @@
-import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
-import { LinkTargetType } from '../../core/base-elements.js';
+import { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
+import { LinkTargetType, SbbOpenCloseBaseElement } from '../../core/base-elements.js';
 import { SbbTitleLevel } from '../../title.js';
-
-declare const SbbAlertElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../icon.js').SbbIconNameMixinType> & typeof LitElement;
+declare const SbbAlertElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../icon.js').SbbIconNameMixinType> & typeof SbbOpenCloseBaseElement;
 /**
  * It displays messages which require user's attention.
  *
  * @slot - Use the unnamed slot to add content to the `sbb-alert`.
  * @slot icon - Should be a `sbb-icon` which is displayed next to the title. Styling is optimized for icons of type HIM-CUS.
  * @slot title - Title content.
- * @event {CustomEvent<void>} willOpen - Emits when the fade in animation starts.
- * @event {CustomEvent<void>} didOpen - Emits when the fade in animation ends and the button is displayed.
+ * @event {CustomEvent<void>} willOpen - Emits when the opening animation starts.
+ * @event {CustomEvent<void>} didOpen - Emits when the opening animation ends.
+ * @event {CustomEvent<void>} willClose - Emits when the closing animation starts. Can be canceled.
+ * @event {CustomEvent<void>} didClose - Emits when the closing animation ends.
  * @event {CustomEvent<void>} dismissalRequested - Emits when dismissal of an alert was requested.
  */
 export declare class SbbAlertElement extends SbbAlertElement_base {
@@ -18,6 +19,8 @@ export declare class SbbAlertElement extends SbbAlertElement_base {
     static readonly events: {
         readonly willOpen: "willOpen";
         readonly didOpen: "didOpen";
+        readonly willClose: "willClose";
+        readonly didClose: "didClose";
         readonly dismissalRequested: "dismissalRequested";
     };
     /**
@@ -48,23 +51,25 @@ export declare class SbbAlertElement extends SbbAlertElement_base {
     /** This will be forwarded as aria-label to the relevant nested element. */
     accessibilityLabel: string | undefined;
     /** The enabled animations. */
-    animation: 'open' | 'none';
-    /** The state of the alert. */
-    private get _state();
-    private set _state(value);
-    /** Emits when the fade in animation starts. */
-    private _willOpen;
-    /** Emits when the fade in animation ends and the button is displayed. */
-    private _didOpen;
-    /** Emits when dismissal of an alert was requested. */
+    animation: 'open' | 'close' | 'all' | 'none';
+    /**
+     * Emits when dismissal of an alert was requested.
+     * @deprecated
+     */
     private _dismissalRequested;
     private _language;
     protected firstUpdated(changedProperties: PropertyValues<this>): Promise<void>;
-    /** Requests dismissal of the alert. */
+    /** Requests dismissal of the alert.
+     * @deprecated in favour of 'willClose' and 'didClose' events
+     */
     requestDismissal(): void;
     /** Open the alert. */
-    private _open;
+    open(): void;
+    /** Close the alert. */
+    close(): void;
     private _onAnimationEnd;
+    private _handleOpening;
+    private _handleClosing;
     protected render(): TemplateResult;
 }
 declare global {

package/alert/alert/alert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../../src/elements/alert/alert/alert.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EAEV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAGb,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAMlE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAIpD,OAAO,oCAAoC,CAAC;AAC5C,OAAO,kBAAkB,CAAC;AAC1B,OAAO,eAAe,CAAC;AACvB,OAAO,gBAAgB,CAAC;;AAIxB;;;;;;;;;GASG;AACH,qBACa,eAAgB,SAAQ,oBAA4B;IAC/D,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;;;MAIlB;IAEX;;;OAGG;IACgD,QAAQ,UAAS;IAEpE,mDAAmD;IACf,IAAI,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAO;IAEhE;;;;OAIG;IACmD,QAAQ,EAAE,MAAM,CAAU;IAEhF,wBAAwB;IACyB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEvE,sFAAsF;IACvC,UAAU,EAAE,aAAa,CAAO;IAE/E,2BAA2B;IACqB,WAAW,CAAC,EAAE,MAAM,CAAC;IAErE,0CAA0C;IACvB,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAE5C,uCAAuC;IACpB,MAAM,EAAE,cAAc,GAAG,MAAM,GAAG,SAAS,CAAC;IAE/D,wEAAwE;IACrD,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;IAE3C,2EAA2E;IACpB,kBAAkB,EAAE,MAAM,GAAG,SAAS,CAAC;IAE9F,8BAA8B;IACM,SAAS,EAAE,MAAM,GAAG,MAAM,CAAU;IAExE,8BAA8B;IAC9B,OAAO,KAAK,MAAM,GAEjB;IACD,OAAO,KAAK,MAAM,QAEjB;IAED,+CAA+C;IAC/C,OAAO,CAAC,SAAS,CAA+E;IAEhG,yEAAyE;IACzE,OAAO,CAAC,QAAQ,CAA8E;IAE9F,sDAAsD;IACtD,OAAO,CAAC,mBAAmB,CAGzB;IAEF,OAAO,CAAC,SAAS,CAAmC;cAE3B,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;IAM7F,uCAAuC;IAChC,gBAAgB,IAAI,IAAI;IAI/B,sBAAsB;IACtB,OAAO,CAAC,KAAK;IAKb,OAAO,CAAC,eAAe;cAOJ,MAAM,IAAI,cAAc;CAqD5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,WAAW,EAAE,eAAe,CAAC;KAC9B;CACF"}
+{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../../src/elements/alert/alert/alert.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAiB,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAGnG,OAAO,EAAE,KAAK,cAAc,EAAE,uBAAuB,EAAE,MAAM,6BAA6B,CAAC;AAK3F,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAIpD,OAAO,oCAAoC,CAAC;AAC5C,OAAO,kBAAkB,CAAC;AAC1B,OAAO,eAAe,CAAC;AACvB,OAAO,gBAAgB,CAAC;;AAExB;;;;;;;;;;;GAWG;AACH,qBACa,eAAgB,SAAQ,oBAAyC;IAC5E,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAgC,MAAM;;;;;;MAM3B;IAEX;;;OAGG;IACgD,QAAQ,UAAS;IAEpE,mDAAmD;IACf,IAAI,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAO;IAEhE;;;;OAIG;IACmD,QAAQ,EAAE,MAAM,CAAU;IAEhF,wBAAwB;IACyB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEvE,sFAAsF;IACvC,UAAU,EAAE,aAAa,CAAO;IAE/E,2BAA2B;IACqB,WAAW,CAAC,EAAE,MAAM,CAAC;IAErE,0CAA0C;IACvB,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAE5C,uCAAuC;IACpB,MAAM,EAAE,cAAc,GAAG,MAAM,GAAG,SAAS,CAAC;IAE/D,wEAAwE;IACrD,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;IAE3C,2EAA2E;IACpB,kBAAkB,EAAE,MAAM,GAAG,SAAS,CAAC;IAE9F,8BAA8B;IACM,SAAS,EAAE,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,MAAM,CAAS;IAEzF;;;OAGG;IACH,OAAO,CAAC,mBAAmB,CAGzB;IAEF,OAAO,CAAC,SAAS,CAAmC;cAE3B,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;IAM7F;;OAEG;IACI,gBAAgB,IAAI,IAAI;IAI/B,sBAAsB;IACf,IAAI,IAAI,IAAI;IAKnB,uBAAuB;IAChB,KAAK,IAAI,IAAI;IAMpB,OAAO,CAAC,eAAe;IAQvB,OAAO,CAAC,cAAc;IAKtB,OAAO,CAAC,cAAc;cAMH,MAAM,IAAI,cAAc;CAqD5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,WAAW,EAAE,eAAe,CAAC;KAC9B;CACF"}

package/alert/alert-group/alert-group.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup, TemplateResult, LitElement } from 'lit';
 import { SbbTitleLevel } from '../../title.js';
-
 declare const SbbAlertGroupElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbHydrationMixinType> & typeof LitElement;
 /**
  * It can be used as a container for one or more `sbb-alert` component.
@@ -34,8 +33,8 @@ export declare class SbbAlertGroupElement extends SbbAlertGroupElement_base {
     /** Emits when `sbb-alert-group` becomes empty. */
     private _empty;
     private _abort;
-    private _removeAlert;
     connectedCallback(): void;
+    private _alertClosed;
     private _slotChanged;
     protected render(): TemplateResult;
 }

package/alert/alert-group/alert-group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"alert-group.d.ts","sourceRoot":"","sources":["../../../../src/elements/alert/alert-group/alert-group.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AAO1C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;;AAKpD;;;;;;;GAOG;AACH,qBACa,oBAAqB,SAAQ,yBAA6B;IACrE,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;;MAGlB;IAEX;;;;;OAKG;IAEa,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAY;IAE7D,gFAAgF;IACzB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAEnF,wGAAwG;IAEjG,uBAAuB,EAAE,aAAa,CAAO;IAEpD,kDAAkD;IACzC,OAAO,CAAC,UAAU,CAAC,CAAU;IAEtC,gDAAgD;IAChD,OAAO,CAAC,gBAAgB,CAGtB;IAEF,kDAAkD;IAClD,OAAO,CAAC,MAAM,CAAiF;IAE/F,OAAO,CAAC,MAAM,CAAyC;IAEvD,OAAO,CAAC,YAAY;IAoBJ,iBAAiB,IAAI,IAAI;IAQzC,OAAO,CAAC,YAAY;cAaD,MAAM,IAAI,cAAc;CAe5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,iBAAiB,EAAE,oBAAoB,CAAC;KACzC;CACF"}
+{"version":3,"file":"alert-group.d.ts","sourceRoot":"","sources":["../../../../src/elements/alert/alert-group/alert-group.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AAO1C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;;AAKpD;;;;;;;GAOG;AACH,qBACa,oBAAqB,SAAQ,yBAA6B;IACrE,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;;MAGlB;IAEX;;;;;OAKG;IAEa,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAY;IAE7D,gFAAgF;IACzB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAEnF,wGAAwG;IAEjG,uBAAuB,EAAE,aAAa,CAAO;IAEpD,kDAAkD;IACzC,OAAO,CAAC,UAAU,CAAC,CAAU;IAEtC,gDAAgD;IAChD,OAAO,CAAC,gBAAgB,CAGtB;IAEF,kDAAkD;IAClD,OAAO,CAAC,MAAM,CAAiF;IAE/F,OAAO,CAAC,MAAM,CAAyC;IAEvC,iBAAiB,IAAI,IAAI;IAezC,OAAO,CAAC,YAAY;IAkBpB,OAAO,CAAC,YAAY;cAaD,MAAM,IAAI,cAAc;CAe5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,iBAAiB,EAAE,oBAAoB,CAAC;KACzC;CACF"}

package/alert/alert-group.js

@@ -1,37 +1,42 @@
-import { css as h, LitElement as m, nothing as u } from "lit";
-import { property as b, state as f, customElement as v } from "lit/decorators.js";
-import { html as c, unsafeStatic as p } from "lit/static-html.js";
-import { SbbConnectedAbortController as g } from "../core/controllers.js";
-import { EventEmitter as d } from "../core/eventing.js";
-import { SbbHydrationMixin as _ } from "../core/mixins.js";
-import { SbbAlertElement as y } from "./alert.js";
-const A = h`*,:before,:after{box-sizing:border-box}:host{--sbb-alert-group-gap: var(--sbb-spacing-fixed-3x);--sbb-alert-group-border-radius: var(--sbb-border-radius-4x);display:block}.sbb-alert-group{display:flex;flex-direction:column;gap:var(--sbb-alert-group-gap)}:host(:focus-visible:not([data-empty])){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width);border-radius:var(--sbb-alert-group-border-radius)}.sbb-alert-group__title{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}`;
-var x = Object.defineProperty, E = Object.getOwnPropertyDescriptor, l = (e, t, i, r) => {
-  for (var o = r > 1 ? void 0 : r ? E(t, i) : t, a = e.length - 1, n; a >= 0; a--)
-    (n = e[a]) && (o = (r ? n(t, i, o) : n(o)) || o);
-  return r && o && x(t, i, o), o;
+import { css as u, LitElement as m, nothing as f } from "lit";
+import { property as b, state as g, customElement as v } from "lit/decorators.js";
+import { html as c, unsafeStatic as d } from "lit/static-html.js";
+import { SbbConnectedAbortController as _ } from "../core/controllers.js";
+import { EventEmitter as p } from "../core/eventing.js";
+import { SbbHydrationMixin as y } from "../core/mixins.js";
+import { SbbAlertElement as h } from "./alert.js";
+const A = u`*,:before,:after{box-sizing:border-box}:host{--sbb-alert-group-gap: var(--sbb-spacing-fixed-3x);--sbb-alert-group-border-radius: var(--sbb-border-radius-4x);display:block}.sbb-alert-group{display:flex;flex-direction:column;gap:var(--sbb-alert-group-gap)}:host(:focus-visible:not([data-empty])){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width);border-radius:var(--sbb-alert-group-border-radius)}.sbb-alert-group__title{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}`;
+var x = Object.defineProperty, E = Object.getOwnPropertyDescriptor, l = (e, t, i, o) => {
+  for (var r = o > 1 ? void 0 : o ? E(t, i) : t, a = e.length - 1, n; a >= 0; a--)
+    (n = e[a]) && (r = (o ? n(t, i, r) : n(r)) || r);
+  return o && r && x(t, i, r), r;
 };
-let s = class extends _(m) {
+let s = class extends y(m) {
   constructor() {
-    super(...arguments), this.role = "status", this.accessibilityTitleLevel = "2", this._didDismissAlert = new d(
+    super(...arguments), this.role = "status", this.accessibilityTitleLevel = "2", this._didDismissAlert = new p(
       this,
       s.events.didDismissAlert
-    ), this._empty = new d(this, s.events.empty), this._abort = new g(this);
-  }
-  _removeAlert(e) {
-    var r;
-    const t = e.target, i = document.activeElement === t;
-    (r = t.parentNode) == null || r.removeChild(t), this._didDismissAlert.emit(t), i && (this.tabIndex = 0, this.focus(), this.addEventListener("blur", () => this.removeAttribute("tabindex"), {
-      once: !0
-    }));
+    ), this._empty = new p(this, s.events.empty), this._abort = new _(this);
   }
   connectedCallback() {
     super.connectedCallback();
     const e = this._abort.signal;
-    this.addEventListener(y.events.dismissalRequested, (t) => this._removeAlert(t), {
+    this.addEventListener(
+      h.events.dismissalRequested,
+      (t) => t.target.close(),
+      {
+        signal: e
+      }
+    ), this.addEventListener(h.events.didClose, (t) => this._alertClosed(t), {
       signal: e
     });
   }
+  _alertClosed(e) {
+    const t = e.target, i = document.activeElement === t;
+    this._didDismissAlert.emit(t), i && (this.tabIndex = 0, this.focus(), this.addEventListener("blur", () => this.removeAttribute("tabindex"), {
+      once: !0
+    }));
+  }
   _slotChanged(e) {
     const t = this._hasAlerts;
     this._hasAlerts = e.target.assignedElements().filter((i) => i instanceof Element && i.localName === "sbb-alert").length > 0, !this._hasAlerts && t && this._empty.emit(), this.toggleAttribute("data-empty", !this._hasAlerts);
@@ -40,9 +45,9 @@ let s = class extends _(m) {
     const e = `h${this.accessibilityTitleLevel}`;
     return c`
       <div class="sbb-alert-group">
-        ${this._hasAlerts ? c`<${p(e)} class="sbb-alert-group__title">
+        ${this._hasAlerts ? c`<${d(e)} class="sbb-alert-group__title">
               <slot name="accessibility-title">${this.accessibilityTitle}</slot>
-            </${p(e)}>` : u}
+            </${d(e)}>` : f}
         <slot @slotchange=${(t) => this._slotChanged(t)}></slot>
       </div>
     `;
@@ -63,7 +68,7 @@ l([
   b({ attribute: "accessibility-title-level" })
 ], s.prototype, "accessibilityTitleLevel", 2);
 l([
-  f()
+  g()
 ], s.prototype, "_hasAlerts", 2);
 s = l([
   v("sbb-alert-group")

package/alert/alert.js

@@ -1,49 +1,55 @@
-import { css as m, LitElement as v, html as d, nothing as r } from "lit";
-import { property as i, customElement as h } from "lit/decorators.js";
-import { SbbLanguageController as u } from "../core/controllers.js";
-import { EventEmitter as c } from "../core/eventing.js";
-import { i18nFindOutMore as g, i18nCloseAlert as _ } from "../core/i18n.js";
-import { SbbIconNameMixin as f } from "../icon.js";
+import { css as m, html as p, nothing as n } from "lit";
+import { property as i, customElement as c } from "lit/decorators.js";
+import { SbbOpenCloseBaseElement as g } from "../core/base-elements.js";
+import { SbbLanguageController as h } from "../core/controllers.js";
+import { EventEmitter as u } from "../core/eventing.js";
+import { i18nFindOutMore as v, i18nCloseAlert as f } from "../core/i18n.js";
+import { SbbIconNameMixin as _ } from "../icon.js";
 import "../button/transparent-button.js";
 import "../divider.js";
 import "../link.js";
 import "../title.js";
-const y = m`*,:before,:after{box-sizing:border-box}:host{--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);--sbb-alert-background-color: var(--sbb-color-midnight);--sbb-alert-border-radius: var(--sbb-border-radius-4x);--sbb-alert-color: var(--sbb-color-aluminium);--sbb-alert-padding: var(--sbb-spacing-responsive-xxs) var(--sbb-spacing-responsive-xs);--sbb-alert-icon-size: 1.25rem;--sbb-alert-close-icon-size: var(--sbb-size-icon-ui-small);--sbb-alert-close-icon-margin: var(--sbb-spacing-responsive-xxs);--sbb-alert-gap: var(--sbb-spacing-fixed-2x) var(--sbb-spacing-responsive-xs);--sbb-alert-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-6x) );display:block}@media (min-width: 52.5rem){:host{--sbb-alert-icon-size: 1.75rem}}@media (forced-colors: active){:host{outline:var(--sbb-border-width-1x) solid CanvasText;border-radius:var(--sbb-alert-border-radius)}}:host([animation=none]){--sbb-disable-animation-time: .1ms;--sbb-disable-animation-zero-time: 0s}:host([size=s]){--sbb-alert-gap: var(--sbb-spacing-fixed-1x) var(--sbb-spacing-responsive-xxs);--sbb-alert-close-icon-margin: var(--sbb-spacing-responsive-xxxs)}:host([size=l]){--sbb-alert-icon-size: var(--sbb-size-icon-ui-small)}@media (min-width: 52.5rem){:host([size=l]){--sbb-alert-icon-size: 2.125rem}}.sbb-alert__transition-wrapper{display:grid;grid-template-rows:0fr;opacity:0}:host([data-state=opened]) .sbb-alert__transition-wrapper{grid-template-rows:1fr;opacity:1}:host([data-state=opening]) .sbb-alert__transition-wrapper{animation-name:open,open-opacity;animation-fill-mode:forwards;animation-duration:var(--sbb-alert-animation-duration);animation-timing-function:ease-in;animation-delay:0s,var(--sbb-alert-animation-duration)}.sbb-alert__transition-sub-wrapper{overflow:hidden}.sbb-alert{--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);display:grid;grid-template-columns:1fr auto;align-items:center;gap:var(--sbb-alert-gap);min-width:fit-content;padding:var(--sbb-alert-padding);overflow:hidden;color:var(--sbb-alert-color);background-color:var(--sbb-alert-background-color);border-radius:var(--sbb-alert-border-radius)}@media (min-width: 37.5rem){.sbb-alert{grid-template-columns:auto 1fr auto;align-items:flex-start}}.sbb-alert__icon{display:flex;align-items:start;padding-block:var(--sbb-spacing-fixed-1x);min-width:var(--sbb-alert-icon-size);--sbb-icon-svg-width: var(--sbb-alert-icon-size);--sbb-icon-svg-height: var(--sbb-alert-icon-size)}.sbb-alert__content{order:3;grid-column:1/3}@media (min-width: 37.5rem){.sbb-alert__content{order:initial;grid-column-start:initial;grid-column-end:initial}}.sbb-alert__content-slot{display:inline;margin:0;padding:0}.sbb-alert__title{margin:0}.sbb-alert__close-button-wrapper{display:flex;justify-content:flex-end;align-items:center;height:100%}@media (min-width: 37.5rem){.sbb-alert__close-button{margin-inline-start:var(--sbb-alert-close-icon-margin)}}.sbb-alert__close-button-divider{display:none}@media (min-width: 37.5rem){.sbb-alert__close-button-divider{display:block;height:calc(100% - var(--sbb-spacing-fixed-1x) * 2)}}@keyframes open{0%{grid-template-rows:0fr}to{grid-template-rows:1fr}}@keyframes open-opacity{0%{opacity:0}to{opacity:1}}`;
-var w = Object.defineProperty, x = Object.getOwnPropertyDescriptor, e = (s, n, l, o) => {
-  for (var a = o > 1 ? void 0 : o ? x(n, l) : n, b = s.length - 1, p; b >= 0; b--)
-    (p = s[b]) && (a = (o ? p(n, l, a) : p(a)) || a);
-  return o && a && w(n, l, a), a;
+const y = m`*,:before,:after{box-sizing:border-box}:host{display:block;--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);--sbb-alert-background-color: var(--sbb-color-midnight);--sbb-alert-border-radius: var(--sbb-border-radius-4x);--sbb-alert-color: var(--sbb-color-aluminium);--sbb-alert-padding: var(--sbb-spacing-responsive-xxs) var(--sbb-spacing-responsive-xs);--sbb-alert-icon-size: 1.25rem;--sbb-alert-close-icon-size: var(--sbb-size-icon-ui-small);--sbb-alert-close-icon-margin: var(--sbb-spacing-responsive-xxs);--sbb-alert-gap: var(--sbb-spacing-fixed-2x) var(--sbb-spacing-responsive-xs);--sbb-alert-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-6x) );--sbb-alert-timing-function: ease-in}@media (min-width: 52.5rem){:host{--sbb-alert-icon-size: 1.75rem}}@media (forced-colors: active){:host{outline:var(--sbb-border-width-1x) solid CanvasText;border-radius:var(--sbb-alert-border-radius)}}:host([data-state=opening]:not([animation=open],[animation=all])){--sbb-disable-animation-time: .1ms;--sbb-disable-animation-zero-time: 0s}:host([data-state=closing]:not([animation=close],[animation=all])){--sbb-disable-animation-time: .1ms;--sbb-disable-animation-zero-time: 0s}:host([size=s]){--sbb-alert-gap: var(--sbb-spacing-fixed-1x) var(--sbb-spacing-responsive-xxs);--sbb-alert-close-icon-margin: var(--sbb-spacing-responsive-xxxs)}:host([size=l]){--sbb-alert-icon-size: var(--sbb-size-icon-ui-small)}@media (min-width: 52.5rem){:host([size=l]){--sbb-alert-icon-size: 2.125rem}}.sbb-alert__transition-wrapper{display:grid;grid-template-rows:0fr;opacity:0}:host(:is([data-state=opened],[data-state=closing])) .sbb-alert__transition-wrapper{grid-template-rows:1fr;opacity:1}:host([data-state=opening]) .sbb-alert__transition-wrapper{animation-name:open,open-opacity;animation-fill-mode:forwards;animation-duration:var(--sbb-alert-animation-duration);animation-timing-function:var(--sbb-alert-timing-function);animation-delay:0s,var(--sbb-alert-animation-duration)}:host([data-state=closing]) .sbb-alert__transition-wrapper{animation-name:close-opacity,close;animation-fill-mode:forwards;animation-duration:var(--sbb-alert-animation-duration);animation-timing-function:var(--sbb-alert-timing-function);animation-delay:0s,var(--sbb-disable-animation-zero-time, var(--sbb-animation-duration-2x))}.sbb-alert__transition-sub-wrapper{overflow:hidden}.sbb-alert{--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);display:grid;grid-template-columns:1fr auto;align-items:center;gap:var(--sbb-alert-gap);min-width:fit-content;padding:var(--sbb-alert-padding);overflow:hidden;color:var(--sbb-alert-color);background-color:var(--sbb-alert-background-color);border-radius:var(--sbb-alert-border-radius)}@media (min-width: 37.5rem){.sbb-alert{grid-template-columns:auto 1fr auto;align-items:flex-start}}.sbb-alert__icon{display:flex;align-items:start;padding-block:var(--sbb-spacing-fixed-1x);min-width:var(--sbb-alert-icon-size);--sbb-icon-svg-width: var(--sbb-alert-icon-size);--sbb-icon-svg-height: var(--sbb-alert-icon-size)}.sbb-alert__content{order:3;grid-column:1/3}@media (min-width: 37.5rem){.sbb-alert__content{order:initial;grid-column-start:initial;grid-column-end:initial}}.sbb-alert__content-slot{display:inline;margin:0;padding:0}.sbb-alert__title{margin:0}.sbb-alert__close-button-wrapper{display:flex;justify-content:flex-end;align-items:center;height:100%}@media (min-width: 37.5rem){.sbb-alert__close-button{margin-inline-start:var(--sbb-alert-close-icon-margin)}}.sbb-alert__close-button-divider{display:none}@media (min-width: 37.5rem){.sbb-alert__close-button-divider{display:block;height:calc(100% - var(--sbb-spacing-fixed-1x) * 2)}}@keyframes open{0%{grid-template-rows:0fr}to{grid-template-rows:1fr}}@keyframes open-opacity{0%{opacity:0}to{opacity:1}}@keyframes close{0%{grid-template-rows:1fr}to{grid-template-rows:0fr}}@keyframes close-opacity{0%{opacity:1}to{opacity:0}}`;
+var w = Object.defineProperty, x = Object.getOwnPropertyDescriptor, e = (s, r, l, o) => {
+  for (var a = o > 1 ? void 0 : o ? x(r, l) : r, b = s.length - 1, d; b >= 0; b--)
+    (d = s[b]) && (a = (o ? d(r, l, a) : d(a)) || a);
+  return o && a && w(r, l, a), a;
 };
-let t = class extends f(v) {
+let t = class extends _(g) {
   constructor() {
-    super(...arguments), this.readonly = !1, this.size = "m", this.iconName = "info", this.titleLevel = "3", this.animation = "open", this._willOpen = new c(this, t.events.willOpen), this._didOpen = new c(this, t.events.didOpen), this._dismissalRequested = new c(
+    super(...arguments), this.readonly = !1, this.size = "m", this.iconName = "info", this.titleLevel = "3", this.animation = "all", this._dismissalRequested = new u(
       this,
       t.events.dismissalRequested
-    ), this._language = new u(this);
-  }
-  /** The state of the alert. */
-  get _state() {
-    return this.getAttribute("data-state") ?? "closed";
-  }
-  set _state(s) {
-    this.setAttribute("data-state", s);
+    ), this._language = new h(this);
   }
   async firstUpdated(s) {
-    super.firstUpdated(s), this._open();
+    super.firstUpdated(s), this.open();
   }
-  /** Requests dismissal of the alert. */
+  /** Requests dismissal of the alert.
+   * @deprecated in favour of 'willClose' and 'didClose' events
+   */
   requestDismissal() {
     this._dismissalRequested.emit();
   }
   /** Open the alert. */
-  _open() {
-    this._state = "opening", this._willOpen.emit();
+  open() {
+    this.willOpen.emit(), this.state = "opening";
+  }
+  /** Close the alert. */
+  close() {
+    this.willClose.emit() && (this.state = "closing");
   }
   _onAnimationEnd(s) {
-    this._state === "opening" && s.animationName === "open-opacity" && (this._state = "opened", this._didOpen.emit());
+    this.state === "opening" && s.animationName === "open-opacity" ? this._handleOpening() : this.state === "closing" && s.animationName === "close" && this._handleClosing();
+  }
+  _handleOpening() {
+    this.state = "opened", this.didOpen.emit();
+  }
+  _handleClosing() {
+    this.state = "closed", this.didClose.emit(), setTimeout(() => this.remove());
   }
   render() {
-    return d`
+    return p`
       <div class="sbb-alert__transition-wrapper" @animationend=${this._onAnimationEnd}>
         <!-- sub wrapper needed to properly support fade in animation -->
         <div class="sbb-alert__transition-sub-wrapper">
@@ -61,17 +67,17 @@ let t = class extends f(v) {
               <p class="sbb-alert__content-slot">
                 <slot></slot>
               </p>
-              ${this.href ? d` <sbb-link
-                    accessibility-label=${this.accessibilityLabel ?? r}
-                    href=${this.href ?? r}
-                    target=${this.target ?? r}
-                    rel=${this.rel ?? r}
+              ${this.href ? p` <sbb-link
+                    accessibility-label=${this.accessibilityLabel ?? n}
+                    href=${this.href ?? n}
+                    target=${this.target ?? n}
+                    rel=${this.rel ?? n}
                     negative
                   >
-                    ${this.linkContent ? this.linkContent : g[this._language.current]}
-                  </sbb-link>` : r}
+                    ${this.linkContent ? this.linkContent : v[this._language.current]}
+                  </sbb-link>` : n}
             </span>
-            ${this.readonly ? r : d`<span class="sbb-alert__close-button-wrapper">
+            ${this.readonly ? n : p`<span class="sbb-alert__close-button-wrapper">
                   <sbb-divider
                     orientation="vertical"
                     negative
@@ -82,7 +88,7 @@ let t = class extends f(v) {
                     size=${this.size === "l" ? "m" : this.size}
                     icon-name="cross-small"
                     @click=${() => this.requestDismissal()}
-                    aria-label=${_[this._language.current]}
+                    aria-label=${f[this._language.current]}
                     class="sbb-alert__close-button"
                   ></sbb-transparent-button>
                 </span>`}
@@ -96,6 +102,8 @@ t.styles = y;
 t.events = {
   willOpen: "willOpen",
   didOpen: "didOpen",
+  willClose: "willClose",
+  didClose: "didClose",
   dismissalRequested: "dismissalRequested"
 };
 e([
@@ -132,7 +140,7 @@ e([
   i({ reflect: !0 })
 ], t.prototype, "animation", 2);
 t = e([
-  h("sbb-alert")
+  c("sbb-alert")
 ], t);
 export {
   t as SbbAlertElement

package/autocomplete/autocomplete-base-element.d.ts

@@ -2,7 +2,6 @@ import { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
 import { SbbOpenCloseBaseElement } from '../core/base-elements.js';
 import { SbbConnectedAbortController } from '../core/controllers.js';
 import { SbbOptionBaseElement } from '../option.js';
-
 declare const SbbAutocompleteBaseElement_base: import('../core/mixins.js').AbstractConstructor<import('../core/mixins.js').SbbNegativeMixinType> & import('../core/mixins.js').AbstractConstructor<import('../core/mixins.js').SbbHydrationMixinType> & typeof SbbOpenCloseBaseElement;
 export declare abstract class SbbAutocompleteBaseElement extends SbbAutocompleteBaseElement_base {
     static styles: CSSResultGroup;

package/autocomplete/autocomplete.d.ts

@@ -1,6 +1,5 @@
 import { SbbOptionElement } from '../option.js';
 import { SbbAutocompleteBaseElement } from './autocomplete-base-element.js';
-
 /**
  * Combined with a native input, it displays a panel with a list of available options.
  *

package/autocomplete-grid/autocomplete-grid/autocomplete-grid.d.ts

@@ -1,6 +1,5 @@
 import { SbbAutocompleteBaseElement } from '../../autocomplete.js';
 import { SbbAutocompleteGridOptionElement } from '../autocomplete-grid-option.js';
-
 /**
  * Combined with a native input, it displays a panel with a list of available options with connected buttons.
  *

package/autocomplete-grid/autocomplete-grid-button/autocomplete-grid-button.d.ts

@@ -1,7 +1,6 @@
 import { CSSResultGroup, PropertyValues, TemplateResult } from 'lit';
 import { SbbActionBaseElement } from '../../core/base-elements.js';
 import { SbbAutocompleteGridOptionElement } from '../autocomplete-grid-option.js';
-
 declare const SbbAutocompleteGridButtonElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbNegativeMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../icon.js').SbbIconNameMixinType> & typeof SbbActionBaseElement;
 /**
  * It displays an icon-only button that can be used in `sbb-autocomplete-grid`.

package/autocomplete-grid/autocomplete-grid-cell/autocomplete-grid-cell.d.ts

@@ -1,5 +1,4 @@
 import { CSSResultGroup, LitElement, TemplateResult } from 'lit';
-
 /**
  * A wrapper component for autocomplete-grid action button.
  *

package/autocomplete-grid/autocomplete-grid-optgroup/autocomplete-grid-optgroup.d.ts

@@ -1,7 +1,6 @@
 import { SbbOptgroupBaseElement } from '../../option/optgroup.js';
 import { SbbAutocompleteGridOptionElement } from '../autocomplete-grid-option.js';
 import { SbbAutocompleteGridElement } from '../autocomplete-grid.js';
-
 /**
  * It can be used as a container for one or more `sbb-autocomplete-grid-option`.
  *

package/autocomplete-grid/autocomplete-grid-option/autocomplete-grid-option.d.ts

@@ -1,7 +1,6 @@
 import { CSSResultGroup, PropertyValues } from 'lit';
 import { EventEmitter } from '../../core/eventing.js';
 import { SbbOptionBaseElement } from '../../option.js';
-
 export declare const autocompleteGridOptionId: string;
 /**
  * It displays an option item which can be used in `sbb-autocomplete-grid`.

package/autocomplete-grid/autocomplete-grid-row/autocomplete-grid-row.d.ts

@@ -1,5 +1,4 @@
 import { CSSResultGroup, LitElement, TemplateResult } from 'lit';
-
 /**
  * The component is used as a wrapper for options and action buttons.
  *

package/autocomplete.js

@@ -8,7 +8,7 @@ import { ref as g } from "lit/directives/ref.js";
 import { SbbOpenCloseBaseElement as S } from "./core/base-elements.js";
 import { SbbConnectedAbortController as L } from "./core/controllers.js";
 import { SbbNegativeMixin as T, SbbHydrationMixin as $ } from "./core/mixins.js";
-const D = A`*,:before,:after{box-sizing:border-box}.sbb-gap-fix-wrapper{position:relative;overflow:hidden;width:var(--sbb-options-panel-border-radius);height:var(--sbb-options-panel-border-radius);background-color:transparent}.sbb-gap-fix-corner{position:absolute;border-radius:50%;border:calc(var(--sbb-options-panel-border-radius) / 2) solid var(--sbb-options-panel-background-color);width:calc(var(--sbb-options-panel-border-radius) * 3);height:calc(var(--sbb-options-panel-border-radius) * 3);bottom:calc(var(--sbb-options-panel-border-radius) / 2 * -1)}.sbb-gap-fix-corner#left{left:calc(var(--sbb-options-panel-border-radius) / 2 * -1)}:host([dir=rtl]) .sbb-gap-fix-corner#left{right:calc(var(--sbb-options-panel-border-radius) / 2 * -1);left:unset}.sbb-gap-fix-corner#right{right:calc(var(--sbb-options-panel-border-radius) / 2 * -1)}:host([dir=rtl]) .sbb-gap-fix-corner#right{left:calc(var(--sbb-options-panel-border-radius) / 2 * -1);right:unset}:host{--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: var(--sbb-color-black-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-black-alpha-60);--sbb-scrollbar-track-color: transparent;--sbb-options-panel-position-x: 0;--sbb-options-panel-position-y: 0;--sbb-options-panel-active-option-y: 0;--sbb-options-panel-max-height: calc(85vh - var(--sbb-spacing-fixed-8x));--sbb-options-panel-min-height: var(--sbb-options-panel-origin-height);--sbb-options-panel-visibility: visible;--sbb-options-panel-width: fit-content;--sbb-options-panel-border-radius: var(--sbb-border-radius-4x);--sbb-options-panel-options-border-radius: 0 0 var(--sbb-options-panel-border-radius) var(--sbb-options-panel-border-radius);--sbb-options-panel-animation-duration: var( --sbb-disable-animation-time, var(--sbb-animation-duration-4x) );--sbb-options-panel-animation-timing-function: ease;--sbb-options-panel-gap-fix-opacity: 0;--sbb-options-panel-gap-fix-transform: none;--sbb-options-panel-gap-fix-top: calc( var(--sbb-options-panel-position-y) - var(--sbb-options-panel-border-radius) );--sbb-options-panel-background-color: var(--sbb-color-white);--sbb-focus-outline-color: var(--sbb-focus-outline-color-default);--sbb-options-pointer-events: all;--sbb-options-panel-internal-z-index: var( --sbb-autocomplete-z-index, var(--sbb-overlay-default-z-index) );display:block}:host([negative]){--sbb-scrollbar-color: var(--sbb-color-white-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-white-alpha-60);--sbb-options-panel-background-color: var(--sbb-color-midnight);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark)}:host(:not([data-state])),:host([data-state=closed]){--sbb-options-panel-visibility: hidden;--sbb-options-pointer-events: none}:host([data-state=opening]){--sbb-options-panel-animation-name: open}:host([data-state=closing]){--sbb-options-panel-animation-name: close}:host([data-state=opened]),:host([data-state=opening]){--sbb-options-panel-gap-fix-opacity: 1}:host([data-options-panel-position=below]){--sbb-options-panel-animation-transform: translateY( calc((var(--sbb-options-panel-origin-height) / 2) * -1) )}:host([data-options-panel-position=above]){--sbb-options-panel-options-border-radius: var(--sbb-options-panel-border-radius) var(--sbb-options-panel-border-radius) 0 0;--sbb-options-panel-gap-fix-top: var(--sbb-options-panel-max-height);--sbb-options-panel-gap-fix-transform: rotate(180deg);--sbb-options-panel-animation-transform: translateY( calc(var(--sbb-options-panel-origin-height) / 2) )}:host([preserve-icon-space]){--sbb-option-icon-container-display: block}::slotted(sbb-divider){margin-block:var(--sbb-spacing-fixed-3x)}.sbb-autocomplete__container{position:fixed;pointer-events:none;top:0;right:0;bottom:0;left:0;z-index:var(--sbb-options-panel-internal-z-index)}.sbb-autocomplete__gap-fix{display:flex;justify-content:space-between;position:fixed;visibility:var(--sbb-options-panel-visibility);opacity:var(--sbb-options-panel-gap-fix-opacity);background-color:transparent;width:var(--sbb-options-panel-width);height:var(--sbb-options-panel-border-radius);top:var(--sbb-options-panel-gap-fix-top);left:var(--sbb-options-panel-position-x);transform:var(--sbb-options-panel-gap-fix-transform);transition:opacity var(--sbb-options-panel-animation-duration) var(--sbb-options-panel-animation-timing-function)}.sbb-autocomplete__panel{display:block;position:absolute;visibility:var(--sbb-options-panel-visibility);overflow:hidden;background-color:transparent;border:none;border-radius:var(--sbb-options-panel-border-radius);top:var(--sbb-options-panel-position-y);left:var(--sbb-options-panel-position-x);width:var(--sbb-options-panel-width);transition:box-shadow var(--sbb-options-panel-animation-duration) var(--sbb-options-panel-animation-timing-function)}.sbb-autocomplete__panel:before,.sbb-autocomplete__panel:after{content:"";display:none;position:relative;width:100%;height:var(--sbb-options-panel-origin-height);background-color:transparent;border-radius:var(--sbb-options-panel-border-radius);pointer-events:none;transition:box-shadow var(--sbb-options-panel-animation-duration) var(--sbb-options-panel-animation-timing-function);z-index:1}:host([data-options-panel-position=below]) .sbb-autocomplete__panel{inset-block-start:calc(var(--sbb-options-panel-position-y) - var(--sbb-options-panel-origin-height))}:host(:is([data-state=opened],[data-state=opening])) .sbb-autocomplete__panel{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)}:host(:is([data-state=opened],[data-state=opening])[negative]) .sbb-autocomplete__panel{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-negative-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-negative-1-color)}:host([data-options-panel-position=below]) .sbb-autocomplete__panel:before{display:block}:host([data-options-panel-position=above]) .sbb-autocomplete__panel:after{display:block}:host(:is([data-state=opened],[data-state=opening])[data-option-panel-origin-borderless]) .sbb-autocomplete__panel:before,:host(:is([data-state=opened],[data-state=opening])[data-option-panel-origin-borderless]) .sbb-autocomplete__panel:after{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)}:host(:is([data-state=opened],[data-state=opening])[data-option-panel-origin-borderless][negative]) .sbb-autocomplete__panel:before,:host(:is([data-state=opened],[data-state=opening])[data-option-panel-origin-borderless][negative]) .sbb-autocomplete__panel:after{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-negative-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-negative-1-color)}.sbb-autocomplete__wrapper{overflow:hidden}.sbb-autocomplete__options{--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x);background-color:var(--sbb-options-panel-background-color);padding-block:var(--sbb-spacing-fixed-3x);padding-inline:0;border-radius:var(--sbb-options-panel-options-border-radius);max-height:var(--sbb-options-panel-max-height);min-height:var(--sbb-options-panel-min-height);pointer-events:all;overflow-y:auto;animation-name:var(--sbb-options-panel-animation-name);animation-duration:var(--sbb-options-panel-animation-duration);animation-timing-function:var(--sbb-options-panel-animation-timing-function);pointer-events:var(--sbb-options-pointer-events)}.sbb-autocomplete__options::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-autocomplete__options::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-autocomplete__options::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-autocomplete__options::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-autocomplete__options::-webkit-scrollbar-button,.sbb-autocomplete__options::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-autocomplete__options{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}@media (forced-colors: active){.sbb-autocomplete__options{border:var(--sbb-border-width-1x) solid CanvasText;border-top:none}}@keyframes open{0%{transform:var(--sbb-options-panel-animation-transform);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes close{0%{transform:translateY(0);opacity:1}to{transform:var(--sbb-options-panel-animation-transform);opacity:0}}`;
+const D = A`*,:before,:after{box-sizing:border-box}.sbb-gap-fix-wrapper{position:relative;overflow:hidden;width:var(--sbb-options-panel-border-radius);height:var(--sbb-options-panel-border-radius);background-color:transparent}.sbb-gap-fix-corner{position:absolute;border-radius:50%;border:calc(var(--sbb-options-panel-border-radius) / 2) solid var(--sbb-options-panel-background-color);width:calc(var(--sbb-options-panel-border-radius) * 3);height:calc(var(--sbb-options-panel-border-radius) * 3);bottom:calc(var(--sbb-options-panel-border-radius) / 2 * -1)}.sbb-gap-fix-corner#left{left:calc(var(--sbb-options-panel-border-radius) / 2 * -1)}:host([dir=rtl]) .sbb-gap-fix-corner#left{right:calc(var(--sbb-options-panel-border-radius) / 2 * -1);left:unset}.sbb-gap-fix-corner#right{right:calc(var(--sbb-options-panel-border-radius) / 2 * -1)}:host([dir=rtl]) .sbb-gap-fix-corner#right{left:calc(var(--sbb-options-panel-border-radius) / 2 * -1);right:unset}:host{--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: var(--sbb-color-black-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-black-alpha-60);--sbb-scrollbar-track-color: transparent;--sbb-options-panel-position-x: 0;--sbb-options-panel-position-y: 0;--sbb-options-panel-active-option-y: 0;--sbb-options-panel-max-height: calc(85vh - var(--sbb-spacing-fixed-8x));--sbb-options-panel-min-height: var(--sbb-options-panel-origin-height);--sbb-options-panel-visibility: visible;--sbb-options-panel-width: fit-content;--sbb-options-panel-border-radius: var(--sbb-border-radius-4x);--sbb-options-panel-options-border-radius: 0 0 var(--sbb-options-panel-border-radius) var(--sbb-options-panel-border-radius);--sbb-options-panel-animation-duration: var( --sbb-disable-animation-time, var(--sbb-animation-duration-4x) );--sbb-options-panel-animation-timing-function: ease;--sbb-options-panel-gap-fix-opacity: 0;--sbb-options-panel-gap-fix-transform: none;--sbb-options-panel-gap-fix-top: calc( var(--sbb-options-panel-position-y) - var(--sbb-options-panel-border-radius) );--sbb-options-panel-background-color: var(--sbb-color-white);--sbb-focus-outline-color: var(--sbb-focus-outline-color-default);--sbb-options-pointer-events: all;--sbb-options-panel-internal-z-index: var( --sbb-autocomplete-z-index, var(--sbb-overlay-default-z-index) );display:block}:host([negative]){--sbb-scrollbar-color: var(--sbb-color-white-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-white-alpha-60);--sbb-options-panel-background-color: var(--sbb-color-midnight);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark)}:host(:not([data-state])),:host([data-state=closed]){--sbb-options-panel-visibility: hidden;--sbb-options-pointer-events: none}:host([data-state=opening]){--sbb-options-panel-animation-name: open}:host([data-state=closing]){--sbb-options-panel-animation-name: close}:host([data-state=opened]),:host([data-state=opening]){--sbb-options-panel-gap-fix-opacity: 1}:host([data-options-panel-position=below]){--sbb-options-panel-animation-transform: translateY( calc((var(--sbb-options-panel-origin-height) / 2) * -1) )}:host([data-options-panel-position=above]){--sbb-options-panel-options-border-radius: var(--sbb-options-panel-border-radius) var(--sbb-options-panel-border-radius) 0 0;--sbb-options-panel-gap-fix-top: var(--sbb-options-panel-max-height);--sbb-options-panel-gap-fix-transform: rotate(180deg);--sbb-options-panel-animation-transform: translateY( calc(var(--sbb-options-panel-origin-height) / 2) )}:host([preserve-icon-space]){--sbb-option-icon-container-display: block}::slotted(sbb-divider){margin-block:var(--sbb-spacing-fixed-3x)}.sbb-autocomplete__container{position:fixed;pointer-events:none;top:0;right:0;bottom:0;left:0;z-index:var(--sbb-options-panel-internal-z-index)}.sbb-autocomplete__gap-fix{display:flex;justify-content:space-between;position:fixed;visibility:var(--sbb-options-panel-visibility);opacity:var(--sbb-options-panel-gap-fix-opacity);background-color:transparent;width:var(--sbb-options-panel-width);height:var(--sbb-options-panel-border-radius);top:var(--sbb-options-panel-gap-fix-top);left:var(--sbb-options-panel-position-x);transform:var(--sbb-options-panel-gap-fix-transform);transition:opacity var(--sbb-options-panel-animation-duration) var(--sbb-options-panel-animation-timing-function)}.sbb-autocomplete__panel{display:block;position:absolute;visibility:var(--sbb-options-panel-visibility);overflow:hidden;background-color:transparent;border:none;border-radius:var(--sbb-options-panel-border-radius);top:var(--sbb-options-panel-position-y);left:var(--sbb-options-panel-position-x);width:var(--sbb-options-panel-width);transition:box-shadow var(--sbb-options-panel-animation-duration) var(--sbb-options-panel-animation-timing-function)}.sbb-autocomplete__panel:before,.sbb-autocomplete__panel:after{content:"";display:none;position:relative;width:100%;height:var(--sbb-options-panel-origin-height);background-color:transparent;border-radius:var(--sbb-options-panel-border-radius);pointer-events:none;transition:box-shadow var(--sbb-options-panel-animation-duration) var(--sbb-options-panel-animation-timing-function);z-index:1}:host([data-options-panel-position=below]) .sbb-autocomplete__panel{inset-block-start:calc(var(--sbb-options-panel-position-y) - var(--sbb-options-panel-origin-height))}:host(:is([data-state=opened],[data-state=opening])) .sbb-autocomplete__panel{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)}:host(:is([data-state=opened],[data-state=opening])[negative]) .sbb-autocomplete__panel{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-negative-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-negative-1-color)}:host([data-options-panel-position=below]) .sbb-autocomplete__panel:before{display:block}:host([data-options-panel-position=above]) .sbb-autocomplete__panel:after{display:block}:host(:is([data-state=opened],[data-state=opening])[data-option-panel-origin-borderless]) .sbb-autocomplete__panel:before,:host(:is([data-state=opened],[data-state=opening])[data-option-panel-origin-borderless]) .sbb-autocomplete__panel:after{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)}:host(:is([data-state=opened],[data-state=opening])[data-option-panel-origin-borderless][negative]) .sbb-autocomplete__panel:before,:host(:is([data-state=opened],[data-state=opening])[data-option-panel-origin-borderless][negative]) .sbb-autocomplete__panel:after{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-negative-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-negative-1-color)}.sbb-autocomplete__wrapper{overflow:hidden}.sbb-autocomplete__options{background-color:var(--sbb-options-panel-background-color);padding-block:var(--sbb-spacing-fixed-3x);padding-inline:0;border-radius:var(--sbb-options-panel-options-border-radius);max-height:var(--sbb-options-panel-max-height);min-height:var(--sbb-options-panel-min-height);pointer-events:all;overflow-y:auto;animation-name:var(--sbb-options-panel-animation-name);animation-duration:var(--sbb-options-panel-animation-duration);animation-timing-function:var(--sbb-options-panel-animation-timing-function);--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-autocomplete__options::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-autocomplete__options::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-autocomplete__options::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-autocomplete__options::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-autocomplete__options::-webkit-scrollbar-button,.sbb-autocomplete__options::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-autocomplete__options{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-autocomplete__options{pointer-events:var(--sbb-options-pointer-events)}@media (forced-colors: active){.sbb-autocomplete__options{border:var(--sbb-border-width-1x) solid CanvasText;border-top:none}}@keyframes open{0%{transform:var(--sbb-options-panel-animation-transform);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes close{0%{transform:translateY(0);opacity:1}to{transform:var(--sbb-options-panel-animation-transform);opacity:0}}`;
 var N = Object.defineProperty, d = (o, e, t, i) => {
   for (var s = void 0, a = o.length - 1, n; a >= 0; a--)
     (n = o[a]) && (s = n(e, t, s) || s);

package/breadcrumb/breadcrumb/breadcrumb.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup, TemplateResult } from 'lit';
 import { SbbLinkBaseElement } from '../../core/base-elements.js';
-
 declare const SbbBreadcrumbElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../icon.js').SbbIconNameMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbHydrationMixinType> & typeof SbbLinkBaseElement;
 /**
  * It displays a link to a page; used within a `sbb-breadcrumb-group` it can display the path to the current page.

package/breadcrumb/breadcrumb-group/breadcrumb-group.d.ts

@@ -1,7 +1,6 @@
 import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
 import { WithListChildren } from '../../core/mixins.js';
 import { SbbBreadcrumbElement } from '../breadcrumb.js';
-
 declare const SbbBreadcrumbGroupElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbNamedSlotListMixinType<SbbBreadcrumbElement>> & typeof LitElement;
 /**
  * It can be used as a container for one or more `sbb-breadcrumb` component.

package/breadcrumb/breadcrumb-group.js

@@ -115,10 +115,10 @@ let l = class extends k(u) {
     `;
   }
   _renderExpanded() {
-    return this.listSlotNames().map(
+    return this.listSlotEntries().map(
       (e, r, t) => b`
         <li class="sbb-breadcrumb-group__item">
-          <slot name=${e}></slot>
+          <slot name=${e.name}></slot>
           ${r !== t.length - 1 ? b`<sbb-icon
                 name="chevron-small-right-small"
                 class="sbb-breadcrumb-group__divider-icon"

package/breadcrumb/breadcrumb.js

@@ -4,13 +4,13 @@ import { SbbLinkBaseElement as m } from "../core/base-elements.js";
 import { SbbHydrationMixin as u } from "../core/mixins.js";
 import { SbbIconNameMixin as f } from "../icon.js";
 import { css as h } from "lit";
-const v = h`*,:before,:after{box-sizing:border-box}:host{display:flex;--sbb-breadcrumb-color: var(--sbb-color-granite)}@media (any-hover: hover){:host(:hover){--sbb-breadcrumb-color: var(--sbb-color-charcoal)}}:host(:is(:active,[data-active])){--sbb-breadcrumb-color: var(--sbb-color-anthracite)}.sbb-breadcrumb{--sbb-link-text-decoration: none;--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);color:var(--sbb-link-color-normal);text-decoration:var(--sbb-link-text-decoration, underline);-webkit-user-select:none;user-select:none;display:flex;cursor:pointer;gap:var(--sbb-spacing-fixed-2x);color:var(--sbb-breadcrumb-color);align-items:center;overflow:hidden;outline:none}@media (forced-colors: active){.sbb-breadcrumb{text-decoration:underline}}@media (forced-colors: active){.sbb-breadcrumb{--sbb-breadcrumb-color: ButtonText}}:host(:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-breadcrumb:focus-visible{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width);border-radius:var(--sbb-border-radius-2x)}.sbb-breadcrumb__label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}slot[name=icon] .sbb-breadcrumb__icon,slot[name=icon] ::slotted(*){flex-shrink:0}`;
-var p = Object.defineProperty, x = Object.getOwnPropertyDescriptor, n = (r, e, b, t) => {
-  for (var o = t > 1 ? void 0 : t ? x(e, b) : e, a = r.length - 1, i; a >= 0; a--)
-    (i = r[a]) && (o = (t ? i(e, b, o) : i(o)) || o);
-  return t && o && p(e, b, o), o;
+const v = h`*,:before,:after{box-sizing:border-box}:host{display:flex;--sbb-breadcrumb-color: var(--sbb-color-granite)}@media (any-hover: hover){:host(:hover){--sbb-breadcrumb-color: var(--sbb-color-charcoal)}}:host(:is(:active,[data-active])){--sbb-breadcrumb-color: var(--sbb-color-anthracite)}.sbb-breadcrumb{--sbb-link-text-decoration: none;--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);color:var(--sbb-link-color-normal);text-decoration:var(--sbb-link-text-decoration, underline);-webkit-user-select:none;user-select:none}@media (forced-colors: active){.sbb-breadcrumb{text-decoration:underline}}.sbb-breadcrumb{display:flex;cursor:pointer;gap:var(--sbb-spacing-fixed-2x);color:var(--sbb-breadcrumb-color);align-items:center;overflow:hidden;outline:none}@media (forced-colors: active){.sbb-breadcrumb{--sbb-breadcrumb-color: ButtonText}}:host(:not([data-focus-origin=mouse],[data-focus-origin=touch])) .sbb-breadcrumb:focus-visible{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width);border-radius:var(--sbb-border-radius-2x)}.sbb-breadcrumb__label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}slot[name=icon] .sbb-breadcrumb__icon,slot[name=icon] ::slotted(*){flex-shrink:0}`;
+var p = Object.defineProperty, x = Object.getOwnPropertyDescriptor, n = (r, e, s, t) => {
+  for (var o = t > 1 ? void 0 : t ? x(e, s) : e, a = r.length - 1, i; a >= 0; a--)
+    (i = r[a]) && (o = (t ? i(e, s, o) : i(o)) || o);
+  return t && o && p(e, s, o), o;
 };
-let s = class extends f(u(m)) {
+let b = class extends f(u(m)) {
   constructor() {
     super(...arguments), this._hasText = !1;
   }
@@ -31,13 +31,13 @@ let s = class extends f(u(m)) {
     `;
   }
 };
-s.styles = v;
+b.styles = v;
 n([
   l()
-], s.prototype, "_hasText", 2);
-s = n([
+], b.prototype, "_hasText", 2);
+b = n([
   c("sbb-breadcrumb")
-], s);
+], b);
 export {
-  s as SbbBreadcrumbElement
+  b as SbbBreadcrumbElement
 };

package/button/button/button.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup } from 'lit';
 import { SbbButtonBaseElement } from '../../core/base-elements.js';
-
 declare const SbbButtonElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbButtonCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbButtonBaseElement;
 /**
  * It displays a button enhanced with the SBB Design in the 'primary' variant.

package/button/button-link/button-link.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup } from 'lit';
 import { SbbLinkBaseElement } from '../../core/base-elements.js';
-
 declare const SbbButtonLinkElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbButtonCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbLinkBaseElement;
 /**
  * It displays a button enhanced with the SBB Design in the 'primary' variant, which will behave as a link.

package/button/button-static/button-static.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup } from 'lit';
 import { SbbActionBaseElement } from '../../core/base-elements.js';
-
 declare const SbbButtonStaticElement_base: import('../../core/mixins.js').AbstractConstructor<import('../common.js').SbbButtonCommonElementMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbActionBaseElement;
 /**
  * It displays a static button enhanced with the SBB Design in the 'primary' variant.

package/button/common/button-common.d.ts

@@ -1,7 +1,6 @@
 import { SbbActionBaseElement } from '../../core/base-elements.js';
 import { AbstractConstructor, SbbDisabledMixinType, SbbNegativeMixinType } from '../../core/mixins.js';
 import { SbbIconNameMixinType } from '../../icon.js';
-
 export type SbbButtonCommonElement = SbbButtonCommonElementMixinType & SbbActionBaseElement;
 export type SbbButtonSize = 'l' | 'm' | 's';
 export declare class SbbButtonCommonElementMixinType implements SbbNegativeMixinType, Partial<SbbDisabledMixinType>, Partial<SbbIconNameMixinType> {

package/button/mini-button/mini-button-base-element.d.ts

@@ -1,6 +1,5 @@
 import { TemplateResult } from 'lit';
 import { SbbButtonBaseElement } from '../../core/base-elements.js';
-
 declare const SbbMiniButtonBaseElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbNegativeMixinType> & import('../../core/mixins.js').AbstractConstructor<import('../../icon.js').SbbIconNameMixinType> & typeof SbbButtonBaseElement;
 export declare abstract class SbbMiniButtonBaseElement extends SbbMiniButtonBaseElement_base {
     protected renderTemplate(): TemplateResult;

package/button/mini-button/mini-button.d.ts

@@ -1,6 +1,5 @@
 import { CSSResultGroup } from 'lit';
 import { SbbMiniButtonBaseElement } from './mini-button-base-element.js';
-
 declare const SbbMiniButtonElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbDisabledMixinType> & typeof SbbMiniButtonBaseElement;
 /**
  * It displays an icon-only button enhanced with the SBB Design;