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

package/timetable-form/timetable-form-swap-button.js

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

package/timetable-form/timetable-form.js

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

package/timetable-form.js

@@ -1,10 +1,14 @@
-import { SbbTimetableFormElement as t } from "./timetable-form/timetable-form/timetable-form.component.js";
-import { SbbTimetableFormDetailsElement as b } from "./timetable-form/timetable-form-details/timetable-form-details.component.js";
-import { SbbTimetableFormFieldElement as l } from "./timetable-form/timetable-form-field/timetable-form-field.component.js";
-import { SbbTimetableFormSwapButtonElement as i } from "./timetable-form/timetable-form-swap-button/timetable-form-swap-button.component.js";
+import { SbbTimetableFormDetailsElement as e } from "./timetable-form/timetable-form-details/timetable-form-details.component.js";
+import { SbbTimetableFormFieldElement as m } from "./timetable-form/timetable-form-field/timetable-form-field.component.js";
+import { SbbTimetableFormSwapButtonElement as t } from "./timetable-form/timetable-form-swap-button/timetable-form-swap-button.component.js";
+import { SbbTimetableFormElement as i } from "./timetable-form/timetable-form/timetable-form.component.js";
+i.define();
+e.define();
+m.define();
+t.define();
 export {
-  b as SbbTimetableFormDetailsElement,
-  t as SbbTimetableFormElement,
-  l as SbbTimetableFormFieldElement,
-  i as SbbTimetableFormSwapButtonElement
+  e as SbbTimetableFormDetailsElement,
+  i as SbbTimetableFormElement,
+  m as SbbTimetableFormFieldElement,
+  t as SbbTimetableFormSwapButtonElement
 };

package/timetable-form.pure.js

@@ -0,0 +1,10 @@
+import { SbbTimetableFormDetailsElement as t } from "./timetable-form/timetable-form-details/timetable-form-details.component.js";
+import { SbbTimetableFormFieldElement as b } from "./timetable-form/timetable-form-field/timetable-form-field.component.js";
+import { SbbTimetableFormSwapButtonElement as l } from "./timetable-form/timetable-form-swap-button/timetable-form-swap-button.component.js";
+import { SbbTimetableFormElement as i } from "./timetable-form/timetable-form/timetable-form.component.js";
+export {
+  t as SbbTimetableFormDetailsElement,
+  i as SbbTimetableFormElement,
+  b as SbbTimetableFormFieldElement,
+  l as SbbTimetableFormSwapButtonElement
+};

package/timetable-occupancy/timetable-occupancy.component.js

