@sbb-esta/lyne-elements-experimental 4.0.0-next → 4.0.0-next.1
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-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 +3 -3
- 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 +1 -2
- 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-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 +2 -2
- 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 +13 -13
|
@@ -1,19 +1,19 @@
|
|
|
1
|
-
var
|
|
1
|
+
var fe = (n) => {
|
|
2
2
|
throw TypeError(n);
|
|
3
3
|
};
|
|
4
|
-
var
|
|
5
|
-
var g = (n, d, u) => (
|
|
4
|
+
var Se = (n, d, u) => d.has(n) || fe("Cannot " + u);
|
|
5
|
+
var g = (n, d, u) => (Se(n, d, "read from private field"), u ? u.call(n) : d.get(n)), v = (n, d, u) => d.has(n) ? fe("Cannot add the same private member more than once") : d instanceof WeakSet ? d.add(n) : d.set(n, u), r = (n, d, u, D) => (Se(n, d, "write to private field"), D ? D.call(n, u) : d.set(n, u), u);
|
|
6
6
|
import { __runInitializers as l, __esDecorate as f } from "tslib";
|
|
7
|
-
import { isArrowKeyOrPageKeysPressed as
|
|
7
|
+
import { isArrowKeyOrPageKeysPressed as Ie } from "@sbb-esta/lyne-elements/core/a11y.js";
|
|
8
8
|
import { forceType as C } from "@sbb-esta/lyne-elements/core/decorators.js";
|
|
9
|
-
import { LitElement as
|
|
10
|
-
import { property as S, state as T, eventOptions as
|
|
11
|
-
import { mapIconToSvg as
|
|
12
|
-
var
|
|
9
|
+
import { LitElement as xe, isServer as pe } from "lit";
|
|
10
|
+
import { property as S, state as T, eventOptions as me } from "lit/decorators.js";
|
|
11
|
+
import { mapIconToSvg as Ce, mapPlaceInfosToPlaceSelection as _e, mapPlaceAndCoachToSeatReservationPlaceSelection as ye, mapCoachInfosToCoachSelection as be } from "../common/mapper.js";
|
|
12
|
+
var I;
|
|
13
13
|
(function(n) {
|
|
14
14
|
n.right = "right", n.left = "left";
|
|
15
|
-
})(
|
|
16
|
-
const
|
|
15
|
+
})(I || (I = {}));
|
|
16
|
+
const Pe = 3, Ae = [
|
|
17
17
|
"sa-vo",
|
|
18
18
|
"sa-rs",
|
|
19
19
|
"sa-abteilkinderwagen",
|
|
@@ -22,25 +22,25 @@ const ye = 3, Pe = [
|
|
|
22
22
|
"sa-bz",
|
|
23
23
|
"sa-rz"
|
|
24
24
|
];
|
|
25
|
-
let
|
|
26
|
-
var x,
|
|
27
|
-
let n =
|
|
25
|
+
let ze = (() => {
|
|
26
|
+
var x, p, m, _, y, b, P, A, k, R, E, N, h;
|
|
27
|
+
let n = xe, d = [], u, D = [], B = [], z, F = [], V = [], O, G = [], L = [], W, X = [], H = [], K, U = [], q = [], M, $ = [], j = [], Y, J = [], Q = [], Z, ee = [], te = [], se, ie = [], ae = [], ce, oe = [], re = [], le, ne = [], he = [], de, ue = [], ge = [], ve;
|
|
28
28
|
return h = class extends n {
|
|
29
29
|
constructor() {
|
|
30
30
|
super(...arguments);
|
|
31
31
|
v(this, x);
|
|
32
|
-
v(this,
|
|
32
|
+
v(this, p);
|
|
33
33
|
v(this, m);
|
|
34
34
|
v(this, _);
|
|
35
|
-
v(this, b);
|
|
36
35
|
v(this, y);
|
|
36
|
+
v(this, b);
|
|
37
37
|
v(this, P);
|
|
38
38
|
v(this, A);
|
|
39
|
+
v(this, k);
|
|
39
40
|
v(this, R);
|
|
40
41
|
v(this, E);
|
|
41
42
|
v(this, N);
|
|
42
|
-
|
|
43
|
-
r(this, x, (l(this, d), l(this, D, null))), r(this, I, (l(this, w), l(this, z, !0))), r(this, m, (l(this, F), l(this, O, !1))), r(this, _, (l(this, G), l(this, W, 16))), r(this, b, (l(this, X), l(this, K, null))), r(this, y, (l(this, U), l(this, M, -1))), r(this, P, (l(this, $), l(this, Y, -1))), r(this, A, (l(this, J), l(this, Z, !1))), r(this, R, (l(this, ee), l(this, se, -1))), r(this, E, (l(this, ie), l(this, ce, -1))), r(this, N, (l(this, oe), l(this, le, -1))), r(this, k, (l(this, ne), l(this, de, -1))), this.coachBorderPadding = (l(this, ue), 6), this.gapBetweenCoaches = 4, this.coachBorderOffset = this.coachBorderPadding / this.baseGridSize, this.gapBetweenCoachDecks = 48, this.coachNavButtonDim = 0, this.coachNavData = [], this.currScrollDirection = p.right, this.maxCalcCoachsWidth = 0, this.scrollCoachsAreaWidth = 0, this.scrollNavigationAreaDim = 0, this.triggerCoachPositionsCollection = [], this.firstTabElement = null, this.lastTabElement = null, this.navigationScrollArea = null, this.coachScrollArea = null, this.currSelectedPlace = null, this.currSelectedPlaceElementId = null, this.currSelectedCoachIndex = -1, this.currSelectedDeckIndex = 0, this.preventCoachScrollByPlaceClick = !1, this.selectedSeatReservationPlaces = {
|
|
43
|
+
r(this, x, (l(this, d), l(this, D, null))), r(this, p, (l(this, B), l(this, F, !0))), r(this, m, (l(this, V), l(this, G, !1))), r(this, _, (l(this, L), l(this, X, 16))), r(this, y, (l(this, H), l(this, U, null))), r(this, b, (l(this, q), l(this, $, -1))), r(this, P, (l(this, j), l(this, J, -1))), r(this, A, (l(this, Q), l(this, ee, !1))), r(this, k, (l(this, te), l(this, ie, -1))), r(this, R, (l(this, ae), l(this, oe, -1))), r(this, E, (l(this, re), l(this, ne, -1))), r(this, N, (l(this, he), l(this, ue, -1))), this.coachBorderPadding = (l(this, ge), 6), this.gapBetweenCoaches = 4, this.coachBorderOffset = this.coachBorderPadding / this.baseGridSize, this.gapBetweenCoachDecks = 48, this.coachNavButtonDim = 0, this.coachNavData = [], this.currScrollDirection = I.right, this.maxCalcCoachsWidth = 0, this.scrollCoachsAreaWidth = 0, this.scrollNavigationAreaDim = 0, this.triggerCoachPositionsCollection = [], this.firstTabElement = null, this.lastTabElement = null, this.navigationScrollArea = null, this.coachScrollArea = null, this.currSelectedPlace = null, this.currSelectedPlaceElementId = null, this.currSelectedCoachIndex = -1, this.currSelectedDeckIndex = 0, this.preventCoachScrollByPlaceClick = !1, this.selectedSeatReservationPlaces = {
|
|
44
44
|
seats: [],
|
|
45
45
|
bicycles: []
|
|
46
46
|
}, this.seatReservationWithoutNavigationHasFocus = !1, this.isCoachGridFocusable = !1, this.isAutoScrolling = !1, this.isKeyboardNavigation = !1, this.hasMultipleDecks = !1, this.keyboardNavigationEvents = {
|
|
@@ -56,9 +56,9 @@ let Be = (() => {
|
|
|
56
56
|
const t = e?.map(function(s) {
|
|
57
57
|
return {
|
|
58
58
|
pId: s,
|
|
59
|
-
svgName:
|
|
59
|
+
svgName: Ce[s]?.svgName ? Ce[s]?.svgName : ""
|
|
60
60
|
};
|
|
61
|
-
}).filter((s) =>
|
|
61
|
+
}).filter((s) => Ae.indexOf(s.svgName) !== -1).filter((s, i, a) => a.map((o) => o.svgName).indexOf(s.svgName) === i).map((s) => s.pId).slice(0, Pe);
|
|
62
62
|
return t || [];
|
|
63
63
|
};
|
|
64
64
|
}
|
|
@@ -71,10 +71,10 @@ let Be = (() => {
|
|
|
71
71
|
}
|
|
72
72
|
/** The seat reservation navigation can be toggled by this property */
|
|
73
73
|
get hasNavigation() {
|
|
74
|
-
return g(this,
|
|
74
|
+
return g(this, p);
|
|
75
75
|
}
|
|
76
76
|
set hasNavigation(e) {
|
|
77
|
-
r(this,
|
|
77
|
+
r(this, p, e);
|
|
78
78
|
}
|
|
79
79
|
/** The seat reservation area is aligned vertically */
|
|
80
80
|
get alignVertical() {
|
|
@@ -92,17 +92,17 @@ let Be = (() => {
|
|
|
92
92
|
}
|
|
93
93
|
/** The seat reservation area's width */
|
|
94
94
|
get height() {
|
|
95
|
-
return g(this,
|
|
95
|
+
return g(this, y);
|
|
96
96
|
}
|
|
97
97
|
set height(e) {
|
|
98
|
-
r(this,
|
|
98
|
+
r(this, y, e);
|
|
99
99
|
}
|
|
100
100
|
/** Maximal number of possible clickable seats */
|
|
101
101
|
get maxSeatReservations() {
|
|
102
|
-
return g(this,
|
|
102
|
+
return g(this, b);
|
|
103
103
|
}
|
|
104
104
|
set maxSeatReservations(e) {
|
|
105
|
-
r(this,
|
|
105
|
+
r(this, b, e);
|
|
106
106
|
}
|
|
107
107
|
/** Maximal number of possible clickable bicycle places */
|
|
108
108
|
get maxBicycleReservations() {
|
|
@@ -119,29 +119,29 @@ let Be = (() => {
|
|
|
119
119
|
r(this, A, e);
|
|
120
120
|
}
|
|
121
121
|
get preselectCoachIndex() {
|
|
122
|
-
return g(this,
|
|
122
|
+
return g(this, k);
|
|
123
123
|
}
|
|
124
124
|
set preselectCoachIndex(e) {
|
|
125
|
-
r(this,
|
|
125
|
+
r(this, k, e);
|
|
126
126
|
}
|
|
127
127
|
get selectedCoachIndex() {
|
|
128
|
-
return g(this,
|
|
128
|
+
return g(this, R);
|
|
129
129
|
}
|
|
130
130
|
set selectedCoachIndex(e) {
|
|
131
|
-
r(this,
|
|
131
|
+
r(this, R, e);
|
|
132
132
|
}
|
|
133
133
|
get focusedCoachIndex() {
|
|
134
|
-
return g(this,
|
|
134
|
+
return g(this, E);
|
|
135
135
|
}
|
|
136
136
|
set focusedCoachIndex(e) {
|
|
137
|
-
r(this,
|
|
137
|
+
r(this, E, e);
|
|
138
138
|
}
|
|
139
139
|
//Sets the hover style when scrolling to a coach
|
|
140
140
|
get hoveredScrollCoachIndex() {
|
|
141
|
-
return g(this,
|
|
141
|
+
return g(this, N);
|
|
142
142
|
}
|
|
143
143
|
set hoveredScrollCoachIndex(e) {
|
|
144
|
-
r(this,
|
|
144
|
+
r(this, N, e);
|
|
145
145
|
}
|
|
146
146
|
willUpdate(e) {
|
|
147
147
|
if (super.willUpdate(e), e.has("seatReservations") && (this.hasMultipleDecks = this.seatReservations?.length > 1, this._initPrepareSeatReservationData(), this._initSeatReservationPlaceSelection(), this.initNavigationSelectionByScrollEvent()), e.has("baseGridSize") && (this.coachBorderOffset = this.coachBorderPadding / this.baseGridSize, this.style?.setProperty("--sbb-seat-reservation-grid-size", `${this.baseGridSize}px`), this.initNavigationSelectionByScrollEvent()), e.has("height") && this.height) {
|
|
@@ -162,7 +162,7 @@ let Be = (() => {
|
|
|
162
162
|
_initPrepareSeatReservationData() {
|
|
163
163
|
this._determineBaseFontSize(), this.hasMultipleDecks && this._initEmptyCoachDeckOffsets(), this._prepareNavigationCoachData();
|
|
164
164
|
}
|
|
165
|
-
|
|
165
|
+
/** Init scroll event handling for coach navigation */
|
|
166
166
|
initNavigationSelectionByScrollEvent() {
|
|
167
167
|
this.firstTabElement = this.shadowRoot?.querySelector("#first-tab-element"), this.lastTabElement = this.shadowRoot?.querySelector("#last-tab-element"), this.coachScrollArea = this.shadowRoot?.querySelector("#sbb-sr__wrapper-scrollarea"), this.navigationScrollArea = this.shadowRoot?.querySelector("#sbb-sr-navigation");
|
|
168
168
|
const e = this.seatReservations ? this.seatReservations[this.currSelectedDeckIndex] : null;
|
|
@@ -197,7 +197,7 @@ let Be = (() => {
|
|
|
197
197
|
* and we therefore imitate this event -> scrollend.
|
|
198
198
|
*/
|
|
199
199
|
coachAreaScrollend() {
|
|
200
|
-
this._scrollTimeout && clearTimeout(this._scrollTimeout), this._scrollTimeout = setTimeout(() => this.
|
|
200
|
+
this._scrollTimeout && clearTimeout(this._scrollTimeout), this._scrollTimeout = setTimeout(() => this._handleCoachAreaScrollendEvent(), 150);
|
|
201
201
|
}
|
|
202
202
|
/**
|
|
203
203
|
* If no navigation exists (property setting -> hasNavigation) and a table coach gets the focus,
|
|
@@ -214,7 +214,7 @@ let Be = (() => {
|
|
|
214
214
|
*/
|
|
215
215
|
handleKeyboardEvent(e) {
|
|
216
216
|
const t = e.key;
|
|
217
|
-
if (this.currSelectedPlace) {
|
|
217
|
+
if (this.preventCoachScrollByPlaceClick = !1, this.currSelectedPlace) {
|
|
218
218
|
if (e.shiftKey && e.keyCode === 9) {
|
|
219
219
|
this._navigateCoachNavigationByKeyboard("PREV_TAB"), e.preventDefault();
|
|
220
220
|
return;
|
|
@@ -224,7 +224,7 @@ let Be = (() => {
|
|
|
224
224
|
return;
|
|
225
225
|
}
|
|
226
226
|
}
|
|
227
|
-
if (this.currSelectedCoachIndex !== -1 &&
|
|
227
|
+
if (this.currSelectedCoachIndex !== -1 && Ie(e))
|
|
228
228
|
switch (e.preventDefault(), t) {
|
|
229
229
|
case this.keyboardNavigationEvents.ArrowLeft:
|
|
230
230
|
{
|
|
@@ -262,7 +262,7 @@ let Be = (() => {
|
|
|
262
262
|
}
|
|
263
263
|
scrollToSelectedNavCoach(e) {
|
|
264
264
|
if (this._isValidCaochIndex(e) && e !== this.currSelectedCoachIndex) {
|
|
265
|
-
this.isAutoScrolling = !0, this.isCoachGridFocusable = !0, this.currSelectedCoachIndex = e, this._setScrollDirectionByCoachIndex();
|
|
265
|
+
this.isAutoScrolling = !0, this.isCoachGridFocusable = !0, this.currSelectedCoachIndex = e, this.currSelectedDeckIndex = this._getExistingCoachDeckIndex(), this._setScrollDirectionByCoachIndex();
|
|
266
266
|
const t = this._getCoachScrollPositionX();
|
|
267
267
|
(this.selectedCoachIndex !== -1 || this.currSelectedCoachIndex > 0) && this._isScrollableToSelectedCoach() ? this.coachScrollArea.scrollTo({
|
|
268
268
|
top: this.alignVertical ? t : 0,
|
|
@@ -322,7 +322,11 @@ let Be = (() => {
|
|
|
322
322
|
* At the end of a scroll Event from the coach scrollable area,
|
|
323
323
|
* the reached coach is marked as selected
|
|
324
324
|
*/
|
|
325
|
-
|
|
325
|
+
_handleCoachAreaScrollendEvent() {
|
|
326
|
+
if (this.preventCoachScrollByPlaceClick) {
|
|
327
|
+
this.preventCoachScrollByPlaceClick = !1;
|
|
328
|
+
return;
|
|
329
|
+
}
|
|
326
330
|
const e = this.isAutoScrolling ? this.currSelectedCoachIndex : this._getCoachIndexByScrollTriggerPosition();
|
|
327
331
|
this.currSelectedCoachIndex === -1 && (this.currSelectedCoachIndex = e), this._isScrollableToSelectedCoach() ? this.currSelectedCoachIndex = e : this.currSelectedCoachIndex = e < this.currSelectedCoachIndex ? this.currSelectedCoachIndex : e, this.isAutoScrolling || this._scrollToSelectedNavigationButton(e), this.preventCoachScrollByPlaceClick = !1, this.updateCurrentSelectedCoach(), this.hasNavigation || (this.preselectPlaceInCoach(), this.isAutoScrolling = !1);
|
|
328
332
|
}
|
|
@@ -347,7 +351,7 @@ let Be = (() => {
|
|
|
347
351
|
* Sets the new ScrollDirection by the new given target coach index.
|
|
348
352
|
*/
|
|
349
353
|
_setScrollDirectionByCoachIndex() {
|
|
350
|
-
this.currScrollDirection = this.currSelectedCoachIndex > this.selectedCoachIndex ?
|
|
354
|
+
this.currScrollDirection = this.currSelectedCoachIndex > this.selectedCoachIndex ? I.right : I.left;
|
|
351
355
|
}
|
|
352
356
|
/**
|
|
353
357
|
* Returns the scroll start or end position X from the selected coach.
|
|
@@ -357,7 +361,7 @@ let Be = (() => {
|
|
|
357
361
|
*/
|
|
358
362
|
_getCoachScrollPositionX() {
|
|
359
363
|
const e = this.triggerCoachPositionsCollection[this.currSelectedCoachIndex];
|
|
360
|
-
return this.isKeyboardNavigation && this.currScrollDirection ===
|
|
364
|
+
return this.isKeyboardNavigation && this.currScrollDirection === I.left && e.width > this.scrollCoachsAreaWidth ? e.end - this.scrollCoachsAreaWidth : e.start;
|
|
361
365
|
}
|
|
362
366
|
/**
|
|
363
367
|
* Sets the focus on the HTML table (grid) caption element so that the heading is read out when using a ScreenReader.
|
|
@@ -412,7 +416,7 @@ let Be = (() => {
|
|
|
412
416
|
const o = { ...this.currSelectedPlace.position };
|
|
413
417
|
e && (a = this._getSwitchedCoachDeckIndexByKeyNavigation(e, t), a !== null && (i = this.seatReservations[a].coachItems[this.currSelectedCoachIndex].places || [], o.y = a < this.currSelectedDeckIndex ? t.dimension.h : -1));
|
|
414
418
|
for (const c of i)
|
|
415
|
-
e ? c.number !== this.currSelectedPlace?.number && (e === this.keyboardNavigationEvents.ArrowRight && (c.position.y === o.y || c.position.y === o.y - 1) && c.position.x > o.x && (!s || c.position.x < s.position.x) || e === this.keyboardNavigationEvents.ArrowDown && (c.position.x === o.x || c.position.x === o.x + 1) && c.position.y > o.y && (!s || c.position.y < s.position.y) || e === this.keyboardNavigationEvents.ArrowLeft && (c.position.y === o.y || c.position.y === o.y + 1) && c.position.x < o.x && (!s || c.position.x > s.position.x) || e === this.keyboardNavigationEvents.ArrowUp && (c.position.x === o.x || c.position.x === o.x - 1) && c.position.y < o.y && (!s || c.position.y > s.position.y)) && (s = c) : (this.currScrollDirection ===
|
|
419
|
+
e ? c.number !== this.currSelectedPlace?.number && (e === this.keyboardNavigationEvents.ArrowRight && (c.position.y === o.y || c.position.y === o.y - 1) && c.position.x > o.x && (!s || c.position.x < s.position.x) || e === this.keyboardNavigationEvents.ArrowDown && (c.position.x === o.x || c.position.x === o.x + 1) && c.position.y > o.y && (!s || c.position.y < s.position.y) || e === this.keyboardNavigationEvents.ArrowLeft && (c.position.y === o.y || c.position.y === o.y + 1) && c.position.x < o.x && (!s || c.position.x > s.position.x) || e === this.keyboardNavigationEvents.ArrowUp && (c.position.x === o.x || c.position.x === o.x - 1) && c.position.y < o.y && (!s || c.position.y > s.position.y)) && (s = c) : (this.currScrollDirection === I.right && c.position.y === o.y && (!s || c.position.x < s.position.x) || this.currScrollDirection === I.left && c.position.y === o.y && (!s || c.position.x > s.position.x)) && (s = c);
|
|
416
420
|
a !== null && s && (this.currSelectedDeckIndex = a);
|
|
417
421
|
}
|
|
418
422
|
} else
|
|
@@ -441,7 +445,7 @@ let Be = (() => {
|
|
|
441
445
|
this.scrollToSelectedNavCoach(s);
|
|
442
446
|
}
|
|
443
447
|
_navigateToPlaceByKeyboard(e) {
|
|
444
|
-
if (this.
|
|
448
|
+
if (this.isKeyboardNavigation = !0, this.focusedCoachIndex !== -1 && (this.focusedCoachIndex = -1), !this.preventPlaceClick) {
|
|
445
449
|
const t = this._getClosestPlaceByKeyDirection(e);
|
|
446
450
|
if (t)
|
|
447
451
|
this.focusPlaceElement(t);
|
|
@@ -469,8 +473,8 @@ let Be = (() => {
|
|
|
469
473
|
}
|
|
470
474
|
_updateSelectedSeatReservationPlaces(e, t, s) {
|
|
471
475
|
if (s.state === "SELECTED") {
|
|
472
|
-
const i = this._getSeatReservationPlaceSelection(s);
|
|
473
|
-
|
|
476
|
+
const i = this._getDeckIndexByPlaceId(s.id), a = this._getSeatReservationPlaceSelection(s, i);
|
|
477
|
+
a && e.push(a);
|
|
474
478
|
} else
|
|
475
479
|
e = e.filter((i) => i.id !== s.id);
|
|
476
480
|
if (t > -1 && e.length > t) {
|
|
@@ -480,8 +484,16 @@ let Be = (() => {
|
|
|
480
484
|
return e;
|
|
481
485
|
}
|
|
482
486
|
updateCurrentSelectedPlaceInCoach(e) {
|
|
483
|
-
const t = e.
|
|
484
|
-
|
|
487
|
+
const t = this._getDeckIndexByPlaceId(e.id), s = e.coachIndex;
|
|
488
|
+
if (t === null)
|
|
489
|
+
return;
|
|
490
|
+
const i = this.seatReservations[t].coachItems[s].places?.find((o) => o.number == e.number);
|
|
491
|
+
if (!i)
|
|
492
|
+
return;
|
|
493
|
+
this.currSelectedDeckIndex = t, this.currSelectedCoachIndex = s, this.currSelectedPlace = i, this.currSelectedCoachIndex !== this.selectedCoachIndex && this.updateCurrentSelectedCoach(), this._setCurrSelectedPlaceElementId(i);
|
|
494
|
+
const a = setTimeout(() => {
|
|
495
|
+
this._scrollPlaceIntoNearestViewport(e.id), clearTimeout(a);
|
|
496
|
+
}, 0);
|
|
485
497
|
}
|
|
486
498
|
updateCurrentSelectedCoach() {
|
|
487
499
|
this.selectedCoachIndex = this.currSelectedCoachIndex, this.focusedCoachIndex = -1;
|
|
@@ -492,6 +504,9 @@ let Be = (() => {
|
|
|
492
504
|
detail: e
|
|
493
505
|
}));
|
|
494
506
|
}
|
|
507
|
+
getPlaceElementId(e, t, s) {
|
|
508
|
+
return "seat-reservation__place-button-" + e + "-" + t + "-" + s;
|
|
509
|
+
}
|
|
495
510
|
/**
|
|
496
511
|
* In the case of coach layouts with different decks,
|
|
497
512
|
* it is necessary to extend the offset with empty coaches
|
|
@@ -525,10 +540,10 @@ let Be = (() => {
|
|
|
525
540
|
* that have the state SELECTED within the seatReservation object
|
|
526
541
|
*/
|
|
527
542
|
_initSeatReservationPlaceSelection() {
|
|
528
|
-
this.seatReservations?.forEach((e) => e.coachItems.map((
|
|
529
|
-
|
|
530
|
-
const
|
|
531
|
-
|
|
543
|
+
this.seatReservations?.forEach((e, t) => e.coachItems.map((s, i) => {
|
|
544
|
+
s.places?.filter((a) => a.state === "SELECTED")?.forEach((a) => {
|
|
545
|
+
const o = this.getPlaceElementId(t, i, a.number), c = _e(a, o, e.deckCoachIndex, i), w = this._getSeatReservationPlaceSelection(c, t);
|
|
546
|
+
w && (w.placeType === "SEAT" ? this.selectedSeatReservationPlaces.seats.push(w) : this.selectedSeatReservationPlaces.bicycles.push(w));
|
|
532
547
|
});
|
|
533
548
|
}));
|
|
534
549
|
}
|
|
@@ -545,9 +560,11 @@ let Be = (() => {
|
|
|
545
560
|
}
|
|
546
561
|
return t ? e = e.filter((s) => s.id === t.id) : e = [], e;
|
|
547
562
|
}
|
|
548
|
-
_getSeatReservationPlaceSelection(e) {
|
|
549
|
-
|
|
550
|
-
|
|
563
|
+
_getSeatReservationPlaceSelection(e, t) {
|
|
564
|
+
if (t === null)
|
|
565
|
+
return null;
|
|
566
|
+
const s = this.seatReservations[t].coachItems[e.coachIndex], i = s.places?.find((a) => a.number === e.number);
|
|
567
|
+
return i ? ye(i, s, e.id, e.deckIndex, e.coachIndex) : null;
|
|
551
568
|
}
|
|
552
569
|
_getSeatReservationSelectedCoach(e) {
|
|
553
570
|
if (!this.seatReservations[this.currSelectedDeckIndex].coachItems[e])
|
|
@@ -556,14 +573,14 @@ let Be = (() => {
|
|
|
556
573
|
return be(e, t, s);
|
|
557
574
|
}
|
|
558
575
|
_setCurrSelectedPlaceElementId(e) {
|
|
559
|
-
|
|
576
|
+
this.currSelectedPlaceElementId = e ? this.getPlaceElementId(this.currSelectedDeckIndex, this.currSelectedCoachIndex, e.number) : null;
|
|
560
577
|
}
|
|
561
578
|
/**
|
|
562
579
|
* Preparation of the used documents font-size which needs
|
|
563
580
|
* to be determined in order to correctly calculate css values with rem
|
|
564
581
|
* */
|
|
565
582
|
_determineBaseFontSize() {
|
|
566
|
-
if (!
|
|
583
|
+
if (!pe) {
|
|
567
584
|
const t = 1 / parseInt(window.getComputedStyle(document.body).fontSize, 10);
|
|
568
585
|
this.style?.setProperty("--sbb-seat-reservation-one-px-rem", `${t + "rem"}`);
|
|
569
586
|
}
|
|
@@ -611,41 +628,74 @@ let Be = (() => {
|
|
|
611
628
|
_getPlaceHtmlElement() {
|
|
612
629
|
return this.currSelectedPlaceElementId && this.shadowRoot?.getElementById(this.currSelectedPlaceElementId) || null;
|
|
613
630
|
}
|
|
631
|
+
/**
|
|
632
|
+
* Returns the extracted coach deck index from place id
|
|
633
|
+
* @returns number
|
|
634
|
+
*/
|
|
635
|
+
_getDeckIndexByPlaceId(e) {
|
|
636
|
+
const t = this.shadowRoot?.querySelector("#" + e)?.getAttribute("data-deck-index");
|
|
637
|
+
return t && !isNaN(+t) ? +t : null;
|
|
638
|
+
}
|
|
614
639
|
_isValidCaochIndex(e) {
|
|
615
640
|
return e >= 0 && e <= this.seatReservations[this.seatReservations.length - 1].coachItems.length;
|
|
616
641
|
}
|
|
617
|
-
|
|
642
|
+
/**
|
|
643
|
+
* Returns existing coach deck index depending on the selected coach.
|
|
644
|
+
* This method is necessary to get an available coach deck index during keyboard navigation, which can vary between coaches with different decks.
|
|
645
|
+
* For example, when navigating from a coach with two decks to a coach with one deck.
|
|
646
|
+
*
|
|
647
|
+
* [ooo]-[ooo]-[ooo]
|
|
648
|
+
* [ooo]-[ooo]-[ooo]-[ooo]-[ooo]
|
|
649
|
+
*
|
|
650
|
+
* @returns number
|
|
651
|
+
*/
|
|
652
|
+
_getExistingCoachDeckIndex() {
|
|
653
|
+
if (this.seatReservations[this.currSelectedDeckIndex].coachItems[this.currSelectedCoachIndex].places !== void 0)
|
|
654
|
+
return this.currSelectedDeckIndex;
|
|
655
|
+
const e = this.seatReservations.findIndex((t) => t.coachItems[this.currSelectedCoachIndex].places !== void 0);
|
|
656
|
+
return this.currSelectedDeckIndex >= e ? this.currSelectedDeckIndex : e;
|
|
657
|
+
}
|
|
658
|
+
/**
|
|
659
|
+
* If a selected place is slightly hidden by the overflow scroll content and is still clicked,
|
|
660
|
+
* the method tries to scroll the selected place into the nearest viewport, so that it is completely visible.
|
|
661
|
+
*
|
|
662
|
+
* @param placeId
|
|
663
|
+
*/
|
|
664
|
+
_scrollPlaceIntoNearestViewport(e) {
|
|
665
|
+
this.shadowRoot?.getElementById(e)?.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
|
|
666
|
+
}
|
|
667
|
+
}, x = new WeakMap(), p = new WeakMap(), m = new WeakMap(), _ = new WeakMap(), y = new WeakMap(), b = new WeakMap(), P = new WeakMap(), A = new WeakMap(), k = new WeakMap(), R = new WeakMap(), E = new WeakMap(), N = new WeakMap(), (() => {
|
|
618
668
|
const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(n[Symbol.metadata] ?? null) : void 0;
|
|
619
|
-
u = [S({ attribute: "seat-reservations", type: Array })],
|
|
669
|
+
u = [S({ attribute: "seat-reservations", type: Array })], z = [C(), S({ attribute: "has-navigation", type: Boolean })], O = [C(), S({ attribute: "align-vertical", type: Boolean, reflect: !0, useDefault: !0 })], W = [C(), S({ attribute: "base-grid-size", type: Number })], K = [C(), S({ attribute: "height", type: Number })], M = [C(), S({ attribute: "max-seat-reservations", type: Number })], Y = [C(), S({ attribute: "max-bicycle-reservations", type: Number })], Z = [C(), S({ attribute: "prevent-place-click", type: Boolean })], se = [C(), S({ attribute: "preselect-coach-index", type: Number })], ce = [T()], le = [T()], de = [T()], ve = [me({ passive: !0 })], f(h, null, u, { kind: "accessor", name: "seatReservations", static: !1, private: !1, access: { has: (t) => "seatReservations" in t, get: (t) => t.seatReservations, set: (t, s) => {
|
|
620
670
|
t.seatReservations = s;
|
|
621
|
-
} }, metadata: e }, D,
|
|
671
|
+
} }, metadata: e }, D, B), f(h, null, z, { kind: "accessor", name: "hasNavigation", static: !1, private: !1, access: { has: (t) => "hasNavigation" in t, get: (t) => t.hasNavigation, set: (t, s) => {
|
|
622
672
|
t.hasNavigation = s;
|
|
623
|
-
} }, metadata: e },
|
|
673
|
+
} }, metadata: e }, F, V), f(h, null, O, { kind: "accessor", name: "alignVertical", static: !1, private: !1, access: { has: (t) => "alignVertical" in t, get: (t) => t.alignVertical, set: (t, s) => {
|
|
624
674
|
t.alignVertical = s;
|
|
625
|
-
} }, metadata: e },
|
|
675
|
+
} }, metadata: e }, G, L), f(h, null, W, { kind: "accessor", name: "baseGridSize", static: !1, private: !1, access: { has: (t) => "baseGridSize" in t, get: (t) => t.baseGridSize, set: (t, s) => {
|
|
626
676
|
t.baseGridSize = s;
|
|
627
|
-
} }, metadata: e },
|
|
677
|
+
} }, metadata: e }, X, H), f(h, null, K, { kind: "accessor", name: "height", static: !1, private: !1, access: { has: (t) => "height" in t, get: (t) => t.height, set: (t, s) => {
|
|
628
678
|
t.height = s;
|
|
629
|
-
} }, metadata: e },
|
|
679
|
+
} }, metadata: e }, U, q), f(h, null, M, { kind: "accessor", name: "maxSeatReservations", static: !1, private: !1, access: { has: (t) => "maxSeatReservations" in t, get: (t) => t.maxSeatReservations, set: (t, s) => {
|
|
630
680
|
t.maxSeatReservations = s;
|
|
631
|
-
} }, metadata: e },
|
|
681
|
+
} }, metadata: e }, $, j), f(h, null, Y, { kind: "accessor", name: "maxBicycleReservations", static: !1, private: !1, access: { has: (t) => "maxBicycleReservations" in t, get: (t) => t.maxBicycleReservations, set: (t, s) => {
|
|
632
682
|
t.maxBicycleReservations = s;
|
|
633
|
-
} }, metadata: e },
|
|
683
|
+
} }, metadata: e }, J, Q), f(h, null, Z, { kind: "accessor", name: "preventPlaceClick", static: !1, private: !1, access: { has: (t) => "preventPlaceClick" in t, get: (t) => t.preventPlaceClick, set: (t, s) => {
|
|
634
684
|
t.preventPlaceClick = s;
|
|
635
|
-
} }, metadata: e },
|
|
685
|
+
} }, metadata: e }, ee, te), f(h, null, se, { kind: "accessor", name: "preselectCoachIndex", static: !1, private: !1, access: { has: (t) => "preselectCoachIndex" in t, get: (t) => t.preselectCoachIndex, set: (t, s) => {
|
|
636
686
|
t.preselectCoachIndex = s;
|
|
637
|
-
} }, metadata: e },
|
|
687
|
+
} }, metadata: e }, ie, ae), f(h, null, ce, { kind: "accessor", name: "selectedCoachIndex", static: !1, private: !1, access: { has: (t) => "selectedCoachIndex" in t, get: (t) => t.selectedCoachIndex, set: (t, s) => {
|
|
638
688
|
t.selectedCoachIndex = s;
|
|
639
|
-
} }, metadata: e },
|
|
689
|
+
} }, metadata: e }, oe, re), f(h, null, le, { kind: "accessor", name: "focusedCoachIndex", static: !1, private: !1, access: { has: (t) => "focusedCoachIndex" in t, get: (t) => t.focusedCoachIndex, set: (t, s) => {
|
|
640
690
|
t.focusedCoachIndex = s;
|
|
641
|
-
} }, metadata: e },
|
|
691
|
+
} }, metadata: e }, ne, he), f(h, null, de, { kind: "accessor", name: "hoveredScrollCoachIndex", static: !1, private: !1, access: { has: (t) => "hoveredScrollCoachIndex" in t, get: (t) => t.hoveredScrollCoachIndex, set: (t, s) => {
|
|
642
692
|
t.hoveredScrollCoachIndex = s;
|
|
643
|
-
} }, metadata: e },
|
|
693
|
+
} }, metadata: e }, ue, ge), f(h, null, ve, { kind: "method", name: "coachAreaScrollend", static: !1, private: !1, access: { has: (t) => "coachAreaScrollend" in t, get: (t) => t.coachAreaScrollend }, metadata: e }, null, d), e && Object.defineProperty(h, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
|
|
644
694
|
})(), h.events = {
|
|
645
695
|
selectedplaces: "selectedplaces",
|
|
646
696
|
selectedcoach: "selectedcoach"
|
|
647
697
|
}, h;
|
|
648
698
|
})();
|
|
649
699
|
export {
|
|
650
|
-
|
|
700
|
+
ze as SeatReservationBaseElement
|
|
651
701
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"seat-reservation.component.d.ts","sourceRoot":"","sources":["../../../../src/elements-experimental/seat-reservation/seat-reservation/seat-reservation.component.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAgB1E,OAAO,EAAE,0BAA0B,EAAE,MAAM,oCAAoC,CAAC;AAGhF,OAAO,mCAAmC,CAAC;AAC3C,OAAO,+CAA+C,CAAC;AACvD,OAAO,6BAA6B,CAAC;AACrC,OAAO,gCAAgC,CAAC;AACxC,OAAO,sCAAsC,CAAC;AAC9C,OAAO,yCAAyC,CAAC;AACjD,OAAO,+BAA+B,CAAC;AACvC,OAAO,4CAA4C,CAAC;AAEpD;;;GAGG;AACH,qBAEM,yBAA0B,SAAQ,0BAA0B;IAChE,OAAuB,MAAM,EAAE,cAAc,CAA4B;IAEzE,OAAO,CAAC,SAAS,CAAmC;IACpD,OAAO,CAAC,oBAAoB,CAAC,CAAiB;IAE9C,OAAO,CAAC,gBAAgB,CAQtB;IAGF,OAAO,CAAC,2BAA2B,CAAkB;cAElC,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAgBzD,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAS3D,MAAM,IAAI,cAAc,GAAG,IAAI;IAKlD,OAAO,CAAC,uCAAuC;IAoD/C,OAAO,CAAC,iBAAiB;IAYzB,OAAO,CAAC,8BAA8B;IAmCtC,OAAO,CAAC,iBAAiB;IAwCzB;;;;;OAKG;IACH,OAAO,CAAC,cAAc;
|
|
1
|
+
{"version":3,"file":"seat-reservation.component.d.ts","sourceRoot":"","sources":["../../../../src/elements-experimental/seat-reservation/seat-reservation/seat-reservation.component.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAgB1E,OAAO,EAAE,0BAA0B,EAAE,MAAM,oCAAoC,CAAC;AAGhF,OAAO,mCAAmC,CAAC;AAC3C,OAAO,+CAA+C,CAAC;AACvD,OAAO,6BAA6B,CAAC;AACrC,OAAO,gCAAgC,CAAC;AACxC,OAAO,sCAAsC,CAAC;AAC9C,OAAO,yCAAyC,CAAC;AACjD,OAAO,+BAA+B,CAAC;AACvC,OAAO,4CAA4C,CAAC;AAEpD;;;GAGG;AACH,qBAEM,yBAA0B,SAAQ,0BAA0B;IAChE,OAAuB,MAAM,EAAE,cAAc,CAA4B;IAEzE,OAAO,CAAC,SAAS,CAAmC;IACpD,OAAO,CAAC,oBAAoB,CAAC,CAAiB;IAE9C,OAAO,CAAC,gBAAgB,CAQtB;IAGF,OAAO,CAAC,2BAA2B,CAAkB;cAElC,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAgBzD,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAS3D,MAAM,IAAI,cAAc,GAAG,IAAI;IAKlD,OAAO,CAAC,uCAAuC;IAoD/C,OAAO,CAAC,iBAAiB;IAYzB,OAAO,CAAC,8BAA8B;IAmCtC,OAAO,CAAC,iBAAiB;IAwCzB;;;;;OAKG;IACH,OAAO,CAAC,cAAc;IAuBtB,OAAO,CAAC,mBAAmB;IAsC3B;;;OAGG;IACH,OAAO,CAAC,wBAAwB;IA8BhC,OAAO,CAAC,qBAAqB;IAoC7B,OAAO,CAAC,wBAAwB;IAsDhC,OAAO,CAAC,6BAA6B;IAgCrC;;;;;;;;OAQG;IACH,OAAO,CAAC,yBAAyB;IAgFjC,OAAO,CAAC,4BAA4B;IAuCpC,OAAO,CAAC,2BAA2B;IAwCnC;;;;OAIG;IACH,OAAO,CAAC,cAAc;IAatB,OAAO,CAAC,iBAAiB;IAgBzB,OAAO,CAAC,gBAAgB;IASxB;;;;;OAKG;IACH,OAAO,CAAC,QAAQ;IAWhB;;;OAGG;IACH,OAAO,CAAC,aAAa;IAMrB,OAAO,CAAC,yBAAyB;IAkCjC,OAAO,CAAC,8BAA8B;CAyBvC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,sBAAsB,EAAE,yBAAyB,CAAC;KACnD;CACF"}
|