@sbb-esta/lyne-elements 0.0.0 → 0.52.0

package/development/train/train-formation.js

@@ -0,0 +1,294 @@
+import { css, LitElement, html } from "lit";
+import { property, state, customElement } from "lit/decorators.js";
+import { ref } from "lit/directives/ref.js";
+import { SbbConnectedAbortController, SbbLanguageController } from "../core/controllers.js";
+import { i18nSectorShort, i18nSector, i18nTrains } from "../core/i18n.js";
+import { SbbNamedSlotListMixin } from "../core/mixins.js";
+import { AgnosticResizeObserver } from "../core/observers.js";
+const style = css`/**
+ * Better font rendering (on OS X)
+ * http://maximilianhoffmann.com/posts/better-font-rendering-on-osx
+ *
+ * Usage:
+ *
+ * .var_dark_on_light {
+ * 	@include font-smoothing;
+ * }
+ * .var_light_on_dark {
+ * 	@include font-smoothing-reset;
+ * }
+ */
+/** This mixin can be used to avoid spacing problems by inserting an invisible space as pseudo element. */
+*,
+::before,
+::after {
+  box-sizing: border-box;
+}
+
+:host {
+  --sbb-train-formation-inline-padding: var(--sbb-spacing-fixed-4x);
+  --sbb-train-formation-background-color: var(--sbb-color-white);
+  --sbb-train-formation-sector-label-color: var(--sbb-color-metal);
+  --sbb-train-formation-sector-line-color: var(--sbb-color-smoke);
+  --sbb-train-formation-blocked-passage-width: 1rem;
+  display: block;
+}
+@media (forced-colors: active) {
+  :host {
+    --sbb-train-formation-sector-line-color: CanvasText;
+  }
+}
+
+:host([hide-wagon-label]) {
+  --sbb-train-formation-wagon-label-display: none;
+}
+
+.sbb-train-formation {
+  --sbb-scrollbar-thumb-width: 0.125rem;
+  --sbb-scrollbar-thumb-width-hover: 0.25rem;
+  --sbb-scrollbar-width-firefox: thin;
+  --sbb-scrollbar-color: var(--sbb-color-black-alpha-30);
+  --sbb-scrollbar-color-hover: var(--sbb-color-black-alpha-60);
+  --sbb-scrollbar-track-color: transparent;
+  --sbb-scrollbar-width: var(--sbb-spacing-fixed-3x);
+  /* Scrollbar itself */
+  /* Hide button (top and bottom of the scrollbar) */
+  display: grid;
+  grid-template: "start sectors end" auto "start trains end" auto/auto 1fr auto;
+  position: relative;
+  overflow-x: auto;
+  background-color: var(--sbb-train-formation-background-color);
+}
+.sbb-train-formation::-webkit-scrollbar {
+  width: var(--sbb-scrollbar-width);
+  height: var(--sbb-scrollbar-width);
+  background-color: var(--sbb-scrollbar-track-color, transparent);
+}
+.sbb-train-formation::-webkit-scrollbar-corner {
+  background-color: var(--sbb-scrollbar-track-color, transparent);
+}
+.sbb-train-formation::-webkit-scrollbar-thumb {
+  background-color: var(--sbb-scrollbar-color, currentcolor);
+  border: calc(0.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;
+  border-radius: var(--sbb-border-radius-4x);
+  background-clip: padding-box;
+}
+.sbb-train-formation::-webkit-scrollbar-thumb:hover {
+  background-color: var(--sbb-scrollbar-color-hover, currentcolor);
+  border-width: calc(0.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)));
+}
+.sbb-train-formation::-webkit-scrollbar-button, .sbb-train-formation::-webkit-scrollbar-corner {
+  display: none;
+}
+@supports not selector(::-webkit-scrollbar) {
+  .sbb-train-formation {
+    scrollbar-width: var(--sbb-scrollbar-width-firefox);
+    scrollbar-color: var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent);
+  }
+}
+.sbb-train-formation::before, .sbb-train-formation::after {
+  content: "";
+  display: block;
+  width: var(--sbb-train-formation-inline-padding);
+  background-color: var(--sbb-train-formation-background-color);
+}
+.sbb-train-formation::before {
+  grid-area: start;
+}
+.sbb-train-formation::after {
+  grid-area: end;
+}
+
+.sbb-train-formation__sectors {
+  display: flex;
+  grid-area: sectors;
+  gap: var(--sbb-train-formation-wagon-gap);
+}
+
+.sbb-train-formation__sector {
+  --_wagon-sum: var(--sbb-train-formation-wagon-count) * var(--sbb-train-formation-wagon-width);
+  --_blocked-passage-sum: var(--sbb-train-formation-wagon-blocked-passage-count) *
+    var(--sbb-train-formation-blocked-passage-width);
+  --_total-count: calc(
+    var(--sbb-train-formation-wagon-count) + var(--sbb-train-formation-wagon-blocked-passage-count)
+  );
+  --_gap-sum: calc((var(--_total-count) - 1) * var(--sbb-train-formation-wagon-gap));
+  --_sector-width: calc(var(--_wagon-sum) + var(--_blocked-passage-sum) + var(--_gap-sum));
+  --sbb-text-font-size: var(--sbb-font-size-text-s);
+  font-family: var(--sbb-typo-font-family);
+  font-weight: normal;
+  line-height: var(--sbb-typo-line-height-body-text);
+  letter-spacing: var(--sbb-typo-letter-spacing-body-text);
+  font-size: var(--sbb-text-font-size);
+  flex: 0 0 var(--_sector-width);
+  color: var(--sbb-train-formation-sector-label-color);
+  text-align: center;
+  position: relative;
+  display: inline-block;
+  margin-block-end: var(--sbb-spacing-fixed-4x);
+  max-width: var(--_sector-width);
+}
+.sbb-train-formation__sector::before {
+  content: "";
+  position: absolute;
+  inset: 50% 0;
+  height: 1px;
+  background-color: var(--sbb-train-formation-sector-line-color);
+}
+
+.sbb-train-formation__sector-sticky-wrapper {
+  background-color: var(--sbb-train-formation-background-color);
+  position: sticky;
+  inset: auto 0;
+  padding: 0 var(--sbb-spacing-fixed-1x);
+  margin: 0 var(--sbb-spacing-fixed-2x);
+  overflow: hidden;
+  white-space: nowrap;
+}
+
+.sbb-train-formation__trains {
+  grid-area: trains;
+}
+
+.sbb-train-formation__train-list {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  font-size: inherit;
+  display: flex;
+  gap: var(--sbb-train-formation-wagon-gap);
+}
+
+.sbb-train-formation__train-list > :is(li, span) {
+  display: inline-flex;
+}`;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result)
+    __defProp(target, key, result);
+  return result;
+};
+let SbbTrainFormationElement = class extends SbbNamedSlotListMixin(LitElement) {
+  constructor() {
+    super(...arguments);
+    this.listChildLocalNames = ["sbb-train"];
+    this.hideWagonLabel = false;
+    this._sectors = [];
+    this._contentResizeObserver = new AgnosticResizeObserver(() => this._applyCssWidth());
+    this._abort = new SbbConnectedAbortController(this);
+    this._language = new SbbLanguageController(this);
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    const signal = this._abort.signal;
+    this.addEventListener("trainSlotChange", (e) => this._readSectors(e), { signal });
+    this.addEventListener("sectorChange", (e) => this._readSectors(e), { signal });
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this._contentResizeObserver.disconnect();
+  }
+  /**
+   * Apply width of the scrollable space of the formation as a css variable. This will be used from
+   * every slotted sbb-train for the direction-label
+   */
+  _applyCssWidth() {
+    const contentWidth = this._formationDiv.getBoundingClientRect().width;
+    this._formationDiv.style.setProperty("--sbb-train-direction-width", `${contentWidth}px`);
+  }
+  _readSectors(event) {
+    var _a;
+    event == null ? void 0 : event.stopPropagation();
+    this._sectors = Array.from(
+      ((_a = this.querySelectorAll) == null ? void 0 : _a.call(
+        this,
+        "sbb-train-wagon,sbb-train-blocked-passage"
+      )) ?? []
+    ).reduce(
+      (aggregatedSectors, item) => {
+        const currentAggregatedSector = aggregatedSectors[aggregatedSectors.length - 1];
+        if (item.localName === "sbb-train-wagon") {
+          const sectorAttribute = item.sector ?? item.getAttribute("sector");
+          if (!currentAggregatedSector.label && sectorAttribute) {
+            currentAggregatedSector.label = sectorAttribute;
+          }
+          if (!sectorAttribute || currentAggregatedSector.label === sectorAttribute) {
+            currentAggregatedSector.wagonCount++;
+          } else {
+            aggregatedSectors.push({
+              label: sectorAttribute,
+              wagonCount: 1,
+              blockedPassageCount: 0
+            });
+          }
+        } else if (item.localName === "sbb-train-blocked-passage") {
+          currentAggregatedSector.blockedPassageCount++;
+        }
+        return aggregatedSectors;
+      },
+      [{ wagonCount: 0, blockedPassageCount: 0 }]
+    );
+  }
+  async _updateFormationDiv(el) {
+    if (!el) {
+      return;
+    }
+    this._contentResizeObserver.disconnect();
+    this._formationDiv = el;
+    this._contentResizeObserver.observe(this._formationDiv);
+    await this.updateComplete;
+    this._applyCssWidth();
+  }
+  willUpdate(changedProperties) {
+    super.willUpdate(changedProperties);
+    if (changedProperties.has("listChildren")) {
+      this._readSectors();
+    }
+  }
+  render() {
+    return html`
+      <div class="sbb-train-formation" ${ref(this._updateFormationDiv)}>
+        <div class="sbb-train-formation__sectors" aria-hidden="true">
+          ${this._sectors.map(
+      (aggregatedSector) => html`<span
+                class="sbb-train-formation__sector"
+                style="
+                --sbb-train-formation-wagon-count: ${aggregatedSector.wagonCount};
+                --sbb-train-formation-wagon-blocked-passage-count: ${aggregatedSector.blockedPassageCount}"
+              >
+                <span class="sbb-train-formation__sector-sticky-wrapper">
+                  ${`${aggregatedSector.wagonCount === 1 && aggregatedSector.label ? i18nSectorShort[this._language.current] : i18nSector[this._language.current]} ${aggregatedSector.label ? aggregatedSector.label : ""}`}
+                </span>
+              </span>`
+    )}
+        </div>
+
+        <div class="sbb-train-formation__trains">
+          ${this.renderList({
+      class: "sbb-train-formation__train-list",
+      ariaLabel: i18nTrains[this._language.current]
+    })}
+        </div>
+      </div>
+    `;
+  }
+};
+SbbTrainFormationElement.styles = style;
+__decorateClass([
+  property({ attribute: "hide-wagon-label", reflect: true, type: Boolean })
+], SbbTrainFormationElement.prototype, "hideWagonLabel", 2);
+__decorateClass([
+  state()
+], SbbTrainFormationElement.prototype, "_sectors", 2);
+SbbTrainFormationElement = __decorateClass([
+  customElement("sbb-train-formation")
+], SbbTrainFormationElement);
+export {
+  SbbTrainFormationElement
+};
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHJhaW4tZm9ybWF0aW9uLmpzIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvZWxlbWVudHMvdHJhaW4vdHJhaW4tZm9ybWF0aW9uL3RyYWluLWZvcm1hdGlvbi50cyJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICB0eXBlIENTU1Jlc3VsdEdyb3VwLFxuICBodG1sLFxuICBMaXRFbGVtZW50LFxuICB0eXBlIFByb3BlcnR5VmFsdWVzLFxuICB0eXBlIFRlbXBsYXRlUmVzdWx0LFxufSBmcm9tICdsaXQnO1xuaW1wb3J0IHsgY3VzdG9tRWxlbWVudCwgcHJvcGVydHksIHN0YXRlIH0gZnJvbSAnbGl0L2RlY29yYXRvcnMuanMnO1xuaW1wb3J0IHsgcmVmIH0gZnJvbSAnbGl0L2RpcmVjdGl2ZXMvcmVmLmpzJztcblxuaW1wb3J0IHsgU2JiQ29ubmVjdGVkQWJvcnRDb250cm9sbGVyLCBTYmJMYW5ndWFnZUNvbnRyb2xsZXIgfSBmcm9tICcuLi8uLi9jb3JlL2NvbnRyb2xsZXJzLmpzJztcbmltcG9ydCB7IGkxOG5TZWN0b3IsIGkxOG5TZWN0b3JTaG9ydCwgaTE4blRyYWlucyB9IGZyb20gJy4uLy4uL2NvcmUvaTE4bi5qcyc7XG5pbXBvcnQgeyBTYmJOYW1lZFNsb3RMaXN0TWl4aW4sIHR5cGUgV2l0aExpc3RDaGlsZHJlbiB9IGZyb20gJy4uLy4uL2NvcmUvbWl4aW5zLmpzJztcbmltcG9ydCB7IEFnbm9zdGljUmVzaXplT2JzZXJ2ZXIgfSBmcm9tICcuLi8uLi9jb3JlL29ic2VydmVycy5qcyc7XG5pbXBvcnQgdHlwZSB7IFNiYlRyYWluQmxvY2tlZFBhc3NhZ2VFbGVtZW50IH0gZnJvbSAnLi4vdHJhaW4tYmxvY2tlZC1wYXNzYWdlLmpzJztcbmltcG9ydCB0eXBlIHsgU2JiVHJhaW5XYWdvbkVsZW1lbnQgfSBmcm9tICcuLi90cmFpbi13YWdvbi5qcyc7XG5pbXBvcnQgdHlwZSB7IFNiYlRyYWluRWxlbWVudCB9IGZyb20gJy4uL3RyYWluLmpzJztcblxuaW1wb3J0IHN0eWxlIGZyb20gJy4vdHJhaW4tZm9ybWF0aW9uLnNjc3M/bGl0JmlubGluZSc7XG5cbmludGVyZmFjZSBBZ2dyZWdhdGVkU2VjdG9yIHtcbiAgbGFiZWw6IHN0cmluZztcbiAgd2Fnb25Db3VudDogbnVtYmVyO1xuICBibG9ja2VkUGFzc2FnZUNvdW50OiBudW1iZXI7XG59XG5cbi8qKlxuICogSXQgZGlzcGxheXMgYSB0cmFpbiBjb21wb3NpdGlvbiwgYWN0aW5nIGFzIGEgY29udGFpbmVyIGZvciBvbmUgb3IgbW9yZSBgc2JiLXRyYWluYCBjb21wb25lbnQuXG4gKlxuICogQHNsb3QgLSBVc2UgdGhlIHVubmFtZWQgc2xvdCB0byBhZGQgJ3NiYi10cmFpbicgZWxlbWVudHMgdG8gdGhlIGBzYmItdHJhaW4tZm9ybWF0aW9uYC5cbiAqL1xuQGN1c3RvbUVsZW1lbnQoJ3NiYi10cmFpbi1mb3JtYXRpb24nKVxuZXhwb3J0IGNsYXNzIFNiYlRyYWluRm9ybWF0aW9uRWxlbWVudCBleHRlbmRzIFNiYk5hbWVkU2xvdExpc3RNaXhpbjxcbiAgU2JiVHJhaW5FbGVtZW50LFxuICB0eXBlb2YgTGl0RWxlbWVudFxuPihMaXRFbGVtZW50KSB7XG4gIHB1YmxpYyBzdGF0aWMgb3ZlcnJpZGUgc3R5bGVzOiBDU1NSZXN1bHRHcm91cCA9IHN0eWxlO1xuICBwcm90ZWN0ZWQgb3ZlcnJpZGUgcmVhZG9ubHkgbGlzdENoaWxkTG9jYWxOYW1lcyA9IFsnc2JiLXRyYWluJ107XG5cbiAgLyoqIE9wdGlvbiB0byBoaWRlIGFsbCB3YWdvbiBsYWJlbHMuICovXG4gIEBwcm9wZXJ0eSh7IGF0dHJpYnV0ZTogJ2hpZGUtd2Fnb24tbGFiZWwnLCByZWZsZWN0OiB0cnVlLCB0eXBlOiBCb29sZWFuIH0pIHB1YmxpYyBoaWRlV2Fnb25MYWJlbCA9XG4gICAgZmFsc2U7XG5cbiAgQHN0YXRlKCkgcHJpdmF0ZSBfc2VjdG9yczogQWdncmVnYXRlZFNlY3RvcltdID0gW107XG5cbiAgLyoqIEVsZW1lbnQgdGhhdCBkZWZpbmVzIHRoZSB2aXNpYmxlIGNvbnRlbnQgd2lkdGguICovXG4gIHByaXZhdGUgX2Zvcm1hdGlvbkRpdiE6IEhUTUxEaXZFbGVtZW50O1xuICBwcml2YXRlIF9jb250ZW50UmVzaXplT2JzZXJ2ZXIgPSBuZXcgQWdub3N0aWNSZXNpemVPYnNlcnZlcigoKSA9PiB0aGlzLl9hcHBseUNzc1dpZHRoKCkpO1xuICBwcml2YXRlIF9hYm9ydCA9IG5ldyBTYmJDb25uZWN0ZWRBYm9ydENvbnRyb2xsZXIodGhpcyk7XG4gIHByaXZhdGUgX2xhbmd1YWdlID0gbmV3IFNiYkxhbmd1YWdlQ29udHJvbGxlcih0aGlzKTtcblxuICBwdWJsaWMgb3ZlcnJpZGUgY29ubmVjdGVkQ2FsbGJhY2soKTogdm9pZCB7XG4gICAgc3VwZXIuY29ubmVjdGVkQ2FsbGJhY2soKTtcbiAgICBjb25zdCBzaWduYWwgPSB0aGlzLl9hYm9ydC5zaWduYWw7XG4gICAgdGhpcy5hZGRFdmVudExpc3RlbmVyKCd0cmFpblNsb3RDaGFuZ2UnLCAoZSkgPT4gdGhpcy5fcmVhZFNlY3RvcnMoZSksIHsgc2lnbmFsIH0pO1xuICAgIHRoaXMuYWRkRXZlbnRMaXN0ZW5lcignc2VjdG9yQ2hhbmdlJywgKGUpID0+IHRoaXMuX3JlYWRTZWN0b3JzKGUpLCB7IHNpZ25hbCB9KTtcbiAgfVxuXG4gIHB1YmxpYyBvdmVycmlkZSBkaXNjb25uZWN0ZWRDYWxsYmFjaygpOiB2b2lkIHtcbiAgICBzdXBlci5kaXNjb25uZWN0ZWRDYWxsYmFjaygpO1xuICAgIHRoaXMuX2NvbnRlbnRSZXNpemVPYnNlcnZlci5kaXNjb25uZWN0KCk7XG4gIH1cblxuICAvKipcbiAgICogQXBwbHkgd2lkdGggb2YgdGhlIHNjcm9sbGFibGUgc3BhY2Ugb2YgdGhlIGZvcm1hdGlvbiBhcyBhIGNzcyB2YXJpYWJsZS4gVGhpcyB3aWxsIGJlIHVzZWQgZnJvbVxuICAgKiBldmVyeSBzbG90dGVkIHNiYi10cmFpbiBmb3IgdGhlIGRpcmVjdGlvbi1sYWJlbFxuICAgKi9cbiAgcHJpdmF0ZSBfYXBwbHlDc3NXaWR0aCgpOiB2b2lkIHtcbiAgICBjb25zdCBjb250ZW50V2lkdGggPSB0aGlzLl9mb3JtYXRpb25EaXYuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCkud2lkdGg7XG4gICAgdGhpcy5fZm9ybWF0aW9uRGl2LnN0eWxlLnNldFByb3BlcnR5KCctLXNiYi10cmFpbi1kaXJlY3Rpb24td2lkdGgnLCBgJHtjb250ZW50V2lkdGh9cHhgKTtcbiAgfVxuXG4gIHByaXZhdGUgX3JlYWRTZWN0b3JzKGV2ZW50PzogRXZlbnQpOiB2b2lkIHtcbiAgICAvLyBLZWVwIHRoZSBldmVudCBpbnRlcm5hbC5cbiAgICBldmVudD8uc3RvcFByb3BhZ2F0aW9uKCk7XG5cbiAgICB0aGlzLl9zZWN0b3JzID0gQXJyYXkuZnJvbShcbiAgICAgIHRoaXMucXVlcnlTZWxlY3RvckFsbD8uPFNiYlRyYWluV2Fnb25FbGVtZW50IHwgU2JiVHJhaW5CbG9ja2VkUGFzc2FnZUVsZW1lbnQ+KFxuICAgICAgICAnc2JiLXRyYWluLXdhZ29uLHNiYi10cmFpbi1ibG9ja2VkLXBhc3NhZ2UnLFxuICAgICAgKSA/PyBbXSxcbiAgICApLnJlZHVjZShcbiAgICAgIChcbiAgICAgICAgYWdncmVnYXRlZFNlY3RvcnM6IEFnZ3JlZ2F0ZWRTZWN0b3JbXSxcbiAgICAgICAgaXRlbTogU2JiVHJhaW5XYWdvbkVsZW1lbnQgfCBTYmJUcmFpbkJsb2NrZWRQYXNzYWdlRWxlbWVudCxcbiAgICAgICkgPT4ge1xuICAgICAgICBjb25zdCBjdXJyZW50QWdncmVnYXRlZFNlY3RvciA9IGFnZ3JlZ2F0ZWRTZWN0b3JzW2FnZ3JlZ2F0ZWRTZWN0b3JzLmxlbmd0aCAtIDFdO1xuXG4gICAgICAgIGlmIChpdGVtLmxvY2FsTmFtZSA9PT0gJ3NiYi10cmFpbi13YWdvbicpIHtcbiAgICAgICAgICBjb25zdCBzZWN0b3JBdHRyaWJ1dGUgPVxuICAgICAgICAgICAgKGl0ZW0gYXMgU2JiVHJhaW5XYWdvbkVsZW1lbnQpLnNlY3RvciA/PyBpdGVtLmdldEF0dHJpYnV0ZSgnc2VjdG9yJyk7XG5cbiAgICAgICAgICBpZiAoIWN1cnJlbnRBZ2dyZWdhdGVkU2VjdG9yLmxhYmVsICYmIHNlY3RvckF0dHJpYnV0ZSkge1xuICAgICAgICAgICAgY3VycmVudEFnZ3JlZ2F0ZWRTZWN0b3IubGFiZWwgPSBzZWN0b3JBdHRyaWJ1dGU7XG4gICAgICAgICAgfVxuXG4gICAgICAgICAgaWYgKCFzZWN0b3JBdHRyaWJ1dGUgfHwgY3VycmVudEFnZ3JlZ2F0ZWRTZWN0b3IubGFiZWwgPT09IHNlY3RvckF0dHJpYnV0ZSkge1xuICAgICAgICAgICAgY3VycmVudEFnZ3JlZ2F0ZWRTZWN0b3Iud2Fnb25Db3VudCsrO1xuICAgICAgICAgIH0gZWxzZSB7XG4gICAgICAgICAgICBhZ2dyZWdhdGVkU2VjdG9ycy5wdXNoKHtcbiAgICAgICAgICAgICAgbGFiZWw6IHNlY3RvckF0dHJpYnV0ZSxcbiAgICAgICAgICAgICAgd2Fnb25Db3VudDogMSxcbiAgICAgICAgICAgICAgYmxvY2tlZFBhc3NhZ2VDb3VudDogMCxcbiAgICAgICAgICAgIH0pO1xuICAgICAgICAgIH1cbiAgICAgICAgfSBlbHNlIGlmIChpdGVtLmxvY2FsTmFtZSA9PT0gJ3NiYi10cmFpbi1ibG9ja2VkLXBhc3NhZ2UnKSB7XG4gICAgICAgICAgY3VycmVudEFnZ3JlZ2F0ZWRTZWN0b3IuYmxvY2tlZFBhc3NhZ2VDb3VudCsrO1xuICAgICAgICB9XG5cbiAgICAgICAgcmV0dXJuIGFnZ3JlZ2F0ZWRTZWN0b3JzO1xuICAgICAgfSxcbiAgICAgIFt7IHdhZ29uQ291bnQ6IDAsIGJsb2NrZWRQYXNzYWdlQ291bnQ6IDAgfSBhcyBBZ2dyZWdhdGVkU2VjdG9yXSxcbiAgICApO1xuICB9XG5cbiAgcHJpdmF0ZSBhc3luYyBfdXBkYXRlRm9ybWF0aW9uRGl2KGVsOiBFbGVtZW50IHwgdW5kZWZpbmVkKTogUHJvbWlzZTx2b2lkPiB7XG4gICAgaWYgKCFlbCkge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICB0aGlzLl9jb250ZW50UmVzaXplT2JzZXJ2ZXIuZGlzY29ubmVjdCgpO1xuICAgIHRoaXMuX2Zvcm1hdGlvbkRpdiA9IGVsIGFzIEhUTUxEaXZFbGVtZW50O1xuICAgIHRoaXMuX2NvbnRlbnRSZXNpemVPYnNlcnZlci5vYnNlcnZlKHRoaXMuX2Zvcm1hdGlvbkRpdik7XG4gICAgLy8gVGhlcmUgc2VlbXMgdG8gYmUgYSBzbGlnaHQgZGlmZmVyZW5jZSBiZXR3ZWVuIGJyb3dzZXIsIGluIGhvdyB0aGVcbiAgICAvLyBvYnNlcnZlciBpcyBjYWxsZWQuIEluIG9yZGVyIHRvIGJlIGNvbnNpc3RlbnQgYWNyb3NzIGJyb3dzZXJzXG4gICAgLy8gd2Ugc2V0IHRoZSB3aWR0aCBtYW51YWxseSBvbmNlIHRoZSBjb21wb25lbnQgdXBkYXRlIGlzIGNvbXBsZXRlLlxuICAgIGF3YWl0IHRoaXMudXBkYXRlQ29tcGxldGU7XG4gICAgdGhpcy5fYXBwbHlDc3NXaWR0aCgpO1xuICB9XG5cbiAgcHJvdGVjdGVkIG92ZXJyaWRlIHdpbGxVcGRhdGUoY2hhbmdlZFByb3BlcnRpZXM6IFByb3BlcnR5VmFsdWVzPFdpdGhMaXN0Q2hpbGRyZW48dGhpcz4+KTogdm9pZCB7XG4gICAgc3VwZXIud2lsbFVwZGF0ZShjaGFuZ2VkUHJvcGVydGllcyk7XG5cbiAgICBpZiAoY2hhbmdlZFByb3BlcnRpZXMuaGFzKCdsaXN0Q2hpbGRyZW4nKSkge1xuICAgICAgdGhpcy5fcmVhZFNlY3RvcnMoKTtcbiAgICB9XG4gIH1cblxuICBwcm90ZWN0ZWQgb3ZlcnJpZGUgcmVuZGVyKCk6IFRlbXBsYXRlUmVzdWx0IHtcbiAgICByZXR1cm4gaHRtbGBcbiAgICAgIDxkaXYgY2xhc3M9XCJzYmItdHJhaW4tZm9ybWF0aW9uXCIgJHtyZWYodGhpcy5fdXBkYXRlRm9ybWF0aW9uRGl2KX0+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJzYmItdHJhaW4tZm9ybWF0aW9uX19zZWN0b3JzXCIgYXJpYS1oaWRkZW49XCJ0cnVlXCI+XG4gICAgICAgICAgJHt0aGlzLl9zZWN0b3JzLm1hcChcbiAgICAgICAgICAgIChhZ2dyZWdhdGVkU2VjdG9yKSA9PlxuICAgICAgICAgICAgICBodG1sYDxzcGFuXG4gICAgICAgICAgICAgICAgY2xhc3M9XCJzYmItdHJhaW4tZm9ybWF0aW9uX19zZWN0b3JcIlxuICAgICAgICAgICAgICAgIHN0eWxlPVwiXG4gICAgICAgICAgICAgICAgLS1zYmItdHJhaW4tZm9ybWF0aW9uLXdhZ29uLWNvdW50OiAke2FnZ3JlZ2F0ZWRTZWN0b3Iud2Fnb25Db3VudH07XG4gICAgICAgICAgICAgICAgLS1zYmItdHJhaW4tZm9ybWF0aW9uLXdhZ29uLWJsb2NrZWQtcGFzc2FnZS1jb3VudDogJHthZ2dyZWdhdGVkU2VjdG9yLmJsb2NrZWRQYXNzYWdlQ291bnR9XCJcbiAgICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgIDxzcGFuIGNsYXNzPVwic2JiLXRyYWluLWZvcm1hdGlvbl9fc2VjdG9yLXN0aWNreS13cmFwcGVyXCI+XG4gICAgICAgICAgICAgICAgICAke2Ake1xuICAgICAgICAgICAgICAgICAgICBhZ2dyZWdhdGVkU2VjdG9yLndhZ29uQ291bnQgPT09IDEgJiYgYWdncmVnYXRlZFNlY3Rvci5sYWJlbFxuICAgICAgICAgICAgICAgICAgICAgID8gaTE4blNlY3RvclNob3J0W3RoaXMuX2xhbmd1YWdlLmN1cnJlbnRdXG4gICAgICAgICAgICAgICAgICAgICAgOiBpMThuU2VjdG9yW3RoaXMuX2xhbmd1YWdlLmN1cnJlbnRdXG4gICAgICAgICAgICAgICAgICB9ICR7YWdncmVnYXRlZFNlY3Rvci5sYWJlbCA/IGFnZ3JlZ2F0ZWRTZWN0b3IubGFiZWwgOiAnJ31gfVxuICAgICAgICAgICAgICAgIDwvc3Bhbj5cbiAgICAgICAgICAgICAgPC9zcGFuPmAsXG4gICAgICAgICAgKX1cbiAgICAgICAgPC9kaXY+XG5cbiAgICAgICAgPGRpdiBjbGFzcz1cInNiYi10cmFpbi1mb3JtYXRpb25fX3RyYWluc1wiPlxuICAgICAgICAgICR7dGhpcy5yZW5kZXJMaXN0KHtcbiAgICAgICAgICAgIGNsYXNzOiAnc2JiLXRyYWluLWZvcm1hdGlvbl9fdHJhaW4tbGlzdCcsXG4gICAgICAgICAgICBhcmlhTGFiZWw6IGkxOG5UcmFpbnNbdGhpcy5fbGFuZ3VhZ2UuY3VycmVudF0sXG4gICAgICAgICAgfSl9XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9kaXY+XG4gICAgYDtcbiAgfVxufVxuXG5kZWNsYXJlIGdsb2JhbCB7XG4gIGludGVyZmFjZSBIVE1MRWxlbWVudFRhZ05hbWVNYXAge1xuICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAdHlwZXNjcmlwdC1lc2xpbnQvbmFtaW5nLWNvbnZlbnRpb25cbiAgICAnc2JiLXRyYWluLWZvcm1hdGlvbic6IFNiYlRyYWluRm9ybWF0aW9uRWxlbWVudDtcbiAgfVxufVxuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFnQ08sSUFBTSwyQkFBTixjQUF1QyxzQkFHNUMsVUFBVSxFQUFFO0FBQUEsRUFIUCxjQUFBO0FBQUEsVUFBQSxHQUFBLFNBQUE7QUFLdUIsU0FBQSxzQkFBc0IsQ0FBQyxXQUFXO0FBR2EsU0FBTyxpQkFDaEY7QUFFTyxTQUFRLFdBQStCO0FBSWhELFNBQVEseUJBQXlCLElBQUksdUJBQXVCLE1BQU0sS0FBSyxnQkFBZ0I7QUFDL0UsU0FBQSxTQUFTLElBQUksNEJBQTRCLElBQUk7QUFDN0MsU0FBQSxZQUFZLElBQUksc0JBQXNCLElBQUk7QUFBQSxFQUFBO0FBQUEsRUFFbEMsb0JBQTBCO0FBQ3hDLFVBQU0s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

