@sbb-esta/lyne-elements-experimental 3.0.1 → 3.2.0

package/seat-reservation/seat-reservation-place-control/seat-reservation-place-control.component.js

@@ -2,8 +2,8 @@ var it = (o) => {
   throw TypeError(o);
 };
 var nt = (o, l, i) => l.has(o) || it("Cannot " + i);
-var n = (o, l, i) => (nt(o, l, "read from private field"), i ? i.call(o) : l.get(o)), b = (o, l, i) => l.has(o) ? it("Cannot add the same private member more than once") : l instanceof WeakSet ? l.add(o) : l.set(o, i), r = (o, l, i, h) => (nt(o, l, "write to private field"), h ? h.call(o, i) : l.set(o, i), i);
-import { __esDecorate as p, __runInitializers as a } from "tslib";
+var n = (o, l, i) => (nt(o, l, "read from private field"), i ? i.call(o) : l.get(o)), b = (o, l, i) => l.has(o) ? it("Cannot add the same private member more than once") : l instanceof WeakSet ? l.add(o) : l.set(o, i), a = (o, l, i, h) => (nt(o, l, "write to private field"), h ? h.call(o, i) : l.set(o, i), i);
+import { __esDecorate as p, __runInitializers as r } from "tslib";
 import { SbbButtonBaseElement as vt } from "@sbb-esta/lyne-elements/core/base-elements.js";
 import { SbbLanguageController as ut } from "@sbb-esta/lyne-elements/core/controllers.js";
 import { forceType as v } from "@sbb-esta/lyne-elements/core/decorators.js";
@@ -11,10 +11,10 @@ import { css as _t, nothing as ft, html as gt } from "lit";
 import { customElement as kt, property as d } from "lit/decorators.js";
 import { getI18nSeatReservation as E } from "../common.js";
 import "../seat-reservation-graphic.js";
