npm - @sbb-esta/lyne-elements-experimental-dev - Versions diffs - 5.11.0-dev.1791971559 → 5.11.0-dev.1791974631 - Mend

@sbb-esta/lyne-elements-experimental-dev 5.11.0-dev.1791971559 → 5.11.0-dev.1791974631

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 (22) hide show

package/custom-elements.json CHANGED Viewed

@@ -6617,12 +6617,12 @@
     },
     {
       "kind": "javascript-module",
-      "path": "pearl-chain/pearl-chain.component.js",
+      "path": "pearl-chain-legacy/pearl-chain-legacy.component.js",
       "declarations": [
         {
           "kind": "class",
           "description": "It visually displays journey information.",
-          "name": "SbbPearlChainElement",
+          "name": "SbbPearlChainLegacyElement",
           "members": [
             {
               "kind": "field",
@@ -6633,7 +6633,7 @@
               "privacy": "public",
               "static": true,
               "readonly": true,
-              "default": "'sbb-pearl-chain'",
+              "default": "'sbb-pearl-chain-legacy'",
               "inheritedFrom": {
                 "name": "SbbElement",
                 "module": "core/base-elements/element.js"
@@ -7153,24 +7153,25 @@
             "name": "SbbElement",
             "package": "@sbb-esta/lyne-elements/core.js"
           },
-          "tagName": "sbb-pearl-chain",
+          "deprecated": "Use `sbb-pearl-chain` instead.",
+          "tagName": "sbb-pearl-chain-legacy",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "SbbPearlChainElement",
+          "name": "SbbPearlChainLegacyElement",
           "declaration": {
-            "name": "SbbPearlChainElement",
-            "module": "pearl-chain/pearl-chain.component.js"
+            "name": "SbbPearlChainLegacyElement",
+            "module": "pearl-chain-legacy/pearl-chain-legacy.component.js"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "pearl-chain.pure.js",
+      "path": "pearl-chain-legacy.pure.js",
       "declarations": [],
       "exports": [
         {
@@ -7178,7 +7179,7 @@
           "name": "*",
           "declaration": {
             "name": "*",
-            "module": "pearl-chain/pearl-chain.component.js"
+            "module": "pearl-chain-legacy/pearl-chain-legacy.component.js"
           }
         }
       ]
@@ -7189,7 +7190,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "Combined with `sbb-pearl-chain`, it displays walk time information.",
+          "description": "Combined with `sbb-pearl-chain-legacy`, it displays walk time information.",
           "name": "SbbPearlChainTimeElement",
           "members": [
             {
@@ -7215,7 +7216,7 @@
               },
               "privacy": "public",
               "static": true,
-              "default": "[ SbbIconElement, SbbPearlChainElement, ]",
+              "default": "[ SbbIconElement, SbbPearlChainLegacyElement, ]",
               "inheritedFrom": {
                 "name": "SbbElement",
                 "module": "core/base-elements/element.js"
@@ -7672,6 +7673,7 @@
             "name": "SbbElement",
             "package": "@sbb-esta/lyne-elements/core.js"
           },
+          "deprecated": "Use `sbb-pearl-chain` instead.",
           "tagName": "sbb-pearl-chain-time",
           "customElement": true
         }
@@ -8294,6 +8296,21 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "pearl-chain-legacy.js",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "module": "pearl-chain-legacy.pure.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "pearl-chain-time.js",
@@ -8674,6 +8691,7 @@
             "name": "SbbElement",
             "package": "@sbb-esta/lyne-elements/core.js"
           },
+          "deprecated": "Use `sbb-pearl-chain` instead.",
           "tagName": "sbb-pearl-chain-vertical-item",
           "customElement": true
         }
@@ -9037,6 +9055,7 @@
             "name": "SbbElement",
             "package": "@sbb-esta/lyne-elements/core.js"
           },
+          "deprecated": "Use `sbb-pearl-chain` instead.",
           "tagName": "sbb-pearl-chain-vertical",
           "customElement": true
         }
@@ -9082,21 +9101,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "pearl-chain.js",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "module": "pearl-chain.pure.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "seat-reservation/common/types.js",

package/development/{pearl-chain/pearl-chain.component.d.ts → pearl-chain-legacy/pearl-chain-legacy.component.d.ts} RENAMED Viewed

@@ -3,8 +3,9 @@ import { type CSSResultGroup, type TemplateResult } from 'lit';
 import type { Leg, PtRideLeg } from '../core.ts';
 /**
  * It visually displays journey information.
+ * @deprecated Use `sbb-pearl-chain` instead.
  */
-export declare class SbbPearlChainElement extends SbbElement {
+export declare class SbbPearlChainLegacyElement extends SbbElement {
     static readonly elementName: string;
     static styles: CSSResultGroup;
     /**
@@ -38,6 +39,6 @@ export declare class SbbPearlChainElement extends SbbElement {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        'sbb-pearl-chain': SbbPearlChainElement;
+        'sbb-pearl-chain-legacy': SbbPearlChainLegacyElement;
     }
 }

package/development/pearl-chain-legacy.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export * from './pearl-chain-legacy.pure.ts';

package/development/pearl-chain-legacy.js ADDED Viewed

@@ -0,0 +1,9 @@
+import { SbbPearlChainLegacyElement } from "./pearl-chain-legacy.pure.js";
+export * from "./pearl-chain-legacy.pure.js"
+//#region src/elements-experimental/pearl-chain-legacy.ts
+/** @entrypoint */
+SbbPearlChainLegacyElement.define();
+//#endregion

package/development/pearl-chain-legacy.pure.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ /** @entrypoint */
2	+ export * from './pearl-chain-legacy/pearl-chain-legacy.component.ts';

package/development/{pearl-chain.pure.js → pearl-chain-legacy.pure.js} RENAMED Viewed

@@ -352,15 +352,16 @@ function isBefore(date, dateToCompare) {
 }
 //#endregion
-//#region src/elements-experimental/pearl-chain/pearl-chain.scss?inline
-var pearl_chain_default = ":host {\n  --sbb-pearl-chain-height: var(--sbb-border-width-2x);\n  --sbb-pearl-chain-spacing-small: 0.125rem;\n  --sbb-pearl-chain-color: var(--sbb-pearl-chain-bullet-color);\n  --sbb-pearl-chain-color-disruption: var(--sbb-pearl-chain-bullet-color-disruption);\n  --sbb-pearl-chain-color-past: var(--sbb-pearl-chain-bullet-color-past);\n  --sbb-pearl-chain-leg-width: 100%;\n  display: block;\n  --sbb-pearl-chain-position-color: var(--sbb-color-primary);\n  --sbb-pearl-chain-bullet-size-start-end: 0.625rem;\n  --sbb-pearl-chain-bullet-size-stop: 0.5rem;\n  --sbb-pearl-chain-bullet-color: var(--sbb-background-color-3-inverted);\n  --sbb-pearl-chain-bullet-color-past: var(--sbb-color-metal);\n  --sbb-pearl-chain-bullet-color-past: light-dark(var(--sbb-color-metal), var(--sbb-color-granite));\n  --sbb-pearl-chain-bullet-color-irrelevant: var(--sbb-color-metal);\n  --sbb-pearl-chain-bullet-color-irrelevant: light-dark(\n    var(--sbb-color-metal),\n    var(--sbb-color-granite)\n  );\n  --sbb-pearl-chain-bullet-color-disruption: var(--sbb-color-error);\n  --sbb-pearl-chain-bullet-border-width: var(--sbb-border-width-2x);\n  --sbb-pearl-chain-bullet-animation-duration: 1920ms;\n  --sbb-pearl-chain-bullet-animation-easing: ease-out;\n  --sbb-pearl-chain-bullet-crossed-width: 0.88375rem;\n  --sbb-pearl-chain-bullet-crossed-height: 0.21875rem;\n  --sbb-pearl-chain-bullet-crossed-border-width: 0.09375rem;\n}\n\n.sbb-pearl-chain {\n  position: relative;\n  display: flex;\n  justify-content: space-between;\n  flex-wrap: nowrap;\n  color: var(--sbb-pearl-chain-color);\n  width: 100%;\n  padding-block: calc((var(--sbb-pearl-chain-bullet-size-start-end) - var(--sbb-pearl-chain-height)) / 2);\n  padding-inline-end: var(--sbb-pearl-chain-bullet-size-start-end);\n}\n\n.sbb-pearl-chain__bullet {\n  min-height: var(--sbb-pearl-chain-bullet-size-start-end);\n  min-width: var(--sbb-pearl-chain-bullet-size-start-end);\n  height: var(--sbb-pearl-chain-bullet-size-start-end);\n  width: var(--sbb-pearl-chain-bullet-size-start-end);\n  background: var(--sbb-pearl-chain-bullet-color);\n  color: var(--sbb-pearl-chain-bullet-color);\n  border-color: var(--sbb-pearl-chain-bullet-color);\n  border-radius: 100%;\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__bullet {\n    --sbb-pearl-chain-bullet-color: CanvasText;\n  }\n}\n.sbb-pearl-chain__bullet {\n  content: \"\";\n  position: absolute;\n  background-color: currentcolor;\n  inset-block-start: 0;\n  z-index: 3;\n}\n\n.sbb-pearl-chain__bullet:first-of-type {\n  inset-inline-start: 0;\n}\n\n.sbb-pearl-chain__bullet:last-of-type {\n  inset-inline-end: 0;\n}\n\n.sbb-pearl-chain__leg {\n  flex-shrink: 0;\n  flex-grow: 0;\n  position: relative;\n  height: var(--sbb-pearl-chain-height);\n  border-inline-end: var(--sbb-pearl-chain-spacing-small) solid Canvas;\n  background-color: currentcolor;\n  width: var(--sbb-pearl-chain-leg-width);\n  display: flex;\n  align-items: center;\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg {\n    background-color: CanvasText;\n  }\n  .sbb-pearl-chain--past .sbb-pearl-chain__leg {\n    background-color: GrayText;\n  }\n}\n\n.sbb-pearl-chain__leg:last-of-type {\n  border: none;\n}\n\n.sbb-pearl-chain__stop {\n  position: relative;\n  z-index: 2;\n  background: var(--sbb-pearl-chain-bullet-color);\n  color: var(--sbb-pearl-chain-bullet-color);\n  border-color: var(--sbb-pearl-chain-bullet-color);\n  border-radius: 100%;\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__stop {\n    --sbb-pearl-chain-bullet-color: CanvasText;\n  }\n}\n.sbb-pearl-chain__stop {\n  min-height: var(--sbb-pearl-chain-bullet-size-stop);\n  min-width: var(--sbb-pearl-chain-bullet-size-stop);\n  height: var(--sbb-pearl-chain-bullet-size-stop);\n  width: var(--sbb-pearl-chain-bullet-size-stop);\n  border: var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;\n  background: Canvas;\n}\n\n.sbb-pearl-chain__bullet--future {\n  background: var(--sbb-pearl-chain-bullet-color);\n  color: var(--sbb-pearl-chain-bullet-color);\n  border-color: var(--sbb-pearl-chain-bullet-color);\n  border-radius: 100%;\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__bullet--future {\n    --sbb-pearl-chain-bullet-color: CanvasText;\n  }\n}\n\n.sbb-pearl-chain__leg--past,\n.sbb-pearl-chain--past,\n.sbb-pearl-chain__leg--past::after,\n.sbb-pearl-chain__leg--progress::after,\n.sbb-pearl-chain__leg--progress .sbb-pearl-chain__stop,\n.sbb-pearl-chain--progress,\n.sbb-pearl-chain__bullet--past {\n  color: var(--sbb-pearl-chain-color-past);\n  --sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-past);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg--past,\n  .sbb-pearl-chain--past,\n  .sbb-pearl-chain__leg--past::after,\n  .sbb-pearl-chain__leg--progress::after,\n  .sbb-pearl-chain__leg--progress .sbb-pearl-chain__stop,\n  .sbb-pearl-chain--progress,\n  .sbb-pearl-chain__bullet--past {\n    --sbb-pearl-chain-bullet-color: GrayText !important;\n  }\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg--past,\n  .sbb-pearl-chain--past,\n  .sbb-pearl-chain__leg--past::after,\n  .sbb-pearl-chain__leg--progress::after,\n  .sbb-pearl-chain__leg--progress .sbb-pearl-chain__stop,\n  .sbb-pearl-chain--progress,\n  .sbb-pearl-chain__bullet--past {\n    background-color: GrayText !important;\n  }\n}\n\n.sbb-pearl-chain__bullet--progress {\n  background: var(--sbb-pearl-chain-bullet-color);\n  --sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-past);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__bullet--progress {\n    --sbb-pearl-chain-bullet-color: GrayText !important;\n  }\n}\n\n.sbb-pearl-chain__bullet--departure-disruption,\n.sbb-pearl-chain--arrival-disruption,\n.sbb-pearl-chain--departure-disruption,\n.sbb-pearl-chain__leg--disruption {\n  color: var(--sbb-pearl-chain-color-disruption);\n  --sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-disruption);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__bullet--departure-disruption,\n  .sbb-pearl-chain--arrival-disruption,\n  .sbb-pearl-chain--departure-disruption,\n  .sbb-pearl-chain__leg--disruption {\n    --sbb-pearl-chain-bullet-color: Highlight;\n  }\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__bullet--departure-disruption,\n  .sbb-pearl-chain--arrival-disruption,\n  .sbb-pearl-chain--departure-disruption,\n  .sbb-pearl-chain__leg--disruption {\n    color: Highlight;\n    background: Highlight;\n  }\n}\n\n.sbb-pearl-chain__leg--disruption .sbb-pearl-chain__stop {\n  --sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-disruption);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg--disruption .sbb-pearl-chain__stop {\n    --sbb-pearl-chain-bullet-color: Highlight;\n  }\n}\n\n.sbb-pearl-chain__leg--past .sbb-pearl-chain__stop {\n  --sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-past);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg--past .sbb-pearl-chain__stop {\n    --sbb-pearl-chain-bullet-color: GrayText !important;\n  }\n}\n\n.sbb-pearl-chain__leg--cancelled-expected::after {\n  background-color: unset;\n  background-image: linear-gradient(to right, currentcolor 0%, currentcolor 50%, Canvas 50%);\n  background-repeat: repeat-x;\n  background-size: calc(2 * var(--sbb-pearl-chain-spacing-small)) var(--sbb-pearl-chain-height);\n  inset-inline-end: var(--sbb-pearl-chain-height);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg--cancelled-expected::after {\n    background: unset;\n    border-block-start: 0.0625rem dashed Highlight;\n    transform: translateY(0.0625rem);\n  }\n}\n\n.sbb-pearl-chain__leg--disruption::after {\n  background-color: unset;\n  background-image: linear-gradient(to right, currentcolor 0%, currentcolor 50%, Canvas 50%);\n  background-repeat: repeat-x;\n  background-size: calc(2 * var(--sbb-pearl-chain-spacing-small)) var(--sbb-pearl-chain-height);\n  inset-inline-end: var(--sbb-pearl-chain-height);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg--disruption::after {\n    background: unset;\n    border-block-start: 0.0625rem dashed Highlight;\n    transform: translateY(0.0625rem);\n  }\n}\n\n.sbb-pearl-chain__leg--skipped {\n  color: var(--sbb-pearl-chain-color-disruption);\n}\n.sbb-pearl-chain__leg--skipped::after {\n  background-color: unset;\n  background-image: linear-gradient(to right, currentcolor 0%, currentcolor 50%, Canvas 50%);\n  background-repeat: repeat-x;\n  background-size: calc(2 * var(--sbb-pearl-chain-spacing-small)) var(--sbb-pearl-chain-height);\n  inset-inline-end: var(--sbb-pearl-chain-height);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg--skipped::after {\n    background: unset;\n    border-block-start: 0.0625rem dashed Highlight;\n    transform: translateY(0.0625rem);\n  }\n}\n\n.sbb-pearl-chain__stop--departure-skipped {\n  min-height: var(--sbb-pearl-chain-bullet-size-stop);\n  min-width: var(--sbb-pearl-chain-bullet-size-stop);\n  height: var(--sbb-pearl-chain-bullet-size-stop);\n  width: var(--sbb-pearl-chain-bullet-size-stop);\n  border: var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;\n  background: Canvas;\n  border: var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;\n  background: Canvas;\n}\n.sbb-pearl-chain__stop--departure-skipped::before {\n  content: \"\";\n  position: absolute;\n  inset-block-start: 50%;\n  inset-inline-start: 50%;\n  transform: translate(-50%, -50%) rotate(45deg);\n  border-block-start: var(--sbb-pearl-chain-bullet-crossed-border-width) solid canvas;\n  background: var(--sbb-pearl-chain-bullet-color-disruption);\n  height: var(--sbb-pearl-chain-bullet-crossed-height);\n  width: var(--sbb-pearl-chain-bullet-crossed-width);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__stop--departure-skipped::before {\n    background: Highlight;\n  }\n}\n\n.sbb-pearl-chain--arrival-skipped,\n.sbb-pearl-chain--departure-skipped {\n  min-height: var(--sbb-pearl-chain-bullet-size-start-end);\n  min-width: var(--sbb-pearl-chain-bullet-size-start-end);\n  height: var(--sbb-pearl-chain-bullet-size-start-end);\n  width: var(--sbb-pearl-chain-bullet-size-start-end);\n  border: var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;\n  background: Canvas;\n}\n.sbb-pearl-chain--arrival-skipped::before,\n.sbb-pearl-chain--departure-skipped::before {\n  content: \"\";\n  position: absolute;\n  inset-block-start: 50%;\n  inset-inline-start: 50%;\n  transform: translate(-50%, -50%) rotate(45deg);\n  border-block-start: var(--sbb-pearl-chain-bullet-crossed-border-width) solid canvas;\n  background: var(--sbb-pearl-chain-bullet-color-disruption);\n  height: var(--sbb-pearl-chain-bullet-crossed-height);\n  width: var(--sbb-pearl-chain-bullet-crossed-width);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain--arrival-skipped::before,\n  .sbb-pearl-chain--departure-skipped::before {\n    background: Highlight;\n  }\n}\n\n.sbb-pearl-chain__leg::after {\n  content: \"\";\n  position: absolute;\n  inset-block: 0;\n  inset-inline-start: 0;\n  background-color: currentcolor;\n  border-radius: var(--sbb-pearl-chain-height);\n  z-index: 1;\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg::after {\n    background-color: CanvasText;\n  }\n  .sbb-pearl-chain--past .sbb-pearl-chain__leg::after {\n    background-color: GrayText;\n  }\n}\n\n.sbb-pearl-chain__leg:last-of-type::after {\n  inset-inline-end: calc(-1 * var(--sbb-pearl-chain-height));\n}\n\n.sbb-pearl-chain__leg--progress::after {\n  background-color: var(--sbb-pearl-chain-color-past);\n  width: var(--sbb-pearl-chain-leg-status);\n}\n\n.sbb-pearl-chain__position {\n  min-height: var(--sbb-pearl-chain-bullet-size-start-end);\n  min-width: var(--sbb-pearl-chain-bullet-size-start-end);\n  height: var(--sbb-pearl-chain-bullet-size-start-end);\n  width: var(--sbb-pearl-chain-bullet-size-start-end);\n  background: var(--sbb-pearl-chain-bullet-color);\n  color: var(--sbb-pearl-chain-bullet-color);\n  border-color: var(--sbb-pearl-chain-bullet-color);\n  border-radius: 100%;\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__position {\n    --sbb-pearl-chain-bullet-color: CanvasText;\n  }\n}\n.sbb-pearl-chain__position {\n  --sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-position-color);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__position {\n    --sbb-pearl-chain-position-color: Highlight;\n  }\n}\n@keyframes pearl-chain-bullet-position-pulse {\n  0% {\n    box-shadow: 0 0 0 0 var(--sbb-pearl-chain-position-color);\n  }\n  25% {\n    box-shadow: 0 0 0 0 var(--sbb-pearl-chain-position-color);\n  }\n  50% {\n    box-shadow: 0 0 0 0.1875rem color-mix(in srgb, var(--sbb-pearl-chain-position-color) 20%, transparent);\n  }\n  100% {\n    box-shadow: 0 0 0 0 var(--sbb-pearl-chain-position-color);\n  }\n}\n.sbb-pearl-chain__position {\n  animation: pearl-chain-bullet-position-pulse var(--sbb-pearl-chain-bullet-animation-duration) var(--sbb-pearl-chain-bullet-animation-easing) infinite;\n  position: absolute;\n  inset-block-start: -200%;\n  z-index: 4;\n  inset-inline-start: var(--sbb-pearl-chain-status-position);\n}\n\n.sbb-pearl-chain__position--no-animation {\n  animation: unset;\n}\n";
+//#region src/elements-experimental/pearl-chain-legacy/pearl-chain-legacy.scss?inline
+var pearl_chain_legacy_default = ":host {\n  --sbb-pearl-chain-height: var(--sbb-border-width-2x);\n  --sbb-pearl-chain-spacing-small: 0.125rem;\n  --sbb-pearl-chain-color: var(--sbb-pearl-chain-bullet-color);\n  --sbb-pearl-chain-color-disruption: var(--sbb-pearl-chain-bullet-color-disruption);\n  --sbb-pearl-chain-color-past: var(--sbb-pearl-chain-bullet-color-past);\n  --sbb-pearl-chain-leg-width: 100%;\n  display: block;\n  --sbb-pearl-chain-position-color: var(--sbb-color-primary);\n  --sbb-pearl-chain-bullet-size-start-end: 0.625rem;\n  --sbb-pearl-chain-bullet-size-stop: 0.5rem;\n  --sbb-pearl-chain-bullet-color: var(--sbb-background-color-3-inverted);\n  --sbb-pearl-chain-bullet-color-past: var(--sbb-color-metal);\n  --sbb-pearl-chain-bullet-color-past: light-dark(var(--sbb-color-metal), var(--sbb-color-granite));\n  --sbb-pearl-chain-bullet-color-irrelevant: var(--sbb-color-metal);\n  --sbb-pearl-chain-bullet-color-irrelevant: light-dark(\n    var(--sbb-color-metal),\n    var(--sbb-color-granite)\n  );\n  --sbb-pearl-chain-bullet-color-disruption: var(--sbb-color-error);\n  --sbb-pearl-chain-bullet-border-width: var(--sbb-border-width-2x);\n  --sbb-pearl-chain-bullet-animation-duration: 1920ms;\n  --sbb-pearl-chain-bullet-animation-easing: ease-out;\n  --sbb-pearl-chain-bullet-crossed-width: 0.88375rem;\n  --sbb-pearl-chain-bullet-crossed-height: 0.21875rem;\n  --sbb-pearl-chain-bullet-crossed-border-width: 0.09375rem;\n}\n\n.sbb-pearl-chain {\n  position: relative;\n  display: flex;\n  justify-content: space-between;\n  flex-wrap: nowrap;\n  color: var(--sbb-pearl-chain-color);\n  width: 100%;\n  padding-block: calc((var(--sbb-pearl-chain-bullet-size-start-end) - var(--sbb-pearl-chain-height)) / 2);\n  padding-inline-end: var(--sbb-pearl-chain-bullet-size-start-end);\n}\n\n.sbb-pearl-chain__bullet {\n  min-height: var(--sbb-pearl-chain-bullet-size-start-end);\n  min-width: var(--sbb-pearl-chain-bullet-size-start-end);\n  height: var(--sbb-pearl-chain-bullet-size-start-end);\n  width: var(--sbb-pearl-chain-bullet-size-start-end);\n  background: var(--sbb-pearl-chain-bullet-color);\n  color: var(--sbb-pearl-chain-bullet-color);\n  border-color: var(--sbb-pearl-chain-bullet-color);\n  border-radius: 100%;\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__bullet {\n    --sbb-pearl-chain-bullet-color: CanvasText;\n  }\n}\n.sbb-pearl-chain__bullet {\n  content: \"\";\n  position: absolute;\n  background-color: currentcolor;\n  inset-block-start: 0;\n  z-index: 3;\n}\n\n.sbb-pearl-chain__bullet:first-of-type {\n  inset-inline-start: 0;\n}\n\n.sbb-pearl-chain__bullet:last-of-type {\n  inset-inline-end: 0;\n}\n\n.sbb-pearl-chain__leg {\n  flex-shrink: 0;\n  flex-grow: 0;\n  position: relative;\n  height: var(--sbb-pearl-chain-height);\n  border-inline-end: var(--sbb-pearl-chain-spacing-small) solid Canvas;\n  background-color: currentcolor;\n  width: var(--sbb-pearl-chain-leg-width);\n  display: flex;\n  align-items: center;\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg {\n    background-color: CanvasText;\n  }\n  .sbb-pearl-chain--past .sbb-pearl-chain__leg {\n    background-color: GrayText;\n  }\n}\n\n.sbb-pearl-chain__leg:last-of-type {\n  border: none;\n}\n\n.sbb-pearl-chain__stop {\n  position: relative;\n  z-index: 2;\n  background: var(--sbb-pearl-chain-bullet-color);\n  color: var(--sbb-pearl-chain-bullet-color);\n  border-color: var(--sbb-pearl-chain-bullet-color);\n  border-radius: 100%;\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__stop {\n    --sbb-pearl-chain-bullet-color: CanvasText;\n  }\n}\n.sbb-pearl-chain__stop {\n  min-height: var(--sbb-pearl-chain-bullet-size-stop);\n  min-width: var(--sbb-pearl-chain-bullet-size-stop);\n  height: var(--sbb-pearl-chain-bullet-size-stop);\n  width: var(--sbb-pearl-chain-bullet-size-stop);\n  border: var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;\n  background: Canvas;\n}\n\n.sbb-pearl-chain__bullet--future {\n  background: var(--sbb-pearl-chain-bullet-color);\n  color: var(--sbb-pearl-chain-bullet-color);\n  border-color: var(--sbb-pearl-chain-bullet-color);\n  border-radius: 100%;\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__bullet--future {\n    --sbb-pearl-chain-bullet-color: CanvasText;\n  }\n}\n\n.sbb-pearl-chain__leg--past,\n.sbb-pearl-chain--past,\n.sbb-pearl-chain__leg--past::after,\n.sbb-pearl-chain__leg--progress::after,\n.sbb-pearl-chain__leg--progress .sbb-pearl-chain__stop,\n.sbb-pearl-chain--progress,\n.sbb-pearl-chain__bullet--past {\n  color: var(--sbb-pearl-chain-color-past);\n  --sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-past);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg--past,\n  .sbb-pearl-chain--past,\n  .sbb-pearl-chain__leg--past::after,\n  .sbb-pearl-chain__leg--progress::after,\n  .sbb-pearl-chain__leg--progress .sbb-pearl-chain__stop,\n  .sbb-pearl-chain--progress,\n  .sbb-pearl-chain__bullet--past {\n    --sbb-pearl-chain-bullet-color: GrayText !important;\n  }\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg--past,\n  .sbb-pearl-chain--past,\n  .sbb-pearl-chain__leg--past::after,\n  .sbb-pearl-chain__leg--progress::after,\n  .sbb-pearl-chain__leg--progress .sbb-pearl-chain__stop,\n  .sbb-pearl-chain--progress,\n  .sbb-pearl-chain__bullet--past {\n    background-color: GrayText !important;\n  }\n}\n\n.sbb-pearl-chain__bullet--progress {\n  background: var(--sbb-pearl-chain-bullet-color);\n  --sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-past);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__bullet--progress {\n    --sbb-pearl-chain-bullet-color: GrayText !important;\n  }\n}\n\n.sbb-pearl-chain__bullet--departure-disruption,\n.sbb-pearl-chain--arrival-disruption,\n.sbb-pearl-chain--departure-disruption,\n.sbb-pearl-chain__leg--disruption {\n  color: var(--sbb-pearl-chain-color-disruption);\n  --sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-disruption);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__bullet--departure-disruption,\n  .sbb-pearl-chain--arrival-disruption,\n  .sbb-pearl-chain--departure-disruption,\n  .sbb-pearl-chain__leg--disruption {\n    --sbb-pearl-chain-bullet-color: Highlight;\n  }\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__bullet--departure-disruption,\n  .sbb-pearl-chain--arrival-disruption,\n  .sbb-pearl-chain--departure-disruption,\n  .sbb-pearl-chain__leg--disruption {\n    color: Highlight;\n    background: Highlight;\n  }\n}\n\n.sbb-pearl-chain__leg--disruption .sbb-pearl-chain__stop {\n  --sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-disruption);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg--disruption .sbb-pearl-chain__stop {\n    --sbb-pearl-chain-bullet-color: Highlight;\n  }\n}\n\n.sbb-pearl-chain__leg--past .sbb-pearl-chain__stop {\n  --sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-bullet-color-past);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg--past .sbb-pearl-chain__stop {\n    --sbb-pearl-chain-bullet-color: GrayText !important;\n  }\n}\n\n.sbb-pearl-chain__leg--cancelled-expected::after {\n  background-color: unset;\n  background-image: linear-gradient(to right, currentcolor 0%, currentcolor 50%, Canvas 50%);\n  background-repeat: repeat-x;\n  background-size: calc(2 * var(--sbb-pearl-chain-spacing-small)) var(--sbb-pearl-chain-height);\n  inset-inline-end: var(--sbb-pearl-chain-height);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg--cancelled-expected::after {\n    background: unset;\n    border-block-start: 0.0625rem dashed Highlight;\n    transform: translateY(0.0625rem);\n  }\n}\n\n.sbb-pearl-chain__leg--disruption::after {\n  background-color: unset;\n  background-image: linear-gradient(to right, currentcolor 0%, currentcolor 50%, Canvas 50%);\n  background-repeat: repeat-x;\n  background-size: calc(2 * var(--sbb-pearl-chain-spacing-small)) var(--sbb-pearl-chain-height);\n  inset-inline-end: var(--sbb-pearl-chain-height);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg--disruption::after {\n    background: unset;\n    border-block-start: 0.0625rem dashed Highlight;\n    transform: translateY(0.0625rem);\n  }\n}\n\n.sbb-pearl-chain__leg--skipped {\n  color: var(--sbb-pearl-chain-color-disruption);\n}\n.sbb-pearl-chain__leg--skipped::after {\n  background-color: unset;\n  background-image: linear-gradient(to right, currentcolor 0%, currentcolor 50%, Canvas 50%);\n  background-repeat: repeat-x;\n  background-size: calc(2 * var(--sbb-pearl-chain-spacing-small)) var(--sbb-pearl-chain-height);\n  inset-inline-end: var(--sbb-pearl-chain-height);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg--skipped::after {\n    background: unset;\n    border-block-start: 0.0625rem dashed Highlight;\n    transform: translateY(0.0625rem);\n  }\n}\n\n.sbb-pearl-chain__stop--departure-skipped {\n  min-height: var(--sbb-pearl-chain-bullet-size-stop);\n  min-width: var(--sbb-pearl-chain-bullet-size-stop);\n  height: var(--sbb-pearl-chain-bullet-size-stop);\n  width: var(--sbb-pearl-chain-bullet-size-stop);\n  border: var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;\n  background: Canvas;\n  border: var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;\n  background: Canvas;\n}\n.sbb-pearl-chain__stop--departure-skipped::before {\n  content: \"\";\n  position: absolute;\n  inset-block-start: 50%;\n  inset-inline-start: 50%;\n  transform: translate(-50%, -50%) rotate(45deg);\n  border-block-start: var(--sbb-pearl-chain-bullet-crossed-border-width) solid canvas;\n  background: var(--sbb-pearl-chain-bullet-color-disruption);\n  height: var(--sbb-pearl-chain-bullet-crossed-height);\n  width: var(--sbb-pearl-chain-bullet-crossed-width);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__stop--departure-skipped::before {\n    background: Highlight;\n  }\n}\n\n.sbb-pearl-chain--arrival-skipped,\n.sbb-pearl-chain--departure-skipped {\n  min-height: var(--sbb-pearl-chain-bullet-size-start-end);\n  min-width: var(--sbb-pearl-chain-bullet-size-start-end);\n  height: var(--sbb-pearl-chain-bullet-size-start-end);\n  width: var(--sbb-pearl-chain-bullet-size-start-end);\n  border: var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;\n  background: Canvas;\n}\n.sbb-pearl-chain--arrival-skipped::before,\n.sbb-pearl-chain--departure-skipped::before {\n  content: \"\";\n  position: absolute;\n  inset-block-start: 50%;\n  inset-inline-start: 50%;\n  transform: translate(-50%, -50%) rotate(45deg);\n  border-block-start: var(--sbb-pearl-chain-bullet-crossed-border-width) solid canvas;\n  background: var(--sbb-pearl-chain-bullet-color-disruption);\n  height: var(--sbb-pearl-chain-bullet-crossed-height);\n  width: var(--sbb-pearl-chain-bullet-crossed-width);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain--arrival-skipped::before,\n  .sbb-pearl-chain--departure-skipped::before {\n    background: Highlight;\n  }\n}\n\n.sbb-pearl-chain__leg::after {\n  content: \"\";\n  position: absolute;\n  inset-block: 0;\n  inset-inline-start: 0;\n  background-color: currentcolor;\n  border-radius: var(--sbb-pearl-chain-height);\n  z-index: 1;\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__leg::after {\n    background-color: CanvasText;\n  }\n  .sbb-pearl-chain--past .sbb-pearl-chain__leg::after {\n    background-color: GrayText;\n  }\n}\n\n.sbb-pearl-chain__leg:last-of-type::after {\n  inset-inline-end: calc(-1 * var(--sbb-pearl-chain-height));\n}\n\n.sbb-pearl-chain__leg--progress::after {\n  background-color: var(--sbb-pearl-chain-color-past);\n  width: var(--sbb-pearl-chain-leg-status);\n}\n\n.sbb-pearl-chain__position {\n  min-height: var(--sbb-pearl-chain-bullet-size-start-end);\n  min-width: var(--sbb-pearl-chain-bullet-size-start-end);\n  height: var(--sbb-pearl-chain-bullet-size-start-end);\n  width: var(--sbb-pearl-chain-bullet-size-start-end);\n  background: var(--sbb-pearl-chain-bullet-color);\n  color: var(--sbb-pearl-chain-bullet-color);\n  border-color: var(--sbb-pearl-chain-bullet-color);\n  border-radius: 100%;\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__position {\n    --sbb-pearl-chain-bullet-color: CanvasText;\n  }\n}\n.sbb-pearl-chain__position {\n  --sbb-pearl-chain-bullet-color: var(--sbb-pearl-chain-position-color);\n}\n@media (forced-colors: active) {\n  .sbb-pearl-chain__position {\n    --sbb-pearl-chain-position-color: Highlight;\n  }\n}\n@keyframes pearl-chain-bullet-position-pulse {\n  0% {\n    box-shadow: 0 0 0 0 var(--sbb-pearl-chain-position-color);\n  }\n  25% {\n    box-shadow: 0 0 0 0 var(--sbb-pearl-chain-position-color);\n  }\n  50% {\n    box-shadow: 0 0 0 0.1875rem color-mix(in srgb, var(--sbb-pearl-chain-position-color) 20%, transparent);\n  }\n  100% {\n    box-shadow: 0 0 0 0 var(--sbb-pearl-chain-position-color);\n  }\n}\n.sbb-pearl-chain__position {\n  animation: pearl-chain-bullet-position-pulse var(--sbb-pearl-chain-bullet-animation-duration) var(--sbb-pearl-chain-bullet-animation-easing) infinite;\n  position: absolute;\n  inset-block-start: -200%;\n  z-index: 4;\n  inset-inline-start: var(--sbb-pearl-chain-status-position);\n}\n\n.sbb-pearl-chain__position--no-animation {\n  animation: unset;\n}\n";
 //#endregion
-//#region src/elements-experimental/pearl-chain/pearl-chain.component.ts
+//#region src/elements-experimental/pearl-chain-legacy/pearl-chain-legacy.component.ts
 /**
 * It visually displays journey information.
+* @deprecated Use `sbb-pearl-chain` instead.
 */
-let SbbPearlChainElement = (() => {
+let SbbPearlChainLegacyElement = (() => {
 	let _classSuper = SbbElement;
 	let _instanceExtraInitializers = [];
 	let _legs_decorators;
@@ -370,7 +371,7 @@ let SbbPearlChainElement = (() => {
 	let _disableAnimation_initializers = [];
 	let _disableAnimation_extraInitializers = [];
 	let _set_now_decorators;
-	return class SbbPearlChainElement extends _classSuper {
+	return class SbbPearlChainLegacyElement extends _classSuper {
 		constructor() {
 			super(...arguments);
 			this.#legs_accessor_storage = (__runInitializers(this, _instanceExtraInitializers), __runInitializers(this, _legs_initializers, []));
@@ -434,10 +435,10 @@ let SbbPearlChainElement = (() => {
 			});
 		}
 		static {
-			this.elementName = "sbb-pearl-chain";
+			this.elementName = "sbb-pearl-chain-legacy";
 		}
 		static {
-			this.styles = [screenReaderOnlyStyles, unsafeCSS(pearl_chain_default)];
+			this.styles = [screenReaderOnlyStyles, unsafeCSS(pearl_chain_legacy_default)];
 		}
 		#legs_accessor_storage;
 		/**
@@ -617,4 +618,4 @@ let SbbPearlChainElement = (() => {
 })();
 //#endregion
-export { SbbPearlChainElement };
+export { SbbPearlChainLegacyElement };

package/development/pearl-chain-time/pearl-chain-time.component.d.ts CHANGED Viewed

@@ -2,7 +2,8 @@ import { SbbElement, type SbbElementType } from '@sbb-esta/lyne-elements/core.js
 import { type CSSResultGroup, type TemplateResult } from 'lit';
 import type { Leg, PtRideLeg } from '../core.ts';
 /**
- * Combined with `sbb-pearl-chain`, it displays walk time information.
+ * Combined with `sbb-pearl-chain-legacy`, it displays walk time information.
+ * @deprecated Use `sbb-pearl-chain` instead.
  */
 export declare class SbbPearlChainTimeElement extends SbbElement {
     static readonly elementName: string;

package/development/pearl-chain-time.pure.js CHANGED Viewed

@@ -4,7 +4,7 @@ import { SbbIconElement } from "@sbb-esta/lyne-elements/icon.pure.js";
 import { html, nothing, unsafeCSS } from "lit";
 import { property } from "lit/decorators.js";
 import { getDepartureArrivalTimeAttribute, isRideLeg, removeTimezoneFromISOTimeString } from "./core.js";
-import { SbbPearlChainElement } from "./pearl-chain.pure.js";
+import { SbbPearlChainLegacyElement } from "./pearl-chain-legacy.pure.js";
 //#region node_modules/date-fns/constants.js
 /**
@@ -2284,7 +2284,8 @@ var pearl_chain_time_default = ":host {\n  display: block;\n  --sbb-pearl-chain-
 //#endregion
 //#region src/elements-experimental/pearl-chain-time/pearl-chain-time.component.ts
 /**
-* Combined with `sbb-pearl-chain`, it displays walk time information.
+* Combined with `sbb-pearl-chain-legacy`, it displays walk time information.
+* @deprecated Use `sbb-pearl-chain` instead.
 */
 let SbbPearlChainTimeElement = (() => {
 	let _classSuper = SbbElement;
@@ -2468,7 +2469,7 @@ let SbbPearlChainTimeElement = (() => {
 			this.elementName = "sbb-pearl-chain-time";
 		}
 		static {
-			this.elementDependencies = [SbbIconElement, SbbPearlChainElement];
+			this.elementDependencies = [SbbIconElement, SbbPearlChainLegacyElement];
 		}
 		static {
 			this.styles = [screenReaderOnlyStyles, unsafeCSS(pearl_chain_time_default)];
@@ -2566,12 +2567,12 @@ let SbbPearlChainTimeElement = (() => {
         ${rideLegs?.length > 1 ? html`<span class="sbb-screen-reader-only" role="paragraph">
                 ${rideLegs?.length - 1} ${i18nTransferProcedures[this._language.current]}
               </span>` : nothing}
-        <sbb-pearl-chain
+        <sbb-pearl-chain-legacy
           class="sbb-pearl-chain__time-chain"
           .legs=${this.legs}
           .disableAnimation=${this.disableAnimation}
           .now=${this.now}
-        ></sbb-pearl-chain>
+        ></sbb-pearl-chain-legacy>
         ${arrival ? html`<time class="sbb-pearl-chain__time-time" datetime=${this.arrivalTime}>
                 <span class="sbb-screen-reader-only"
                   >${i18nArrival[this._language.current]}:&nbsp;</span

package/development/pearl-chain-vertical/pearl-chain-vertical.component.d.ts CHANGED Viewed

@@ -4,6 +4,7 @@ import { type CSSResultGroup, type TemplateResult } from 'lit';
  * It can be used as a container for the `sbb-pearl-chain-vertical-item` component.
  *
  * @slot - The unnamed slot is used for the `sbb-pearl-chain-vertical-item` component.
+ * @deprecated Use `sbb-pearl-chain` instead.
  */
 export declare class SbbPearlChainVerticalElement extends SbbElement {
     static readonly elementName: string;

package/development/pearl-chain-vertical-item/pearl-chain-vertical-item.component.d.ts CHANGED Viewed

@@ -18,6 +18,7 @@ export interface PearlChainVerticalItemAttributes {
  *
  * @slot left - Content of the left side of the item
  * @slot right - Content of the right side of the item
+ * @deprecated Use `sbb-pearl-chain` instead.
  */
 export declare class SbbPearlChainVerticalItemElement extends SbbElement {
     static readonly elementName: string;

package/development/pearl-chain-vertical-item.pure.js CHANGED Viewed

@@ -14,6 +14,7 @@ var pearl_chain_vertical_item_default = ":host {\n  --sbb-pearl-chain-position-c
 *
 * @slot left - Content of the left side of the item
 * @slot right - Content of the right side of the item
+* @deprecated Use `sbb-pearl-chain` instead.
 */
 let SbbPearlChainVerticalItemElement = (() => {
 	let _classSuper = SbbElement;

package/development/pearl-chain-vertical.pure.js CHANGED Viewed

@@ -10,6 +10,7 @@ var pearl_chain_vertical_default = ":host {\n  --sbb-pearl-chain-vertical-width:
 * It can be used as a container for the `sbb-pearl-chain-vertical-item` component.
 *
 * @slot - The unnamed slot is used for the `sbb-pearl-chain-vertical-item` component.
+* @deprecated Use `sbb-pearl-chain` instead.
 */
 var SbbPearlChainVerticalElement = class extends SbbElement {
 	static {

package/index.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import { SbbAutocompleteGridButtonElement, SbbAutocompleteGridCellElement, SbbAutocompleteGridElement, SbbAutocompleteGridOptgroupElement, SbbAutocompleteGridOptionElement, SbbAutocompleteGridRowElement } from "./autocomplete-grid.js";
 import { SbbEasterEggElement } from "./easter-egg.js";
 import { SbbJourneySummaryElement } from "./journey-summary.js";
-import { SbbPearlChainElement } from "./pearl-chain.js";
+import { SbbPearlChainLegacyElement } from "./pearl-chain-legacy.js";
 import { SbbPearlChainTimeElement } from "./pearl-chain-time.js";
 import { SbbPearlChainVerticalElement } from "./pearl-chain-vertical.js";
 import { SbbPearlChainVerticalItemElement } from "./pearl-chain-vertical-item.js";
@@ -17,7 +17,7 @@ declare global {
   var SbbAutocompleteGridRowElement: SbbAutocompleteGridRowElement;
   var SbbEasterEggElement: SbbEasterEggElement;
   var SbbJourneySummaryElement: SbbJourneySummaryElement;
-  var SbbPearlChainElement: SbbPearlChainElement;
+  var SbbPearlChainLegacyElement: SbbPearlChainLegacyElement;
   var SbbPearlChainTimeElement: SbbPearlChainTimeElement;
   var SbbPearlChainVerticalElement: SbbPearlChainVerticalElement;
   var SbbPearlChainVerticalItemElement: SbbPearlChainVerticalItemElement;

package/index.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { SbbAutocompleteGridButtonElement, SbbAutocompleteGridCellElement, SbbAutocompleteGridElement, SbbAutocompleteGridOptgroupElement, SbbAutocompleteGridOptionElement, SbbAutocompleteGridRowElement } from "./autocomplete-grid.js";
 import { SbbEasterEggElement } from "./easter-egg.js";
 import { SbbJourneySummaryElement } from "./journey-summary.js";
-import { SbbPearlChainElement } from "./pearl-chain.js";
+import { SbbPearlChainLegacyElement } from "./pearl-chain-legacy.js";
 import { SbbPearlChainTimeElement } from "./pearl-chain-time.js";
 import { SbbPearlChainVerticalElement } from "./pearl-chain-vertical.js";
 import { SbbPearlChainVerticalItemElement } from "./pearl-chain-vertical-item.js";
@@ -17,7 +17,7 @@ globalThis.SbbAutocompleteGridOptionElement = SbbAutocompleteGridOptionElement;
 globalThis.SbbAutocompleteGridRowElement = SbbAutocompleteGridRowElement;
 globalThis.SbbEasterEggElement = SbbEasterEggElement;
 globalThis.SbbJourneySummaryElement = SbbJourneySummaryElement;
-globalThis.SbbPearlChainElement = SbbPearlChainElement;
+globalThis.SbbPearlChainLegacyElement = SbbPearlChainLegacyElement;
 globalThis.SbbPearlChainTimeElement = SbbPearlChainTimeElement;
 globalThis.SbbPearlChainVerticalElement = SbbPearlChainVerticalElement;
 globalThis.SbbPearlChainVerticalItemElement = SbbPearlChainVerticalItemElement;

package/package.json CHANGED Viewed

@@ -1,12 +1,12 @@
 {
   "name": "@sbb-esta/lyne-elements-experimental-dev",
-  "version": "5.11.0-dev.1791971559",
+  "version": "5.11.0-dev.1791974631",
   "description": "Lyne Design System",
   "keywords": [
     "design system",
     "web components",
     "lit",
-    "https://github.com/sbb-design-systems/lyne-components/commit/6883306792b6bae735ab025e980c8ed9aa1dd047"
+    "https://github.com/sbb-design-systems/lyne-components/commit/c283340885308d8e4a85c6ef9512a79b63cad189"
   ],
   "type": "module",
   "exports": {
@@ -80,10 +80,15 @@
       "development": "./development/journey-summary.pure.js",
       "default": "./journey-summary.pure.js"
     },
-    "./pearl-chain.js": {
-      "types": "./development/pearl-chain.d.ts",
-      "development": "./development/pearl-chain.js",
-      "default": "./pearl-chain.js"
+    "./pearl-chain-legacy.js": {
+      "types": "./development/pearl-chain-legacy.d.ts",
+      "development": "./development/pearl-chain-legacy.js",
+      "default": "./pearl-chain-legacy.js"
+    },
+    "./pearl-chain-legacy.pure.js": {
+      "types": "./development/pearl-chain-legacy.pure.d.ts",
+      "development": "./development/pearl-chain-legacy.pure.js",
+      "default": "./pearl-chain-legacy.pure.js"
     },
     "./pearl-chain-time.js": {
       "types": "./development/pearl-chain-time.d.ts",
@@ -115,11 +120,6 @@
       "development": "./development/pearl-chain-vertical.pure.js",
       "default": "./pearl-chain-vertical.pure.js"
     },
-    "./pearl-chain.pure.js": {
-      "types": "./development/pearl-chain.pure.d.ts",
-      "development": "./development/pearl-chain.pure.js",
-      "default": "./pearl-chain.pure.js"
-    },
     "./seat-reservation.js": {
       "types": "./development/seat-reservation.d.ts",
       "development": "./development/seat-reservation.js",

package/pearl-chain-legacy.js ADDED Viewed

	@@ -0,0 +1 @@
1	+ import{SbbPearlChainLegacyElement as e}from"./pearl-chain-legacy.pure.js";export*from"./pearl-chain-legacy.pure.js";e.define();

package/{pearl-chain.pure.js → pearl-chain-legacy.pure.js} RENAMED Viewed

@@ -1,5 +1,5 @@
 import{__esDecorate as e,__runInitializers as t}from"tslib";import{SbbElement as n,defaultDateAdapter as r,forceType as i,screenReaderOnlyStyles as a}from"@sbb-esta/lyne-elements/core.js";import{html as o,nothing as s,unsafeCSS as c}from"lit";import{property as l}from"lit/decorators.js";import{styleMap as u}from"lit/directives/style-map.js";import{isRideLeg as d,removeTimezoneFromISOTimeString as f}from"./core.js";const p=6e4,m=Symbol.for(`constructDateFrom`);function h(e,t){return typeof e==`function`?e(t):e&&typeof e==`object`&&m in e?e[m](t):e instanceof Date?new e.constructor(t):new Date(t)}function g(e,t){return h(t||e,e)}function _(e,t,n){let r=g(e,n?.in);return r.setTime(r.getTime()+t*p),r}function v(e){return t=>{let n=(e?Math[e]:Math.trunc)(t);return n===0?0:n}}function y(e,t){return+g(e)-g(t)}function b(e,t,n){let r=y(e,t)/p;return v(n?.roundingMethod)(r)}function x(e,t){return+g(e)>+g(t)}function S(e,t){return+g(e)<+g(t)}var C=`: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%;--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:light-dark(var(--sbb-color-metal),var(--sbb-color-granite));--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:block}.sbb-pearl-chain{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);flex-wrap:nowrap;justify-content:space-between;padding-inline-end:var(--sbb-pearl-chain-bullet-size-start-end);display:flex;position:relative}.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:"";z-index:3;background-color:currentColor;position:absolute;inset-block-start:0}.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{height:var(--sbb-pearl-chain-height);border-inline-end:var(--sbb-pearl-chain-spacing-small) solid Canvas;width:var(--sbb-pearl-chain-leg-width);background-color:currentColor;flex-grow:0;flex-shrink:0;align-items:center;display:flex;position:relative}@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{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%;position:relative}@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;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;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--cancelled-expected:after{background-color:unset;background-image:linear-gradient(90deg,currentColor 0% 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--cancelled-expected:after{background:unset;border-block-start:.0625rem dashed highlight;transform:translateY(.0625rem)}}.sbb-pearl-chain__leg--disruption:after{background-color:unset;background-image:linear-gradient(90deg,currentColor 0% 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(90deg,currentColor 0% 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;border:var(--sbb-pearl-chain-bullet-border-width) solid currentcolor;background:canvas}.sbb-pearl-chain__stop--departure-skipped:before{content:"";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);position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)rotate(45deg)}@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:"";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);position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)rotate(45deg)}@media (forced-colors:active){.sbb-pearl-chain--arrival-skipped:before,.sbb-pearl-chain--departure-skipped:before{background:highlight}}.sbb-pearl-chain__leg:after{content:"";border-radius:var(--sbb-pearl-chain-height);z-index:1;background-color:currentColor;position:absolute;inset-block:0;inset-inline-start:0}@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;z-index:4;position:absolute;inset-block-start:-200%;inset-inline-start:var(--sbb-pearl-chain-status-position)}.sbb-pearl-chain__position--no-animation{animation:unset}
-`;let w=(()=>{let p=n,m=[],h,g=[],v=[],y,w=[],T=[],E;return class extends p{constructor(){super(...arguments),this.#e=(t(this,m),t(this,g,[])),this.#t=(t(this,v),t(this,w,!1)),this._now=(t(this,T),null)}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(p[Symbol.metadata]??null):void 0;h=[l({type:Array})],y=[i(),l({attribute:`disable-animation`,type:Boolean})],E=[l()],e(this,null,h,{kind:`accessor`,name:`legs`,static:!1,private:!1,access:{has:e=>`legs`in e,get:e=>e.legs,set:(e,t)=>{e.legs=t}},metadata:t},g,v),e(this,null,y,{kind:`accessor`,name:`disableAnimation`,static:!1,private:!1,access:{has:e=>`disableAnimation`in e,get:e=>e.disableAnimation,set:(e,t)=>{e.disableAnimation=t}},metadata:t},w,T),e(this,null,E,{kind:`setter`,name:`now`,static:!1,private:!1,access:{has:e=>`now`in e,set:(e,t)=>{e.now=t}},metadata:t},null,m),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-pearl-chain`}static{this.styles=[a,c(C)]}#e;get legs(){return this.#e}set legs(e){this.#e=e}#t;get disableAnimation(){return this.#t}set disableAnimation(e){this.#t=e}set now(e){this._now=r.getValidDateOrNull(r.deserialize(e))}get now(){return this._now}_getAllDuration(e){return e?.reduce((e,t)=>{let n=f(t.arrival?.time),r=f(t.departure?.time);return n&&r?e+b(f(t.arrival.time),f(t.departure.time)):e},0)}_isAllCancelled(e){return e?.every(e=>e?.serviceJourney?.serviceAlteration?.cancelled)}_getRelativeDuration(e,t){let n=f(t.arrival?.time),r=f(t.departure?.time);if(n&&r){let n=b(f(t.arrival.time),f(t.departure.time)),r=this._getAllDuration(e);return r===0?100:n/r*100}return 0}_getProgress(e,t,n){if(!t?.time||!n?.time)return 0;let r=_(t.time,t.delay??0),i=b(_(n.time,n.delay??0),r),a=b(e,r);return i&&a/i*100}_getStatus(e,t,n){let r=t&&t.time&&_(t.time,t.delay??0),i=n&&n.time&&_(n.time,n.delay??0);return r&&S(r,e)&&i&&x(i,e)?`progress`:i&&S(i,e)?`past`:`future`}_renderPosition(e,t,n){let r=this._getProgress(e,t,n);if(r<0&&r>100)return;let i=()=>({"--sbb-pearl-chain-status-position":`${r}%`,...r>=50?{transform:`translateX(-100%)`}:{}}),a=this.disableAnimation?`sbb-pearl-chain__position--no-animation`:``;return o`<span
+`;let w=(()=>{let p=n,m=[],h,g=[],v=[],y,w=[],T=[],E;return class extends p{constructor(){super(...arguments),this.#e=(t(this,m),t(this,g,[])),this.#t=(t(this,v),t(this,w,!1)),this._now=(t(this,T),null)}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(p[Symbol.metadata]??null):void 0;h=[l({type:Array})],y=[i(),l({attribute:`disable-animation`,type:Boolean})],E=[l()],e(this,null,h,{kind:`accessor`,name:`legs`,static:!1,private:!1,access:{has:e=>`legs`in e,get:e=>e.legs,set:(e,t)=>{e.legs=t}},metadata:t},g,v),e(this,null,y,{kind:`accessor`,name:`disableAnimation`,static:!1,private:!1,access:{has:e=>`disableAnimation`in e,get:e=>e.disableAnimation,set:(e,t)=>{e.disableAnimation=t}},metadata:t},w,T),e(this,null,E,{kind:`setter`,name:`now`,static:!1,private:!1,access:{has:e=>`now`in e,set:(e,t)=>{e.now=t}},metadata:t},null,m),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-pearl-chain-legacy`}static{this.styles=[a,c(C)]}#e;get legs(){return this.#e}set legs(e){this.#e=e}#t;get disableAnimation(){return this.#t}set disableAnimation(e){this.#t=e}set now(e){this._now=r.getValidDateOrNull(r.deserialize(e))}get now(){return this._now}_getAllDuration(e){return e?.reduce((e,t)=>{let n=f(t.arrival?.time),r=f(t.departure?.time);return n&&r?e+b(f(t.arrival.time),f(t.departure.time)):e},0)}_isAllCancelled(e){return e?.every(e=>e?.serviceJourney?.serviceAlteration?.cancelled)}_getRelativeDuration(e,t){let n=f(t.arrival?.time),r=f(t.departure?.time);if(n&&r){let n=b(f(t.arrival.time),f(t.departure.time)),r=this._getAllDuration(e);return r===0?100:n/r*100}return 0}_getProgress(e,t,n){if(!t?.time||!n?.time)return 0;let r=_(t.time,t.delay??0),i=b(_(n.time,n.delay??0),r),a=b(e,r);return i&&a/i*100}_getStatus(e,t,n){let r=t&&t.time&&_(t.time,t.delay??0),i=n&&n.time&&_(n.time,n.delay??0);return r&&S(r,e)&&i&&x(i,e)?`progress`:i&&S(i,e)?`past`:`future`}_renderPosition(e,t,n){let r=this._getProgress(e,t,n);if(r<0&&r>100)return;let i=()=>({"--sbb-pearl-chain-status-position":`${r}%`,...r>=50?{transform:`translateX(-100%)`}:{}}),a=this.disableAnimation?`sbb-pearl-chain__position--no-animation`:``;return o`<span
       style=${u(i())}
       class="sbb-pearl-chain__position ${a}"
     ></span>`}render(){let e=this.now??/* @__PURE__ */ new Date,t=this.legs?.filter(e=>d(e)),n=t?.length&&f(t[0]?.departure?.time),r=n&&{time:n,delay:t[0].departure.delay??0},i=t?.length&&f(t[t.length-1].arrival?.time),a=i&&{time:i,delay:t[t.length-1]?.arrival.delay??0},c=t&&t[0]?.serviceJourney?.stopPoints&&t[0]?.serviceJourney?.stopPoints[0].stopStatus===`NOT_SERVICED`?`sbb-pearl-chain--departure-skipped`:``,l=(()=>{let e=t&&t[t.length-1],n=e&&e.serviceJourney?.stopPoints;return n&&n[n.length-1].stopStatus===`NOT_SERVICED`?`sbb-pearl-chain--arrival-skipped`:``})(),p=t&&t[0]?.serviceJourney?.serviceAlteration?.cancelled?`sbb-pearl-chain--departure-disruption`:``,m=t&&t[t.length-1]?.serviceJourney?.serviceAlteration?.cancelled?`sbb-pearl-chain--arrival-disruption`:``,h=r&&a&&this._getStatus(e,r,a),g=t&&h&&!p?`sbb-pearl-chain__bullet--`+h:``,_=t&&h&&!m?`sbb-pearl-chain__bullet--`+this._getStatus(e,void 0,a):``;return this._isAllCancelled(t)?o`
@@ -24,4 +24,4 @@ import{__esDecorate as e,__runInitializers as t}from"tslib";import{SbbElement as
           class="sbb-pearl-chain__bullet ${_} ${l} ${m}"
         ></span>
       </div>
-    `}}})();export{w as SbbPearlChainElement};
+    `}}})();export{w as SbbPearlChainLegacyElement};

package/pearl-chain-time.pure.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import{__esDecorate as e,__runInitializers as t}from"tslib";import{SbbElement as n,SbbLanguageController as r,defaultDateAdapter as i,forceType as a,i18nArrival as o,i18nDeparture as s,i18nTransferProcedures as c,screenReaderOnlyStyles as l}from"@sbb-esta/lyne-elements/core.js";import{SbbIconElement as u}from"@sbb-esta/lyne-elements/icon.pure.js";import{html as d,nothing as f,unsafeCSS as ee}from"lit";import{property as p}from"lit/decorators.js";import{getDepartureArrivalTimeAttribute as te,isRideLeg as ne,removeTimezoneFromISOTimeString as m}from"./core.js";import{SbbPearlChainElement as re}from"./pearl-chain.pure.js";const h=6048e5,g=Symbol.for(`constructDateFrom`);function _(e,t){return typeof e==`function`?e(t):e&&typeof e==`object`&&g in e?e[g](t):e instanceof Date?new e.constructor(t):new Date(t)}function v(e,t){return _(t||e,e)}let y={};function b(){return y}function x(e,t){let n=b(),r=t?.weekStartsOn??t?.locale?.options?.weekStartsOn??n.weekStartsOn??n.locale?.options?.weekStartsOn??0,i=v(e,t?.in),a=i.getDay(),o=(a<r?7:0)+a-r;return i.setDate(i.getDate()-o),i.setHours(0,0,0,0),i}function S(e,t){return x(e,{...t,weekStartsOn:1})}function C(e,t){let n=v(e,t?.in),r=n.getFullYear(),i=_(n,0);i.setFullYear(r+1,0,4),i.setHours(0,0,0,0);let a=S(i),o=_(n,0);o.setFullYear(r,0,4),o.setHours(0,0,0,0);let s=S(o);return n.getTime()>=a.getTime()?r+1:n.getTime()>=s.getTime()?r:r-1}function w(e){let t=v(e),n=new Date(Date.UTC(t.getFullYear(),t.getMonth(),t.getDate(),t.getHours(),t.getMinutes(),t.getSeconds(),t.getMilliseconds()));return n.setUTCFullYear(t.getFullYear()),+e-n}function T(e,...t){let n=_.bind(null,e||t.find(e=>typeof e==`object`));return t.map(n)}function E(e,t){let n=v(e,t?.in);return n.setHours(0,0,0,0),n}function D(e,t,n){let[r,i]=T(n?.in,e,t),a=E(r),o=E(i),s=+a-w(a),c=+o-w(o);return Math.round((s-c)/864e5)}function O(e,t){let n=C(e,t),r=_(t?.in||e,0);return r.setFullYear(n,0,4),r.setHours(0,0,0,0),S(r)}function k(e){return e instanceof Date||typeof e==`object`&&Object.prototype.toString.call(e)===`[object Date]`}function A(e){return!(!k(e)&&typeof e!=`number`||isNaN(+v(e)))}function j(e,t){let n=v(e,t?.in);return n.setFullYear(n.getFullYear(),0,1),n.setHours(0,0,0,0),n}const M={lessThanXSeconds:{one:`less than a second`,other:`less than {{count}} seconds`},xSeconds:{one:`1 second`,other:`{{count}} seconds`},halfAMinute:`half a minute`,lessThanXMinutes:{one:`less than a minute`,other:`less than {{count}} minutes`},xMinutes:{one:`1 minute`,other:`{{count}} minutes`},aboutXHours:{one:`about 1 hour`,other:`about {{count}} hours`},xHours:{one:`1 hour`,other:`{{count}} hours`},xDays:{one:`1 day`,other:`{{count}} days`},aboutXWeeks:{one:`about 1 week`,other:`about {{count}} weeks`},xWeeks:{one:`1 week`,other:`{{count}} weeks`},aboutXMonths:{one:`about 1 month`,other:`about {{count}} months`},xMonths:{one:`1 month`,other:`{{count}} months`},aboutXYears:{one:`about 1 year`,other:`about {{count}} years`},xYears:{one:`1 year`,other:`{{count}} years`},overXYears:{one:`over 1 year`,other:`over {{count}} years`},almostXYears:{one:`almost 1 year`,other:`almost {{count}} years`}},N=(e,t,n)=>{let r,i=M[e];return r=typeof i==`string`?i:t===1?i.one:i.other.replace(`{{count}}`,t.toString()),n?.addSuffix?n.comparison&&n.comparison>0?`in `+r:r+` ago`:r};function P(e){return(t={})=>{let n=t.width?String(t.width):e.defaultWidth;return e.formats[n]||e.formats[e.defaultWidth]}}const F={date:P({formats:{full:`EEEE, MMMM do, y`,long:`MMMM do, y`,medium:`MMM d, y`,short:`MM/dd/yyyy`},defaultWidth:`full`}),time:P({formats:{full:`h:mm:ss a zzzz`,long:`h:mm:ss a z`,medium:`h:mm:ss a`,short:`h:mm a`},defaultWidth:`full`}),dateTime:P({formats:{full:`{{date}} 'at' {{time}}`,long:`{{date}} 'at' {{time}}`,medium:`{{date}}, {{time}}`,short:`{{date}}, {{time}}`},defaultWidth:`full`})},I={lastWeek:`'last' eeee 'at' p`,yesterday:`'yesterday at' p`,today:`'today at' p`,tomorrow:`'tomorrow at' p`,nextWeek:`eeee 'at' p`,other:`P`},L=(e,t,n,r)=>I[e];function R(e){return(t,n)=>{let r=n?.context?String(n.context):`standalone`,i;if(r===`formatting`&&e.formattingValues){let t=e.defaultFormattingWidth||e.defaultWidth,r=n?.width?String(n.width):t;i=e.formattingValues[r]||e.formattingValues[t]}else{let t=e.defaultWidth,r=n?.width?String(n.width):e.defaultWidth;i=e.values[r]||e.values[t]}let a=e.argumentCallback?e.argumentCallback(t):t;return i[a]}}const ie={ordinalNumber:(e,t)=>{let n=Number(e),r=n%100;if(r>20||r<10)switch(r%10){case 1:return n+`st`;case 2:return n+`nd`;case 3:return n+`rd`}return n+`th`},era:R({values:{narrow:[`B`,`A`],abbreviated:[`BC`,`AD`],wide:[`Before Christ`,`Anno Domini`]},defaultWidth:`wide`}),quarter:R({values:{narrow:[`1`,`2`,`3`,`4`],abbreviated:[`Q1`,`Q2`,`Q3`,`Q4`],wide:[`1st quarter`,`2nd quarter`,`3rd quarter`,`4th quarter`]},defaultWidth:`wide`,argumentCallback:e=>e-1}),month:R({values:{narrow:[`J`,`F`,`M`,`A`,`M`,`J`,`J`,`A`,`S`,`O`,`N`,`D`],abbreviated:[`Jan`,`Feb`,`Mar`,`Apr`,`May`,`Jun`,`Jul`,`Aug`,`Sep`,`Oct`,`Nov`,`Dec`],wide:[`January`,`February`,`March`,`April`,`May`,`June`,`July`,`August`,`September`,`October`,`November`,`December`]},defaultWidth:`wide`}),day:R({values:{narrow:[`S`,`M`,`T`,`W`,`T`,`F`,`S`],short:[`Su`,`Mo`,`Tu`,`We`,`Th`,`Fr`,`Sa`],abbreviated:[`Sun`,`Mon`,`Tue`,`Wed`,`Thu`,`Fri`,`Sat`],wide:[`Sunday`,`Monday`,`Tuesday`,`Wednesday`,`Thursday`,`Friday`,`Saturday`]},defaultWidth:`wide`}),dayPeriod:R({values:{narrow:{am:`a`,pm:`p`,midnight:`mi`,noon:`n`,morning:`morning`,afternoon:`afternoon`,evening:`evening`,night:`night`},abbreviated:{am:`AM`,pm:`PM`,midnight:`midnight`,noon:`noon`,morning:`morning`,afternoon:`afternoon`,evening:`evening`,night:`night`},wide:{am:`a.m.`,pm:`p.m.`,midnight:`midnight`,noon:`noon`,morning:`morning`,afternoon:`afternoon`,evening:`evening`,night:`night`}},defaultWidth:`wide`,formattingValues:{narrow:{am:`a`,pm:`p`,midnight:`mi`,noon:`n`,morning:`in the morning`,afternoon:`in the afternoon`,evening:`in the evening`,night:`at night`},abbreviated:{am:`AM`,pm:`PM`,midnight:`midnight`,noon:`noon`,morning:`in the morning`,afternoon:`in the afternoon`,evening:`in the evening`,night:`at night`},wide:{am:`a.m.`,pm:`p.m.`,midnight:`midnight`,noon:`noon`,morning:`in the morning`,afternoon:`in the afternoon`,evening:`in the evening`,night:`at night`}},defaultFormattingWidth:`wide`})};function z(e){return(t,n={})=>{let r=n.width,i=r&&e.matchPatterns[r]||e.matchPatterns[e.defaultMatchWidth],a=t.match(i);if(!a)return null;let o=a[0],s=r&&e.parsePatterns[r]||e.parsePatterns[e.defaultParseWidth],c=Array.isArray(s)?oe(s,e=>e.test(o)):ae(s,e=>e.test(o)),l;l=e.valueCallback?e.valueCallback(c):c,l=n.valueCallback?n.valueCallback(l):l;let u=t.slice(o.length);return{value:l,rest:u}}}function ae(e,t){for(let n in e)if(Object.prototype.hasOwnProperty.call(e,n)&&t(e[n]))return n}function oe(e,t){for(let n=0;n<e.length;n++)if(t(e[n]))return n}function se(e){return(t,n={})=>{let r=t.match(e.matchPattern);if(!r)return null;let i=r[0],a=t.match(e.parsePattern);if(!a)return null;let o=e.valueCallback?e.valueCallback(a[0]):a[0];o=n.valueCallback?n.valueCallback(o):o;let s=t.slice(i.length);return{value:o,rest:s}}}const ce={code:`en-US`,formatDistance:N,formatLong:F,formatRelative:L,localize:ie,match:{ordinalNumber:se({matchPattern:/^(\d+)(th|st|nd|rd)?/i,parsePattern:/\d+/i,valueCallback:e=>parseInt(e,10)}),era:z({matchPatterns:{narrow:/^(b|a)/i,abbreviated:/^(b\.?\s?c\.?|b\.?\s?c\.?\s?e\.?|a\.?\s?d\.?|c\.?\s?e\.?)/i,wide:/^(before christ|before common era|anno domini|common era)/i},defaultMatchWidth:`wide`,parsePatterns:{any:[/^b/i,/^(a|c)/i]},defaultParseWidth:`any`}),quarter:z({matchPatterns:{narrow:/^[1234]/i,abbreviated:/^q[1234]/i,wide:/^[1234](th|st|nd|rd)? quarter/i},defaultMatchWidth:`wide`,parsePatterns:{any:[/1/i,/2/i,/3/i,/4/i]},defaultParseWidth:`any`,valueCallback:e=>e+1}),month:z({matchPatterns:{narrow:/^[jfmasond]/i,abbreviated:/^(jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec)/i,wide:/^(january|february|march|april|may|june|july|august|september|october|november|december)/i},defaultMatchWidth:`wide`,parsePatterns:{narrow:[/^j/i,/^f/i,/^m/i,/^a/i,/^m/i,/^j/i,/^j/i,/^a/i,/^s/i,/^o/i,/^n/i,/^d/i],any:[/^ja/i,/^f/i,/^mar/i,/^ap/i,/^may/i,/^jun/i,/^jul/i,/^au/i,/^s/i,/^o/i,/^n/i,/^d/i]},defaultParseWidth:`any`}),day:z({matchPatterns:{narrow:/^[smtwf]/i,short:/^(su|mo|tu|we|th|fr|sa)/i,abbreviated:/^(sun|mon|tue|wed|thu|fri|sat)/i,wide:/^(sunday|monday|tuesday|wednesday|thursday|friday|saturday)/i},defaultMatchWidth:`wide`,parsePatterns:{narrow:[/^s/i,/^m/i,/^t/i,/^w/i,/^t/i,/^f/i,/^s/i],any:[/^su/i,/^m/i,/^tu/i,/^w/i,/^th/i,/^f/i,/^sa/i]},defaultParseWidth:`any`}),dayPeriod:z({matchPatterns:{narrow:/^(a|p|mi|n|(in the|at) (morning|afternoon|evening|night))/i,any:/^([ap]\.?\s?m\.?|midnight|noon|(in the|at) (morning|afternoon|evening|night))/i},defaultMatchWidth:`any`,parsePatterns:{any:{am:/^a/i,pm:/^p/i,midnight:/^mi/i,noon:/^no/i,morning:/morning/i,afternoon:/afternoon/i,evening:/evening/i,night:/night/i}},defaultParseWidth:`any`})},options:{weekStartsOn:0,firstWeekContainsDate:1}};function le(e,t){let n=v(e,t?.in);return D(n,j(n))+1}function ue(e,t){let n=v(e,t?.in),r=+S(n)-O(n);return Math.round(r/h)+1}function B(e,t){let n=v(e,t?.in),r=n.getFullYear(),i=b(),a=t?.firstWeekContainsDate??t?.locale?.options?.firstWeekContainsDate??i.firstWeekContainsDate??i.locale?.options?.firstWeekContainsDate??1,o=_(t?.in||e,0);o.setFullYear(r+1,0,a),o.setHours(0,0,0,0);let s=x(o,t),c=_(t?.in||e,0);c.setFullYear(r,0,a),c.setHours(0,0,0,0);let l=x(c,t);return+n>=+s?r+1:+n>=+l?r:r-1}function V(e,t){let n=b(),r=t?.firstWeekContainsDate??t?.locale?.options?.firstWeekContainsDate??n.firstWeekContainsDate??n.locale?.options?.firstWeekContainsDate??1,i=B(e,t),a=_(t?.in||e,0);return a.setFullYear(i,0,r),a.setHours(0,0,0,0),x(a,t)}function H(e,t){let n=v(e,t?.in),r=+x(n,t)-V(n,t);return Math.round(r/h)+1}function U(e,t){return(e<0?`-`:``)+Math.abs(e).toString().padStart(t,`0`)}const W={y(e,t){let n=e.getFullYear(),r=n>0?n:1-n;return U(t===`yy`?r%100:r,t.length)},M(e,t){let n=e.getMonth();return t===`M`?String(n+1):U(n+1,2)},d(e,t){return U(e.getDate(),t.length)},a(e,t){let n=e.getHours()/12>=1?`pm`:`am`;switch(t){case`a`:case`aa`:return n.toUpperCase();case`aaa`:return n;case`aaaaa`:return n[0];default:return n===`am`?`a.m.`:`p.m.`}},h(e,t){return U(e.getHours()%12||12,t.length)},H(e,t){return U(e.getHours(),t.length)},m(e,t){return U(e.getMinutes(),t.length)},s(e,t){return U(e.getSeconds(),t.length)},S(e,t){let n=t.length,r=e.getMilliseconds();return U(Math.trunc(r*10**(n-3)),t.length)}},G={am:`am`,pm:`pm`,midnight:`midnight`,noon:`noon`,morning:`morning`,afternoon:`afternoon`,evening:`evening`,night:`night`},K={G:function(e,t,n){let r=+(e.getFullYear()>0);switch(t){case`G`:case`GG`:case`GGG`:return n.era(r,{width:`abbreviated`});case`GGGGG`:return n.era(r,{width:`narrow`});default:return n.era(r,{width:`wide`})}},y:function(e,t,n){if(t===`yo`){let t=e.getFullYear(),r=t>0?t:1-t;return n.ordinalNumber(r,{unit:`year`})}return W.y(e,t)},Y:function(e,t,n,r){let i=B(e,r),a=i>0?i:1-i;return t===`YY`?U(a%100,2):t===`Yo`?n.ordinalNumber(a,{unit:`year`}):U(a,t.length)},R:function(e,t){return U(C(e),t.length)},u:function(e,t){return U(e.getFullYear(),t.length)},Q:function(e,t,n){let r=Math.ceil((e.getMonth()+1)/3);switch(t){case`Q`:return String(r);case`QQ`:return U(r,2);case`Qo`:return n.ordinalNumber(r,{unit:`quarter`});case`QQQ`:return n.quarter(r,{width:`abbreviated`,context:`formatting`});case`QQQQQ`:return n.quarter(r,{width:`narrow`,context:`formatting`});default:return n.quarter(r,{width:`wide`,context:`formatting`})}},q:function(e,t,n){let r=Math.ceil((e.getMonth()+1)/3);switch(t){case`q`:return String(r);case`qq`:return U(r,2);case`qo`:return n.ordinalNumber(r,{unit:`quarter`});case`qqq`:return n.quarter(r,{width:`abbreviated`,context:`standalone`});case`qqqqq`:return n.quarter(r,{width:`narrow`,context:`standalone`});default:return n.quarter(r,{width:`wide`,context:`standalone`})}},M:function(e,t,n){let r=e.getMonth();switch(t){case`M`:case`MM`:return W.M(e,t);case`Mo`:return n.ordinalNumber(r+1,{unit:`month`});case`MMM`:return n.month(r,{width:`abbreviated`,context:`formatting`});case`MMMMM`:return n.month(r,{width:`narrow`,context:`formatting`});default:return n.month(r,{width:`wide`,context:`formatting`})}},L:function(e,t,n){let r=e.getMonth();switch(t){case`L`:return String(r+1);case`LL`:return U(r+1,2);case`Lo`:return n.ordinalNumber(r+1,{unit:`month`});case`LLL`:return n.month(r,{width:`abbreviated`,context:`standalone`});case`LLLLL`:return n.month(r,{width:`narrow`,context:`standalone`});default:return n.month(r,{width:`wide`,context:`standalone`})}},w:function(e,t,n,r){let i=H(e,r);return t===`wo`?n.ordinalNumber(i,{unit:`week`}):U(i,t.length)},I:function(e,t,n){let r=ue(e);return t===`Io`?n.ordinalNumber(r,{unit:`week`}):U(r,t.length)},d:function(e,t,n){return t===`do`?n.ordinalNumber(e.getDate(),{unit:`date`}):W.d(e,t)},D:function(e,t,n){let r=le(e);return t===`Do`?n.ordinalNumber(r,{unit:`dayOfYear`}):U(r,t.length)},E:function(e,t,n){let r=e.getDay();switch(t){case`E`:case`EE`:case`EEE`:return n.day(r,{width:`abbreviated`,context:`formatting`});case`EEEEE`:return n.day(r,{width:`narrow`,context:`formatting`});case`EEEEEE`:return n.day(r,{width:`short`,context:`formatting`});default:return n.day(r,{width:`wide`,context:`formatting`})}},e:function(e,t,n,r){let i=e.getDay(),a=(i-r.weekStartsOn+8)%7||7;switch(t){case`e`:return String(a);case`ee`:return U(a,2);case`eo`:return n.ordinalNumber(a,{unit:`day`});case`eee`:return n.day(i,{width:`abbreviated`,context:`formatting`});case`eeeee`:return n.day(i,{width:`narrow`,context:`formatting`});case`eeeeee`:return n.day(i,{width:`short`,context:`formatting`});default:return n.day(i,{width:`wide`,context:`formatting`})}},c:function(e,t,n,r){let i=e.getDay(),a=(i-r.weekStartsOn+8)%7||7;switch(t){case`c`:return String(a);case`cc`:return U(a,t.length);case`co`:return n.ordinalNumber(a,{unit:`day`});case`ccc`:return n.day(i,{width:`abbreviated`,context:`standalone`});case`ccccc`:return n.day(i,{width:`narrow`,context:`standalone`});case`cccccc`:return n.day(i,{width:`short`,context:`standalone`});default:return n.day(i,{width:`wide`,context:`standalone`})}},i:function(e,t,n){let r=e.getDay(),i=r===0?7:r;switch(t){case`i`:return String(i);case`ii`:return U(i,t.length);case`io`:return n.ordinalNumber(i,{unit:`day`});case`iii`:return n.day(r,{width:`abbreviated`,context:`formatting`});case`iiiii`:return n.day(r,{width:`narrow`,context:`formatting`});case`iiiiii`:return n.day(r,{width:`short`,context:`formatting`});default:return n.day(r,{width:`wide`,context:`formatting`})}},a:function(e,t,n){let r=e.getHours()/12>=1?`pm`:`am`;switch(t){case`a`:case`aa`:return n.dayPeriod(r,{width:`abbreviated`,context:`formatting`});case`aaa`:return n.dayPeriod(r,{width:`abbreviated`,context:`formatting`}).toLowerCase();case`aaaaa`:return n.dayPeriod(r,{width:`narrow`,context:`formatting`});default:return n.dayPeriod(r,{width:`wide`,context:`formatting`})}},b:function(e,t,n){let r=e.getHours(),i;switch(i=r===12?G.noon:r===0?G.midnight:r/12>=1?`pm`:`am`,t){case`b`:case`bb`:return n.dayPeriod(i,{width:`abbreviated`,context:`formatting`});case`bbb`:return n.dayPeriod(i,{width:`abbreviated`,context:`formatting`}).toLowerCase();case`bbbbb`:return n.dayPeriod(i,{width:`narrow`,context:`formatting`});default:return n.dayPeriod(i,{width:`wide`,context:`formatting`})}},B:function(e,t,n){let r=e.getHours(),i;switch(i=r>=17?G.evening:r>=12?G.afternoon:r>=4?G.morning:G.night,t){case`B`:case`BB`:case`BBB`:return n.dayPeriod(i,{width:`abbreviated`,context:`formatting`});case`BBBBB`:return n.dayPeriod(i,{width:`narrow`,context:`formatting`});default:return n.dayPeriod(i,{width:`wide`,context:`formatting`})}},h:function(e,t,n){if(t===`ho`){let t=e.getHours()%12;return t===0&&(t=12),n.ordinalNumber(t,{unit:`hour`})}return W.h(e,t)},H:function(e,t,n){return t===`Ho`?n.ordinalNumber(e.getHours(),{unit:`hour`}):W.H(e,t)},K:function(e,t,n){let r=e.getHours()%12;return t===`Ko`?n.ordinalNumber(r,{unit:`hour`}):U(r,t.length)},k:function(e,t,n){let r=e.getHours();return r===0&&(r=24),t===`ko`?n.ordinalNumber(r,{unit:`hour`}):U(r,t.length)},m:function(e,t,n){return t===`mo`?n.ordinalNumber(e.getMinutes(),{unit:`minute`}):W.m(e,t)},s:function(e,t,n){return t===`so`?n.ordinalNumber(e.getSeconds(),{unit:`second`}):W.s(e,t)},S:function(e,t){return W.S(e,t)},X:function(e,t,n){let r=e.getTimezoneOffset();if(r===0)return`Z`;switch(t){case`X`:return J(r);case`XXXX`:case`XX`:return Y(r);default:return Y(r,`:`)}},x:function(e,t,n){let r=e.getTimezoneOffset();switch(t){case`x`:return J(r);case`xxxx`:case`xx`:return Y(r);default:return Y(r,`:`)}},O:function(e,t,n){let r=e.getTimezoneOffset();switch(t){case`O`:case`OO`:case`OOO`:return`GMT`+q(r,`:`);default:return`GMT`+Y(r,`:`)}},z:function(e,t,n){let r=e.getTimezoneOffset();switch(t){case`z`:case`zz`:case`zzz`:return`GMT`+q(r,`:`);default:return`GMT`+Y(r,`:`)}},t:function(e,t,n){return U(Math.trunc(e/1e3),t.length)},T:function(e,t,n){return U(+e,t.length)}};function q(e,t=``){let n=e>0?`-`:`+`,r=Math.abs(e),i=Math.trunc(r/60),a=r%60;return a===0?n+String(i):n+String(i)+t+U(a,2)}function J(e,t){return e%60==0?(e>0?`-`:`+`)+U(Math.abs(e)/60,2):Y(e,t)}function Y(e,t=``){let n=e>0?`-`:`+`,r=Math.abs(e),i=U(Math.trunc(r/60),2),a=U(r%60,2);return n+i+t+a}const X=(e,t)=>{switch(e){case`P`:return t.date({width:`short`});case`PP`:return t.date({width:`medium`});case`PPP`:return t.date({width:`long`});default:return t.date({width:`full`})}},Z=(e,t)=>{switch(e){case`p`:return t.time({width:`short`});case`pp`:return t.time({width:`medium`});case`ppp`:return t.time({width:`long`});default:return t.time({width:`full`})}},de={p:Z,P:(e,t)=>{let n=e.match(/(P+)(p+)?/)||[],r=n[1],i=n[2];if(!i)return X(e,t);let a;switch(r){case`P`:a=t.dateTime({width:`short`});break;case`PP`:a=t.dateTime({width:`medium`});break;case`PPP`:a=t.dateTime({width:`long`});break;default:a=t.dateTime({width:`full`})}return a.replace(`{{date}}`,X(r,t)).replace(`{{time}}`,Z(i,t))}},fe=/^D+$/,pe=/^Y+$/,me=[`D`,`DD`,`YY`,`YYYY`];function he(e){return fe.test(e)}function ge(e){return pe.test(e)}function _e(e,t,n){let r=ve(e,t,n);if(console.warn(r),me.includes(e))throw RangeError(r)}function ve(e,t,n){let r=e[0]===`Y`?`years`:`days of the month`;return`Use \`${e.toLowerCase()}\` instead of \`${e}\` (in \`${t}\`) for formatting ${r} to the input \`${n}\`; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md`}const ye=/[yYQqMLwIdDecihHKkms]o|(\w)\1*|''|'(''|[^'])+('|$)|./g,Q=/P+p+|P+|p+|''|'(''|[^'])+('|$)|./g,be=/^'([^]*?)'?$/,xe=/''/g,Se=/[a-zA-Z]/;function $(e,t,n){let r=b(),i=n?.locale??r.locale??ce,a=n?.firstWeekContainsDate??n?.locale?.options?.firstWeekContainsDate??r.firstWeekContainsDate??r.locale?.options?.firstWeekContainsDate??1,o=n?.weekStartsOn??n?.locale?.options?.weekStartsOn??r.weekStartsOn??r.locale?.options?.weekStartsOn??0,s=v(e,n?.in);if(!A(s))throw RangeError(`Invalid time value`);let c=t.match(Q).map(e=>{let t=e[0];if(t===`p`||t===`P`){let n=de[t];return n(e,i.formatLong)}return e}).join(``).match(ye).map(e=>{if(e===`''`)return{isToken:!1,value:`'`};let t=e[0];if(t===`'`)return{isToken:!1,value:Ce(e)};if(K[t])return{isToken:!0,value:e};if(t.match(Se))throw RangeError("Format string contains an unescaped latin alphabet character `"+t+"`");return{isToken:!1,value:e}});i.localize.preprocessor&&(c=i.localize.preprocessor(s,c));let l={firstWeekContainsDate:a,weekStartsOn:o,locale:i};return c.map(r=>{if(!r.isToken)return r.value;let a=r.value;(!n?.useAdditionalWeekYearTokens&&ge(a)||!n?.useAdditionalDayOfYearTokens&&he(a))&&_e(a,t,String(e));let o=K[a[0]];return o(s,a,i.localize,l)}).join(``)}function Ce(e){let t=e.match(be);return t?t[1].replace(xe,`'`):e}var we=`:host{--sbb-pearl-chain-time-height:auto;display:block}@media (width>=37.5rem){:host{--sbb-pearl-chain-time-height:1.5625rem}}@media (width>=64rem){:host{--sbb-pearl-chain-time-height:1.75rem}}.sbb-pearl-chain__time{height:var(--sbb-pearl-chain-time-height);flex-wrap:wrap;justify-content:space-between;align-items:center;display:flex}.sbb-pearl-chain__time-walktime,.sbb-pearl-chain__time-transfer{--sbb-text-font-size:var(--sbb-text-font-size-xxs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-letter-spacing-text);font-size:var(--sbb-text-font-size);align-items:center;display:inline-flex}.sbb-pearl-chain__time-walktime--walk-small-left{margin-inline-end:calc(var(--sbb-spacing-fixed-2x) - .4375rem);transform:translate(-.4375rem)}.sbb-pearl-chain__time-walktime--walk-small-right{margin-inline-start:calc(var(--sbb-spacing-fixed-2x) - .25rem)}.sbb-pearl-chain__time-walktime--wheelchair-small-left{margin-inline-end:calc(var(--sbb-spacing-fixed-2x) - .4375rem);transform:translate(-.375rem)}.sbb-pearl-chain__time-walktime--wheelchair-small-right{margin-inline-start:calc(var(--sbb-spacing-fixed-2x) - .25rem)}.sbb-pearl-chain__time-walktime-prime-symbol{float:right}.sbb-pearl-chain__time-transfer{gap:var(--sbb-spacing-fixed-1x)}.sbb-pearl-chain__time-transfer--sa-ci-departure{margin-inline-end:var(--sbb-spacing-fixed-2x)}.sbb-pearl-chain__time-transfer--sa-ci-arrival{margin-inline-start:calc(var(--sbb-spacing-fixed-2x) - .25rem)}.sbb-pearl-chain__time-chain{margin-inline:var(--sbb-spacing-fixed-3x);flex:auto;align-self:center}.sbb-pearl-chain__time-time{--sbb-text-font-size:var(--sbb-text-font-size-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-letter-spacing-text);font-size:var(--sbb-text-font-size);color:var(--sbb-color-2);font-weight:700}
+import{__esDecorate as e,__runInitializers as t}from"tslib";import{SbbElement as n,SbbLanguageController as r,defaultDateAdapter as i,forceType as a,i18nArrival as o,i18nDeparture as s,i18nTransferProcedures as c,screenReaderOnlyStyles as l}from"@sbb-esta/lyne-elements/core.js";import{SbbIconElement as u}from"@sbb-esta/lyne-elements/icon.pure.js";import{html as d,nothing as f,unsafeCSS as ee}from"lit";import{property as p}from"lit/decorators.js";import{getDepartureArrivalTimeAttribute as te,isRideLeg as ne,removeTimezoneFromISOTimeString as m}from"./core.js";import{SbbPearlChainLegacyElement as re}from"./pearl-chain-legacy.pure.js";const h=6048e5,g=Symbol.for(`constructDateFrom`);function _(e,t){return typeof e==`function`?e(t):e&&typeof e==`object`&&g in e?e[g](t):e instanceof Date?new e.constructor(t):new Date(t)}function v(e,t){return _(t||e,e)}let y={};function b(){return y}function x(e,t){let n=b(),r=t?.weekStartsOn??t?.locale?.options?.weekStartsOn??n.weekStartsOn??n.locale?.options?.weekStartsOn??0,i=v(e,t?.in),a=i.getDay(),o=(a<r?7:0)+a-r;return i.setDate(i.getDate()-o),i.setHours(0,0,0,0),i}function S(e,t){return x(e,{...t,weekStartsOn:1})}function C(e,t){let n=v(e,t?.in),r=n.getFullYear(),i=_(n,0);i.setFullYear(r+1,0,4),i.setHours(0,0,0,0);let a=S(i),o=_(n,0);o.setFullYear(r,0,4),o.setHours(0,0,0,0);let s=S(o);return n.getTime()>=a.getTime()?r+1:n.getTime()>=s.getTime()?r:r-1}function w(e){let t=v(e),n=new Date(Date.UTC(t.getFullYear(),t.getMonth(),t.getDate(),t.getHours(),t.getMinutes(),t.getSeconds(),t.getMilliseconds()));return n.setUTCFullYear(t.getFullYear()),+e-n}function T(e,...t){let n=_.bind(null,e||t.find(e=>typeof e==`object`));return t.map(n)}function E(e,t){let n=v(e,t?.in);return n.setHours(0,0,0,0),n}function D(e,t,n){let[r,i]=T(n?.in,e,t),a=E(r),o=E(i),s=+a-w(a),c=+o-w(o);return Math.round((s-c)/864e5)}function O(e,t){let n=C(e,t),r=_(t?.in||e,0);return r.setFullYear(n,0,4),r.setHours(0,0,0,0),S(r)}function k(e){return e instanceof Date||typeof e==`object`&&Object.prototype.toString.call(e)===`[object Date]`}function A(e){return!(!k(e)&&typeof e!=`number`||isNaN(+v(e)))}function j(e,t){let n=v(e,t?.in);return n.setFullYear(n.getFullYear(),0,1),n.setHours(0,0,0,0),n}const M={lessThanXSeconds:{one:`less than a second`,other:`less than {{count}} seconds`},xSeconds:{one:`1 second`,other:`{{count}} seconds`},halfAMinute:`half a minute`,lessThanXMinutes:{one:`less than a minute`,other:`less than {{count}} minutes`},xMinutes:{one:`1 minute`,other:`{{count}} minutes`},aboutXHours:{one:`about 1 hour`,other:`about {{count}} hours`},xHours:{one:`1 hour`,other:`{{count}} hours`},xDays:{one:`1 day`,other:`{{count}} days`},aboutXWeeks:{one:`about 1 week`,other:`about {{count}} weeks`},xWeeks:{one:`1 week`,other:`{{count}} weeks`},aboutXMonths:{one:`about 1 month`,other:`about {{count}} months`},xMonths:{one:`1 month`,other:`{{count}} months`},aboutXYears:{one:`about 1 year`,other:`about {{count}} years`},xYears:{one:`1 year`,other:`{{count}} years`},overXYears:{one:`over 1 year`,other:`over {{count}} years`},almostXYears:{one:`almost 1 year`,other:`almost {{count}} years`}},N=(e,t,n)=>{let r,i=M[e];return r=typeof i==`string`?i:t===1?i.one:i.other.replace(`{{count}}`,t.toString()),n?.addSuffix?n.comparison&&n.comparison>0?`in `+r:r+` ago`:r};function P(e){return(t={})=>{let n=t.width?String(t.width):e.defaultWidth;return e.formats[n]||e.formats[e.defaultWidth]}}const F={date:P({formats:{full:`EEEE, MMMM do, y`,long:`MMMM do, y`,medium:`MMM d, y`,short:`MM/dd/yyyy`},defaultWidth:`full`}),time:P({formats:{full:`h:mm:ss a zzzz`,long:`h:mm:ss a z`,medium:`h:mm:ss a`,short:`h:mm a`},defaultWidth:`full`}),dateTime:P({formats:{full:`{{date}} 'at' {{time}}`,long:`{{date}} 'at' {{time}}`,medium:`{{date}}, {{time}}`,short:`{{date}}, {{time}}`},defaultWidth:`full`})},I={lastWeek:`'last' eeee 'at' p`,yesterday:`'yesterday at' p`,today:`'today at' p`,tomorrow:`'tomorrow at' p`,nextWeek:`eeee 'at' p`,other:`P`},L=(e,t,n,r)=>I[e];function R(e){return(t,n)=>{let r=n?.context?String(n.context):`standalone`,i;if(r===`formatting`&&e.formattingValues){let t=e.defaultFormattingWidth||e.defaultWidth,r=n?.width?String(n.width):t;i=e.formattingValues[r]||e.formattingValues[t]}else{let t=e.defaultWidth,r=n?.width?String(n.width):e.defaultWidth;i=e.values[r]||e.values[t]}let a=e.argumentCallback?e.argumentCallback(t):t;return i[a]}}const ie={ordinalNumber:(e,t)=>{let n=Number(e),r=n%100;if(r>20||r<10)switch(r%10){case 1:return n+`st`;case 2:return n+`nd`;case 3:return n+`rd`}return n+`th`},era:R({values:{narrow:[`B`,`A`],abbreviated:[`BC`,`AD`],wide:[`Before Christ`,`Anno Domini`]},defaultWidth:`wide`}),quarter:R({values:{narrow:[`1`,`2`,`3`,`4`],abbreviated:[`Q1`,`Q2`,`Q3`,`Q4`],wide:[`1st quarter`,`2nd quarter`,`3rd quarter`,`4th quarter`]},defaultWidth:`wide`,argumentCallback:e=>e-1}),month:R({values:{narrow:[`J`,`F`,`M`,`A`,`M`,`J`,`J`,`A`,`S`,`O`,`N`,`D`],abbreviated:[`Jan`,`Feb`,`Mar`,`Apr`,`May`,`Jun`,`Jul`,`Aug`,`Sep`,`Oct`,`Nov`,`Dec`],wide:[`January`,`February`,`March`,`April`,`May`,`June`,`July`,`August`,`September`,`October`,`November`,`December`]},defaultWidth:`wide`}),day:R({values:{narrow:[`S`,`M`,`T`,`W`,`T`,`F`,`S`],short:[`Su`,`Mo`,`Tu`,`We`,`Th`,`Fr`,`Sa`],abbreviated:[`Sun`,`Mon`,`Tue`,`Wed`,`Thu`,`Fri`,`Sat`],wide:[`Sunday`,`Monday`,`Tuesday`,`Wednesday`,`Thursday`,`Friday`,`Saturday`]},defaultWidth:`wide`}),dayPeriod:R({values:{narrow:{am:`a`,pm:`p`,midnight:`mi`,noon:`n`,morning:`morning`,afternoon:`afternoon`,evening:`evening`,night:`night`},abbreviated:{am:`AM`,pm:`PM`,midnight:`midnight`,noon:`noon`,morning:`morning`,afternoon:`afternoon`,evening:`evening`,night:`night`},wide:{am:`a.m.`,pm:`p.m.`,midnight:`midnight`,noon:`noon`,morning:`morning`,afternoon:`afternoon`,evening:`evening`,night:`night`}},defaultWidth:`wide`,formattingValues:{narrow:{am:`a`,pm:`p`,midnight:`mi`,noon:`n`,morning:`in the morning`,afternoon:`in the afternoon`,evening:`in the evening`,night:`at night`},abbreviated:{am:`AM`,pm:`PM`,midnight:`midnight`,noon:`noon`,morning:`in the morning`,afternoon:`in the afternoon`,evening:`in the evening`,night:`at night`},wide:{am:`a.m.`,pm:`p.m.`,midnight:`midnight`,noon:`noon`,morning:`in the morning`,afternoon:`in the afternoon`,evening:`in the evening`,night:`at night`}},defaultFormattingWidth:`wide`})};function z(e){return(t,n={})=>{let r=n.width,i=r&&e.matchPatterns[r]||e.matchPatterns[e.defaultMatchWidth],a=t.match(i);if(!a)return null;let o=a[0],s=r&&e.parsePatterns[r]||e.parsePatterns[e.defaultParseWidth],c=Array.isArray(s)?oe(s,e=>e.test(o)):ae(s,e=>e.test(o)),l;l=e.valueCallback?e.valueCallback(c):c,l=n.valueCallback?n.valueCallback(l):l;let u=t.slice(o.length);return{value:l,rest:u}}}function ae(e,t){for(let n in e)if(Object.prototype.hasOwnProperty.call(e,n)&&t(e[n]))return n}function oe(e,t){for(let n=0;n<e.length;n++)if(t(e[n]))return n}function se(e){return(t,n={})=>{let r=t.match(e.matchPattern);if(!r)return null;let i=r[0],a=t.match(e.parsePattern);if(!a)return null;let o=e.valueCallback?e.valueCallback(a[0]):a[0];o=n.valueCallback?n.valueCallback(o):o;let s=t.slice(i.length);return{value:o,rest:s}}}const ce={code:`en-US`,formatDistance:N,formatLong:F,formatRelative:L,localize:ie,match:{ordinalNumber:se({matchPattern:/^(\d+)(th|st|nd|rd)?/i,parsePattern:/\d+/i,valueCallback:e=>parseInt(e,10)}),era:z({matchPatterns:{narrow:/^(b|a)/i,abbreviated:/^(b\.?\s?c\.?|b\.?\s?c\.?\s?e\.?|a\.?\s?d\.?|c\.?\s?e\.?)/i,wide:/^(before christ|before common era|anno domini|common era)/i},defaultMatchWidth:`wide`,parsePatterns:{any:[/^b/i,/^(a|c)/i]},defaultParseWidth:`any`}),quarter:z({matchPatterns:{narrow:/^[1234]/i,abbreviated:/^q[1234]/i,wide:/^[1234](th|st|nd|rd)? quarter/i},defaultMatchWidth:`wide`,parsePatterns:{any:[/1/i,/2/i,/3/i,/4/i]},defaultParseWidth:`any`,valueCallback:e=>e+1}),month:z({matchPatterns:{narrow:/^[jfmasond]/i,abbreviated:/^(jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec)/i,wide:/^(january|february|march|april|may|june|july|august|september|october|november|december)/i},defaultMatchWidth:`wide`,parsePatterns:{narrow:[/^j/i,/^f/i,/^m/i,/^a/i,/^m/i,/^j/i,/^j/i,/^a/i,/^s/i,/^o/i,/^n/i,/^d/i],any:[/^ja/i,/^f/i,/^mar/i,/^ap/i,/^may/i,/^jun/i,/^jul/i,/^au/i,/^s/i,/^o/i,/^n/i,/^d/i]},defaultParseWidth:`any`}),day:z({matchPatterns:{narrow:/^[smtwf]/i,short:/^(su|mo|tu|we|th|fr|sa)/i,abbreviated:/^(sun|mon|tue|wed|thu|fri|sat)/i,wide:/^(sunday|monday|tuesday|wednesday|thursday|friday|saturday)/i},defaultMatchWidth:`wide`,parsePatterns:{narrow:[/^s/i,/^m/i,/^t/i,/^w/i,/^t/i,/^f/i,/^s/i],any:[/^su/i,/^m/i,/^tu/i,/^w/i,/^th/i,/^f/i,/^sa/i]},defaultParseWidth:`any`}),dayPeriod:z({matchPatterns:{narrow:/^(a|p|mi|n|(in the|at) (morning|afternoon|evening|night))/i,any:/^([ap]\.?\s?m\.?|midnight|noon|(in the|at) (morning|afternoon|evening|night))/i},defaultMatchWidth:`any`,parsePatterns:{any:{am:/^a/i,pm:/^p/i,midnight:/^mi/i,noon:/^no/i,morning:/morning/i,afternoon:/afternoon/i,evening:/evening/i,night:/night/i}},defaultParseWidth:`any`})},options:{weekStartsOn:0,firstWeekContainsDate:1}};function le(e,t){let n=v(e,t?.in);return D(n,j(n))+1}function ue(e,t){let n=v(e,t?.in),r=+S(n)-O(n);return Math.round(r/h)+1}function B(e,t){let n=v(e,t?.in),r=n.getFullYear(),i=b(),a=t?.firstWeekContainsDate??t?.locale?.options?.firstWeekContainsDate??i.firstWeekContainsDate??i.locale?.options?.firstWeekContainsDate??1,o=_(t?.in||e,0);o.setFullYear(r+1,0,a),o.setHours(0,0,0,0);let s=x(o,t),c=_(t?.in||e,0);c.setFullYear(r,0,a),c.setHours(0,0,0,0);let l=x(c,t);return+n>=+s?r+1:+n>=+l?r:r-1}function V(e,t){let n=b(),r=t?.firstWeekContainsDate??t?.locale?.options?.firstWeekContainsDate??n.firstWeekContainsDate??n.locale?.options?.firstWeekContainsDate??1,i=B(e,t),a=_(t?.in||e,0);return a.setFullYear(i,0,r),a.setHours(0,0,0,0),x(a,t)}function H(e,t){let n=v(e,t?.in),r=+x(n,t)-V(n,t);return Math.round(r/h)+1}function U(e,t){return(e<0?`-`:``)+Math.abs(e).toString().padStart(t,`0`)}const W={y(e,t){let n=e.getFullYear(),r=n>0?n:1-n;return U(t===`yy`?r%100:r,t.length)},M(e,t){let n=e.getMonth();return t===`M`?String(n+1):U(n+1,2)},d(e,t){return U(e.getDate(),t.length)},a(e,t){let n=e.getHours()/12>=1?`pm`:`am`;switch(t){case`a`:case`aa`:return n.toUpperCase();case`aaa`:return n;case`aaaaa`:return n[0];default:return n===`am`?`a.m.`:`p.m.`}},h(e,t){return U(e.getHours()%12||12,t.length)},H(e,t){return U(e.getHours(),t.length)},m(e,t){return U(e.getMinutes(),t.length)},s(e,t){return U(e.getSeconds(),t.length)},S(e,t){let n=t.length,r=e.getMilliseconds();return U(Math.trunc(r*10**(n-3)),t.length)}},G={am:`am`,pm:`pm`,midnight:`midnight`,noon:`noon`,morning:`morning`,afternoon:`afternoon`,evening:`evening`,night:`night`},K={G:function(e,t,n){let r=+(e.getFullYear()>0);switch(t){case`G`:case`GG`:case`GGG`:return n.era(r,{width:`abbreviated`});case`GGGGG`:return n.era(r,{width:`narrow`});default:return n.era(r,{width:`wide`})}},y:function(e,t,n){if(t===`yo`){let t=e.getFullYear(),r=t>0?t:1-t;return n.ordinalNumber(r,{unit:`year`})}return W.y(e,t)},Y:function(e,t,n,r){let i=B(e,r),a=i>0?i:1-i;return t===`YY`?U(a%100,2):t===`Yo`?n.ordinalNumber(a,{unit:`year`}):U(a,t.length)},R:function(e,t){return U(C(e),t.length)},u:function(e,t){return U(e.getFullYear(),t.length)},Q:function(e,t,n){let r=Math.ceil((e.getMonth()+1)/3);switch(t){case`Q`:return String(r);case`QQ`:return U(r,2);case`Qo`:return n.ordinalNumber(r,{unit:`quarter`});case`QQQ`:return n.quarter(r,{width:`abbreviated`,context:`formatting`});case`QQQQQ`:return n.quarter(r,{width:`narrow`,context:`formatting`});default:return n.quarter(r,{width:`wide`,context:`formatting`})}},q:function(e,t,n){let r=Math.ceil((e.getMonth()+1)/3);switch(t){case`q`:return String(r);case`qq`:return U(r,2);case`qo`:return n.ordinalNumber(r,{unit:`quarter`});case`qqq`:return n.quarter(r,{width:`abbreviated`,context:`standalone`});case`qqqqq`:return n.quarter(r,{width:`narrow`,context:`standalone`});default:return n.quarter(r,{width:`wide`,context:`standalone`})}},M:function(e,t,n){let r=e.getMonth();switch(t){case`M`:case`MM`:return W.M(e,t);case`Mo`:return n.ordinalNumber(r+1,{unit:`month`});case`MMM`:return n.month(r,{width:`abbreviated`,context:`formatting`});case`MMMMM`:return n.month(r,{width:`narrow`,context:`formatting`});default:return n.month(r,{width:`wide`,context:`formatting`})}},L:function(e,t,n){let r=e.getMonth();switch(t){case`L`:return String(r+1);case`LL`:return U(r+1,2);case`Lo`:return n.ordinalNumber(r+1,{unit:`month`});case`LLL`:return n.month(r,{width:`abbreviated`,context:`standalone`});case`LLLLL`:return n.month(r,{width:`narrow`,context:`standalone`});default:return n.month(r,{width:`wide`,context:`standalone`})}},w:function(e,t,n,r){let i=H(e,r);return t===`wo`?n.ordinalNumber(i,{unit:`week`}):U(i,t.length)},I:function(e,t,n){let r=ue(e);return t===`Io`?n.ordinalNumber(r,{unit:`week`}):U(r,t.length)},d:function(e,t,n){return t===`do`?n.ordinalNumber(e.getDate(),{unit:`date`}):W.d(e,t)},D:function(e,t,n){let r=le(e);return t===`Do`?n.ordinalNumber(r,{unit:`dayOfYear`}):U(r,t.length)},E:function(e,t,n){let r=e.getDay();switch(t){case`E`:case`EE`:case`EEE`:return n.day(r,{width:`abbreviated`,context:`formatting`});case`EEEEE`:return n.day(r,{width:`narrow`,context:`formatting`});case`EEEEEE`:return n.day(r,{width:`short`,context:`formatting`});default:return n.day(r,{width:`wide`,context:`formatting`})}},e:function(e,t,n,r){let i=e.getDay(),a=(i-r.weekStartsOn+8)%7||7;switch(t){case`e`:return String(a);case`ee`:return U(a,2);case`eo`:return n.ordinalNumber(a,{unit:`day`});case`eee`:return n.day(i,{width:`abbreviated`,context:`formatting`});case`eeeee`:return n.day(i,{width:`narrow`,context:`formatting`});case`eeeeee`:return n.day(i,{width:`short`,context:`formatting`});default:return n.day(i,{width:`wide`,context:`formatting`})}},c:function(e,t,n,r){let i=e.getDay(),a=(i-r.weekStartsOn+8)%7||7;switch(t){case`c`:return String(a);case`cc`:return U(a,t.length);case`co`:return n.ordinalNumber(a,{unit:`day`});case`ccc`:return n.day(i,{width:`abbreviated`,context:`standalone`});case`ccccc`:return n.day(i,{width:`narrow`,context:`standalone`});case`cccccc`:return n.day(i,{width:`short`,context:`standalone`});default:return n.day(i,{width:`wide`,context:`standalone`})}},i:function(e,t,n){let r=e.getDay(),i=r===0?7:r;switch(t){case`i`:return String(i);case`ii`:return U(i,t.length);case`io`:return n.ordinalNumber(i,{unit:`day`});case`iii`:return n.day(r,{width:`abbreviated`,context:`formatting`});case`iiiii`:return n.day(r,{width:`narrow`,context:`formatting`});case`iiiiii`:return n.day(r,{width:`short`,context:`formatting`});default:return n.day(r,{width:`wide`,context:`formatting`})}},a:function(e,t,n){let r=e.getHours()/12>=1?`pm`:`am`;switch(t){case`a`:case`aa`:return n.dayPeriod(r,{width:`abbreviated`,context:`formatting`});case`aaa`:return n.dayPeriod(r,{width:`abbreviated`,context:`formatting`}).toLowerCase();case`aaaaa`:return n.dayPeriod(r,{width:`narrow`,context:`formatting`});default:return n.dayPeriod(r,{width:`wide`,context:`formatting`})}},b:function(e,t,n){let r=e.getHours(),i;switch(i=r===12?G.noon:r===0?G.midnight:r/12>=1?`pm`:`am`,t){case`b`:case`bb`:return n.dayPeriod(i,{width:`abbreviated`,context:`formatting`});case`bbb`:return n.dayPeriod(i,{width:`abbreviated`,context:`formatting`}).toLowerCase();case`bbbbb`:return n.dayPeriod(i,{width:`narrow`,context:`formatting`});default:return n.dayPeriod(i,{width:`wide`,context:`formatting`})}},B:function(e,t,n){let r=e.getHours(),i;switch(i=r>=17?G.evening:r>=12?G.afternoon:r>=4?G.morning:G.night,t){case`B`:case`BB`:case`BBB`:return n.dayPeriod(i,{width:`abbreviated`,context:`formatting`});case`BBBBB`:return n.dayPeriod(i,{width:`narrow`,context:`formatting`});default:return n.dayPeriod(i,{width:`wide`,context:`formatting`})}},h:function(e,t,n){if(t===`ho`){let t=e.getHours()%12;return t===0&&(t=12),n.ordinalNumber(t,{unit:`hour`})}return W.h(e,t)},H:function(e,t,n){return t===`Ho`?n.ordinalNumber(e.getHours(),{unit:`hour`}):W.H(e,t)},K:function(e,t,n){let r=e.getHours()%12;return t===`Ko`?n.ordinalNumber(r,{unit:`hour`}):U(r,t.length)},k:function(e,t,n){let r=e.getHours();return r===0&&(r=24),t===`ko`?n.ordinalNumber(r,{unit:`hour`}):U(r,t.length)},m:function(e,t,n){return t===`mo`?n.ordinalNumber(e.getMinutes(),{unit:`minute`}):W.m(e,t)},s:function(e,t,n){return t===`so`?n.ordinalNumber(e.getSeconds(),{unit:`second`}):W.s(e,t)},S:function(e,t){return W.S(e,t)},X:function(e,t,n){let r=e.getTimezoneOffset();if(r===0)return`Z`;switch(t){case`X`:return J(r);case`XXXX`:case`XX`:return Y(r);default:return Y(r,`:`)}},x:function(e,t,n){let r=e.getTimezoneOffset();switch(t){case`x`:return J(r);case`xxxx`:case`xx`:return Y(r);default:return Y(r,`:`)}},O:function(e,t,n){let r=e.getTimezoneOffset();switch(t){case`O`:case`OO`:case`OOO`:return`GMT`+q(r,`:`);default:return`GMT`+Y(r,`:`)}},z:function(e,t,n){let r=e.getTimezoneOffset();switch(t){case`z`:case`zz`:case`zzz`:return`GMT`+q(r,`:`);default:return`GMT`+Y(r,`:`)}},t:function(e,t,n){return U(Math.trunc(e/1e3),t.length)},T:function(e,t,n){return U(+e,t.length)}};function q(e,t=``){let n=e>0?`-`:`+`,r=Math.abs(e),i=Math.trunc(r/60),a=r%60;return a===0?n+String(i):n+String(i)+t+U(a,2)}function J(e,t){return e%60==0?(e>0?`-`:`+`)+U(Math.abs(e)/60,2):Y(e,t)}function Y(e,t=``){let n=e>0?`-`:`+`,r=Math.abs(e),i=U(Math.trunc(r/60),2),a=U(r%60,2);return n+i+t+a}const X=(e,t)=>{switch(e){case`P`:return t.date({width:`short`});case`PP`:return t.date({width:`medium`});case`PPP`:return t.date({width:`long`});default:return t.date({width:`full`})}},Z=(e,t)=>{switch(e){case`p`:return t.time({width:`short`});case`pp`:return t.time({width:`medium`});case`ppp`:return t.time({width:`long`});default:return t.time({width:`full`})}},de={p:Z,P:(e,t)=>{let n=e.match(/(P+)(p+)?/)||[],r=n[1],i=n[2];if(!i)return X(e,t);let a;switch(r){case`P`:a=t.dateTime({width:`short`});break;case`PP`:a=t.dateTime({width:`medium`});break;case`PPP`:a=t.dateTime({width:`long`});break;default:a=t.dateTime({width:`full`})}return a.replace(`{{date}}`,X(r,t)).replace(`{{time}}`,Z(i,t))}},fe=/^D+$/,pe=/^Y+$/,me=[`D`,`DD`,`YY`,`YYYY`];function he(e){return fe.test(e)}function ge(e){return pe.test(e)}function _e(e,t,n){let r=ve(e,t,n);if(console.warn(r),me.includes(e))throw RangeError(r)}function ve(e,t,n){let r=e[0]===`Y`?`years`:`days of the month`;return`Use \`${e.toLowerCase()}\` instead of \`${e}\` (in \`${t}\`) for formatting ${r} to the input \`${n}\`; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md`}const ye=/[yYQqMLwIdDecihHKkms]o|(\w)\1*|''|'(''|[^'])+('|$)|./g,Q=/P+p+|P+|p+|''|'(''|[^'])+('|$)|./g,be=/^'([^]*?)'?$/,xe=/''/g,Se=/[a-zA-Z]/;function $(e,t,n){let r=b(),i=n?.locale??r.locale??ce,a=n?.firstWeekContainsDate??n?.locale?.options?.firstWeekContainsDate??r.firstWeekContainsDate??r.locale?.options?.firstWeekContainsDate??1,o=n?.weekStartsOn??n?.locale?.options?.weekStartsOn??r.weekStartsOn??r.locale?.options?.weekStartsOn??0,s=v(e,n?.in);if(!A(s))throw RangeError(`Invalid time value`);let c=t.match(Q).map(e=>{let t=e[0];if(t===`p`||t===`P`){let n=de[t];return n(e,i.formatLong)}return e}).join(``).match(ye).map(e=>{if(e===`''`)return{isToken:!1,value:`'`};let t=e[0];if(t===`'`)return{isToken:!1,value:Ce(e)};if(K[t])return{isToken:!0,value:e};if(t.match(Se))throw RangeError("Format string contains an unescaped latin alphabet character `"+t+"`");return{isToken:!1,value:e}});i.localize.preprocessor&&(c=i.localize.preprocessor(s,c));let l={firstWeekContainsDate:a,weekStartsOn:o,locale:i};return c.map(r=>{if(!r.isToken)return r.value;let a=r.value;(!n?.useAdditionalWeekYearTokens&&ge(a)||!n?.useAdditionalDayOfYearTokens&&he(a))&&_e(a,t,String(e));let o=K[a[0]];return o(s,a,i.localize,l)}).join(``)}function Ce(e){let t=e.match(be);return t?t[1].replace(xe,`'`):e}var we=`:host{--sbb-pearl-chain-time-height:auto;display:block}@media (width>=37.5rem){:host{--sbb-pearl-chain-time-height:1.5625rem}}@media (width>=64rem){:host{--sbb-pearl-chain-time-height:1.75rem}}.sbb-pearl-chain__time{height:var(--sbb-pearl-chain-time-height);flex-wrap:wrap;justify-content:space-between;align-items:center;display:flex}.sbb-pearl-chain__time-walktime,.sbb-pearl-chain__time-transfer{--sbb-text-font-size:var(--sbb-text-font-size-xxs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-letter-spacing-text);font-size:var(--sbb-text-font-size);align-items:center;display:inline-flex}.sbb-pearl-chain__time-walktime--walk-small-left{margin-inline-end:calc(var(--sbb-spacing-fixed-2x) - .4375rem);transform:translate(-.4375rem)}.sbb-pearl-chain__time-walktime--walk-small-right{margin-inline-start:calc(var(--sbb-spacing-fixed-2x) - .25rem)}.sbb-pearl-chain__time-walktime--wheelchair-small-left{margin-inline-end:calc(var(--sbb-spacing-fixed-2x) - .4375rem);transform:translate(-.375rem)}.sbb-pearl-chain__time-walktime--wheelchair-small-right{margin-inline-start:calc(var(--sbb-spacing-fixed-2x) - .25rem)}.sbb-pearl-chain__time-walktime-prime-symbol{float:right}.sbb-pearl-chain__time-transfer{gap:var(--sbb-spacing-fixed-1x)}.sbb-pearl-chain__time-transfer--sa-ci-departure{margin-inline-end:var(--sbb-spacing-fixed-2x)}.sbb-pearl-chain__time-transfer--sa-ci-arrival{margin-inline-start:calc(var(--sbb-spacing-fixed-2x) - .25rem)}.sbb-pearl-chain__time-chain{margin-inline:var(--sbb-spacing-fixed-3x);flex:auto;align-self:center}.sbb-pearl-chain__time-time{--sbb-text-font-size:var(--sbb-text-font-size-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-letter-spacing-text);font-size:var(--sbb-text-font-size);color:var(--sbb-color-2);font-weight:700}
 `;let Te=(()=>{let h=n,g=[],_,v=[],y=[],b,x=[],S=[],C,w=[],T=[],E,D=[],O=[],k,A=[],j=[],M,N=[],P=[],F,I=[],L=[],R;return class extends h{constructor(){super(...arguments),this.#e=(t(this,g),t(this,v,[])),this.#t=(t(this,y),t(this,x,``)),this.#n=(t(this,S),t(this,w,``)),this.#r=(t(this,T),t(this,D,NaN)),this.#i=(t(this,O),t(this,A,NaN)),this.#a=(t(this,j),t(this,N,!1)),this.#o=(t(this,P),t(this,I,!1)),this._now=(t(this,L),null),this._language=new r(this)}static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(h[Symbol.metadata]??null):void 0;_=[p({type:Array})],b=[a(),p({attribute:`departure-time`})],C=[a(),p({attribute:`arrival-time`})],E=[a(),p({attribute:`departure-walk`,type:Number})],k=[a(),p({attribute:`arrival-walk`,type:Number})],M=[a(),p({attribute:`disable-animation`,type:Boolean})],F=[a(),p({attribute:`a11y-footpath`,type:Boolean})],R=[p()],e(this,null,_,{kind:`accessor`,name:`legs`,static:!1,private:!1,access:{has:e=>`legs`in e,get:e=>e.legs,set:(e,t)=>{e.legs=t}},metadata:t},v,y),e(this,null,b,{kind:`accessor`,name:`departureTime`,static:!1,private:!1,access:{has:e=>`departureTime`in e,get:e=>e.departureTime,set:(e,t)=>{e.departureTime=t}},metadata:t},x,S),e(this,null,C,{kind:`accessor`,name:`arrivalTime`,static:!1,private:!1,access:{has:e=>`arrivalTime`in e,get:e=>e.arrivalTime,set:(e,t)=>{e.arrivalTime=t}},metadata:t},w,T),e(this,null,E,{kind:`accessor`,name:`departureWalk`,static:!1,private:!1,access:{has:e=>`departureWalk`in e,get:e=>e.departureWalk,set:(e,t)=>{e.departureWalk=t}},metadata:t},D,O),e(this,null,k,{kind:`accessor`,name:`arrivalWalk`,static:!1,private:!1,access:{has:e=>`arrivalWalk`in e,get:e=>e.arrivalWalk,set:(e,t)=>{e.arrivalWalk=t}},metadata:t},A,j),e(this,null,M,{kind:`accessor`,name:`disableAnimation`,static:!1,private:!1,access:{has:e=>`disableAnimation`in e,get:e=>e.disableAnimation,set:(e,t)=>{e.disableAnimation=t}},metadata:t},N,P),e(this,null,F,{kind:`accessor`,name:`a11yFootpath`,static:!1,private:!1,access:{has:e=>`a11yFootpath`in e,get:e=>e.a11yFootpath,set:(e,t)=>{e.a11yFootpath=t}},metadata:t},I,L),e(this,null,R,{kind:`setter`,name:`now`,static:!1,private:!1,access:{has:e=>`now`in e,set:(e,t)=>{e.now=t}},metadata:t},null,g),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-pearl-chain-time`}static{this.elementDependencies=[u,re]}static{this.styles=[l,ee(we)]}#e;get legs(){return this.#e}set legs(e){this.#e=e}#t;get departureTime(){return this.#t}set departureTime(e){this.#t=e}#n;get arrivalTime(){return this.#n}set arrivalTime(e){this.#n=e}#r;get departureWalk(){return this.#r}set departureWalk(e){this.#r=e}#i;get arrivalWalk(){return this.#i}set arrivalWalk(e){this.#i=e}#a;get disableAnimation(){return this.#a}set disableAnimation(e){this.#a=e}#o;get a11yFootpath(){return this.#o}set a11yFootpath(e){this.#o=e}set now(e){this._now=i.getValidDateOrNull(i.deserialize(e))}get now(){return this._now??/* @__PURE__ */ new Date}render(){let e=this.departureTime?m(this.departureTime):void 0,t=this.arrivalTime?m(this.arrivalTime):void 0,{renderDepartureTimeAttribute:n,renderArrivalTimeAttribute:r}=te(this.legs,this.departureWalk||0,this.arrivalWalk||0,this._language.current,this.a11yFootpath),i=this.legs?.filter(e=>ne(e));return d`
       <div class="sbb-pearl-chain__time">
         ${n()}
@@ -11,12 +11,12 @@ import{__esDecorate as e,__runInitializers as t}from"tslib";import{SbbElement as
         ${i?.length>1?d`<span class="sbb-screen-reader-only" role="paragraph">
                 ${i?.length-1} ${c[this._language.current]}
               </span>`:f}
-        <sbb-pearl-chain
+        <sbb-pearl-chain-legacy
           class="sbb-pearl-chain__time-chain"
           .legs=${this.legs}
           .disableAnimation=${this.disableAnimation}
           .now=${this.now}
-        ></sbb-pearl-chain>
+        ></sbb-pearl-chain-legacy>
         ${t?d`<time class="sbb-pearl-chain__time-time" datetime=${this.arrivalTime}>
                 <span class="sbb-screen-reader-only"
                   >${o[this._language.current]}:&nbsp;</span

package/development/pearl-chain.d.ts DELETED Viewed

	@@ -1 +0,0 @@
1	- export * from './pearl-chain.pure.ts';

package/development/pearl-chain.js DELETED Viewed

@@ -1,9 +0,0 @@
-import { SbbPearlChainElement } from "./pearl-chain.pure.js";
-export * from "./pearl-chain.pure.js"
-//#region src/elements-experimental/pearl-chain.ts
-/** @entrypoint */
-SbbPearlChainElement.define();
-//#endregion

package/development/pearl-chain.pure.d.ts DELETED Viewed

	@@ -1,2 +0,0 @@
1	- /** @entrypoint */
2	- export * from './pearl-chain/pearl-chain.component.ts';

package/pearl-chain.js DELETED Viewed

	@@ -1 +0,0 @@
1	- import{SbbPearlChainElement as e}from"./pearl-chain.pure.js";export*from"./pearl-chain.pure.js";e.define();