@@ -1,60 +1,61 @@
-var x = (s) => {
+var g = (s) => {
   throw TypeError(s);
 };
-var z = (s, t, a) => t.has(s) || x("Cannot " + a);
-var u = (s, t, a) => (z(s, t, "read from private field"), a ? a.call(s) : t.get(s)), m = (s, t, a) => t.has(s) ? x("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(s) : t.set(s, a), o = (s, t, a, i) => (z(s, t, "write to private field"), i ? i.call(s, a) : t.set(s, a), a);
-import { __runInitializers as b, __esDecorate as y } from "tslib";
-import { css as S, LitElement as $, nothing as k, html as f } from "lit";
-import { customElement as E, property as w } from "lit/decorators.js";
-import { SbbLanguageController as I } from "../core/controllers.js";
-import { i18nClass as D } from "../core/i18n.js";
-import { SbbNegativeMixin as j } from "../core/mixins.js";
-import { boxSizingStyles as L } from "../core/styles.js";
+var _ = (s, t, e) => t.has(s) || g("Cannot " + e);
+var u = (s, t, e) => (_(s, t, "read from private field"), e ? e.call(s) : t.get(s)), m = (s, t, e) => t.has(s) ? g("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(s) : t.set(s, e), o = (s, t, e, r) => (_(s, t, "write to private field"), r ? r.call(s, e) : t.set(s, e), e);
+import { __runInitializers as b, __esDecorate as C } from "tslib";
+import { css as v, nothing as x, html as y } from "lit";
+import { property as O } from "lit/decorators.js";
+import { SbbElement as z } from "../core/base-elements.js";
+import { SbbLanguageController as w } from "../core/controllers.js";
+import { i18nClass as $ } from "../core/i18n.js";
+import { SbbNegativeMixin as S } from "../core/mixins.js";
+import { boxSizingStyles as k } from "../core/styles.js";
 import "../screen-reader-only.js";
 import "../timetable-occupancy-icon.js";
-const T = S`:host{display:inline-block;--sbb-timetable-occupancy-color: var(--sbb-color-2);--sbb-icon-svg-width: .890625rem;--sbb-icon-svg-height: v0.75rem}@media(min-width:64rem){:host{--sbb-icon-svg-width: 1.1875rem;--sbb-icon-svg-height: v1rem}}:host([negative]){--sbb-timetable-occupancy-color: var(--sbb-color-2-negative)}.sbb-timetable-occupancy__list{list-style:none;margin:0;padding:0;font-size:inherit;display:flex;align-items:center;flex-wrap:nowrap;gap:var(--sbb-spacing-fixed-2x)}.sbb-timetable-occupancy__list-item{display:flex;align-items:center;flex-wrap:nowrap;gap:var(--sbb-spacing-fixed-1x)}.sbb-timetable-occupancy__list-item-class{--sbb-text-font-size: var(--sbb-text-font-size-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);line-height:1;color:var(--sbb-timetable-occupancy-color)}.sbb-timetable-occupancy__list-item-icon{display:flex}`;
-let Q = (() => {
-  var l, r, n;
-  let s = [E("sbb-timetable-occupancy")], t, a = [], i, h = j($), d, _ = [], g = [], O, C = [], v = [];
-  return n = class extends h {
+const I = v`:host{display:inline-block;--sbb-timetable-occupancy-color: var(--sbb-color-2);--sbb-icon-svg-width: .890625rem;--sbb-icon-svg-height: v0.75rem}@media(min-width:64rem){:host{--sbb-icon-svg-width: 1.1875rem;--sbb-icon-svg-height: v1rem}}:host([negative]){--sbb-timetable-occupancy-color: var(--sbb-color-2-negative)}.sbb-timetable-occupancy__list{list-style:none;margin:0;padding:0;font-size:inherit;display:flex;align-items:center;flex-wrap:nowrap;gap:var(--sbb-spacing-fixed-2x)}.sbb-timetable-occupancy__list-item{display:flex;align-items:center;flex-wrap:nowrap;gap:var(--sbb-spacing-fixed-1x)}.sbb-timetable-occupancy__list-item-class{--sbb-text-font-size: var(--sbb-text-font-size-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size);line-height:1;color:var(--sbb-timetable-occupancy-color)}.sbb-timetable-occupancy__list-item-icon{display:flex}`;
+let J = (() => {
+  var n, l, i;
+  let s = S(z), t, e = [], r = [], f, h = [], d = [];
+  return i = class extends s {
     constructor() {
       super(...arguments);
+      m(this, n);
       m(this, l);
-      m(this, r);
-      o(this, l, b(this, _, null)), o(this, r, (b(this, g), b(this, C, null))), this._language = (b(this, v), new I(this));
+      o(this, n, b(this, e, null)), o(this, l, (b(this, r), b(this, h, null))), this._language = (b(this, d), new w(this));
     }
     /** Occupancy for first class wagons. */
     get firstClassOccupancy() {
-      return u(this, l);
+      return u(this, n);
     }
-    set firstClassOccupancy(c) {
-      o(this, l, c);
+    set firstClassOccupancy(a) {
+      o(this, n, a);
     }
     /** Occupancy for second class wagons. */
     get secondClassOccupancy() {
-      return u(this, r);
+      return u(this, l);
     }
-    set secondClassOccupancy(c) {
-      o(this, r, c);
+    set secondClassOccupancy(a) {
+      o(this, l, a);
     }
     render() {
-      return f` ${(this.firstClassOccupancy || this.secondClassOccupancy) && f`
+      return y` ${(this.firstClassOccupancy || this.secondClassOccupancy) && y`
       <ul
         class="sbb-timetable-occupancy__list"
-        role=${!this.firstClassOccupancy || !this.secondClassOccupancy ? "presentation" : k}
+        role=${!this.firstClassOccupancy || !this.secondClassOccupancy ? "presentation" : x}
       >
-        ${[this.firstClassOccupancy, this.secondClassOccupancy].map((c, e) => c && f`
+        ${[this.firstClassOccupancy, this.secondClassOccupancy].map((a, c) => a && y`
               <li class="sbb-timetable-occupancy__list-item">
                 <span class="sbb-timetable-occupancy__list-item-class" aria-hidden="true">
-                  ${this.firstClassOccupancy && e === 0 ? "1" : "2"}.
+                  ${this.firstClassOccupancy && c === 0 ? "1" : "2"}.
                 </span>
                 <sbb-screen-reader-only>
-                  ${`${D[this.firstClassOccupancy && e === 0 ? "first" : "second"][this._language.current]}.`}
+                  ${`${$[this.firstClassOccupancy && c === 0 ? "first" : "second"][this._language.current]}.`}
                 </sbb-screen-reader-only>
                 <sbb-timetable-occupancy-icon
                   class="sbb-timetable-occupancy__list-item-icon"
                   ?negative=${this.negative}
-                  .occupancy=${c}
+                  .occupancy=${a}
                 >
                 </sbb-timetable-occupancy-icon>
               </li>
@@ -62,15 +63,15 @@ let Q = (() => {
       </ul>
     `}`;
     }
-  }, l = new WeakMap(), r = new WeakMap(), i = n, (() => {
-    const c = typeof Symbol == "function" && Symbol.metadata ? Object.create(h[Symbol.metadata] ?? null) : void 0;
-    d = [w({ attribute: "first-class-occupancy" })], O = [w({ attribute: "second-class-occupancy" })], y(n, null, d, { kind: "accessor", name: "firstClassOccupancy", static: !1, private: !1, access: { has: (e) => "firstClassOccupancy" in e, get: (e) => e.firstClassOccupancy, set: (e, p) => {
-      e.firstClassOccupancy = p;
-    } }, metadata: c }, _, g), y(n, null, O, { kind: "accessor", name: "secondClassOccupancy", static: !1, private: !1, access: { has: (e) => "secondClassOccupancy" in e, get: (e) => e.secondClassOccupancy, set: (e, p) => {
-      e.secondClassOccupancy = p;
-    } }, metadata: c }, C, v), y(null, t = { value: i }, s, { kind: "class", name: i.name, metadata: c }, null, a), i = t.value, c && Object.defineProperty(i, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: c });
-  })(), n.styles = [L, T], b(i, a), i;
+  }, n = new WeakMap(), l = new WeakMap(), (() => {
+    const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(s[Symbol.metadata] ?? null) : void 0;
+    t = [O({ attribute: "first-class-occupancy" })], f = [O({ attribute: "second-class-occupancy" })], C(i, null, t, { kind: "accessor", name: "firstClassOccupancy", static: !1, private: !1, access: { has: (c) => "firstClassOccupancy" in c, get: (c) => c.firstClassOccupancy, set: (c, p) => {
+      c.firstClassOccupancy = p;
+    } }, metadata: a }, e, r), C(i, null, f, { kind: "accessor", name: "secondClassOccupancy", static: !1, private: !1, access: { has: (c) => "secondClassOccupancy" in c, get: (c) => c.secondClassOccupancy, set: (c, p) => {
+      c.secondClassOccupancy = p;
+    } }, metadata: a }, h, d), a && Object.defineProperty(i, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: a });
+  })(), i.elementName = "sbb-timetable-occupancy", i.styles = [k, I], i;
 })();
 export {
-  Q as SbbTimetableOccupancyElement
+  J as SbbTimetableOccupancyElement
 };

package/timetable-occupancy-icon/timetable-occupancy-icon.component.js

@@ -1,61 +1,61 @@
-var d = (t) => {
-  throw TypeError(t);
+var l = (e) => {
+  throw TypeError(e);
 };
-var p = (t, a, s) => a.has(t) || d("Cannot " + s);
-var _ = (t, a, s) => (p(t, a, "read from private field"), s ? s.call(t) : a.get(t)), y = (t, a, s) => a.has(t) ? d("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(t) : a.set(t, s), l = (t, a, s, c) => (p(t, a, "write to private field"), c ? c.call(t, s) : a.set(t, s), s);
-import { __runInitializers as n, __esDecorate as f } from "tslib";
-import { customElement as A, property as C } from "lit/decorators.js";
-import { SbbLanguageController as L, SbbMediaMatcherController as M, SbbMediaQueryForcedColors as g, SbbDarkModeController as w } from "../core/controllers.js";
-import { i18nOccupancy as I } from "../core/i18n.js";
-import { SbbNegativeMixin as k } from "../core/mixins.js";
-import { SbbIconBase as v } from "../icon.js";
-import { css as N } from "lit";
-const x = N`@media(forced-colors:active)and (prefers-color-scheme:light){:host svg{filter:invert(1)}}`;
-let H = (() => {
-  var o, i;
-  let t = [A("sbb-timetable-occupancy-icon")], a, s = [], c, u = k(v), h, m = [], b = [];
-  return i = class extends u {
+var h = (e, a, s) => a.has(e) || l("Cannot " + s);
+var u = (e, a, s) => (h(e, a, "read from private field"), s ? s.call(e) : a.get(e)), m = (e, a, s) => a.has(e) ? l("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(e) : a.set(e, s), n = (e, a, s, o) => (h(e, a, "write to private field"), o ? o.call(e, s) : a.set(e, s), s);
+import { __runInitializers as d, __esDecorate as y } from "tslib";
+import { property as _ } from "lit/decorators.js";
+import { SbbLanguageController as g, SbbMediaMatcherController as v, SbbMediaQueryForcedColors as p, SbbDarkModeController as A } from "../core/controllers.js";
+import { i18nOccupancy as S } from "../core/i18n.js";
+import { SbbNegativeMixin as C } from "../core/mixins.js";
+import { SbbIconBase as b } from "../icon.js";
+import { css as L } from "lit";
+const M = L`@media(forced-colors:active)and (prefers-color-scheme:light){:host svg{filter:invert(1)}}`;
+let B = (() => {
+  var c, i;
+  let e = C(b), a, s = [], o = [];
+  return i = class extends e {
     constructor() {
       super(...arguments);
-      y(this, o);
-      l(this, o, n(this, m, "none")), this._language = (n(this, b), new L(this).withHandler(() => this._setAriaLabel())), this._mediaMatcher = new M(this, {
-        [g]: (e) => {
-          this._forcedColors = e, this._setNameAndAriaLabel();
+      m(this, c);
+      n(this, c, d(this, s, "none")), this._language = (d(this, o), new g(this).withHandler(() => this._setAriaLabel())), this._mediaMatcher = new v(this, {
+        [p]: (t) => {
+          this._forcedColors = t, this._setNameAndAriaLabel();
         }
-      }), this._darkModeController = new w(this, () => this._setNameAndAriaLabel()), this._forcedColors = this._mediaMatcher.matches(g) ?? !1;
+      }), this._darkModeController = new A(this, () => this._setNameAndAriaLabel()), this._forcedColors = this._mediaMatcher.matches(p) ?? !1;
     }
     /** Wagon occupancy. */
     get occupancy() {
-      return _(this, o);
+      return u(this, c);
     }
-    set occupancy(e) {
-      l(this, o, e);
+    set occupancy(t) {
+      n(this, c, t);
     }
     async _setNameAndAriaLabel() {
       if (!this.occupancy)
         return;
-      let e = `utilization-${this.occupancy}`;
-      this._forcedColors ? e += "-high-contrast" : (this.negative || this._darkModeController.matches()) && (e += "-negative"), await this.loadSvgIcon(e);
+      let t = `utilization-${this.occupancy}`;
+      this._forcedColors ? t += "-high-contrast" : (this.negative || this._darkModeController.matches()) && (t += "-negative"), await this.loadSvgIcon(t);
     }
-    async fetchSvgIcon(e, r) {
-      return this._setAriaLabel(), super.fetchSvgIcon(e, r);
+    async fetchSvgIcon(t, r) {
+      return this._setAriaLabel(), super.fetchSvgIcon(t, r);
     }
     _setAriaLabel() {
-      this.internals.ariaLabel = I[this.occupancy]?.[this._language.current];
+      this.internals.ariaLabel = S[this.occupancy]?.[this._language.current];
     }
     connectedCallback() {
       super.connectedCallback(), this._setNameAndAriaLabel();
     }
-    willUpdate(e) {
-      super.willUpdate(e), (e.has("occupancy") || e.has("negative")) && this._setNameAndAriaLabel();
+    willUpdate(t) {
+      super.willUpdate(t), (t.has("occupancy") || t.has("negative")) && this._setNameAndAriaLabel();
     }
-  }, o = new WeakMap(), c = i, (() => {
-    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(u[Symbol.metadata] ?? null) : void 0;
-    h = [C()], f(i, null, h, { kind: "accessor", name: "occupancy", static: !1, private: !1, access: { has: (r) => "occupancy" in r, get: (r) => r.occupancy, set: (r, S) => {
-      r.occupancy = S;
-    } }, metadata: e }, m, b), f(null, a = { value: c }, t, { kind: "class", name: c.name, metadata: e }, null, s), c = a.value, e && Object.defineProperty(c, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
-  })(), i.styles = [v.styles, x], n(c, s), c;
+  }, c = new WeakMap(), (() => {
+    const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(e[Symbol.metadata] ?? null) : void 0;
+    a = [_()], y(i, null, a, { kind: "accessor", name: "occupancy", static: !1, private: !1, access: { has: (r) => "occupancy" in r, get: (r) => r.occupancy, set: (r, f) => {
+      r.occupancy = f;
+    } }, metadata: t }, s, o), t && Object.defineProperty(i, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
+  })(), i.elementName = "sbb-timetable-occupancy-icon", i.styles = [b.styles, M], i;
 })();
 export {
-  H as SbbTimetableOccupancyIconElement
+  B as SbbTimetableOccupancyIconElement
 };

package/timetable-occupancy-icon.js

@@ -1,4 +1,5 @@
-import { SbbTimetableOccupancyIconElement as b } from "./timetable-occupancy-icon/timetable-occupancy-icon.component.js";
+import { SbbTimetableOccupancyIconElement as e } from "./timetable-occupancy-icon/timetable-occupancy-icon.component.js";
+e.define();
 export {
-  b as SbbTimetableOccupancyIconElement
+  e as SbbTimetableOccupancyIconElement
 };

package/timetable-occupancy-icon.pure.js

@@ -0,0 +1,4 @@
+import { SbbTimetableOccupancyIconElement as b } from "./timetable-occupancy-icon/timetable-occupancy-icon.component.js";
+export {
+  b as SbbTimetableOccupancyIconElement
+};

package/timetable-occupancy.js

@@ -1,4 +1,5 @@
-import { SbbTimetableOccupancyElement as c } from "./timetable-occupancy/timetable-occupancy.component.js";
+import { SbbTimetableOccupancyElement as e } from "./timetable-occupancy/timetable-occupancy.component.js";
+e.define();
 export {
-  c as SbbTimetableOccupancyElement
+  e as SbbTimetableOccupancyElement
 };

package/timetable-occupancy.pure.js

@@ -0,0 +1,4 @@
+import { SbbTimetableOccupancyElement as c } from "./timetable-occupancy/timetable-occupancy.component.js";
+export {
+  c as SbbTimetableOccupancyElement
+};

package/title/title-base.js

@@ -3,21 +3,21 @@ var d = (e) => {
 };
 var z = (e, t, l) => t.has(e) || d("Cannot " + l);
 var h = (e, t, l) => (z(e, t, "read from private field"), l ? l.call(e) : t.get(e)), u = (e, t, l) => t.has(e) ? d("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(e) : t.set(e, l), c = (e, t, l, r) => (z(e, t, "write to private field"), r ? r.call(e, l) : t.set(e, l), l);
-import { __esDecorate as p, __runInitializers as o } from "tslib";
-import { css as y, LitElement as L } from "lit";
+import { __esDecorate as p, __runInitializers as n } from "tslib";
 import { property as _ } from "lit/decorators.js";
-import { html as x } from "lit/static-html.js";
-import { SbbElementInternalsMixin as w } from "../core/mixins.js";
-const k = y`:host{margin-block:var(--sbb-title-margin-block, 0);margin-inline:0;font-family:var(--sbb-typo-font-family);font-weight:700;line-height:var(--sbb-title-line-height, var(--sbb-typo-line-height-heading));letter-spacing:var(--sbb-typo-letter-spacing-heading);font-size:var(--sbb-title-font-size);--sbb-title-text-color-normal: var(--sbb-title-text-color-normal-override, var(--sbb-color-3));display:block;color:var(--sbb-title-text-color-normal)}:host([id]){scroll-margin-block-start:var(--sbb-spacing-fixed-10x)}:host(:where([level="1"]:not([visual-level]),[visual-level="1"])){--sbb-title-font-size: var(--sbb-title-font-size-level-1-lean, var(--sbb-heading-font-size-1))}:host(:where([level="2"]:not([visual-level]),[visual-level="2"])){--sbb-title-font-size: var(--sbb-title-font-size-level-2-lean, var(--sbb-heading-font-size-2))}:host(:where([level="3"]:not([visual-level]),[visual-level="3"])){--sbb-title-font-size: var(--sbb-title-font-size-level-3-lean, var(--sbb-heading-font-size-3))}:host(:where([level="4"]:not([visual-level]),[visual-level="4"])){--sbb-title-font-size: var(--sbb-title-font-size-level-4-lean, var(--sbb-heading-font-size-4))}:host(:where([level="5"]:not([visual-level]),[visual-level="5"])){--sbb-title-font-size: var(--sbb-title-font-size-level-5-lean, var(--sbb-heading-font-size-5))}:host(:where([level="6"]:not([visual-level]),[visual-level="6"])){--sbb-title-font-size: var(--sbb-title-font-size-level-6-lean, var(--sbb-heading-font-size-6));--sbb-title-line-height: var(--sbb-typo-line-height-text)}`;
-let M = (() => {
-  var v, n, a;
-  let e = w(L), t, l = [], r = [], f, m = [], g = [];
+import { html as y } from "lit/static-html.js";
+import { SbbElement as L } from "../core/base-elements.js";
+import { css as w } from "lit";
+const x = w`:host{margin-block:var(--sbb-title-margin-block, 0);margin-inline:0;font-family:var(--sbb-typo-font-family);font-weight:700;line-height:var(--sbb-title-line-height, var(--sbb-typo-line-height-heading));letter-spacing:var(--sbb-typo-letter-spacing-heading);font-size:var(--sbb-title-font-size);--sbb-title-text-color-normal: var(--sbb-title-text-color-normal-override, var(--sbb-color-3));display:block;color:var(--sbb-title-text-color-normal)}:host([id]){scroll-margin-block-start:var(--sbb-spacing-fixed-10x)}:host(:where([level="1"]:not([visual-level]),[visual-level="1"])){--sbb-title-font-size: var(--sbb-title-font-size-level-1-lean, var(--sbb-heading-font-size-1))}:host(:where([level="2"]:not([visual-level]),[visual-level="2"])){--sbb-title-font-size: var(--sbb-title-font-size-level-2-lean, var(--sbb-heading-font-size-2))}:host(:where([level="3"]:not([visual-level]),[visual-level="3"])){--sbb-title-font-size: var(--sbb-title-font-size-level-3-lean, var(--sbb-heading-font-size-3))}:host(:where([level="4"]:not([visual-level]),[visual-level="4"])){--sbb-title-font-size: var(--sbb-title-font-size-level-4-lean, var(--sbb-heading-font-size-4))}:host(:where([level="5"]:not([visual-level]),[visual-level="5"])){--sbb-title-font-size: var(--sbb-title-font-size-level-5-lean, var(--sbb-heading-font-size-5))}:host(:where([level="6"]:not([visual-level]),[visual-level="6"])){--sbb-title-font-size: var(--sbb-title-font-size-level-6-lean, var(--sbb-heading-font-size-6));--sbb-title-line-height: var(--sbb-typo-line-height-text)}`;
+let E = (() => {
+  var v, o, a;
+  let e = L, t, l = [], r = [], f, m = [], g = [];
   return a = class extends e {
     constructor() {
       super(...arguments);
-      u(this, v, o(this, l, "1"));
-      u(this, n, (o(this, r), o(this, m, null)));
-      o(this, g);
+      u(this, v, n(this, l, "1"));
+      u(this, o, (n(this, r), n(this, m, null)));
+      n(this, g);
     }
     /** Title level */
     get level() {
@@ -28,26 +28,26 @@ let M = (() => {
     }
     /** Visual level for the title. */
     get visualLevel() {
-      return h(this, n);
+      return h(this, o);
     }
     set visualLevel(s) {
-      c(this, n, s);
+      c(this, o, s);
     }
     willUpdate(s) {
       super.willUpdate(s), s.has("level") && (this.internals.ariaLevel = this.level);
     }
     render() {
-      return x`<slot></slot>`;
+      return y`<slot></slot>`;
     }
-  }, v = new WeakMap(), n = new WeakMap(), (() => {
+  }, v = new WeakMap(), o = new WeakMap(), (() => {
     const s = typeof Symbol == "function" && Symbol.metadata ? Object.create(e[Symbol.metadata] ?? null) : void 0;
     t = [_({ reflect: !0 })], f = [_({ attribute: "visual-level", reflect: !0 })], p(a, null, t, { kind: "accessor", name: "level", static: !1, private: !1, access: { has: (i) => "level" in i, get: (i) => i.level, set: (i, b) => {
       i.level = b;
     } }, metadata: s }, l, r), p(a, null, f, { kind: "accessor", name: "visualLevel", static: !1, private: !1, access: { has: (i) => "visualLevel" in i, get: (i) => i.visualLevel, set: (i, b) => {
       i.visualLevel = b;
     } }, metadata: s }, m, g), s && Object.defineProperty(a, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: s });
-  })(), a.role = "heading", a.styles = k, a;
+  })(), a.role = "heading", a.styles = x, a;
 })();
 export {
-  M as SbbTitleBase
+  E as SbbTitleBase
 };

package/title/title.component.js

@@ -1,37 +1,37 @@
-var u = (e) => {
+var b = (e) => {
   throw TypeError(e);
 };
-var g = (e, l, a) => l.has(e) || u("Cannot " + a);
-var h = (e, l, a) => (g(e, l, "read from private field"), a ? a.call(e) : l.get(e)), d = (e, l, a) => l.has(e) ? u("Cannot add the same private member more than once") : l instanceof WeakSet ? l.add(e) : l.set(e, a), k = (e, l, a, t) => (g(e, l, "write to private field"), t ? t.call(e, a) : l.set(e, a), a);
-import { __esDecorate as _, __runInitializers as n } from "tslib";
-import { customElement as y, property as L } from "lit/decorators.js";
-import { SbbNegativeMixin as S } from "../core/mixins.js";
-import { SbbTitleBase as p } from "./title-base.js";
-import { css as w } from "lit";
-const x = w`:host([negative]){--sbb-title-text-color-normal: var(--sbb-color-3-negative)}:host(:where([level="1"]:not([visual-level]),[visual-level="1"])){--sbb-title-margin-block: var( --sbb-heading-margin-block-1-lean, var(--sbb-heading-margin-block-1) )}:host(:where([level="2"]:not([visual-level]),[visual-level="2"])){--sbb-title-margin-block: var( --sbb-heading-margin-block-2-lean, var(--sbb-heading-margin-block-2) )}:host(:where([level="3"]:not([visual-level]),[visual-level="3"])){--sbb-title-margin-block: var( --sbb-heading-margin-block-3-lean, var(--sbb-heading-margin-block-3) )}:host(:where([level="4"]:not([visual-level]),[visual-level="4"])){--sbb-title-margin-block: var( --sbb-heading-margin-block-4-lean, var(--sbb-heading-margin-block-4) )}:host(:where([level="5"]:not([visual-level]),[visual-level="5"])){--sbb-title-margin-block: var( --sbb-heading-margin-block-5-lean, var(--sbb-heading-margin-block-5) )}:host(:where([level="6"]:not([visual-level]),[visual-level="6"])){--sbb-title-margin-block: var( --sbb-heading-margin-block-6-lean, var(--sbb-heading-margin-block-6) )}`;
-let B = (() => {
-  var r, s;
-  let e = [y("sbb-title")], l, a = [], t, v = S(p), o, c = [], m = [];
-  return s = class extends v {
+var n = (e, l, a) => l.has(e) || b("Cannot " + a);
+var o = (e, l, a) => (n(e, l, "read from private field"), a ? a.call(e) : l.get(e)), c = (e, l, a) => l.has(e) ? b("Cannot add the same private member more than once") : l instanceof WeakSet ? l.add(e) : l.set(e, a), u = (e, l, a, i) => (n(e, l, "write to private field"), i ? i.call(e, a) : l.set(e, a), a);
+import { __esDecorate as d, __runInitializers as m } from "tslib";
+import { property as k } from "lit/decorators.js";
+import { SbbNegativeMixin as f } from "../core/mixins.js";
+import { SbbTitleBase as g } from "./title-base.js";
+import { css as p } from "lit";
+const y = p`:host([negative]){--sbb-title-text-color-normal: var(--sbb-color-3-negative)}:host(:where([level="1"]:not([visual-level]),[visual-level="1"])){--sbb-title-margin-block: var( --sbb-heading-margin-block-1-lean, var(--sbb-heading-margin-block-1) )}:host(:where([level="2"]:not([visual-level]),[visual-level="2"])){--sbb-title-margin-block: var( --sbb-heading-margin-block-2-lean, var(--sbb-heading-margin-block-2) )}:host(:where([level="3"]:not([visual-level]),[visual-level="3"])){--sbb-title-margin-block: var( --sbb-heading-margin-block-3-lean, var(--sbb-heading-margin-block-3) )}:host(:where([level="4"]:not([visual-level]),[visual-level="4"])){--sbb-title-margin-block: var( --sbb-heading-margin-block-4-lean, var(--sbb-heading-margin-block-4) )}:host(:where([level="5"]:not([visual-level]),[visual-level="5"])){--sbb-title-margin-block: var( --sbb-heading-margin-block-5-lean, var(--sbb-heading-margin-block-5) )}:host(:where([level="6"]:not([visual-level]),[visual-level="6"])){--sbb-title-margin-block: var( --sbb-heading-margin-block-6-lean, var(--sbb-heading-margin-block-6) )}`;
+let I = (() => {
+  var s, t;
+  let e = f(g), l, a = [], i = [];
+  return t = class extends e {
     constructor() {
       super(...arguments);
-      d(this, r, n(this, c, null));
-      n(this, m);
+      c(this, s, m(this, a, null));
+      m(this, i);
     }
     /** Visual level for the title. Optional, if not set, the value of level will be used. */
     get visualLevel() {
-      return h(this, r);
+      return o(this, s);
     }
-    set visualLevel(i) {
-      k(this, r, i);
+    set visualLevel(r) {
+      u(this, s, r);
     }
-  }, r = new WeakMap(), t = s, (() => {
-    const i = typeof Symbol == "function" && Symbol.metadata ? Object.create(v[Symbol.metadata] ?? null) : void 0;
-    o = [L({ attribute: "visual-level", reflect: !0 })], _(s, null, o, { kind: "accessor", name: "visualLevel", static: !1, private: !1, access: { has: (b) => "visualLevel" in b, get: (b) => b.visualLevel, set: (b, f) => {
-      b.visualLevel = f;
-    } }, metadata: i }, c, m), _(null, l = { value: t }, e, { kind: "class", name: t.name, metadata: i }, null, a), t = l.value, i && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: i });
-  })(), s.styles = [p.styles, x], n(t, a), t;
+  }, s = new WeakMap(), (() => {
+    const r = typeof Symbol == "function" && Symbol.metadata ? Object.create(e[Symbol.metadata] ?? null) : void 0;
+    l = [k({ attribute: "visual-level", reflect: !0 })], d(t, null, l, { kind: "accessor", name: "visualLevel", static: !1, private: !1, access: { has: (v) => "visualLevel" in v, get: (v) => v.visualLevel, set: (v, h) => {
+      v.visualLevel = h;
+    } }, metadata: r }, a, i), r && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: r });
+  })(), t.elementName = "sbb-title", t.styles = [g.styles, y], t;
 })();
 export {
-  B as SbbTitleElement
+  I as SbbTitleElement
 };

package/title.js

@@ -1,6 +1,7 @@
-import { SbbTitleElement as b } from "./title/title.component.js";
-import { SbbTitleBase as r } from "./title/title-base.js";
+import { SbbTitleBase as b } from "./title/title-base.js";
+import { SbbTitleElement as e } from "./title/title.component.js";
+e.define();
 export {
-  r as SbbTitleBase,
-  b as SbbTitleElement
+  b as SbbTitleBase,
+  e as SbbTitleElement
 };

package/title.pure.js

@@ -0,0 +1,6 @@
+import { SbbTitleBase as b } from "./title/title-base.js";
+import { SbbTitleElement as r } from "./title/title.component.js";
+export {
+  b as SbbTitleBase,
+  r as SbbTitleElement
+};