@sbb-esta/lyne-elements-dev 4.7.0-dev.1773149675 → 4.7.0-dev.1773157346

package/{checkbox/checkbox-group → checkbox-group}/checkbox-group.component.js

@@ -1,63 +1,64 @@
-var C = (o) => {
+var I = (o) => {
   throw TypeError(o);
 };
-var U = (o, i, r) => i.has(o) || C("Cannot " + r);
-var d = (o, i, r) => (U(o, i, "read from private field"), r ? r.call(o) : i.get(o)), m = (o, i, r) => i.has(o) ? C("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(o) : i.set(o, r), x = (o, i, r, n) => (U(o, i, "write to private field"), n ? n.call(o, r) : i.set(o, r), r);
-import { __esDecorate as p, __runInitializers as c } from "tslib";
-import { MutationController as K } from "@lit-labs/observers/mutation-controller.js";
-import { css as M, LitElement as N, html as j } from "lit";
-import { customElement as O, property as k } from "lit/decorators.js";
-import { interactivityChecker as T, isArrowKeyPressed as B, getNextElementIndex as G } from "../../core/a11y.js";
-import { forceType as V } from "../../core/decorators.js";
-import { isLean as H } from "../../core/dom.js";
-import { SbbDisabledMixin as J, SbbElementInternalsMixin as Q } from "../../core/mixins.js";
-import { boxSizingStyles as R } from "../../core/styles.js";
-const W = M`:host{display:block}:host([orientation=vertical]){--sbb-checkbox-group-orientation: column;--sbb-checkbox-group-width: 100%;--sbb-checkbox-group-checkbox-width: 100%}:host(:is(:state(has-panel),[state--has-panel])){--sbb-checkbox-group-width: 100%;--sbb-checkbox-group-gap: var(--sbb-spacing-fixed-2x) var(--sbb-spacing-fixed-4x);--sbb-checkbox-group-checkbox-flex: auto}@media(min-width:0rem){:host([orientation=vertical][horizontal-from=zero]){--sbb-checkbox-group-orientation: row;--sbb-checkbox-group-checkbox-width: auto;--sbb-checkbox-group-checkbox-width: initial}:host([orientation=vertical][horizontal-from=zero]:not(:is(:state(has-panel),[state--has-panel]))){--sbb-checkbox-group-width: max-content}}@media(min-width:37.5rem){:host([orientation=vertical][horizontal-from=small]){--sbb-checkbox-group-orientation: row;--sbb-checkbox-group-checkbox-width: auto;--sbb-checkbox-group-checkbox-width: initial}:host([orientation=vertical][horizontal-from=small]:not(:is(:state(has-panel),[state--has-panel]))){--sbb-checkbox-group-width: max-content}}@media(min-width:64rem){:host([orientation=vertical][horizontal-from=large]){--sbb-checkbox-group-orientation: row;--sbb-checkbox-group-checkbox-width: auto;--sbb-checkbox-group-checkbox-width: initial}:host([orientation=vertical][horizontal-from=large]:not(:is(:state(has-panel),[state--has-panel]))){--sbb-checkbox-group-width: max-content}}@media(min-width:90rem){:host([orientation=vertical][horizontal-from=ultra]){--sbb-checkbox-group-orientation: row;--sbb-checkbox-group-checkbox-width: auto;--sbb-checkbox-group-checkbox-width: initial}:host([orientation=vertical][horizontal-from=ultra]:not(:is(:state(has-panel),[state--has-panel]))){--sbb-checkbox-group-width: max-content}}.sbb-checkbox-group{display:flex;flex-direction:var(--sbb-checkbox-group-orientation);gap:var(--sbb-checkbox-group-gap);align-items:flex-start;width:var(--sbb-checkbox-group-width)}:host(:is(:state(slotted-error),[state--slotted-error])) .sbb-checkbox-group{margin-block-end:var(--sbb-spacing-fixed-1x)}::slotted(:is(sbb-checkbox,sbb-checkbox-panel)){width:var(--sbb-checkbox-group-checkbox-width)}::slotted(sbb-checkbox-panel){flex:var(--sbb-checkbox-group-checkbox-flex)}`;
-let se = (() => {
-  var l, h, b, u, s;
-  let o = [O("sbb-checkbox-group")], i, r = [], n, g = J(Q(N)), f, z = [], _ = [], w, v = [], y = [], q, E = [], S = [], F, I = [], D = [];
-  return s = class extends g {
+var S = (o, i, r) => i.has(o) || I("Cannot " + r);
+var u = (o, i, r) => (S(o, i, "read from private field"), r ? r.call(o) : i.get(o)), m = (o, i, r) => i.has(o) ? I("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(o) : i.set(o, r), p = (o, i, r, n) => (S(o, i, "write to private field"), n ? n.call(o, r) : i.set(o, r), r);
+import { __esDecorate as x, __runInitializers as c } from "tslib";
+import { MutationController as E } from "@lit-labs/observers/mutation-controller.js";
+import { css as N, html as A } from "lit";
+import { property as g } from "lit/decorators.js";
+import { interactivityChecker as K, isArrowKeyPressed as L, getNextElementIndex as j } from "../core/a11y.js";
+import { SbbElement as M } from "../core/base-elements.js";
+import { forceType as O } from "../core/decorators.js";
+import { isLean as B } from "../core/dom.js";
+import { SbbDisabledMixin as T } from "../core/mixins.js";
+import { boxSizingStyles as V } from "../core/styles.js";
+const H = N`:host{display:block}:host([orientation=vertical]){--sbb-checkbox-group-orientation: column;--sbb-checkbox-group-width: 100%;--sbb-checkbox-group-checkbox-width: 100%}:host(:is(:state(has-panel),[state--has-panel])){--sbb-checkbox-group-width: 100%;--sbb-checkbox-group-gap: var(--sbb-spacing-fixed-2x) var(--sbb-spacing-fixed-4x);--sbb-checkbox-group-checkbox-flex: auto}@media(min-width:0rem){:host([orientation=vertical][horizontal-from=zero]){--sbb-checkbox-group-orientation: row;--sbb-checkbox-group-checkbox-width: auto;--sbb-checkbox-group-checkbox-width: initial}:host([orientation=vertical][horizontal-from=zero]:not(:is(:state(has-panel),[state--has-panel]))){--sbb-checkbox-group-width: max-content}}@media(min-width:37.5rem){:host([orientation=vertical][horizontal-from=small]){--sbb-checkbox-group-orientation: row;--sbb-checkbox-group-checkbox-width: auto;--sbb-checkbox-group-checkbox-width: initial}:host([orientation=vertical][horizontal-from=small]:not(:is(:state(has-panel),[state--has-panel]))){--sbb-checkbox-group-width: max-content}}@media(min-width:64rem){:host([orientation=vertical][horizontal-from=large]){--sbb-checkbox-group-orientation: row;--sbb-checkbox-group-checkbox-width: auto;--sbb-checkbox-group-checkbox-width: initial}:host([orientation=vertical][horizontal-from=large]:not(:is(:state(has-panel),[state--has-panel]))){--sbb-checkbox-group-width: max-content}}@media(min-width:90rem){:host([orientation=vertical][horizontal-from=ultra]){--sbb-checkbox-group-orientation: row;--sbb-checkbox-group-checkbox-width: auto;--sbb-checkbox-group-checkbox-width: initial}:host([orientation=vertical][horizontal-from=ultra]:not(:is(:state(has-panel),[state--has-panel]))){--sbb-checkbox-group-width: max-content}}.sbb-checkbox-group{display:flex;flex-direction:var(--sbb-checkbox-group-orientation);gap:var(--sbb-checkbox-group-gap);align-items:flex-start;width:var(--sbb-checkbox-group-width)}:host(:is(:state(slotted-error),[state--slotted-error])) .sbb-checkbox-group{margin-block-end:var(--sbb-spacing-fixed-1x)}::slotted(:is(sbb-checkbox,sbb-checkbox-panel)){width:var(--sbb-checkbox-group-checkbox-width)}::slotted(sbb-checkbox-panel){flex:var(--sbb-checkbox-group-checkbox-flex)}`;
+let te = (() => {
+  var l, h, b, d, a;
+  let o = T(M), i, r = [], n = [], f, k = [], z = [], w, _ = [], y = [], v, q = [], F = [];
+  return a = class extends o {
     constructor() {
       super();
-      m(this, l, c(this, z, !1));
-      m(this, h, (c(this, _), c(this, v, H() ? "xs" : "m")));
-      m(this, b, (c(this, y), c(this, E, null)));
-      m(this, u, (c(this, S), c(this, I, "horizontal")));
-      c(this, D), this.addEventListener?.("keydown", (t) => this._handleKeyDown(t)), this.addController(new K(this, {
+      m(this, l, c(this, r, !1));
+      m(this, h, (c(this, n), c(this, k, B() ? "xs" : "m")));
+      m(this, b, (c(this, z), c(this, _, null)));
+      m(this, d, (c(this, y), c(this, q, "horizontal")));
+      c(this, F), this.addEventListener?.("keydown", (t) => this._handleKeyDown(t)), this.addController(new E(this, {
         config: { childList: !0, subtree: !0 },
         callback: () => this.toggleState("has-panel", !!this.querySelector?.("sbb-checkbox-panel"))
       }));
     }
     /** Whether the checkbox group is required. */
     get required() {
-      return d(this, l);
+      return u(this, l);
     }
     set required(t) {
-      x(this, l, t);
+      p(this, l, t);
     }
     /**
      * Size variant, either xs, s or m.
      * @default 'm' / 'xs' (lean)
      */
     get size() {
-      return d(this, h);
+      return u(this, h);
     }
     set size(t) {
-      x(this, h, t);
+      p(this, h, t);
     }
     /** Overrides the behaviour of `orientation` property. */
     get horizontalFrom() {
-      return d(this, b);
+      return u(this, b);
     }
     set horizontalFrom(t) {
-      x(this, b, t);
+      p(this, b, t);
     }
     /** Indicates the orientation of the checkboxes inside the `<sbb-checkbox-group>`. */
     get orientation() {
-      return d(this, u);
+      return u(this, d);
     }
     set orientation(t) {
-      x(this, u, t);
+      p(this, d, t);
     }
     /** List of contained checkbox elements. */
     get checkboxes() {
@@ -67,34 +68,34 @@ let se = (() => {
       super.willUpdate(t), t.has("disabled") && this.checkboxes.forEach((e) => e.requestUpdate?.("disabled")), t.has("required") && this.checkboxes.forEach((e) => e.requestUpdate?.("required")), t.has("size") && this.checkboxes.forEach((e) => e.requestUpdate?.("size"));
     }
     _handleKeyDown(t) {
-      const e = this.checkboxes.filter((a) => !a.disabled && T.isVisible(a));
+      const e = this.checkboxes.filter((s) => !s.disabled && K.isVisible(s));
       if (!(!e || // don't trap nested handling
-      t.target !== this && t.target.parentElement !== this && t.target.parentElement.localName !== "sbb-selection-expansion-panel" && t.target.parentElement.localName !== "sbb-selection-action-panel") && B(t)) {
-        const a = e.findIndex((A) => A === t.target), L = G(t, a, e.length);
-        e[L]?.focus();
+      t.target !== this && t.target.parentElement !== this && t.target.parentElement.localName !== "sbb-selection-expansion-panel" && t.target.parentElement.localName !== "sbb-selection-action-panel") && L(t)) {
+        const s = e.findIndex((D) => D === t.target), U = j(t, s, e.length);
+        e[U]?.focus();
       }
     }
     render() {
-      return j`
+      return A`
       <div class="sbb-checkbox-group">
         <slot></slot>
       </div>
       <slot name="error"></slot>
     `;
     }
-  }, l = new WeakMap(), h = new WeakMap(), b = new WeakMap(), u = new WeakMap(), n = s, (() => {
-    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(g[Symbol.metadata] ?? null) : void 0;
-    f = [V(), k({ reflect: !0, type: Boolean })], w = [k()], q = [k({ attribute: "horizontal-from", reflect: !0 })], F = [k({ reflect: !0 })], p(s, null, f, { kind: "accessor", name: "required", static: !1, private: !1, access: { has: (e) => "required" in e, get: (e) => e.required, set: (e, a) => {
-      e.required = a;
-    } }, metadata: t }, z, _), p(s, null, w, { kind: "accessor", name: "size", static: !1, private: !1, access: { has: (e) => "size" in e, get: (e) => e.size, set: (e, a) => {
-      e.size = a;
-    } }, metadata: t }, v, y), p(s, null, q, { kind: "accessor", name: "horizontalFrom", static: !1, private: !1, access: { has: (e) => "horizontalFrom" in e, get: (e) => e.horizontalFrom, set: (e, a) => {
-      e.horizontalFrom = a;
-    } }, metadata: t }, E, S), p(s, null, F, { kind: "accessor", name: "orientation", static: !1, private: !1, access: { has: (e) => "orientation" in e, get: (e) => e.orientation, set: (e, a) => {
-      e.orientation = a;
-    } }, metadata: t }, I, D), p(null, i = { value: n }, o, { kind: "class", name: n.name, metadata: t }, null, r), n = i.value, t && Object.defineProperty(n, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
-  })(), s.styles = [R, W], c(n, r), n;
+  }, l = new WeakMap(), h = new WeakMap(), b = new WeakMap(), d = new WeakMap(), (() => {
+    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(o[Symbol.metadata] ?? null) : void 0;
+    i = [O(), g({ reflect: !0, type: Boolean })], f = [g()], w = [g({ attribute: "horizontal-from", reflect: !0 })], v = [g({ reflect: !0 })], x(a, null, i, { kind: "accessor", name: "required", static: !1, private: !1, access: { has: (e) => "required" in e, get: (e) => e.required, set: (e, s) => {
+      e.required = s;
+    } }, metadata: t }, r, n), x(a, null, f, { kind: "accessor", name: "size", static: !1, private: !1, access: { has: (e) => "size" in e, get: (e) => e.size, set: (e, s) => {
+      e.size = s;
+    } }, metadata: t }, k, z), x(a, null, w, { kind: "accessor", name: "horizontalFrom", static: !1, private: !1, access: { has: (e) => "horizontalFrom" in e, get: (e) => e.horizontalFrom, set: (e, s) => {
+      e.horizontalFrom = s;
+    } }, metadata: t }, _, y), x(a, null, v, { kind: "accessor", name: "orientation", static: !1, private: !1, access: { has: (e) => "orientation" in e, get: (e) => e.orientation, set: (e, s) => {
+      e.orientation = s;
+    } }, metadata: t }, q, F), t && Object.defineProperty(a, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
+  })(), a.elementName = "sbb-checkbox-group", a.styles = [V, H], a;
 })();
 export {
-  se as SbbCheckboxGroupElement
+  te as SbbCheckboxGroupElement
 };

package/checkbox-group.js

@@ -0,0 +1,5 @@
+import { SbbCheckboxGroupElement as e } from "./checkbox-group/checkbox-group.component.js";
+e.define();
+export {
+  e as SbbCheckboxGroupElement
+};

package/checkbox-group.pure.js

@@ -0,0 +1,4 @@
+import { SbbCheckboxGroupElement as b } from "./checkbox-group/checkbox-group.component.js";
+export {
+  b as SbbCheckboxGroupElement
+};

package/checkbox-panel/checkbox-panel.component.js

@@ -0,0 +1,76 @@
+var c = (e) => {
+  throw TypeError(e);
+};
+var b = (e, t, s) => t.has(e) || c("Cannot " + s);
+var m = (e, t, s) => (b(e, t, "read from private field"), s ? s.call(e) : t.get(e)), p = (e, t, s) => t.has(e) ? c("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(e) : t.set(e, s), h = (e, t, s, r) => (b(e, t, "write to private field"), r ? r.call(e, s) : t.set(e, s), s);
+import { __esDecorate as x, __runInitializers as u } from "tslib";
+import { nothing as f, html as d } from "lit";
+import { property as _ } from "lit/decorators.js";
+import { SbbCheckboxCommonElementMixin as v, checkboxCommonStyle as k } from "../checkbox/common/checkbox-common.js";
+import { SbbElement as S } from "../core/base-elements.js";
+import { SbbPanelMixin as y, SbbUpdateSchedulerMixin as g, panelCommonStyle as $ } from "../core/mixins.js";
+import { boxSizingStyles as z } from "../core/styles.js";
+import "../screen-reader-only.js";
+import "../visual-checkbox.js";
+let B = (() => {
+  var n, a;
+  let e = y(v(g(S))), t, s = [], r = [];
+  return a = class extends e {
+    constructor() {
+      super(...arguments);
+      p(this, n, u(this, s, null));
+      u(this, r);
+    }
+    /** Value of the form element. */
+    get value() {
+      return m(this, n);
+    }
+    set value(i) {
+      h(this, n, i);
+    }
+    requestUpdate(i, l, o) {
+      super.requestUpdate(i, l, o), i === "checked" && (this.internals.ariaChecked = `${this.checked}`, this.toggleState("checked", this.checked));
+    }
+    render() {
+      return d`
+      <span class="sbb-selection-panel">
+        <div class="sbb-selection-panel__badge">
+          <slot name="badge"></slot>
+        </div>
+        <span class="sbb-checkbox-wrapper">
+          <span class="sbb-checkbox">
+            <span class="sbb-checkbox__inner">
+              <span class="sbb-checkbox__aligner">
+                <sbb-visual-checkbox
+                  ?checked=${this.checked}
+                  ?indeterminate=${this.indeterminate}
+                  ?disabled=${this.disabled || this.formDisabled}
+                  .size=${this.size}
+                ></sbb-visual-checkbox>
+              </span>
+              <span class="sbb-checkbox__label">
+                <slot></slot>
+                <slot name="suffix"></slot>
+              </span>
+            </span>
+            <slot name="subtext"></slot>
+            ${this.expansionState ? d`<sbb-screen-reader-only>${this.expansionState}</sbb-screen-reader-only>` : f}
+          </span>
+        </span>
+      </span>
+    `;
+    }
+  }, n = new WeakMap(), (() => {
+    const i = typeof Symbol == "function" && Symbol.metadata ? Object.create(e[Symbol.metadata] ?? null) : void 0;
+    t = [_()], x(a, null, t, { kind: "accessor", name: "value", static: !1, private: !1, access: { has: (l) => "value" in l, get: (l) => l.value, set: (l, o) => {
+      l.value = o;
+    } }, metadata: i }, s, r), i && Object.defineProperty(a, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: i });
+  })(), a.elementName = "sbb-checkbox-panel", a.styles = [
+    z,
+    k,
+    $
+  ], a;
+})();
+export {
+  B as SbbCheckboxPanelElement
+};

package/checkbox-panel.js

@@ -0,0 +1,5 @@
+import { SbbCheckboxPanelElement as e } from "./checkbox-panel/checkbox-panel.component.js";
+e.define();
+export {
+  e as SbbCheckboxPanelElement
+};

package/checkbox-panel.pure.js

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

package/checkbox.js

@@ -1,12 +1,14 @@
-import { SbbCheckboxElement as b } from "./checkbox/checkbox/checkbox.component.js";
-import { SbbCheckboxGroupElement as r } from "./checkbox/checkbox-group/checkbox-group.component.js";
-import { SbbCheckboxPanelElement as t } from "./checkbox/checkbox-panel/checkbox-panel.component.js";
-import { SbbCheckboxCommonElementMixin as c } from "./checkbox/common/checkbox-common.js";
-import { c as p } from "./checkbox-common-t04WeA36.js";
+import { SbbCheckboxGroupElement as e } from "./checkbox-group/checkbox-group.component.js";
+import { SbbCheckboxPanelElement as o } from "./checkbox-panel/checkbox-panel.component.js";
+import { SbbCheckboxElement as m } from "./checkbox/checkbox.component.js";
+import { SbbCheckboxCommonElementMixin as x, checkboxCommonStyle as f } from "./checkbox/common/checkbox-common.js";
+m.define();
+e.define();
+o.define();
 export {
-  c as SbbCheckboxCommonElementMixin,
-  b as SbbCheckboxElement,
-  r as SbbCheckboxGroupElement,
-  t as SbbCheckboxPanelElement,
-  p as checkboxCommonStyle
+  x as SbbCheckboxCommonElementMixin,
+  m as SbbCheckboxElement,
+  e as SbbCheckboxGroupElement,
+  o as SbbCheckboxPanelElement,
+  f as checkboxCommonStyle
 };

package/checkbox.pure.js

@@ -0,0 +1,7 @@
+import { SbbCheckboxElement as m } from "./checkbox/checkbox.component.js";
+import { SbbCheckboxCommonElementMixin as x, checkboxCommonStyle as n } from "./checkbox/common/checkbox-common.js";
+export {
+  x as SbbCheckboxCommonElementMixin,
+  m as SbbCheckboxElement,
+  n as checkboxCommonStyle
+};

package/chip/chip/chip.component.js

@@ -1,39 +1,40 @@
-var v = (e) => {
+var n = (e) => {
   throw TypeError(e);
 };
-var p = (e, r, i) => r.has(e) || v("Cannot " + i);
-var m = (e, r, i) => (p(e, r, "read from private field"), i ? i.call(e) : r.get(e)), g = (e, r, i) => r.has(e) ? v("Cannot add the same private member more than once") : r instanceof WeakSet ? r.add(e) : r.set(e, i), l = (e, r, i, s) => (p(e, r, "write to private field"), s ? s.call(e, i) : r.set(e, i), i);
-import { __runInitializers as n, __esDecorate as _ } from "tslib";
-import { css as y, LitElement as x, html as k } from "lit";
-import { customElement as w, property as S } from "lit/decorators.js";
-import { SbbLanguageController as z } from "../../core/controllers.js";
-import { i18nChipDelete as D } from "../../core/i18n.js";
-import { SbbNegativeMixin as E, SbbDisabledMixin as C, SbbReadonlyMixin as q, SbbElementInternalsMixin as B } from "../../core/mixins.js";
-import { boxSizingStyles as I } from "../../core/styles.js";
+var c = (e, r, i) => r.has(e) || n("Cannot " + i);
+var d = (e, r, i) => (c(e, r, "read from private field"), i ? i.call(e) : r.get(e)), u = (e, r, i) => r.has(e) ? n("Cannot add the same private member more than once") : r instanceof WeakSet ? r.add(e) : r.set(e, i), l = (e, r, i, b) => (c(e, r, "write to private field"), b ? b.call(e, i) : r.set(e, i), i);
+import { __runInitializers as h, __esDecorate as p } from "tslib";
+import { css as m, html as g } from "lit";
+import { property as f } from "lit/decorators.js";
+import { SbbElement as _ } from "../../core/base-elements.js";
+import { SbbLanguageController as y } from "../../core/controllers.js";
+import { i18nChipDelete as x } from "../../core/i18n.js";
+import { SbbNegativeMixin as w, SbbDisabledMixin as k, SbbReadonlyMixin as z } from "../../core/mixins.js";
+import { boxSizingStyles as S } from "../../core/styles.js";
 import "../../button/mini-button.js";
 import "../../screen-reader-only.js";
-const M = y`:host{--sbb-chip-border: var(--sbb-border-width-1x) solid var(--sbb-chip-border-color);--sbb-chip-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );display:inline-flex;align-items:stretch;background-color:var(--sbb-chip-background-color);border-radius:var(--sbb-chip-border-radius);color:var(--sbb-chip-color);height:var(--sbb-chip-height)}:host(:focus){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);--sbb-focus-outline-offset: -.0625rem;--sbb-focus-outline-style: initial}:host([negative]){--sbb-chip-border-color: var(--sbb-border-color-4-negative-inverted);--sbb-chip-background-color: var(--sbb-background-color-3-negative);--sbb-chip-color: var(--sbb-color-4-negative);--sbb-chip-color-hover: var(--sbb-color-2-negative);--sbb-chip-background-color-active: var(--sbb-background-color-1-negative);--sbb-chip-background-color-hover: var(--sbb-background-color-1-negative);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark)}.sbb-chip__label-wrapper{border:var(--sbb-chip-border);border-inline-end:none;border-radius:var(--sbb-chip-border-radius) 0 0 var(--sbb-chip-border-radius);display:flex;align-items:center;padding-inline:var(--sbb-chip-label-padding-inline);outline:none;overflow:hidden}:host(:is([disabled],[readonly])) .sbb-chip__label-wrapper{border:var(--sbb-chip-border);border-radius:var(--sbb-chip-border-radius)}.sbb-chip__label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:inline-block;font-size:var(--sbb-chip-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);transition:transform var(--sbb-chip-transition-duration) var(--sbb-animation-easing)}.sbb-chip__delete{--sbb-mini-button-border-radius: 0 var(--sbb-chip-border-radius) var(--sbb-chip-border-radius) 0;--sbb-mini-button-color-text: var(--sbb-chip-color);--sbb-mini-button-color-active-background: var(--sbb-chip-background-color-active);--sbb-mini-button-color-hover-background: var(--sbb-chip-background-color-hover);--sbb-icon-svg-width: calc(var(--sbb-size-icon-ui-small) - var(--sbb-border-width-1x) * 2);--sbb-icon-svg-height: calc(var(--sbb-size-icon-ui-small) - var(--sbb-border-width-1x) * 2);--_sbb-mini-button-image-size: ;border:var(--sbb-chip-border);border-radius:0 var(--sbb-chip-border-radius) var(--sbb-chip-border-radius) 0}:host(:is([disabled],[readonly])) .sbb-chip__delete{display:none}@media(any-hover:hover){:host(:not([disabled])) .sbb-chip__delete:hover{--sbb-mini-button-color-text: var(--sbb-chip-color-hover)}}`;
-let H = (() => {
-  var o, b;
-  let e = [w("sbb-chip")], r, i = [], s, c = E(C(q(B(x)))), d, u = [], h = [];
-  return b = class extends c {
+const D = m`:host{--sbb-chip-border: var(--sbb-border-width-1x) solid var(--sbb-chip-border-color);--sbb-chip-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );display:inline-flex;align-items:stretch;background-color:var(--sbb-chip-background-color);border-radius:var(--sbb-chip-border-radius);color:var(--sbb-chip-color);height:var(--sbb-chip-height)}:host(:focus){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);--sbb-focus-outline-offset: -.0625rem;--sbb-focus-outline-style: initial}:host([negative]){--sbb-chip-border-color: var(--sbb-border-color-4-negative-inverted);--sbb-chip-background-color: var(--sbb-background-color-3-negative);--sbb-chip-color: var(--sbb-color-4-negative);--sbb-chip-color-hover: var(--sbb-color-2-negative);--sbb-chip-background-color-active: var(--sbb-background-color-1-negative);--sbb-chip-background-color-hover: var(--sbb-background-color-1-negative);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark)}.sbb-chip__label-wrapper{border:var(--sbb-chip-border);border-inline-end:none;border-radius:var(--sbb-chip-border-radius) 0 0 var(--sbb-chip-border-radius);display:flex;align-items:center;padding-inline:var(--sbb-chip-label-padding-inline);outline:none;overflow:hidden}:host(:is([disabled],[readonly])) .sbb-chip__label-wrapper{border:var(--sbb-chip-border);border-radius:var(--sbb-chip-border-radius)}.sbb-chip__label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:inline-block;font-size:var(--sbb-chip-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);transition:transform var(--sbb-chip-transition-duration) var(--sbb-animation-easing)}.sbb-chip__delete{--sbb-mini-button-border-radius: 0 var(--sbb-chip-border-radius) var(--sbb-chip-border-radius) 0;--sbb-mini-button-color-text: var(--sbb-chip-color);--sbb-mini-button-color-active-background: var(--sbb-chip-background-color-active);--sbb-mini-button-color-hover-background: var(--sbb-chip-background-color-hover);--sbb-icon-svg-width: calc(var(--sbb-size-icon-ui-small) - var(--sbb-border-width-1x) * 2);--sbb-icon-svg-height: calc(var(--sbb-size-icon-ui-small) - var(--sbb-border-width-1x) * 2);--_sbb-mini-button-image-size: ;border:var(--sbb-chip-border);border-radius:0 var(--sbb-chip-border-radius) var(--sbb-chip-border-radius) 0}:host(:is([disabled],[readonly])) .sbb-chip__delete{display:none}@media(any-hover:hover){:host(:not([disabled])) .sbb-chip__delete:hover{--sbb-mini-button-color-text: var(--sbb-chip-color-hover)}}`;
+let T = (() => {
+  var s, t;
+  let e = w(k(z(_))), r, i = [], b = [];
+  return t = class extends e {
     constructor() {
       super(...arguments);
-      g(this, o);
-      l(this, o, n(this, u, null)), this._language = (n(this, h), new z(this));
+      u(this, s);
+      l(this, s, h(this, i, null)), this._language = (h(this, b), new y(this));
     }
     /** The value of chip. Will be used as label if nothing is slotted. */
     get value() {
-      return m(this, o);
+      return d(this, s);
     }
-    set value(t) {
-      l(this, o, t);
+    set value(o) {
+      l(this, s, o);
     }
-    willUpdate(t) {
-      super.willUpdate(t), t.has("disabled") && (this.disabled ? this.removeAttribute("tabindex") : this.setAttribute("tabindex", "-1"));
+    willUpdate(o) {
+      super.willUpdate(o), o.has("disabled") && (this.disabled ? this.removeAttribute("tabindex") : this.setAttribute("tabindex", "-1"));
     }
-    firstUpdated(t) {
-      super.firstUpdated(t), setTimeout(() => this._deleteButton().removeAttribute("tabindex"));
+    firstUpdated(o) {
+      super.firstUpdated(o), setTimeout(() => this._deleteButton().removeAttribute("tabindex"));
     }
     _deleteButton() {
       return this.shadowRoot.querySelector("sbb-mini-button");
@@ -42,7 +43,7 @@ let H = (() => {
       this.dispatchEvent(new Event("requestdelete", { bubbles: !0, composed: !0 }));
     }
     render() {
-      return k`
+      return g`
       <div class="sbb-chip__label-wrapper">
         <span class="sbb-chip__label">
           <slot>${this.value ?? ""}</slot>
@@ -55,18 +56,18 @@ let H = (() => {
         @click=${this._handleDeleteButtonClick}
       >
       </sbb-mini-button>
-      <sbb-screen-reader-only>, ${D[this._language.current]}</sbb-screen-reader-only>
+      <sbb-screen-reader-only>, ${x[this._language.current]}</sbb-screen-reader-only>
     `;
     }
-  }, o = new WeakMap(), s = b, (() => {
-    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(c[Symbol.metadata] ?? null) : void 0;
-    d = [S()], _(b, null, d, { kind: "accessor", name: "value", static: !1, private: !1, access: { has: (a) => "value" in a, get: (a) => a.value, set: (a, f) => {
-      a.value = f;
-    } }, metadata: t }, u, h), _(null, r = { value: s }, e, { kind: "class", name: s.name, metadata: t }, null, i), s = r.value, t && Object.defineProperty(s, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
-  })(), b.role = "option", b.styles = [I, M], b.events = {
+  }, s = new WeakMap(), (() => {
+    const o = typeof Symbol == "function" && Symbol.metadata ? Object.create(e[Symbol.metadata] ?? null) : void 0;
+    r = [f()], p(t, null, r, { kind: "accessor", name: "value", static: !1, private: !1, access: { has: (a) => "value" in a, get: (a) => a.value, set: (a, v) => {
+      a.value = v;
+    } }, metadata: o }, i, b), o && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: o });
+  })(), t.elementName = "sbb-chip", t.role = "option", t.styles = [S, D], t.events = {
     requestdelete: "requestdelete"
-  }, n(s, i), s;
+  }, t;
 })();
 export {
-  H as SbbChipElement
+  T as SbbChipElement
 };

