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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (77) hide show
  1. package/autocomplete-grid/autocomplete-grid-cell/autocomplete-grid-cell.component.js +6 -6
  2. package/autocomplete-grid/autocomplete-grid-option/autocomplete-grid-option.component.js +12 -12
  3. package/autocomplete-grid/autocomplete-grid-row/autocomplete-grid-row.component.js +11 -11
  4. package/core/styles/core.scss +13 -0
  5. package/core/styles/lean-theme.scss +3 -0
  6. package/core/styles/off-brand-theme.scss +3 -0
  7. package/core/styles/safety-theme.scss +3 -0
  8. package/core/styles/standard-theme.scss +3 -0
  9. package/core/styles/theme.scss +5 -0
  10. package/core.css +13 -0
  11. package/custom-elements.json +404 -209
  12. package/development/autocomplete-grid/autocomplete-grid-cell/autocomplete-grid-cell.component.js +3 -2
  13. package/development/autocomplete-grid/autocomplete-grid-option/autocomplete-grid-option.component.js +2 -15
  14. package/development/autocomplete-grid/autocomplete-grid-row/autocomplete-grid-row.component.js +2 -14
  15. package/development/pearl-chain/pearl-chain.component.js +9 -8
  16. package/development/pearl-chain-vertical-item/pearl-chain-vertical-item.component.js +9 -8
  17. package/development/seat-reservation/common/mapper/icon-mapper.d.ts.map +1 -1
  18. package/development/seat-reservation/common/mapper/icon-mapper.js +2 -1
  19. package/development/seat-reservation/common/mapper/mapper.js +6 -4
  20. package/development/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-bus.d.ts +69 -0
  21. package/development/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-bus.d.ts.map +1 -0
  22. package/development/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-bus.js +559 -0
  23. package/development/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-decks.d.ts +123 -0
  24. package/development/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-decks.d.ts.map +1 -0
  25. package/development/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-decks.js +972 -0
  26. package/development/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-giruno.d.ts +114 -0
  27. package/development/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-giruno.d.ts.map +1 -0
  28. package/development/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-giruno.js +20368 -0
  29. package/development/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-others.d.ts +85 -0
  30. package/development/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-others.d.ts.map +1 -0
  31. package/development/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-others.js +1739 -0
  32. package/development/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-train.d.ts +69 -0
  33. package/development/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-train.d.ts.map +1 -0
  34. package/development/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-train.js +9783 -0
  35. package/development/seat-reservation/common/svgs.js +7 -7
  36. package/development/seat-reservation/common/translations/i18n.d.ts.map +1 -1
  37. package/development/seat-reservation/common/translations/i18n.js +32 -1
  38. package/development/seat-reservation/common/types.d.ts +8 -3
  39. package/development/seat-reservation/common/types.d.ts.map +1 -1
  40. package/development/seat-reservation/seat-reservation/seat-reservation-base-element.d.ts +13 -3
  41. package/development/seat-reservation/seat-reservation/seat-reservation-base-element.d.ts.map +1 -1
  42. package/development/seat-reservation/seat-reservation/seat-reservation-base-element.js +68 -15
  43. package/development/seat-reservation/seat-reservation/seat-reservation.component.d.ts +1 -0
  44. package/development/seat-reservation/seat-reservation/seat-reservation.component.d.ts.map +1 -1
  45. package/development/seat-reservation/seat-reservation/seat-reservation.component.js +64 -29
  46. package/development/seat-reservation/seat-reservation-navigation-coach/seat-reservation-navigation-coach.component.d.ts +4 -15
  47. package/development/seat-reservation/seat-reservation-navigation-coach/seat-reservation-navigation-coach.component.d.ts.map +1 -1
  48. package/development/seat-reservation/seat-reservation-navigation-coach/seat-reservation-navigation-coach.component.js +75 -155
  49. package/development/seat-reservation/seat-reservation-navigation-services/seat-reservation-navigation-services.component.d.ts +2 -0
  50. package/development/seat-reservation/seat-reservation-navigation-services/seat-reservation-navigation-services.component.d.ts.map +1 -1
  51. package/development/seat-reservation/seat-reservation-navigation-services/seat-reservation-navigation-services.component.js +21 -5
  52. package/development/seat-reservation/seat-reservation-place-control/seat-reservation-place-control.component.d.ts +7 -1
  53. package/development/seat-reservation/seat-reservation-place-control/seat-reservation-place-control.component.d.ts.map +1 -1
  54. package/development/seat-reservation/seat-reservation-place-control/seat-reservation-place-control.component.js +154 -9
  55. package/off-brand-theme.css +13 -0
  56. package/package.json +18 -2
  57. package/pearl-chain/pearl-chain.component.js +1 -1
  58. package/pearl-chain-vertical-item/pearl-chain-vertical-item.component.js +15 -15
  59. package/safety-theme.css +13 -0
  60. package/seat-reservation/common/mapper/icon-mapper.js +1 -0
  61. package/seat-reservation/common/mapper/mapper.js +25 -23
  62. package/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-bus.js +558 -0
  63. package/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-decks.js +970 -0
  64. package/seat-reservation/common/mapper/{seat-reservation-sample-data.js → sample-data/seat-reservation-sample-data-giruno.js} +3 -11304
  65. package/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-others.js +1738 -0
  66. package/seat-reservation/common/mapper/sample-data/seat-reservation-sample-data-train.js +9782 -0
  67. package/seat-reservation/common/svgs.js +51 -51
  68. package/seat-reservation/common/translations/i18n.js +31 -0
  69. package/seat-reservation/seat-reservation/seat-reservation-base-element.js +128 -88
  70. package/seat-reservation/seat-reservation/seat-reservation.component.js +137 -125
  71. package/seat-reservation/seat-reservation-navigation-coach/seat-reservation-navigation-coach.component.js +141 -186
  72. package/seat-reservation/seat-reservation-navigation-services/seat-reservation-navigation-services.component.js +54 -44
  73. package/seat-reservation/seat-reservation-place-control/seat-reservation-place-control.component.js +106 -71
  74. package/standard-theme.css +13 -0
  75. package/development/seat-reservation/common/mapper/seat-reservation-sample-data.d.ts +0 -372
  76. package/development/seat-reservation/common/mapper/seat-reservation-sample-data.d.ts.map +0 -1
  77. package/development/seat-reservation/common/mapper/seat-reservation-sample-data.js +0 -31673
package/seat-reservation/seat-reservation/seat-reservation.component.js CHANGED
@@ -1,13 +1,13 @@
1
- import { __esDecorate as y, __runInitializers as C } from "tslib";
1
+ import { __esDecorate as k, __runInitializers as y } from "tslib";
2
2
  import { SbbLanguageController as R } from "@sbb-esta/lyne-elements/core/controllers.js";