package/development/train/train-wagon/train-wagon.d.ts

@@ -0,0 +1,49 @@
+import { CSSResultGroup, LitElement, PropertyValues, TemplateResult } from 'lit';
+import { SbbOccupancy } from '../../core/interfaces.js';
+import { SbbIconElement } from '../../icon.js';
+
+declare const SbbTrainWagonElement_base: import('../../core/mixins.js').AbstractConstructor<import('../../core/mixins.js').SbbNamedSlotListMixinType<SbbIconElement>> & typeof LitElement;
+/**
+ * It displays a train compartment within a `sbb-train` component.
+ *
+ * @slot - Use the unnamed slot to add one or more `sbb-icon` for meta-information of the `sbb-train-wagon`.
+ */
+export declare class SbbTrainWagonElement extends SbbTrainWagonElement_base {
+    static styles: CSSResultGroup;
+    static readonly events: {
+        readonly sectorChange: "sectorChange";
+    };
+    protected readonly listChildLocalNames: string[];
+    /** Wagon type. */
+    type: 'locomotive' | 'closed' | 'wagon';
+    /** Occupancy of a wagon. */
+    occupancy?: SbbOccupancy;
+    /** Sector in which to wagon stops. */
+    set sector(value: string);
+    get sector(): string | null;
+    private _sector;
+    /** Accessibility text for blocked passages of the wagon. */
+    blockedPassage: 'previous' | 'next' | 'both' | 'none';
+    /** Visible class label of a wagon. */
+    wagonClass?: '1' | '2';
+    /** Visible label for the wagon number. Not used by type locomotive or closed. */
+    label?: string;
+    /** Additional accessibility text which will be appended to the end. */
+    additionalAccessibilityText?: string;
+    private _language;
+    /**
+     * @internal
+     * Emits whenever the sector value changes.
+     */
+    private _sectorChange;
+    protected willUpdate(changedProperties: PropertyValues<this>): void;
+    private _sectorChanged;
+    protected render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sbb-train-wagon': SbbTrainWagonElement;
+    }
+}
+export {};
+//# sourceMappingURL=train-wagon.d.ts.map

