@sbb-esta/lyne-elements 1.14.1 → 1.15.0

package/slider.js

@@ -4,7 +4,7 @@ var H = (t) => {
 var L = (t, r, l) => r.has(t) || H("Cannot " + l);
 var f = (t, r, l) => (L(t, r, "read from private field"), l ? l.call(t) : r.get(t)), p = (t, r, l) => r.has(t) ? H("Cannot add the same private member more than once") : r instanceof WeakSet ? r.add(t) : r.set(t, l), b = (t, r, l, o) => (L(t, r, "write to private field"), o ? o.call(t, l) : r.set(t, l), l);
 import { __esDecorate as d, __runInitializers as n } from "tslib";
-import { css as O, LitElement as j, html as x, nothing as y } from "lit";
+import { css as O, LitElement as j, html as y, nothing as x } from "lit";
 import { customElement as K, property as c, state as Y } from "lit/decorators.js";
 import { ref as q } from "lit/directives/ref.js";
 import { styleMap as J } from "lit/directives/style-map.js";
@@ -86,6 +86,13 @@ let me = (() => {
     set endIcon(e) {
       b(this, m, e);
     }
+    /**
+     * Form type of element.
+     * @default 'range'
+     */
+    get type() {
+      return "range";
+    }
     /**
      * The ratio between the absolute value and the validity interval.
      * E.g. given `min=0`, `max=100` and `value=50`, then `_valueFraction=0.5`
@@ -164,11 +171,11 @@ let me = (() => {
       X(e, this), this._didChange.emit();
     }
     render() {
-      return x`
+      return y`
       <div class="sbb-slider__height-container">
         <div class="sbb-slider__wrapper">
           <slot name="prefix">
-            ${this.startIcon ? x`<sbb-icon name="${this.startIcon}"></sbb-icon>` : y}
+            ${this.startIcon ? y`<sbb-icon name="${this.startIcon}"></sbb-icon>` : x}
           </slot>
           <div
             class="sbb-slider__container"
@@ -179,7 +186,7 @@ let me = (() => {
               min=${this.min}
               max=${this.max}
               ?disabled=${this.disabled || this.formDisabled || this.readonly}
-              value=${this.value || y}
+              value=${this.value || x}
               class="sbb-slider__range-input"
               type="range"
               @change=${(e) => this._emitChange(e)}
@@ -192,7 +199,7 @@ let me = (() => {
             <div class="sbb-slider__knob"></div>
           </div>
           <slot name="suffix">
-            ${this.endIcon ? x`<sbb-icon name="${this.endIcon}"></sbb-icon>` : y}
+            ${this.endIcon ? y`<sbb-icon name="${this.endIcon}"></sbb-icon>` : x}
           </slot>
         </div>
       </div>

package/table/table-wrapper/table-wrapper.d.ts

@@ -9,7 +9,7 @@ export declare class SbbTableWrapperElement extends SbbTableWrapperElement_base
     static styles: CSSResultGroup;
     private _resizeObserver;
     private _tableWrapper;
-    protected firstUpdated(changedProperties: PropertyValues): void;
+    protected firstUpdated(changedProperties: PropertyValues<this>): void;
     private _checkHorizontalScrollbar;
     protected render(): TemplateResult;
 }

package/table/table-wrapper/table-wrapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"table-wrapper.d.ts","sourceRoot":"","sources":["../../../../src/elements/table/table-wrapper/table-wrapper.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EACV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;;AAOb;;;;GAIG;AACH,qBAEM,sBAAuB,SAAQ,2BAA4B;IAC/D,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,OAAO,CAAC,eAAe,CAIpB;IACH,OAAO,CAAC,aAAa,CAAe;cAEjB,YAAY,CAAC,iBAAiB,EAAE,cAAc,GAAG,IAAI;IAMxE,OAAO,CAAC,yBAAyB;cAOd,MAAM,IAAI,cAAc;CAK5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,mBAAmB,EAAE,sBAAsB,CAAC;KAC7C;CACF"}
+{"version":3,"file":"table-wrapper.d.ts","sourceRoot":"","sources":["../../../../src/elements/table/table-wrapper/table-wrapper.ts"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,cAAc,EAEnB,UAAU,EACV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;;AAOb;;;;GAIG;AACH,qBAEM,sBAAuB,SAAQ,2BAA4B;IAC/D,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,OAAO,CAAC,eAAe,CAIpB;IACH,OAAO,CAAC,aAAa,CAAe;cAEjB,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAM9E,OAAO,CAAC,yBAAyB;cAOd,MAAM,IAAI,cAAc;CAK5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,mBAAmB,EAAE,sBAAsB,CAAC;KAC7C;CACF"}

package/timetable-occupancy-icon/timetable-occupancy-icon.d.ts

@@ -9,8 +9,9 @@ export declare class SbbTimetableOccupancyIconElement extends SbbTimetableOccupa
     static styles: CSSResultGroup;
     /** Wagon occupancy. */
     accessor occupancy: SbbOccupancy;
-    private _abort;
     private _language;
+    private _mediaMatcher;
+    private _forcedColors;
     private _setNameAndAriaLabel;
     protected fetchSvgIcon(namespace: string, name: string): Promise<string>;
     private _setAriaLabel;

package/timetable-occupancy-icon/timetable-occupancy-icon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"timetable-occupancy-icon.d.ts","sourceRoot":"","sources":["../../../src/elements/timetable-occupancy-icon/timetable-occupancy-icon.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAM1D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAE1D,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;;AAIzC;;GAEG;AACH,qBAEM,gCAAiC,SAAQ,qCAA6B;IAC1E,OAAuB,MAAM,EAAE,cAAc,CAA+B;IAE5E,uBAAuB;IACvB,SAA4B,SAAS,EAAE,YAAY,CAAU;IAE7D,OAAO,CAAC,MAAM,CAAyC;IACvD,OAAO,CAAC,SAAS,CAA2E;YAE9E,oBAAoB;cAeT,YAAY,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC;IAKvF,OAAO,CAAC,aAAa;IAOL,iBAAiB,IAAI,IAAI;cAUtB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;CAO7E;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,8BAA8B,EAAE,gCAAgC,CAAC;KAClE;CACF"}
+{"version":3,"file":"timetable-occupancy-icon.d.ts","sourceRoot":"","sources":["../../../src/elements/timetable-occupancy-icon/timetable-occupancy-icon.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAU1D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAE1D,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;;AAIzC;;GAEG;AACH,qBAEM,gCAAiC,SAAQ,qCAA6B;IAC1E,OAAuB,MAAM,EAAE,cAAc,CAA+B;IAE5E,uBAAuB;IACvB,SAA4B,SAAS,EAAE,YAAY,CAAU;IAE7D,OAAO,CAAC,SAAS,CAA2E;IAC5F,OAAO,CAAC,aAAa,CAKlB;IAEH,OAAO,CAAC,aAAa,CAA2E;YAElF,oBAAoB;cAeT,YAAY,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC;IAKvF,OAAO,CAAC,aAAa;IAOL,iBAAiB,IAAI,IAAI;cAKtB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;CAO7E;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,8BAA8B,EAAE,gCAAgC,CAAC;KAClE;CACF"}

package/timetable-occupancy-icon.js

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

package/toggle-check/toggle-check.d.ts

@@ -21,7 +21,7 @@ export declare class SbbToggleCheckElement extends SbbToggleCheckElement_base {
     accessor iconName: string;
     /** The label position relative to the toggle. Defaults to 'after' */
     accessor labelPosition: 'before' | 'after';
-    protected willUpdate(changedProperties: PropertyValues<this>): Promise<void>;
+    protected willUpdate(changedProperties: PropertyValues<this>): void;
     protected render(): TemplateResult;
 }
 declare global {

package/toggle-check/toggle-check.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toggle-check.d.ts","sourceRoot":"","sources":["../../../src/elements/toggle-check/toggle-check.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;;AASvC;;;;;;;;;GASG;AACH,qBAGM,qBAAsB,SAAQ,0BAA4D;IAC9F,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;MAElB;IAEX,uCAAuC;IACvC,SAA6C,IAAI,EAAE,IAAI,GAAG,GAAG,GAAG,GAAG,CAAO;IAE1E,gEAAgE;IAChE,SAEyB,QAAQ,EAAE,MAAM,CAAgB;IAEzD,qEAAqE;IACrE,SACgB,aAAa,EAAE,QAAQ,GAAG,OAAO,CAAW;cAEnC,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC;cASxE,MAAM,IAAI,cAAc;CAgB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,kBAAkB,EAAE,qBAAqB,CAAC;KAC3C;CACF"}
+{"version":3,"file":"toggle-check.d.ts","sourceRoot":"","sources":["../../../src/elements/toggle-check/toggle-check.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAC1E,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;;AASvC;;;;;;;;;GASG;AACH,qBAGM,qBAAsB,SAAQ,0BAA4D;IAC9F,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;MAElB;IAEX,uCAAuC;IACvC,SAA6C,IAAI,EAAE,IAAI,GAAG,GAAG,GAAG,GAAG,CAAO;IAE1E,gEAAgE;IAChE,SAEyB,QAAQ,EAAE,MAAM,CAAgB;IAEzD,qEAAqE;IACrE,SACgB,aAAa,EAAE,QAAQ,GAAG,OAAO,CAAW;cAEzC,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cASzD,MAAM,IAAI,cAAc;CAgB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,kBAAkB,EAAE,qBAAqB,CAAC;KAC3C;CACF"}

package/toggle-check.js

@@ -42,7 +42,7 @@ let J = (() => {
     set labelPosition(s) {
       k(this, n, s);
     }
-    async willUpdate(s) {
+    willUpdate(s) {
       super.willUpdate(s), s.has("checked") && (this.internals.ariaChecked = `${this.checked}`, this.toggleAttribute("data-checked", this.checked));
     }
     render() {