package/chip/chip-group/chip-group.component.js

@@ -1,30 +1,31 @@
-var D = (i) => {
+var x = (i) => {
   throw TypeError(i);
 };
-var B = (i, a, r) => a.has(i) || D("Cannot " + r);
-var _ = (i, a, r) => (B(i, a, "read from private field"), r ? r.call(i) : a.get(i)), g = (i, a, r) => a.has(i) ? D("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(i) : a.set(i, r), u = (i, a, r, p) => (B(i, a, "write to private field"), p ? p.call(i, r) : a.set(i, r), r);
-import { __esDecorate as d, __runInitializers as h } from "tslib";
-import { css as W, LitElement as T, isServer as K, html as F } from "lit";
-import { customElement as q, property as y } from "lit/decorators.js";
-import { isArrowKeyPressed as M, getNextElementIndex as V } from "../../core/a11y.js";
-import { SbbLanguageController as R, SbbPropertyWatcherController as $ } from "../../core/controllers.js";
-import { forceType as N } from "../../core/decorators.js";
-import { isLean as j } from "../../core/dom/lean-context.js";
-import { i18nSelectionRequired as G, i18nChipGroupInputDescription as U } from "../../core/i18n.js";
-import { SbbRequiredMixin as J, SbbDisabledMixin as P, SbbNegativeMixin as H, SbbFormAssociatedMixin as Q, SbbElementInternalsMixin as X } from "../../core/mixins.js";
-import { boxSizingStyles as Y } from "../../core/styles.js";
-import { SbbChipElement as Z } from "../chip.js";
-const tt = W`:host{width:100%;display:flex;flex-wrap:wrap;gap:var(--sbb-chip-group-gap);align-items:center;margin-block:var(--sbb-chip-group-margin-block)}:host(:is(:is(:state(size-s),[state--size-s]),:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: 0}:host(:is(:state(size-s),[state--size-s]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: .375rem .3125rem}@media(min-width:64rem){:host(:is(:state(size-s),[state--size-s]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: .3125rem .1875rem}}:host(:is(:state(without-label),[state--without-label]):is(:state(size-s),[state--size-s]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: 0 .4375rem}@media(min-width:64rem){:host(:is(:state(without-label),[state--without-label]):is(:state(size-s),[state--size-s]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: 0 .3125rem}}:host(:is(:is(:state(size-l),[state--size-l]),:is(:state(size-m),[state--size-m]))){--sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default) 0}@media(min-width:64rem){:host(:is(:is(:state(size-l),[state--size-l]),:is(:state(size-m),[state--size-m]))){--sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default-large) 0}}:host(:is(:state(without-label),[state--without-label]):is(:state(size-m),[state--size-m]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: .1875rem .6875rem}@media(min-width:64rem){:host(:is(:state(without-label),[state--without-label]):is(:state(size-m),[state--size-m]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: .1875rem .875rem}}:host(:is(:state(without-label),[state--without-label]):not(:is(:state(empty),[state--empty]),:is(:state(size-s),[state--size-s]),:is(:state(size-m),[state--size-m]),:is(:state(size-l),[state--size-l]))){--sbb-chip-group-margin-block: var(--sbb-chip-group-margin-block-no-label-not-empty)}:host(:not(:is(:state(without-label),[state--without-label])):is(:state(size-m),[state--size-m]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default) var(--_sbb-chip-group-margin-block-start-default-large)}@media(min-width:64rem){:host(:not(:is(:state(without-label),[state--without-label])):is(:state(size-m),[state--size-m]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default-large) var(--_sbb-chip-group-margin-block-start-default-large)}}:host(:not(:is(:state(without-label),[state--without-label]),:is(:state(empty),[state--empty]),:is(:state(size-s),[state--size-s]),:is(:state(size-m),[state--size-m]),:is(:state(size-l),[state--size-l]))){--sbb-chip-group-margin-block: var(--sbb-chip-group-margin-block-with-label-not-empty)}:host(:is(:state(without-label),[state--without-label]):is(:state(size-l),[state--size-l]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default) 1rem}@media(min-width:64rem){:host(:is(:state(without-label),[state--without-label]):is(:state(size-l),[state--size-l]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default-large) 1.25rem}}:host(:not(:is(:state(without-label),[state--without-label])):is(:state(size-l),[state--size-l]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default) .46875rem}@media(min-width:64rem){:host(:not(:is(:state(without-label),[state--without-label])):is(:state(size-l),[state--size-l]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default-large) .46875rem}}::slotted(input){flex:1 1 var(--sbb-chip-group-input-min-width);max-height:1.5rem}::slotted(sbb-chip){max-width:100%}`;
-let ct = (() => {
-  var b, m, c, l;
-  let i = [q("sbb-chip-group")], a, r = [], p, f = J(P(H(Q(X(T))))), v = [], z, w, k = [], E = [], C, S = [], x = [], I, O = [], A = [];
-  return l = class extends f {
+var I = (i, a, l) => a.has(i) || x("Cannot " + l);
+var d = (i, a, l) => (I(i, a, "read from private field"), l ? l.call(i) : a.get(i)), g = (i, a, l) => a.has(i) ? x("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(i) : a.set(i, l), h = (i, a, l, c) => (I(i, a, "write to private field"), c ? c.call(i, l) : a.set(i, l), l);
+import { __esDecorate as _, __runInitializers as p } from "tslib";
+import { css as B, isServer as O, html as D } from "lit";
+import { property as y } from "lit/decorators.js";
+import { isArrowKeyPressed as K, getNextElementIndex as L } from "../../core/a11y.js";
+import { SbbElement as W } from "../../core/base-elements.js";
+import { SbbLanguageController as T, SbbPropertyWatcherController as F } from "../../core/controllers.js";
+import { forceType as q } from "../../core/decorators.js";
+import { isLean as V } from "../../core/dom/lean-context.js";
+import { i18nSelectionRequired as M, i18nChipGroupInputDescription as N } from "../../core/i18n.js";
+import { SbbRequiredMixin as R, SbbDisabledMixin as $, SbbNegativeMixin as j, SbbFormAssociatedMixin as U } from "../../core/mixins.js";
+import { boxSizingStyles as J } from "../../core/styles.js";
+import { SbbChipElement as P } from "../chip/chip.component.js";
+const H = B`:host{width:100%;display:flex;flex-wrap:wrap;gap:var(--sbb-chip-group-gap);align-items:center;margin-block:var(--sbb-chip-group-margin-block)}:host(:is(:is(:state(size-s),[state--size-s]),:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: 0}:host(:is(:state(size-s),[state--size-s]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: .375rem .3125rem}@media(min-width:64rem){:host(:is(:state(size-s),[state--size-s]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: .3125rem .1875rem}}:host(:is(:state(without-label),[state--without-label]):is(:state(size-s),[state--size-s]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: 0 .4375rem}@media(min-width:64rem){:host(:is(:state(without-label),[state--without-label]):is(:state(size-s),[state--size-s]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: 0 .3125rem}}:host(:is(:is(:state(size-l),[state--size-l]),:is(:state(size-m),[state--size-m]))){--sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default) 0}@media(min-width:64rem){:host(:is(:is(:state(size-l),[state--size-l]),:is(:state(size-m),[state--size-m]))){--sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default-large) 0}}:host(:is(:state(without-label),[state--without-label]):is(:state(size-m),[state--size-m]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: .1875rem .6875rem}@media(min-width:64rem){:host(:is(:state(without-label),[state--without-label]):is(:state(size-m),[state--size-m]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: .1875rem .875rem}}:host(:is(:state(without-label),[state--without-label]):not(:is(:state(empty),[state--empty]),:is(:state(size-s),[state--size-s]),:is(:state(size-m),[state--size-m]),:is(:state(size-l),[state--size-l]))){--sbb-chip-group-margin-block: var(--sbb-chip-group-margin-block-no-label-not-empty)}:host(:not(:is(:state(without-label),[state--without-label])):is(:state(size-m),[state--size-m]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default) var(--_sbb-chip-group-margin-block-start-default-large)}@media(min-width:64rem){:host(:not(:is(:state(without-label),[state--without-label])):is(:state(size-m),[state--size-m]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default-large) var(--_sbb-chip-group-margin-block-start-default-large)}}:host(:not(:is(:state(without-label),[state--without-label]),:is(:state(empty),[state--empty]),:is(:state(size-s),[state--size-s]),:is(:state(size-m),[state--size-m]),:is(:state(size-l),[state--size-l]))){--sbb-chip-group-margin-block: var(--sbb-chip-group-margin-block-with-label-not-empty)}:host(:is(:state(without-label),[state--without-label]):is(:state(size-l),[state--size-l]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default) 1rem}@media(min-width:64rem){:host(:is(:state(without-label),[state--without-label]):is(:state(size-l),[state--size-l]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default-large) 1.25rem}}:host(:not(:is(:state(without-label),[state--without-label])):is(:state(size-l),[state--size-l]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default) .46875rem}@media(min-width:64rem){:host(:not(:is(:state(without-label),[state--without-label])):is(:state(size-l),[state--size-l]):not(:is(:state(empty),[state--empty]))){--sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default-large) .46875rem}}::slotted(input){flex:1 1 var(--sbb-chip-group-input-min-width);max-height:1.5rem}::slotted(sbb-chip){max-width:100%}`;
+let ht = (() => {
+  var u, m, b, r;
+  let i = R($(j(U(W)))), a = [], l, c, f = [], v = [], z, w = [], k = [], E, C = [], S = [];
+  return r = class extends i {
     constructor() {
       super();
-      g(this, b);
+      g(this, u);
       g(this, m);
-      g(this, c);
-      u(this, b, (h(this, v), h(this, k, null))), u(this, m, (h(this, E), h(this, S, ["Enter"]))), u(this, c, (h(this, x), h(this, O, !1))), this._inputAttributeObserver = (h(this, A), K ? null : new MutationObserver(() => this._reactToInputChanges())), this._language = new R(this), this.addEventListener?.(Z.events.requestdelete, (t) => this._deleteChip(t.target)), this.addEventListener?.("keydown", (t) => this._onChipKeyDown(t)), this.addController(new $(this, () => this.closest("sbb-form-field"), {
+      g(this, b);
+      h(this, u, (p(this, a), p(this, f, null))), h(this, m, (p(this, v), p(this, w, ["Enter"]))), h(this, b, (p(this, k), p(this, C, !1))), this._inputAttributeObserver = (p(this, S), O ? null : new MutationObserver(() => this._reactToInputChanges())), this._language = new T(this), this.addEventListener?.(P.events.requestdelete, (t) => this._deleteChip(t.target)), this.addEventListener?.("keydown", (t) => this._onChipKeyDown(t)), this.addController(new F(this, () => this.closest("sbb-form-field"), {
         size: (t) => this._updateSize(t.size),
         label: (t) => this._updateLabelState(t),
         hiddenLabel: (t) => this._updateLabelState(t)
@@ -36,7 +37,7 @@ let ct = (() => {
       const e = this.value, s = [...e];
       for (const n of t)
         s.includes(n) && s.splice(s.indexOf(n), 1);
-      s.forEach((n) => this._chipElements().find((L) => L.value === n)?.remove());
+      s.forEach((n) => this._chipElements().find((A) => A.value === n)?.remove());
       const o = [...t];
       for (const n of e)
         o.includes(n) && o.splice(o.indexOf(n), 1);
@@ -47,24 +48,24 @@ let ct = (() => {
     }
     /** Function that maps a chip's value to its display value. */
     get displayWith() {
-      return _(this, b);
+      return d(this, u);
     }
     set displayWith(t) {
-      u(this, b, t);
+      h(this, u, t);
     }
     /** The array of keys that will trigger a `chipinputtokenend` event. Default `['Enter']` */
     get separatorKeys() {
-      return _(this, m);
+      return d(this, m);
     }
     set separatorKeys(t) {
-      u(this, m, t);
+      h(this, m, t);
     }
     /** Whether to automatically add a chip when the input loses focus if there's a value. */
     get addOnBlur() {
-      return _(this, c);
+      return d(this, b);
     }
     set addOnBlur(t) {
-      u(this, c, t);
+      h(this, b, t);
     }
     _updateLabelState(t) {
       this.toggleState("without-label", !t.label || t.hiddenLabel);
@@ -94,7 +95,7 @@ let ct = (() => {
       return super.shouldValidate(t) || t === "required" || t === "value";
     }
     validate() {
-      super.validate(), this.required && this.value.length === 0 ? this.setValidityFlag("valueMissing", G[this._language.current]) : this.removeValidityFlag("valueMissing");
+      super.validate(), this.required && this.value.length === 0 ? this.setValidityFlag("valueMissing", M[this._language.current]) : this.removeValidityFlag("valueMissing");
     }
     /** Return the list of chip elements **/
     _chipElements() {
@@ -118,7 +119,7 @@ let ct = (() => {
       }), this._inputAttributeObserver?.observe(this._inputElement, {
         attributes: !0,
         attributeFilter: ["readonly", "disabled"]
-      })), (!this._previousSize || !this.closest("sbb-form-field")) && this._updateSize(j() ? "s" : "m"), this.toggleState("empty", this.value.length === 0), this._reactToInputChanges(), this._updateInputDescription(), this.updateFormValue();
+      })), (!this._previousSize || !this.closest("sbb-form-field")) && this._updateSize(V() ? "s" : "m"), this.toggleState("empty", this.value.length === 0), this._reactToInputChanges(), this._updateInputDescription(), this.updateFormValue();
     }
     /**
      * Listen for keyboard events on the chip elements
@@ -126,8 +127,8 @@ let ct = (() => {
     _onChipKeyDown(t) {
       const e = t.target;
       if (e.localName === "sbb-chip") {
-        if (M(t)) {
-          const s = this._enabledChipElements(), o = V(t, s.indexOf(e), s.length);
+        if (K(t)) {
+          const s = this._enabledChipElements(), o = L(t, s.indexOf(e), s.length);
           s[o].focus();
           return;
         }
@@ -208,7 +209,7 @@ let ct = (() => {
       this.dispatchEvent(new InputEvent("input", { bubbles: !0, composed: !0 })), this.dispatchEvent(new Event("change", { bubbles: !0 }));
     }
     _createChipElement(t, e) {
-      if (K)
+      if (O)
         return;
       const s = document.createElement("sbb-chip");
       s.value = t, s.innerText = e ?? (t ? this.displayWith?.(t) : null) ?? "", this.insertBefore(s, this._inputElement ?? this.querySelector("input"));
@@ -225,28 +226,28 @@ let ct = (() => {
       this._previousSize && this.internals.states.delete(`size-${this._previousSize}`), this._previousSize = t, this._previousSize && this.internals.states.add(`size-${this._previousSize}`);
     }
     _updateInputDescription() {
-      this._inputElement && this._inputElement.setAttribute("aria-description", `${U[this._language.current]} ${this.value.length}`);
+      this._inputElement && this._inputElement.setAttribute("aria-description", `${N[this._language.current]} ${this.value.length}`);
     }
     render() {
-      return F`<slot @slotchange=${this._setupComponent}></slot>`;
+      return D`<slot @slotchange=${this._setupComponent}></slot>`;
     }
-  }, b = new WeakMap(), m = new WeakMap(), c = new WeakMap(), p = l, (() => {
-    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(f[Symbol.metadata] ?? null) : void 0;
-    z = [y({ type: Array })], w = [y({ attribute: !1 })], C = [y({ attribute: "separator-keys", type: Array })], I = [N(), y({ attribute: "add-on-blur", type: Boolean })], d(l, null, z, { kind: "setter", name: "value", static: !1, private: !1, access: { has: (e) => "value" in e, set: (e, s) => {
+  }, u = new WeakMap(), m = new WeakMap(), b = new WeakMap(), (() => {
+    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(i[Symbol.metadata] ?? null) : void 0;
+    l = [y({ type: Array })], c = [y({ attribute: !1 })], z = [y({ attribute: "separator-keys", type: Array })], E = [q(), y({ attribute: "add-on-blur", type: Boolean })], _(r, null, l, { kind: "setter", name: "value", static: !1, private: !1, access: { has: (e) => "value" in e, set: (e, s) => {
       e.value = s;
-    } }, metadata: t }, null, v), d(l, null, w, { kind: "accessor", name: "displayWith", static: !1, private: !1, access: { has: (e) => "displayWith" in e, get: (e) => e.displayWith, set: (e, s) => {
+    } }, metadata: t }, null, a), _(r, null, c, { kind: "accessor", name: "displayWith", static: !1, private: !1, access: { has: (e) => "displayWith" in e, get: (e) => e.displayWith, set: (e, s) => {
       e.displayWith = s;
-    } }, metadata: t }, k, E), d(l, null, C, { kind: "accessor", name: "separatorKeys", static: !1, private: !1, access: { has: (e) => "separatorKeys" in e, get: (e) => e.separatorKeys, set: (e, s) => {
+    } }, metadata: t }, f, v), _(r, null, z, { kind: "accessor", name: "separatorKeys", static: !1, private: !1, access: { has: (e) => "separatorKeys" in e, get: (e) => e.separatorKeys, set: (e, s) => {
       e.separatorKeys = s;
-    } }, metadata: t }, S, x), d(l, null, I, { kind: "accessor", name: "addOnBlur", static: !1, private: !1, access: { has: (e) => "addOnBlur" in e, get: (e) => e.addOnBlur, set: (e, s) => {
+    } }, metadata: t }, w, k), _(r, null, E, { kind: "accessor", name: "addOnBlur", static: !1, private: !1, access: { has: (e) => "addOnBlur" in e, get: (e) => e.addOnBlur, set: (e, s) => {
       e.addOnBlur = s;
-    } }, metadata: t }, O, A), d(null, a = { value: p }, i, { kind: "class", name: p.name, metadata: t }, null, r), p = a.value, t && Object.defineProperty(p, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
-  })(), l.role = "listbox", l.styles = [Y, tt], l.events = {
+    } }, metadata: t }, C, S), t && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
+  })(), r.elementName = "sbb-chip-group", r.role = "listbox", r.styles = [J, H], r.events = {
     input: "input",
     change: "change",
     chipinputtokenend: "chipinputtokenend"
-  }, h(p, r), p;
+  }, r;
 })();
 export {
-  ct as SbbChipGroupElement
+  ht as SbbChipGroupElement
 };

package/chip/chip-group.js

@@ -1,4 +1,7 @@
-import { SbbChipGroupElement as p } from "./chip-group/chip-group.component.js";
+import { SbbChipGroupElement as e } from "./chip-group/chip-group.component.js";
+e.define();
+console.warn(`The entrypoint '@sbb-esta/elements/chip/chip-group.js' has been deprecated.
+Use either '@sbb-esta/elements/chip.js' or '@sbb-esta/elements/chip.pure.js' instead.`);
 export {
-  p as SbbChipGroupElement
+  e as SbbChipGroupElement
 };