-const xt = _t`*,:before,:after{box-sizing:border-box}:host{--sbb-reservation-place-control-rotation: 0;--sbb-reservation-place-control-text-rotation: 0;--sbb-reservation-place-control-text-size: calc( var(--sbb-place-control-text-scale-value, 1) * .5 );--sbb-reservation-place-control-default-text: var(--sbb-color-black);--sbb-reservation-place-control-hover-text: var(--sbb-color-iron);--sbb-reservation-place-control-focus-text: var(--sbb-color-anthracite);--sbb-reservation-place-control-allocated-text: var(--sbb-color-smoke);--sbb-reservation-place-control-free-background-default: var(--sbb-color-white);--sbb-reservation-place-control-free-background-hover: var(--sbb-color-cloud);--sbb-reservation-place-control-free-background-focus: var(--sbb-color-silver);--sbb-reservation-place-control-free-backrest-background-default: var(--sbb-color-black);--sbb-reservation-place-control-free-backrest-background-hover: var(--sbb-color-black);--sbb-reservation-place-control-free-backrest-background-focus: var(--sbb-color-black);--sbb-reservation-place-control-selected-background-default: var(--sbb-color-red);--sbb-reservation-place-control-selected-background-hover: var(--sbb-color-red125);--sbb-reservation-place-control-selected-background-focus: var(--sbb-color-red150);--sbb-reservation-place-control-selected-backrest-background-default: var(--sbb-color-red150);--sbb-reservation-place-control-selected-backrest-background-hover: #7d000f;--sbb-reservation-place-control-selected-backrest-background-focus: #5a000b;--sbb-reservation-place-control-allocated-background-default: var(--sbb-color-milk);cursor:pointer}:host(:hover) .sbb-sr-place-ctrl--state-free:not(.sbb-reservation-place-control--disabled) ::part(svg-place){fill:var(--sbb-reservation-place-control-free-background-hover)}:host(:hover) .sbb-sr-place-ctrl--state-free:not(.sbb-reservation-place-control--disabled) ::part(svg-backrest){fill:var(--sbb-reservation-place-control-free-backrest-background-hover)}:host(:hover) .sbb-sr-place-ctrl--state-free:not(.sbb-reservation-place-control--disabled) .sbb-sr-place-ctrl__text{background-color:var(--sbb-reservation-place-control-free-background-hover);color:var(--sbb-reservation-place-control-free-text)}:host(:hover) .sbb-sr-place-ctrl--state-selected:not(.sbb-reservation-place-control--disabled) ::part(svg-place){fill:var(--sbb-reservation-place-control-selected-background-hover)}:host(:hover) .sbb-sr-place-ctrl--state-selected:not(.sbb-reservation-place-control--disabled) ::part(svg-backrest){fill:var(--sbb-reservation-place-control-selected-backrest-background-hover)}:host(:hover) .sbb-sr-place-ctrl--state-selected:not(.sbb-reservation-place-control--disabled) .sbb-sr-place-ctrl__text{background-color:var(--sbb-reservation-place-control-selected-background-hover);color:var(--sbb-reservation-place-control-selected-text)}:host(:focus){border-radius:var(--sbb-border-width-1x);outline:var(--sbb-border-width-2x) solid var(--sbb-color-black)}:host(:focus) .sbb-sr-place-ctrl--state-free:not(.sbb-reservation-place-control--disabled) ::part(svg-place){fill:var(--sbb-reservation-place-control-free-background-focus)}:host(:focus) .sbb-sr-place-ctrl--state-free:not(.sbb-reservation-place-control--disabled) ::part(svg-backrest){fill:var(--sbb-reservation-place-control-free-backrest-background-focus)}:host(:focus) .sbb-sr-place-ctrl--state-free:not(.sbb-reservation-place-control--disabled) .sbb-sr-place-ctrl__text{background-color:var(--sbb-reservation-place-control-free-background-focus);color:var(--sbb-reservation-place-control-free-text)}:host(:focus) .sbb-sr-place-ctrl--state-selected:not(.sbb-reservation-place-control--disabled) ::part(svg-place){fill:var(--sbb-reservation-place-control-selected-background-focus)}:host(:focus) .sbb-sr-place-ctrl--state-selected:not(.sbb-reservation-place-control--disabled) ::part(svg-backrest){fill:var(--sbb-reservation-place-control-selected-backrest-background-focus)}:host(:focus) .sbb-sr-place-ctrl--state-selected:not(.sbb-reservation-place-control--disabled) .sbb-sr-place-ctrl__text{background-color:var(--sbb-reservation-place-control-selected-background-focus);color:var(--sbb-reservation-place-control-selected-text)}.sbb-sr-place-ctrl{width:max-content;position:relative;font-size:calc(var(--sbb-reservation-place-control-text-size) * .0625rem)}.sbb-sr-place-ctrl--state-free ::part(svg-place){fill:var(--sbb-reservation-place-control-free-background-default)}.sbb-sr-place-ctrl--state-free ::part(svg-backrest){fill:var(--sbb-reservation-place-control-free-backrest-background-default)}.sbb-sr-place-ctrl--state-free .sbb-sr-place-ctrl__text{background-color:var(--sbb-reservation-place-control-free-background-default);color:var(--sbb-reservation-place-control-free-text)}.sbb-sr-place-ctrl--state-selected ::part(svg-place){fill:var(--sbb-reservation-place-control-selected-background-default)}.sbb-sr-place-ctrl--state-selected ::part(svg-backrest){fill:var(--sbb-reservation-place-control-selected-backrest-background-default)}.sbb-sr-place-ctrl--state-selected .sbb-sr-place-ctrl__text{background-color:var(--sbb-reservation-place-control-selected-background-default);color:var(--sbb-reservation-place-control-selected-text)}.sbb-sr-place-ctrl--state-allocated,.sbb-sr-place-ctrl--state-restricted{cursor:not-allowed}.sbb-sr-place-ctrl--state-allocated ::part(svg-place),.sbb-sr-place-ctrl--state-restricted ::part(svg-place){fill:var(--sbb-reservation-place-control-allocated-background-default)}.sbb-sr-place-ctrl--state-allocated ::part(svg-backrest),.sbb-sr-place-ctrl--state-restricted ::part(svg-backrest){fill:var(--sbb-reservation-place-control-allocated-backrest-background-default)}.sbb-sr-place-ctrl--state-allocated .sbb-sr-place-ctrl__text,.sbb-sr-place-ctrl--state-restricted .sbb-sr-place-ctrl__text{background-color:var(--sbb-reservation-place-control-allocated-background-default);color:var(--sbb-reservation-place-control-allocated-text)}.sbb-sr-place-ctrl__text{overflow:hidden;display:none;position:absolute;inset-block-start:50%;translate:-50% -50%;rotate:calc(var(--sbb-reservation-place-control-text-rotation) * 1deg);font-family:var(--sbb-typo-font-family);font-size:.75em;line-height:initial}.sbb-sr-place-ctrl--state-free .sbb-sr-place-ctrl__text,.sbb-sr-place-ctrl--state-allocated .sbb-sr-place-ctrl__text,.sbb-sr-place-ctrl--state-restricted.sbb-sr-place-ctrl--type-bicycle .sbb-sr-place-ctrl__text{display:block}.sbb-sr-place-ctrl--type-bicycle .sbb-sr-place-ctrl__text{inset-block-start:65%;inset-inline-start:50%;transform-origin:center 16%;font-size:.6875em}.sbb-sr-place-ctrl--orientation-0.sbb-sr-place-ctrl--type-seat .sbb-sr-place-ctrl__text{inset-inline-start:45%}.sbb-sr-place-ctrl--orientation-90.sbb-sr-place-ctrl--type-seat .sbb-sr-place-ctrl__text{inset-block-start:46%;inset-inline-start:50%}.sbb-sr-place-ctrl--orientation-180.sbb-sr-place-ctrl--type-seat .sbb-sr-place-ctrl__text{inset-inline-start:55%}.sbb-sr-place-ctrl--orientation-270.sbb-sr-place-ctrl--type-seat .sbb-sr-place-ctrl__text{inset-block-start:52%;inset-inline-start:52%}`;
+const xt = _t`*,:before,:after{box-sizing:border-box}:host{--sbb-seat-reservation-place-control-width: 16;--sbb-seat-reservation-place-control-height: 16;--sbb-seat-reservation-place-control-top: 0;--sbb-seat-reservation-place-control-left: 0;--sbb-seat-reservation-place-control-rotation: 0;--sbb-seat-reservation-place-control-text-rotation: 0;--sbb-seat-reservation-place-control-text-size: calc( var(--sbb-place-control-text-scale-value, 1) * .5 );--sbb-seat-reservation-place-control-default-text: var(--sbb-color-black);--sbb-seat-reservation-place-control-hover-text: var(--sbb-color-iron);--sbb-seat-reservation-place-control-focus-text: var(--sbb-color-anthracite);--sbb-seat-reservation-place-control-allocated-text: var(--sbb-color-smoke);--sbb-seat-reservation-place-control-free-background-default: var(--sbb-color-white);--sbb-seat-reservation-place-control-free-background-hover: var(--sbb-color-cloud);--sbb-seat-reservation-place-control-free-background-focus: var(--sbb-color-silver);--sbb-seat-reservation-place-control-free-backrest-background-default: var(--sbb-color-black);--sbb-seat-reservation-place-control-free-backrest-background-hover: var(--sbb-color-black);--sbb-seat-reservation-place-control-free-backrest-background-focus: var(--sbb-color-black);--sbb-seat-reservation-place-control-selected-background-default: var(--sbb-color-red);--sbb-seat-reservation-place-control-selected-background-hover: var(--sbb-color-red125);--sbb-seat-reservation-place-control-selected-background-focus: var(--sbb-color-red150);--sbb-seat-reservation-place-control-selected-backrest-background-default: var( --sbb-color-red150 );--sbb-seat-reservation-place-control-selected-backrest-background-hover: #7d000f;--sbb-seat-reservation-place-control-selected-backrest-background-focus: #5a000b;--sbb-seat-reservation-place-control-allocated-background-default: var(--sbb-color-milk);width:calc(var(--sbb-seat-reservation-place-control-width) * var(--sbb-seat-reservation-one-px-rem, .0625rem));height:calc(var(--sbb-seat-reservation-place-control-height) * var(--sbb-seat-reservation-one-px-rem, .0625rem));position:absolute;inset-block-start:calc(var(--sbb-seat-reservation-place-control-top) * var(--sbb-seat-reservation-one-px-rem, .0625rem));inset-inline-start:calc(var(--sbb-seat-reservation-place-control-left) * var(--sbb-seat-reservation-one-px-rem, .0625rem));cursor:pointer}:host(:hover) .sbb-sr-place-ctrl--state-free:not(.sbb-reservation-place-control--disabled) ::part(svg-place){fill:var(--sbb-seat-reservation-place-control-free-background-hover)}:host(:hover) .sbb-sr-place-ctrl--state-free:not(.sbb-reservation-place-control--disabled) ::part(svg-backrest){fill:var(--sbb-seat-reservation-place-control-free-backrest-background-hover)}:host(:hover) .sbb-sr-place-ctrl--state-free:not(.sbb-reservation-place-control--disabled) .sbb-sr-place-ctrl__text{background-color:var(--sbb-seat-reservation-place-control-free-background-hover);color:var(--sbb-seat-reservation-place-control-free-text)}:host(:hover) .sbb-sr-place-ctrl--state-selected:not(.sbb-reservation-place-control--disabled) ::part(svg-place){fill:var(--sbb-seat-reservation-place-control-selected-background-hover)}:host(:hover) .sbb-sr-place-ctrl--state-selected:not(.sbb-reservation-place-control--disabled) ::part(svg-backrest){fill:var(--sbb-seat-reservation-place-control-selected-backrest-background-hover)}:host(:hover) .sbb-sr-place-ctrl--state-selected:not(.sbb-reservation-place-control--disabled) .sbb-sr-place-ctrl__text{background-color:var(--sbb-seat-reservation-place-control-selected-background-hover);color:var(--sbb-seat-reservation-place-control-selected-text)}:host(:focus){border-radius:var(--sbb-border-width-1x);outline:var(--sbb-border-width-2x) solid var(--sbb-color-black)}:host(:focus) .sbb-sr-place-ctrl--state-free:not(.sbb-reservation-place-control--disabled) ::part(svg-place){fill:var(--sbb-seat-reservation-place-control-free-background-focus)}:host(:focus) .sbb-sr-place-ctrl--state-free:not(.sbb-reservation-place-control--disabled) ::part(svg-backrest){fill:var(--sbb-seat-reservation-place-control-free-backrest-background-focus)}:host(:focus) .sbb-sr-place-ctrl--state-free:not(.sbb-reservation-place-control--disabled) .sbb-sr-place-ctrl__text{background-color:var(--sbb-seat-reservation-place-control-free-background-focus);color:var(--sbb-seat-reservation-place-control-free-text)}:host(:focus) .sbb-sr-place-ctrl--state-selected:not(.sbb-reservation-place-control--disabled) ::part(svg-place){fill:var(--sbb-seat-reservation-place-control-selected-background-focus)}:host(:focus) .sbb-sr-place-ctrl--state-selected:not(.sbb-reservation-place-control--disabled) ::part(svg-backrest){fill:var(--sbb-seat-reservation-place-control-selected-backrest-background-focus)}:host(:focus) .sbb-sr-place-ctrl--state-selected:not(.sbb-reservation-place-control--disabled) .sbb-sr-place-ctrl__text{background-color:var(--sbb-seat-reservation-place-control-selected-background-focus);color:var(--sbb-seat-reservation-place-control-selected-text)}:host(:dir(rtl)) :not(.sbb-sr-place-ctrl--type-bicycle,.sbb-sr-place-ctrl--orientation-90,.sbb-sr-place-ctrl--orientation-270,.sbb-sr-place-ctrl--state-selected) ::part(svg-place){rotate:180deg}.sbb-sr-place-ctrl{width:max-content;position:relative;font-size:calc(var(--sbb-seat-reservation-place-control-text-size) * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr-place-ctrl--state-free ::part(svg-place){fill:var(--sbb-seat-reservation-place-control-free-background-default)}.sbb-sr-place-ctrl--state-free ::part(svg-backrest){fill:var(--sbb-seat-reservation-place-control-free-backrest-background-default)}.sbb-sr-place-ctrl--state-free .sbb-sr-place-ctrl__text{background-color:var(--sbb-seat-reservation-place-control-free-background-default);color:var(--sbb-seat-reservation-place-control-free-text)}.sbb-sr-place-ctrl--state-selected ::part(svg-place){fill:var(--sbb-seat-reservation-place-control-selected-background-default)}.sbb-sr-place-ctrl--state-selected ::part(svg-backrest){fill:var(--sbb-seat-reservation-place-control-selected-backrest-background-default)}.sbb-sr-place-ctrl--state-selected .sbb-sr-place-ctrl__text{background-color:var(--sbb-seat-reservation-place-control-selected-background-default);color:var(--sbb-seat-reservation-place-control-selected-text)}.sbb-sr-place-ctrl--state-allocated,.sbb-sr-place-ctrl--state-restricted{cursor:not-allowed}.sbb-sr-place-ctrl--state-allocated ::part(svg-place),.sbb-sr-place-ctrl--state-restricted ::part(svg-place){fill:var(--sbb-seat-reservation-place-control-allocated-background-default)}.sbb-sr-place-ctrl--state-allocated ::part(svg-backrest),.sbb-sr-place-ctrl--state-restricted ::part(svg-backrest){fill:var(--sbb-seat-reservation-place-control-allocated-backrest-background-default)}.sbb-sr-place-ctrl--state-allocated .sbb-sr-place-ctrl__text,.sbb-sr-place-ctrl--state-restricted .sbb-sr-place-ctrl__text{background-color:var(--sbb-seat-reservation-place-control-allocated-background-default);color:var(--sbb-seat-reservation-place-control-allocated-text)}.sbb-sr-place-ctrl__text{overflow:hidden;display:none;position:absolute;inset-block-start:50%;translate:-50% -50%;rotate:calc(var(--sbb-seat-reservation-place-control-text-rotation) * 1deg);font-family:var(--sbb-typo-font-family);font-size:.75em;line-height:initial}.sbb-sr-place-ctrl--state-free .sbb-sr-place-ctrl__text,.sbb-sr-place-ctrl--state-allocated .sbb-sr-place-ctrl__text,.sbb-sr-place-ctrl--state-restricted.sbb-sr-place-ctrl--type-bicycle .sbb-sr-place-ctrl__text{display:block}.sbb-sr-place-ctrl--type-bicycle .sbb-sr-place-ctrl__text{inset-block-start:65%;inset-inline-start:50%;transform-origin:center 16%;font-size:.6875em}.sbb-sr-place-ctrl--orientation-0.sbb-sr-place-ctrl--type-seat .sbb-sr-place-ctrl__text{inset-inline-start:45%}.sbb-sr-place-ctrl--orientation-90.sbb-sr-place-ctrl--type-seat .sbb-sr-place-ctrl__text{inset-block-start:46%;inset-inline-start:50%}.sbb-sr-place-ctrl--orientation-180.sbb-sr-place-ctrl--type-seat .sbb-sr-place-ctrl__text{inset-inline-start:55%}.sbb-sr-place-ctrl--orientation-270.sbb-sr-place-ctrl--type-seat .sbb-sr-place-ctrl__text{inset-block-start:52%;inset-inline-start:52%}:host(:dir(rtl)) .sbb-sr-place-ctrl--orientation-0 .sbb-sr-place-ctrl__text{inset-inline-start:3%}:host(:dir(rtl)) .sbb-sr-place-ctrl--orientation-90 .sbb-sr-place-ctrl__text,:host(:dir(rtl)) .sbb-sr-place-ctrl--orientation-180 .sbb-sr-place-ctrl__text{inset-inline-start:10%}:host(:dir(rtl)) .sbb-sr-place-ctrl--orientation-270 .sbb-sr-place-ctrl__text{inset-inline-start:5%}:host(:dir(rtl)) .sbb-sr-place-ctrl--type-bicycle .sbb-sr-place-ctrl__text{inset-inline-start:-10%}`;
 let $t = (() => {
-  var u, _, f, g, k, x, y, m, I, z, w, c;
-  let o = [kt("sbb-seat-reservation-place-control")], l, i = [], h, C = vt, R, S = [], T = [], $, P = [], L = [], D, A = [], N = [], O, F = [], j = [], B, U = [], K = [], M, Y = [], q = [], G, H = [], J = [], Q, V = [], W = [], X, Z = [], tt = [], et, st = [], rt = [], at, ct = [], ot = [];
+  var u, _, f, g, k, x, y, m, I, w, z, c;
+  let o = [kt("sbb-seat-reservation-place-control")], l, i = [], h, C = vt, R, T = [], S = [], $, P = [], L = [], D, A = [], N = [], O, F = [], j = [], B, U = [], K = [], M, Y = [], q = [], G, H = [], J = [], Q, V = [], W = [], X, Z = [], tt = [], et, st = [], at = [], rt, ct = [], ot = [];
   return c = class extends C {
     constructor() {
       super();
@@ -27,89 +27,89 @@ let $t = (() => {
       b(this, y);
       b(this, m);
       b(this, I);
-      b(this, z);
       b(this, w);
-      r(this, u, a(this, S, "SEAT")), r(this, _, (a(this, T), a(this, P, "FREE"))), r(this, f, (a(this, L), a(this, A, []))), r(this, g, (a(this, N), a(this, F, 0))), r(this, k, (a(this, j), a(this, U, 32))), r(this, x, (a(this, K), a(this, Y, 32))), r(this, y, (a(this, q), a(this, H, ""))), r(this, m, (a(this, J), a(this, V, 0))), r(this, I, (a(this, W), a(this, Z, null))), r(this, z, (a(this, tt), a(this, st, !1))), r(this, w, (a(this, rt), a(this, ct, "unfocus"))), this._language = (a(this, ot), new ut(this)), this.addEventListener("click", () => this._selectPlace());
+      b(this, z);
+      a(this, u, r(this, T, "SEAT")), a(this, _, (r(this, S), r(this, P, "FREE"))), a(this, f, (r(this, L), r(this, A, []))), a(this, g, (r(this, N), r(this, F, 0))), a(this, k, (r(this, j), r(this, U, 32))), a(this, x, (r(this, K), r(this, Y, 32))), a(this, y, (r(this, q), r(this, H, ""))), a(this, m, (r(this, J), r(this, V, 0))), a(this, I, (r(this, W), r(this, Z, null))), a(this, w, (r(this, tt), r(this, st, !1))), a(this, z, (r(this, at), r(this, ct, "unfocus"))), this._language = (r(this, ot), new ut(this)), this.addEventListener("click", () => this._selectPlace());
     }
     /** placeType of the place, e.g. 'SEAT', 'BICYCLE' */
     get placeType() {
       return n(this, u);
     }
     set placeType(e) {
-      r(this, u, e);
+      a(this, u, e);
     }
     /** state of the place, e.g. 'FREE', 'SELECTED', 'BLOCKED' */
     get state() {
       return n(this, _);
     }
     set state(e) {
-      r(this, _, e);
+      a(this, _, e);
     }
     /** property ids of the place, to display more info about the place */
     get propertyIds() {
       return n(this, f);
     }
     set propertyIds(e) {
-      r(this, f, e);
+      a(this, f, e);
     }
     /** rotation in degrees (without unit) */
     get rotation() {
       return n(this, g);
     }
     set rotation(e) {
-      r(this, g, e);
+      a(this, g, e);
     }
     /** width of the place in pixels (without unit) */
     get width() {
       return n(this, k);
     }
     set width(e) {
-      r(this, k, e);
+      a(this, k, e);
     }
     /** height of the place in pixels (without unit) */
     get height() {
       return n(this, x);
     }
     set height(e) {
-      r(this, x, e);
+      a(this, x, e);
     }
     /** label of the place, e.g. '1A', '2B' */
     get text() {
       return n(this, y);
     }
     set text(e) {
-      r(this, y, e);
+      a(this, y, e);
     }
     /** Rotation of the text in degrees (without unit) */
     get textRotation() {
       return n(this, m);
     }
     set textRotation(e) {
-      r(this, m, e);
+      a(this, m, e);
     }
     /** Coach Index Prop to identifier the right place to coach */
     get coachIndex() {
       return n(this, I);
     }
     set coachIndex(e) {
-      r(this, I, e);
+      a(this, I, e);
     }
     /** Prevent click prop prevent any place action */
     get preventClick() {
-      return n(this, z);
+      return n(this, w);
     }
     set preventClick(e) {
-      r(this, z, e);
+      a(this, w, e);
     }
     /** Set the place focus outline style */
     get keyfocus() {
-      return n(this, w);
+      return n(this, z);
     }
     set keyfocus(e) {
-      r(this, w, e);
+      a(this, z, e);
     }
     willUpdate(e) {
-      super.willUpdate(e), (e.has("width") || e.has("height")) && this.style?.setProperty("--sbb-place-control-text-scale-value", `${Math.min(this.width, this.height)}`), e.has("textRotation") && this.style?.setProperty("--sbb-reservation-place-control-text-rotation", `${this.textRotation}`), e.has("rotation") && this.style?.setProperty("--sbb-reservation-place-control-rotation", `${this.rotation}`), e.has("keyfocus") && this.keyfocus === "focus" && this.focus();
+      super.willUpdate(e), (e.has("width") || e.has("height")) && this.style?.setProperty("--sbb-place-control-text-scale-value", `${Math.min(this.width, this.height)}`), e.has("textRotation") && this.style?.setProperty("--sbb-seat-reservation-place-control-text-rotation", `${this.textRotation}`), e.has("rotation") && this.style?.setProperty("--sbb-seat-reservation-place-control-rotation", `${this.rotation}`), e.has("keyfocus") && this.keyfocus === "focus" && this.focus();
     }
     render() {
       const e = this._getPlaceSvg(this.placeType, this.state), t = this.type.toLowerCase(), s = this.state.toLowerCase(), lt = this.text, bt = this.width, pt = this.height, dt = this.textRotation - this.rotation, ht = this.preventClick ? "sbb-reservation-place-control--disabled" : null;
@@ -148,7 +148,8 @@ let $t = (() => {
           id: this.id,
           coachIndex: this.coachIndex,
           number: this.text,
-          state: this.state
+          state: this.state,
+          placeType: this.placeType
         };
         this.dispatchEvent(new CustomEvent("selectplace", {
           detail: t,
@@ -157,11 +158,11 @@ let $t = (() => {
         }));
       }
     }
-  }, u = new WeakMap(), _ = new WeakMap(), f = new WeakMap(), g = new WeakMap(), k = new WeakMap(), x = new WeakMap(), y = new WeakMap(), m = new WeakMap(), I = new WeakMap(), z = new WeakMap(), w = new WeakMap(), h = c, (() => {
+  }, u = new WeakMap(), _ = new WeakMap(), f = new WeakMap(), g = new WeakMap(), k = new WeakMap(), x = new WeakMap(), y = new WeakMap(), m = new WeakMap(), I = new WeakMap(), w = new WeakMap(), z = new WeakMap(), h = c, (() => {
     const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(C[Symbol.metadata] ?? null) : void 0;
-    R = [v(), d({ attribute: "type" })], $ = [v(), d({ attribute: "state" })], D = [d({ attribute: "propertyIds", type: Array })], O = [v(), d({ attribute: "rotation", type: Number })], B = [v(), d({ attribute: "width", type: Number })], M = [v(), d({ attribute: "height", type: Number })], G = [v(), d({ attribute: "text" })], Q = [v(), d({ attribute: "text-rotation" })], X = [v(), d({ attribute: "coach-index", type: Number })], et = [v(), d({ attribute: "prevent-click", type: Boolean })], at = [v(), d({ attribute: "keyfocus" })], p(c, null, R, { kind: "accessor", name: "placeType", static: !1, private: !1, access: { has: (t) => "placeType" in t, get: (t) => t.placeType, set: (t, s) => {
+    R = [v(), d({ attribute: "type" })], $ = [v(), d({ attribute: "state" })], D = [d({ attribute: "propertyIds", type: Array })], O = [v(), d({ attribute: "rotation", type: Number })], B = [v(), d({ attribute: "width", type: Number })], M = [v(), d({ attribute: "height", type: Number })], G = [v(), d({ attribute: "text" })], Q = [v(), d({ attribute: "text-rotation" })], X = [v(), d({ attribute: "coach-index", type: Number })], et = [v(), d({ attribute: "prevent-click", type: Boolean })], rt = [v(), d({ attribute: "keyfocus" })], p(c, null, R, { kind: "accessor", name: "placeType", static: !1, private: !1, access: { has: (t) => "placeType" in t, get: (t) => t.placeType, set: (t, s) => {
       t.placeType = s;
-    } }, metadata: e }, S, T), p(c, null, $, { kind: "accessor", name: "state", static: !1, private: !1, access: { has: (t) => "state" in t, get: (t) => t.state, set: (t, s) => {
+    } }, metadata: e }, T, S), p(c, null, $, { kind: "accessor", name: "state", static: !1, private: !1, access: { has: (t) => "state" in t, get: (t) => t.state, set: (t, s) => {
       t.state = s;
     } }, metadata: e }, P, L), p(c, null, D, { kind: "accessor", name: "propertyIds", static: !1, private: !1, access: { has: (t) => "propertyIds" in t, get: (t) => t.propertyIds, set: (t, s) => {
       t.propertyIds = s;
@@ -179,12 +180,12 @@ let $t = (() => {
       t.coachIndex = s;
     } }, metadata: e }, Z, tt), p(c, null, et, { kind: "accessor", name: "preventClick", static: !1, private: !1, access: { has: (t) => "preventClick" in t, get: (t) => t.preventClick, set: (t, s) => {
       t.preventClick = s;
-    } }, metadata: e }, st, rt), p(c, null, at, { kind: "accessor", name: "keyfocus", static: !1, private: !1, access: { has: (t) => "keyfocus" in t, get: (t) => t.keyfocus, set: (t, s) => {
+    } }, metadata: e }, st, at), p(c, null, rt, { kind: "accessor", name: "keyfocus", static: !1, private: !1, access: { has: (t) => "keyfocus" in t, get: (t) => t.keyfocus, set: (t, s) => {
       t.keyfocus = s;
     } }, metadata: e }, ct, ot), p(null, l = { value: h }, o, { kind: "class", name: h.name, metadata: e }, null, i), h = l.value, e && Object.defineProperty(h, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
   })(), c.styles = xt, c.events = {
     selectplace: "selectplace"
-  }, a(h, i), h;
+  }, r(h, i), h;
 })();
 export {
   $t as SbbSeatReservationPlaceControlElement

package/seat-reservation/seat-reservation-scoped/seat-reservation-scoped.component.d.ts

@@ -1,24 +1,9 @@
-import { CSSResultGroup, PropertyValues, TemplateResult, LitElement } from 'lit';
+import { CSSResultGroup, TemplateResult, LitElement } from 'lit';
 /**
  * Wrapper class for scoped elements with similar properties to set.
  */
 export declare class SbbSeatReservationScopedElement extends LitElement {
     static styles: CSSResultGroup;
-    /** Inset block start in pixels (without unit) */
-    accessor insetBlockStart: string;
-    /** Inset inline start in pixels (without unit) */
-    accessor insetInlineStart: string;
-    /** Width of the scoped element in pixels (without unit) */
-    accessor width: string;
-    /** Height of the scoped element in pixels (without unit) */
-    accessor height: string;
-    /** Z-index of the scoped element */
-    accessor zIndex: string;
-    /** Cell id of the scoped element, if it is used in a table */
-    accessor cellId: string;
-    /** Scoped classes for the scoped element */
-    accessor scopedClasses: string;
-    protected willUpdate(_changedProperties: PropertyValues): void;
     protected render(): TemplateResult;
 }
 declare global {

package/seat-reservation/seat-reservation-scoped/seat-reservation-scoped.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"seat-reservation-scoped.component.d.ts","sourceRoot":"","sources":["../../../../src/elements-experimental/seat-reservation/seat-reservation-scoped/seat-reservation-scoped.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AACpF,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAKvC;;GAEG;AACH,qBAEM,+BAAgC,SAAQ,UAAU;IACtD,OAAuB,MAAM,EAAE,cAAc,CAAS;IAEtD,iDAAiD;IACjD,SAEgB,eAAe,EAAE,MAAM,CAAM;IAE7C,kDAAkD;IAClD,SAEgB,gBAAgB,EAAE,MAAM,CAAM;IAE9C,2DAA2D;IAC3D,SAEgB,KAAK,EAAE,MAAM,CAAM;IAEnC,4DAA4D;IAC5D,SAEgB,MAAM,EAAE,MAAM,CAAM;IAEpC,oCAAoC;IACpC,SAEgB,MAAM,EAAE,MAAM,CAAM;IAEpC,8DAA8D;IAC9D,SAEgB,MAAM,EAAE,MAAM,CAAM;IAEpC,4CAA4C;IAC5C,SAEgB,aAAa,EAAE,MAAM,CAAM;cAExB,UAAU,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;cA8BpD,MAAM,IAAI,cAAc;CAW5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,6BAA6B,EAAE,+BAA+B,CAAC;KAChE;CACF"}
+{"version":3,"file":"seat-reservation-scoped.component.d.ts","sourceRoot":"","sources":["../../../../src/elements-experimental/seat-reservation/seat-reservation-scoped/seat-reservation-scoped.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAC/D,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAKvC;;GAEG;AACH,qBAEM,+BAAgC,SAAQ,UAAU;IACtD,OAAuB,MAAM,EAAE,cAAc,CAAS;cAEnC,MAAM,IAAI,cAAc;CAG5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,6BAA6B,EAAE,+BAA+B,CAAC;KAChE;CACF"}

package/seat-reservation/seat-reservation-scoped/seat-reservation-scoped.component.js

@@ -1,106 +1,19 @@
-var J = (s) => {
-  throw TypeError(s);
-};
-var K = (s, i, l) => i.has(s) || J("Cannot " + l);
-var o = (s, i, l) => (K(s, i, "read from private field"), l ? l.call(s) : i.get(s)), h = (s, i, l) => i.has(s) ? J("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(s) : i.set(s, l), d = (s, i, l, c) => (K(s, i, "write to private field"), c ? c.call(s, l) : i.set(s, l), l);
-import { __esDecorate as _, __runInitializers as a } from "tslib";
-import { forceType as p } from "@sbb-esta/lyne-elements/core/decorators.js";
-import { css as N, LitElement as Q, html as M } from "lit";
-import { customElement as V, property as b } from "lit/decorators.js";
-const W = N`*,:before,:after{box-sizing:border-box}:host{display:block}:host .coach-border,:host .coach-wrapper,:host .graphical-element{width:var(--sbb-seat-reservation-scoped-width);height:var(--sbb-seat-reservation-scoped-height);inset-block-start:var(--sbb-seat-reservation-scoped-inset-block-start);inset-inline-start:var(--sbb-seat-reservation-scoped-inset-inline-start);z-index:var(--sbb-seat-reservation-scoped-z-index)}:host .coach-border,:host .graphical-element ::slotted(*),:host .graphical-element{position:absolute}:host .coach-border{z-index:0}`;
-let it = (() => {
-  var I, u, m, g, z, f, S, r;
-  let s = [V("sbb-seat-reservation-scoped")], i, l = [], c, v = Q, x, k = [], y = [], w, B = [], C = [], $, E = [], D = [], j, O = [], T = [], U, L = [], P = [], R, q = [], A = [], F, G = [], H = [];
-  return r = class extends v {
-    constructor() {
-      super(...arguments);
-      h(this, I, a(this, k, ""));
-      h(this, u, (a(this, y), a(this, B, "")));
-      h(this, m, (a(this, C), a(this, E, "")));
-      h(this, g, (a(this, D), a(this, O, "")));
-      h(this, z, (a(this, T), a(this, L, "")));
-      h(this, f, (a(this, P), a(this, q, "")));
-      h(this, S, (a(this, A), a(this, G, "")));
-      a(this, H);
-    }
-    /** Inset block start in pixels (without unit) */
-    get insetBlockStart() {
-      return o(this, I);
-    }
-    set insetBlockStart(e) {
-      d(this, I, e);
-    }
-    /** Inset inline start in pixels (without unit) */
-    get insetInlineStart() {
-      return o(this, u);
-    }
-    set insetInlineStart(e) {
-      d(this, u, e);
-    }
-    /** Width of the scoped element in pixels (without unit) */
-    get width() {
-      return o(this, m);
-    }
-    set width(e) {
-      d(this, m, e);
-    }
-    /** Height of the scoped element in pixels (without unit) */
-    get height() {
-      return o(this, g);
-    }
-    set height(e) {
-      d(this, g, e);
-    }
-    /** Z-index of the scoped element */
-    get zIndex() {
-      return o(this, z);
-    }
-    set zIndex(e) {
-      d(this, z, e);
-    }
-    /** Cell id of the scoped element, if it is used in a table */
-    get cellId() {
-      return o(this, f);
-    }
-    set cellId(e) {
-      d(this, f, e);
-    }
-    /** Scoped classes for the scoped element */
-    get scopedClasses() {
-      return o(this, S);
-    }
-    set scopedClasses(e) {
-      d(this, S, e);
-    }
-    willUpdate(e) {
-      super.willUpdate(e), e.has("width") && this.style?.setProperty("--sbb-seat-reservation-scoped-width", `${this.width}`), e.has("height") && this.style?.setProperty("--sbb-seat-reservation-scoped-height", `${this.height}`), e.has("insetBlockStart") && this.style?.setProperty("--sbb-seat-reservation-scoped-inset-block-start", `${this.insetBlockStart}`), e.has("insetInlineStart") && this.style?.setProperty("--sbb-seat-reservation-scoped-inset-inline-start", `${this.insetInlineStart}`), e.has("zIndex") && this.style?.setProperty("--sbb-seat-reservation-scoped-z-index", `${this.zIndex}`);
-    }
+import { __esDecorate as i, __runInitializers as c } from "tslib";
+import { css as n, LitElement as b, html as m } from "lit";
+import { customElement as d } from "lit/decorators.js";
+const p = n`*,:before,:after{box-sizing:border-box}:host{--sbb-seat-reservation-scoped-width: 0;--sbb-seat-reservation-scoped-height: 0;display:block}:host .scoped-element{width:calc(var(--sbb-seat-reservation-scoped-width) * var(--sbb-seat-reservation-one-px-rem, .0625rem));height:calc(var(--sbb-seat-reservation-scoped-height) * var(--sbb-seat-reservation-one-px-rem, .0625rem))}`;
+let f = (() => {
+  var t;
+  let l = [d("sbb-seat-reservation-scoped")], a, r = [], e, o = b;
+  return t = class extends o {
     render() {
-      return this.cellId ? M`<td id="${this.cellId}" class="${this.scopedClasses}">
-        <slot></slot>
-      </td>` : M`<div class="${this.scopedClasses}">
-        <slot></slot>
-      </div>`;
+      return m`<div class="scoped-element"><slot></slot></div>`;
     }
-  }, I = new WeakMap(), u = new WeakMap(), m = new WeakMap(), g = new WeakMap(), z = new WeakMap(), f = new WeakMap(), S = new WeakMap(), c = r, (() => {
-    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(v[Symbol.metadata] ?? null) : void 0;
-    x = [p(), b({ attribute: "inset-block-start" })], w = [p(), b({ attribute: "inset-inline-start" })], $ = [p(), b({ attribute: "width" })], j = [p(), b({ attribute: "height" })], U = [p(), b({ attribute: "z-index" })], R = [p(), b({ attribute: "cell-id" })], F = [p(), b({ attribute: "scoped-classes" })], _(r, null, x, { kind: "accessor", name: "insetBlockStart", static: !1, private: !1, access: { has: (t) => "insetBlockStart" in t, get: (t) => t.insetBlockStart, set: (t, n) => {
-      t.insetBlockStart = n;
-    } }, metadata: e }, k, y), _(r, null, w, { kind: "accessor", name: "insetInlineStart", static: !1, private: !1, access: { has: (t) => "insetInlineStart" in t, get: (t) => t.insetInlineStart, set: (t, n) => {
-      t.insetInlineStart = n;
-    } }, metadata: e }, B, C), _(r, null, $, { kind: "accessor", name: "width", static: !1, private: !1, access: { has: (t) => "width" in t, get: (t) => t.width, set: (t, n) => {
-      t.width = n;
-    } }, metadata: e }, E, D), _(r, null, j, { kind: "accessor", name: "height", static: !1, private: !1, access: { has: (t) => "height" in t, get: (t) => t.height, set: (t, n) => {
-      t.height = n;
-    } }, metadata: e }, O, T), _(r, null, U, { kind: "accessor", name: "zIndex", static: !1, private: !1, access: { has: (t) => "zIndex" in t, get: (t) => t.zIndex, set: (t, n) => {
-      t.zIndex = n;
-    } }, metadata: e }, L, P), _(r, null, R, { kind: "accessor", name: "cellId", static: !1, private: !1, access: { has: (t) => "cellId" in t, get: (t) => t.cellId, set: (t, n) => {
-      t.cellId = n;
-    } }, metadata: e }, q, A), _(r, null, F, { kind: "accessor", name: "scopedClasses", static: !1, private: !1, access: { has: (t) => "scopedClasses" in t, get: (t) => t.scopedClasses, set: (t, n) => {
-      t.scopedClasses = n;
-    } }, metadata: e }, G, H), _(null, i = { value: c }, s, { kind: "class", name: c.name, metadata: e }, null, l), c = i.value, e && Object.defineProperty(c, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
-  })(), r.styles = W, a(c, l), c;
+  }, e = t, (() => {
+    const s = typeof Symbol == "function" && Symbol.metadata ? Object.create(o[Symbol.metadata] ?? null) : void 0;
+    i(null, a = { value: e }, l, { kind: "class", name: e.name, metadata: s }, null, r), e = a.value, s && Object.defineProperty(e, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: s });
+  })(), t.styles = p, c(e, r), e;
 })();
 export {
-  it as SbbSeatReservationScopedElement
+  f as SbbSeatReservationScopedElement
 };