@sbb-esta/lyne-elements-experimental-dev 4.13.1-dev.1781015180 → 5.0.0-dev.1781073747
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/_index.scss +2 -0
- package/autocomplete-grid/_autocomplete-grid.global.scss +14 -0
- package/autocomplete-grid/autocomplete-grid/autocomplete-grid.component.js +16 -19
- package/autocomplete-grid/autocomplete-grid-button/autocomplete-grid-button.component.js +42 -71
- package/autocomplete-grid/autocomplete-grid-cell/autocomplete-grid-cell.component.js +1 -1
- package/autocomplete-grid/autocomplete-grid-optgroup/autocomplete-grid-optgroup.component.js +1 -1
- package/autocomplete-grid/autocomplete-grid-option/autocomplete-grid-option.component.js +1 -1
- package/autocomplete-grid/autocomplete-grid-row/autocomplete-grid-row.component.js +1 -1
- package/{autocomplete-grid-cell.component-D-Kk9HwQ.js → autocomplete-grid-cell.component-79IjA__I.js} +6 -7
- package/autocomplete-grid-option.component-DUFBhQwI.js +35 -0
- package/{autocomplete-grid-row.component-57jjeZWF.js → autocomplete-grid-row.component-B3U15Rwa.js} +7 -8
- package/autocomplete-grid.js +3 -3
- package/autocomplete-grid.pure.js +3 -3
- package/core/datetime/date-helper.js +1 -1
- package/core/styles/_theme.scss +19 -0
- package/core/styles/lean-off-brand-theme.scss +3 -0
- package/core/styles/lean-safety-theme.scss +3 -0
- package/core/timetable/access-leg-helper.js +27 -27
- package/core.js +5 -0
- package/custom-elements.json +5096 -5162
- package/{date-helper-NgYaHPR7.js → date-helper-DNzMLcyb.js} +1 -1
- package/development/autocomplete-grid/autocomplete-grid/autocomplete-grid.component.d.ts +1 -1
- package/development/autocomplete-grid/autocomplete-grid/autocomplete-grid.component.d.ts.map +1 -1
- package/development/autocomplete-grid/autocomplete-grid/autocomplete-grid.component.js +7 -10
- package/development/autocomplete-grid/autocomplete-grid-button/autocomplete-grid-button.component.d.ts +2 -2
- package/development/autocomplete-grid/autocomplete-grid-button/autocomplete-grid-button.component.d.ts.map +1 -1
- package/development/autocomplete-grid/autocomplete-grid-button/autocomplete-grid-button.component.js +55 -89
- package/development/autocomplete-grid/autocomplete-grid-cell/autocomplete-grid-cell.component.d.ts +1 -1
- package/development/autocomplete-grid/autocomplete-grid-cell/autocomplete-grid-cell.component.d.ts.map +1 -1
- package/development/autocomplete-grid/autocomplete-grid-cell/autocomplete-grid-cell.component.js +1 -1
- package/development/autocomplete-grid/autocomplete-grid-optgroup/autocomplete-grid-optgroup.component.d.ts +1 -1
- package/development/autocomplete-grid/autocomplete-grid-optgroup/autocomplete-grid-optgroup.component.d.ts.map +1 -1
- package/development/autocomplete-grid/autocomplete-grid-optgroup/autocomplete-grid-optgroup.component.js +2 -2
- package/development/autocomplete-grid/autocomplete-grid-option/autocomplete-grid-option.component.d.ts +1 -2
- package/development/autocomplete-grid/autocomplete-grid-option/autocomplete-grid-option.component.d.ts.map +1 -1
- package/development/autocomplete-grid/autocomplete-grid-option/autocomplete-grid-option.component.js +1 -1
- package/development/autocomplete-grid/autocomplete-grid-row/autocomplete-grid-row.component.d.ts +1 -1
- package/development/autocomplete-grid/autocomplete-grid-row/autocomplete-grid-row.component.d.ts.map +1 -1
- package/development/autocomplete-grid/autocomplete-grid-row/autocomplete-grid-row.component.js +1 -1
- package/development/autocomplete-grid-cell.component-BbdELDro.js +33 -0
- package/development/autocomplete-grid-option.component-C7WuqRit.js +57 -0
- package/development/{autocomplete-grid-row.component-CvF3ZWDZ.js → autocomplete-grid-row.component-DoXbOsQM.js} +3 -4
- package/development/autocomplete-grid.js +4 -4
- package/development/autocomplete-grid.pure.js +3 -3
- package/development/core/datetime/date-helper.js +1 -1
- package/development/core/timetable/access-leg-helper.d.ts.map +1 -1
- package/development/core/timetable/access-leg-helper.js +3 -3
- package/development/core.d.ts +6 -0
- package/development/core.d.ts.map +1 -0
- package/development/core.js +5 -0
- package/development/{date-helper-QhWjANc3.js → date-helper-BcTDWVeP.js} +2 -2
- package/development/journey-summary/journey-summary.component.d.ts +4 -4
- package/development/journey-summary/journey-summary.component.d.ts.map +1 -1
- package/development/journey-summary/journey-summary.component.js +1 -1
- package/development/journey-summary.component-BsC7wBIn.js +341 -0
- package/development/journey-summary.js +1 -1
- package/development/journey-summary.pure.js +1 -1
- package/development/pearl-chain/pearl-chain.component.d.ts +2 -2
- package/development/pearl-chain/pearl-chain.component.d.ts.map +1 -1
- package/development/pearl-chain/pearl-chain.component.js +1 -1
- package/development/pearl-chain-time/pearl-chain-time.component.d.ts +3 -2
- package/development/pearl-chain-time/pearl-chain-time.component.d.ts.map +1 -1
- package/development/pearl-chain-time/pearl-chain-time.component.js +1 -1
- package/development/{pearl-chain-time.component-BMHLITah.js → pearl-chain-time.component-C-CuC1ke.js} +11 -13
- package/development/pearl-chain-time.js +1 -1
- package/development/pearl-chain-time.pure.js +1 -1
- package/development/pearl-chain-vertical/pearl-chain-vertical.component.d.ts +1 -1
- package/development/pearl-chain-vertical/pearl-chain-vertical.component.d.ts.map +1 -1
- package/development/pearl-chain-vertical/pearl-chain-vertical.component.js +1 -1
- package/development/pearl-chain-vertical-item/pearl-chain-vertical-item.component.d.ts +1 -1
- package/development/pearl-chain-vertical-item/pearl-chain-vertical-item.component.d.ts.map +1 -1
- package/development/pearl-chain-vertical-item/pearl-chain-vertical-item.component.js +1 -1
- package/development/{pearl-chain-vertical-item.component-JYDWs8ta.js → pearl-chain-vertical-item.component-CLu9QrqJ.js} +4 -6
- package/development/pearl-chain-vertical-item.js +1 -1
- package/development/pearl-chain-vertical-item.pure.js +1 -1
- package/development/pearl-chain-vertical.component-DbPz5k_R.js +30 -0
- package/development/pearl-chain-vertical.js +1 -1
- package/development/pearl-chain-vertical.pure.js +1 -1
- package/development/{pearl-chain.component-DUAGFkcu.js → pearl-chain.component-10OsJZIX.js} +7 -11
- package/development/pearl-chain.js +1 -1
- package/development/pearl-chain.pure.js +1 -1
- package/development/seat-reservation/common/translations/i18n.d.ts.map +1 -1
- package/development/seat-reservation/common/translations/i18n.js +1 -1
- package/development/seat-reservation/seat-reservation/seat-reservation-base-element.d.ts +12 -2
- package/development/seat-reservation/seat-reservation/seat-reservation-base-element.d.ts.map +1 -1
- package/development/seat-reservation/seat-reservation/seat-reservation-base-element.js +35 -20
- package/development/seat-reservation/seat-reservation/seat-reservation.component.d.ts +2 -0
- package/development/seat-reservation/seat-reservation/seat-reservation.component.d.ts.map +1 -1
- package/development/seat-reservation/seat-reservation/seat-reservation.component.js +1 -1
- package/development/seat-reservation/seat-reservation-area/seat-reservation-area.component.d.ts +1 -1
- package/development/seat-reservation/seat-reservation-area/seat-reservation-area.component.d.ts.map +1 -1
- package/development/seat-reservation/seat-reservation-area/seat-reservation-area.component.js +1 -1
- package/development/seat-reservation/seat-reservation-graphic/seat-reservation-graphic.component.d.ts +2 -1
- package/development/seat-reservation/seat-reservation-graphic/seat-reservation-graphic.component.d.ts.map +1 -1
- package/development/seat-reservation/seat-reservation-graphic/seat-reservation-graphic.component.js +1 -1
- package/development/seat-reservation/seat-reservation-navigation-coach/seat-reservation-navigation-coach.component.d.ts +8 -3
- package/development/seat-reservation/seat-reservation-navigation-coach/seat-reservation-navigation-coach.component.d.ts.map +1 -1
- package/development/seat-reservation/seat-reservation-navigation-coach/seat-reservation-navigation-coach.component.js +2 -2
- package/development/seat-reservation/seat-reservation-navigation-services/seat-reservation-navigation-services.component.d.ts +2 -1
- package/development/seat-reservation/seat-reservation-navigation-services/seat-reservation-navigation-services.component.d.ts.map +1 -1
- package/development/seat-reservation/seat-reservation-navigation-services/seat-reservation-navigation-services.component.js +1 -1
- package/development/seat-reservation/seat-reservation-place-control/seat-reservation-place-control.component.d.ts +9 -3
- package/development/seat-reservation/seat-reservation-place-control/seat-reservation-place-control.component.d.ts.map +1 -1
- package/development/seat-reservation/seat-reservation-place-control/seat-reservation-place-control.component.js +2 -2
- package/development/seat-reservation/seat-reservation-scoped/seat-reservation-scoped.component.d.ts +1 -1
- package/development/seat-reservation/seat-reservation-scoped/seat-reservation-scoped.component.d.ts.map +1 -1
- package/development/seat-reservation/seat-reservation-scoped/seat-reservation-scoped.component.js +1 -1
- package/development/{seat-reservation-area.component-dG1GXJQP.js → seat-reservation-area.component-DPhQJFid.js} +4 -6
- package/development/{seat-reservation-graphic.component-BmhZpVL0.js → seat-reservation-graphic.component-0LYsmerm.js} +9 -9
- package/development/seat-reservation-navigation-coach.component-B97jKD7Y.js +438 -0
- package/development/{seat-reservation-navigation-services.component-B2uWa_VN.js → seat-reservation-navigation-services.component-Cx0Is97w.js} +11 -11
- package/development/{seat-reservation-place-control.component-CdL6yPUZ.js → seat-reservation-place-control.component-DaL1g8WH.js} +24 -17
- package/development/{seat-reservation-scoped.component-CJCkuKGz.js → seat-reservation-scoped.component-BHbORVsR.js} +3 -4
- package/development/seat-reservation.component-DI9pSlzt.js +473 -0
- package/development/seat-reservation.js +10 -11
- package/development/seat-reservation.pure.d.ts +0 -1
- package/development/seat-reservation.pure.d.ts.map +1 -1
- package/development/seat-reservation.pure.js +9 -10
- package/development/timetable-duration/timetable-duration.component.d.ts +1 -1
- package/development/timetable-duration/timetable-duration.component.d.ts.map +1 -1
- package/development/timetable-duration/timetable-duration.component.js +1 -1
- package/development/timetable-duration.component-Chk5D4Is.js +96 -0
- package/development/timetable-duration.js +1 -1
- package/development/timetable-duration.pure.js +1 -1
- package/development/timetable-row/timetable-row.component.d.ts +3 -2
- package/development/timetable-row/timetable-row.component.d.ts.map +1 -1
- package/development/timetable-row/timetable-row.component.js +1 -1
- package/development/timetable-row.component-nzrQzxL6.js +736 -0
- package/development/timetable-row.js +1 -1
- package/development/timetable-row.pure.js +1 -1
- package/journey-summary/journey-summary.component.js +1 -1
- package/{journey-summary.component-DyTUTCOU.js → journey-summary.component-DNoO3OCf.js} +42 -41
- package/journey-summary.js +1 -1
- package/journey-summary.pure.js +1 -1
- package/lean-safety-theme.css +13 -0
- package/lean-theme.css +13 -0
- package/package.json +22 -85
- package/pearl-chain/pearl-chain.component.js +1 -1
- package/pearl-chain-time/pearl-chain-time.component.js +1 -1
- package/{pearl-chain-time.component-DXe2o6S1.js → pearl-chain-time.component-BuvA6IE1.js} +42 -44
- package/pearl-chain-time.js +1 -1
- package/pearl-chain-time.pure.js +1 -1
- package/pearl-chain-vertical/pearl-chain-vertical.component.js +1 -1
- package/pearl-chain-vertical-item/pearl-chain-vertical-item.component.js +1 -1
- package/{pearl-chain-vertical-item.component-Bby13csG.js → pearl-chain-vertical-item.component-QZ4s8Jbv.js} +33 -35
- package/pearl-chain-vertical-item.js +1 -1
- package/pearl-chain-vertical-item.pure.js +1 -1
- package/pearl-chain-vertical.component-Dc3vaHsQ.js +20 -0
- package/pearl-chain-vertical.js +1 -1
- package/pearl-chain-vertical.pure.js +1 -1
- package/{pearl-chain.component-CPaCcW_1.js → pearl-chain.component-DtGXXkY6.js} +29 -33
- package/pearl-chain.js +1 -1
- package/pearl-chain.pure.js +1 -1
- package/seat-reservation/seat-reservation/seat-reservation-base-element.js +87 -75
- package/seat-reservation/seat-reservation/seat-reservation.component.js +1 -1
- package/seat-reservation/seat-reservation-area/seat-reservation-area.component.js +1 -1
- package/seat-reservation/seat-reservation-graphic/seat-reservation-graphic.component.js +1 -1
- package/seat-reservation/seat-reservation-navigation-coach/seat-reservation-navigation-coach.component.js +2 -2
- package/seat-reservation/seat-reservation-navigation-services/seat-reservation-navigation-services.component.js +1 -1
- package/seat-reservation/seat-reservation-place-control/seat-reservation-place-control.component.js +2 -2
- package/seat-reservation/seat-reservation-scoped/seat-reservation-scoped.component.js +1 -1
- package/{seat-reservation-area.component-DZsXvaMQ.js → seat-reservation-area.component-G9lHb7S8.js} +20 -22
- package/{seat-reservation-graphic.component-BnJuHVZQ.js → seat-reservation-graphic.component-BXFcQDxY.js} +26 -26
- package/seat-reservation-navigation-coach.component-BXy8EkJe.js +338 -0
- package/{seat-reservation-navigation-services.component-6ECATtWB.js → seat-reservation-navigation-services.component-49XmV9rv.js} +30 -33
- package/{seat-reservation-place-control.component-kx07J_YK.js → seat-reservation-place-control.component-DToIW328.js} +64 -62
- package/{seat-reservation-scoped.component-L1wMt65t.js → seat-reservation-scoped.component-D8dAmrP7.js} +6 -7
- package/seat-reservation.component--0XnrCkk.js +372 -0
- package/seat-reservation.js +10 -11
- package/seat-reservation.pure.js +9 -10
- package/timetable-duration/timetable-duration.component.js +1 -1
- package/timetable-duration.component-iMCvh1zr.js +61 -0
- package/timetable-duration.js +1 -1
- package/timetable-duration.pure.js +1 -1
- package/timetable-row/timetable-row.component.js +1 -1
- package/timetable-row.component-mNKmhRmP.js +566 -0
- package/timetable-row.js +1 -1
- package/timetable-row.pure.js +1 -1
- package/autocomplete-grid/autocomplete-grid-button.js +0 -4
- package/autocomplete-grid/autocomplete-grid-cell.js +0 -4
- package/autocomplete-grid/autocomplete-grid-optgroup.js +0 -4
- package/autocomplete-grid/autocomplete-grid-option.js +0 -4
- package/autocomplete-grid/autocomplete-grid-row.js +0 -4
- package/autocomplete-grid/autocomplete-grid.js +0 -4
- package/autocomplete-grid-option.component-qBUSf0mD.js +0 -37
- package/core/datetime.js +0 -2
- package/core/styles/core.scss +0 -13
- package/core/styles/theme.scss +0 -5
- package/core/timetable.js +0 -4
- package/development/autocomplete-grid/autocomplete-grid-button.d.ts +0 -2
- package/development/autocomplete-grid/autocomplete-grid-button.d.ts.map +0 -1
- package/development/autocomplete-grid/autocomplete-grid-button.js +0 -10
- package/development/autocomplete-grid/autocomplete-grid-cell.d.ts +0 -2
- package/development/autocomplete-grid/autocomplete-grid-cell.d.ts.map +0 -1
- package/development/autocomplete-grid/autocomplete-grid-cell.js +0 -10
- package/development/autocomplete-grid/autocomplete-grid-optgroup.d.ts +0 -2
- package/development/autocomplete-grid/autocomplete-grid-optgroup.d.ts.map +0 -1
- package/development/autocomplete-grid/autocomplete-grid-optgroup.js +0 -10
- package/development/autocomplete-grid/autocomplete-grid-option.d.ts +0 -2
- package/development/autocomplete-grid/autocomplete-grid-option.d.ts.map +0 -1
- package/development/autocomplete-grid/autocomplete-grid-option.js +0 -10
- package/development/autocomplete-grid/autocomplete-grid-row.d.ts +0 -2
- package/development/autocomplete-grid/autocomplete-grid-row.d.ts.map +0 -1
- package/development/autocomplete-grid/autocomplete-grid-row.js +0 -10
- package/development/autocomplete-grid/autocomplete-grid.d.ts +0 -2
- package/development/autocomplete-grid/autocomplete-grid.d.ts.map +0 -1
- package/development/autocomplete-grid/autocomplete-grid.js +0 -10
- package/development/autocomplete-grid-cell.component-CTC6s1q3.js +0 -34
- package/development/autocomplete-grid-option.component-DqkLWHcg.js +0 -61
- package/development/core/datetime.d.ts +0 -3
- package/development/core/datetime.d.ts.map +0 -1
- package/development/core/datetime.js +0 -2
- package/development/core/timetable.d.ts +0 -5
- package/development/core/timetable.d.ts.map +0 -1
- package/development/core/timetable.js +0 -4
- package/development/journey-summary.component-BTaPGCGZ.js +0 -340
- package/development/pearl-chain-vertical.component-YYXS_74c.js +0 -31
- package/development/seat-reservation/common.d.ts +0 -6
- package/development/seat-reservation/common.d.ts.map +0 -1
- package/development/seat-reservation/common.js +0 -12
- package/development/seat-reservation/seat-reservation-area.d.ts +0 -2
- package/development/seat-reservation/seat-reservation-area.d.ts.map +0 -1
- package/development/seat-reservation/seat-reservation-area.js +0 -10
- package/development/seat-reservation/seat-reservation-graphic/seat-reservation-assets.d.ts +0 -9
- package/development/seat-reservation/seat-reservation-graphic/seat-reservation-assets.d.ts.map +0 -1
- package/development/seat-reservation/seat-reservation-graphic/seat-reservation-assets.js +0 -306
- package/development/seat-reservation/seat-reservation-graphic.d.ts +0 -2
- package/development/seat-reservation/seat-reservation-graphic.d.ts.map +0 -1
- package/development/seat-reservation/seat-reservation-graphic.js +0 -10
- package/development/seat-reservation/seat-reservation-navigation-coach.d.ts +0 -2
- package/development/seat-reservation/seat-reservation-navigation-coach.d.ts.map +0 -1
- package/development/seat-reservation/seat-reservation-navigation-coach.js +0 -10
- package/development/seat-reservation/seat-reservation-navigation-services.d.ts +0 -2
- package/development/seat-reservation/seat-reservation-navigation-services.d.ts.map +0 -1
- package/development/seat-reservation/seat-reservation-navigation-services.js +0 -10
- package/development/seat-reservation/seat-reservation-place-control.d.ts +0 -2
- package/development/seat-reservation/seat-reservation-place-control.d.ts.map +0 -1
- package/development/seat-reservation/seat-reservation-place-control.js +0 -10
- package/development/seat-reservation/seat-reservation-scoped.d.ts +0 -2
- package/development/seat-reservation/seat-reservation-scoped.d.ts.map +0 -1
- package/development/seat-reservation/seat-reservation-scoped.js +0 -10
- package/development/seat-reservation/seat-reservation.d.ts +0 -3
- package/development/seat-reservation/seat-reservation.d.ts.map +0 -1
- package/development/seat-reservation/seat-reservation.js +0 -11
- package/development/seat-reservation-navigation-coach.component-Be9CBw62.js +0 -428
- package/development/seat-reservation.component-B4BxXyLr.js +0 -464
- package/development/timetable-duration.component-CXF0oJbO.js +0 -100
- package/development/timetable-row.component-BCufuA05.js +0 -729
- package/pearl-chain-vertical.component-0EgQ4knk.js +0 -21
- package/seat-reservation/common.js +0 -9
- package/seat-reservation/seat-reservation-area.js +0 -4
- package/seat-reservation/seat-reservation-graphic/seat-reservation-assets.js +0 -291
- package/seat-reservation/seat-reservation-graphic.js +0 -4
- package/seat-reservation/seat-reservation-navigation-coach.js +0 -4
- package/seat-reservation/seat-reservation-navigation-services.js +0 -4
- package/seat-reservation/seat-reservation-place-control.js +0 -4
- package/seat-reservation/seat-reservation-scoped.js +0 -4
- package/seat-reservation/seat-reservation.js +0 -5
- package/seat-reservation-navigation-coach.component-DgdpqMzG.js +0 -333
- package/seat-reservation.component-B_T6eTf6.js +0 -360
- package/timetable-duration.component-Bqo5N_De.js +0 -65
- package/timetable-row.component-a5CWXLAQ.js +0 -559
- /package/{core.css → lean-off-brand-theme.css} +0 -0
|
@@ -1,24 +1,22 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import { property as c } from "lit/decorators.js";
|
|
7
|
-
import { styleMap as l } from "lit/directives/style-map.js";
|
|
1
|
+
import { SbbElement as e, forceType as t } from "@sbb-esta/lyne-elements/core.js";
|
|
2
|
+
import { html as n, nothing as r, unsafeCSS as i } from "lit";
|
|
3
|
+
import { __esDecorate as a, __runInitializers as o } from "tslib";
|
|
4
|
+
import { property as s } from "lit/decorators.js";
|
|
5
|
+
import { styleMap as c } from "lit/directives/style-map.js";
|
|
8
6
|
//#region src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.scss?inline
|
|
9
|
-
var u = ":host{--sbb-pearl-chain-position-color: var(--sbb-color-primary);--sbb-pearl-chain-bullet-size-start-end: .625rem;--sbb-pearl-chain-bullet-size-stop: .5rem;--sbb-pearl-chain-bullet-color: var(--sbb-background-color-3-inverted);--sbb-pearl-chain-bullet-color-past: var(--sbb-color-metal);--sbb-pearl-chain-bullet-color-past: light-dark(var(--sbb-color-metal), var(--sbb-color-granite));--sbb-pearl-chain-bullet-color-irrelevant: var(--sbb-color-metal);--sbb-pearl-chain-bullet-color-irrelevant: light-dark( var(--sbb-color-metal), var(--sbb-color-granite) );--sbb-pearl-chain-bullet-color-disruption: var(--sbb-color-error);--sbb-pearl-chain-bullet-border-width: var(--sbb-border-width-2x);--sbb-pearl-chain-bullet-animation-duration: 1.92s;--sbb-pearl-chain-bullet-animation-easing: ease-out;--sbb-pearl-chain-bullet-crossed-width: .88375rem;--sbb-pearl-chain-bullet-crossed-height: .21875rem;--sbb-pearl-chain-bullet-crossed-border-width: .09375rem;display:table-row;position:relative;--sbb-pearl-chain-vertical-right-item-width: 100%;--sbb-pearl-chain-vertical-middle-item-min-width: var(--sbb-pearl-chain-bullet-size-start-end);--sbb-pearl-chain-vertical-item-border-width: var(--sbb-border-width-2x);--sbb-pearl-chain-vertical-item-border-width-thin: var(--sbb-border-width-1x);--sbb-pearl-chain-vertical-item-spacing-small: var(--sbb-spacing-fixed-1x);--sbb-pearl-chain-vertical-item-color-default: var(--sbb-pearl-chain-bullet-color);--sbb-pearl-chain-vertical-item-color-disruption: var(--sbb-pearl-chain-bullet-color-disruption);--sbb-pearl-chain-vertical-item-color-past: var(--sbb-pearl-chain-bullet-color-past);--sbb-pearl-chain-vertical-item-color-walk: var(--sbb-color-sky);--sbb-pearl-chain-vertical-item-inline-start: 50%;--sbb-pearl-chain-vertical-item-transform: translateX(-50%)}slot[name=right],.sbb-pearl-chain-vertical-item__column{display:table-cell;position:relative;vertical-align:top}slot[name=right]{width:var(--sbb-pearl-chain-vertical-right-item-width)}.sbb-pearl-chain-vertical-item__column--middle{min-width:var(--sbb-pearl-chain-vertical-middle-item-min-width, --sbb-pearl-chain-vertical-middle-min-width)}slot[name=left]::slotted(*){margin-block-start:var(--sbb-pearl-chain-vertical-left-item-block-start);padding-inline-end:var(--sbb-pearl-chain-vertical-left-item-inline-end)}slot[name=right]::slotted(*){margin-block-start:var(--sbb-pearl-chain-vertical-right-item-block-start);padding-inline-start:var(--sbb-pearl-chain-vertical-right-item-inline-start)}.sbb-pearl-chain-vertical-item__middle{vertical-align:top;border-spacing:0}.sbb-pearl-chain-vertical-item__line{position:absolute;bottom:0;inset-inline-start:var(--sbb-pearl-chain-vertical-item-inline-start);transform:var(--sbb-pearl-chain-vertical-item-transform);width:var(--sbb-border-width-2x);inset-block-start:calc(var(--sbb-pearl-chain-bullet-size-start-end) / 2)}.sbb-pearl-chain-vertical-item__line:after{content:\"\";position:absolute;inset-inline-start:0;inset-block-start:0;height:var(--sbb-pearl-chain-vertical-item-leg-status);width:var(--sbb-pearl-chain-vertical-item-border-width);background-color:var(--sbb-pearl-chain-vertical-item-color-past)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__line:after{--sbb-pearl-chain-vertical-item-color-past: GrayText}}.sbb-pearl-chain-vertical-item__line--dotted{background-color:unset;border-color:unset;background-image:linear-gradient(to bottom,currentcolor 0%,currentcolor 50%,Canvas 50%);background-repeat:repeat-y;background-size:calc(2 * var(--sbb-pearl-chain-vertical-item-spacing-small)) var(--sbb-pearl-chain-vertical-item-spacing-small)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__line--dotted{background-color:unset!important;border-inline-start:.0625rem dashed Highlight;transform:translateY(.0625rem)}}.sbb-pearl-chain-vertical-item__line--thin{width:var(--sbb-pearl-chain-vertical-item-border-width-thin)}.sbb-pearl-chain-vertical-item__line--default{background-color:var(--sbb-pearl-chain-vertical-item-color-default);border-color:var(--sbb-pearl-chain-vertical-item-color-default);color:var(--sbb-pearl-chain-vertical-item-color-default)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__line--default{--sbb-pearl-chain-vertical-item-color-default: CanvasText}}.sbb-pearl-chain-vertical-item__line--disruption{border-color:var(--sbb-pearl-chain-vertical-item-color-disruption);background-color:var(--sbb-pearl-chain-vertical-item-color-disruption);color:var(--sbb-pearl-chain-vertical-item-color-disruption)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__line--disruption{--sbb-pearl-chain-vertical-item-color-disruption: Highlight}}.sbb-pearl-chain-vertical-item__line--past{border-color:var(--sbb-pearl-chain-vertical-item-color-past);background-color:var(--sbb-pearl-chain-vertical-item-color-past);color:var(--sbb-pearl-chain-vertical-item-color-past)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__line--past{--sbb-pearl-chain-vertical-item-color-past: GrayText}}.sbb-pearl-chain-vertical-item__line--walk{border-color:var(--sbb-pearl-chain-vertical-item-color-walk);background-color:var(--sbb-pearl-chain-vertical-item-color-walk);color:var(--sbb-pearl-chain-vertical-item-color-walk)}.sbb-pearl-chain-vertical-item__bullet{position:relative;inset-inline-start:var(--sbb-pearl-chain-vertical-item-inline-start);transform:var(--sbb-pearl-chain-vertical-item-transform);background:var(--sbb-pearl-chain-bullet-color);color:var(--sbb-pearl-chain-bullet-color);border-color:var(--sbb-pearl-chain-bullet-color);border-radius:100%}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__bullet{--sbb-pearl-chain-bullet-color: CanvasText}}.sbb-pearl-chain-vertical-item__bullet--start-end{min-height:var(--sbb-pearl-chain-bullet-size-start-end);min-width:var(--sbb-pearl-chain-bullet-size-start-end);height:var(--sbb-pearl-chain-bullet-size-start-end);width:var(--sbb-pearl-chain-bullet-size-start-end)}.sbb-pearl-chain-vertical-item__bullet--stop{min-height:var(--sbb-pearl-chain-bullet-size-stop);min-width:var(--sbb-pearl-chain-bullet-size-stop);height:var(--sbb-pearl-chain-bullet-size-stop);width:var(--sbb-pearl-chain-bullet-size-stop);border:var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;background:Canvas}.sbb-pearl-chain-vertical-item__bullet--disruption{--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-disruption)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__bullet--disruption{--sbb-pearl-chain-bullet-color: Highlight}}.sbb-pearl-chain-vertical-item__bullet--irrelevant,.sbb-pearl-chain-vertical-item__bullet--past{--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-past)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__bullet--irrelevant,.sbb-pearl-chain-vertical-item__bullet--past{--sbb-pearl-chain-bullet-color: GrayText !important}}.sbb-pearl-chain-vertical-item__bullet--stop.sbb-pearl-chain-vertical-item__bullet--irrelevant{--sbb-pearl-chain-bullet-border-width: var(--sbb-border-width-1x);min-height:var(--sbb-pearl-chain-bullet-size-stop);min-width:var(--sbb-pearl-chain-bullet-size-stop);height:var(--sbb-pearl-chain-bullet-size-stop);width:var(--sbb-pearl-chain-bullet-size-stop);border:var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;background:Canvas}.sbb-pearl-chain-vertical-item__bullet--start-end.sbb-pearl-chain-vertical-item__bullet--skipped{border:var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;background:Canvas}.sbb-pearl-chain-vertical-item__bullet--start-end.sbb-pearl-chain-vertical-item__bullet--skipped:before{content:\"\";position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%) rotate(45deg);border-block-start:var(--sbb-pearl-chain-bullet-crossed-border-width) solid canvas;background:var(--sbb-pearl-chain-bullet-color-disruption);height:var(--sbb-pearl-chain-bullet-crossed-height);width:var(--sbb-pearl-chain-bullet-crossed-width)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__bullet--start-end.sbb-pearl-chain-vertical-item__bullet--skipped:before{background:Highlight}}.sbb-pearl-chain-vertical-item__bullet--stop.sbb-pearl-chain-vertical-item__bullet--skipped{--sbb-pearl-chain-bullet-crossed-width: .706875rem;--sbb-pearl-chain-bullet-crossed-height: .1875rem;min-height:var(--sbb-pearl-chain-bullet-size-stop);min-width:var(--sbb-pearl-chain-bullet-size-stop);height:var(--sbb-pearl-chain-bullet-size-stop);width:var(--sbb-pearl-chain-bullet-size-stop);border:var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;background:Canvas}.sbb-pearl-chain-vertical-item__bullet--stop.sbb-pearl-chain-vertical-item__bullet--skipped:before{content:\"\";position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%) rotate(45deg);border-block-start:var(--sbb-pearl-chain-bullet-crossed-border-width) solid canvas;background:var(--sbb-pearl-chain-bullet-color-disruption);height:var(--sbb-pearl-chain-bullet-crossed-height);width:var(--sbb-pearl-chain-bullet-crossed-width)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__bullet--stop.sbb-pearl-chain-vertical-item__bullet--skipped:before{background:Highlight}}.sbb-pearl-chain-vertical-item__bullet--position{inset-block-start:var(--sbb-pearl-chain-vertical-item-position);position:absolute;left:50%;translate:-50% 0;min-height:var(--sbb-pearl-chain-bullet-size-start-end);min-width:var(--sbb-pearl-chain-bullet-size-start-end);height:var(--sbb-pearl-chain-bullet-size-start-end);width:var(--sbb-pearl-chain-bullet-size-start-end);background:var(--sbb-pearl-chain-bullet-color);color:var(--sbb-pearl-chain-bullet-color);border-color:var(--sbb-pearl-chain-bullet-color);border-radius:100%}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__bullet--position{--sbb-pearl-chain-bullet-color: CanvasText}}.sbb-pearl-chain-vertical-item__bullet--position{--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-position-color)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__bullet--position{--sbb-pearl-chain-position-color: Highlight}}@keyframes pearl-chain-bullet-position-pulse{0%{box-shadow:0 0 0 0 var(--sbb-pearl-chain-position-color)}25%{box-shadow:0 0 0 0 var(--sbb-pearl-chain-position-color)}50%{box-shadow:0 0 0 .1875rem color-mix(in srgb,var(--sbb-pearl-chain-position-color) 20%,transparent)}to{box-shadow:0 0 0 0 var(--sbb-pearl-chain-position-color)}}.sbb-pearl-chain-vertical-item__bullet--position{animation:pearl-chain-bullet-position-pulse var(--sbb-pearl-chain-bullet-animation-duration) var(--sbb-pearl-chain-bullet-animation-easing) infinite}:host([disable-animation]) .sbb-pearl-chain-vertical-item__bullet--position{animation:unset!important}", d = (() => {
|
|
10
|
-
let
|
|
11
|
-
return class extends
|
|
7
|
+
var l = ":host{--sbb-pearl-chain-position-color: var(--sbb-color-primary);--sbb-pearl-chain-bullet-size-start-end: .625rem;--sbb-pearl-chain-bullet-size-stop: .5rem;--sbb-pearl-chain-bullet-color: var(--sbb-background-color-3-inverted);--sbb-pearl-chain-bullet-color-past: var(--sbb-color-metal);--sbb-pearl-chain-bullet-color-past: light-dark(var(--sbb-color-metal), var(--sbb-color-granite));--sbb-pearl-chain-bullet-color-irrelevant: var(--sbb-color-metal);--sbb-pearl-chain-bullet-color-irrelevant: light-dark( var(--sbb-color-metal), var(--sbb-color-granite) );--sbb-pearl-chain-bullet-color-disruption: var(--sbb-color-error);--sbb-pearl-chain-bullet-border-width: var(--sbb-border-width-2x);--sbb-pearl-chain-bullet-animation-duration: 1.92s;--sbb-pearl-chain-bullet-animation-easing: ease-out;--sbb-pearl-chain-bullet-crossed-width: .88375rem;--sbb-pearl-chain-bullet-crossed-height: .21875rem;--sbb-pearl-chain-bullet-crossed-border-width: .09375rem;display:table-row;position:relative;--sbb-pearl-chain-vertical-right-item-width: 100%;--sbb-pearl-chain-vertical-middle-item-min-width: var(--sbb-pearl-chain-bullet-size-start-end);--sbb-pearl-chain-vertical-item-border-width: var(--sbb-border-width-2x);--sbb-pearl-chain-vertical-item-border-width-thin: var(--sbb-border-width-1x);--sbb-pearl-chain-vertical-item-spacing-small: var(--sbb-spacing-fixed-1x);--sbb-pearl-chain-vertical-item-color-default: var(--sbb-pearl-chain-bullet-color);--sbb-pearl-chain-vertical-item-color-disruption: var(--sbb-pearl-chain-bullet-color-disruption);--sbb-pearl-chain-vertical-item-color-past: var(--sbb-pearl-chain-bullet-color-past);--sbb-pearl-chain-vertical-item-color-walk: var(--sbb-color-sky);--sbb-pearl-chain-vertical-item-inline-start: 50%;--sbb-pearl-chain-vertical-item-transform: translateX(-50%)}slot[name=right],.sbb-pearl-chain-vertical-item__column{display:table-cell;position:relative;vertical-align:top}slot[name=right]{width:var(--sbb-pearl-chain-vertical-right-item-width)}.sbb-pearl-chain-vertical-item__column--middle{min-width:var(--sbb-pearl-chain-vertical-middle-item-min-width, --sbb-pearl-chain-vertical-middle-min-width)}slot[name=left]::slotted(*){margin-block-start:var(--sbb-pearl-chain-vertical-left-item-block-start);padding-inline-end:var(--sbb-pearl-chain-vertical-left-item-inline-end)}slot[name=right]::slotted(*){margin-block-start:var(--sbb-pearl-chain-vertical-right-item-block-start);padding-inline-start:var(--sbb-pearl-chain-vertical-right-item-inline-start)}.sbb-pearl-chain-vertical-item__middle{vertical-align:top;border-spacing:0}.sbb-pearl-chain-vertical-item__line{position:absolute;bottom:0;inset-inline-start:var(--sbb-pearl-chain-vertical-item-inline-start);transform:var(--sbb-pearl-chain-vertical-item-transform);width:var(--sbb-border-width-2x);inset-block-start:calc(var(--sbb-pearl-chain-bullet-size-start-end) / 2)}.sbb-pearl-chain-vertical-item__line:after{content:\"\";position:absolute;inset-inline-start:0;inset-block-start:0;height:var(--sbb-pearl-chain-vertical-item-leg-status);width:var(--sbb-pearl-chain-vertical-item-border-width);background-color:var(--sbb-pearl-chain-vertical-item-color-past)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__line:after{--sbb-pearl-chain-vertical-item-color-past: GrayText}}.sbb-pearl-chain-vertical-item__line--dotted{background-color:unset;border-color:unset;background-image:linear-gradient(to bottom,currentcolor 0%,currentcolor 50%,Canvas 50%);background-repeat:repeat-y;background-size:calc(2 * var(--sbb-pearl-chain-vertical-item-spacing-small)) var(--sbb-pearl-chain-vertical-item-spacing-small)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__line--dotted{background-color:unset!important;border-inline-start:.0625rem dashed Highlight;transform:translateY(.0625rem)}}.sbb-pearl-chain-vertical-item__line--thin{width:var(--sbb-pearl-chain-vertical-item-border-width-thin)}.sbb-pearl-chain-vertical-item__line--default{background-color:var(--sbb-pearl-chain-vertical-item-color-default);border-color:var(--sbb-pearl-chain-vertical-item-color-default);color:var(--sbb-pearl-chain-vertical-item-color-default)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__line--default{--sbb-pearl-chain-vertical-item-color-default: CanvasText}}.sbb-pearl-chain-vertical-item__line--disruption{border-color:var(--sbb-pearl-chain-vertical-item-color-disruption);background-color:var(--sbb-pearl-chain-vertical-item-color-disruption);color:var(--sbb-pearl-chain-vertical-item-color-disruption)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__line--disruption{--sbb-pearl-chain-vertical-item-color-disruption: Highlight}}.sbb-pearl-chain-vertical-item__line--past{border-color:var(--sbb-pearl-chain-vertical-item-color-past);background-color:var(--sbb-pearl-chain-vertical-item-color-past);color:var(--sbb-pearl-chain-vertical-item-color-past)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__line--past{--sbb-pearl-chain-vertical-item-color-past: GrayText}}.sbb-pearl-chain-vertical-item__line--walk{border-color:var(--sbb-pearl-chain-vertical-item-color-walk);background-color:var(--sbb-pearl-chain-vertical-item-color-walk);color:var(--sbb-pearl-chain-vertical-item-color-walk)}.sbb-pearl-chain-vertical-item__bullet{position:relative;inset-inline-start:var(--sbb-pearl-chain-vertical-item-inline-start);transform:var(--sbb-pearl-chain-vertical-item-transform);background:var(--sbb-pearl-chain-bullet-color);color:var(--sbb-pearl-chain-bullet-color);border-color:var(--sbb-pearl-chain-bullet-color);border-radius:100%}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__bullet{--sbb-pearl-chain-bullet-color: CanvasText}}.sbb-pearl-chain-vertical-item__bullet--start-end{min-height:var(--sbb-pearl-chain-bullet-size-start-end);min-width:var(--sbb-pearl-chain-bullet-size-start-end);height:var(--sbb-pearl-chain-bullet-size-start-end);width:var(--sbb-pearl-chain-bullet-size-start-end)}.sbb-pearl-chain-vertical-item__bullet--stop{min-height:var(--sbb-pearl-chain-bullet-size-stop);min-width:var(--sbb-pearl-chain-bullet-size-stop);height:var(--sbb-pearl-chain-bullet-size-stop);width:var(--sbb-pearl-chain-bullet-size-stop);border:var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;background:Canvas}.sbb-pearl-chain-vertical-item__bullet--disruption{--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-disruption)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__bullet--disruption{--sbb-pearl-chain-bullet-color: Highlight}}.sbb-pearl-chain-vertical-item__bullet--irrelevant,.sbb-pearl-chain-vertical-item__bullet--past{--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-past)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__bullet--irrelevant,.sbb-pearl-chain-vertical-item__bullet--past{--sbb-pearl-chain-bullet-color: GrayText !important}}.sbb-pearl-chain-vertical-item__bullet--stop.sbb-pearl-chain-vertical-item__bullet--irrelevant{--sbb-pearl-chain-bullet-border-width: var(--sbb-border-width-1x);min-height:var(--sbb-pearl-chain-bullet-size-stop);min-width:var(--sbb-pearl-chain-bullet-size-stop);height:var(--sbb-pearl-chain-bullet-size-stop);width:var(--sbb-pearl-chain-bullet-size-stop);border:var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;background:Canvas}.sbb-pearl-chain-vertical-item__bullet--start-end.sbb-pearl-chain-vertical-item__bullet--skipped{border:var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;background:Canvas}.sbb-pearl-chain-vertical-item__bullet--start-end.sbb-pearl-chain-vertical-item__bullet--skipped:before{content:\"\";position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%) rotate(45deg);border-block-start:var(--sbb-pearl-chain-bullet-crossed-border-width) solid canvas;background:var(--sbb-pearl-chain-bullet-color-disruption);height:var(--sbb-pearl-chain-bullet-crossed-height);width:var(--sbb-pearl-chain-bullet-crossed-width)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__bullet--start-end.sbb-pearl-chain-vertical-item__bullet--skipped:before{background:Highlight}}.sbb-pearl-chain-vertical-item__bullet--stop.sbb-pearl-chain-vertical-item__bullet--skipped{--sbb-pearl-chain-bullet-crossed-width: .706875rem;--sbb-pearl-chain-bullet-crossed-height: .1875rem;min-height:var(--sbb-pearl-chain-bullet-size-stop);min-width:var(--sbb-pearl-chain-bullet-size-stop);height:var(--sbb-pearl-chain-bullet-size-stop);width:var(--sbb-pearl-chain-bullet-size-stop);border:var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;background:Canvas}.sbb-pearl-chain-vertical-item__bullet--stop.sbb-pearl-chain-vertical-item__bullet--skipped:before{content:\"\";position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%) rotate(45deg);border-block-start:var(--sbb-pearl-chain-bullet-crossed-border-width) solid canvas;background:var(--sbb-pearl-chain-bullet-color-disruption);height:var(--sbb-pearl-chain-bullet-crossed-height);width:var(--sbb-pearl-chain-bullet-crossed-width)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__bullet--stop.sbb-pearl-chain-vertical-item__bullet--skipped:before{background:Highlight}}.sbb-pearl-chain-vertical-item__bullet--position{inset-block-start:var(--sbb-pearl-chain-vertical-item-position);position:absolute;left:50%;translate:-50% 0;min-height:var(--sbb-pearl-chain-bullet-size-start-end);min-width:var(--sbb-pearl-chain-bullet-size-start-end);height:var(--sbb-pearl-chain-bullet-size-start-end);width:var(--sbb-pearl-chain-bullet-size-start-end);background:var(--sbb-pearl-chain-bullet-color);color:var(--sbb-pearl-chain-bullet-color);border-color:var(--sbb-pearl-chain-bullet-color);border-radius:100%}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__bullet--position{--sbb-pearl-chain-bullet-color: CanvasText}}.sbb-pearl-chain-vertical-item__bullet--position{--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-position-color)}@media(forced-colors:active){.sbb-pearl-chain-vertical-item__bullet--position{--sbb-pearl-chain-position-color: Highlight}}@keyframes pearl-chain-bullet-position-pulse{0%{box-shadow:0 0 0 0 var(--sbb-pearl-chain-position-color)}25%{box-shadow:0 0 0 0 var(--sbb-pearl-chain-position-color)}50%{box-shadow:0 0 0 .1875rem color-mix(in srgb,var(--sbb-pearl-chain-position-color) 20%,transparent)}to{box-shadow:0 0 0 0 var(--sbb-pearl-chain-position-color)}}.sbb-pearl-chain-vertical-item__bullet--position{animation:pearl-chain-bullet-position-pulse var(--sbb-pearl-chain-bullet-animation-duration) var(--sbb-pearl-chain-bullet-animation-easing) infinite}:host([disable-animation]) .sbb-pearl-chain-vertical-item__bullet--position{animation:unset!important}", u = (() => {
|
|
8
|
+
let u = e, d, f = [], p = [], m, h = [], g = [];
|
|
9
|
+
return class extends u {
|
|
12
10
|
static {
|
|
13
|
-
let
|
|
14
|
-
|
|
11
|
+
let e = typeof Symbol == "function" && Symbol.metadata ? Object.create(u[Symbol.metadata] ?? null) : void 0;
|
|
12
|
+
d = [s({
|
|
15
13
|
attribute: "pearl-chain-vertical-item-attributes",
|
|
16
14
|
type: Object
|
|
17
|
-
})],
|
|
15
|
+
})], m = [t(), s({
|
|
18
16
|
attribute: "disable-animation",
|
|
19
17
|
reflect: !0,
|
|
20
18
|
type: Boolean
|
|
21
|
-
})],
|
|
19
|
+
})], a(this, null, d, {
|
|
22
20
|
kind: "accessor",
|
|
23
21
|
name: "pearlChainVerticalItemAttributes",
|
|
24
22
|
static: !1,
|
|
@@ -30,8 +28,8 @@ var u = ":host{--sbb-pearl-chain-position-color: var(--sbb-color-primary);--sbb-
|
|
|
30
28
|
e.pearlChainVerticalItemAttributes = t;
|
|
31
29
|
}
|
|
32
30
|
},
|
|
33
|
-
metadata:
|
|
34
|
-
},
|
|
31
|
+
metadata: e
|
|
32
|
+
}, f, p), a(this, null, m, {
|
|
35
33
|
kind: "accessor",
|
|
36
34
|
name: "disableAnimation",
|
|
37
35
|
static: !1,
|
|
@@ -43,28 +41,28 @@ var u = ":host{--sbb-pearl-chain-position-color: var(--sbb-color-primary);--sbb-
|
|
|
43
41
|
e.disableAnimation = t;
|
|
44
42
|
}
|
|
45
43
|
},
|
|
46
|
-
metadata:
|
|
47
|
-
},
|
|
44
|
+
metadata: e
|
|
45
|
+
}, h, g), e && Object.defineProperty(this, Symbol.metadata, {
|
|
48
46
|
enumerable: !0,
|
|
49
47
|
configurable: !0,
|
|
50
48
|
writable: !0,
|
|
51
|
-
value:
|
|
49
|
+
value: e
|
|
52
50
|
});
|
|
53
51
|
}
|
|
54
52
|
static {
|
|
55
53
|
this.elementName = "sbb-pearl-chain-vertical-item";
|
|
56
54
|
}
|
|
57
55
|
static {
|
|
58
|
-
this.styles = [i
|
|
56
|
+
this.styles = [i(l)];
|
|
59
57
|
}
|
|
60
|
-
#e =
|
|
58
|
+
#e = o(this, f, null);
|
|
61
59
|
get pearlChainVerticalItemAttributes() {
|
|
62
60
|
return this.#e;
|
|
63
61
|
}
|
|
64
62
|
set pearlChainVerticalItemAttributes(e) {
|
|
65
63
|
this.#e = e;
|
|
66
64
|
}
|
|
67
|
-
#t = (
|
|
65
|
+
#t = (o(this, p), o(this, h, !1));
|
|
68
66
|
get disableAnimation() {
|
|
69
67
|
return this.#t;
|
|
70
68
|
}
|
|
@@ -72,11 +70,11 @@ var u = ":host{--sbb-pearl-chain-position-color: var(--sbb-color-primary);--sbb-
|
|
|
72
70
|
this.#t = e;
|
|
73
71
|
}
|
|
74
72
|
render() {
|
|
75
|
-
let { bulletType: e, lineType: t, lineColor:
|
|
76
|
-
return
|
|
73
|
+
let { bulletType: e, lineType: t, lineColor: i, hideLine: a, minHeight: o, bulletSize: s, position: l } = this.pearlChainVerticalItemAttributes || {}, u = l && l > 0 && l <= 100 ? "sbb-pearl-chain-vertical-item__bullet--past" : `sbb-pearl-chain-vertical-item__bullet--${e}`;
|
|
74
|
+
return n`
|
|
77
75
|
<div
|
|
78
76
|
class="sbb-pearl-chain-vertical-item__column"
|
|
79
|
-
style=${
|
|
77
|
+
style=${c({ height: `${o}px` })}
|
|
80
78
|
>
|
|
81
79
|
<slot name="left"></slot>
|
|
82
80
|
</div>
|
|
@@ -84,25 +82,25 @@ var u = ":host{--sbb-pearl-chain-position-color: var(--sbb-color-primary);--sbb-
|
|
|
84
82
|
aria-hidden="true"
|
|
85
83
|
class="sbb-pearl-chain-vertical-item__column sbb-pearl-chain-vertical-item__column--middle"
|
|
86
84
|
>
|
|
87
|
-
${
|
|
88
|
-
style=${
|
|
89
|
-
class="sbb-pearl-chain-vertical-item__line sbb-pearl-chain-vertical-item__line--${t} sbb-pearl-chain-vertical-item__line--${
|
|
85
|
+
${a ? r : n`<div
|
|
86
|
+
style=${c({ "--sbb-pearl-chain-vertical-item-leg-status": `${l}%` })}
|
|
87
|
+
class="sbb-pearl-chain-vertical-item__line sbb-pearl-chain-vertical-item__line--${t} sbb-pearl-chain-vertical-item__line--${i}"
|
|
90
88
|
></div>`}
|
|
91
|
-
${e ?
|
|
89
|
+
${e ? n`<div
|
|
92
90
|
class="sbb-pearl-chain-vertical-item__bullet sbb-pearl-chain-vertical-item__bullet--${s} ${u}"
|
|
93
|
-
></div>` :
|
|
94
|
-
${
|
|
95
|
-
style=${
|
|
91
|
+
></div>` : r}
|
|
92
|
+
${l && l > 0 ? n`<div
|
|
93
|
+
style=${c({ "--sbb-pearl-chain-vertical-item-position": `${l}%` })}
|
|
96
94
|
class="sbb-pearl-chain-vertical-item__bullet--position"
|
|
97
|
-
></div>` :
|
|
95
|
+
></div>` : r}
|
|
98
96
|
</div>
|
|
99
97
|
<slot name="right"></slot>
|
|
100
98
|
`;
|
|
101
99
|
}
|
|
102
100
|
constructor() {
|
|
103
|
-
super(...arguments),
|
|
101
|
+
super(...arguments), o(this, g);
|
|
104
102
|
}
|
|
105
103
|
};
|
|
106
104
|
})();
|
|
107
105
|
//#endregion
|
|
108
|
-
export {
|
|
106
|
+
export { u as t };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { t as e } from "./pearl-chain-vertical-item.component-
|
|
1
|
+
import { t as e } from "./pearl-chain-vertical-item.component-QZ4s8Jbv.js";
|
|
2
2
|
import "./pearl-chain-vertical-item.pure.js";
|
|
3
3
|
//#region src/elements-experimental/pearl-chain-vertical-item.ts
|
|
4
4
|
e.define();
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as e } from "./pearl-chain-vertical-item.component-
|
|
1
|
+
import { t as e } from "./pearl-chain-vertical-item.component-QZ4s8Jbv.js";
|
|
2
2
|
export { e as SbbPearlChainVerticalItemElement };
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { SbbElement as e } from "@sbb-esta/lyne-elements/core.js";
|
|
2
|
+
import { html as t, unsafeCSS as n } from "lit";
|
|
3
|
+
//#region src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.scss?inline
|
|
4
|
+
var r = ":host{--sbb-pearl-chain-vertical-width: 100%;display:block}.sbb-pearl-chain-vertical{display:table;width:var(--sbb-pearl-chain-vertical-width)}", i = class extends e {
|
|
5
|
+
static {
|
|
6
|
+
this.elementName = "sbb-pearl-chain-vertical";
|
|
7
|
+
}
|
|
8
|
+
static {
|
|
9
|
+
this.styles = [n(r)];
|
|
10
|
+
}
|
|
11
|
+
render() {
|
|
12
|
+
return t`
|
|
13
|
+
<div class="sbb-pearl-chain-vertical">
|
|
14
|
+
<slot></slot>
|
|
15
|
+
</div>
|
|
16
|
+
`;
|
|
17
|
+
}
|
|
18
|
+
};
|
|
19
|
+
//#endregion
|
|
20
|
+
export { i as t };
|
package/pearl-chain-vertical.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as e } from "./pearl-chain-vertical.component-
|
|
1
|
+
import { t as e } from "./pearl-chain-vertical.component-Dc3vaHsQ.js";
|
|
2
2
|
export { e as SbbPearlChainVerticalElement };
|
|
@@ -1,14 +1,10 @@
|
|
|
1
1
|
import { t as e } from "./toDate-BhNUyM4s.js";
|
|
2
2
|
import { r as t, t as n } from "./differenceInMinutes-BAZ-Fham.js";
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import { boxSizingStyles as s } from "@sbb-esta/lyne-elements/core/styles.js";
|
|
7
|
-
import { html as c, nothing as l, unsafeCSS as u } from "lit";
|
|
8
|
-
import { defaultDateAdapter as d } from "@sbb-esta/lyne-elements/core/datetime.js";
|
|
3
|
+
import { SbbElement as r, defaultDateAdapter as i, forceType as a, screenReaderOnlyStyles as o } from "@sbb-esta/lyne-elements/core.js";
|
|
4
|
+
import { html as s, nothing as c, unsafeCSS as l } from "lit";
|
|
5
|
+
import { __esDecorate as u, __runInitializers as d } from "tslib";
|
|
9
6
|
import { property as f } from "lit/decorators.js";
|
|
10
|
-
import {
|
|
11
|
-
import { isRideLeg as m } from "./core/timetable.js";
|
|
7
|
+
import { isRideLeg as p, removeTimezoneFromISOTimeString as m } from "./core.js";
|
|
12
8
|
import { styleMap as h } from "lit/directives/style-map.js";
|
|
13
9
|
//#region node_modules/date-fns/isAfter.js
|
|
14
10
|
function g(t, n) {
|
|
@@ -21,18 +17,18 @@ function _(t, n) {
|
|
|
21
17
|
}
|
|
22
18
|
//#endregion
|
|
23
19
|
//#region src/elements-experimental/pearl-chain/pearl-chain.scss?inline
|
|
24
|
-
var v = ":host{--sbb-pearl-chain-height: var(--sbb-border-width-2x);--sbb-pearl-chain-spacing-small: .125rem;--sbb-pearl-chain-color: var(--sbb-pearl-chain-bullet-color);--sbb-pearl-chain-color-disruption: var(--sbb-pearl-chain-bullet-color-disruption);--sbb-pearl-chain-color-past: var(--sbb-pearl-chain-bullet-color-past);--sbb-pearl-chain-leg-width: 100%;display:block;--sbb-pearl-chain-position-color: var(--sbb-color-primary);--sbb-pearl-chain-bullet-size-start-end: .625rem;--sbb-pearl-chain-bullet-size-stop: .5rem;--sbb-pearl-chain-bullet-color: var(--sbb-background-color-3-inverted);--sbb-pearl-chain-bullet-color-past: var(--sbb-color-metal);--sbb-pearl-chain-bullet-color-past: light-dark(var(--sbb-color-metal), var(--sbb-color-granite));--sbb-pearl-chain-bullet-color-irrelevant: var(--sbb-color-metal);--sbb-pearl-chain-bullet-color-irrelevant: light-dark( var(--sbb-color-metal), var(--sbb-color-granite) );--sbb-pearl-chain-bullet-color-disruption: var(--sbb-color-error);--sbb-pearl-chain-bullet-border-width: var(--sbb-border-width-2x);--sbb-pearl-chain-bullet-animation-duration: 1.92s;--sbb-pearl-chain-bullet-animation-easing: ease-out;--sbb-pearl-chain-bullet-crossed-width: .88375rem;--sbb-pearl-chain-bullet-crossed-height: .21875rem;--sbb-pearl-chain-bullet-crossed-border-width: .09375rem}.sbb-pearl-chain{position:relative;display:flex;justify-content:space-between;flex-wrap:nowrap;color:var(--sbb-pearl-chain-color);width:100%;padding-block:calc((var(--sbb-pearl-chain-bullet-size-start-end) - var(--sbb-pearl-chain-height)) / 2);padding-inline-end:var(--sbb-pearl-chain-bullet-size-start-end)}.sbb-pearl-chain__bullet{min-height:var(--sbb-pearl-chain-bullet-size-start-end);min-width:var(--sbb-pearl-chain-bullet-size-start-end);height:var(--sbb-pearl-chain-bullet-size-start-end);width:var(--sbb-pearl-chain-bullet-size-start-end);background:var(--sbb-pearl-chain-bullet-color);color:var(--sbb-pearl-chain-bullet-color);border-color:var(--sbb-pearl-chain-bullet-color);border-radius:100%}@media(forced-colors:active){.sbb-pearl-chain__bullet{--sbb-pearl-chain-bullet-color: CanvasText}}.sbb-pearl-chain__bullet{content:\"\";position:absolute;background-color:currentcolor;inset-block-start:0;z-index:3}.sbb-pearl-chain__bullet:first-of-type{inset-inline-start:0}.sbb-pearl-chain__bullet:last-of-type{inset-inline-end:0}.sbb-pearl-chain__leg{flex-shrink:0;flex-grow:0;position:relative;height:var(--sbb-pearl-chain-height);border-inline-end:var(--sbb-pearl-chain-spacing-small) solid Canvas;background-color:currentcolor;width:var(--sbb-pearl-chain-leg-width);display:flex;align-items:center}@media(forced-colors:active){.sbb-pearl-chain__leg{background-color:CanvasText}.sbb-pearl-chain--past .sbb-pearl-chain__leg{background-color:GrayText}}.sbb-pearl-chain__leg:last-of-type{border:none}.sbb-pearl-chain__stop{position:relative;z-index:2;background:var(--sbb-pearl-chain-bullet-color);color:var(--sbb-pearl-chain-bullet-color);border-color:var(--sbb-pearl-chain-bullet-color);border-radius:100%}@media(forced-colors:active){.sbb-pearl-chain__stop{--sbb-pearl-chain-bullet-color: CanvasText}}.sbb-pearl-chain__stop{min-height:var(--sbb-pearl-chain-bullet-size-stop);min-width:var(--sbb-pearl-chain-bullet-size-stop);height:var(--sbb-pearl-chain-bullet-size-stop);width:var(--sbb-pearl-chain-bullet-size-stop);border:var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;background:Canvas}.sbb-pearl-chain__bullet--future{background:var(--sbb-pearl-chain-bullet-color);color:var(--sbb-pearl-chain-bullet-color);border-color:var(--sbb-pearl-chain-bullet-color);border-radius:100%}@media(forced-colors:active){.sbb-pearl-chain__bullet--future{--sbb-pearl-chain-bullet-color: CanvasText}}.sbb-pearl-chain__leg--past,.sbb-pearl-chain--past,.sbb-pearl-chain__leg--past:after,.sbb-pearl-chain__leg--progress:after,.sbb-pearl-chain__leg--progress .sbb-pearl-chain__stop,.sbb-pearl-chain--progress,.sbb-pearl-chain__bullet--past{color:var(--sbb-pearl-chain-color-past);--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-past)}@media(forced-colors:active){.sbb-pearl-chain__leg--past,.sbb-pearl-chain--past,.sbb-pearl-chain__leg--past:after,.sbb-pearl-chain__leg--progress:after,.sbb-pearl-chain__leg--progress .sbb-pearl-chain__stop,.sbb-pearl-chain--progress,.sbb-pearl-chain__bullet--past{--sbb-pearl-chain-bullet-color: GrayText !important}}@media(forced-colors:active){.sbb-pearl-chain__leg--past,.sbb-pearl-chain--past,.sbb-pearl-chain__leg--past:after,.sbb-pearl-chain__leg--progress:after,.sbb-pearl-chain__leg--progress .sbb-pearl-chain__stop,.sbb-pearl-chain--progress,.sbb-pearl-chain__bullet--past{background-color:GrayText!important}}.sbb-pearl-chain__bullet--progress{background:var(--sbb-pearl-chain-bullet-color);--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-past)}@media(forced-colors:active){.sbb-pearl-chain__bullet--progress{--sbb-pearl-chain-bullet-color: GrayText !important}}.sbb-pearl-chain__bullet--departure-disruption,.sbb-pearl-chain--arrival-disruption,.sbb-pearl-chain--departure-disruption,.sbb-pearl-chain__leg--disruption{color:var(--sbb-pearl-chain-color-disruption);--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-disruption)}@media(forced-colors:active){.sbb-pearl-chain__bullet--departure-disruption,.sbb-pearl-chain--arrival-disruption,.sbb-pearl-chain--departure-disruption,.sbb-pearl-chain__leg--disruption{--sbb-pearl-chain-bullet-color: Highlight}}@media(forced-colors:active){.sbb-pearl-chain__bullet--departure-disruption,.sbb-pearl-chain--arrival-disruption,.sbb-pearl-chain--departure-disruption,.sbb-pearl-chain__leg--disruption{color:Highlight;background:Highlight}}.sbb-pearl-chain__leg--disruption .sbb-pearl-chain__stop{--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-disruption)}@media(forced-colors:active){.sbb-pearl-chain__leg--disruption .sbb-pearl-chain__stop{--sbb-pearl-chain-bullet-color: Highlight}}.sbb-pearl-chain__leg--past .sbb-pearl-chain__stop{--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-past)}@media(forced-colors:active){.sbb-pearl-chain__leg--past .sbb-pearl-chain__stop{--sbb-pearl-chain-bullet-color: GrayText !important}}.sbb-pearl-chain__leg--disruption:after{background-color:unset;background-image:linear-gradient(to right,currentcolor 0%,currentcolor 50%,Canvas 50%);background-repeat:repeat-x;background-size:calc(2 * var(--sbb-pearl-chain-spacing-small)) var(--sbb-pearl-chain-height);inset-inline-end:var(--sbb-pearl-chain-height)}@media(forced-colors:active){.sbb-pearl-chain__leg--disruption:after{background:unset;border-block-start:.0625rem dashed Highlight;transform:translateY(.0625rem)}}.sbb-pearl-chain__leg--skipped{color:var(--sbb-pearl-chain-color-disruption)}.sbb-pearl-chain__leg--skipped:after{background-color:unset;background-image:linear-gradient(to right,currentcolor 0%,currentcolor 50%,Canvas 50%);background-repeat:repeat-x;background-size:calc(2 * var(--sbb-pearl-chain-spacing-small)) var(--sbb-pearl-chain-height);inset-inline-end:var(--sbb-pearl-chain-height)}@media(forced-colors:active){.sbb-pearl-chain__leg--skipped:after{background:unset;border-block-start:.0625rem dashed Highlight;transform:translateY(.0625rem)}}.sbb-pearl-chain__stop--departure-skipped{min-height:var(--sbb-pearl-chain-bullet-size-stop);min-width:var(--sbb-pearl-chain-bullet-size-stop);height:var(--sbb-pearl-chain-bullet-size-stop);width:var(--sbb-pearl-chain-bullet-size-stop);border:var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;background:Canvas}.sbb-pearl-chain__stop--departure-skipped:before{content:\"\";position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%) rotate(45deg);border-block-start:var(--sbb-pearl-chain-bullet-crossed-border-width) solid canvas;background:var(--sbb-pearl-chain-bullet-color-disruption);height:var(--sbb-pearl-chain-bullet-crossed-height);width:var(--sbb-pearl-chain-bullet-crossed-width)}@media(forced-colors:active){.sbb-pearl-chain__stop--departure-skipped:before{background:Highlight}}.sbb-pearl-chain--arrival-skipped,.sbb-pearl-chain--departure-skipped{min-height:var(--sbb-pearl-chain-bullet-size-start-end);min-width:var(--sbb-pearl-chain-bullet-size-start-end);height:var(--sbb-pearl-chain-bullet-size-start-end);width:var(--sbb-pearl-chain-bullet-size-start-end);border:var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;background:Canvas}.sbb-pearl-chain--arrival-skipped:before,.sbb-pearl-chain--departure-skipped:before{content:\"\";position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%) rotate(45deg);border-block-start:var(--sbb-pearl-chain-bullet-crossed-border-width) solid canvas;background:var(--sbb-pearl-chain-bullet-color-disruption);height:var(--sbb-pearl-chain-bullet-crossed-height);width:var(--sbb-pearl-chain-bullet-crossed-width)}@media(forced-colors:active){.sbb-pearl-chain--arrival-skipped:before,.sbb-pearl-chain--departure-skipped:before{background:Highlight}}.sbb-pearl-chain__leg:after{content:\"\";position:absolute;inset-block:0;inset-inline-start:0;background-color:currentcolor;border-radius:var(--sbb-pearl-chain-height);z-index:1}@media(forced-colors:active){.sbb-pearl-chain__leg:after{background-color:CanvasText}.sbb-pearl-chain--past .sbb-pearl-chain__leg:after{background-color:GrayText}}.sbb-pearl-chain__leg:last-of-type:after{inset-inline-end:calc(-1 * var(--sbb-pearl-chain-height))}.sbb-pearl-chain__leg--progress:after{background-color:var(--sbb-pearl-chain-color-past);width:var(--sbb-pearl-chain-leg-status)}.sbb-pearl-chain__position{min-height:var(--sbb-pearl-chain-bullet-size-start-end);min-width:var(--sbb-pearl-chain-bullet-size-start-end);height:var(--sbb-pearl-chain-bullet-size-start-end);width:var(--sbb-pearl-chain-bullet-size-start-end);background:var(--sbb-pearl-chain-bullet-color);color:var(--sbb-pearl-chain-bullet-color);border-color:var(--sbb-pearl-chain-bullet-color);border-radius:100%}@media(forced-colors:active){.sbb-pearl-chain__position{--sbb-pearl-chain-bullet-color: CanvasText}}.sbb-pearl-chain__position{--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-position-color)}@media(forced-colors:active){.sbb-pearl-chain__position{--sbb-pearl-chain-position-color: Highlight}}@keyframes pearl-chain-bullet-position-pulse{0%{box-shadow:0 0 0 0 var(--sbb-pearl-chain-position-color)}25%{box-shadow:0 0 0 0 var(--sbb-pearl-chain-position-color)}50%{box-shadow:0 0 0 .1875rem color-mix(in srgb,var(--sbb-pearl-chain-position-color) 20%,transparent)}to{box-shadow:0 0 0 0 var(--sbb-pearl-chain-position-color)}}.sbb-pearl-chain__position{animation:pearl-chain-bullet-position-pulse var(--sbb-pearl-chain-bullet-animation-duration) var(--sbb-pearl-chain-bullet-animation-easing) infinite;position:absolute;inset-block-start:-200%;z-index:4;inset-inline-start:var(--sbb-pearl-chain-status-position)}.sbb-pearl-chain__position--no-animation{animation:unset}.sbb-screen-reader-only{border:0;clip-path:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}", y = (() => {
|
|
25
|
-
let e =
|
|
20
|
+
var v = ":host{--sbb-pearl-chain-height: var(--sbb-border-width-2x);--sbb-pearl-chain-spacing-small: .125rem;--sbb-pearl-chain-color: var(--sbb-pearl-chain-bullet-color);--sbb-pearl-chain-color-disruption: var(--sbb-pearl-chain-bullet-color-disruption);--sbb-pearl-chain-color-past: var(--sbb-pearl-chain-bullet-color-past);--sbb-pearl-chain-leg-width: 100%;display:block;--sbb-pearl-chain-position-color: var(--sbb-color-primary);--sbb-pearl-chain-bullet-size-start-end: .625rem;--sbb-pearl-chain-bullet-size-stop: .5rem;--sbb-pearl-chain-bullet-color: var(--sbb-background-color-3-inverted);--sbb-pearl-chain-bullet-color-past: var(--sbb-color-metal);--sbb-pearl-chain-bullet-color-past: light-dark(var(--sbb-color-metal), var(--sbb-color-granite));--sbb-pearl-chain-bullet-color-irrelevant: var(--sbb-color-metal);--sbb-pearl-chain-bullet-color-irrelevant: light-dark( var(--sbb-color-metal), var(--sbb-color-granite) );--sbb-pearl-chain-bullet-color-disruption: var(--sbb-color-error);--sbb-pearl-chain-bullet-border-width: var(--sbb-border-width-2x);--sbb-pearl-chain-bullet-animation-duration: 1.92s;--sbb-pearl-chain-bullet-animation-easing: ease-out;--sbb-pearl-chain-bullet-crossed-width: .88375rem;--sbb-pearl-chain-bullet-crossed-height: .21875rem;--sbb-pearl-chain-bullet-crossed-border-width: .09375rem}.sbb-pearl-chain{position:relative;display:flex;justify-content:space-between;flex-wrap:nowrap;color:var(--sbb-pearl-chain-color);width:100%;padding-block:calc((var(--sbb-pearl-chain-bullet-size-start-end) - var(--sbb-pearl-chain-height)) / 2);padding-inline-end:var(--sbb-pearl-chain-bullet-size-start-end)}.sbb-pearl-chain__bullet{min-height:var(--sbb-pearl-chain-bullet-size-start-end);min-width:var(--sbb-pearl-chain-bullet-size-start-end);height:var(--sbb-pearl-chain-bullet-size-start-end);width:var(--sbb-pearl-chain-bullet-size-start-end);background:var(--sbb-pearl-chain-bullet-color);color:var(--sbb-pearl-chain-bullet-color);border-color:var(--sbb-pearl-chain-bullet-color);border-radius:100%}@media(forced-colors:active){.sbb-pearl-chain__bullet{--sbb-pearl-chain-bullet-color: CanvasText}}.sbb-pearl-chain__bullet{content:\"\";position:absolute;background-color:currentcolor;inset-block-start:0;z-index:3}.sbb-pearl-chain__bullet:first-of-type{inset-inline-start:0}.sbb-pearl-chain__bullet:last-of-type{inset-inline-end:0}.sbb-pearl-chain__leg{flex-shrink:0;flex-grow:0;position:relative;height:var(--sbb-pearl-chain-height);border-inline-end:var(--sbb-pearl-chain-spacing-small) solid Canvas;background-color:currentcolor;width:var(--sbb-pearl-chain-leg-width);display:flex;align-items:center}@media(forced-colors:active){.sbb-pearl-chain__leg{background-color:CanvasText}.sbb-pearl-chain--past .sbb-pearl-chain__leg{background-color:GrayText}}.sbb-pearl-chain__leg:last-of-type{border:none}.sbb-pearl-chain__stop{position:relative;z-index:2;background:var(--sbb-pearl-chain-bullet-color);color:var(--sbb-pearl-chain-bullet-color);border-color:var(--sbb-pearl-chain-bullet-color);border-radius:100%}@media(forced-colors:active){.sbb-pearl-chain__stop{--sbb-pearl-chain-bullet-color: CanvasText}}.sbb-pearl-chain__stop{min-height:var(--sbb-pearl-chain-bullet-size-stop);min-width:var(--sbb-pearl-chain-bullet-size-stop);height:var(--sbb-pearl-chain-bullet-size-stop);width:var(--sbb-pearl-chain-bullet-size-stop);border:var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;background:Canvas}.sbb-pearl-chain__bullet--future{background:var(--sbb-pearl-chain-bullet-color);color:var(--sbb-pearl-chain-bullet-color);border-color:var(--sbb-pearl-chain-bullet-color);border-radius:100%}@media(forced-colors:active){.sbb-pearl-chain__bullet--future{--sbb-pearl-chain-bullet-color: CanvasText}}.sbb-pearl-chain__leg--past,.sbb-pearl-chain--past,.sbb-pearl-chain__leg--past:after,.sbb-pearl-chain__leg--progress:after,.sbb-pearl-chain__leg--progress .sbb-pearl-chain__stop,.sbb-pearl-chain--progress,.sbb-pearl-chain__bullet--past{color:var(--sbb-pearl-chain-color-past);--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-past)}@media(forced-colors:active){.sbb-pearl-chain__leg--past,.sbb-pearl-chain--past,.sbb-pearl-chain__leg--past:after,.sbb-pearl-chain__leg--progress:after,.sbb-pearl-chain__leg--progress .sbb-pearl-chain__stop,.sbb-pearl-chain--progress,.sbb-pearl-chain__bullet--past{--sbb-pearl-chain-bullet-color: GrayText !important}}@media(forced-colors:active){.sbb-pearl-chain__leg--past,.sbb-pearl-chain--past,.sbb-pearl-chain__leg--past:after,.sbb-pearl-chain__leg--progress:after,.sbb-pearl-chain__leg--progress .sbb-pearl-chain__stop,.sbb-pearl-chain--progress,.sbb-pearl-chain__bullet--past{background-color:GrayText!important}}.sbb-pearl-chain__bullet--progress{background:var(--sbb-pearl-chain-bullet-color);--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-past)}@media(forced-colors:active){.sbb-pearl-chain__bullet--progress{--sbb-pearl-chain-bullet-color: GrayText !important}}.sbb-pearl-chain__bullet--departure-disruption,.sbb-pearl-chain--arrival-disruption,.sbb-pearl-chain--departure-disruption,.sbb-pearl-chain__leg--disruption{color:var(--sbb-pearl-chain-color-disruption);--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-disruption)}@media(forced-colors:active){.sbb-pearl-chain__bullet--departure-disruption,.sbb-pearl-chain--arrival-disruption,.sbb-pearl-chain--departure-disruption,.sbb-pearl-chain__leg--disruption{--sbb-pearl-chain-bullet-color: Highlight}}@media(forced-colors:active){.sbb-pearl-chain__bullet--departure-disruption,.sbb-pearl-chain--arrival-disruption,.sbb-pearl-chain--departure-disruption,.sbb-pearl-chain__leg--disruption{color:Highlight;background:Highlight}}.sbb-pearl-chain__leg--disruption .sbb-pearl-chain__stop{--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-disruption)}@media(forced-colors:active){.sbb-pearl-chain__leg--disruption .sbb-pearl-chain__stop{--sbb-pearl-chain-bullet-color: Highlight}}.sbb-pearl-chain__leg--past .sbb-pearl-chain__stop{--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-past)}@media(forced-colors:active){.sbb-pearl-chain__leg--past .sbb-pearl-chain__stop{--sbb-pearl-chain-bullet-color: GrayText !important}}.sbb-pearl-chain__leg--disruption:after{background-color:unset;background-image:linear-gradient(to right,currentcolor 0%,currentcolor 50%,Canvas 50%);background-repeat:repeat-x;background-size:calc(2 * var(--sbb-pearl-chain-spacing-small)) var(--sbb-pearl-chain-height);inset-inline-end:var(--sbb-pearl-chain-height)}@media(forced-colors:active){.sbb-pearl-chain__leg--disruption:after{background:unset;border-block-start:.0625rem dashed Highlight;transform:translateY(.0625rem)}}.sbb-pearl-chain__leg--skipped{color:var(--sbb-pearl-chain-color-disruption)}.sbb-pearl-chain__leg--skipped:after{background-color:unset;background-image:linear-gradient(to right,currentcolor 0%,currentcolor 50%,Canvas 50%);background-repeat:repeat-x;background-size:calc(2 * var(--sbb-pearl-chain-spacing-small)) var(--sbb-pearl-chain-height);inset-inline-end:var(--sbb-pearl-chain-height)}@media(forced-colors:active){.sbb-pearl-chain__leg--skipped:after{background:unset;border-block-start:.0625rem dashed Highlight;transform:translateY(.0625rem)}}.sbb-pearl-chain__stop--departure-skipped{min-height:var(--sbb-pearl-chain-bullet-size-stop);min-width:var(--sbb-pearl-chain-bullet-size-stop);height:var(--sbb-pearl-chain-bullet-size-stop);width:var(--sbb-pearl-chain-bullet-size-stop);border:var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;background:Canvas}.sbb-pearl-chain__stop--departure-skipped:before{content:\"\";position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%) rotate(45deg);border-block-start:var(--sbb-pearl-chain-bullet-crossed-border-width) solid canvas;background:var(--sbb-pearl-chain-bullet-color-disruption);height:var(--sbb-pearl-chain-bullet-crossed-height);width:var(--sbb-pearl-chain-bullet-crossed-width)}@media(forced-colors:active){.sbb-pearl-chain__stop--departure-skipped:before{background:Highlight}}.sbb-pearl-chain--arrival-skipped,.sbb-pearl-chain--departure-skipped{min-height:var(--sbb-pearl-chain-bullet-size-start-end);min-width:var(--sbb-pearl-chain-bullet-size-start-end);height:var(--sbb-pearl-chain-bullet-size-start-end);width:var(--sbb-pearl-chain-bullet-size-start-end);border:var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;background:Canvas}.sbb-pearl-chain--arrival-skipped:before,.sbb-pearl-chain--departure-skipped:before{content:\"\";position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%) rotate(45deg);border-block-start:var(--sbb-pearl-chain-bullet-crossed-border-width) solid canvas;background:var(--sbb-pearl-chain-bullet-color-disruption);height:var(--sbb-pearl-chain-bullet-crossed-height);width:var(--sbb-pearl-chain-bullet-crossed-width)}@media(forced-colors:active){.sbb-pearl-chain--arrival-skipped:before,.sbb-pearl-chain--departure-skipped:before{background:Highlight}}.sbb-pearl-chain__leg:after{content:\"\";position:absolute;inset-block:0;inset-inline-start:0;background-color:currentcolor;border-radius:var(--sbb-pearl-chain-height);z-index:1}@media(forced-colors:active){.sbb-pearl-chain__leg:after{background-color:CanvasText}.sbb-pearl-chain--past .sbb-pearl-chain__leg:after{background-color:GrayText}}.sbb-pearl-chain__leg:last-of-type:after{inset-inline-end:calc(-1 * var(--sbb-pearl-chain-height))}.sbb-pearl-chain__leg--progress:after{background-color:var(--sbb-pearl-chain-color-past);width:var(--sbb-pearl-chain-leg-status)}.sbb-pearl-chain__position{min-height:var(--sbb-pearl-chain-bullet-size-start-end);min-width:var(--sbb-pearl-chain-bullet-size-start-end);height:var(--sbb-pearl-chain-bullet-size-start-end);width:var(--sbb-pearl-chain-bullet-size-start-end);background:var(--sbb-pearl-chain-bullet-color);color:var(--sbb-pearl-chain-bullet-color);border-color:var(--sbb-pearl-chain-bullet-color);border-radius:100%}@media(forced-colors:active){.sbb-pearl-chain__position{--sbb-pearl-chain-bullet-color: CanvasText}}.sbb-pearl-chain__position{--sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-position-color)}@media(forced-colors:active){.sbb-pearl-chain__position{--sbb-pearl-chain-position-color: Highlight}}@keyframes pearl-chain-bullet-position-pulse{0%{box-shadow:0 0 0 0 var(--sbb-pearl-chain-position-color)}25%{box-shadow:0 0 0 0 var(--sbb-pearl-chain-position-color)}50%{box-shadow:0 0 0 .1875rem color-mix(in srgb,var(--sbb-pearl-chain-position-color) 20%,transparent)}to{box-shadow:0 0 0 0 var(--sbb-pearl-chain-position-color)}}.sbb-pearl-chain__position{animation:pearl-chain-bullet-position-pulse var(--sbb-pearl-chain-bullet-animation-duration) var(--sbb-pearl-chain-bullet-animation-easing) infinite;position:absolute;inset-block-start:-200%;z-index:4;inset-inline-start:var(--sbb-pearl-chain-status-position)}.sbb-pearl-chain__position--no-animation{animation:unset}", y = (() => {
|
|
21
|
+
let e = r, y = [], b, x = [], S = [], C, w = [], T = [], E;
|
|
26
22
|
return class extends e {
|
|
27
23
|
constructor() {
|
|
28
|
-
super(...arguments), this.#e = (
|
|
24
|
+
super(...arguments), this.#e = (d(this, y), d(this, x, [])), this.#t = (d(this, S), d(this, w, !1)), this._now = (d(this, T), null);
|
|
29
25
|
}
|
|
30
26
|
static {
|
|
31
27
|
let t = typeof Symbol == "function" && Symbol.metadata ? Object.create(e[Symbol.metadata] ?? null) : void 0;
|
|
32
|
-
b = [f({ type: Array })], C = [
|
|
28
|
+
b = [f({ type: Array })], C = [a(), f({
|
|
33
29
|
attribute: "disable-animation",
|
|
34
30
|
type: Boolean
|
|
35
|
-
})], E = [f()],
|
|
31
|
+
})], E = [f()], u(this, null, b, {
|
|
36
32
|
kind: "accessor",
|
|
37
33
|
name: "legs",
|
|
38
34
|
static: !1,
|
|
@@ -45,7 +41,7 @@ var v = ":host{--sbb-pearl-chain-height: var(--sbb-border-width-2x);--sbb-pearl-
|
|
|
45
41
|
}
|
|
46
42
|
},
|
|
47
43
|
metadata: t
|
|
48
|
-
}, x, S),
|
|
44
|
+
}, x, S), u(this, null, C, {
|
|
49
45
|
kind: "accessor",
|
|
50
46
|
name: "disableAnimation",
|
|
51
47
|
static: !1,
|
|
@@ -58,7 +54,7 @@ var v = ":host{--sbb-pearl-chain-height: var(--sbb-border-width-2x);--sbb-pearl-
|
|
|
58
54
|
}
|
|
59
55
|
},
|
|
60
56
|
metadata: t
|
|
61
|
-
}, w, T),
|
|
57
|
+
}, w, T), u(this, null, E, {
|
|
62
58
|
kind: "setter",
|
|
63
59
|
name: "now",
|
|
64
60
|
static: !1,
|
|
@@ -81,7 +77,7 @@ var v = ":host{--sbb-pearl-chain-height: var(--sbb-border-width-2x);--sbb-pearl-
|
|
|
81
77
|
this.elementName = "sbb-pearl-chain";
|
|
82
78
|
}
|
|
83
79
|
static {
|
|
84
|
-
this.styles = [
|
|
80
|
+
this.styles = [o, l(v)];
|
|
85
81
|
}
|
|
86
82
|
#e;
|
|
87
83
|
get legs() {
|
|
@@ -98,24 +94,24 @@ var v = ":host{--sbb-pearl-chain-height: var(--sbb-border-width-2x);--sbb-pearl-
|
|
|
98
94
|
this.#t = e;
|
|
99
95
|
}
|
|
100
96
|
set now(e) {
|
|
101
|
-
this._now =
|
|
97
|
+
this._now = i.getValidDateOrNull(i.deserialize(e));
|
|
102
98
|
}
|
|
103
99
|
get now() {
|
|
104
100
|
return this._now;
|
|
105
101
|
}
|
|
106
102
|
_getAllDuration(e) {
|
|
107
103
|
return e?.reduce((e, t) => {
|
|
108
|
-
let r =
|
|
109
|
-
return r && i ? e + n(
|
|
104
|
+
let r = m(t.arrival?.time), i = m(t.departure?.time);
|
|
105
|
+
return r && i ? e + n(m(t.arrival.time), m(t.departure.time)) : e;
|
|
110
106
|
}, 0);
|
|
111
107
|
}
|
|
112
108
|
_isAllCancelled(e) {
|
|
113
109
|
return e?.every((e) => e?.serviceJourney?.serviceAlteration?.cancelled);
|
|
114
110
|
}
|
|
115
111
|
_getRelativeDuration(e, t) {
|
|
116
|
-
let r =
|
|
112
|
+
let r = m(t.arrival?.time), i = m(t.departure?.time);
|
|
117
113
|
if (r && i) {
|
|
118
|
-
let r = n(
|
|
114
|
+
let r = n(m(t.arrival.time), m(t.departure.time)), i = this._getAllDuration(e);
|
|
119
115
|
return i === 0 ? 100 : r / i * 100;
|
|
120
116
|
}
|
|
121
117
|
return 0;
|
|
@@ -136,54 +132,54 @@ var v = ":host{--sbb-pearl-chain-height: var(--sbb-border-width-2x);--sbb-pearl-
|
|
|
136
132
|
"--sbb-pearl-chain-status-position": `${r}%`,
|
|
137
133
|
...r >= 50 ? { transform: "translateX(-100%)" } : {}
|
|
138
134
|
}), a = this.disableAnimation ? "sbb-pearl-chain__position--no-animation" : "";
|
|
139
|
-
return
|
|
135
|
+
return s`<span
|
|
140
136
|
style=${h(i())}
|
|
141
137
|
class="sbb-pearl-chain__position ${a}"
|
|
142
138
|
></span>`;
|
|
143
139
|
}
|
|
144
140
|
render() {
|
|
145
|
-
let e = this.now ?? /* @__PURE__ */ new Date(), t = this.legs?.filter((e) =>
|
|
141
|
+
let e = this.now ?? /* @__PURE__ */ new Date(), t = this.legs?.filter((e) => p(e)), n = t?.length && m(t[0]?.departure?.time), r = n && {
|
|
146
142
|
time: n,
|
|
147
143
|
delay: t[0].departure.delay ?? 0
|
|
148
|
-
}, i = t?.length &&
|
|
144
|
+
}, i = t?.length && m(t[t.length - 1].arrival?.time), a = i && {
|
|
149
145
|
time: i,
|
|
150
146
|
delay: t[t.length - 1]?.arrival.delay ?? 0
|
|
151
|
-
}, o = t && t[0]?.serviceJourney?.stopPoints && t[0]?.serviceJourney?.stopPoints[0].stopStatus === "NOT_SERVICED" ? "sbb-pearl-chain--departure-skipped" : "",
|
|
147
|
+
}, o = t && t[0]?.serviceJourney?.stopPoints && t[0]?.serviceJourney?.stopPoints[0].stopStatus === "NOT_SERVICED" ? "sbb-pearl-chain--departure-skipped" : "", l = (() => {
|
|
152
148
|
let e = t && t[t.length - 1], n = e && e.serviceJourney?.stopPoints;
|
|
153
149
|
return n && n[n.length - 1].stopStatus === "NOT_SERVICED" ? "sbb-pearl-chain--arrival-skipped" : "";
|
|
154
150
|
})(), u = t && t[0]?.serviceJourney?.serviceAlteration?.cancelled ? "sbb-pearl-chain--departure-disruption" : "", d = t && t[t.length - 1]?.serviceJourney?.serviceAlteration?.cancelled ? "sbb-pearl-chain--arrival-disruption" : "", f = r && a && this._getStatus(e, r, a), g = t && f && !u ? "sbb-pearl-chain__bullet--" + f : "", _ = t && f && !d ? "sbb-pearl-chain__bullet--" + this._getStatus(e, void 0, a) : "";
|
|
155
|
-
return this._isAllCancelled(t) ?
|
|
151
|
+
return this._isAllCancelled(t) ? s`
|
|
156
152
|
<div class="sbb-pearl-chain">
|
|
157
153
|
<span class="sbb-pearl-chain__bullet sbb-pearl-chain--departure-disruption"></span>
|
|
158
154
|
<div class="sbb-pearl-chain__leg sbb-pearl-chain__leg--disruption"></div>
|
|
159
155
|
<span class="sbb-pearl-chain__bullet sbb-pearl-chain--departure-disruption"></span>
|
|
160
156
|
</div>
|
|
161
|
-
` :
|
|
157
|
+
` : s`
|
|
162
158
|
<div class="sbb-pearl-chain">
|
|
163
159
|
<span
|
|
164
160
|
class="sbb-pearl-chain__bullet ${g} ${o} ${u}"
|
|
165
161
|
></span>
|
|
166
162
|
${t?.map((n, r) => {
|
|
167
|
-
let { stopPoints: i, serviceAlteration: a } = n?.serviceJourney || {}, o = this._getRelativeDuration(t, n),
|
|
168
|
-
time:
|
|
163
|
+
let { stopPoints: i, serviceAlteration: a } = n?.serviceJourney || {}, o = this._getRelativeDuration(t, n), l = m(n.departure?.time), u = m(n.arrival?.time), d = i && i[i.length - 1]?.stopStatus === "NOT_SERVICED", f = i && i[i.length - 1]?.stopStatus === "PLANNED", p = i && i[0]?.stopStatus === "NOT_SERVICED", g = r > 0 && t[r - 1].serviceJourney.stopPoints, _ = g && g[g.length - 1]?.stopStatus === "NOT_SERVICED", v = d || p && f ? "sbb-pearl-chain__leg--skipped" : "", y = p || _ ? "sbb-pearl-chain__stop--departure-skipped" : "", b = a?.cancelled || a?.partiallyCancelled ? "sbb-pearl-chain__leg--disruption" : "", x = {
|
|
164
|
+
time: l,
|
|
169
165
|
delay: n.departure?.delay ?? 0
|
|
170
166
|
}, S = {
|
|
171
167
|
time: u,
|
|
172
168
|
delay: n.arrival?.delay ?? 0
|
|
173
169
|
}, C = this._getStatus(e, x, S);
|
|
174
|
-
return
|
|
170
|
+
return s` <div
|
|
175
171
|
class="sbb-pearl-chain__leg ${!b && !v && "sbb-pearl-chain__leg--" + C || ""} ${b} ${v}"
|
|
176
172
|
style=${h({
|
|
177
173
|
"--sbb-pearl-chain-leg-width": `${o}%`,
|
|
178
174
|
...C === "progress" && !b && !v ? { "--sbb-pearl-chain-leg-status": `${this._getProgress(e, x, S)}%` } : {}
|
|
179
175
|
})}
|
|
180
176
|
>
|
|
181
|
-
${r > 0 && r < t.length ?
|
|
182
|
-
${C === "progress" && !b && !v ? this._renderPosition(e, x, S) :
|
|
177
|
+
${r > 0 && r < t.length ? s`<span class="sbb-pearl-chain__stop ${y}"></span>` : c}
|
|
178
|
+
${C === "progress" && !b && !v ? this._renderPosition(e, x, S) : c}
|
|
183
179
|
</div>`;
|
|
184
180
|
})}
|
|
185
181
|
<span
|
|
186
|
-
class="sbb-pearl-chain__bullet ${_} ${
|
|
182
|
+
class="sbb-pearl-chain__bullet ${_} ${l} ${d}"
|
|
187
183
|
></span>
|
|
188
184
|
</div>
|
|
189
185
|
`;
|
package/pearl-chain.js
CHANGED
package/pearl-chain.pure.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as e } from "./pearl-chain.component-
|
|
1
|
+
import { t as e } from "./pearl-chain.component-DtGXXkY6.js";
|
|
2
2
|
export { e as SbbPearlChainElement };
|