3
3
  import { boxSizingStyles as S } from "@sbb-esta/lyne-elements/core/styles.js";
4
- import { css as A, html as n, nothing as g } from "lit";
5
- import { customElement as N } from "lit/decorators.js";
4
+ import { css as A, html as n, nothing as u } from "lit";
5
+ import { customElement as T } from "lit/decorators.js";
6
6
  import { classMap as f } from "lit/directives/class-map.js";
7
- import { repeat as E } from "lit/directives/repeat.js";
7
+ import { repeat as N } from "lit/directives/repeat.js";
8
8
  import { styleMap as _ } from "lit/directives/style-map.js";
9
9
  import { getI18nSeatReservation as h } from "../common.js";
10
- import { SeatReservationBaseElement as P } from "./seat-reservation-base-element.js";
10
+ import { SeatReservationBaseElement as E } from "./seat-reservation-base-element.js";
11
11
  import "@sbb-esta/lyne-elements/button.js";
12
12
  import "@sbb-esta/lyne-elements/screen-reader-only.js";
13
13
  import "@sbb-esta/lyne-elements/popover.js";
@@ -16,11 +16,11 @@ import "../seat-reservation-graphic.js";
16
16
  import "../seat-reservation-place-control.js";
17
17
  import "../seat-reservation-navigation-coach.js";
18
18
  import "../seat-reservation-scoped.js";
