@sbb-esta/lyne-elements-experimental 4.7.0 → 4.8.0

package/seat-reservation/seat-reservation/seat-reservation-base-element.js

@@ -1,810 +1,835 @@
-var ye = (h) => {
-  throw TypeError(h);
-};
-var be = (h, d, f) => d.has(h) || ye("Cannot " + f);
-var u = (h, d, f) => (be(h, d, "read from private field"), f ? f.call(h) : d.get(h)), g = (h, d, f) => d.has(h) ? ye("Cannot add the same private member more than once") : d instanceof WeakSet ? d.add(h) : d.set(h, f), r = (h, d, f, B) => (be(h, d, "write to private field"), B ? B.call(h, f) : d.set(h, f), f);
-import { __esDecorate as v, __runInitializers as n } from "tslib";
-import { isArrowKeyOrPageKeysPressed as Pe } from "@sbb-esta/lyne-elements/core/a11y.js";
-import { forceType as S } from "@sbb-esta/lyne-elements/core/decorators.js";
-import { LitElement as Ee, isServer as Re } from "lit";
-import { property as C, state as z, eventOptions as Ne } from "lit/decorators.js";
-import { mapIconToSvg as Ae, mapPlaceInfosToPlaceSelection as ke, mapPlaceAndCoachToSeatReservationPlaceSelection as De, mapCoachInfosToCoachSelection as Te } from "../common/mapper.js";
-var I;
-(function(h) {
-  h.right = "right", h.left = "left";
-})(I || (I = {}));
-const we = 3, Be = [
-  "sa-vo",
-  "sa-rs",
-  "sa-abteilkinderwagen",
-  "sa-wr",
-  "sa-fa",
-  "sa-bz",
-  "sa-rz"
-];
-let Me = (() => {
-  var x, p, _, m, y, b, P, A, E, R, N, k, D, T, l;
-  let h = Ee, d = [], f, B = [], O = [], V, F = [], G = [], L, W = [], H = [], M, K = [], X = [], U, q = [], $ = [], j, Y = [], J = [], Q, Z = [], ee = [], te, se = [], ie = [], ae, ce = [], oe = [], re, ne = [], le = [], he, de = [], ue = [], ge, ve = [], fe = [], Ce, Se = [], Ie = [], xe, pe = [], _e = [], me;
-  return l = class extends h {
-    constructor() {
-      super();
-      g(this, x);
-      g(this, p);
-      g(this, _);
-      g(this, m);
-      g(this, y);
-      g(this, b);
-      g(this, P);
-      g(this, A);
-      g(this, E);
-      g(this, R);
-      g(this, N);
-      g(this, k);
-      g(this, D);
-      g(this, T);
-      r(this, x, (n(this, d), n(this, B, null))), r(this, p, (n(this, O), n(this, F, "NONE"))), r(this, _, (n(this, G), n(this, W, !0))), r(this, m, (n(this, H), n(this, K, !1))), r(this, y, (n(this, X), n(this, q, 16))), r(this, b, (n(this, $), n(this, Y, null))), r(this, P, (n(this, J), n(this, Z, -1))), r(this, A, (n(this, ee), n(this, se, -1))), r(this, E, (n(this, ie), n(this, ce, !1))), r(this, R, (n(this, oe), n(this, ne, -1))), r(this, N, (n(this, le), n(this, de, !1))), r(this, k, (n(this, ue), n(this, ve, -1))), r(this, D, (n(this, fe), n(this, Se, -1))), r(this, T, (n(this, Ie), n(this, pe, -1))), this.coachBorderPadding = (n(this, _e), 6), this.gapBetweenCoaches = 4, this.coachBorderOffset = this.coachBorderPadding / this.baseGridSize, this.gapBetweenCoachDecks = 48, this.coachNavButtonDim = 0, this.coachItemDetailsElements = [], this.currScrollDirection = I.right, this.maxCalcCoachesWidth = 0, this.scrollCoachesAreaWidth = 0, this.scrollNavigationAreaDim = 0, this.triggerCoachPositionsCollection = [], this.navigationScrollArea = null, this.coachScrollArea = null, this.currSelectedPlace = null, this.currSelectedPlaceElementId = null, this.currSelectedCoachIndex = -1, this.currSelectedDeckIndex = 0, this.preventCoachScrollByPlaceClick = !1, this.selectedSeatReservationPlaces = {
-        seats: [],
-        bicycles: []
-      }, this.seatReservationWithoutNavigationHasFocus = !1, this.isCoachGridFocusable = !1, this.isAutoScrolling = !1, this.isKeyboardNavigation = !1, this.hasMultipleDecks = !1, this.hasSeatReservationNativeFocus = !1, this.keyboardNavigationEvents = {
-        ArrowLeft: "ArrowLeft",
-        ArrowRight: "ArrowRight",
-        ArrowUp: "ArrowUp",
-        ArrowDown: "ArrowDown",
-        Tab: "Tab",
-        Enter: "Enter"
-      }, this.notAreaElements = [
-        "DRIVER_AREA",
-        "DRIVER_AREA_NO_VERTICAL_WALL",
-        "COACH_PASSAGE",
-        "COACH_WALL_NO_PASSAGE",
-        "COMPARTMENT_PASSAGE",
-        "COMPARTMENT_PASSAGE_HIGH",
-        "COMPARTMENT_PASSAGE_MIDDLE",
-        "COMPARTMENT_PASSAGE_LOW"
-      ], this.overHangingElementInformation = [], this._isRunningInitPreselectCoachIndex = !1, this._lastStartScrollPos = -1, this._prepareServiceIconsNavigation = (e) => {
-        if (!e)
-          return [];
-        const t = e?.map(function(s) {
-          return {
-            pId: s,
-            svgName: Ae[s]?.svgName ? Ae[s]?.svgName : ""
-          };
-        }).filter((s) => Be.indexOf(s.svgName) !== -1).filter((s, i, a) => a.map((o) => o.svgName).indexOf(s.svgName) === i).map((s) => s.pId).slice(0, we);
-        return t || [];
-      }, this.addEventListener("blur", () => this._onLeaveSeatReservationComponent());
-    }
-    /** The seat reservations array contains all coaches and places */
-    get seatReservations() {
-      return u(this, x);
-    }
-    set seatReservations(e) {
-      r(this, x, e);
-    }
-    /** Displays an arrow showing what direction does train drive*/
-    get travelDirection() {
-      return u(this, p);
-    }
-    set travelDirection(e) {
-      r(this, p, e);
-    }
-    /** The seat reservation navigation can be toggled by this property */
-    get hasNavigation() {
-      return u(this, _);
-    }
-    set hasNavigation(e) {
-      r(this, _, e);
-    }
-    /** The seat reservation area is aligned vertically */
-    get alignVertical() {
-      return u(this, m);
-    }
-    set alignVertical(e) {
-      r(this, m, e);
-    }
-    /** The seat reservation area's base grid size */
-    get baseGridSize() {
-      return u(this, y);
-    }
-    set baseGridSize(e) {
-      r(this, y, e);
-    }
-    /** The seat reservation area's width */
-    get height() {
-      return u(this, b);
-    }
-    set height(e) {
-      r(this, b, e);
-    }
-    /** Maximal number of possible clickable seats */
-    get maxSeatReservations() {
-      return u(this, P);
-    }
-    set maxSeatReservations(e) {
-      r(this, P, e);
-    }
-    /** Maximal number of possible clickable bicycle places */
-    get maxBicycleReservations() {
-      return u(this, A);
-    }
-    set maxBicycleReservations(e) {
-      r(this, A, e);
-    }
-    /** Any click functionality is prevented */
-    get preventPlaceClick() {
-      return u(this, E);
-    }
-    set preventPlaceClick(e) {
-      r(this, E, e);
-    }
-    get preselectCoachIndex() {
-      return u(this, R);
-    }
-    set preselectCoachIndex(e) {
-      r(this, R, e);
-    }
-    /** The seat reservation title information at place-controls, navigation-coaches and navigation-services can be toggled by this property */
-    get showTitleInfo() {
-      return u(this, N);
-    }
-    set showTitleInfo(e) {
-      r(this, N, e);
-    }
-    get selectedCoachIndex() {
-      return u(this, k);
-    }
-    set selectedCoachIndex(e) {
-      r(this, k, e);
-    }
-    get focusedCoachIndex() {
-      return u(this, D);
-    }
-    set focusedCoachIndex(e) {
-      r(this, D, e);
-    }
-    get hoveredCoachIndex() {
-      return u(this, T);
-    }
-    set hoveredCoachIndex(e) {
-      r(this, T, e);
-    }
-    willUpdate(e) {
-      if (super.willUpdate(e), e.has("seatReservations") && (this.hasMultipleDecks = this.seatReservations?.length > 1, this._initPrepareSeatReservationData(), this._prepareCoachWidthAndGapCalculations(), 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) {
-        const t = this.seatReservations[this.currSelectedDeckIndex] || null;
-        t?.coachItems.length && (this.baseGridSize = this.height / t.coachItems[0].dimension.h, this.coachBorderOffset = this.coachBorderPadding / this.baseGridSize, this.style?.setProperty("--sbb-seat-reservation-grid-size", `${this.baseGridSize}px`), this.initNavigationSelectionByScrollEvent());
-      }
-      e.has("alignVertical") && this.alignVertical && this.initNavigationSelectionByScrollEvent(), e.has("preselectCoachIndex") && (this._isRunningInitPreselectCoachIndex = !0, setTimeout(() => this.scrollToSelectedNavCoach(this.preselectCoachIndex), 1));
-    }
-    navigateByDirectionBtn(e) {
-      this.unfocusPlaceElement();
-      let t = this.currSelectedCoachIndex;
-      e == "DIRECTION_LEFT" && t > 0 ? t = this.currSelectedCoachIndex != -1 ? this.currSelectedCoachIndex - 1 : 0 : e == "DIRECTION_RIGHT" && t < this.seatReservations[this.currSelectedDeckIndex]?.coachItems.length - 1 && (t = this.currSelectedCoachIndex != -1 ? this.currSelectedCoachIndex + 1 : 0), this.scrollToSelectedNavCoach(t);
-    }
-    /**
-     * Data can be prepared once for the entire component
-     * in order to avoid recurring iteration processes in rendering.
-     */
-    _initPrepareSeatReservationData() {
-      this._determineBaseFontSize(), this.hasMultipleDecks && this._initEmptyCoachDeckOffsets(), this._prepareCoachItemDetailsData();
-    }
-    /** Init scroll event handling for coach navigation */
-    initNavigationSelectionByScrollEvent() {
-      this.coachScrollArea = this.shadowRoot?.querySelector("#sbb-sr__wrapper-scrollarea"), this.navigationScrollArea = this.shadowRoot?.querySelector("#sbb-sr__navigation-list-coaches");
-      const e = this.seatReservations ? this.seatReservations[this.currSelectedDeckIndex] : null;
-      if (e && e.coachItems.length > 0) {
-        const t = e.coachItems[0].dimension.h * this.baseGridSize + this.coachBorderPadding, s = (this.seatReservations.length - 1) * this.gapBetweenCoachDecks;
-        this.style?.setProperty("--sbb-seat-reservation-height", `${t * this.seatReservations.length + s}`), this.style?.setProperty("--sbb-seat-reservation-decks", `${this.seatReservations.length}`);
-      }
-      if (this.navigationScrollArea) {
-        this.scrollNavigationAreaDim = this.alignVertical ? this.navigationScrollArea.getBoundingClientRect().height : this.navigationScrollArea.getBoundingClientRect().width;
-        const t = this.navigationScrollArea.querySelector("ul > li");
-        if (t) {
-          const s = t?.getBoundingClientRect();
-          this.coachNavButtonDim = this.alignVertical ? s.height : s.width;
-        }
-      }
-      if (this.coachScrollArea && e) {
-        let t = 0;
-        this.scrollCoachesAreaWidth = this.alignVertical ? this.coachScrollArea.getBoundingClientRect().height : this.coachScrollArea.getBoundingClientRect().width, this.triggerCoachPositionsCollection = e.coachItems.map((s) => {
-          const i = t, a = this.getCalculatedDimension(s.dimension).w, o = this.overHangingElementInformation.find((w) => w.coachId === s.id), c = o?.overhangingPlaces || o?.overhangingGraphicAreas;
-          return t += a + (c ? 2 * this.gapBetweenCoaches : this.gapBetweenCoaches), {
-            start: i,
-            end: t,
-            width: a
-          };
-        }), this.maxCalcCoachesWidth = t - this.gapBetweenCoaches;
-      }
-    }
-    /**
-     * Scroll event handler managed the end of scrolling inside the coach scroll area.
-     * Timeout event handling to check if the scrolling has been completed.
-     * It is required because the Safari browser does not handle scrollend event,
-     * and we therefore imitate this event -> scrollend.
-     */
-    coachAreaScrollend() {
-      this._scrollTimeout && clearTimeout(this._scrollTimeout), this._scrollTimeout = setTimeout(() => this._handleCoachAreaScrollendEvent(), 150);
-    }
-    /**
-     * If no navigation exists (property setting -> hasNavigation) and a table coach gets the focus,
-     * the first place in the coach must be automatically preselected to control the place navigation via keyboard
-     *
-     * @param focusCoachIndex
-     */
-    onFocusTableCoachAndPreselectPlace(e) {
-      !this.seatReservationWithoutNavigationHasFocus && !this.hasNavigation && (this.seatReservationWithoutNavigationHasFocus = !0, this.currSelectedCoachIndex = e === 0 ? this.getNextAvailableCoachIndex(-1) : this.getPrevAvailableCoachIndex(e), this.preselectPlaceInCoach());
-    }
-    /** Will be triggered by focus navigation direction */
-    onFocusNavDirectionButton() {
-      this.focusedCoachIndex = -1;
-    }
-    /** TAB Key Event handling for Coach Navigation */
-    onKeyNavigationNavCoachButton(e, t) {
-      if (e.key === this.keyboardNavigationEvents.Tab) {
-        this._handleTabKeyNavigation(e, "navigation", t);
-        return;
-      }
-      Pe(e) && this.keyboardSeatmapEventHandling(e);
-    }
-    /** General TAB Key Event handling for tab navigation inside the coach navigation area and the seatmap area */
-    _handleTabKeyNavigation(e, t, s) {
-      const i = e.key, a = e.shiftKey;
-      i === this.keyboardNavigationEvents.Tab && (t == "navigation" ? (s == this.currSelectedCoachIndex ? !this.currSelectedPlace || !a || this.coachItemDetailsElements[s].isDriverArea || this.focusedCoachIndex == -1 ? this.focusedCoachIndex = s : a && this.currSelectedPlace && (this.focusedCoachIndex = -1, this.focusPlaceElement(this.currSelectedPlace)) : this.focusedCoachIndex = s, this._scrollToSelectedNavigationButton(s)) : t == "seatmap" && (e.preventDefault(), a ? this._navigateCoachNavigationByKeyboard("PREV_TAB") : this._navigateCoachNavigationByKeyboard("NEXT_TAB")));
-    }
-    /**
-     * Initialisation of Keyboard Seatmap event handling to navigation between each places inside a selected coach by using [arrow] keys.
-     * With the [TAB] key the user navigation goes to the next coach navigation element and the currently selected place is automatically reset.
-     */
-    keyboardSeatmapEventHandling(e) {
-      const t = e.key === this.keyboardNavigationEvents.Tab, s = e.shiftKey && t;
-      if (!this.hasNavigation && this.currSelectedCoachIndex === 0 && s || this.currSelectedCoachIndex === this.coachItemDetailsElements.length - 1 && t)
-        return;
-      const i = e.key;
-      if (this.preventCoachScrollByPlaceClick = !1, !this.hasSeatReservationNativeFocus && (t || s) && (this.hasSeatReservationNativeFocus = !0), t) {
-        this._handleTabKeyNavigation(e, "seatmap");
-        return;
-      }
-      if (this.currSelectedCoachIndex !== -1 && Pe(e))
-        switch (e.preventDefault(), i) {
-          case this.keyboardNavigationEvents.ArrowLeft:
-            {
-              const a = this.alignVertical ? this.keyboardNavigationEvents.ArrowDown : i;
-              this._navigateToPlaceByKeyboard(a);
-            }
-            break;
-          case this.keyboardNavigationEvents.ArrowRight:
-            {
-              const a = this.alignVertical ? this.keyboardNavigationEvents.ArrowUp : i;
-              this._navigateToPlaceByKeyboard(a);
-            }
-            break;
-          case this.keyboardNavigationEvents.ArrowUp:
-            {
-              const a = this.alignVertical ? this.keyboardNavigationEvents.ArrowLeft : i;
-              this._navigateToPlaceByKeyboard(a);
-            }
-            break;
-          case this.keyboardNavigationEvents.ArrowDown:
-            {
-              const a = this.alignVertical ? this.keyboardNavigationEvents.ArrowRight : i;
-              this._navigateToPlaceByKeyboard(a);
-            }
-            break;
-        }
-    }
-    /**
-     * Selects a place inside the coach if navigated via keyboard,
-     * otherwise the coach grid is selected (necessary for ScreenReader)
-     */
-    preselectPlaceInCoach() {
-      if (this.isAutoScrolling) {
-        if (this._isRunningInitPreselectCoachIndex) {
-          this._isRunningInitPreselectCoachIndex = !1;
-          return;
-        }
-        if (this.coachItemDetailsElements[this.currSelectedCoachIndex] && this.coachItemDetailsElements[this.currSelectedCoachIndex].isDriverArea) {
-          this._setFocusToSelectedCoachGrid();
-          return;
-        }
-        if (this.isKeyboardNavigation && this.isAutoScrolling) {
-          const e = this._getClosestPlaceByKeyDirection();
-          e ? (this.unfocusPlaceElement(), this.focusPlaceElement(e), this.focusedCoachIndex = -1) : this._setFocusToSelectedCoachGrid();
-        } else
-          this.unfocusPlaceElement(), this.isCoachGridFocusable = !0, this._setFocusToSelectedCoachGrid();
-      }
-    }
-    scrollToSelectedNavCoach(e) {
-      if (this._isValidCoachIndex(e) && e !== this.currSelectedCoachIndex) {
-        this.hoveredCoachIndex = e, this.isAutoScrolling = !0, this.isCoachGridFocusable = !0, this.currSelectedCoachIndex = e, this.currSelectedDeckIndex = this._getExistingCoachDeckIndex(), this._setScrollDirectionByCoachIndex();
-        const t = this._getCoachScrollPositionX();
-        (this.selectedCoachIndex !== -1 || this.currSelectedCoachIndex > 0) && this._isScrollableToSelectedCoach() ? (this._lastStartScrollPos = this.coachScrollArea.scrollLeft, this.coachScrollArea.scrollTo({
-          top: this.alignVertical ? t : 0,
-          left: this.alignVertical ? 0 : t,
-          behavior: "smooth"
-        })) : this.updateCurrentSelectedCoach(), this._scrollToSelectedNavigationButton(e);
-      }
-    }
-    focusPlaceElement(e) {
-      if (this.unfocusPlaceElement(), e) {
-        this.currSelectedPlace = e, this._setCurrSelectedPlaceElementId(e);
-        const t = this._getPlaceHtmlElement();
-        if (t) {
-          t.setAttribute("keyfocus", "focus");
-          const s = setTimeout(() => {
-            const i = this.getPlaceElementId(this.currSelectedDeckIndex, this.currSelectedCoachIndex, e.number);
-            this._scrollPlaceIntoNearestViewport(i), clearTimeout(s);
-          }, 0);
-        }
-      }
-    }
-    unfocusPlaceElement() {
-      const e = this._getPlaceHtmlElement();
-      e && (e.setAttribute("keyfocus", "unfocus"), this._setCurrSelectedPlaceElementId(null), this.currSelectedPlace = null);
-    }
-    getCalculatedDimension(e, t, s, i) {
-      return t && !s && (e.h += this.coachBorderOffset * 2), i && (e.h += this.coachBorderOffset), {
-        w: this.baseGridSize * e.w,
-        h: this.baseGridSize * e.h
-      };
-    }
-    getCalculatedPosition(e, t, s, i) {
-      if (s && t) {
-        const a = i ? s.h : s.h + this.coachBorderOffset;
-        e.y === 0 ? e.y -= this.coachBorderOffset : e.y + t.h === a && (e.y += this.coachBorderOffset);
-      }
-      return {
-        x: this.baseGridSize * e.x,
-        y: this.baseGridSize * e.y,
-        z: e.z
-      };
-    }
-    /**
-     * detects if a (graphical) element is on the border with its position (upper or lower border).
-     * @param baseElement
-     * @param coachDimension
-     * @protected
-     */
-    isElementDirectlyOnBorder(e, t) {
-      return e.position.y === 0 || e.position.y + e.dimension.h === t.h;
-    }
-    /**
-     * Counts all available seats together depending on the seat type
-     *
-     * @param places
-     * @returns An Object with count of free seats and free bicycle places
-     */
-    getAvailableFreePlacesNumFromCoach(e) {
-      const t = { seats: 0, bicycles: 0 }, s = e?.reduce((i, a) => (a.state !== "FREE" || (a.type === "SEAT" ? i.seats++ : i.bicycles++), i), t);
-      return s || t;
-    }
-    /**
-     * At the end of a scroll Event from the coach scrollable area,
-     * the reached coach is marked as selected
-     */
-    _handleCoachAreaScrollendEvent() {
-      const e = this.isAutoScrolling ? this.currSelectedCoachIndex : this._getCoachIndexByScrollTriggerPosition();
-      if (this.preventCoachScrollByPlaceClick) {
-        Math.abs(this._lastStartScrollPos - this.coachScrollArea.scrollLeft) > this.baseGridSize * 2 && (this.selectedCoachIndex = e), this.preventCoachScrollByPlaceClick = !1;
-        return;
-      }
-      this._lastStartScrollPos = this.coachScrollArea.scrollLeft, this.hoveredCoachIndex = -1, 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);
-    }
-    /**
-     * Performs an automatic main navigation scroll to the specified selectedNavCoachIndex.
-     * Calculates the central scroll offset of the nav coach to be selected.
-     * @param selectedNavCoachIndex
-     */
-    _scrollToSelectedNavigationButton(e) {
-      setTimeout(() => {
-        if (this.hasNavigation && this.navigationScrollArea) {
-          const t = this.scrollNavigationAreaDim / 2, i = e * this.coachNavButtonDim - t + this.coachNavButtonDim;
-          this.navigationScrollArea.scrollTo({
-            top: this.alignVertical ? i : 0,
-            left: this.alignVertical ? 0 : i,
-            behavior: "smooth"
-          });
-        }
-      }, 10);
-    }
-    /**
-     * Sets the new ScrollDirection by the new given target coach index.
-     */
-    _setScrollDirectionByCoachIndex() {
-      this.currScrollDirection = this.currSelectedCoachIndex > this.selectedCoachIndex ? I.right : I.left;
-    }
-    /**
-     * Returns the scroll start or end position X from the selected coach.
-     * In case the user is currently navigating through places by keyboard and goes to previous coach,
-     * then we return the end position of the coach to get the closest scroll position of the next focus place.
-     * @returns number
-     */
-    _getCoachScrollPositionX() {
-      const e = this.triggerCoachPositionsCollection[this.currSelectedCoachIndex];
-      return this.isKeyboardNavigation && this.currScrollDirection === I.left && e.width > this.scrollCoachesAreaWidth ? e.end - this.scrollCoachesAreaWidth : e.start;
-    }
-    /**
-     * Sets the focus on the HTML table (grid) caption element so that the heading is read out when using a ScreenReader.
-     */
-    _setFocusToSelectedCoachGrid() {
-      if (this.isCoachGridFocusable && this.hasSeatReservationNativeFocus) {
-        this.isCoachGridFocusable = !1;
-        const e = this.shadowRoot?.querySelector("#sbb-sr-coach-caption-" + this.currSelectedCoachIndex);
-        e && e.focus();
-      }
-    }
-    /**
-     * Returns whether the current scrolled position can be used to scroll to the selected wagon
-     * @returns boolean
-     */
-    _isScrollableToSelectedCoach() {
-      const e = this.alignVertical ? this.coachScrollArea.scrollTop : this.coachScrollArea.scrollLeft, t = this.alignVertical ? this.coachScrollArea.getBoundingClientRect().height : this.coachScrollArea.getBoundingClientRect().width, s = this.maxCalcCoachesWidth - t, i = this.triggerCoachPositionsCollection[this.currSelectedCoachIndex], a = e === this.triggerCoachPositionsCollection[this.currSelectedCoachIndex].start;
-      return (e < s || e > i.start) && !a;
-    }
-    /**
-     * Returns the coach index which is currently visible in the scroll area
-     * @returns number
-     */
-    _getCoachIndexByScrollTriggerPosition() {
-      const t = (this.alignVertical ? this.coachScrollArea.scrollTop : this.coachScrollArea.scrollLeft) + this.scrollCoachesAreaWidth / 2;
-      return this.triggerCoachPositionsCollection.findIndex((s) => t >= s.start && t <= s.end);
-    }
-    /**
-     * Get the first place of current selected coach by table cell coordinate 0-0 id.
-     * @returns Place or null
-     */
-    _getFirstPlaceInSelectedCoach() {
-      let e = null;
-      const t = this.seatReservations[this.currSelectedDeckIndex].coachItems[this.currSelectedCoachIndex], s = "cell-" + this.currSelectedDeckIndex + "-" + this.currSelectedCoachIndex + "-0-0", i = this.shadowRoot?.querySelector("#" + s)?.querySelector("sbb-seat-reservation-place-control")?.getAttribute("text") || null;
-      return t && i && (e = t.places?.find((a) => a.number === i) || null), e;
-    }
-    _getSwitchedCoachDeckIndexByKeyNavigation(e, t) {
-      return !this.currSelectedPlace || e === this.keyboardNavigationEvents.ArrowRight || e === this.keyboardNavigationEvents.ArrowLeft ? null : e === this.keyboardNavigationEvents.ArrowDown && this.currSelectedPlace.position.y + 2 === t.dimension.h && this.seatReservations[this.currSelectedDeckIndex + 1] ? this.currSelectedDeckIndex + 1 : e === this.keyboardNavigationEvents.ArrowUp && this.currSelectedPlace.position.y === 0 && this.seatReservations[this.currSelectedDeckIndex - 1] ? this.currSelectedDeckIndex - 1 : null;
-    }
-    /**
-     * To get the correct closest place of current pressed key and the current selected place,
-     * we have to investigate the coordinates of each place to find the closest place of the currSelectedPlaceElementId.
-     * @param pressedKey
-     * @returns Place or null
-     */
-    _getClosestPlaceByKeyDirection(e) {
-      const t = this.seatReservations[this.currSelectedDeckIndex].coachItems[this.currSelectedCoachIndex];
-      let s = null, i = t.places, a = null;
-      if (i)
-        if (this.currSelectedPlaceElementId) {
-          if (this.currSelectedPlace) {
-            const o = { ...this.currSelectedPlace.position };
-            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));
-            for (const c of i)
-              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);
-            a !== null && s && (this.currSelectedDeckIndex = a);
-          }
-        } else
-          return this._getFirstPlaceInSelectedCoach();
-      return s;
-    }
-    // Handling for Tab navigation if a place is selected inside the coach.
-    // This controls the focused coach from the current selected coach.
-    _navigateCoachNavigationByKeyboard(e) {
-      const t = this.focusedCoachIndex === -1 ? this.currSelectedCoachIndex === -1 ? 0 : this.currSelectedCoachIndex : this.focusedCoachIndex, s = e === "NEXT_TAB" ? this.getNextAvailableCoachIndex(t) : this.getPrevAvailableCoachIndex(t);
-      if (this.hasNavigation) {
-        const i = this._getPlaceHtmlElement(), a = i ? i.getAttribute("keyfocus") === "focus" : !1;
-        if (e === "PREV_TAB" && this.selectedCoachIndex === t)
-          if (a || this.currSelectedPlace !== null) {
-            this.focusedCoachIndex = t, this.unfocusPlaceElement();
-            return;
-          } else t === 0 ? this._refocusCurrentFocusedNavCoach(t) : this.focusedCoachIndex = s;
-        else s !== this.currSelectedCoachIndex ? this.focusedCoachIndex = s : e === "NEXT_TAB" && s === this.coachItemDetailsElements.length - 1 ? this._refocusCurrentFocusedNavCoach(t) : (this.focusedCoachIndex = -1, this.selectedCoachIndex = s, a ? this.focusPlaceElement(this.currSelectedPlace) : (this.isCoachGridFocusable = !0, this._setFocusToSelectedCoachGrid()));
-        this._scrollToSelectedNavigationButton(s);
-      } else
-        this.scrollToSelectedNavCoach(s);
-    }
-    // Refocused the current focused (visual) nav coach to get the native focus back to the navigation
-    _refocusCurrentFocusedNavCoach(e) {
-      this.focusedCoachIndex = -1, setTimeout(() => this.focusedCoachIndex = e, 0);
-    }
-    _navigateToPlaceByKeyboard(e) {
-      if (this.isKeyboardNavigation = !0, this.focusedCoachIndex !== -1 && (this.focusedCoachIndex = -1), !this.preventPlaceClick) {
-        const t = this._getClosestPlaceByKeyDirection(e);
-        if (t)
-          this.focusPlaceElement(t);
-        else if (e === this.keyboardNavigationEvents.ArrowRight || e === this.keyboardNavigationEvents.ArrowLeft || this.alignVertical && (e === this.keyboardNavigationEvents.ArrowUp || e === this.keyboardNavigationEvents.ArrowDown)) {
-          const s = e === this.keyboardNavigationEvents.ArrowRight ? this.getNextAvailableCoachIndex() : this.getPrevAvailableCoachIndex();
-          this.scrollToSelectedNavCoach(s);
-        }
-      }
-    }
-    getNextAvailableCoachIndex(e) {
-      const t = e ?? this.currSelectedCoachIndex;
-      return t < this.seatReservations[this.currSelectedDeckIndex].coachItems.length - 1 ? t + 1 : t;
-    }
-    getPrevAvailableCoachIndex(e) {
-      const t = e ?? this.currSelectedCoachIndex;
-      return t > 0 ? t - 1 : t;
-    }
-    updateSelectedSeatReservationPlaces(e) {
-      const t = e.placeType === "SEAT" ? "seats" : "bicycles", s = e.placeType === "SEAT" ? this.maxSeatReservations : this.maxBicycleReservations, i = this.selectedSeatReservationPlaces[t];
-      this.selectedSeatReservationPlaces[t] = this._updateSelectedSeatReservationPlaces(i, s, e), this.dispatchEvent(new CustomEvent("selectedplaces", {
-        bubbles: !0,
-        composed: !0,
-        detail: this.selectedSeatReservationPlaces
-      }));
-    }
-    _updateSelectedSeatReservationPlaces(e, t, s) {
-      if (s.state === "SELECTED") {
-        const i = this._getDeckIndexByPlaceId(s.id), a = this._getSeatReservationPlaceSelection(s, i);
-        a && e.push(a);
-      } else
-        e = e.filter((i) => i.id !== s.id);
-      if (t > -1 && e.length > t) {
-        const i = t > 0 ? s : void 0;
-        e = this._resetAllPlaceSelections(e, i);
-      }
-      return e;
-    }
-    updateCurrentSelectedPlaceInCoach(e) {
-      const t = this._getDeckIndexByPlaceId(e.id), s = e.coachIndex;
-      if (t === null)
-        return;
-      const i = this.seatReservations[t].coachItems[s].places?.find((o) => o.number == e.number);
-      if (!i)
-        return;
-      this.currSelectedDeckIndex = t, this.currSelectedCoachIndex = s, this.currSelectedPlace = i, this.currSelectedCoachIndex !== this.selectedCoachIndex && this.updateCurrentSelectedCoach(), this._setCurrSelectedPlaceElementId(i);
-      const a = setTimeout(() => {
-        this._scrollPlaceIntoNearestViewport(e.id), clearTimeout(a);
-      }, 0);
-    }
-    updateCurrentSelectedCoach() {
-      if (this.currSelectedCoachIndex == this.selectedCoachIndex)
-        return;
-      this.focusedCoachIndex != -1 && (this.focusedCoachIndex = this.currSelectedCoachIndex), this.selectedCoachIndex = this.currSelectedCoachIndex;
-      const e = this._getSeatReservationSelectedCoach(this.selectedCoachIndex);
-      e && this.dispatchEvent(new CustomEvent("selectedcoach", {
-        bubbles: !0,
-        composed: !0,
-        detail: e
-      }));
-    }
-    getPlaceElementId(e, t, s) {
-      return "seat-reservation__place-button-" + e + "-" + t + "-" + s;
-    }
-    /**
-     * In the case of coach layouts with different decks,
-     * it is necessary to extend the offset with empty coaches
-     * in order to create a stable vehicle layout.
-     *
-     *             [ooo]-[ooo]-[ooo]
-     * [ooo]-[ooo]-[ooo]-[ooo]-[ooo]
-     */
-    _initEmptyCoachDeckOffsets() {
-      const e = Array(this.seatReservations.length - 1).fill(0);
-      this.seatReservations[this.seatReservations.length - 1].coachItems.forEach((s) => {
-        for (let i = 0; i < this.seatReservations.length - 1; i++) {
-          const a = this.seatReservations[i].coachItems[e[i]];
-          if (s.id != a?.id) {
-            const o = {
-              ...s,
-              places: void 0,
-              propertyIds: void 0,
-              graphicElements: void 0,
-              serviceElements: void 0,
-              travelClass: []
-            };
-            this.seatReservations[i].coachItems.splice(e[i], 0, o);
-          }
-          e[i]++;
-        }
-      });
-    }
-    /**
-     * Initialization of SeatReservationPlaceSelection Array based on the transferred places
-     * that have the state SELECTED within the seatReservation object
-     */
-    _initSeatReservationPlaceSelection() {
-      this.selectedSeatReservationPlaces.seats = [], this.selectedSeatReservationPlaces.bicycles = [], this.seatReservations?.forEach((e, t) => e.coachItems.map((s, i) => {
-        s.places?.filter((a) => a.state === "SELECTED")?.forEach((a) => {
-          const o = this.getPlaceElementId(t, i, a.number), c = ke(a, o, e.deckCoachIndex, i), w = this._getSeatReservationPlaceSelection(c, t);
-          w && (w.placeType === "SEAT" ? this.selectedSeatReservationPlaces.seats.push(w) : this.selectedSeatReservationPlaces.bicycles.push(w));
-        });
-      }));
-    }
-    /**
-     * All selected places will be reset or the currentSelectedPlace was given, then we reset all except currentSelectedPlace
-     * @param reservationPlaceSelections
-     * @param currSelectedPlace
-     */
-    _resetAllPlaceSelections(e, t) {
-      for (const s of e)
-        if (!t || t.id !== s.id) {
-          const i = this.shadowRoot?.getElementById(s.id);
-          i && i.setAttribute("state", "FREE");
-        }
-      return t ? e = e.filter((s) => s.id === t.id) : e = [], e;
-    }
-    _getSeatReservationPlaceSelection(e, t) {
-      if (t === null)
-        return null;
-      const s = this.seatReservations[t].coachItems[e.coachIndex], i = s.places?.find((a) => a.number === e.number);
-      return i ? De(i, s, e.id, e.deckIndex, e.coachIndex) : null;
-    }
-    _getSeatReservationSelectedCoach(e) {
-      if (!this.seatReservations[this.currSelectedDeckIndex].coachItems[e])
-        return null;
-      const t = this.seatReservations[this.currSelectedDeckIndex].coachItems[e], s = this.getAvailableFreePlacesNumFromCoach(t.places);
-      return Te(e, t, s);
-    }
-    _setCurrSelectedPlaceElementId(e) {
-      this.currSelectedPlaceElementId = e ? this.getPlaceElementId(this.currSelectedDeckIndex, this.currSelectedCoachIndex, e.number) : null;
-    }
-    /**
-     * Preparation of the used documents font-size which needs
-     * to be determined in order to correctly calculate CSS values with rem
-     * */
-    _determineBaseFontSize() {
-      if (!Re) {
-        const t = 1 / parseInt(window.getComputedStyle(document.body).fontSize, 10);
-        this.style?.setProperty("--sbb-seat-reservation-one-px-rem", `${t + "rem"}`);
-      }
-    }
-    /**
-     * Prepares data for displaying navigation area.
-     * Calculates the values which are not going to change during use of a component:
-     *    - coach id
-     *    - list of service icons
-     *    - class (first, second, any)
-     *    - whether there is a driver area left or right
-     * */
-    _prepareCoachItemDetailsData() {
-      if (this.seatReservations) {
-        const e = this.seatReservations[this.seatReservations.length - 1].coachItems;
-        this.coachItemDetailsElements = [], e.forEach((t, s) => {
-          const i = [], a = [], o = [];
-          this.seatReservations.map((c) => c.coachItems[s]).forEach((c) => {
-            i.push(...c.travelClass), a.push(...c.propertyIds ? c.propertyIds : []), o.push(...c.places ? c.places : []);
-          }), this.coachItemDetailsElements.push({
-            id: t.id,
-            travelClass: this._prepareTravelClassNavigation(i),
-            propertyIds: this._prepareServiceIconsNavigation(a),
-            isDriverArea: t.places ? t.places.length === 0 : !0,
-            driverAreaSide: this._prepareDriverAreaSideNavigation(t),
-            freePlaces: this.getAvailableFreePlacesNumFromCoach(o),
-            driverAreaElements: this._setDriverAreasElements(t)
-          });
-        });
-      }
-    }
-    _prepareTravelClassNavigation(e) {
-      return e.indexOf("FIRST") !== -1 ? "FIRST" : e.indexOf("SECOND") !== -1 ? "SECOND" : "ANY_CLASS";
-    }
-    _prepareDriverAreaSideNavigation(e) {
-      const t = e.graphicElements?.filter((s) => s.icon === "DRIVER_AREA");
-      if (t && t.length > 0) {
-        const s = t.find((a) => a.position.x === 0) || !1, i = t.find((a) => a.position.x > 0) || !1;
-        return {
-          left: !!s,
-          right: !!i
-        };
-      }
-    }
-    _prepareCoachWidthAndGapCalculations() {
-      this.seatReservations && this.seatReservations[this.seatReservations.length - 1]?.coachItems?.forEach((t) => {
-        const s = this._isOverhangingElementsPresent(t.dimension.w, t.places), i = t.graphicElements?.filter((o) => o.icon && !this.notAreaElements.includes(o.icon)), a = this._isOverhangingElementsPresent(t.dimension.w, i);
-        this.overHangingElementInformation.push({
-          coachId: t.id,
-          overhangingPlaces: s,
-          overhangingGraphicAreas: a
-        });
-      });
-    }
-    /**
-     * Returns the current selected place HTML element by currSelectedPlaceElementId.
-     * @returns HTMLElement or null
-     */
-    _getPlaceHtmlElement() {
-      return this.currSelectedPlaceElementId && this.shadowRoot?.getElementById(this.currSelectedPlaceElementId) || null;
-    }
-    /**
-     * Returns the extracted coach deck index from place id
-     * @returns number
-     */
-    _getDeckIndexByPlaceId(e) {
-      const t = this.shadowRoot?.querySelector("#" + e)?.getAttribute("data-deck-index");
-      return t && !isNaN(+t) ? +t : null;
-    }
-    _isValidCoachIndex(e) {
-      return e >= 0 && e <= this.seatReservations[this.seatReservations.length - 1].coachItems.length;
-    }
-    /**
-     * Returns existing coach deck index depending on the selected coach.
-     * This method is necessary to get an available coach deck index during keyboard navigation, which can vary between coaches with different decks.
-     * For example, when navigating from a coach with two decks to a coach with one deck.
-     *
-     *       [ooo]-[ooo]-[ooo]
-     * [ooo]-[ooo]-[ooo]-[ooo]-[ooo]
-     *
-     * @returns number
-     */
-    _getExistingCoachDeckIndex() {
-      if (this.seatReservations[this.currSelectedDeckIndex].coachItems[this.currSelectedCoachIndex].places !== void 0)
-        return this.currSelectedDeckIndex;
-      const e = this.seatReservations.findIndex((t) => t.coachItems[this.currSelectedCoachIndex].places !== void 0);
-      return this.currSelectedDeckIndex >= e ? this.currSelectedDeckIndex : e;
-    }
-    /**
-     * If a selected place is slightly hidden by the overflow scroll content and is still clicked,
-     * the method tries to scroll the selected place into the nearest viewport, so that it is completely visible.
-     *
-     * @param placeId
-     */
-    _scrollPlaceIntoNearestViewport(e) {
-      this.shadowRoot?.getElementById(e)?.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
-    }
-    /**
-     * checks if any places or graphical elements (e.g. toilet area, etc.) are overhanging the coach borders
-     * @param coachItemWidth
-     * @param elements
-     */
-    _isOverhangingElementsPresent(e, t) {
-      return t?.some((s) => s.position.x === 0 || s.position.x + s.dimension.w >= e) ?? !1;
-    }
-    /**
-     * collect information about the driverAreas for one coach
-     * @param coachItem
-     * @private
-     */
-    _setDriverAreasElements(e) {
-      if (e) {
-        const t = e.graphicElements?.find((i) => i.icon === "DRIVER_AREA"), s = e.type === "LOCOMOTIVE_COACH" ? e.graphicElements?.find((i) => i.icon === "DRIVER_AREA_NO_VERTICAL_WALL") : void 0;
-        return {
-          driverArea: t,
-          driverAreaNoVerticalWall: s
-        };
-      }
-      return {
-        driverArea: void 0,
-        driverAreaNoVerticalWall: void 0
-      };
-    }
-    /**
-     * Is called when the SeatReservation loses focus, what happens when the user tabs out or clicks somewhere else.
-     * Then we reset the focused elements.
-     */
-    _onLeaveSeatReservationComponent() {
-      this.hasNavigation && (this.focusedCoachIndex = -1), this.unfocusPlaceElement();
-    }
-  }, x = new WeakMap(), p = new WeakMap(), _ = new WeakMap(), m = new WeakMap(), y = new WeakMap(), b = new WeakMap(), P = new WeakMap(), A = new WeakMap(), E = new WeakMap(), R = new WeakMap(), N = new WeakMap(), k = new WeakMap(), D = new WeakMap(), T = new WeakMap(), (() => {
-    const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(h[Symbol.metadata] ?? null) : void 0;
-    f = [C({ attribute: "seat-reservations", type: Array })], V = [C({ attribute: "travel-direction", type: String })], L = [S(), C({ attribute: "has-navigation", type: Boolean })], M = [S(), C({ attribute: "align-vertical", type: Boolean, reflect: !0, useDefault: !0 })], U = [S(), C({ attribute: "base-grid-size", type: Number })], j = [S(), C({ attribute: "height", type: Number })], Q = [S(), C({ attribute: "max-seat-reservations", type: Number })], te = [S(), C({ attribute: "max-bicycle-reservations", type: Number })], ae = [S(), C({ attribute: "prevent-place-click", type: Boolean })], re = [S(), C({ attribute: "preselect-coach-index", type: Number })], he = [S(), C({ attribute: "show-title-info", type: Boolean })], ge = [z()], Ce = [z()], xe = [z()], me = [Ne({ passive: !0 })], v(l, null, f, { kind: "accessor", name: "seatReservations", static: !1, private: !1, access: { has: (t) => "seatReservations" in t, get: (t) => t.seatReservations, set: (t, s) => {
-      t.seatReservations = s;
-    } }, metadata: e }, B, O), v(l, null, V, { kind: "accessor", name: "travelDirection", static: !1, private: !1, access: { has: (t) => "travelDirection" in t, get: (t) => t.travelDirection, set: (t, s) => {
-      t.travelDirection = s;
-    } }, metadata: e }, F, G), v(l, null, L, { kind: "accessor", name: "hasNavigation", static: !1, private: !1, access: { has: (t) => "hasNavigation" in t, get: (t) => t.hasNavigation, set: (t, s) => {
-      t.hasNavigation = s;
-    } }, metadata: e }, W, H), v(l, null, M, { kind: "accessor", name: "alignVertical", static: !1, private: !1, access: { has: (t) => "alignVertical" in t, get: (t) => t.alignVertical, set: (t, s) => {
-      t.alignVertical = s;
-    } }, metadata: e }, K, X), v(l, null, U, { kind: "accessor", name: "baseGridSize", static: !1, private: !1, access: { has: (t) => "baseGridSize" in t, get: (t) => t.baseGridSize, set: (t, s) => {
-      t.baseGridSize = s;
-    } }, metadata: e }, q, $), v(l, null, j, { kind: "accessor", name: "height", static: !1, private: !1, access: { has: (t) => "height" in t, get: (t) => t.height, set: (t, s) => {
-      t.height = s;
-    } }, metadata: e }, Y, J), v(l, null, Q, { kind: "accessor", name: "maxSeatReservations", static: !1, private: !1, access: { has: (t) => "maxSeatReservations" in t, get: (t) => t.maxSeatReservations, set: (t, s) => {
-      t.maxSeatReservations = s;
-    } }, metadata: e }, Z, ee), v(l, null, te, { kind: "accessor", name: "maxBicycleReservations", static: !1, private: !1, access: { has: (t) => "maxBicycleReservations" in t, get: (t) => t.maxBicycleReservations, set: (t, s) => {
-      t.maxBicycleReservations = s;
-    } }, metadata: e }, se, ie), v(l, null, ae, { kind: "accessor", name: "preventPlaceClick", static: !1, private: !1, access: { has: (t) => "preventPlaceClick" in t, get: (t) => t.preventPlaceClick, set: (t, s) => {
-      t.preventPlaceClick = s;
-    } }, metadata: e }, ce, oe), v(l, null, re, { kind: "accessor", name: "preselectCoachIndex", static: !1, private: !1, access: { has: (t) => "preselectCoachIndex" in t, get: (t) => t.preselectCoachIndex, set: (t, s) => {
-      t.preselectCoachIndex = s;
-    } }, metadata: e }, ne, le), v(l, null, he, { kind: "accessor", name: "showTitleInfo", static: !1, private: !1, access: { has: (t) => "showTitleInfo" in t, get: (t) => t.showTitleInfo, set: (t, s) => {
-      t.showTitleInfo = s;
-    } }, metadata: e }, de, ue), v(l, null, ge, { kind: "accessor", name: "selectedCoachIndex", static: !1, private: !1, access: { has: (t) => "selectedCoachIndex" in t, get: (t) => t.selectedCoachIndex, set: (t, s) => {
-      t.selectedCoachIndex = s;
-    } }, metadata: e }, ve, fe), v(l, null, Ce, { kind: "accessor", name: "focusedCoachIndex", static: !1, private: !1, access: { has: (t) => "focusedCoachIndex" in t, get: (t) => t.focusedCoachIndex, set: (t, s) => {
-      t.focusedCoachIndex = s;
-    } }, metadata: e }, Se, Ie), v(l, null, xe, { kind: "accessor", name: "hoveredCoachIndex", static: !1, private: !1, access: { has: (t) => "hoveredCoachIndex" in t, get: (t) => t.hoveredCoachIndex, set: (t, s) => {
-      t.hoveredCoachIndex = s;
-    } }, metadata: e }, pe, _e), v(l, null, me, { 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(l, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
-  })(), l.events = {
-    selectedplaces: "selectedplaces",
-    selectedcoach: "selectedcoach"
-  }, l;
+import { __esDecorate as e, __runInitializers as t } from "tslib";
+import { SbbElement as n } from "@sbb-esta/lyne-elements/core/base-elements.js";
+import { forceType as r } from "@sbb-esta/lyne-elements/core/decorators.js";
+import { isServer as i } from "lit";
+import { isArrowKeyOrPageKeysPressed as a } from "@sbb-esta/lyne-elements/core/a11y.js";
+import { eventOptions as ee, property as o, state as s } from "lit/decorators.js";
+import { mapCoachInfosToCoachSelection as te, mapIconToSvg as c, mapPlaceAndCoachToSeatReservationPlaceSelection as ne, mapPlaceInfosToPlaceSelection as re } from "../common/mapper.js";
+//#region src/elements-experimental/seat-reservation/seat-reservation/seat-reservation-base-element.ts
+var l;
+(function(e) {
+	e.right = "right", e.left = "left";
+})(l ||= {});
+var ie = 3, ae = [
+	"sa-vo",
+	"sa-rs",
+	"sa-abteilkinderwagen",
+	"sa-wr",
+	"sa-fa",
+	"sa-bz",
+	"sa-rz"
+], u = (() => {
+	let u = n, d = [], f, p = [], m = [], h, g = [], _ = [], v, y = [], b = [], x, S = [], C = [], w, T = [], E = [], D, O = [], oe = [], k, A = [], j = [], M, N = [], P = [], F, I = [], L = [], R, z = [], B = [], V, H = [], U = [], W, G = [], K = [], q, J = [], Y = [], X, Z = [], Q = [], $;
+	return class extends u {
+		static {
+			let t = typeof Symbol == "function" && Symbol.metadata ? Object.create(u[Symbol.metadata] ?? null) : void 0;
+			f = [o({
+				attribute: "seat-reservations",
+				type: Array
+			})], h = [o({
+				attribute: "travel-direction",
+				type: String
+			})], v = [r(), o({
+				attribute: "has-navigation",
+				type: Boolean
+			})], x = [r(), o({
+				attribute: "align-vertical",
+				type: Boolean,
+				reflect: !0,
+				useDefault: !0
+			})], w = [r(), o({
+				attribute: "base-grid-size",
+				type: Number
+			})], D = [r(), o({
+				attribute: "height",
+				type: Number
+			})], k = [r(), o({
+				attribute: "max-seat-reservations",
+				type: Number
+			})], M = [r(), o({
+				attribute: "max-bicycle-reservations",
+				type: Number
+			})], F = [r(), o({
+				attribute: "prevent-place-click",
+				type: Boolean
+			})], R = [r(), o({
+				attribute: "preselect-coach-index",
+				type: Number
+			})], V = [r(), o({
+				attribute: "show-title-info",
+				type: Boolean
+			})], W = [s()], q = [s()], X = [s()], $ = [ee({ passive: !0 })], e(this, null, f, {
+				kind: "accessor",
+				name: "seatReservations",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "seatReservations" in e,
+					get: (e) => e.seatReservations,
+					set: (e, t) => {
+						e.seatReservations = t;
+					}
+				},
+				metadata: t
+			}, p, m), e(this, null, h, {
+				kind: "accessor",
+				name: "travelDirection",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "travelDirection" in e,
+					get: (e) => e.travelDirection,
+					set: (e, t) => {
+						e.travelDirection = t;
+					}
+				},
+				metadata: t
+			}, g, _), e(this, null, v, {
+				kind: "accessor",
+				name: "hasNavigation",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "hasNavigation" in e,
+					get: (e) => e.hasNavigation,
+					set: (e, t) => {
+						e.hasNavigation = t;
+					}
+				},
+				metadata: t
+			}, y, b), e(this, null, x, {
+				kind: "accessor",
+				name: "alignVertical",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "alignVertical" in e,
+					get: (e) => e.alignVertical,
+					set: (e, t) => {
+						e.alignVertical = t;
+					}
+				},
+				metadata: t
+			}, S, C), e(this, null, w, {
+				kind: "accessor",
+				name: "baseGridSize",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "baseGridSize" in e,
+					get: (e) => e.baseGridSize,
+					set: (e, t) => {
+						e.baseGridSize = t;
+					}
+				},
+				metadata: t
+			}, T, E), e(this, null, D, {
+				kind: "accessor",
+				name: "height",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "height" in e,
+					get: (e) => e.height,
+					set: (e, t) => {
+						e.height = t;
+					}
+				},
+				metadata: t
+			}, O, oe), e(this, null, k, {
+				kind: "accessor",
+				name: "maxSeatReservations",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "maxSeatReservations" in e,
+					get: (e) => e.maxSeatReservations,
+					set: (e, t) => {
+						e.maxSeatReservations = t;
+					}
+				},
+				metadata: t
+			}, A, j), e(this, null, M, {
+				kind: "accessor",
+				name: "maxBicycleReservations",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "maxBicycleReservations" in e,
+					get: (e) => e.maxBicycleReservations,
+					set: (e, t) => {
+						e.maxBicycleReservations = t;
+					}
+				},
+				metadata: t
+			}, N, P), e(this, null, F, {
+				kind: "accessor",
+				name: "preventPlaceClick",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "preventPlaceClick" in e,
+					get: (e) => e.preventPlaceClick,
+					set: (e, t) => {
+						e.preventPlaceClick = t;
+					}
+				},
+				metadata: t
+			}, I, L), e(this, null, R, {
+				kind: "accessor",
+				name: "preselectCoachIndex",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "preselectCoachIndex" in e,
+					get: (e) => e.preselectCoachIndex,
+					set: (e, t) => {
+						e.preselectCoachIndex = t;
+					}
+				},
+				metadata: t
+			}, z, B), e(this, null, V, {
+				kind: "accessor",
+				name: "showTitleInfo",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "showTitleInfo" in e,
+					get: (e) => e.showTitleInfo,
+					set: (e, t) => {
+						e.showTitleInfo = t;
+					}
+				},
+				metadata: t
+			}, H, U), e(this, null, W, {
+				kind: "accessor",
+				name: "selectedCoachIndex",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "selectedCoachIndex" in e,
+					get: (e) => e.selectedCoachIndex,
+					set: (e, t) => {
+						e.selectedCoachIndex = t;
+					}
+				},
+				metadata: t
+			}, G, K), e(this, null, q, {
+				kind: "accessor",
+				name: "focusedCoachIndex",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "focusedCoachIndex" in e,
+					get: (e) => e.focusedCoachIndex,
+					set: (e, t) => {
+						e.focusedCoachIndex = t;
+					}
+				},
+				metadata: t
+			}, J, Y), e(this, null, X, {
+				kind: "accessor",
+				name: "hoveredCoachIndex",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "hoveredCoachIndex" in e,
+					get: (e) => e.hoveredCoachIndex,
+					set: (e, t) => {
+						e.hoveredCoachIndex = t;
+					}
+				},
+				metadata: t
+			}, Z, Q), e(this, null, $, {
+				kind: "method",
+				name: "coachAreaScrollend",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "coachAreaScrollend" in e,
+					get: (e) => e.coachAreaScrollend
+				},
+				metadata: t
+			}, null, d), t && Object.defineProperty(this, Symbol.metadata, {
+				enumerable: !0,
+				configurable: !0,
+				writable: !0,
+				value: t
+			});
+		}
+		static {
+			this.events = {
+				selectedplaces: "selectedplaces",
+				selectedcoach: "selectedcoach"
+			};
+		}
+		#e;
+		get seatReservations() {
+			return this.#e;
+		}
+		set seatReservations(e) {
+			this.#e = e;
+		}
+		#t;
+		get travelDirection() {
+			return this.#t;
+		}
+		set travelDirection(e) {
+			this.#t = e;
+		}
+		#n;
+		get hasNavigation() {
+			return this.#n;
+		}
+		set hasNavigation(e) {
+			this.#n = e;
+		}
+		#r;
+		get alignVertical() {
+			return this.#r;
+		}
+		set alignVertical(e) {
+			this.#r = e;
+		}
+		#i;
+		get baseGridSize() {
+			return this.#i;
+		}
+		set baseGridSize(e) {
+			this.#i = e;
+		}
+		#a;
+		get height() {
+			return this.#a;
+		}
+		set height(e) {
+			this.#a = e;
+		}
+		#o;
+		get maxSeatReservations() {
+			return this.#o;
+		}
+		set maxSeatReservations(e) {
+			this.#o = e;
+		}
+		#s;
+		get maxBicycleReservations() {
+			return this.#s;
+		}
+		set maxBicycleReservations(e) {
+			this.#s = e;
+		}
+		#c;
+		get preventPlaceClick() {
+			return this.#c;
+		}
+		set preventPlaceClick(e) {
+			this.#c = e;
+		}
+		#l;
+		get preselectCoachIndex() {
+			return this.#l;
+		}
+		set preselectCoachIndex(e) {
+			this.#l = e;
+		}
+		#u;
+		get showTitleInfo() {
+			return this.#u;
+		}
+		set showTitleInfo(e) {
+			this.#u = e;
+		}
+		#d;
+		get selectedCoachIndex() {
+			return this.#d;
+		}
+		set selectedCoachIndex(e) {
+			this.#d = e;
+		}
+		#f;
+		get focusedCoachIndex() {
+			return this.#f;
+		}
+		set focusedCoachIndex(e) {
+			this.#f = e;
+		}
+		#p;
+		get hoveredCoachIndex() {
+			return this.#p;
+		}
+		set hoveredCoachIndex(e) {
+			this.#p = e;
+		}
+		constructor() {
+			super(), this.#e = (t(this, d), t(this, p, null)), this.#t = (t(this, m), t(this, g, "NONE")), this.#n = (t(this, _), t(this, y, !0)), this.#r = (t(this, b), t(this, S, !1)), this.#i = (t(this, C), t(this, T, 16)), this.#a = (t(this, E), t(this, O, null)), this.#o = (t(this, oe), t(this, A, -1)), this.#s = (t(this, j), t(this, N, -1)), this.#c = (t(this, P), t(this, I, !1)), this.#l = (t(this, L), t(this, z, -1)), this.#u = (t(this, B), t(this, H, !1)), this.#d = (t(this, U), t(this, G, -1)), this.#f = (t(this, K), t(this, J, -1)), this.#p = (t(this, Y), t(this, Z, -1)), this.coachBorderPadding = (t(this, Q), 6), this.gapBetweenCoaches = 4, this.coachBorderOffset = this.coachBorderPadding / this.baseGridSize, this.gapBetweenCoachDecks = 48, this.coachNavButtonDim = 0, this.coachItemDetailsElements = [], this.currScrollDirection = l.right, this.maxCalcCoachesWidth = 0, this.scrollCoachesAreaWidth = 0, this.scrollNavigationAreaDim = 0, this.triggerCoachPositionsCollection = [], this.navigationScrollArea = null, this.coachScrollArea = null, this.currSelectedPlace = null, this.currSelectedPlaceElementId = null, this.currSelectedCoachIndex = -1, this.currSelectedDeckIndex = 0, this.preventCoachScrollByPlaceClick = !1, this.selectedSeatReservationPlaces = {
+				seats: [],
+				bicycles: []
+			}, this.seatReservationWithoutNavigationHasFocus = !1, this.isCoachGridFocusable = !1, this.isAutoScrolling = !1, this.isKeyboardNavigation = !1, this.hasMultipleDecks = !1, this.hasSeatReservationNativeFocus = !1, this.keyboardNavigationEvents = {
+				ArrowLeft: "ArrowLeft",
+				ArrowRight: "ArrowRight",
+				ArrowUp: "ArrowUp",
+				ArrowDown: "ArrowDown",
+				Tab: "Tab",
+				Enter: "Enter"
+			}, this.notAreaElements = [
+				"DRIVER_AREA",
+				"DRIVER_AREA_NO_VERTICAL_WALL",
+				"COACH_PASSAGE",
+				"COACH_WALL_NO_PASSAGE",
+				"COMPARTMENT_PASSAGE",
+				"COMPARTMENT_PASSAGE_HIGH",
+				"COMPARTMENT_PASSAGE_MIDDLE",
+				"COMPARTMENT_PASSAGE_LOW"
+			], this.overHangingElementInformation = [], this._isRunningInitPreselectCoachIndex = !1, this._lastStartScrollPos = -1, this._prepareServiceIconsNavigation = (e) => e && e?.map(function(e) {
+				return {
+					pId: e,
+					svgName: c[e]?.svgName ? c[e]?.svgName : ""
+				};
+			}).filter((e) => ae.indexOf(e.svgName) !== -1).filter((e, t, n) => n.map((e) => e.svgName).indexOf(e.svgName) === t).map((e) => e.pId).slice(0, ie) || [], this.addEventListener("blur", () => this._onLeaveSeatReservationComponent());
+		}
+		willUpdate(e) {
+			if (super.willUpdate(e), e.has("seatReservations") && (this.hasMultipleDecks = this.seatReservations?.length > 1, this._initPrepareSeatReservationData(), this._prepareCoachWidthAndGapCalculations(), 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) {
+				let e = this.seatReservations[this.currSelectedDeckIndex] || null;
+				e?.coachItems.length && (this.baseGridSize = this.height / e.coachItems[0].dimension.h, this.coachBorderOffset = this.coachBorderPadding / this.baseGridSize, this.style?.setProperty("--sbb-seat-reservation-grid-size", `${this.baseGridSize}px`), this.initNavigationSelectionByScrollEvent());
+			}
+			e.has("alignVertical") && this.alignVertical && this.initNavigationSelectionByScrollEvent(), e.has("preselectCoachIndex") && (this._isRunningInitPreselectCoachIndex = !0, setTimeout(() => this.scrollToSelectedNavCoach(this.preselectCoachIndex), 1));
+		}
+		navigateByDirectionBtn(e) {
+			this.unfocusPlaceElement();
+			let t = this.currSelectedCoachIndex;
+			e == "DIRECTION_LEFT" && t > 0 ? t = this.currSelectedCoachIndex == -1 ? 0 : this.currSelectedCoachIndex - 1 : e == "DIRECTION_RIGHT" && t < this.seatReservations[this.currSelectedDeckIndex]?.coachItems.length - 1 && (t = this.currSelectedCoachIndex == -1 ? 0 : this.currSelectedCoachIndex + 1), this.scrollToSelectedNavCoach(t);
+		}
+		_initPrepareSeatReservationData() {
+			this._determineBaseFontSize(), this.hasMultipleDecks && this._initEmptyCoachDeckOffsets(), this._prepareCoachItemDetailsData();
+		}
+		initNavigationSelectionByScrollEvent() {
+			this.coachScrollArea = this.shadowRoot?.querySelector("#sbb-sr__wrapper-scrollarea"), this.navigationScrollArea = this.shadowRoot?.querySelector("#sbb-sr__navigation-list-coaches");
+			let e = this.seatReservations ? this.seatReservations[this.currSelectedDeckIndex] : null;
+			if (e && e.coachItems.length > 0) {
+				let t = e.coachItems[0].dimension.h * this.baseGridSize + this.coachBorderPadding, n = (this.seatReservations.length - 1) * this.gapBetweenCoachDecks;
+				this.style?.setProperty("--sbb-seat-reservation-height", `${t * this.seatReservations.length + n}`), this.style?.setProperty("--sbb-seat-reservation-decks", `${this.seatReservations.length}`);
+			}
+			if (this.navigationScrollArea) {
+				this.scrollNavigationAreaDim = this.alignVertical ? this.navigationScrollArea.getBoundingClientRect().height : this.navigationScrollArea.getBoundingClientRect().width;
+				let e = this.navigationScrollArea.querySelector("ul > li");
+				if (e) {
+					let t = e?.getBoundingClientRect();
+					this.coachNavButtonDim = this.alignVertical ? t.height : t.width;
+				}
+			}
+			if (this.coachScrollArea && e) {
+				let t = 0;
+				this.scrollCoachesAreaWidth = this.alignVertical ? this.coachScrollArea.getBoundingClientRect().height : this.coachScrollArea.getBoundingClientRect().width, this.triggerCoachPositionsCollection = e.coachItems.map((e) => {
+					let n = t, r = this.getCalculatedDimension(e.dimension).w, i = this.overHangingElementInformation.find((t) => t.coachId === e.id), a = i?.overhangingPlaces || i?.overhangingGraphicAreas;
+					return t += r + (a ? 2 * this.gapBetweenCoaches : this.gapBetweenCoaches), {
+						start: n,
+						end: t,
+						width: r
+					};
+				}), this.maxCalcCoachesWidth = t - this.gapBetweenCoaches;
+			}
+		}
+		coachAreaScrollend() {
+			this._scrollTimeout && clearTimeout(this._scrollTimeout), this._scrollTimeout = setTimeout(() => this._handleCoachAreaScrollendEvent(), 150);
+		}
+		onFocusTableCoachAndPreselectPlace(e) {
+			!this.seatReservationWithoutNavigationHasFocus && !this.hasNavigation && (this.seatReservationWithoutNavigationHasFocus = !0, this.currSelectedCoachIndex = e === 0 ? this.getNextAvailableCoachIndex(-1) : this.getPrevAvailableCoachIndex(e), this.preselectPlaceInCoach());
+		}
+		onFocusNavDirectionButton() {
+			this.focusedCoachIndex = -1;
+		}
+		onKeyNavigationNavCoachButton(e, t) {
+			if (e.key === this.keyboardNavigationEvents.Tab) {
+				this._handleTabKeyNavigation(e, "navigation", t);
+				return;
+			}
+			a(e) && this.keyboardSeatmapEventHandling(e);
+		}
+		_handleTabKeyNavigation(e, t, n) {
+			let r = e.key, i = e.shiftKey;
+			r === this.keyboardNavigationEvents.Tab && (t == "navigation" ? (n == this.currSelectedCoachIndex ? !this.currSelectedPlace || !i || this.coachItemDetailsElements[n].isDriverArea || this.focusedCoachIndex == -1 ? this.focusedCoachIndex = n : i && this.currSelectedPlace && (this.focusedCoachIndex = -1, this.focusPlaceElement(this.currSelectedPlace)) : this.focusedCoachIndex = n, this._scrollToSelectedNavigationButton(n)) : t == "seatmap" && (e.preventDefault(), i ? this._navigateCoachNavigationByKeyboard("PREV_TAB") : this._navigateCoachNavigationByKeyboard("NEXT_TAB")));
+		}
+		keyboardSeatmapEventHandling(e) {
+			let t = e.key === this.keyboardNavigationEvents.Tab, n = e.shiftKey && t;
+			if (!this.hasNavigation && this.currSelectedCoachIndex === 0 && n || this.currSelectedCoachIndex === this.coachItemDetailsElements.length - 1 && t) return;
+			let r = e.key;
+			if (this.preventCoachScrollByPlaceClick = !1, !this.hasSeatReservationNativeFocus && (t || n) && (this.hasSeatReservationNativeFocus = !0), t) {
+				this._handleTabKeyNavigation(e, "seatmap");
+				return;
+			}
+			if (this.currSelectedCoachIndex !== -1 && a(e)) switch (e.preventDefault(), r) {
+				case this.keyboardNavigationEvents.ArrowLeft:
+					{
+						let e = this.alignVertical ? this.keyboardNavigationEvents.ArrowDown : r;
+						this._navigateToPlaceByKeyboard(e);
+					}
+					break;
+				case this.keyboardNavigationEvents.ArrowRight:
+					{
+						let e = this.alignVertical ? this.keyboardNavigationEvents.ArrowUp : r;
+						this._navigateToPlaceByKeyboard(e);
+					}
+					break;
+				case this.keyboardNavigationEvents.ArrowUp:
+					{
+						let e = this.alignVertical ? this.keyboardNavigationEvents.ArrowLeft : r;
+						this._navigateToPlaceByKeyboard(e);
+					}
+					break;
+				case this.keyboardNavigationEvents.ArrowDown:
+					{
+						let e = this.alignVertical ? this.keyboardNavigationEvents.ArrowRight : r;
+						this._navigateToPlaceByKeyboard(e);
+					}
+					break;
+				default: break;
+			}
+		}
+		preselectPlaceInCoach() {
+			if (this.isAutoScrolling) {
+				if (this._isRunningInitPreselectCoachIndex) {
+					this._isRunningInitPreselectCoachIndex = !1;
+					return;
+				}
+				if (this.coachItemDetailsElements[this.currSelectedCoachIndex] && this.coachItemDetailsElements[this.currSelectedCoachIndex].isDriverArea) {
+					this._setFocusToSelectedCoachGrid();
+					return;
+				}
+				if (this.isKeyboardNavigation && this.isAutoScrolling) {
+					let e = this._getClosestPlaceByKeyDirection();
+					e ? (this.unfocusPlaceElement(), this.focusPlaceElement(e), this.focusedCoachIndex = -1) : this._setFocusToSelectedCoachGrid();
+				} else this.unfocusPlaceElement(), this.isCoachGridFocusable = !0, this._setFocusToSelectedCoachGrid();
+			}
+		}
+		scrollToSelectedNavCoach(e) {
+			if (this._isValidCoachIndex(e) && e !== this.currSelectedCoachIndex) {
+				this.hoveredCoachIndex = e, this.isAutoScrolling = !0, this.isCoachGridFocusable = !0, this.currSelectedCoachIndex = e, this.currSelectedDeckIndex = this._getExistingCoachDeckIndex(), this._setScrollDirectionByCoachIndex();
+				let t = this._getCoachScrollPositionX();
+				(this.selectedCoachIndex !== -1 || this.currSelectedCoachIndex > 0) && this._isScrollableToSelectedCoach() ? (this._lastStartScrollPos = this.coachScrollArea.scrollLeft, this.coachScrollArea.scrollTo({
+					top: this.alignVertical ? t : 0,
+					left: this.alignVertical ? 0 : t,
+					behavior: "smooth"
+				})) : this.updateCurrentSelectedCoach(), this._scrollToSelectedNavigationButton(e);
+			}
+		}
+		focusPlaceElement(e) {
+			if (this.unfocusPlaceElement(), e) {
+				this.currSelectedPlace = e, this._setCurrSelectedPlaceElementId(e);
+				let t = this._getPlaceHtmlElement();
+				if (t) {
+					t.setAttribute("keyfocus", "focus");
+					let n = setTimeout(() => {
+						let t = this.getPlaceElementId(this.currSelectedDeckIndex, this.currSelectedCoachIndex, e.number);
+						this._scrollPlaceIntoNearestViewport(t), clearTimeout(n);
+					}, 0);
+				}
+			}
+		}
+		unfocusPlaceElement() {
+			let e = this._getPlaceHtmlElement();
+			e && (e.setAttribute("keyfocus", "unfocus"), this._setCurrSelectedPlaceElementId(null), this.currSelectedPlace = null);
+		}
+		getCalculatedDimension(e, t, n, r) {
+			return t && !n && (e.h += this.coachBorderOffset * 2), r && (e.h += this.coachBorderOffset), {
+				w: this.baseGridSize * e.w,
+				h: this.baseGridSize * e.h
+			};
+		}
+		getCalculatedPosition(e, t, n, r) {
+			if (n && t) {
+				let i = r ? n.h : n.h + this.coachBorderOffset;
+				e.y === 0 ? e.y -= this.coachBorderOffset : e.y + t.h === i && (e.y += this.coachBorderOffset);
+			}
+			return {
+				x: this.baseGridSize * e.x,
+				y: this.baseGridSize * e.y,
+				z: e.z
+			};
+		}
+		isElementDirectlyOnBorder(e, t) {
+			return e.position.y === 0 || e.position.y + e.dimension.h === t.h;
+		}
+		getAvailableFreePlacesNumFromCoach(e) {
+			let t = {
+				seats: 0,
+				bicycles: 0
+			};
+			return e?.reduce((e, t) => (t.state === "FREE" && (t.type === "SEAT" ? e.seats++ : e.bicycles++), e), t) || t;
+		}
+		_handleCoachAreaScrollendEvent() {
+			let e = this.isAutoScrolling ? this.currSelectedCoachIndex : this._getCoachIndexByScrollTriggerPosition();
+			if (this.preventCoachScrollByPlaceClick) {
+				Math.abs(this._lastStartScrollPos - this.coachScrollArea.scrollLeft) > this.baseGridSize * 2 && (this.selectedCoachIndex = e), this.preventCoachScrollByPlaceClick = !1;
+				return;
+			}
+			this._lastStartScrollPos = this.coachScrollArea.scrollLeft, this.hoveredCoachIndex = -1, 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);
+		}
+		_scrollToSelectedNavigationButton(e) {
+			setTimeout(() => {
+				if (this.hasNavigation && this.navigationScrollArea) {
+					let t = this.scrollNavigationAreaDim / 2, n = e * this.coachNavButtonDim - t + this.coachNavButtonDim;
+					this.navigationScrollArea.scrollTo({
+						top: this.alignVertical ? n : 0,
+						left: this.alignVertical ? 0 : n,
+						behavior: "smooth"
+					});
+				}
+			}, 10);
+		}
+		_setScrollDirectionByCoachIndex() {
+			this.currScrollDirection = this.currSelectedCoachIndex > this.selectedCoachIndex ? l.right : l.left;
+		}
+		_getCoachScrollPositionX() {
+			let e = this.triggerCoachPositionsCollection[this.currSelectedCoachIndex];
+			return this.isKeyboardNavigation && this.currScrollDirection === l.left && e.width > this.scrollCoachesAreaWidth ? e.end - this.scrollCoachesAreaWidth : e.start;
+		}
+		_setFocusToSelectedCoachGrid() {
+			if (this.isCoachGridFocusable && this.hasSeatReservationNativeFocus) {
+				this.isCoachGridFocusable = !1;
+				let e = this.shadowRoot?.querySelector("#sbb-sr-coach-caption-" + this.currSelectedCoachIndex);
+				e && e.focus();
+			}
+		}
+		_isScrollableToSelectedCoach() {
+			let e = this.alignVertical ? this.coachScrollArea.scrollTop : this.coachScrollArea.scrollLeft, t = this.alignVertical ? this.coachScrollArea.getBoundingClientRect().height : this.coachScrollArea.getBoundingClientRect().width, n = this.maxCalcCoachesWidth - t, r = this.triggerCoachPositionsCollection[this.currSelectedCoachIndex], i = e === this.triggerCoachPositionsCollection[this.currSelectedCoachIndex].start;
+			return (e < n || e > r.start) && !i;
+		}
+		_getCoachIndexByScrollTriggerPosition() {
+			let e = (this.alignVertical ? this.coachScrollArea.scrollTop : this.coachScrollArea.scrollLeft) + this.scrollCoachesAreaWidth / 2;
+			return this.triggerCoachPositionsCollection.findIndex((t) => e >= t.start && e <= t.end);
+		}
+		_getFirstPlaceInSelectedCoach() {
+			let e = null, t = this.seatReservations[this.currSelectedDeckIndex].coachItems[this.currSelectedCoachIndex], n = "cell-" + this.currSelectedDeckIndex + "-" + this.currSelectedCoachIndex + "-0-0", r = this.shadowRoot?.querySelector("#" + n)?.querySelector("sbb-seat-reservation-place-control")?.getAttribute("text") || null;
+			return t && r && (e = t.places?.find((e) => e.number === r) || null), e;
+		}
+		_getSwitchedCoachDeckIndexByKeyNavigation(e, t) {
+			return !this.currSelectedPlace || e === this.keyboardNavigationEvents.ArrowRight || e === this.keyboardNavigationEvents.ArrowLeft ? null : e === this.keyboardNavigationEvents.ArrowDown && this.currSelectedPlace.position.y + 2 === t.dimension.h && this.seatReservations[this.currSelectedDeckIndex + 1] ? this.currSelectedDeckIndex + 1 : e === this.keyboardNavigationEvents.ArrowUp && this.currSelectedPlace.position.y === 0 && this.seatReservations[this.currSelectedDeckIndex - 1] ? this.currSelectedDeckIndex - 1 : null;
+		}
+		_getClosestPlaceByKeyDirection(e) {
+			let t = this.seatReservations[this.currSelectedDeckIndex].coachItems[this.currSelectedCoachIndex], n = null, r = t.places, i = null;
+			if (r) {
+				if (!this.currSelectedPlaceElementId) return this._getFirstPlaceInSelectedCoach();
+				if (this.currSelectedPlace) {
+					let a = { ...this.currSelectedPlace.position };
+					e && (i = this._getSwitchedCoachDeckIndexByKeyNavigation(e, t), i !== null && (r = this.seatReservations[i].coachItems[this.currSelectedCoachIndex].places || [], a.y = i < this.currSelectedDeckIndex ? t.dimension.h : -1));
+					for (let t of r) e ? t.number !== this.currSelectedPlace?.number && (e === this.keyboardNavigationEvents.ArrowRight && (t.position.y === a.y || t.position.y === a.y - 1) && t.position.x > a.x && (!n || t.position.x < n.position.x) || e === this.keyboardNavigationEvents.ArrowDown && (t.position.x === a.x || t.position.x === a.x + 1) && t.position.y > a.y && (!n || t.position.y < n.position.y) || e === this.keyboardNavigationEvents.ArrowLeft && (t.position.y === a.y || t.position.y === a.y + 1) && t.position.x < a.x && (!n || t.position.x > n.position.x) || e === this.keyboardNavigationEvents.ArrowUp && (t.position.x === a.x || t.position.x === a.x - 1) && t.position.y < a.y && (!n || t.position.y > n.position.y)) && (n = t) : (this.currScrollDirection === l.right && t.position.y === a.y && (!n || t.position.x < n.position.x) || this.currScrollDirection === l.left && t.position.y === a.y && (!n || t.position.x > n.position.x)) && (n = t);
+					i !== null && n && (this.currSelectedDeckIndex = i);
+				}
+			}
+			return n;
+		}
+		_navigateCoachNavigationByKeyboard(e) {
+			let t = this.focusedCoachIndex === -1 ? this.currSelectedCoachIndex === -1 ? 0 : this.currSelectedCoachIndex : this.focusedCoachIndex, n = e === "NEXT_TAB" ? this.getNextAvailableCoachIndex(t) : this.getPrevAvailableCoachIndex(t);
+			if (this.hasNavigation) {
+				let r = this._getPlaceHtmlElement(), i = r ? r.getAttribute("keyfocus") === "focus" : !1;
+				if (e === "PREV_TAB" && this.selectedCoachIndex === t) if (i || this.currSelectedPlace !== null) {
+					this.focusedCoachIndex = t, this.unfocusPlaceElement();
+					return;
+				} else t === 0 ? this._refocusCurrentFocusedNavCoach(t) : this.focusedCoachIndex = n;
+				else n === this.currSelectedCoachIndex ? e === "NEXT_TAB" && n === this.coachItemDetailsElements.length - 1 ? this._refocusCurrentFocusedNavCoach(t) : (this.focusedCoachIndex = -1, this.selectedCoachIndex = n, i ? this.focusPlaceElement(this.currSelectedPlace) : (this.isCoachGridFocusable = !0, this._setFocusToSelectedCoachGrid())) : this.focusedCoachIndex = n;
+				this._scrollToSelectedNavigationButton(n);
+			} else this.scrollToSelectedNavCoach(n);
+		}
+		_refocusCurrentFocusedNavCoach(e) {
+			this.focusedCoachIndex = -1, setTimeout(() => this.focusedCoachIndex = e, 0);
+		}
+		_navigateToPlaceByKeyboard(e) {
+			if (this.isKeyboardNavigation = !0, this.focusedCoachIndex !== -1 && (this.focusedCoachIndex = -1), !this.preventPlaceClick) {
+				let t = this._getClosestPlaceByKeyDirection(e);
+				if (t) this.focusPlaceElement(t);
+				else if (e === this.keyboardNavigationEvents.ArrowRight || e === this.keyboardNavigationEvents.ArrowLeft || this.alignVertical && (e === this.keyboardNavigationEvents.ArrowUp || e === this.keyboardNavigationEvents.ArrowDown)) {
+					let t = e === this.keyboardNavigationEvents.ArrowRight ? this.getNextAvailableCoachIndex() : this.getPrevAvailableCoachIndex();
+					this.scrollToSelectedNavCoach(t);
+				}
+			}
+		}
+		getNextAvailableCoachIndex(e) {
+			let t = e ?? this.currSelectedCoachIndex;
+			return t < this.seatReservations[this.currSelectedDeckIndex].coachItems.length - 1 ? t + 1 : t;
+		}
+		getPrevAvailableCoachIndex(e) {
+			let t = e ?? this.currSelectedCoachIndex;
+			return t > 0 ? t - 1 : t;
+		}
+		updateSelectedSeatReservationPlaces(e) {
+			let t = e.placeType === "SEAT" ? "seats" : "bicycles", n = e.placeType === "SEAT" ? this.maxSeatReservations : this.maxBicycleReservations, r = this.selectedSeatReservationPlaces[t];
+			this.selectedSeatReservationPlaces[t] = this._updateSelectedSeatReservationPlaces(r, n, e), this.dispatchEvent(new CustomEvent("selectedplaces", {
+				bubbles: !0,
+				composed: !0,
+				detail: this.selectedSeatReservationPlaces
+			}));
+		}
+		_updateSelectedSeatReservationPlaces(e, t, n) {
+			if (n.state === "SELECTED") {
+				let t = this._getDeckIndexByPlaceId(n.id), r = this._getSeatReservationPlaceSelection(n, t);
+				r && e.push(r);
+			} else e = e.filter((e) => e.id !== n.id);
+			if (t > -1 && e.length > t) {
+				let r = t > 0 ? n : void 0;
+				e = this._resetAllPlaceSelections(e, r);
+			}
+			return e;
+		}
+		updateCurrentSelectedPlaceInCoach(e) {
+			let t = this._getDeckIndexByPlaceId(e.id), n = e.coachIndex;
+			if (t === null) return;
+			let r = this.seatReservations[t].coachItems[n].places?.find((t) => t.number == e.number);
+			if (!r) return;
+			this.currSelectedDeckIndex = t, this.currSelectedCoachIndex = n, this.currSelectedPlace = r, this.currSelectedCoachIndex !== this.selectedCoachIndex && this.updateCurrentSelectedCoach(), this._setCurrSelectedPlaceElementId(r);
+			let i = setTimeout(() => {
+				this._scrollPlaceIntoNearestViewport(e.id), clearTimeout(i);
+			}, 0);
+		}
+		updateCurrentSelectedCoach() {
+			if (this.currSelectedCoachIndex == this.selectedCoachIndex) return;
+			this.focusedCoachIndex != -1 && (this.focusedCoachIndex = this.currSelectedCoachIndex), this.selectedCoachIndex = this.currSelectedCoachIndex;
+			let e = this._getSeatReservationSelectedCoach(this.selectedCoachIndex);
+			e && this.dispatchEvent(new CustomEvent("selectedcoach", {
+				bubbles: !0,
+				composed: !0,
+				detail: e
+			}));
+		}
+		getPlaceElementId(e, t, n) {
+			return "seat-reservation__place-button-" + e + "-" + t + "-" + n;
+		}
+		_initEmptyCoachDeckOffsets() {
+			let e = Array(this.seatReservations.length - 1).fill(0);
+			this.seatReservations[this.seatReservations.length - 1].coachItems.forEach((t) => {
+				for (let n = 0; n < this.seatReservations.length - 1; n++) {
+					let r = this.seatReservations[n].coachItems[e[n]];
+					if (t.id != r?.id) {
+						let r = {
+							...t,
+							places: void 0,
+							propertyIds: void 0,
+							graphicElements: void 0,
+							serviceElements: void 0,
+							travelClass: []
+						};
+						this.seatReservations[n].coachItems.splice(e[n], 0, r);
+					}
+					e[n]++;
+				}
+			});
+		}
+		_initSeatReservationPlaceSelection() {
+			this.selectedSeatReservationPlaces.seats = [], this.selectedSeatReservationPlaces.bicycles = [], this.seatReservations?.forEach((e, t) => e.coachItems.map((n, r) => {
+				n.places?.filter((e) => e.state === "SELECTED")?.forEach((n) => {
+					let i = re(n, this.getPlaceElementId(t, r, n.number), e.deckCoachIndex, r), a = this._getSeatReservationPlaceSelection(i, t);
+					a && (a.placeType === "SEAT" ? this.selectedSeatReservationPlaces.seats.push(a) : this.selectedSeatReservationPlaces.bicycles.push(a));
+				});
+			}));
+		}
+		_resetAllPlaceSelections(e, t) {
+			for (let n of e) if (!t || t.id !== n.id) {
+				let e = this.shadowRoot?.getElementById(n.id);
+				e && e.setAttribute("state", "FREE");
+			}
+			return e = t ? e.filter((e) => e.id === t.id) : [], e;
+		}
+		_getSeatReservationPlaceSelection(e, t) {
+			if (t === null) return null;
+			let n = this.seatReservations[t].coachItems[e.coachIndex], r = n.places?.find((t) => t.number === e.number);
+			return r ? ne(r, n, e.id, e.deckIndex, e.coachIndex) : null;
+		}
+		_getSeatReservationSelectedCoach(e) {
+			if (!this.seatReservations[this.currSelectedDeckIndex].coachItems[e]) return null;
+			let t = this.seatReservations[this.currSelectedDeckIndex].coachItems[e];
+			return te(e, t, this.getAvailableFreePlacesNumFromCoach(t.places));
+		}
+		_setCurrSelectedPlaceElementId(e) {
+			this.currSelectedPlaceElementId = e ? this.getPlaceElementId(this.currSelectedDeckIndex, this.currSelectedCoachIndex, e.number) : null;
+		}
+		_determineBaseFontSize() {
+			if (!i) {
+				let e = 1 / parseInt(window.getComputedStyle(document.body).fontSize, 10);
+				this.style?.setProperty("--sbb-seat-reservation-one-px-rem", `${e + "rem"}`);
+			}
+		}
+		_prepareCoachItemDetailsData() {
+			if (this.seatReservations) {
+				let e = this.seatReservations[this.seatReservations.length - 1].coachItems;
+				this.coachItemDetailsElements = [], e.forEach((e, t) => {
+					let n = [], r = [], i = [];
+					this.seatReservations.map((e) => e.coachItems[t]).forEach((e) => {
+						n.push(...e.travelClass), r.push(...e.propertyIds ? e.propertyIds : []), i.push(...e.places ? e.places : []);
+					}), this.coachItemDetailsElements.push({
+						id: e.id,
+						travelClass: this._prepareTravelClassNavigation(n),
+						propertyIds: this._prepareServiceIconsNavigation(r),
+						isDriverArea: e.places ? e.places.length === 0 : !0,
+						driverAreaSide: this._prepareDriverAreaSideNavigation(e),
+						freePlaces: this.getAvailableFreePlacesNumFromCoach(i),
+						driverAreaElements: this._setDriverAreasElements(e)
+					});
+				});
+			}
+		}
+		_prepareTravelClassNavigation(e) {
+			return e.indexOf("FIRST") === -1 ? e.indexOf("SECOND") === -1 ? "ANY_CLASS" : "SECOND" : "FIRST";
+		}
+		_prepareDriverAreaSideNavigation(e) {
+			let t = e.graphicElements?.filter((e) => e.icon === "DRIVER_AREA");
+			if (t && t.length > 0) {
+				let e = t.find((e) => e.position.x === 0) || !1, n = t.find((e) => e.position.x > 0) || !1;
+				return {
+					left: !!e,
+					right: !!n
+				};
+			}
+		}
+		_prepareCoachWidthAndGapCalculations() {
+			this.seatReservations && this.seatReservations.forEach((e) => {
+				e?.coachItems?.forEach((e) => {
+					let t = this._isOverhangingElementsPresent(e.dimension.w, e.places), n = e.graphicElements?.filter((e) => e.icon && !this.notAreaElements.includes(e.icon)), r = this._isOverhangingElementsPresent(e.dimension.w, n);
+					this.overHangingElementInformation.push({
+						coachId: e.id,
+						overhangingPlaces: t,
+						overhangingGraphicAreas: r
+					});
+				});
+			});
+		}
+		_getPlaceHtmlElement() {
+			return this.currSelectedPlaceElementId && this.shadowRoot?.getElementById(this.currSelectedPlaceElementId) || null;
+		}
+		_getDeckIndexByPlaceId(e) {
+			let t = this.shadowRoot?.querySelector("#" + e)?.getAttribute("data-deck-index");
+			return t && !isNaN(+t) ? +t : null;
+		}
+		_isValidCoachIndex(e) {
+			return e >= 0 && e <= this.seatReservations[this.seatReservations.length - 1].coachItems.length;
+		}
+		_getExistingCoachDeckIndex() {
+			if (this.seatReservations[this.currSelectedDeckIndex].coachItems[this.currSelectedCoachIndex].places !== void 0) return this.currSelectedDeckIndex;
+			let e = this.seatReservations.findIndex((e) => e.coachItems[this.currSelectedCoachIndex].places !== void 0);
+			return this.currSelectedDeckIndex >= e ? this.currSelectedDeckIndex : e;
+		}
+		_scrollPlaceIntoNearestViewport(e) {
+			this.shadowRoot?.getElementById(e)?.scrollIntoView({
+				behavior: "smooth",
+				block: "nearest",
+				inline: "nearest"
+			});
+		}
+		_isOverhangingElementsPresent(e, t) {
+			return t?.some((t) => t.position.x === 0 || t.position.x + t.dimension.w >= e) ?? !1;
+		}
+		_setDriverAreasElements(e) {
+			return e ? {
+				driverArea: e.graphicElements?.find((e) => e.icon === "DRIVER_AREA"),
+				driverAreaNoVerticalWall: e.type === "LOCOMOTIVE_COACH" ? e.graphicElements?.find((e) => e.icon === "DRIVER_AREA_NO_VERTICAL_WALL") : void 0
+			} : {
+				driverArea: void 0,
+				driverAreaNoVerticalWall: void 0
+			};
+		}
+		_onLeaveSeatReservationComponent() {
+			this.hasNavigation && (this.focusedCoachIndex = -1), this.unfocusPlaceElement();
+		}
+	};
 })();
-export {
-  Me as SeatReservationBaseElement
-};
+//#endregion
+export { u as SeatReservationBaseElement };