@sbb-esta/lyne-elements 1.12.1 → 1.14.0

package/breadcrumb/breadcrumb/breadcrumb.d.ts

@@ -9,7 +9,7 @@ declare const SbbBreadcrumbElement_base: import('../../core/mixins.js').Abstract
  */
 export declare class SbbBreadcrumbElement extends SbbBreadcrumbElement_base {
     static styles: CSSResultGroup;
-    private _hasText;
+    private accessor _hasText;
     private _handleSlotchange;
     protected renderTemplate(): TemplateResult;
 }

package/breadcrumb/breadcrumb/breadcrumb.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumb.d.ts","sourceRoot":"","sources":["../../../../src/elements/breadcrumb/breadcrumb/breadcrumb.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAI1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;;AAMjE;;;;;GAKG;AACH,qBACa,oBAAqB,SAAQ,yBAAuD;IAC/F,OAAuB,MAAM,EAAE,cAAc,CAAS;IAE7C,OAAO,CAAC,QAAQ,CAAS;IAElC,OAAO,CAAC,iBAAiB;cAMN,cAAc,IAAI,cAAc;CAQpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,gBAAgB,EAAE,oBAAoB,CAAC;KACxC;CACF"}
+{"version":3,"file":"breadcrumb.d.ts","sourceRoot":"","sources":["../../../../src/elements/breadcrumb/breadcrumb/breadcrumb.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAI1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;;AAMjE;;;;;GAKG;AACH,qBAEM,oBAAqB,SAAQ,yBAAuD;IACxF,OAAuB,MAAM,EAAE,cAAc,CAAS;IAE7C,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAS;IAE3C,OAAO,CAAC,iBAAiB;cAMN,cAAc,IAAI,cAAc;CAQpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,gBAAgB,EAAE,oBAAoB,CAAC;KACxC;CACF"}

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

@@ -1 +1 @@
-{"version":3,"file":"breadcrumb-group.d.ts","sourceRoot":"","sources":["../../../../src/elements/breadcrumb/breadcrumb-group/breadcrumb-group.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EAEV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAYb,OAAO,EAAyB,KAAK,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACpF,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAI7D,OAAO,eAAe,CAAC;;AAIvB;;;;GAIG;AACH,qBAIa,yBAA0B,SAAQ,8BAGlC;IACX,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,mBAA4B,mBAAmB,WAAsB;IAIrE,OAAO,KAAK,MAAM,QAEjB;IACD,OAAO,KAAK,MAAM,GAEjB;IAED,OAAO,CAAC,eAAe,CAIpB;IACH,OAAO,CAAC,MAAM,CAAyC;IACvD,OAAO,CAAC,SAAS,CAAmC;IACpD,OAAO,CAAC,aAAa,CAAS;IAE9B,OAAO,CAAC,cAAc;IAiBN,iBAAiB,IAAI,IAAI;cAMtB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAO3D,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,GAAG,IAAI;cAQ3E,OAAO,CAAC,iBAAiB,EAAE,cAAc,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,GAAG,IAAI;IAa3F,2EAA2E;IAC3E,OAAO,CAAC,gBAAgB;IAaxB;;OAEG;IACH,OAAO,CAAC,mBAAmB;IAS3B,OAAO,CAAC,UAAU;IAYlB;;;OAGG;IACH,OAAO,CAAC,kBAAkB;IAK1B,kGAAkG;IAClG,OAAO,CAAC,uBAAuB;IAY/B,OAAO,CAAC,gBAAgB;IA8BxB,OAAO,CAAC,eAAe;cAgBJ,MAAM,IAAI,cAAc;CAQ5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,sBAAsB,EAAE,yBAAyB,CAAC;KACnD;CACF"}
+{"version":3,"file":"breadcrumb-group.d.ts","sourceRoot":"","sources":["../../../../src/elements/breadcrumb/breadcrumb-group/breadcrumb-group.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EAEV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAYb,OAAO,EAAyB,KAAK,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACpF,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAI7D,OAAO,eAAe,CAAC;;AAIvB;;;;GAIG;AACH,qBAKM,yBAA0B,SAAQ,8BAG3B;IACX,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,mBAA4B,mBAAmB,WAAsB;IAIrE,OAAO,KAAK,MAAM,QAEjB;IACD,OAAO,KAAK,MAAM,GAEjB;IAED,OAAO,CAAC,eAAe,CAIpB;IACH,OAAO,CAAC,MAAM,CAAyC;IACvD,OAAO,CAAC,SAAS,CAAmC;IACpD,OAAO,CAAC,aAAa,CAAS;IAE9B,OAAO,CAAC,cAAc;IAiBN,iBAAiB,IAAI,IAAI;cAMtB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAO3D,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,GAAG,IAAI;cAQ3E,OAAO,CAAC,iBAAiB,EAAE,cAAc,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,GAAG,IAAI;IAa3F,2EAA2E;IAC3E,OAAO,CAAC,gBAAgB;IAaxB;;OAEG;IACH,OAAO,CAAC,mBAAmB;IAS3B,OAAO,CAAC,UAAU;IAYlB;;;OAGG;IACH,OAAO,CAAC,kBAAkB;IAK1B,kGAAkG;IAClG,OAAO,CAAC,uBAAuB;IAY/B,OAAO,CAAC,gBAAgB;IA8BxB,OAAO,CAAC,eAAe;cAgBJ,MAAM,IAAI,cAAc;CAQ5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,sBAAsB,EAAE,yBAAyB,CAAC;KACnD;CACF"}

package/breadcrumb/breadcrumb-group.js

@@ -1,93 +1,92 @@
-import { ResizeController as c } from "@lit-labs/observers/resize-controller.js";
-import { css as u, LitElement as h, html as b, nothing as p } from "lit";
-import { state as m, customElement as g } from "lit/decorators.js";
-import { isArrowKeyPressed as f, sbbInputModalityDetector as v, getNextElementIndex as _ } from "../core/a11y.js";
-import { SbbConnectedAbortController as x, SbbLanguageController as C } from "../core/controllers.js";
-import { hostAttributes as y } from "../core/decorators.js";
-import { setOrRemoveAttribute as w } from "../core/dom.js";
-import { i18nBreadcrumbEllipsisButtonLabel as k } from "../core/i18n.js";
-import { SbbNamedSlotListMixin as z } from "../core/mixins.js";
+import { __runInitializers as h, __esDecorate as m } from "tslib";
+import { ResizeController as f } from "@lit-labs/observers/resize-controller.js";
+import { css as v, LitElement as x, html as a, nothing as y } from "lit";
+import { customElement as C, state as w } from "lit/decorators.js";
+import { isArrowKeyPressed as k, sbbInputModalityDetector as z, getNextElementIndex as S } from "../core/a11y.js";
+import { SbbConnectedAbortController as E, SbbLanguageController as A } from "../core/controllers.js";
+import { hostAttributes as B } from "../core/decorators.js";
+import { setOrRemoveAttribute as D } from "../core/dom.js";
+import { i18nBreadcrumbEllipsisButtonLabel as I } from "../core/i18n.js";
+import { SbbNamedSlotListMixin as N } from "../core/mixins.js";
 import "../icon.js";
-const E = u`*,:before,:after{box-sizing:border-box}:host{--sbb-breadcrumb-group-wrap: nowrap;--sbb-breadcrumb-group-visibility: hidden;display:block}:host([data-loaded]){--sbb-breadcrumb-group-visibility: visible}:host([data-state]){--sbb-breadcrumb-group-wrap: wrap}.sbb-breadcrumb-group{list-style:none;margin:0;padding:0;font-size:inherit;display:flex;flex-wrap:var(--sbb-breadcrumb-group-wrap);column-gap:var(--sbb-spacing-fixed-1x);visibility:var(--sbb-breadcrumb-group-visibility)}.sbb-breadcrumb-group__item{flex:0 0 auto;display:flex;column-gap:var(--sbb-spacing-fixed-1x)}.sbb-breadcrumb-group__divider-icon{color:var(--sbb-color-granite)}#sbb-breadcrumb-ellipsis{--sbb-breadcrumb-group-ellipsis-color: var(--sbb-color-granite);--sbb-breadcrumb-group-ellipsis-background-color: transparent;--sbb-breadcrumb-group-ellipsis-border-width: var(--sbb-border-width-1x);--sbb-breadcrumb-group-ellipsis-border-color: var(--sbb-color-silver);-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;margin:0;outline:none;border:none;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;--sbb-text-font-size: var(--sbb-font-size-text-xxs);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);line-height:0;letter-spacing:.01em;width:var(--sbb-size-icon-ui-small);height:var(--sbb-size-icon-ui-small);border:var(--sbb-breadcrumb-group-ellipsis-border-width) solid var(--sbb-breadcrumb-group-ellipsis-border-color);border-radius:50%;padding-block-end:.5em;cursor:pointer;color:var(--sbb-breadcrumb-group-ellipsis-color);background-color:var(--sbb-breadcrumb-group-ellipsis-background-color);overflow:hidden}@media (forced-colors: active){#sbb-breadcrumb-ellipsis{--sbb-breadcrumb-group-ellipsis-border-width: var(--sbb-border-width-2x);--sbb-breadcrumb-group-ellipsis-border-color: CanvasText}}@media (any-hover: hover){#sbb-breadcrumb-ellipsis:hover{--sbb-breadcrumb-group-ellipsis-color: var(--sbb-color-charcoal);--sbb-breadcrumb-group-ellipsis-background-color: var(--sbb-color-milk)}}@media (any-hover: hover) and (forced-colors: active){#sbb-breadcrumb-ellipsis:hover{--sbb-breadcrumb-group-ellipsis-border-color: Highlight}}#sbb-breadcrumb-ellipsis:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch]){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}`;
-var S = Object.defineProperty, A = Object.getOwnPropertyDescriptor, d = (e, r, t, i) => {
-  for (var s = i > 1 ? void 0 : i ? A(r, t) : r, o = e.length - 1, a; o >= 0; o--)
-    (a = e[o]) && (s = (i ? a(r, t, s) : a(s)) || s);
-  return i && s && S(r, t, s), s;
-};
-const n = 3;
-let l = class extends z(h) {
-  constructor() {
-    super(...arguments), this.listChildLocalNames = ["sbb-breadcrumb"], this._resizeObserver = new c(this, {
-      target: null,
-      skipInitial: !0,
-      callback: () => this._evaluateCollapsedState()
-    }), this._abort = new x(this), this._language = new C(this), this._markForFocus = !1;
-  }
-  set _state(e) {
-    w(this, "data-state", e);
-  }
-  get _state() {
-    return this.getAttribute("data-state");
-  }
-  _handleKeyDown(e) {
-    if (!(!this.listChildren.length || // don't trap nested handling
-    e.target !== this && e.target.parentElement !== this) && f(e)) {
-      if (this._state === "collapsed")
-        return this._focusNextCollapsed(e);
-      this._focusNext(e);
-    }
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    const e = this._abort.signal;
-    this.addEventListener("keydown", (r) => this._handleKeyDown(r), { signal: e });
-  }
-  firstUpdated(e) {
-    super.firstUpdated(e), this._resizeObserver.observe(this), this.toggleAttribute("data-loaded", !0);
-  }
-  willUpdate(e) {
-    super.willUpdate(e), e.has("listChildren") && this._syncBreadcrumbs();
-  }
-  updated(e) {
-    var r;
-    super.updated(e), e.has("listChildren") && Promise.resolve().then(() => this._evaluateCollapsedState()), this._markForFocus && v.mostRecentModality === "keyboard" && ((r = this.listChildren[1]) == null || r.focus(), this._markForFocus = !1);
-  }
-  /** Apply the aria-current attribute to the last sbb-breadcrumb element. */
-  _syncBreadcrumbs() {
-    var e;
-    this.listChildren.slice(0, -1).filter((r) => r.hasAttribute("aria-current")).forEach((r) => r.removeAttribute("aria-current")), (e = this.listChildren[this.listChildren.length - 1]) == null || e.setAttribute("aria-current", "page"), this.listChildren.length < n && (this._state = null);
-  }
-  /**
-   * Sets the focus on the correct element when the ellipsis breadcrumb is displayed and the user is navigating with keyboard's arrows.
-   */
-  _focusNextCollapsed(e) {
-    const r = [
-      this.listChildren[0],
-      this.shadowRoot.querySelector("#sbb-breadcrumb-ellipsis"),
-      this.listChildren[this.listChildren.length - 1]
-    ];
-    this._focusNext(e, r);
-  }
-  _focusNext(e, r = this.listChildren) {
-    var s;
-    const t = r.findIndex(
-      (o) => o === document.activeElement || o === this.shadowRoot.activeElement
-    ), i = _(e, t, r.length);
-    (s = r[i]) == null || s.focus(), e.preventDefault();
-  }
-  /**
-   * Note: due to @State annotation on _state, this method triggers a new render; as a consequence, the focus is moved
-   * to the `body`, so if the ellipsis element has focus, it's asynchronously forced to the first element.
-   */
-  _expandBreadcrumbs() {
-    this._state = "manually-expanded", this._markForFocus = !0;
-  }
-  /** Evaluate if the expanded breadcrumb element fits in page width, otherwise it needs ellipsis */
-  _evaluateCollapsedState() {
-    !this._state && this.scrollWidth > this.offsetWidth && this.listChildren.length >= n && (this._state = "collapsed", this._resizeObserver.hostDisconnected(), this.removeController(this._resizeObserver));
-  }
-  _renderCollapsed() {
-    return b`
+const O = v`*,:before,:after{box-sizing:border-box}:host{--sbb-breadcrumb-group-wrap: nowrap;--sbb-breadcrumb-group-visibility: hidden;display:block}:host([data-loaded]){--sbb-breadcrumb-group-visibility: visible}:host([data-state]){--sbb-breadcrumb-group-wrap: wrap}.sbb-breadcrumb-group{list-style:none;margin:0;padding:0;font-size:inherit;display:flex;flex-wrap:var(--sbb-breadcrumb-group-wrap);column-gap:var(--sbb-spacing-fixed-1x);visibility:var(--sbb-breadcrumb-group-visibility)}.sbb-breadcrumb-group__item{flex:0 0 auto;display:flex;column-gap:var(--sbb-spacing-fixed-1x)}.sbb-breadcrumb-group__divider-icon{color:var(--sbb-color-granite)}#sbb-breadcrumb-ellipsis{--sbb-breadcrumb-group-ellipsis-color: var(--sbb-color-granite);--sbb-breadcrumb-group-ellipsis-background-color: transparent;--sbb-breadcrumb-group-ellipsis-border-width: var(--sbb-border-width-1x);--sbb-breadcrumb-group-ellipsis-border-color: var(--sbb-color-silver);-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;margin:0;outline:none;border:none;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;--sbb-text-font-size: var(--sbb-font-size-text-xxs);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);line-height:0;letter-spacing:.01em;width:var(--sbb-size-icon-ui-small);height:var(--sbb-size-icon-ui-small);border:var(--sbb-breadcrumb-group-ellipsis-border-width) solid var(--sbb-breadcrumb-group-ellipsis-border-color);border-radius:50%;padding-block-end:.5em;cursor:pointer;color:var(--sbb-breadcrumb-group-ellipsis-color);background-color:var(--sbb-breadcrumb-group-ellipsis-background-color);overflow:hidden}@media (forced-colors: active){#sbb-breadcrumb-ellipsis{--sbb-breadcrumb-group-ellipsis-border-width: var(--sbb-border-width-2x);--sbb-breadcrumb-group-ellipsis-border-color: CanvasText}}@media (any-hover: hover){#sbb-breadcrumb-ellipsis:hover{--sbb-breadcrumb-group-ellipsis-color: var(--sbb-color-charcoal);--sbb-breadcrumb-group-ellipsis-background-color: var(--sbb-color-milk)}}@media (any-hover: hover) and (forced-colors: active){#sbb-breadcrumb-ellipsis:hover{--sbb-breadcrumb-group-ellipsis-border-color: Highlight}}#sbb-breadcrumb-ellipsis:focus-visible:not([data-focus-origin=mouse],[data-focus-origin=touch]){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) solid var(--sbb-focus-outline-width)}`, p = 3;
+let W = (() => {
+  var t;
+  let g = [C("sbb-breadcrumb-group"), B({
+    role: "navigation"
+  })], l, o = [], s, b = N(x), n = [], d;
+  return t = class extends b {
+    constructor() {
+      super(...arguments), this.listChildLocalNames = (h(this, n), ["sbb-breadcrumb"]), this._resizeObserver = new f(this, {
+        target: null,
+        skipInitial: !0,
+        callback: () => this._evaluateCollapsedState()
+      }), this._abort = new E(this), this._language = new A(this), this._markForFocus = !1;
+    }
+    /* The state of the breadcrumb group. */
+    set _state(e) {
+      D(this, "data-state", e);
+    }
+    get _state() {
+      return this.getAttribute("data-state");
+    }
+    _handleKeyDown(e) {
+      if (!(!this.listChildren.length || // don't trap nested handling
+      e.target !== this && e.target.parentElement !== this) && k(e)) {
+        if (this._state === "collapsed")
+          return this._focusNextCollapsed(e);
+        this._focusNext(e);
+      }
+    }
+    connectedCallback() {
+      super.connectedCallback();
+      const e = this._abort.signal;
+      this.addEventListener("keydown", (r) => this._handleKeyDown(r), { signal: e });
+    }
+    firstUpdated(e) {
+      super.firstUpdated(e), this._resizeObserver.observe(this), this.toggleAttribute("data-loaded", !0);
+    }
+    willUpdate(e) {
+      super.willUpdate(e), e.has("listChildren") && this._syncBreadcrumbs();
+    }
+    updated(e) {
+      var r;
+      super.updated(e), e.has("listChildren") && Promise.resolve().then(() => this._evaluateCollapsedState()), this._markForFocus && z.mostRecentModality === "keyboard" && ((r = this.listChildren[1]) == null || r.focus(), this._markForFocus = !1);
+    }
+    /** Apply the aria-current attribute to the last sbb-breadcrumb element. */
+    _syncBreadcrumbs() {
+      var e;
+      this.listChildren.slice(0, -1).filter((r) => r.hasAttribute("aria-current")).forEach((r) => r.removeAttribute("aria-current")), (e = this.listChildren[this.listChildren.length - 1]) == null || e.setAttribute("aria-current", "page"), this.listChildren.length < p && (this._state = null);
+    }
+    /**
+     * Sets the focus on the correct element when the ellipsis breadcrumb is displayed and the user is navigating with keyboard's arrows.
+     */
+    _focusNextCollapsed(e) {
+      const r = [
+        this.listChildren[0],
+        this.shadowRoot.querySelector("#sbb-breadcrumb-ellipsis"),
+        this.listChildren[this.listChildren.length - 1]
+      ];
+      this._focusNext(e, r);
+    }
+    _focusNext(e, r = this.listChildren) {
+      var c;
+      const i = r.findIndex((u) => u === document.activeElement || u === this.shadowRoot.activeElement), _ = S(e, i, r.length);
+      (c = r[_]) == null || c.focus(), e.preventDefault();
+    }
+    /**
+     * Note: due to @State annotation on _state, this method triggers a new render; as a consequence, the focus is moved
+     * to the `body`, so if the ellipsis element has focus, it's asynchronously forced to the first element.
+     */
+    _expandBreadcrumbs() {
+      this._state = "manually-expanded", this._markForFocus = !0;
+    }
+    /** Evaluate if the expanded breadcrumb element fits in page width, otherwise it needs ellipsis */
+    _evaluateCollapsedState() {
+      !this._state && this.scrollWidth > this.offsetWidth && this.listChildren.length >= p && (this._state = "collapsed", this._resizeObserver.hostDisconnected(), this.removeController(this._resizeObserver));
+    }
+    _renderCollapsed() {
+      return a`
       <li class="sbb-breadcrumb-group__item">
         <slot name="li-0"></slot>
       </li>
@@ -99,7 +98,7 @@ let l = class extends z(h) {
         <button
           type="button"
           id="sbb-breadcrumb-ellipsis"
-          aria-label=${k[this._language.current]}
+          aria-label=${I[this._language.current]}
           aria-expanded="false"
           @click=${() => this._expandBreadcrumbs()}
         >
@@ -114,39 +113,33 @@ let l = class extends z(h) {
         <slot name=${`li-${this.listChildren.length - 1}`}></slot>
       </li>
     `;
-  }
-  _renderExpanded() {
-    return this.listSlotEntries().map(
-      (e, r, t) => b`
+    }
+    _renderExpanded() {
+      return this.listSlotEntries().map((e, r, i) => a`
         <li class="sbb-breadcrumb-group__item">
           <slot name=${e.name}></slot>
-          ${r !== t.length - 1 ? b`<sbb-icon
+          ${r !== i.length - 1 ? a`<sbb-icon
                 name="chevron-small-right-small"
                 class="sbb-breadcrumb-group__divider-icon"
-              ></sbb-icon>` : p}
+              ></sbb-icon>` : y}
         </li>
-      `
-    );
-  }
-  render() {
-    return b`
+      `);
+    }
+    render() {
+      return a`
       <ol class="sbb-breadcrumb-group">
         ${this._state === "collapsed" ? this._renderCollapsed() : this._renderExpanded()}
       </ol>
       ${this.renderHiddenSlot()}
     `;
-  }
-};
-l.styles = E;
-d([
-  m()
-], l.prototype, "_state", 1);
-l = d([
-  g("sbb-breadcrumb-group"),
-  y({
-    role: "navigation"
-  })
-], l);
+    }
+  }, s = t, (() => {
+    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(b[Symbol.metadata] ?? null) : void 0;
+    d = [w()], m(t, null, d, { kind: "setter", name: "_state", static: !1, private: !1, access: { has: (r) => "_state" in r, set: (r, i) => {
+      r._state = i;
+    } }, metadata: e }, null, n), m(null, l = { value: s }, g, { kind: "class", name: s.name, metadata: e }, null, o), s = l.value, e && Object.defineProperty(s, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
+  })(), t.styles = O, h(s, o), s;
+})();
 export {
-  l as SbbBreadcrumbGroupElement
+  W as SbbBreadcrumbGroupElement
 };

package/breadcrumb/breadcrumb.js

@@ -1,43 +1,52 @@
-import { state as l, customElement as c } from "lit/decorators.js";
-import { html as d } from "lit/static-html.js";
-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}@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;
+var u = (e) => {
+  throw TypeError(e);
 };
-let b = class extends f(u(m)) {
-  constructor() {
-    super(...arguments), this._hasText = !1;
-  }
-  _handleSlotchange() {
-    this._hasText = Array.from(this.childNodes ?? []).some(
-      (r) => {
-        var e;
-        return !r.slot && ((e = r.textContent) == null ? void 0 : e.trim());
-      }
-    );
-  }
-  renderTemplate() {
-    return d`
+var h = (e, t, s) => t.has(e) || u("Cannot " + s);
+var f = (e, t, s) => (h(e, t, "read from private field"), s ? s.call(e) : t.get(e)), _ = (e, t, s) => t.has(e) ? u("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(e) : t.set(e, s), x = (e, t, s, r) => (h(e, t, "write to private field"), r ? r.call(e, s) : t.set(e, s), s);
+import { __esDecorate as v, __runInitializers as l } from "tslib";
+import { customElement as g, state as y } from "lit/decorators.js";
+import { html as T } from "lit/static-html.js";
+import { SbbLinkBaseElement as S } from "../core/base-elements.js";
+import { SbbHydrationMixin as w } from "../core/mixins.js";
+import { SbbIconNameMixin as z } from "../icon.js";
+import { css as k } from "lit";
+const I = k`*,: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}`;
+let C = (() => {
+  var b, o;
+  let e = [g("sbb-breadcrumb")], t, s = [], r, n = z(w(S)), c, d = [], m = [];
+  return o = class extends n {
+    constructor() {
+      super(...arguments);
+      _(this, b, l(this, d, !1));
+      l(this, m);
+    }
+    get _hasText() {
+      return f(this, b);
+    }
+    set _hasText(a) {
+      x(this, b, a);
+    }
+    _handleSlotchange() {
+      this._hasText = Array.from(this.childNodes ?? []).some((a) => {
+        var i;
+        return !a.slot && ((i = a.textContent) == null ? void 0 : i.trim());
+      });
+    }
+    renderTemplate() {
+      return T`
       ${this.renderIconSlot("sbb-breadcrumb__icon")}
       <span class="sbb-breadcrumb__label" ?hidden=${!this._hasText}>
         <slot @slotchange=${this._handleSlotchange}></slot>
       </span>
     `;
-  }
-};
-b.styles = v;
-n([
-  l()
-], b.prototype, "_hasText", 2);
-b = n([
-  c("sbb-breadcrumb")
-], b);
+    }
+  }, b = new WeakMap(), r = o, (() => {
+    const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(n[Symbol.metadata] ?? null) : void 0;
+    c = [y()], v(o, null, c, { kind: "accessor", name: "_hasText", static: !1, private: !1, access: { has: (i) => "_hasText" in i, get: (i) => i._hasText, set: (i, p) => {
+      i._hasText = p;
+    } }, metadata: a }, d, m), v(null, t = { value: r }, e, { kind: "class", name: r.name, metadata: a }, null, s), r = t.value, a && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: a });
+  })(), o.styles = I, l(r, s), r;
+})();
 export {
-  b as SbbBreadcrumbElement
+  C as SbbBreadcrumbElement
 };

package/button/button/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../../src/elements/button/button/button.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1C,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;;AAInE;;;;;GAKG;AACH,qBACa,gBAAiB,SAAQ,qBAErC;IACC,OAAuB,MAAM,EAAE,cAAc,CAA2C;CACzF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,YAAY,EAAE,gBAAgB,CAAC;KAChC;CACF"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../../src/elements/button/button/button.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1C,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;;AAInE;;;;;GAKG;AACH,qBAEM,gBAAiB,SAAQ,qBAE9B;IACC,OAAuB,MAAM,EAAE,cAAc,CAA2C;CACzF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,YAAY,EAAE,gBAAgB,CAAC;KAChC;CACF"}

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

@@ -1 +1 @@
-{"version":3,"file":"button-link.d.ts","sourceRoot":"","sources":["../../../../src/elements/button/button-link/button-link.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;;AAIjE;;;;;GAKG;AACH,qBACa,oBAAqB,SAAQ,yBAEzC;IACC,OAAuB,MAAM,EAAE,cAAc,CAA2C;CACzF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,iBAAiB,EAAE,oBAAoB,CAAC;KACzC;CACF"}
+{"version":3,"file":"button-link.d.ts","sourceRoot":"","sources":["../../../../src/elements/button/button-link/button-link.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;;AAIjE;;;;;GAKG;AACH,qBAEM,oBAAqB,SAAQ,yBAElC;IACC,OAAuB,MAAM,EAAE,cAAc,CAA2C;CACzF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,iBAAiB,EAAE,oBAAoB,CAAC;KACzC;CACF"}

package/button/button-link.js

@@ -1,20 +1,17 @@
-import { customElement as l } from "lit/decorators.js";
-import { SbbLinkBaseElement as s } from "../core/base-elements.js";
-import { SbbDisabledInteractiveMixin as p, SbbDisabledMixin as f } from "../core/mixins.js";
-import { SbbButtonCommonElementMixin as u, buttonCommonStyle as a, buttonPrimaryStyle as v } from "./common.js";
-var S = Object.defineProperty, _ = Object.getOwnPropertyDescriptor, c = (i, e, o, n) => {
-  for (var t = n > 1 ? void 0 : n ? _(e, o) : e, r = i.length - 1, b; r >= 0; r--)
-    (b = i[r]) && (t = (n ? b(e, o, t) : b(t)) || t);
-  return n && t && S(e, o, t), t;
-};
-let m = class extends u(
-  p(f(s))
-) {
-};
-m.styles = [a, v];
-m = c([
-  l("sbb-button-link")
-], m);
+import { __esDecorate as r, __runInitializers as s } from "tslib";
+import { customElement as m } from "lit/decorators.js";
+import { SbbLinkBaseElement as b } from "../core/base-elements.js";
+import { SbbDisabledInteractiveMixin as c, SbbDisabledMixin as u } from "../core/mixins.js";
+import { SbbButtonCommonElementMixin as S, buttonCommonStyle as d, buttonPrimaryStyle as f } from "./common.js";
+let D = (() => {
+  var e;
+  let o = [m("sbb-button-link")], l, i = [], t, n = S(c(u(b)));
+  return e = class extends n {
+  }, t = e, (() => {
+    const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(n[Symbol.metadata] ?? null) : void 0;
+    r(null, l = { value: t }, o, { kind: "class", name: t.name, metadata: a }, null, i), t = l.value, a && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: a });
+  })(), e.styles = [d, f], s(t, i), t;
+})();
 export {
-  m as SbbButtonLinkElement
+  D as SbbButtonLinkElement
 };

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

@@ -1 +1 @@
-{"version":3,"file":"button-static.d.ts","sourceRoot":"","sources":["../../../../src/elements/button/button-static/button-static.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1C,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;;AAInE;;;;;GAKG;AACH,qBACa,sBAAuB,SAAQ,2BAE3C;IACC,OAAuB,MAAM,EAAE,cAAc,CAA2C;CACzF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,mBAAmB,EAAE,sBAAsB,CAAC;KAC7C;CACF"}
+{"version":3,"file":"button-static.d.ts","sourceRoot":"","sources":["../../../../src/elements/button/button-static/button-static.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAG1C,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;;AAInE;;;;;GAKG;AACH,qBAEM,sBAAuB,SAAQ,2BAEpC;IACC,OAAuB,MAAM,EAAE,cAAc,CAA2C;CACzF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,mBAAmB,EAAE,sBAAsB,CAAC;KAC7C;CACF"}

package/button/button-static.js

@@ -1,20 +1,17 @@
-import { customElement as i } from "lit/decorators.js";
-import { SbbActionBaseElement as l } from "../core/base-elements.js";
-import { SbbDisabledMixin as p } from "../core/mixins.js";
-import { SbbButtonCommonElementMixin as f, buttonCommonStyle as u, buttonPrimaryStyle as a } from "./common.js";
-var c = Object.defineProperty, S = Object.getOwnPropertyDescriptor, v = (s, e, r, o) => {
-  for (var t = o > 1 ? void 0 : o ? S(e, r) : e, m = s.length - 1, n; m >= 0; m--)
-    (n = s[m]) && (t = (o ? n(e, r, t) : n(t)) || t);
-  return o && t && c(e, r, t), t;
-};
-let b = class extends f(
-  p(l)
-) {
-};
-b.styles = [u, a];
-b = v([
-  i("sbb-button-static")
-], b);
+import { __esDecorate as r, __runInitializers as m } from "tslib";
+import { customElement as n } from "lit/decorators.js";
+import { SbbActionBaseElement as c } from "../core/base-elements.js";
+import { SbbDisabledMixin as b } from "../core/mixins.js";
+import { SbbButtonCommonElementMixin as u, buttonCommonStyle as S, buttonPrimaryStyle as d } from "./common.js";
+let E = (() => {
+  var e;
+  let s = [n("sbb-button-static")], l, o = [], t, i = u(b(c));
+  return e = class extends i {
+  }, t = e, (() => {
+    const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(i[Symbol.metadata] ?? null) : void 0;
+    r(null, l = { value: t }, s, { kind: "class", name: t.name, metadata: a }, null, o), t = l.value, a && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: a });
+  })(), e.styles = [S, d], m(t, o), t;
+})();
 export {
-  b as SbbButtonStaticElement
+  E as SbbButtonStaticElement
 };

package/button/button.js

@@ -1,20 +1,17 @@
-import { customElement as s } from "lit/decorators.js";
-import { SbbButtonBaseElement as i } from "../core/base-elements.js";
-import { SbbDisabledTabIndexActionMixin as p } from "../core/mixins.js";
-import { SbbButtonCommonElementMixin as f, buttonCommonStyle as u, buttonPrimaryStyle as a } from "./common.js";
-var v = Object.defineProperty, S = Object.getOwnPropertyDescriptor, _ = (l, e, r, o) => {
-  for (var t = o > 1 ? void 0 : o ? S(e, r) : e, n = l.length - 1, m; n >= 0; n--)
-    (m = l[n]) && (t = (o ? m(e, r, t) : m(t)) || t);
-  return o && t && v(e, r, t), t;
-};
-let b = class extends f(
-  p(i)
-) {
-};
-b.styles = [u, a];
-b = _([
-  s("sbb-button")
-], b);
+import { __esDecorate as i, __runInitializers as n } from "tslib";
+import { customElement as m } from "lit/decorators.js";
+import { SbbButtonBaseElement as b } from "../core/base-elements.js";
+import { SbbDisabledTabIndexActionMixin as c } from "../core/mixins.js";
+import { SbbButtonCommonElementMixin as u, buttonCommonStyle as d, buttonPrimaryStyle as S } from "./common.js";
+let E = (() => {
+  var e;
+  let s = [m("sbb-button")], l, o = [], t, r = u(c(b));
+  return e = class extends r {
+  }, t = e, (() => {
+    const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(r[Symbol.metadata] ?? null) : void 0;
+    i(null, l = { value: t }, s, { kind: "class", name: t.name, metadata: a }, null, o), t = l.value, a && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: a });
+  })(), e.styles = [d, S], n(t, o), t;
+})();
 export {
-  b as SbbButtonElement
+  E as SbbButtonElement
 };

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

@@ -4,10 +4,10 @@ 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> {
-    size?: SbbButtonSize;
-    disabled: boolean;
-    iconName?: string;
-    negative: boolean;
+    accessor size: SbbButtonSize;
+    accessor disabled: boolean;
+    accessor iconName: string;
+    accessor negative: boolean;
 }
 export declare const SbbButtonCommonElementMixin: <T extends AbstractConstructor<SbbActionBaseElement>>(superClass: T) => AbstractConstructor<SbbButtonCommonElementMixinType> & T;
 //# sourceMappingURL=button-common.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"button-common.d.ts","sourceRoot":"","sources":["../../../../src/elements/button/common/button-common.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAExE,OAAO,KAAK,EACV,mBAAmB,EACnB,oBAAoB,EACpB,oBAAoB,EACrB,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EAAoB,KAAK,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAE5E,MAAM,MAAM,sBAAsB,GAAG,+BAA+B,GAAG,oBAAoB,CAAC;AAE5F,MAAM,MAAM,aAAa,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAE5C,MAAM,CAAC,OAAO,OAAO,+BACnB,YAAW,oBAAoB,EAAE,OAAO,CAAC,oBAAoB,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC;IAEtF,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;CAC1B;AAGD,eAAO,MAAM,2BAA2B,GAAI,CAAC,SAAS,mBAAmB,CAAC,oBAAoB,CAAC,cACjF,CAAC,KACZ,mBAAmB,CAAC,+BAA+B,CAAC,GAAG,CAuBzD,CAAC"}
+{"version":3,"file":"button-common.d.ts","sourceRoot":"","sources":["../../../../src/elements/button/common/button-common.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAExE,OAAO,KAAK,EACV,mBAAmB,EACnB,oBAAoB,EACpB,oBAAoB,EACrB,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EAAoB,KAAK,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAE5E,MAAM,MAAM,sBAAsB,GAAG,+BAA+B,GAAG,oBAAoB,CAAC;AAE5F,MAAM,MAAM,aAAa,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAE5C,MAAM,CAAC,OAAO,OAAO,+BACnB,YAAW,oBAAoB,EAAE,OAAO,CAAC,oBAAoB,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC;IAE7F,SAAgB,IAAI,EAAE,aAAa,CAAC;IACpC,SAAgB,QAAQ,EAAE,OAAO,CAAC;IAClC,SAAgB,QAAQ,EAAE,MAAM,CAAC;IACjC,SAAgB,QAAQ,EAAE,OAAO,CAAC;CACnC;AAGD,eAAO,MAAM,2BAA2B,GAAI,CAAC,SAAS,mBAAmB,CAAC,oBAAoB,CAAC,cACjF,CAAC,KACZ,mBAAmB,CAAC,+BAA+B,CAAC,GAAG,CAuBzD,CAAC"}