19
- const T = A`:host{--sbb-seat-reservation-grid-size: 16px;--sbb-seat-reservation-height: 0;--sbb-seat-reservation-decks: 1;display:block;height:inherit}:host ::part(coach-floor){fill:var(--sbb-background-color-2)}@media(forced-colors:active){:host ::part(coach-floor){fill:transparent}}:host(:dir(rtl)) :not(.sbb-sr-place-ctrl--type-bicycle,.sbb-sr-place-ctrl--orientation-90,.sbb-sr-place-ctrl--orientation-270,.sbb-sr-place-ctrl--state-selected) ::part(coach-floor){rotate:180deg}[popover]:where(sbb-popover){margin:0;padding:0;border:none;width:auto;height:auto;background-color:transparent;color:inherit;pointer-events:none}[popover]:where(sbb-popover) .sbb-sr-popover{margin-block:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}:host([align-vertical]) .sbb-sr__component{flex-direction:row-reverse;justify-content:flex-end;gap:calc(22 * var(--sbb-seat-reservation-one-px-rem, .0625rem));height:inherit}@media(min-width:37.5rem){:host([align-vertical]) .sbb-sr__component{gap:calc(54 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}}:host([align-vertical]) .sbb-sr__component nav.sbb-sr-navigation,:host([align-vertical]) .sbb-sr__component ul.sbb-sr-navigation__list-coaches{flex-direction:column}:host([align-vertical]) .sbb-sr__component nav.sbb-sr-navigation{padding:calc(16 * var(--sbb-seat-reservation-one-px-rem, .0625rem)) 0}:host([align-vertical]) .sbb-sr__component nav.sbb-sr-navigation .sbb-sr__navigation-control-button{left:calc(1 * var(--sbb-seat-reservation-one-px-rem, .0625rem));top:0;rotate:90deg}@media(min-width:64rem){:host([align-vertical]) .sbb-sr__component nav.sbb-sr-navigation .sbb-sr__navigation-control-button{left:calc(-1 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}}:host([align-vertical]) .sbb-sr__component nav.sbb-sr-navigation ul.sbb-sr-navigation__list-coaches{max-width:initial;padding:calc(5 * var(--sbb-seat-reservation-one-px-rem, .0625rem));overflow:hidden scroll}:host([align-vertical]) .sbb-sr__wrapper-coach-decks{flex-direction:column}:host([align-vertical]) .sbb-sr__wrapper-coach-decks .sbb-sr__wrapper-deck-labels{flex-direction:column-reverse;width:calc((var(--sbb-seat-reservation-height) + 24) * var(--sbb-seat-reservation-one-px-rem, .0625rem));height:initial}:host([align-vertical]) .sbb-sr__wrapper-coach-decks .sbb-sr__wrapper-deck-labels b{inline-size:calc(50% - 16 * var(--sbb-seat-reservation-one-px-rem, .0625rem));block-size:calc(20 * var(--sbb-seat-reservation-one-px-rem, .0625rem));margin-bottom:calc(16 * var(--sbb-seat-reservation-one-px-rem, .0625rem));rotate:initial;writing-mode:initial}:host([align-vertical]) .sbb-sr__wrapper-scrollarea{width:calc((var(--sbb-seat-reservation-height) + 24) * var(--sbb-seat-reservation-one-px-rem, .0625rem));height:100%;overflow:hidden scroll}:host([align-vertical]) .sbb-sr__wrapper-scrollarea .sbb-sr__parent{flex-direction:row;rotate:90deg}.sbb-sr-navigation{gap:calc(3 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr-navigation .sbb-sr__navigation-control-button{position:relative;top:calc(2 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}@media(min-width:64rem){.sbb-sr-navigation .sbb-sr__navigation-control-button{top:0}}.sbb-sr__component{display:flex;flex-direction:column;gap:calc(64 * var(--sbb-seat-reservation-one-px-rem, .0625rem) - 16px)}.sbb-sr-navigation-wrapper{display:flex}.sbb-sr-navigation{display:flex;justify-content:center;width:100%;padding-inline:16px}.sbb-sr-navigation__list-coaches{list-style:none;margin:0;padding:0;font-size:inherit;--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-black) 30%, transparent);--sbb-scrollbar-color: light-dark( color-mix(in srgb, var(--sbb-color-black) 30%, transparent), color-mix(in srgb, var(--sbb-color-white) 30%, transparent) );--sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);--sbb-scrollbar-color-hover: light-dark( color-mix(in srgb, var(--sbb-color-black) 60%, transparent), color-mix(in srgb, var(--sbb-color-white) 60%, transparent) );--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-sr-navigation__list-coaches::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-sr-navigation__list-coaches::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-sr-navigation__list-coaches::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-sr-navigation__list-coaches::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-sr-navigation__list-coaches::-webkit-scrollbar-button,.sbb-sr-navigation__list-coaches::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-sr-navigation__list-coaches{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-sr-navigation__list-coaches{display:flex;flex-wrap:nowrap;gap:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem));padding:calc(6 * var(--sbb-seat-reservation-one-px-rem, .0625rem)) calc(5 * var(--sbb-seat-reservation-one-px-rem, .0625rem)) 0;max-width:856px;--sbb-scrollbar-color: transparent;overflow:scroll hidden;position:relative}.sbb-sr__wrapper-coach-decks{display:flex;overflow:hidden;height:inherit}.sbb-sr__wrapper-coach-decks .sbb-sr__wrapper-deck-labels{display:flex;justify-content:space-between;height:calc(var(--sbb-seat-reservation-height) * var(--sbb-seat-reservation-one-px-rem, .0625rem));writing-mode:vertical-lr}.sbb-sr__wrapper-coach-decks .sbb-sr__wrapper-deck-labels b{height:calc(50% - 16 * var(--sbb-seat-reservation-one-px-rem, .0625rem));width:calc(20 * var(--sbb-seat-reservation-one-px-rem, .0625rem));margin-block-end:16px;rotate:180deg;text-align:center;line-height:calc(20 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__wrapper-scrollarea{--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-black) 30%, transparent);--sbb-scrollbar-color: light-dark( color-mix(in srgb, var(--sbb-color-black) 30%, transparent), color-mix(in srgb, var(--sbb-color-white) 30%, transparent) );--sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);--sbb-scrollbar-color-hover: light-dark( color-mix(in srgb, var(--sbb-color-black) 60%, transparent), color-mix(in srgb, var(--sbb-color-white) 60%, transparent) );--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-sr__wrapper-scrollarea::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-sr__wrapper-scrollarea::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-sr__wrapper-scrollarea::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-sr__wrapper-scrollarea::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-sr__wrapper-scrollarea::-webkit-scrollbar-button,.sbb-sr__wrapper-scrollarea::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-sr__wrapper-scrollarea{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-sr__wrapper-scrollarea{overflow:scroll hidden;padding-block:calc(8 * var(--sbb-seat-reservation-one-px-rem, .0625rem)) calc(16 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__wrapper-scrollarea .sbb-sr__parent{display:flex;flex-direction:column;position:relative}.sbb-sr__list-decks{list-style:none;margin:0;padding:0;font-size:inherit;display:flex;flex-direction:column}.sbb-sr__list-decks--gap{gap:calc(48 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__list-item-deck{position:relative}.sbb-sr__list-coaches{list-style:none;margin:0;padding:0;font-size:inherit;display:flex;gap:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__list-decks:has(.sbb-sr-coach-has-overhanging-elements) .sbb-sr__list-coaches{gap:calc(8 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__item-coach{position:relative}.sbb-sr-coach-wrapper__table{outline:0}`;
19
+ const D = A`:host{--sbb-seat-reservation-grid-size: 16px;--sbb-seat-reservation-height: 0;--sbb-seat-reservation-decks: 1;display:block;height:inherit}:host ::part(coach-floor){fill:var(--sbb-background-color-2)}@media(forced-colors:active){:host ::part(coach-floor){fill:transparent}}:host(:dir(rtl)) :not(.sbb-sr-place-ctrl--type-bicycle,.sbb-sr-place-ctrl--orientation-90,.sbb-sr-place-ctrl--orientation-270,.sbb-sr-place-ctrl--state-selected) ::part(coach-floor){rotate:180deg}[popover]:where(sbb-popover){margin:0;padding:0;border:none;width:auto;height:auto;background-color:transparent;color:inherit;pointer-events:none}[popover]:where(sbb-popover) .sbb-sr-popover{margin-block:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}:host([align-vertical]) .sbb-sr__component{flex-direction:row-reverse;justify-content:flex-end;gap:calc(22 * var(--sbb-seat-reservation-one-px-rem, .0625rem));height:inherit}@media(min-width:37.5rem){:host([align-vertical]) .sbb-sr__component{gap:calc(54 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}}:host([align-vertical]) .sbb-sr__component nav.sbb-sr-navigation,:host([align-vertical]) .sbb-sr__component ul.sbb-sr-navigation__list-coaches{flex-direction:column}:host([align-vertical]) .sbb-sr__component nav.sbb-sr-navigation{padding:calc(16 * var(--sbb-seat-reservation-one-px-rem, .0625rem)) 0}:host([align-vertical]) .sbb-sr__component nav.sbb-sr-navigation .sbb-sr__navigation-control-button{left:calc(1 * var(--sbb-seat-reservation-one-px-rem, .0625rem));top:0;rotate:90deg}@media(min-width:64rem){:host([align-vertical]) .sbb-sr__component nav.sbb-sr-navigation .sbb-sr__navigation-control-button{left:calc(-1 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}}:host([align-vertical]) .sbb-sr__component nav.sbb-sr-navigation ul.sbb-sr-navigation__list-coaches{max-width:initial;padding:calc(5 * var(--sbb-seat-reservation-one-px-rem, .0625rem));overflow:hidden scroll}:host([align-vertical]) .sbb-sr__wrapper-coach-decks{flex-direction:column}:host([align-vertical]) .sbb-sr__wrapper-coach-decks .sbb-sr__wrapper-deck-labels{flex-direction:column-reverse;width:calc((var(--sbb-seat-reservation-height) + 24) * var(--sbb-seat-reservation-one-px-rem, .0625rem));height:initial}:host([align-vertical]) .sbb-sr__wrapper-coach-decks .sbb-sr__wrapper-deck-labels b{inline-size:calc(50% - 16 * var(--sbb-seat-reservation-one-px-rem, .0625rem));block-size:calc(20 * var(--sbb-seat-reservation-one-px-rem, .0625rem));margin-bottom:calc(16 * var(--sbb-seat-reservation-one-px-rem, .0625rem));rotate:initial;writing-mode:initial}:host([align-vertical]) .sbb-sr__wrapper-scrollarea{width:calc((var(--sbb-seat-reservation-height) + 24) * var(--sbb-seat-reservation-one-px-rem, .0625rem));height:100%;overflow:hidden scroll}:host([align-vertical]) .sbb-sr__wrapper-scrollarea .sbb-sr__parent{rotate:90deg}:host([align-vertical]) .sbb-sr-travel-direction-wrapper{width:calc(var(--sbb-seat-reservation-height) * var(--sbb-seat-reservation-one-px-rem, .0625rem));margin-block-start:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr-navigation{gap:calc(3 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr-navigation .sbb-sr__navigation-control-button{position:relative;top:calc(2 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}@media(min-width:64rem){.sbb-sr-navigation .sbb-sr__navigation-control-button{top:0}}.sbb-sr__component{display:flex;flex-direction:column;gap:calc(64 * var(--sbb-seat-reservation-one-px-rem, .0625rem) - 16px)}.sbb-sr-travel-direction-wrapper{display:flex;justify-content:center;align-items:center;column-gap:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem));margin-block:calc(8 * var(--sbb-seat-reservation-one-px-rem, .0625rem)) calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem));font-size:var(--sbb-text-font-size-s)}.sbb-sr-travel-direction-wrapper .sbb-sr__travel-direction--arrow{display:flex;align-items:center}.sbb-sr-navigation-wrapper{display:flex}.sbb-sr-navigation{display:flex;justify-content:center;width:100%;padding-inline:16px}.sbb-sr-navigation__list-coaches{list-style:none;margin:0;padding:0;font-size:inherit;--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-black) 30%, transparent);--sbb-scrollbar-color: light-dark( color-mix(in srgb, var(--sbb-color-black) 30%, transparent), color-mix(in srgb, var(--sbb-color-white) 30%, transparent) );--sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);--sbb-scrollbar-color-hover: light-dark( color-mix(in srgb, var(--sbb-color-black) 60%, transparent), color-mix(in srgb, var(--sbb-color-white) 60%, transparent) );--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-sr-navigation__list-coaches::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-sr-navigation__list-coaches::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-sr-navigation__list-coaches::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-sr-navigation__list-coaches::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-sr-navigation__list-coaches::-webkit-scrollbar-button,.sbb-sr-navigation__list-coaches::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-sr-navigation__list-coaches{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-sr-navigation__list-coaches{display:flex;flex-wrap:nowrap;gap:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem));padding:calc(6 * var(--sbb-seat-reservation-one-px-rem, .0625rem)) calc(5 * var(--sbb-seat-reservation-one-px-rem, .0625rem)) 0;max-width:856px;--sbb-scrollbar-color: transparent;overflow:scroll hidden;position:relative}.sbb-sr__wrapper-coach-decks{display:flex;overflow:hidden;height:inherit}.sbb-sr__wrapper-coach-decks .sbb-sr__wrapper-deck-labels{display:flex;justify-content:space-between;height:calc(var(--sbb-seat-reservation-height) * var(--sbb-seat-reservation-one-px-rem, .0625rem));writing-mode:vertical-lr}.sbb-sr__wrapper-coach-decks .sbb-sr__wrapper-deck-labels b{height:calc(50% - 16 * var(--sbb-seat-reservation-one-px-rem, .0625rem));width:calc(20 * var(--sbb-seat-reservation-one-px-rem, .0625rem));margin-block-end:16px;rotate:180deg;text-align:center;line-height:calc(20 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__wrapper-scrollarea{--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-black) 30%, transparent);--sbb-scrollbar-color: light-dark( color-mix(in srgb, var(--sbb-color-black) 30%, transparent), color-mix(in srgb, var(--sbb-color-white) 30%, transparent) );--sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);--sbb-scrollbar-color-hover: light-dark( color-mix(in srgb, var(--sbb-color-black) 60%, transparent), color-mix(in srgb, var(--sbb-color-white) 60%, transparent) );--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-sr__wrapper-scrollarea::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-sr__wrapper-scrollarea::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-sr__wrapper-scrollarea::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-sr__wrapper-scrollarea::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-sr__wrapper-scrollarea::-webkit-scrollbar-button,.sbb-sr__wrapper-scrollarea::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-sr__wrapper-scrollarea{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-sr__wrapper-scrollarea{overflow:scroll hidden;padding-block:calc(8 * var(--sbb-seat-reservation-one-px-rem, .0625rem)) calc(16 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__wrapper-scrollarea .sbb-sr__parent{display:flex;flex-direction:column;position:relative}.sbb-sr__list-decks{list-style:none;margin:0;padding:0;font-size:inherit;display:flex;flex-direction:column}.sbb-sr__list-decks--gap{gap:calc(48 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__list-item-deck{position:relative}.sbb-sr__list-coaches{list-style:none;margin:0;padding:0;font-size:inherit;display:flex;gap:calc(4 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__list-decks:has(.sbb-sr-coach-has-overhanging-elements) .sbb-sr__list-coaches{gap:calc(8 * var(--sbb-seat-reservation-one-px-rem, .0625rem))}.sbb-sr__item-coach{position:relative}.sbb-sr-coach-wrapper__table{outline:0}`;
20
20
  let Y = (() => {
21
21
  var p;
22
- let k = [N("sbb-seat-reservation")], w, x = [], d, $ = P;
23
- return p = class extends $ {
22
+ let $ = [T("sbb-seat-reservation")], w, x = [], d, C = E;
23
+ return p = class extends C {
24
24
  constructor() {
25
25
  super(...arguments), this._language = new R(this), this._notFixedRotatableAreaIcons = ["ENTRY_EXIT"];
26
26
  }
@@ -37,6 +37,7 @@ let Y = (() => {
37
37
  }
38
38
  _initVehicleSeatReservationConstruction() {
39
39
  this._coachesHtmlTemplate = n`
40
+ ${this._renderTravelDirection()}
40
41
  <div class="sbb-sr__component">
41
42
  ${this._renderNavigation()}
42
43
  <div
@@ -78,24 +79,35 @@ let Y = (() => {
78
79
  _renderNavigationControlButton(e) {
79
80
  if (!this.hasNavigation || !this.seatReservations)
80
81
  return null;
81
- const r = e == "DIRECTION_RIGHT" ? "sbb-sr-navigation__wrapper-button-direction--right" : "sbb-sr-navigation__wrapper-button-direction--left", s = e == "DIRECTION_RIGHT" ? "chevron-small-right-small" : "chevron-small-left-small", o = e == "DIRECTION_RIGHT" ? h("SEAT_RESERVATION_END", this._language.current) : h("SEAT_RESERVATION_BEGIN", this._language.current);
82
+ const r = e == "DIRECTION_RIGHT" ? "sbb-sr-navigation__wrapper-button-direction--right" : "sbb-sr-navigation__wrapper-button-direction--left", t = e == "DIRECTION_RIGHT" ? "chevron-small-right-small" : "chevron-small-left-small", i = e == "DIRECTION_RIGHT" ? h("SEAT_RESERVATION_END", this._language.current) : h("SEAT_RESERVATION_BEGIN", this._language.current);
82
83
  let a = !0;
83
- return (e == "DIRECTION_LEFT" && this.selectedCoachIndex > 0 || e == "DIRECTION_RIGHT" && this.selectedCoachIndex < this.coachNavData.length - 1) && (a = !1), n`<div class="sbb-sr-navigation__wrapper-button-direction">
84
+ return (e == "DIRECTION_LEFT" && this.selectedCoachIndex > 0 || e == "DIRECTION_RIGHT" && this.selectedCoachIndex < this.coachItemDetailsElements.length - 1) && (a = !1), n`<div class="sbb-sr-navigation__wrapper-button-direction">
84
85
  <sbb-secondary-button
85
86
  @click="${() => this.navigateByDirectionBtn(e)}"
86
87
  @focus="${() => this.onFocusNavDirectionButton()}"
87
88
  id="${r}"
88
89
  class="sbb-sr__navigation-control-button"
89
90
  size="m"
90
- icon-name="${s}"
91
+ icon-name="${t}"
91
92
  type="button"
92
- aria-label="${o}"
93
+ aria-label="${i}"
93
94
  role="button"
94
- .disabledInteractive="${a || g}"
95
- .disabled="${a || g}"
95
+ .disabledInteractive="${a || u}"
96
+ .disabled="${a || u}"
96
97
  ></sbb-secondary-button>
97
98
  </div>`;
98
99
  }
100
+ _renderTravelDirection() {
101
+ if (!this.travelDirection || this.travelDirection === "NONE")
102
+ return null;
103
+ const e = h("SEAT_RESERVATION_TRAVEL_DIRECTION", this._language.current), t = `arrow-${this.alignVertical ? this.travelDirection === "RIGHT" ? "down" : "up" : this.travelDirection === "RIGHT" ? "right" : "left"}-small`;
104
+ return n`<div class="sbb-sr-travel-direction-wrapper">
105
+ <div class="sbb-sr__travel-direction--arrow">
106
+ <sbb-icon slot="icon" name="${t}"></sbb-icon>
107
+ </div>
108
+ <div class="sbb-sr__travel-direction--label">${e}</div>
109
+ </div>`;
110
+ }
99
111
  _renderNavigation() {
100
112
  return !this.hasNavigation || !this.seatReservations ? null : n`<div class="sbb-sr-navigation-wrapper">
101
113
  <nav id="sbb-sr-navigation" class="sbb-sr-navigation">
@@ -105,27 +117,22 @@ let Y = (() => {
105
117
  class="sbb-sr-navigation__list-coaches"
106
118
  aria-label="${h("SEAT_RESERVATION_NAVIGATION", this._language.current)}"
107
119
  >
108
- ${this.coachNavData.map((e, r) => n`<li>
109
- <sbb-seat-reservation-navigation-coach
110
- @selectcoach=${(s) => this._onSelectNavCoach(s)}
111
- @focuscoach=${() => this._onFocusNavCoach()}
112
- @keyup=${(s) => this.onKeyNavigationNavCoachButton(s, r)}
113
- index="${r}"
114
- coach-id="${e.id}"
115
- .freePlacesByType="${e.freePlaces}"
116
- .selected=${this.selectedCoachIndex === r}
117
- .focused=${this.focusedCoachIndex === r}
118
- .hovered=${this.hoveredCoachIndex === r}
119
- .nativeFocusActive=${this.hasSeatReservationNativeFocus}
120
- .propertyIds="${e.propertyIds}"
121
- .travelClass="${e.travelClass}"
122
- ?driver-area="${e.isDriverArea}"
123
- ?first="${e?.driverAreaSide?.left}"
124
- ?last="${e?.driverAreaSide?.right}"
125
- ?vertical="${this.alignVertical}"
126
- >
127
- </sbb-seat-reservation-navigation-coach>
128
- </li>`)}
120
+ ${this.coachItemDetailsElements.map((e, r) => n`<li>
121
+ <sbb-seat-reservation-navigation-coach
122
+ @selectcoach=${(t) => this._onSelectNavCoach(t)}
123
+ @focuscoach=${() => this._onFocusNavCoach()}
124
+ @keyup=${(t) => this.onKeyNavigationNavCoachButton(t, r)}
125
+ index="${r}"
126
+ .selected=${this.selectedCoachIndex === r}
127
+ .focused=${this.focusedCoachIndex === r}
128
+ .hovered=${this.hoveredCoachIndex === r}
129
+ .nativeFocusActive=${this.hasSeatReservationNativeFocus}
130
+ .coachItemDetails="${e}"
131
+ ?vertical="${this.alignVertical}"
132
+ ?showTitleInfo="${this.showTitleInfo}"
133
+ >
134
+ </sbb-seat-reservation-navigation-coach>
135
+ </li>`)}
129
136
  </ul>
130
137
  ${this._renderNavigationControlButton("DIRECTION_RIGHT")}
131
138
  </nav>
@@ -138,24 +145,24 @@ let Y = (() => {
138
145
  * @param coachDeckIndex
139
146
  */
140
147
  _renderCoaches(e, r) {
141
- const s = JSON.parse(JSON.stringify(e?.coachItems));
142
- return s ? s.map((o, a) => n`
148
+ const t = JSON.parse(JSON.stringify(e?.coachItems));
149
+ return t ? t.map((i, a) => n`
143
150
  <li class="sbb-sr__item-coach">
144
- ${this._renderCoachElement(o, a, r, e.deckCoachIndex)}
151
+ ${this._renderCoachElement(i, a, r, e.deckCoachIndex)}
145
152
  </li>
146
153
  `) : null;
147
154
  }
148
- _renderCoachElement(e, r, s, o) {
149
- const a = this.getCalculatedDimension(e.dimension), t = this._getDescriptionTableCoach(e);
155
+ _renderCoachElement(e, r, t, i) {
156
+ const a = this.getCalculatedDimension(e.dimension), s = this._getDescriptionTableCoach(e);
150
157
  return n`<sbb-seat-reservation-scoped
151
158
  style=${_({
152
159
  "--sbb-seat-reservation-scoped-width": a.w,
153
160
  "--sbb-seat-reservation-scoped-height": a.h
154
161
  })}
155
162
  >
156
- ${this._getRenderedCoachBorders(e)}
157
- ${this._getRenderedGraphicalElements(e.graphicElements || [], e.dimension, r, s)}
158
- ${this._getRenderedServiceElements(r, s, e.serviceElements)}
163
+ ${this._getRenderedCoachBorders(e, r)}
164
+ ${this._getRenderedGraphicalElements(e.graphicElements || [], e.dimension, r, t)}
165
+ ${this._getRenderedServiceElements(r, t, e.serviceElements)}
159
166
 
160
167
  <table
161
168
  @focus=${() => this.onFocusTableCoachAndPreselectPlace(r)}
@@ -165,9 +172,9 @@ let Y = (() => {
165
172
  tabindex="-1"
166
173
  >
167
174
  <caption id="sbb-sr-coach-caption-${r}" tabindex="-1">
168
- <sbb-screen-reader-only>${t}</sbb-screen-reader-only>
175
+ <sbb-screen-reader-only>${s}</sbb-screen-reader-only>
169
176
  </caption>
170
- ${this._getRenderedRowPlaces(e, r, s, o)}
177
+ ${this._getRenderedRowPlaces(e, r, t, i)}
171
178
  </table>
172
179
  </sbb-seat-reservation-scoped>`;
173
180
  }
@@ -175,25 +182,26 @@ let Y = (() => {
175
182
  * @returns Returns the border graphic (COACH_BORDER_MIDDLE) of a coach with calculated border gap and coach width,
176
183
  * depending on whether the coach is with a driver area or without.
177
184
  */
178
- _getRenderedCoachBorders(e) {
185
+ _getRenderedCoachBorders(e, r) {
179
186
  if (!e.graphicElements)
180
187
  return null;
181
- const r = 1, o = e.graphicElements?.find((c) => c.icon === "DRIVER_AREA");
182
- let a = o ? e.dimension.w - o.dimension.w - r : e.dimension.w - r * 2;
183
- a *= this.baseGridSize;
184
- const t = (e.dimension.h + this.coachBorderOffset * 2) * this.baseGridSize;
185
- let i = o && o.position.x === 0 ? o?.dimension.w * this.baseGridSize : this.baseGridSize;
186
- const l = this.overHangingElementInformation.find((c) => c.coachId == e.id);
187
- return (l?.overhangingPlaces || l?.overhangingGraphicAreas) && (a += 2 * this.baseGridSize, i = 0), n`
188
+ const t = 1, i = this.coachItemDetailsElements[r]?.driverAreaElements?.driverArea, a = this.coachItemDetailsElements[r]?.driverAreaElements?.driverAreaNoVerticalWall;
189
+ let s = i ? e.dimension.w - i.dimension.w - t : e.dimension.w - t * 2;
190
+ s *= this.baseGridSize;
191
+ const o = (e.dimension.h + this.coachBorderOffset * 2) * this.baseGridSize;
192
+ let l = i && i.position.x === 0 ? i?.dimension.w * this.baseGridSize : this.baseGridSize;
193
+ a && (s = this.getCalculatedDimension(e.dimension).w - 2 * (a.dimension.w * this.baseGridSize), l = a.dimension.w * this.baseGridSize);
194
+ const b = this.overHangingElementInformation.find((c) => c.coachId == e.id);
195
+ return (b?.overhangingPlaces || b?.overhangingGraphicAreas) && (s += 2 * this.baseGridSize, l = 0), n`
188
196
  <sbb-seat-reservation-graphic
189
197
  class="${f({
190
- "sbb-sr-coach-has-overhanging-elements": l?.overhangingPlaces || l?.overhangingGraphicAreas || !1
198
+ "sbb-sr-coach-has-overhanging-elements": b?.overhangingPlaces || b?.overhangingGraphicAreas || !1
191
199
  })}"
192
200
  style=${_({
193
- "--sbb-seat-reservation-graphic-width": a,
194
- "--sbb-seat-reservation-graphic-height": t,
201
+ "--sbb-seat-reservation-graphic-width": s,
202
+ "--sbb-seat-reservation-graphic-height": o,
195
203
  "--sbb-seat-reservation-graphic-top": this.coachBorderPadding * -1,
196
- "--sbb-seat-reservation-graphic-left": i,
204
+ "--sbb-seat-reservation-graphic-left": l,
197
205
  "--sbb-seat-reservation-graphic-position": "absolute"
198
206
  })}
199
207
  name="COACH_BORDER_MIDDLE"
@@ -202,26 +210,26 @@ let Y = (() => {
202
210
  ></sbb-seat-reservation-graphic>
203
211
  `;
204
212
  }
205
- _getRenderedRowPlaces(e, r, s, o) {
213
+ _getRenderedRowPlaces(e, r, t, i) {
206
214
  if (!e.places)
207
215
  return null;
208
216
  const a = {};
209
- for (const t of e.places)
210
- a[t.position.y] ? a[t.position.y].push(t) : a[t.position.y] = [t];
211
- return Object.values(a).map((t, i) => n`
212
- <tr id="row-${r}-${t[0].position.y}" data-row-index=${i}>
213
- ${this._getRenderedColumnPlaces(t, r, s, o)}
217
+ for (const s of e.places)
218
+ a[s.position.y] ? a[s.position.y].push(s) : a[s.position.y] = [s];
219
+ return Object.values(a).map((s, o) => n`
220
+ <tr id="row-${r}-${s[0].position.y}" data-row-index=${o}>
221
+ ${this._getRenderedColumnPlaces(s, r, t, i)}
214
222
  </tr>
215
- `).flatMap((t) => t);
223
+ `).flatMap((s) => s);
216
224
  }
217
- _getRenderedColumnPlaces(e, r, s, o) {
218
- e.sort((t, i) => Number(t.position.x) - Number(i.position.x));
219
- const a = r + "-" + o;
220
- return n`${E(e, (t) => a + "-" + t.number, (t, i) => {
221
- const l = this.getCalculatedDimension(t.dimension), c = this.getCalculatedPosition(t.position), b = t.rotation || 0, v = this.alignVertical ? -90 : 0, m = this.getPlaceElementId(s, r, t.number);
225
+ _getRenderedColumnPlaces(e, r, t, i) {
226
+ e.sort((s, o) => Number(s.position.x) - Number(o.position.x));
227
+ const a = r + "-" + i;
228
+ return n`${N(e, (s) => a + "-" + s.number, (s, o) => {
229
+ const l = this.getCalculatedDimension(s.dimension), b = this.getCalculatedPosition(s.position), c = s.rotation || 0, v = this.alignVertical ? -90 : 0, m = this.getPlaceElementId(t, r, s.number);
222
230
  return n`
223
231
  <td
224
- id="cell-${s}-${r}-${t.position.y}-${i}"
232
+ id="cell-${t}-${r}-${s.position.y}-${o}"
225
233
  class="graphical-element"
226
234
  >
227
235
  <sbb-seat-reservation-place-control
@@ -229,32 +237,34 @@ let Y = (() => {
229
237
  "--sbb-seat-reservation-place-control-text-scale-value": Math.min(l.w, l.h),
230
238
  "--sbb-seat-reservation-place-control-width": l.w,
231
239
  "--sbb-seat-reservation-place-control-height": l.h,
232
- "--sbb-seat-reservation-place-control-top": c.y,
233
- "--sbb-seat-reservation-place-control-left": c.x,
234
- "--sbb-seat-reservation-place-control-rotation": b,
240
+ "--sbb-seat-reservation-place-control-top": b.y,
241
+ "--sbb-seat-reservation-place-control-left": b.x,
242
+ "--sbb-seat-reservation-place-control-rotation": c,
235
243
  "--sbb-seat-reservation-place-control-text-rotation": v
236
244
  })}
237
- @selectplace=${(u) => this._onSelectPlace(u)}
245
+ @selectplace=${(g) => this._onSelectPlace(g)}
238
246
  exportparts="sbb-sr-place-part"
239
247
  id=${m}
240
248
  class="seat-reservation-place-control"
241
- text=${t.number}
242
- type=${t.type}
243
- state=${t.state}
249
+ text=${s.number}
250
+ type=${s.type}
251
+ state=${s.state}
252
+ travel-direction=${this.travelDirection}
244
253
  coach-index=${r}
245
- deck-index=${o}
246
- data-deck-index=${s}
247
- .propertyIds=${t.propertyIds}
254
+ deck-index=${i}
255
+ data-deck-index=${t}
256
+ .propertyIds=${s.propertyIds}
248
257
  .preventClick=${this.preventPlaceClick}
258
+ ?showTitleInfo="${this.showTitleInfo}"
249
259
  ></sbb-seat-reservation-place-control>
250
260
  </td>
251
261
  `;
252
262
  })}`;
253
263
  }
254
- _getRenderedGraphicalElements(e, r, s, o) {
264
+ _getRenderedGraphicalElements(e, r, t, i) {
255
265
  return e ? e?.map((a) => {
256
- const t = a.icon ?? "", i = a.rotation || 0, l = this._notFixedRotatableAreaIcons.indexOf(a.icon) === -1, c = this.alignVertical && l ? i - 90 : i;
257
- return this.notAreaElements.findIndex((b) => b === t) > -1 ? this._getRenderElementWithoutArea(a, i, r) : this._getRenderElementWithArea(a, c, r, s, o);
266
+ const s = a.icon ?? "", o = a.rotation || 0, l = this._notFixedRotatableAreaIcons.indexOf(a.icon) === -1, b = this.alignVertical && l ? o - 90 : o;
267
+ return this.notAreaElements.findIndex((c) => c === s) > -1 ? this._getRenderElementWithoutArea(a, o, r) : this._getRenderElementWithArea(a, b, r, t, i);
258
268
  }) : null;
259
269
  }
260
270
  /**
@@ -266,76 +276,76 @@ let Y = (() => {
266
276
  * @param coachDeckIndex used to generate a unique id
267
277
  * @private
268
278
  */
269
- _getRenderElementWithArea(e, r, s, o, a) {
270
- const t = e.icon?.indexOf("TABLE") === -1, i = e.icon && t ? e.icon : null, l = this.isElementDirectlyOnBorder(e, s) && i !== "ENTRY_EXIT", c = e.icon ? h(e.icon, this._language.current) : g, b = this.getCalculatedDimension(e.dimension, s, !0, l), v = this.getCalculatedPosition(e.position, e.dimension, s, !0), m = `popover-trigger-${a}-${o}-${v.x}-${v.y}`;
271
- let u = "free";
272
- return e.position.y === this.coachBorderOffset * -1 ? u = "upper-border" : e.position.y + e.dimension.h === s.h + this.coachBorderOffset && (u = "lower-border"), u !== "free" && (v.y += u === "upper-border" ? 2 : 1, b.h -= 3), n`
279
+ _getRenderElementWithArea(e, r, t, i, a) {
280
+ const s = e.icon?.indexOf("TABLE") === -1, o = e.icon && s ? e.icon : null, l = this.isElementDirectlyOnBorder(e, t) && o !== "ENTRY_EXIT", b = e.icon ? h(e.icon, this._language.current) : u, c = this.getCalculatedDimension(e.dimension, t, !0, l), v = this.getCalculatedPosition(e.position, e.dimension, t, !0), m = `popover-trigger-${a}-${i}-${v.x}-${v.y}`;
281
+ let g = "free";
282
+ return e.position.y === this.coachBorderOffset * -1 ? g = "upper-border" : e.position.y + e.dimension.h === t.h + this.coachBorderOffset && (g = "lower-border"), g !== "free" && (v.y += g === "upper-border" ? 2 : 1, c.h -= 3), n`
273
283
  <sbb-seat-reservation-area
274
284
  id="${m}"
275
- class="${f({ "sbb-seat-reservation-area--cursor-pointer": i !== null })}"
285
+ class="${f({ "sbb-seat-reservation-area--cursor-pointer": o !== null })}"
276
286
  style=${_({
277
- "--sbb-seat-reservation-area-width": b.w,
278
- "--sbb-seat-reservation-area-height": b.h,
287
+ "--sbb-seat-reservation-area-width": c.w,
288
+ "--sbb-seat-reservation-area-height": c.h,
279
289
  "--sbb-seat-reservation-area-top": v.y,
280
290
  "--sbb-seat-reservation-area-left": v.x
281
291
  })}
282
- mounting=${u}
292
+ mounting=${g}
283
293
  background="dark"
284
294
  aria-hidden="true"
285
295
  >
286
- ${i ? n`
296
+ ${o ? n`
287
297
  <sbb-seat-reservation-graphic
288
298
  style=${_({
289
- "--sbb-seat-reservation-graphic-max-width": b.w,
299
+ "--sbb-seat-reservation-graphic-max-width": c.w,
290
300
  "--sbb-seat-reservation-graphic-height": this.baseGridSize,
291
301
  "--sbb-seat-reservation-graphic-rotation": r
292
302
  })}
293
- name=${i}
303
+ name=${o}
294
304
  role="img"
295
305
  aria-hidden="true"
296
306
  class="auto-width"
297
307
  ></sbb-seat-reservation-graphic>
298
- ` : g}
308
+ ` : u}
299
309
  </sbb-seat-reservation-area>
300
- ${i ? this._popover(m, c) : g}
310
+ ${o ? this._popover(m, b) : u}
301
311
  `;
302
312
  }
303
- _getRenderElementWithoutArea(e, r, s) {
304
- const o = this.getCalculatedDimension(e.dimension, s), a = this.getCalculatedPosition(e.position, e.dimension, s), t = e.icon && e.icon.indexOf("DRIVER_AREA") === -1 ? e.icon : e.icon?.concat("_", this.seatReservations[this.currSelectedDeckIndex].vehicleType);
313
+ _getRenderElementWithoutArea(e, r, t) {
314
+ const i = this.getCalculatedDimension(e.dimension, t), a = this.getCalculatedPosition(e.position, e.dimension, t), s = e.icon && e.icon.endsWith("DRIVER_AREA") ? e.icon?.concat("_", this.seatReservations[this.currSelectedDeckIndex].vehicleType) : e.icon;
305
315
  return n` <sbb-seat-reservation-graphic
306
316
  style=${_({
307
- "--sbb-seat-reservation-graphic-width": o.w,
308
- "--sbb-seat-reservation-graphic-height": o.h,
317
+ "--sbb-seat-reservation-graphic-width": i.w,
318
+ "--sbb-seat-reservation-graphic-height": i.h,
309
319
  "--sbb-seat-reservation-graphic-top": a.y,
310
320
  "--sbb-seat-reservation-graphic-left": a.x,
311
321
  "--sbb-seat-reservation-graphic-position": "absolute",
312
322
  "--sbb-seat-reservation-graphic-rotation": r
313
323
  })}
314
- name=${t ?? g}
324
+ name=${s ?? u}
315
325
  aria-hidden="true"
316
326
  ?stretch=${!0}
317
327
  ></sbb-seat-reservation-graphic>`;
318
328
  }
319
- _getRenderedServiceElements(e, r, s) {
320
- return s ? s?.map((o) => {
321
- const a = o.icon ? h(o.icon, this._language.current) : null, t = this.getCalculatedDimension(o.dimension), i = this.getCalculatedPosition(o.position), l = o.rotation || 0, c = this.alignVertical ? l - 90 : l, b = `popover-trigger-${r}-${e}-${i.x}-${i.y}`;
329
+ _getRenderedServiceElements(e, r, t) {
330
+ return t ? t?.map((i) => {
331
+ const a = i.icon ? h(i.icon, this._language.current) : null, s = this.getCalculatedDimension(i.dimension), o = this.getCalculatedPosition(i.position), l = i.rotation || 0, b = this.alignVertical ? l - 90 : l, c = `popover-trigger-${r}-${e}-${o.x}-${o.y}`;
322
332
  return n`
323
333
  <sbb-seat-reservation-graphic
324
- id="${b}"
334
+ id="${c}"
325
335
  style=${_({
326
- "--sbb-seat-reservation-graphic-width": t.w,
327
- "--sbb-seat-reservation-graphic-height": t.h,
328
- "--sbb-seat-reservation-graphic-top": i.y,
329
- "--sbb-seat-reservation-graphic-left": i.x,
336
+ "--sbb-seat-reservation-graphic-width": s.w,
337
+ "--sbb-seat-reservation-graphic-height": s.h,
338
+ "--sbb-seat-reservation-graphic-top": o.y,
339
+ "--sbb-seat-reservation-graphic-left": o.x,
330
340
  "--sbb-seat-reservation-graphic-position": "absolute",
331
- "--sbb-seat-reservation-graphic-rotation": c
341
+ "--sbb-seat-reservation-graphic-rotation": b
332
342
  })}
333
343
  class="sbb-seat-reservation-graphic--cursor-pointer"
334
- name=${o.icon ?? g}
344
+ name=${i.icon ?? u}
335
345
  role="img"
336
346
  aria-hidden="true"
337
347
  ></sbb-seat-reservation-graphic>
338
- ${this._popover(b, a)}
348
+ ${this._popover(c, a)}
339
349
  `;
340
350
  }) : null;
341
351
  }
@@ -376,34 +386,36 @@ let Y = (() => {
376
386
  this.shadowRoot?.querySelectorAll("sbb-popover:is(:state(state-opened),[state--state-opened])").forEach((e) => e.close());
377
387
  }
378
388
  _getDescriptionTableCoach(e) {
389
+ if (e.type === "LOCOMOTIVE_COACH")
390
+ return h("COACH_LOCOMOTIVE", this._language.current);
379
391
  if (!e.places?.length)
380
392
  return h("COACH_BLOCKED_TABLE_CAPTION", this._language.current, [
381
393
  e.id
382
394
  ]);
383
395
  let r;
384
- const s = this._getTitleDescriptionListString(e.graphicElements), o = this._getTitleDescriptionListString(e.serviceElements);
396
+ const t = this._getTitleDescriptionListString(e.graphicElements), i = this._getTitleDescriptionListString(e.serviceElements);
385
397
  if (r = h("COACH_TABLE_CAPTION", this._language.current, [
386
398
  e.id
387
399
  ]), !this.hasNavigation) {
388
- const a = this.getAvailableFreePlacesNumFromCoach(e.places), t = h("COACH_AVAILABLE_NUMBER_OF_PLACES", this._language.current, [a.seats, a.bicycles]);
389
- r = r.concat(". ").concat(t).concat(". ");
400
+ const a = this.getAvailableFreePlacesNumFromCoach(e.places), s = h("COACH_AVAILABLE_NUMBER_OF_PLACES", this._language.current, [a.seats, a.bicycles]);
401
+ r = r.concat(". ").concat(s).concat(". ");
390
402
  }
391
- return (s || o) && (r += ". " + h("COACH_AVAILABLE_SERVICES", this._language.current) + ": ", r += o + ", " + s + "."), r;
403
+ return (t || i) && (r += ". " + h("COACH_AVAILABLE_SERVICES", this._language.current) + ": ", r += i + ", " + t + "."), r;
392
404
  }
393
405
  _getTitleDescriptionListString(e) {
394
406
  const r = [];
395
- return e?.map((s) => {
396
- const o = s.icon;
397
- if (!o)
407
+ return e?.map((t) => {
408
+ const i = t.icon;
409
+ if (!i)
398
410
  return null;
399
- const a = r.indexOf(o) > -1, t = h(s.icon, this._language.current), i = this._notFixedRotatableAreaIcons.indexOf(o) === -1 && this.notAreaElements.indexOf(o) === -1;
400
- return a || r.push(s.icon), t && !a && i ? t : null;
401
- }).filter((s) => !!s).join(", ");
411
+ const a = r.indexOf(i) > -1, s = h(t.icon, this._language.current), o = this._notFixedRotatableAreaIcons.indexOf(i) === -1 && this.notAreaElements.indexOf(i) === -1;
412
+ return a || r.push(t.icon), s && !a && o ? s : null;
413
+ }).filter((t) => !!t).join(", ");
402
414
  }
403
415
  }, d = p, (() => {
404
- const e = typeof Symbol == "function" && Symbol.metadata ? Object.create($[Symbol.metadata] ?? null) : void 0;
405
- y(null, w = { value: d }, k, { kind: "class", name: d.name, metadata: e }, null, x), d = w.value, e && Object.defineProperty(d, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
406
- })(), p.styles = [S, T], C(d, x), d;
416
+ const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(C[Symbol.metadata] ?? null) : void 0;
417
+ k(null, w = { value: d }, $, { kind: "class", name: d.name, metadata: e }, null, x), d = w.value, e && Object.defineProperty(d, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
418
+ })(), p.styles = [S, D], y(d, x), d;
407
419
  })();
408
420
  export {
409
421
  Y as SbbSeatReservationElement