@sbb-esta/lyne-elements-experimental 3.12.1 → 3.13.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/custom-elements.json +233 -5
- package/development/seat-reservation/common/mapper/mapper.d.ts +4 -2
- package/development/seat-reservation/common/mapper/mapper.d.ts.map +1 -1
- package/development/seat-reservation/common/mapper/mapper.js +3 -5
- package/development/seat-reservation/common/types.d.ts +1 -0
- package/development/seat-reservation/common/types.d.ts.map +1 -1
- package/development/seat-reservation/seat-reservation/seat-reservation-base-element.d.ts +26 -1
- package/development/seat-reservation/seat-reservation/seat-reservation-base-element.d.ts.map +1 -1
- package/development/seat-reservation/seat-reservation/seat-reservation-base-element.js +71 -18
- package/development/seat-reservation/seat-reservation/seat-reservation.component.d.ts.map +1 -1
- package/development/seat-reservation/seat-reservation/seat-reservation.component.js +14 -13
- package/development/seat-reservation/seat-reservation-area/seat-reservation-area.component.js +1 -1
- package/development/seat-reservation/seat-reservation-graphic/seat-reservation-graphic.component.js +1 -1
- package/development/seat-reservation/seat-reservation-navigation-coach/seat-reservation-navigation-coach.component.d.ts +2 -0
- package/development/seat-reservation/seat-reservation-navigation-coach/seat-reservation-navigation-coach.component.d.ts.map +1 -1
- package/development/seat-reservation/seat-reservation-navigation-coach/seat-reservation-navigation-coach.component.js +4 -4
- package/development/seat-reservation/seat-reservation-place-control/seat-reservation-place-control.component.d.ts.map +1 -1
- package/development/seat-reservation/seat-reservation-place-control/seat-reservation-place-control.component.js +2 -3
- package/package.json +2 -2
- package/seat-reservation/common/mapper/mapper.d.ts +4 -2
- package/seat-reservation/common/mapper/mapper.d.ts.map +1 -1
- package/seat-reservation/common/mapper/mapper.js +35 -35
- package/seat-reservation/common/types.d.ts +1 -0
- package/seat-reservation/common/types.d.ts.map +1 -1
- package/seat-reservation/seat-reservation/seat-reservation-base-element.d.ts +26 -1
- package/seat-reservation/seat-reservation/seat-reservation-base-element.d.ts.map +1 -1
- package/seat-reservation/seat-reservation/seat-reservation-base-element.js +121 -71
- package/seat-reservation/seat-reservation/seat-reservation.component.d.ts.map +1 -1
- package/seat-reservation/seat-reservation/seat-reservation.component.js +91 -90
- package/seat-reservation/seat-reservation-area/seat-reservation-area.component.js +1 -1
- package/seat-reservation/seat-reservation-graphic/seat-reservation-graphic.component.js +1 -1
- package/seat-reservation/seat-reservation-navigation-coach/seat-reservation-navigation-coach.component.d.ts +2 -0
- package/seat-reservation/seat-reservation-navigation-coach/seat-reservation-navigation-coach.component.d.ts.map +1 -1
- package/seat-reservation/seat-reservation-navigation-coach/seat-reservation-navigation-coach.component.js +3 -3
- package/seat-reservation/seat-reservation-place-control/seat-reservation-place-control.component.d.ts.map +1 -1
- package/seat-reservation/seat-reservation-place-control/seat-reservation-place-control.component.js +6 -6
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { __esDecorate as
|
|
1
|
+
import { __esDecorate as $, __runInitializers as y } from "tslib";
|
|
2
2
|
import { SbbLanguageController as A } from "@sbb-esta/lyne-elements/core/controllers.js";
|
|
3
|
-
import { css as R, html as b, nothing as
|
|
3
|
+
import { css as R, html as b, nothing as u } from "lit";
|
|
4
4
|
import { customElement as S } from "lit/decorators.js";
|
|
5
|
-
import { classMap as
|
|
5
|
+
import { classMap as w } from "lit/directives/class-map.js";
|
|
6
6
|
import { styleMap as v } from "lit/directives/style-map.js";
|
|
7
|
-
import { getI18nSeatReservation as
|
|
7
|
+
import { getI18nSeatReservation as l } from "../common.js";
|
|
8
8
|
import { SeatReservationBaseElement as E } from "./seat-reservation-base-element.js";
|
|
9
9
|
import "@sbb-esta/lyne-elements/button.js";
|
|
10
10
|
import "@sbb-esta/lyne-elements/screen-reader-only.js";
|
|
@@ -17,8 +17,8 @@ import "@sbb-esta/lyne-elements/popover/popover.js";
|
|
|
17
17
|
const T = R`*,:before,:after{box-sizing:border-box}:host{--sbb-seat-reservation-grid-size: 16px;--sbb-seat-reservation-height: 0;--sbb-seat-reservation-decks: 1;display:block;height:inherit}:host ::part(coach-floor){fill:var(--sbb-background-color-2)}@media(forced-colors:active){:host ::part(coach-floor){fill:transparent}}: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(coach-floor){rotate:180deg}[popover]:where(sbb-popover){margin:0;padding:0;border:none;width:auto;height:auto;background-color:transparent;color:inherit;pointer-events:none}.sbb-sr__container{display:flex;height:inherit}.sbb-sr__grid{display:grid;grid-template-columns:20% 1fr 20%;grid-template-rows:auto auto}.sbb-sr__grid .sbb-sr-navigation-first-grid,.sbb-sr__grid .sbb-sr-navigation-last-grid{grid-row-start:1;position:relative;margin-block-start:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__grid .sbb-sr-navigation-first-grid{grid-column:1/2}.sbb-sr__grid .sbb-sr-navigation-last-grid{grid-column:3/4}.sbb-sr__grid .sbb-sr__component{display:flex;grid-column:1/4;grid-row:1/3}.sbb-sr__grid .sbb-sr-grid-inner{display:grid;grid-template-columns:20% 60% 20%;grid-template-rows:auto 1fr;gap:0}.sbb-sr__grid .sbb-sr-grid-inner .nav-grid{grid-column:2/3;grid-row:1/2;display:inherit}.sbb-sr__grid .sbb-sr-grid-inner .coaches-grid{grid-column:1/4;grid-row:2/3;display:inherit}.sbb-sr__navigation-control-button{position:absolute;z-index:10}.sbb-sr__navigation-control-button#first-tab-element{inset-inline-end:calc(8 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__navigation-control-button#last-tab-element{inset-inline-start:calc(8 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr-navigation-wrapper{overflow:hidden;padding-block:0 calc(32 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr-navigation{--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-black) 30%, transparent);--sbb-scrollbar-color: light-dark( color-mix(in srgb, var(--sbb-color-black) 30%, transparent), color-mix(in srgb, var(--sbb-color-white) 30%, transparent) );--sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);--sbb-scrollbar-color-hover: light-dark( color-mix(in srgb, var(--sbb-color-black) 60%, transparent), color-mix(in srgb, var(--sbb-color-white) 60%, transparent) );--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-sr-navigation::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-sr-navigation::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-sr-navigation::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-sr-navigation::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-sr-navigation::-webkit-scrollbar-button,.sbb-sr-navigation::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-sr-navigation{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-sr-navigation{padding-block-start:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr-navigation{--sbb-scrollbar-color: transparent;display:flex;overflow:scroll hidden;position:relative}.sbb-sr-navigation__list-coaches{list-style:none;margin:0;padding:0;font-size:inherit;display:flex;flex-wrap:nowrap;gap:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem));padding:calc(2 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__wrapper-coach-decks{display:flex;overflow:hidden;height:inherit}.sbb-sr__wrapper-coach-decks .sbb-sr__wrapper-deck-labels{display:flex;justify-content:space-between;height:calc(var(--sbb-seat-reservation-height) * var(--sbb-seat-reservation-one-px-rem, .0625rem));writing-mode:vertical-lr}.sbb-sr__wrapper-coach-decks .sbb-sr__wrapper-deck-labels b{height:calc(50% - 16 * var(--sbb-seat-reservation-one-px-rem, .0625rem));width:calc(20 * var(--sbb-seat-reservation-one-px-rem, .0625rem));margin-block-end:16px;rotate:180deg;text-align:center;line-height:calc(20 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__wrapper{--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-black) 30%, transparent);--sbb-scrollbar-color: light-dark( color-mix(in srgb, var(--sbb-color-black) 30%, transparent), color-mix(in srgb, var(--sbb-color-white) 30%, transparent) );--sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);--sbb-scrollbar-color-hover: light-dark( color-mix(in srgb, var(--sbb-color-black) 60%, transparent), color-mix(in srgb, var(--sbb-color-white) 60%, transparent) );--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-sr__wrapper::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-sr__wrapper::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-sr__wrapper::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-sr__wrapper::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-sr__wrapper::-webkit-scrollbar-button,.sbb-sr__wrapper::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-sr__wrapper{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-sr__wrapper{overflow-x:scroll;padding-block:calc(8 * var(--sbb-seat-reservation-one-px-rem, .0625rem)) calc(16 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__wrapper .sbb-sr__parent{display:flex;flex-direction:column;position:relative}.sbb-sr__list-decks{list-style:none;margin:0;padding:0;font-size:inherit;display:flex;flex-direction:column}.sbb-sr__list-decks--gap{gap:calc(48 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__list-item-deck{position:relative}.sbb-sr__list-coaches{list-style:none;margin:0;padding:0;font-size:inherit;display:flex;gap:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__item-coach{position:relative}.sbb-sr-popover{margin:0}.sbb-sr-coach-wrapper__table{outline:0}:host([align-vertical]) .sbb-sr{grid-template-columns:calc((var(--sbb-seat-reservation-height) + 24) * var(--sbb-seat-reservation-one-px-rem, .0625rem)) 1fr;grid-template-rows:20% 60% 20%}:host([align-vertical]) .sbb-sr .sbb-sr-navigation-first-grid,:host([align-vertical]) .sbb-sr .sbb-sr-navigation-last-grid{margin-inline-start:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem));margin-block-start:0}:host([align-vertical]) .sbb-sr .sbb-sr-navigation-first-grid{grid-column:2/3;grid-row-start:1}:host([align-vertical]) .sbb-sr .sbb-sr-navigation-first-grid #first-tab-element{position:absolute;inset-block-end:calc(16 * var(--sbb-seat-reservation-one-px-rem, .0625rem));inset-inline-start:calc(16 * var(--sbb-seat-reservation-one-px-rem, .0625rem));inset-inline-end:initial;rotate:90deg}:host([align-vertical]) .sbb-sr .sbb-sr-navigation-last-grid{grid-column:2/3;grid-row:3/4}:host([align-vertical]) .sbb-sr .sbb-sr-navigation-last-grid #last-tab-element{inset-block-start:calc(16 * var(--sbb-seat-reservation-one-px-rem, .0625rem));inset-inline-start:calc(16 * var(--sbb-seat-reservation-one-px-rem, .0625rem));rotate:90deg}:host([align-vertical]) .sbb-sr .sbb-sr-navigation-wrapper{padding-block-end:initial;padding-inline-start:calc(16 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}:host([align-vertical]) .sbb-sr .sbb-sr__component{grid-column:1/3;grid-row:1/4}:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner{grid-template-columns:calc((var(--sbb-seat-reservation-height) + 24) * var(--sbb-seat-reservation-one-px-rem, .0625rem)) 1fr;grid-template-rows:20% 60% 20%}:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .nav-grid{grid-column:2/3;grid-row:2/3;height:100%}:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .nav-grid .sbb-sr-navigation{display:block;overflow:hidden scroll;height:100%;padding-block-start:0;padding-inline-start:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .nav-grid .sbb-sr-navigation .sbb-sr-navigation__list-coaches{flex-direction:column;padding:calc(2 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .coaches-grid{grid-column:1/2;grid-row:1/4;overflow:hidden;position:relative}:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .coaches-grid .sbb-sr__wrapper-coach-decks{flex-direction:column}:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .coaches-grid .sbb-sr__wrapper-coach-decks .sbb-sr__wrapper-deck-labels{flex-direction:column-reverse;width:calc(100% - 24 * var(--sbb-seat-reservation-one-px-rem, .0625rem));height:initial}:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .coaches-grid .sbb-sr__wrapper-coach-decks .sbb-sr__wrapper-deck-labels b{width:calc(50% - 16 * var(--sbb-seat-reservation-one-px-rem, .0625rem));height:calc(20 * var(--sbb-seat-reservation-one-px-rem, .0625rem));margin-bottom:16px;rotate:initial;writing-mode:initial}:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .coaches-grid .sbb-sr__wrapper-coach-decks .sbb-sr__wrapper{--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-black) 30%, transparent);--sbb-scrollbar-color: light-dark( color-mix(in srgb, var(--sbb-color-black) 30%, transparent), color-mix(in srgb, var(--sbb-color-white) 30%, transparent) );--sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);--sbb-scrollbar-color-hover: light-dark( color-mix(in srgb, var(--sbb-color-black) 60%, transparent), color-mix(in srgb, var(--sbb-color-white) 60%, transparent) );--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .coaches-grid .sbb-sr__wrapper-coach-decks .sbb-sr__wrapper::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .coaches-grid .sbb-sr__wrapper-coach-decks .sbb-sr__wrapper::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .coaches-grid .sbb-sr__wrapper-coach-decks .sbb-sr__wrapper::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .coaches-grid .sbb-sr__wrapper-coach-decks .sbb-sr__wrapper::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .coaches-grid .sbb-sr__wrapper-coach-decks .sbb-sr__wrapper::-webkit-scrollbar-button,:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .coaches-grid .sbb-sr__wrapper-coach-decks .sbb-sr__wrapper::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .coaches-grid .sbb-sr__wrapper-coach-decks .sbb-sr__wrapper{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .coaches-grid .sbb-sr__wrapper-coach-decks .sbb-sr__wrapper{overflow:hidden scroll;height:100%;padding:0}:host([align-vertical]) .sbb-sr .sbb-sr-grid-inner .coaches-grid .sbb-sr__wrapper-coach-decks .sbb-sr__parent{rotate:90deg;transform-origin:calc((var(--sbb-seat-reservation-height) + 24 - 24 - 6 * (var(--sbb-seat-reservation-decks) - 1)) / 2 * var(--sbb-seat-reservation-one-px-rem, .0625rem)) calc((var(--sbb-seat-reservation-height) + 24 - 24 - 6 * (var(--sbb-seat-reservation-decks) - 1)) / 2 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}`;
|
|
18
18
|
let q = (() => {
|
|
19
19
|
var h;
|
|
20
|
-
let
|
|
21
|
-
return h = class extends
|
|
20
|
+
let C = [S("sbb-seat-reservation")], f, k = [], d, x = E;
|
|
21
|
+
return h = class extends x {
|
|
22
22
|
constructor() {
|
|
23
23
|
super(...arguments), this._language = new A(this), this._notAreaElements = [
|
|
24
24
|
"DRIVER_AREA",
|
|
@@ -64,7 +64,7 @@ let q = (() => {
|
|
|
64
64
|
>
|
|
65
65
|
<div id="sbb-sr__parent-area" class="sbb-sr__parent" tabindex="-1">
|
|
66
66
|
<ul
|
|
67
|
-
class="${
|
|
67
|
+
class="${w({
|
|
68
68
|
"sbb-sr__list-decks": !0,
|
|
69
69
|
"sbb-sr__list-decks--gap": this.hasMultipleDecks
|
|
70
70
|
})}"
|
|
@@ -90,25 +90,25 @@ let q = (() => {
|
|
|
90
90
|
}
|
|
91
91
|
_renderDeckLabels() {
|
|
92
92
|
return this.hasMultipleDecks ? this.seatReservations.map((r) => {
|
|
93
|
-
const e =
|
|
93
|
+
const e = l(r.deckCoachLevel, this._language.current);
|
|
94
94
|
return b`<b aria-hidden="true">${e}</b>`;
|
|
95
95
|
}) : null;
|
|
96
96
|
}
|
|
97
97
|
_renderNavigationControlButton(r) {
|
|
98
98
|
if (!this.hasNavigation || !this.seatReservations)
|
|
99
99
|
return null;
|
|
100
|
-
const e = r == "DIRECTION_RIGHT" ? "last-tab-element" : "first-tab-element",
|
|
101
|
-
let
|
|
102
|
-
return (r == "DIRECTION_LEFT" && this.selectedCoachIndex > 0 || r == "DIRECTION_RIGHT" && this.selectedCoachIndex < this.seatReservations[this.currSelectedDeckIndex].coachItems.length - 1) && (
|
|
100
|
+
const e = r == "DIRECTION_RIGHT" ? "last-tab-element" : "first-tab-element", t = r == "DIRECTION_RIGHT" ? "chevron-small-right-small" : "chevron-small-left-small", a = r == "DIRECTION_RIGHT" ? l("SEAT_RESERVATION_END", this._language.current) : l("SEAT_RESERVATION_BEGIN", this._language.current);
|
|
101
|
+
let s = !0;
|
|
102
|
+
return (r == "DIRECTION_LEFT" && this.selectedCoachIndex > 0 || r == "DIRECTION_RIGHT" && this.selectedCoachIndex < this.seatReservations[this.currSelectedDeckIndex].coachItems.length - 1) && (s = !1), b`<sbb-secondary-button
|
|
103
103
|
@click="${() => this.navigateByDirectionBtn(r)}"
|
|
104
104
|
id="${e}"
|
|
105
105
|
class="sbb-sr__navigation-control-button"
|
|
106
106
|
size="s"
|
|
107
|
-
icon-name="${
|
|
107
|
+
icon-name="${t}"
|
|
108
108
|
type="button"
|
|
109
|
-
aria-label="${
|
|
109
|
+
aria-label="${a}"
|
|
110
110
|
role="contentinfo"
|
|
111
|
-
.disabledInteractive="${
|
|
111
|
+
.disabledInteractive="${s || u}"
|
|
112
112
|
></sbb-secondary-button>`;
|
|
113
113
|
}
|
|
114
114
|
_renderNavigation() {
|
|
@@ -117,13 +117,13 @@ let q = (() => {
|
|
|
117
117
|
<ul
|
|
118
118
|
id="sbb-sr__navigation-list-coaches"
|
|
119
119
|
class="sbb-sr-navigation__list-coaches"
|
|
120
|
-
aria-label="${
|
|
120
|
+
aria-label="${l("SEAT_RESERVATION_NAVIGATION", this._language.current)}"
|
|
121
121
|
>
|
|
122
122
|
${this.coachNavData.map((r, e) => b`<li>
|
|
123
123
|
<sbb-seat-reservation-navigation-coach
|
|
124
|
-
@selectcoach=${(
|
|
124
|
+
@selectcoach=${(t) => this._onSelectNavCoach(t)}
|
|
125
125
|
@focuscoach=${() => this._onFocusNavCoach()}
|
|
126
|
-
class="${
|
|
126
|
+
class="${w({
|
|
127
127
|
"sbb-sr__navigation-coach--hover-scroll": this.hoveredScrollCoachIndex === e
|
|
128
128
|
})}"
|
|
129
129
|
index="${e}"
|
|
@@ -151,15 +151,15 @@ let q = (() => {
|
|
|
151
151
|
* @param deckIndex
|
|
152
152
|
*/
|
|
153
153
|
_renderCoaches(r, e) {
|
|
154
|
-
const
|
|
155
|
-
return
|
|
154
|
+
const t = JSON.parse(JSON.stringify(r?.coachItems));
|
|
155
|
+
return t ? t.map((a, s) => b`
|
|
156
156
|
<li class="sbb-sr__item-coach">
|
|
157
|
-
${this._renderCoachElement(s,
|
|
157
|
+
${this._renderCoachElement(a, s, e, r.deckCoachIndex)}
|
|
158
158
|
</li>
|
|
159
159
|
`) : null;
|
|
160
160
|
}
|
|
161
|
-
_renderCoachElement(r, e, a) {
|
|
162
|
-
const s = this.getCalculatedDimension(r.dimension),
|
|
161
|
+
_renderCoachElement(r, e, t, a) {
|
|
162
|
+
const s = this.getCalculatedDimension(r.dimension), i = this._getDescriptionTableCoach(r);
|
|
163
163
|
return b`<sbb-seat-reservation-scoped
|
|
164
164
|
style=${v({
|
|
165
165
|
"--sbb-seat-reservation-scoped-width": s.w,
|
|
@@ -167,8 +167,8 @@ let q = (() => {
|
|
|
167
167
|
})}
|
|
168
168
|
>
|
|
169
169
|
${this._getRenderedCoachBorders(r)}
|
|
170
|
-
${this._getRenderedGraphicalElements(r.graphicElements || [], r.dimension, e,
|
|
171
|
-
${this._getRenderedServiceElements(e,
|
|
170
|
+
${this._getRenderedGraphicalElements(r.graphicElements || [], r.dimension, e, t)}
|
|
171
|
+
${this._getRenderedServiceElements(e, t, r.serviceElements)}
|
|
172
172
|
|
|
173
173
|
<table
|
|
174
174
|
@focus=${() => this.onFocusTableCoachAndPreselectPlace(e)}
|
|
@@ -177,9 +177,9 @@ let q = (() => {
|
|
|
177
177
|
aria-describedby="sbb-sr-coach-caption-${e}"
|
|
178
178
|
>
|
|
179
179
|
<caption id="sbb-sr-coach-caption-${e}" tabindex="-1">
|
|
180
|
-
<sbb-screen-reader-only>${
|
|
180
|
+
<sbb-screen-reader-only>${i}</sbb-screen-reader-only>
|
|
181
181
|
</caption>
|
|
182
|
-
${this._getRenderedRowPlaces(r, e, a)}
|
|
182
|
+
${this._getRenderedRowPlaces(r, e, t, a)}
|
|
183
183
|
</table>
|
|
184
184
|
</sbb-seat-reservation-scoped>`;
|
|
185
185
|
}
|
|
@@ -190,11 +190,11 @@ let q = (() => {
|
|
|
190
190
|
_getRenderedCoachBorders(r) {
|
|
191
191
|
if (!r.graphicElements)
|
|
192
192
|
return null;
|
|
193
|
-
const e = 1,
|
|
193
|
+
const e = 1, a = r.graphicElements?.find((n) => n.icon === "DRIVER_AREA"), s = a ? r.dimension.w - a.dimension.w - e : r.dimension.w - e * 2, i = (r.dimension.h + this.coachBorderOffset * 2) * this.baseGridSize, o = a && a.position.x === 0 ? a?.dimension.w * this.baseGridSize : this.baseGridSize;
|
|
194
194
|
return b`
|
|
195
195
|
<sbb-seat-reservation-graphic
|
|
196
196
|
style=${v({
|
|
197
|
-
"--sbb-seat-reservation-graphic-width":
|
|
197
|
+
"--sbb-seat-reservation-graphic-width": s * this.baseGridSize,
|
|
198
198
|
"--sbb-seat-reservation-graphic-height": i,
|
|
199
199
|
"--sbb-seat-reservation-graphic-top": this.coachBorderPadding * -1,
|
|
200
200
|
"--sbb-seat-reservation-graphic-left": o,
|
|
@@ -206,45 +206,46 @@ let q = (() => {
|
|
|
206
206
|
></sbb-seat-reservation-graphic>
|
|
207
207
|
`;
|
|
208
208
|
}
|
|
209
|
-
_getRenderedRowPlaces(r, e, a) {
|
|
209
|
+
_getRenderedRowPlaces(r, e, t, a) {
|
|
210
210
|
if (!r.places)
|
|
211
211
|
return null;
|
|
212
212
|
const s = {};
|
|
213
|
-
for (const
|
|
214
|
-
s[
|
|
215
|
-
return Object.values(s).map((
|
|
216
|
-
<tr id="row-${e}-${
|
|
217
|
-
${this._getRenderedColumnPlaces(
|
|
213
|
+
for (const i of r.places)
|
|
214
|
+
s[i.position.y] ? s[i.position.y].push(i) : s[i.position.y] = [i];
|
|
215
|
+
return Object.values(s).map((i, o) => b`
|
|
216
|
+
<tr id="row-${e}-${i[0].position.y}" data-row-index=${o}>
|
|
217
|
+
${this._getRenderedColumnPlaces(i, e, t, a)}
|
|
218
218
|
</tr>
|
|
219
|
-
`).flatMap((
|
|
219
|
+
`).flatMap((i) => i);
|
|
220
220
|
}
|
|
221
|
-
_getRenderedColumnPlaces(r, e, a) {
|
|
222
|
-
return r.sort((s,
|
|
223
|
-
const
|
|
221
|
+
_getRenderedColumnPlaces(r, e, t, a) {
|
|
222
|
+
return r.sort((s, i) => Number(s.position.x) - Number(i.position.x)), r?.map((s, i) => {
|
|
223
|
+
const o = this.getCalculatedDimension(s.dimension), n = this.getCalculatedPosition(s.position), p = s.rotation || 0, c = this.alignVertical ? -90 : 0, g = this.getPlaceElementId(t, e, s.number);
|
|
224
224
|
return b`
|
|
225
225
|
<td
|
|
226
|
-
id="cell-${
|
|
226
|
+
id="cell-${t}-${e}-${s.position.y}-${i}"
|
|
227
227
|
class="graphical-element"
|
|
228
228
|
>
|
|
229
229
|
<sbb-seat-reservation-place-control
|
|
230
230
|
style=${v({
|
|
231
|
-
"--sbb-seat-reservation-place-control-text-scale-value": Math.min(
|
|
232
|
-
"--sbb-seat-reservation-place-control-width":
|
|
233
|
-
"--sbb-seat-reservation-place-control-height":
|
|
234
|
-
"--sbb-seat-reservation-place-control-top":
|
|
235
|
-
"--sbb-seat-reservation-place-control-left":
|
|
236
|
-
"--sbb-seat-reservation-place-control-rotation":
|
|
237
|
-
"--sbb-seat-reservation-place-control-text-rotation":
|
|
231
|
+
"--sbb-seat-reservation-place-control-text-scale-value": Math.min(o.w, o.h),
|
|
232
|
+
"--sbb-seat-reservation-place-control-width": o.w,
|
|
233
|
+
"--sbb-seat-reservation-place-control-height": o.h,
|
|
234
|
+
"--sbb-seat-reservation-place-control-top": n.y,
|
|
235
|
+
"--sbb-seat-reservation-place-control-left": n.x,
|
|
236
|
+
"--sbb-seat-reservation-place-control-rotation": p,
|
|
237
|
+
"--sbb-seat-reservation-place-control-text-rotation": c
|
|
238
238
|
})}
|
|
239
|
-
@selectplace=${(
|
|
239
|
+
@selectplace=${(_) => this._onSelectPlace(_)}
|
|
240
240
|
exportparts="sbb-sr-place-part"
|
|
241
|
-
id
|
|
241
|
+
id=${g}
|
|
242
242
|
class="seat-reservation-place-control"
|
|
243
243
|
text=${s.number}
|
|
244
244
|
type=${s.type}
|
|
245
245
|
state=${s.state}
|
|
246
246
|
coach-index=${e}
|
|
247
247
|
deck-index=${a}
|
|
248
|
+
data-deck-index=${t}
|
|
248
249
|
.propertyIds=${s.propertyIds}
|
|
249
250
|
.preventClick=${this.preventPlaceClick}
|
|
250
251
|
></sbb-seat-reservation-place-control>
|
|
@@ -252,10 +253,10 @@ let q = (() => {
|
|
|
252
253
|
`;
|
|
253
254
|
});
|
|
254
255
|
}
|
|
255
|
-
_getRenderedGraphicalElements(r, e,
|
|
256
|
-
return r ? r?.map((
|
|
257
|
-
const i =
|
|
258
|
-
return this._notAreaElements.findIndex((c) => c === i) > -1 ? this._getRenderElementWithoutArea(
|
|
256
|
+
_getRenderedGraphicalElements(r, e, t, a) {
|
|
257
|
+
return r ? r?.map((s) => {
|
|
258
|
+
const i = s.icon ?? "", o = s.rotation || 0, n = this._notFixedRotatableAreaIcons.indexOf(s.icon) === -1, p = this.alignVertical && n ? o - 90 : o;
|
|
259
|
+
return this._notAreaElements.findIndex((c) => c === i) > -1 ? this._getRenderElementWithoutArea(s, o, e) : this._getRenderElementWithArea(s, p, e, t, a);
|
|
259
260
|
}) : null;
|
|
260
261
|
}
|
|
261
262
|
/**
|
|
@@ -267,20 +268,20 @@ let q = (() => {
|
|
|
267
268
|
* @param coachDeckIndex used to generate a unique id
|
|
268
269
|
* @private
|
|
269
270
|
*/
|
|
270
|
-
_getRenderElementWithArea(r, e, a, s
|
|
271
|
-
const i = r.icon?.indexOf("TABLE") === -1, o = r.icon && i ? r.icon : null,
|
|
272
|
-
let
|
|
273
|
-
return r.position.y === this.coachBorderOffset * -1 ?
|
|
271
|
+
_getRenderElementWithArea(r, e, t, a, s) {
|
|
272
|
+
const i = r.icon?.indexOf("TABLE") === -1, o = r.icon && i ? r.icon : null, n = this.isElementDirectlyOnBorder(r, t) && o !== "ENTRY_EXIT", p = r.icon ? l(r.icon, this._language.current) : u, c = this.getCalculatedDimension(r.dimension, t, !0, n), g = this.getCalculatedPosition(r.position, r.dimension, t, !0), _ = `popover-trigger-${s}-${a}-${g.x}-${g.y}`;
|
|
273
|
+
let m = "free";
|
|
274
|
+
return r.position.y === this.coachBorderOffset * -1 ? m = "upper-border" : r.position.y + r.dimension.h === t.h + this.coachBorderOffset && (m = "lower-border"), b`
|
|
274
275
|
<sbb-seat-reservation-area
|
|
275
|
-
id="${
|
|
276
|
-
class="${
|
|
276
|
+
id="${_}"
|
|
277
|
+
class="${w({ "sbb-seat-reservation-area--cursor-pointer": o !== null })}"
|
|
277
278
|
style=${v({
|
|
278
279
|
"--sbb-seat-reservation-area-width": c.w,
|
|
279
280
|
"--sbb-seat-reservation-area-height": c.h,
|
|
280
|
-
"--sbb-seat-reservation-area-top":
|
|
281
|
-
"--sbb-seat-reservation-area-left":
|
|
281
|
+
"--sbb-seat-reservation-area-top": g.y,
|
|
282
|
+
"--sbb-seat-reservation-area-left": g.x
|
|
282
283
|
})}
|
|
283
|
-
mounting=${
|
|
284
|
+
mounting=${m}
|
|
284
285
|
background="dark"
|
|
285
286
|
aria-hidden="true"
|
|
286
287
|
>
|
|
@@ -296,30 +297,30 @@ let q = (() => {
|
|
|
296
297
|
aria-hidden="true"
|
|
297
298
|
class="auto-width"
|
|
298
299
|
></sbb-seat-reservation-graphic>
|
|
299
|
-
` :
|
|
300
|
+
` : u}
|
|
300
301
|
</sbb-seat-reservation-area>
|
|
301
|
-
${o ? this._popover(
|
|
302
|
+
${o ? this._popover(_, p) : u}
|
|
302
303
|
`;
|
|
303
304
|
}
|
|
304
|
-
_getRenderElementWithoutArea(r, e,
|
|
305
|
-
const
|
|
305
|
+
_getRenderElementWithoutArea(r, e, t) {
|
|
306
|
+
const a = this.getCalculatedDimension(r.dimension, t), s = this.getCalculatedPosition(r.position, r.dimension, t), i = r.icon && r.icon.indexOf("DRIVER_AREA") === -1 ? r.icon : r.icon?.concat("_", this.seatReservations[this.currSelectedDeckIndex].vehicleType);
|
|
306
307
|
return b` <sbb-seat-reservation-graphic
|
|
307
308
|
style=${v({
|
|
308
|
-
"--sbb-seat-reservation-graphic-width":
|
|
309
|
-
"--sbb-seat-reservation-graphic-height":
|
|
310
|
-
"--sbb-seat-reservation-graphic-top":
|
|
311
|
-
"--sbb-seat-reservation-graphic-left":
|
|
309
|
+
"--sbb-seat-reservation-graphic-width": a.w,
|
|
310
|
+
"--sbb-seat-reservation-graphic-height": a.h,
|
|
311
|
+
"--sbb-seat-reservation-graphic-top": s.y,
|
|
312
|
+
"--sbb-seat-reservation-graphic-left": s.x,
|
|
312
313
|
"--sbb-seat-reservation-graphic-position": "absolute",
|
|
313
314
|
"--sbb-seat-reservation-graphic-rotation": e
|
|
314
315
|
})}
|
|
315
|
-
name=${i ??
|
|
316
|
+
name=${i ?? u}
|
|
316
317
|
aria-hidden="true"
|
|
317
318
|
?stretch=${!0}
|
|
318
319
|
></sbb-seat-reservation-graphic>`;
|
|
319
320
|
}
|
|
320
|
-
_getRenderedServiceElements(r, e,
|
|
321
|
-
return
|
|
322
|
-
const
|
|
321
|
+
_getRenderedServiceElements(r, e, t) {
|
|
322
|
+
return t ? t?.map((a) => {
|
|
323
|
+
const s = a.icon ? l(a.icon, this._language.current) : null, i = this.getCalculatedDimension(a.dimension), o = this.getCalculatedPosition(a.position), n = a.rotation || 0, p = this.alignVertical ? n - 90 : n, c = `popover-trigger-${e}-${r}-${o.x}-${o.y}`;
|
|
323
324
|
return b`
|
|
324
325
|
<sbb-seat-reservation-graphic
|
|
325
326
|
id="${c}"
|
|
@@ -332,11 +333,11 @@ let q = (() => {
|
|
|
332
333
|
"--sbb-seat-reservation-graphic-rotation": p
|
|
333
334
|
})}
|
|
334
335
|
class="sbb-seat-reservation-graphic--cursor-pointer"
|
|
335
|
-
name=${
|
|
336
|
+
name=${a.icon ?? u}
|
|
336
337
|
role="img"
|
|
337
338
|
aria-hidden="true"
|
|
338
339
|
></sbb-seat-reservation-graphic>
|
|
339
|
-
${this._popover(c,
|
|
340
|
+
${this._popover(c, s)}
|
|
340
341
|
`;
|
|
341
342
|
}) : null;
|
|
342
343
|
}
|
|
@@ -347,7 +348,7 @@ let q = (() => {
|
|
|
347
348
|
*/
|
|
348
349
|
_onSelectPlace(r) {
|
|
349
350
|
const e = r.detail;
|
|
350
|
-
this.preventCoachScrollByPlaceClick = !0, this.isCoachGridFocusable = !1, this.preventPlaceClick || (this.
|
|
351
|
+
this.preventCoachScrollByPlaceClick = !0, this.isCoachGridFocusable = !1, this.preventPlaceClick || (this.updateSelectedSeatReservationPlaces(e), this.updateCurrentSelectedPlaceInCoach(e));
|
|
351
352
|
}
|
|
352
353
|
_onSelectNavCoach(r) {
|
|
353
354
|
const e = r.detail;
|
|
@@ -378,33 +379,33 @@ let q = (() => {
|
|
|
378
379
|
}
|
|
379
380
|
_getDescriptionTableCoach(r) {
|
|
380
381
|
if (!r.places?.length)
|
|
381
|
-
return
|
|
382
|
+
return l("COACH_BLOCKED_TABLE_CAPTION", this._language.current, [
|
|
382
383
|
r.id
|
|
383
384
|
]);
|
|
384
385
|
let e;
|
|
385
|
-
const
|
|
386
|
-
if (e =
|
|
386
|
+
const t = this._getTitleDescriptionListString(r.graphicElements), a = this._getTitleDescriptionListString(r.serviceElements);
|
|
387
|
+
if (e = l("COACH_TABLE_CAPTION", this._language.current, [
|
|
387
388
|
r.id
|
|
388
389
|
]), !this.hasNavigation) {
|
|
389
|
-
const
|
|
390
|
+
const s = this.getAvailableFreePlacesNumFromCoach(r.places), i = l("COACH_AVAILABLE_NUMBER_OF_PLACES", this._language.current, [s.seats, s.bicycles]);
|
|
390
391
|
e = e.concat(". ").concat(i).concat(". ");
|
|
391
392
|
}
|
|
392
|
-
return (
|
|
393
|
+
return (t || a) && (e += ". " + l("COACH_AVAILABLE_SERVICES", this._language.current) + ": ", e += a + ", " + t + "."), e;
|
|
393
394
|
}
|
|
394
395
|
_getTitleDescriptionListString(r) {
|
|
395
396
|
const e = [];
|
|
396
|
-
return r?.map((
|
|
397
|
-
const
|
|
398
|
-
if (!
|
|
397
|
+
return r?.map((t) => {
|
|
398
|
+
const a = t.icon;
|
|
399
|
+
if (!a)
|
|
399
400
|
return null;
|
|
400
|
-
const
|
|
401
|
-
return
|
|
402
|
-
}).filter((
|
|
401
|
+
const s = e.indexOf(a) > -1, i = l(t.icon, this._language.current), o = this._notFixedRotatableAreaIcons.indexOf(a) === -1 && this._notAreaElements.indexOf(a) === -1;
|
|
402
|
+
return s || e.push(t.icon), i && !s && o ? i : null;
|
|
403
|
+
}).filter((t) => !!t).join(", ");
|
|
403
404
|
}
|
|
404
405
|
}, d = h, (() => {
|
|
405
|
-
const r = typeof Symbol == "function" && Symbol.metadata ? Object.create(
|
|
406
|
-
|
|
407
|
-
})(), h.styles = T, y(d,
|
|
406
|
+
const r = typeof Symbol == "function" && Symbol.metadata ? Object.create(x[Symbol.metadata] ?? null) : void 0;
|
|
407
|
+
$(null, f = { value: d }, C, { kind: "class", name: d.name, metadata: r }, null, k), d = f.value, r && Object.defineProperty(d, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: r });
|
|
408
|
+
})(), h.styles = T, y(d, k), d;
|
|
408
409
|
})();
|
|
409
410
|
export {
|
|
410
411
|
q as SbbSeatReservationElement
|
|
@@ -7,7 +7,7 @@ import { __esDecorate as v, __runInitializers as l } from "tslib";
|
|
|
7
7
|
import { forceType as z } from "@sbb-esta/lyne-elements/core/decorators.js";
|
|
8
8
|
import { css as E, LitElement as I, html as j } from "lit";
|
|
9
9
|
import { customElement as D, property as S } from "lit/decorators.js";
|
|
10
|
-
const O = E`*,:before,:after{box-sizing:border-box}:host{--sbb-seat-reservation-area-border-radius: var(--sbb-border-width-4x);--sbb-seat-reservation-area-rotation: 0;display:flex;justify-content:center;align-items:center;height:calc(var(--sbb-seat-reservation-area-height) * var(--sbb-seat-reservation-one-px-rem, .0625rem));width:calc(var(--sbb-seat-reservation-area-width) * var(--sbb-seat-reservation-one-px-rem, .0625rem));border:var(--sbb-border-width-1x) solid var(--sbb-color-graphite);border:var(--sbb-border-width-1x) solid light-dark(var(--sbb-color-graphite),var(--sbb-color-granite));border-radius:var(--sbb-seat-reservation-area-border-radius);position:absolute;inset-block-start:calc(var(--sbb-seat-reservation-area-top) * var(--sbb-seat-reservation-one-px-rem, .0625rem));inset-inline-start:calc(var(--sbb-seat-reservation-area-left) * var(--sbb-seat-reservation-one-px-rem, .0625rem));rotate:calc(var(--sbb-seat-reservation-area-rotation) * 1deg);line-height:normal;background-color:var(--sbb-background-color-2)}:host([background=dark]){background-color:var(--sbb-color-milk);background-color:light-dark(var(--sbb-color-milk),var(--sbb-color-iron))}:host([mounting=upper-border]){border-block-start-width:var(--sbb-border-width-2x);border-radius:0 0 var(--sbb-seat-reservation-area-border-radius) var(--sbb-seat-reservation-area-border-radius)}:host([mounting=lower-border]){border-block-end-width:var(--sbb-border-width-2x);border-radius:var(--sbb-seat-reservation-area-border-radius) var(--sbb-seat-reservation-area-border-radius) 0 0}:host([mounting=upper-to-lower-border]){border-block-start:none;border-block-end:none;border-radius:0}:host(.sbb-seat-reservation-area--cursor-pointer){cursor:pointer}`;
|
|
10
|
+
const O = E`*,:before,:after{box-sizing:border-box}:host{--sbb-seat-reservation-area-border-radius: var(--sbb-border-width-4x);--sbb-seat-reservation-area-rotation: 0;display:flex;justify-content:center;align-items:center;height:calc(var(--sbb-seat-reservation-area-height) * var(--sbb-seat-reservation-one-px-rem, .0625rem));width:calc(var(--sbb-seat-reservation-area-width) * var(--sbb-seat-reservation-one-px-rem, .0625rem));border:var(--sbb-border-width-1x) solid var(--sbb-color-graphite);border:var(--sbb-border-width-1x) solid light-dark(var(--sbb-color-graphite),var(--sbb-color-granite));border-radius:var(--sbb-seat-reservation-area-border-radius);position:absolute;inset-block-start:calc(var(--sbb-seat-reservation-area-top) * var(--sbb-seat-reservation-one-px-rem, .0625rem));inset-inline-start:calc(var(--sbb-seat-reservation-area-left) * var(--sbb-seat-reservation-one-px-rem, .0625rem));rotate:calc(var(--sbb-seat-reservation-area-rotation) * 1deg);line-height:normal;background-color:var(--sbb-background-color-2)}:host([background=dark]){background-color:var(--sbb-color-milk);background-color:light-dark(var(--sbb-color-milk),var(--sbb-color-iron))}:host([mounting=upper-border]){border-block-start-width:var(--sbb-border-width-2x);border-radius:0 0 var(--sbb-seat-reservation-area-border-radius) var(--sbb-seat-reservation-area-border-radius)}:host([mounting=lower-border]){border-block-end-width:var(--sbb-border-width-2x);border-radius:var(--sbb-seat-reservation-area-border-radius) var(--sbb-seat-reservation-area-border-radius) 0 0}:host([mounting=upper-to-lower-border]){border-block-start:none;border-block-end:none;border-radius:0}:host(.sbb-seat-reservation-area--cursor-pointer){cursor:var(--sbb-cursor-pointer)}`;
|
|
11
11
|
let B = (() => {
|
|
12
12
|
var n, b, o;
|
|
13
13
|
let r = [D("sbb-seat-reservation-area")], e, t = [], s, g = I, h, p = [], k = [], _, f = [], x = [];
|
|
@@ -11,7 +11,7 @@ import { customElement as D, property as N } from "lit/decorators.js";
|
|
|
11
11
|
import { classMap as O } from "lit/directives/class-map.js";
|
|
12
12
|
import { mapIconToSvg as C, getI18nSeatReservation as L } from "../common.js";
|
|
13
13
|
import "@sbb-esta/lyne-elements/icon.js";
|
|
14
|
-
const R = $`*,:before,:after{box-sizing:border-box}:host{--sbb-seat-reservation-graphic-width: 16;--sbb-seat-reservation-graphic-height: 16;--sbb-seat-reservation-graphic-rotation: 0;--sbb-seat-reservation-graphic-inverse-rotation: 0;--sbb-seat-reservation-graphic-position: initial;--sbb-seat-reservation-graphic-left: 0;--sbb-seat-reservation-graphic-top: 0;--sbb-icon-svg-width: calc( var(--sbb-seat-reservation-graphic-width) * var(--sbb-seat-reservation-one-px-rem, .0625rem) );--sbb-icon-svg-height: calc( var(--sbb-seat-reservation-graphic-height) * var(--sbb-seat-reservation-one-px-rem, .0625rem) );display:flex;justify-content:center;align-items:center;width:calc(var(--sbb-seat-reservation-graphic-width) * var(--sbb-seat-reservation-one-px-rem, .0625rem));height:calc(var(--sbb-seat-reservation-graphic-height) * var(--sbb-seat-reservation-one-px-rem, .0625rem));position:var(--sbb-seat-reservation-graphic-position);inset-inline-start:calc(var(--sbb-seat-reservation-graphic-left) * var(--sbb-seat-reservation-one-px-rem, .0625rem));inset-block-start:calc(var(--sbb-seat-reservation-graphic-top) * var(--sbb-seat-reservation-one-px-rem, .0625rem))}:host(.auto-width){--sbb-icon-svg-width: auto;max-width:calc(var(--sbb-seat-reservation-graphic-max-width) * var(--sbb-seat-reservation-one-px-rem, .0625rem));width:auto}:host(.sbb-seat-reservation-graphic--cursor-pointer){cursor:pointer}.sbb-sr-icon,.sbb-sr-graphic{width:inherit;height:inherit;transform-origin:center;rotate:calc(var(--sbb-seat-reservation-graphic-rotation) * 1deg)}.sbb-sr-icon{color:var(--sbb-color-granite);color:light-dark(var(--sbb-color-granite),var(--sbb-color-graphite))}.sbb-sr-graphic svg{width:100%;height:100%}.sbb-sr-graphic svg .fix-rotation-inverse{transform-origin:center;rotate:calc(var(--sbb-seat-reservation-graphic-inverse-rotation) * 1deg)}@media(forced-colors:active){.sbb-sr-graphic svg:not(.color-immutable) [fill]:not([fill=none]){fill:currentcolor}.sbb-sr-graphic .no-bg{fill:transparent}}`;
|
|
14
|
+
const R = $`*,:before,:after{box-sizing:border-box}:host{--sbb-seat-reservation-graphic-width: 16;--sbb-seat-reservation-graphic-height: 16;--sbb-seat-reservation-graphic-rotation: 0;--sbb-seat-reservation-graphic-inverse-rotation: 0;--sbb-seat-reservation-graphic-position: initial;--sbb-seat-reservation-graphic-left: 0;--sbb-seat-reservation-graphic-top: 0;--sbb-icon-svg-width: calc( var(--sbb-seat-reservation-graphic-width) * var(--sbb-seat-reservation-one-px-rem, .0625rem) );--sbb-icon-svg-height: calc( var(--sbb-seat-reservation-graphic-height) * var(--sbb-seat-reservation-one-px-rem, .0625rem) );display:flex;justify-content:center;align-items:center;width:calc(var(--sbb-seat-reservation-graphic-width) * var(--sbb-seat-reservation-one-px-rem, .0625rem));height:calc(var(--sbb-seat-reservation-graphic-height) * var(--sbb-seat-reservation-one-px-rem, .0625rem));position:var(--sbb-seat-reservation-graphic-position);inset-inline-start:calc(var(--sbb-seat-reservation-graphic-left) * var(--sbb-seat-reservation-one-px-rem, .0625rem));inset-block-start:calc(var(--sbb-seat-reservation-graphic-top) * var(--sbb-seat-reservation-one-px-rem, .0625rem))}:host(.auto-width){--sbb-icon-svg-width: auto;max-width:calc(var(--sbb-seat-reservation-graphic-max-width) * var(--sbb-seat-reservation-one-px-rem, .0625rem));width:auto}:host(.sbb-seat-reservation-graphic--cursor-pointer){cursor:var(--sbb-cursor-pointer)}.sbb-sr-icon,.sbb-sr-graphic{width:inherit;height:inherit;transform-origin:center;rotate:calc(var(--sbb-seat-reservation-graphic-rotation) * 1deg)}.sbb-sr-icon{color:var(--sbb-color-granite);color:light-dark(var(--sbb-color-granite),var(--sbb-color-graphite))}.sbb-sr-graphic svg{width:100%;height:100%}.sbb-sr-graphic svg .fix-rotation-inverse{transform-origin:center;rotate:calc(var(--sbb-seat-reservation-graphic-inverse-rotation) * 1deg)}@media(forced-colors:active){.sbb-sr-graphic svg:not(.color-immutable) [fill]:not([fill=none]){fill:currentcolor}.sbb-sr-graphic .no-bg{fill:transparent}}`;
|
|
15
15
|
let K = (() => {
|
|
16
16
|
var n, c, o;
|
|
17
17
|
let t = [D("sbb-seat-reservation-graphic")], r, s = [], i, d = j, f, _ = [], x = [], w, S = [], y = [];
|
|
@@ -14,7 +14,9 @@ export declare class SbbSeatReservationNavigationCoachElement extends LitElement
|
|
|
14
14
|
accessor coachId: string;
|
|
15
15
|
/** Coach service property ids, which are used to display the services in the navigation */
|
|
16
16
|
accessor propertyIds: string[];
|
|
17
|
+
/** Pre-selected coach index property */
|
|
17
18
|
accessor selected: boolean;
|
|
19
|
+
/** Focused coach index property */
|
|
18
20
|
accessor focused: boolean;
|
|
19
21
|
accessor index: number;
|
|
20
22
|
/** Representation of places available for selecting, counting seat places and bicycle places separetely */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"seat-reservation-navigation-coach.component.d.ts","sourceRoot":"","sources":["../../../../src/elements-experimental/seat-reservation/seat-reservation-navigation-coach/seat-reservation-navigation-coach.component.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,cAAc,EAAW,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAC7F,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAKvC,OAAO,KAAK,EAAE,uBAAuB,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAI9E,OAAO,+CAA+C,CAAC;AACvD,OAAO,4CAA4C,CAAC;AAEpD,MAAM,MAAM,uBAAuB,GAAG,MAAM,CAAC;AAE7C;;GAEG;AACH,qBAEM,wCAAyC,SAAQ,UAAU;IAC/D,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;;MAGlB;IAEX,sEAAsE;IACtE,SAEgB,OAAO,EAAE,MAAM,CAAM;IAErC,2FAA2F;IAC3F,SACgB,WAAW,EAAE,MAAM,EAAE,CAAM;
|
|
1
|
+
{"version":3,"file":"seat-reservation-navigation-coach.component.d.ts","sourceRoot":"","sources":["../../../../src/elements-experimental/seat-reservation/seat-reservation-navigation-coach/seat-reservation-navigation-coach.component.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,cAAc,EAAW,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAC7F,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAKvC,OAAO,KAAK,EAAE,uBAAuB,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAI9E,OAAO,+CAA+C,CAAC;AACvD,OAAO,4CAA4C,CAAC;AAEpD,MAAM,MAAM,uBAAuB,GAAG,MAAM,CAAC;AAE7C;;GAEG;AACH,qBAEM,wCAAyC,SAAQ,UAAU;IAC/D,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;;MAGlB;IAEX,sEAAsE;IACtE,SAEgB,OAAO,EAAE,MAAM,CAAM;IAErC,2FAA2F;IAC3F,SACgB,WAAW,EAAE,MAAM,EAAE,CAAM;IAE3C,wCAAwC;IACxC,SAEgB,QAAQ,EAAE,OAAO,CAAS;IAE1C,mCAAmC;IACnC,SAEgB,OAAO,EAAE,OAAO,CAAS;IAEzC,SAEgB,KAAK,EAAE,MAAM,CAAK;IAElC,2GAA2G;IAC3G,SACgB,gBAAgB,EAAE,uBAAuB,CAA6B;IAEtF,gCAAgC;IAChC,SACgB,WAAW,EAAE,gBAAgB,EAAE,CAAiB;IAEhE,+CAA+C;IAC/C,SAEgB,UAAU,EAAE,OAAO,CAAS;IAE5C,kDAAkD;IAClD,SAEgB,KAAK,EAAE,OAAO,CAAS;IAEvC,iDAAiD;IACjD,SAEgB,IAAI,EAAE,OAAO,CAAS;IAEtC,mCAAmC;IACnC,SAEgB,OAAO,EAAE,OAAO,CAAS;IAEzC,6DAA6D;IAC7D,SAEgB,QAAQ,EAAE,OAAO,CAAS;IAE1C,OAAO,CAAC,SAAS,CAAmC;cAEjC,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAwB5E;;;;OAIG;cACgB,MAAM,IAAI,cAAc;IAqB3C,OAAO,CAAC,oBAAoB;IAwB5B,OAAO,CAAC,kBAAkB;IA4B1B,OAAO,CAAC,kCAAkC;IAmC1C,OAAO,CAAC,gCAAgC;IAYxC;;;;OAIG;IACH,OAAO,CAAC,eAAe;IAgBvB,OAAO,CAAC,2BAA2B;CASpC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,uCAAuC,EAAE,wCAAwC,CAAC;KACnF;CACF"}
|
|
@@ -12,7 +12,7 @@ import { classMap as _a } from "lit/directives/class-map.js";
|
|
|
12
12
|
import { getI18nSeatReservation as u } from "../common/translations.js";
|
|
13
13
|
import "@sbb-esta/lyne-elements/screen-reader-only.js";
|
|
14
14
|
import "../seat-reservation-navigation-services.js";
|
|
15
|
-
const xa = fa`*,:before,:after{box-sizing:border-box}:host{--sbb-seat-reservation-navigation-travelclass-spacing: 10;--sbb-seat-reservation-navigation-btn-border-width: 1;--sbb-seat-reservation-navigation-btn-border-color: var(--sbb-color-granite);--sbb-seat-reservation-navigation-btn-border-color: light-dark( var(--sbb-color-granite), var(--sbb-color-graphite) );--sbb-seat-reservation-navigation-btn-background-color: var(--sbb-color-white);--sbb-seat-reservation-navigation-btn-background-color: light-dark( var(--sbb-color-white), var(--sbb-color-black) );--sbb-seat-reservation-navigation-btn-border-width-selected: 2;--sbb-seat-reservation-navigation-btn-background-color-selected: var(--sbb-color-milk);--sbb-seat-reservation-navigation-btn-background-color-selected: light-dark( var(--sbb-color-milk), var(--sbb-color-iron) );--sbb-seat-reservation-navigation-btn-border-color-selected: var(--sbb-color-black);--sbb-seat-reservation-navigation-btn-border-color-selected: light-dark( var(--sbb-color-black), var(--sbb-color-white) );--sbb-seat-reservation-navigation-btn-outline-width-focused: 1;--sbb-seat-reservation-navigation-btn-outline-color-focused: var(--sbb-color-black);--sbb-seat-reservation-navigation-btn-outline-color-focused: light-dark( var(--sbb-color-black), var(--sbb-color-white) );--sbb-seat-reservation-navigation-btn-outline-offset-focused: 4;--sbb-seat-reservation-navigation-btn-background-color-focused: var(--sbb-color-white);--sbb-seat-reservation-navigation-btn-background-color-focused: light-dark( var(--sbb-color-white), var(--sbb-color-black) );--sbb-seat-reservation-navigation-btn-border-color-focused: var(--sbb-color-black);--sbb-seat-reservation-navigation-btn-border-color-focused: light-dark( var(--sbb-color-black), var(--sbb-color-white) );--sbb-seat-reservation-navigation-btn-background-color-hover: var(--sbb-color-cloud);--sbb-seat-reservation-navigation-btn-background-color-hover: light-dark( var(--sbb-color-cloud), var(--sbb-color-midnight) )}:host(.sbb-sr__navigation-coach--hover-scroll){--sbb-seat-reservation-navigation-btn-background-color: var(--sbb-color-cloud);--sbb-seat-reservation-navigation-btn-background-color: light-dark( var(--sbb-color-cloud), var(--sbb-color-midnight) )}.sbb-sr-navigation__item-coach{display:flex;flex-direction:column;gap:calc(8 * var(--sbb-seat-reservation-one-px-rem, .0625rem));width:calc(80 * var(--sbb-seat-reservation-one-px-rem, .0625rem));list-style-type:none}.sbb-sr-navigation__item-coach.first-coach .sbb-sr-navigation--first-class,.sbb-sr-navigation__item-coach.last-coach .sbb-sr-navigation--first-class{width:calc(100% - 18 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr-navigation__item-coach.first-coach .sbb-sr-navigation__ctrl-button:not(.sbb-seat-reservation-navigation-driver-area){border-start-start-radius:var(--sbb-border-radius-8x);border-end-start-radius:var(--sbb-border-radius-8x)}.sbb-sr-navigation__item-coach.first-coach .sbb-sr-navigation--first-class{margin-inline-start:calc(var(--sbb-seat-reservation-navigation-travelclass-spacing) * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr-navigation__item-coach.last-coach .sbb-sr-navigation__ctrl-button:not(.sbb-sr-navigation-driver-area){border-start-end-radius:var(--sbb-border-radius-8x);border-end-end-radius:var(--sbb-border-radius-8x)}.sbb-sr-navigation__item-coach.last-coach .sbb-sr-navigation__additional-information{padding-inline-end:calc(var(--sbb-seat-reservation-navigation-travelclass-spacing) * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr-navigation__item-coach.last-coach .sbb-sr-navigation--first-class{margin-inline-end:calc(var(--sbb-seat-reservation-navigation-travelclass-spacing) * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr-navigation__ctrl-button{-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;margin:0;outline:none;border:none;border-radius:0;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;display:flex;flex-direction:column;justify-content:center;height:calc(36 * var(--sbb-seat-reservation-one-px-rem, .0625rem));position:relative;border:calc(var(--sbb-seat-reservation-navigation-btn-border-width) * var(--sbb-seat-reservation-one-px-rem, .0625rem)) solid var(--sbb-seat-reservation-navigation-btn-border-color);border-radius:var(--sbb-border-radius-2x);background-color:var(--sbb-seat-reservation-navigation-btn-background-color);cursor:pointer}.sbb-sr-navigation__ctrl-button.sbb-sr-navigation-driver-area{border-radius:var(--sbb-border-radius-8x);cursor:initial}.sbb-sr-navigation__ctrl-button:focus-visible:not([disabled],:disabled){outline:calc(var(--sbb-seat-reservation-navigation-btn-outline-width-focused) * var(--sbb-seat-reservation-one-px-rem, .0625rem)) solid var(--sbb-seat-reservation-navigation-btn-outline-color-focused);outline-offset:calc(var(--sbb-seat-reservation-navigation-btn-outline-offset-focused) * var(--sbb-seat-reservation-one-px-rem, .0625rem));--sbb-seat-reservation-navigation-btn-background-color: var( --sbb-seat-reservation-navigation-btn-background-color-focused );--sbb-seat-reservation-navigation-btn-border-color: var( --sbb-seat-reservation-navigation-btn-border-color-focused )}.sbb-sr-navigation__ctrl-button:focus-visible:not([disabled],:disabled) .sbb-sr-navigation__item-coach-travelclass{background-color:var(--sbb-color-metal);background-color:light-dark(var(--sbb-color-metal),var(--sbb-color-storm))}.sbb-sr-navigation__ctrl-button:focus-visible:not([disabled],:disabled) .sbb-sr-navigation__item-coach-number{color:var(--sbb-color-anthracite);color:light-dark(var(--sbb-color-anthracite),var(--sbb-color-graphite))}.sbb-sr-navigation__item-coach--selected .sbb-sr-navigation__ctrl-button{--sbb-seat-reservation-navigation-btn-background-color: var( --sbb-seat-reservation-navigation-btn-background-color-selected );--sbb-seat-reservation-navigation-btn-border-width: var( --sbb-seat-reservation-navigation-btn-border-width-selected )}.sbb-sr-navigation__item-coach--selected .sbb-sr-navigation__ctrl-button .sbb-sr-navigation__item-coach-travelclass{background-color:var(--sbb-color-black);background-color:light-dark(var(--sbb-color-black),var(--sbb-color-white))}.sbb-sr-navigation__item-coach--selected .sbb-sr-navigation__ctrl-button .sbb-sr-navigation__item-coach-number{color:var(--sbb-color-black);color:light-dark(var(--sbb-color-black),var(--sbb-color-white))}.sbb-sr-navigation__item-coach--selected .sbb-sr-navigation__ctrl-button:focus-visible:not([disabled],:disabled){--sbb-seat-reservation-navigation-btn-background-color: var( --sbb-seat-reservation-navigation-btn-background-color-selected )}.sbb-sr-navigation__ctrl-button:hover:not([disabled],:disabled,.sbb-sr-navigation-driver-area){--sbb-seat-reservation-navigation-btn-background-color: var( --sbb-seat-reservation-navigation-btn-background-color-hover )}.sbb-sr-navigation__ctrl-button:hover:not([disabled],:disabled,.sbb-sr-navigation-driver-area) .sbb-sr-navigation__item-coach-travelclass{background-color:var(--sbb-color-5)}.sbb-sr-navigation__ctrl-button:hover:not([disabled],:disabled,.sbb-sr-navigation-driver-area) .sbb-sr-navigation__item-coach-number{color:var(--sbb-color-iron);color:light-dark(var(--sbb-color-iron),var(--sbb-color-silver))}.sbb-sr-navigation__ctrl-button:is([disabled],:disabled){--sbb-seat-reservation-navigation-btn-background-color: var(--sbb-background-color-2);--sbb-seat-reservation-navigation-btn-border-color: var(--sbb-color-platinum);--sbb-seat-reservation-navigation-btn-border-color: light-dark( var(--sbb-color-platinum), var(--sbb-color-iron) );cursor:unset;pointer-events:unset}.sbb-sr-navigation__ctrl-button:is([disabled],:disabled) .sbb-sr-navigation__item-coach-travelclass{background-color:var(--sbb-color-graphite);background-color:light-dark(var(--sbb-color-graphite),var(--sbb-color-granite))}.sbb-sr-navigation__ctrl-button:is([disabled],:disabled) .sbb-sr-navigation__item-coach-number{color:var(--sbb-color-graphite);color:light-dark(var(--sbb-color-graphite),var(--sbb-color-granite))}.sbb-sr-navigation__additional-information{display:flex;justify-content:space-between;align-items:center;flex:1;column-gap:calc(8 * var(--sbb-seat-reservation-one-px-rem, .0625rem));padding-inline:calc(16 * var(--sbb-seat-reservation-one-px-rem, .0625rem));font-family:var(--sbb-typo-font-family);font-weight:700;color:var(--sbb-color-granite);color:light-dark(var(--sbb-color-granite),var(--sbb-color-granite))}@media(forced-colors:active){.sbb-sr-navigation__additional-information{color:var(--sbb-color-milk)}}.sbb-sr-navigation__item-coach-number{color:var(--sbb-color-granite);color:light-dark(var(--sbb-color-granite),var(--sbb-color-graphite))}@media(forced-colors:active){.sbb-sr-navigation__item-coach-number{color:var(--sbb-color-granite);color:light-dark(var(--sbb-color-granite),var(--sbb-color-graphite))}}@media(forced-colors:active)and (forced-colors:active){.sbb-sr-navigation__item-coach-number{color:inherit}}.sbb-sr-navigation__item-coach-number .sbb-sr-navigation__item-coach-travelclass{background-color:var(--sbb-background-color-2-inverted)}.sbb-sr-navigation--first-class{width:calc(100% - 8 * var(--sbb-seat-reservation-one-px-rem, .0625rem));position:absolute;inset-block-start:calc(3 * var(--sbb-seat-reservation-one-px-rem, .0625rem));inset-inline-start:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem));border:calc(1 * var(--sbb-seat-reservation-one-px-rem, .0625rem)) solid transparent;border-radius:var(--sbb-border-radius-1x);margin:auto;background-color:var(--sbb-color-lemon)}.sbb-sr-navigation__item-coach-travelclass{display:flex;align-items:center;justify-content:center;min-height:calc(20 * var(--sbb-seat-reservation-one-px-rem, .0625rem));min-width:calc(20 * var(--sbb-seat-reservation-one-px-rem, .0625rem));border-radius:var(--sbb-border-radius-1x);text-align:center;background-color:var(--sbb-color-granite);background-color:light-dark(var(--sbb-color-granite),var(--sbb-color-graphite));color:var(--sbb-color-white);color:light-dark(var(--sbb-color-white),var(--sbb-color-black))}:host([vertical]) .sbb-sr-navigation__item-coach{flex-direction:row}:host([vertical]) .sbb-sr-navigation__item-coach .sbb-sr-navigation__ctrl-button{flex-direction:row-reverse;height:calc(80 * var(--sbb-seat-reservation-one-px-rem, .0625rem));min-width:calc(36 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}:host([vertical]) .sbb-sr-navigation__item-coach .sbb-sr-navigation__additional-information{flex-direction:column-reverse;padding-block:calc(16 * var(--sbb-seat-reservation-one-px-rem, .0625rem));padding-inline-start:unset;padding-inline-end:unset}:host([vertical]) .sbb-sr-navigation__item-coach .sbb-sr-navigation--first-class{height:calc(100% - 8 * var(--sbb-seat-reservation-one-px-rem, .0625rem));width:initial;inset-inline-end:calc(3 * var(--sbb-seat-reservation-one-px-rem, .0625rem));inset-block-start:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem));inset-inline-start:initial}:host([vertical]) .sbb-sr-navigation__item-coach.first-coach .sbb-sr-navigation--first-class,:host([vertical]) .sbb-sr-navigation__item-coach.last-coach .sbb-sr-navigation--first-class{height:calc(100% - 18 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}:host([vertical]) .sbb-sr-navigation__item-coach.first-coach:not(.last-coach) .sbb-sr-navigation__ctrl-button:not(.sbb-sr-navigation-driver-area){border-start-end-radius:var(--sbb-border-radius-8x);border-end-start-radius:var(--sbb-border-radius-2x)}:host([vertical]) .sbb-sr-navigation__item-coach.first-coach:not(.last-coach) .sbb-sr-navigation--first-class{margin-block-start:calc(var(--sbb-seat-reservation-navigation-travelclass-spacing) * var(--sbb-seat-reservation-one-px-rem, .0625rem));margin-inline-start:initial}:host([vertical]) .sbb-sr-navigation__item-coach.last-coach:not(.first-coach) .sbb-sr-navigation__ctrl-button:not(.sbb-sr-navigation-driver-area){border-start-end-radius:var(--sbb-border-radius-2x);border-end-start-radius:var(--sbb-border-radius-8x)}:host([vertical]) .sbb-sr-navigation__item-coach.last-coach:not(.first-coach) .sbb-sr-navigation--first-class{margin-block-end:calc(var(--sbb-seat-reservation-navigation-travelclass-spacing) * var(--sbb-seat-reservation-one-px-rem, .0625rem));margin-inline-end:initial}:host([vertical]) .sbb-sr-navigation__item-coach .sbb-sr-navigation-driver-area{height:calc(80 * var(--sbb-seat-reservation-one-px-rem, .0625rem));min-width:calc(36 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}`;
|
|
15
|
+
const xa = fa`*,:before,:after{box-sizing:border-box}:host{--sbb-seat-reservation-navigation-travelclass-spacing: 10;--sbb-seat-reservation-navigation-btn-border-width: 1;--sbb-seat-reservation-navigation-btn-border-color: var(--sbb-color-granite);--sbb-seat-reservation-navigation-btn-border-color: light-dark( var(--sbb-color-granite), var(--sbb-color-graphite) );--sbb-seat-reservation-navigation-btn-background-color: var(--sbb-color-white);--sbb-seat-reservation-navigation-btn-background-color: light-dark( var(--sbb-color-white), var(--sbb-color-black) );--sbb-seat-reservation-navigation-btn-border-width-selected: 2;--sbb-seat-reservation-navigation-btn-background-color-selected: var(--sbb-color-milk);--sbb-seat-reservation-navigation-btn-background-color-selected: light-dark( var(--sbb-color-milk), var(--sbb-color-iron) );--sbb-seat-reservation-navigation-btn-border-color-selected: var(--sbb-color-black);--sbb-seat-reservation-navigation-btn-border-color-selected: light-dark( var(--sbb-color-black), var(--sbb-color-white) );--sbb-seat-reservation-navigation-btn-outline-width-focused: 1;--sbb-seat-reservation-navigation-btn-outline-color-focused: var(--sbb-color-black);--sbb-seat-reservation-navigation-btn-outline-color-focused: light-dark( var(--sbb-color-black), var(--sbb-color-white) );--sbb-seat-reservation-navigation-btn-outline-offset-focused: 4;--sbb-seat-reservation-navigation-btn-background-color-focused: var(--sbb-color-white);--sbb-seat-reservation-navigation-btn-background-color-focused: light-dark( var(--sbb-color-white), var(--sbb-color-black) );--sbb-seat-reservation-navigation-btn-border-color-focused: var(--sbb-color-black);--sbb-seat-reservation-navigation-btn-border-color-focused: light-dark( var(--sbb-color-black), var(--sbb-color-white) );--sbb-seat-reservation-navigation-btn-background-color-hover: var(--sbb-color-cloud);--sbb-seat-reservation-navigation-btn-background-color-hover: light-dark( var(--sbb-color-cloud), var(--sbb-color-midnight) )}:host(.sbb-sr__navigation-coach--hover-scroll){--sbb-seat-reservation-navigation-btn-background-color: var(--sbb-color-cloud);--sbb-seat-reservation-navigation-btn-background-color: light-dark( var(--sbb-color-cloud), var(--sbb-color-midnight) )}.sbb-sr-navigation__item-coach{display:flex;flex-direction:column;gap:calc(8 * var(--sbb-seat-reservation-one-px-rem, .0625rem));width:calc(80 * var(--sbb-seat-reservation-one-px-rem, .0625rem));list-style-type:none}.sbb-sr-navigation__item-coach.first-coach .sbb-sr-navigation--first-class,.sbb-sr-navigation__item-coach.last-coach .sbb-sr-navigation--first-class{width:calc(100% - 18 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr-navigation__item-coach.first-coach .sbb-sr-navigation__ctrl-button:not(.sbb-seat-reservation-navigation-driver-area){border-start-start-radius:var(--sbb-border-radius-8x);border-end-start-radius:var(--sbb-border-radius-8x)}.sbb-sr-navigation__item-coach.first-coach .sbb-sr-navigation--first-class{margin-inline-start:calc(var(--sbb-seat-reservation-navigation-travelclass-spacing) * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr-navigation__item-coach.last-coach .sbb-sr-navigation__ctrl-button:not(.sbb-sr-navigation-driver-area){border-start-end-radius:var(--sbb-border-radius-8x);border-end-end-radius:var(--sbb-border-radius-8x)}.sbb-sr-navigation__item-coach.last-coach .sbb-sr-navigation__additional-information{padding-inline-end:calc(var(--sbb-seat-reservation-navigation-travelclass-spacing) * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr-navigation__item-coach.last-coach .sbb-sr-navigation--first-class{margin-inline-end:calc(var(--sbb-seat-reservation-navigation-travelclass-spacing) * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr-navigation__ctrl-button{-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;margin:0;outline:none;border:none;border-radius:0;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;display:flex;flex-direction:column;justify-content:center;height:calc(36 * var(--sbb-seat-reservation-one-px-rem, .0625rem));position:relative;border:calc(var(--sbb-seat-reservation-navigation-btn-border-width) * var(--sbb-seat-reservation-one-px-rem, .0625rem)) solid var(--sbb-seat-reservation-navigation-btn-border-color);border-radius:var(--sbb-border-radius-2x);background-color:var(--sbb-seat-reservation-navigation-btn-background-color);cursor:var(--sbb-cursor-pointer)}.sbb-sr-navigation__ctrl-button.sbb-sr-navigation-driver-area{border-radius:var(--sbb-border-radius-8x);cursor:initial}.sbb-sr-navigation__ctrl-button:focus-visible:not([disabled],:disabled){outline:calc(var(--sbb-seat-reservation-navigation-btn-outline-width-focused) * var(--sbb-seat-reservation-one-px-rem, .0625rem)) solid var(--sbb-seat-reservation-navigation-btn-outline-color-focused);outline-offset:calc(var(--sbb-seat-reservation-navigation-btn-outline-offset-focused) * var(--sbb-seat-reservation-one-px-rem, .0625rem));--sbb-seat-reservation-navigation-btn-background-color: var( --sbb-seat-reservation-navigation-btn-background-color-focused );--sbb-seat-reservation-navigation-btn-border-color: var( --sbb-seat-reservation-navigation-btn-border-color-focused )}.sbb-sr-navigation__ctrl-button:focus-visible:not([disabled],:disabled) .sbb-sr-navigation__item-coach-travelclass{background-color:var(--sbb-color-metal);background-color:light-dark(var(--sbb-color-metal),var(--sbb-color-storm))}.sbb-sr-navigation__ctrl-button:focus-visible:not([disabled],:disabled) .sbb-sr-navigation__item-coach-number{color:var(--sbb-color-anthracite);color:light-dark(var(--sbb-color-anthracite),var(--sbb-color-graphite))}.sbb-sr-navigation__item-coach--selected .sbb-sr-navigation__ctrl-button{--sbb-seat-reservation-navigation-btn-background-color: var( --sbb-seat-reservation-navigation-btn-background-color-selected );--sbb-seat-reservation-navigation-btn-border-width: var( --sbb-seat-reservation-navigation-btn-border-width-selected )}.sbb-sr-navigation__item-coach--selected .sbb-sr-navigation__ctrl-button .sbb-sr-navigation__item-coach-travelclass{background-color:var(--sbb-color-black);background-color:light-dark(var(--sbb-color-black),var(--sbb-color-white))}.sbb-sr-navigation__item-coach--selected .sbb-sr-navigation__ctrl-button .sbb-sr-navigation__item-coach-number{color:var(--sbb-color-black);color:light-dark(var(--sbb-color-black),var(--sbb-color-white))}.sbb-sr-navigation__item-coach--selected .sbb-sr-navigation__ctrl-button:focus-visible:not([disabled],:disabled){--sbb-seat-reservation-navigation-btn-background-color: var( --sbb-seat-reservation-navigation-btn-background-color-selected )}.sbb-sr-navigation__ctrl-button:hover:not([disabled],:disabled,.sbb-sr-navigation-driver-area){--sbb-seat-reservation-navigation-btn-background-color: var( --sbb-seat-reservation-navigation-btn-background-color-hover )}.sbb-sr-navigation__ctrl-button:hover:not([disabled],:disabled,.sbb-sr-navigation-driver-area) .sbb-sr-navigation__item-coach-travelclass{background-color:var(--sbb-color-5)}.sbb-sr-navigation__ctrl-button:hover:not([disabled],:disabled,.sbb-sr-navigation-driver-area) .sbb-sr-navigation__item-coach-number{color:var(--sbb-color-iron);color:light-dark(var(--sbb-color-iron),var(--sbb-color-silver))}.sbb-sr-navigation__ctrl-button:is([disabled],:disabled){--sbb-seat-reservation-navigation-btn-background-color: var(--sbb-background-color-2);--sbb-seat-reservation-navigation-btn-border-color: var(--sbb-color-platinum);--sbb-seat-reservation-navigation-btn-border-color: light-dark( var(--sbb-color-platinum), var(--sbb-color-iron) );cursor:unset;pointer-events:unset}.sbb-sr-navigation__ctrl-button:is([disabled],:disabled) .sbb-sr-navigation__item-coach-travelclass{background-color:var(--sbb-color-graphite);background-color:light-dark(var(--sbb-color-graphite),var(--sbb-color-granite))}.sbb-sr-navigation__ctrl-button:is([disabled],:disabled) .sbb-sr-navigation__item-coach-number{color:var(--sbb-color-graphite);color:light-dark(var(--sbb-color-graphite),var(--sbb-color-granite))}.sbb-sr-navigation__additional-information{display:flex;justify-content:space-between;align-items:center;flex:1;column-gap:calc(8 * var(--sbb-seat-reservation-one-px-rem, .0625rem));padding-inline:calc(16 * var(--sbb-seat-reservation-one-px-rem, .0625rem));font-family:var(--sbb-typo-font-family);font-weight:700;color:var(--sbb-color-granite);color:light-dark(var(--sbb-color-granite),var(--sbb-color-granite))}@media(forced-colors:active){.sbb-sr-navigation__additional-information{color:var(--sbb-color-milk)}}.sbb-sr-navigation__item-coach-number{color:var(--sbb-color-granite);color:light-dark(var(--sbb-color-granite),var(--sbb-color-graphite))}@media(forced-colors:active){.sbb-sr-navigation__item-coach-number{color:var(--sbb-color-granite);color:light-dark(var(--sbb-color-granite),var(--sbb-color-graphite))}}@media(forced-colors:active)and (forced-colors:active){.sbb-sr-navigation__item-coach-number{color:inherit}}.sbb-sr-navigation__item-coach-number .sbb-sr-navigation__item-coach-travelclass{background-color:var(--sbb-background-color-2-inverted)}.sbb-sr-navigation--first-class{width:calc(100% - 8 * var(--sbb-seat-reservation-one-px-rem, .0625rem));position:absolute;inset-block-start:calc(3 * var(--sbb-seat-reservation-one-px-rem, .0625rem));inset-inline-start:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem));border:calc(1 * var(--sbb-seat-reservation-one-px-rem, .0625rem)) solid transparent;border-radius:var(--sbb-border-radius-1x);margin:auto;background-color:var(--sbb-color-lemon)}.sbb-sr-navigation__item-coach-travelclass{display:flex;align-items:center;justify-content:center;min-height:calc(20 * var(--sbb-seat-reservation-one-px-rem, .0625rem));min-width:calc(20 * var(--sbb-seat-reservation-one-px-rem, .0625rem));border-radius:var(--sbb-border-radius-1x);text-align:center;background-color:var(--sbb-color-granite);background-color:light-dark(var(--sbb-color-granite),var(--sbb-color-graphite));color:var(--sbb-color-white);color:light-dark(var(--sbb-color-white),var(--sbb-color-black))}:host([vertical]) .sbb-sr-navigation__item-coach{flex-direction:row}:host([vertical]) .sbb-sr-navigation__item-coach .sbb-sr-navigation__ctrl-button{flex-direction:row-reverse;height:calc(80 * var(--sbb-seat-reservation-one-px-rem, .0625rem));min-width:calc(36 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}:host([vertical]) .sbb-sr-navigation__item-coach .sbb-sr-navigation__additional-information{flex-direction:column-reverse;padding-block:calc(16 * var(--sbb-seat-reservation-one-px-rem, .0625rem));padding-inline-start:unset;padding-inline-end:unset}:host([vertical]) .sbb-sr-navigation__item-coach .sbb-sr-navigation--first-class{height:calc(100% - 8 * var(--sbb-seat-reservation-one-px-rem, .0625rem));width:initial;inset-inline-end:calc(3 * var(--sbb-seat-reservation-one-px-rem, .0625rem));inset-block-start:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem));inset-inline-start:initial}:host([vertical]) .sbb-sr-navigation__item-coach.first-coach .sbb-sr-navigation--first-class,:host([vertical]) .sbb-sr-navigation__item-coach.last-coach .sbb-sr-navigation--first-class{height:calc(100% - 18 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}:host([vertical]) .sbb-sr-navigation__item-coach.first-coach:not(.last-coach) .sbb-sr-navigation__ctrl-button:not(.sbb-sr-navigation-driver-area){border-start-end-radius:var(--sbb-border-radius-8x);border-end-start-radius:var(--sbb-border-radius-2x)}:host([vertical]) .sbb-sr-navigation__item-coach.first-coach:not(.last-coach) .sbb-sr-navigation--first-class{margin-block-start:calc(var(--sbb-seat-reservation-navigation-travelclass-spacing) * var(--sbb-seat-reservation-one-px-rem, .0625rem));margin-inline-start:initial}:host([vertical]) .sbb-sr-navigation__item-coach.last-coach:not(.first-coach) .sbb-sr-navigation__ctrl-button:not(.sbb-sr-navigation-driver-area){border-start-end-radius:var(--sbb-border-radius-2x);border-end-start-radius:var(--sbb-border-radius-8x)}:host([vertical]) .sbb-sr-navigation__item-coach.last-coach:not(.first-coach) .sbb-sr-navigation--first-class{margin-block-end:calc(var(--sbb-seat-reservation-navigation-travelclass-spacing) * var(--sbb-seat-reservation-one-px-rem, .0625rem));margin-inline-end:initial}:host([vertical]) .sbb-sr-navigation__item-coach .sbb-sr-navigation-driver-area{height:calc(80 * var(--sbb-seat-reservation-one-px-rem, .0625rem));min-width:calc(36 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}`;
|
|
16
16
|
let Oa = (() => {
|
|
17
17
|
var m, p, f, k, y, x, I, C, A, w, S, B, i;
|
|
18
18
|
let o = [ya("sbb-seat-reservation-navigation-coach")], n, c = [], h, E = ka, T, $ = [], N = [], D, O = [], L = [], P, R = [], V = [], j, H = [], U = [], F, G = [], K = [], q, M = [], Y = [], J, Q = [], W = [], X, Z = [], aa = [], ea, ta = [], ra = [], sa, ia = [], oa = [], na, ca = [], ba = [], la, va = [], da = [];
|
|
@@ -47,14 +47,14 @@ let Oa = (() => {
|
|
|
47
47
|
set propertyIds(e) {
|
|
48
48
|
r(this, p, e);
|
|
49
49
|
}
|
|
50
|
-
|
|
50
|
+
/** Pre-selected coach index property */
|
|
51
51
|
get selected() {
|
|
52
52
|
return b(this, f);
|
|
53
53
|
}
|
|
54
54
|
set selected(e) {
|
|
55
55
|
r(this, f, e);
|
|
56
56
|
}
|
|
57
|
-
|
|
57
|
+
/** Focused coach index property */
|
|
58
58
|
get focused() {
|
|
59
59
|
return b(this, k);
|
|
60
60
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"seat-reservation-place-control.component.d.ts","sourceRoot":"","sources":["../../../../src/elements-experimental/seat-reservation/seat-reservation-place-control/seat-reservation-place-control.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,+CAA+C,CAAC;AAGrF,OAAO,EAAE,KAAK,cAAc,EAAiB,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAKnG,OAAO,KAAK,EAAkB,UAAU,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE1E,OAAO,gCAAgC,CAAC;AAIxC;;GAEG;AACH,qBAEM,qCAAsC,SAAQ,oBAAoB;IACtE,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;MAElB;IAEX,qDAAqD;IACrD,SAEgB,SAAS,EAAE,SAAS,CAAU;IAE9C,6DAA6D;IAC7D,SAEgB,KAAK,EAAE,UAAU,CAAU;IAE3C,sEAAsE;IACtE,SACgB,WAAW,EAAE,MAAM,EAAE,CAAM;IAE3C,0CAA0C;IAC1C,SAEgB,IAAI,EAAE,MAAM,CAAM;IAElC,4DAA4D;IAC5D,SAEgB,SAAS,EAAE,MAAM,CAAS;IAE1C,8DAA8D;IAC9D,SAEgB,UAAU,EAAE,MAAM,CAAS;IAE3C,kDAAkD;IAClD,SAEgB,YAAY,EAAE,OAAO,CAAS;IAE9C,wCAAwC;IACxC,SAEgB,QAAQ,EAAE,MAAM,CAAa;IAE7C,OAAO,CAAC,SAAS,CAAmC;;
|
|
1
|
+
{"version":3,"file":"seat-reservation-place-control.component.d.ts","sourceRoot":"","sources":["../../../../src/elements-experimental/seat-reservation/seat-reservation-place-control/seat-reservation-place-control.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,+CAA+C,CAAC;AAGrF,OAAO,EAAE,KAAK,cAAc,EAAiB,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAKnG,OAAO,KAAK,EAAkB,UAAU,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE1E,OAAO,gCAAgC,CAAC;AAIxC;;GAEG;AACH,qBAEM,qCAAsC,SAAQ,oBAAoB;IACtE,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;MAElB;IAEX,qDAAqD;IACrD,SAEgB,SAAS,EAAE,SAAS,CAAU;IAE9C,6DAA6D;IAC7D,SAEgB,KAAK,EAAE,UAAU,CAAU;IAE3C,sEAAsE;IACtE,SACgB,WAAW,EAAE,MAAM,EAAE,CAAM;IAE3C,0CAA0C;IAC1C,SAEgB,IAAI,EAAE,MAAM,CAAM;IAElC,4DAA4D;IAC5D,SAEgB,SAAS,EAAE,MAAM,CAAS;IAE1C,8DAA8D;IAC9D,SAEgB,UAAU,EAAE,MAAM,CAAS;IAE3C,kDAAkD;IAClD,SAEgB,YAAY,EAAE,OAAO,CAAS;IAE9C,wCAAwC;IACxC,SAEgB,QAAQ,EAAE,MAAM,CAAa;IAE7C,OAAO,CAAC,SAAS,CAAmC;;cAOjC,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAUzD,MAAM,IAAI,cAAc;IAuC3C,OAAO,CAAC,YAAY;IAMpB,OAAO,CAAC,yBAAyB;IAkBjC,yGAAyG;IACzG,OAAO,CAAC,YAAY;CA4BrB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,oCAAoC,EAAE,qCAAqC,CAAC;KAC7E;CACF"}
|