package/development/train/train-wagon/train-wagon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"train-wagon.d.ts","sourceRoot":"","sources":["../../../../../src/elements/train/train-wagon/train-wagon.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EACnB,UAAU,EAEV,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,KAAK,CAAC;AAgBb,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAE7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAIpD,OAAO,eAAe,CAAC;AACvB,OAAO,mCAAmC,CAAC;;AAE3C;;;;GAIG;AACH,qBACa,oBAAqB,SAAQ,yBAEzC;IACC,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,gBAAuB,MAAM;;MAElB;IACX,mBAA4B,mBAAmB,WAAgB;IAE/D,kBAAkB;IACkB,IAAI,EAAE,YAAY,GAAG,QAAQ,GAAG,OAAO,CAAW;IAEtF,4BAA4B;IACT,SAAS,CAAC,EAAE,YAAY,CAAU;IAErD,sCAAsC;IACtC,IACW,MAAM,CAAC,KAAK,EAAE,MAAM,EAG9B;IACD,IAAW,MAAM,IAAI,MAAM,GAAG,IAAI,CAEjC;IACD,OAAO,CAAC,OAAO,CAAuB;IAEtC,4DAA4D;IAErD,cAAc,EAAE,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,CAAU;IAEtE,sCAAsC;IACS,UAAU,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IAEtE,iFAAiF;IAC9D,KAAK,CAAC,EAAE,MAAM,CAAC;IAElC,uEAAuE;IAEhE,2BAA2B,CAAC,EAAE,MAAM,CAAC;IAE5C,OAAO,CAAC,SAAS,CAAmC;IAEpD;;;OAGG;IACH,OAAO,CAAC,aAAa,CAOnB;cAEiB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAe5E,OAAO,CAAC,cAAc;cAIH,MAAM,IAAI,cAAc;CAwG5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,iBAAiB,EAAE,oBAAoB,CAAC;KACzC;CACF"}

package/development/train/train-wagon.d.ts

@@ -0,0 +1,2 @@
+export * from './train-wagon/train-wagon.js';
+//# sourceMappingURL=train-wagon.d.ts.map

package/development/train/train-wagon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"train-wagon.d.ts","sourceRoot":"","sources":["../../../../src/elements/train/train-wagon.ts"],"names":[],"mappings":"AAAA,cAAc,8BAA8B,CAAC"}