@sbb-esta/lyne-elements 3.6.0 → 3.8.0

package/core/i18n.js

@@ -1,99 +1,105 @@
-import { i18nAdditionalWagonInformationHeading as i, i18nArrival as a, i18nBlockedPassage as o, i18nBreadcrumbEllipsisButtonLabel as t, i18nCalendarDateSelection as r, i18nCalendarWeekNumber as l, i18nCheckboxRequired as u, i18nChipDelete as c, i18nChipGroupInputDescription as s, i18nClass as d, i18nClearInput as g, i18nCloseAlert as p, i18nCloseDialog as C, i18nCloseNavigation as D, i18nCloseNotification as S, i18nClosePopover as b, i18nCloseSidebar as P, i18nClosedCompartmentLabel as m, i18nCollapsed as T, i18nConnectionFrom as v, i18nConnectionRoundtrip as L, i18nConnectionTo as h, i18nCouchetteWagonLabel as x, i18nDateChangedTo as M, i18nDateInvalid as N, i18nDateMax as W, i18nDateMin as F, i18nDatePickerPlaceholder as I, i18nDeparture as f, i18nDialog as y, i18nDirection as R, i18nDurationDay as k, i18nDurationHour as B, i18nDurationMinute as O, i18nExpanded as Y, i18nFileSelectorButtonLabel as w, i18nFileSelectorButtonLabelMultiple as A, i18nFileSelectorCurrentlySelected as q, i18nFileSelectorDeleteFile as E, i18nFileSelectorSubtitleLabel as G, i18nFileSelectorSubtitleLabelMultiple as H, i18nFlipCard as Q, i18nFromPlatform as j, i18nGoBack as z, i18nInputRequired as J, i18nItemsPerPage as K, i18nLocomotiveLabel as U, i18nMapContainerButtonLabel as V, i18nMeansOfTransport as X, i18nNew as Z, i18nNextDay as _, i18nNextMonth as $, i18nNextPage as ee, i18nNextYear as ne, i18nNextYearRange as ie, i18nOccupancy as ae, i18nOptional as oe, i18nPage as te, i18nPaginatorOf as re, i18nPaginatorSelected as le, i18nPreviousDay as ue, i18nPreviousMonth as ce, i18nPreviousPage as se, i18nPreviousYear as de, i18nPreviousYearRange as ge, i18nRealTimeInfo as pe, i18nRestaurantWagonLabel as Ce, i18nReverseCard as De, i18nSector as Se, i18nSectorShort as be, i18nSelectNextDay as Pe, i18nSelectPreviousDay as me, i18nSelectedPage as Te, i18nSelectionRequired as ve, i18nShowCalendar as Le, i18nSleepingWagonLabel as he, i18nSupersaver as xe, i18nTargetOpensInNewWindow as Me, i18nTimeInputChange as Ne, i18nTimeInvalid as We, i18nTimeMax as Fe, i18nTimeMaxLength as Ie, i18nToday as fe, i18nTrain as ye, i18nTrains as Re, i18nTransferProcedure as ke, i18nTransferProcedures as Be, i18nTravelhints as Oe, i18nTripDuration as Ye, i18nTripQuayChange as we, i18nWagonLabel as Ae, i18nWagonLabelNumber as qe, i18nWagonsLabel as Ee, i18nWalkingDistanceArrival as Ge, i18nWalkingDistanceDeparture as He, i18nYearMonthSelection as Qe } from "./i18n/i18n.js";
+import { i18nAdditionalWagonInformationHeading as n, i18nArrival as a, i18nBlockedPassage as o, i18nBreadcrumbEllipsisButtonLabel as t, i18nCalendarDateSelection as r, i18nCalendarWeekNumber as l, i18nCarouselArrowsNavigationHint as u, i18nCarouselItemAriaLabel as s, i18nCheckboxRequired as c, i18nChipDelete as d, i18nChipGroupInputDescription as g, i18nClass as p, i18nClearInput as C, i18nCloseAlert as S, i18nCloseDialog as D, i18nCloseNavigation as b, i18nCloseNotification as P, i18nClosePopover as m, i18nCloseSidebar as v, i18nClosedCompartmentLabel as L, i18nCollapsed as T, i18nConnectionFrom as h, i18nConnectionRoundtrip as N, i18nConnectionTo as x, i18nCouchetteWagonLabel as M, i18nDateChangedTo as F, i18nDateInvalid as I, i18nDateMax as W, i18nDateMin as f, i18nDatePickerPlaceholder as y, i18nDeparture as R, i18nDialog as B, i18nDirection as k, i18nDurationDay as w, i18nDurationHour as A, i18nDurationMinute as O, i18nExpanded as Y, i18nFileSelectorButtonLabel as q, i18nFileSelectorButtonLabelMultiple as H, i18nFileSelectorCurrentlySelected as E, i18nFileSelectorDeleteFile as G, i18nFileSelectorSubtitleLabel as Q, i18nFileSelectorSubtitleLabelMultiple as j, i18nFlipCard as z, i18nFromPlatform as J, i18nGoBack as K, i18nInputRequired as U, i18nItemsPerPage as V, i18nLocomotiveLabel as X, i18nMapContainerButtonLabel as Z, i18nMeansOfTransport as _, i18nNew as $, i18nNextDay as ee, i18nNextMonth as ie, i18nNextPage as ne, i18nNextSlide as ae, i18nNextYear as oe, i18nNextYearRange as te, i18nOccupancy as re, i18nOptional as le, i18nPage as ue, i18nPaginatorOf as se, i18nPaginatorSelected as ce, i18nPreviousDay as de, i18nPreviousMonth as ge, i18nPreviousPage as pe, i18nPreviousSlide as Ce, i18nPreviousYear as Se, i18nPreviousYearRange as De, i18nRealTimeInfo as be, i18nRestaurantWagonLabel as Pe, i18nReverseCard as me, i18nSector as ve, i18nSectorShort as Le, i18nSelectNextDay as Te, i18nSelectPreviousDay as he, i18nSelectedPage as Ne, i18nSelectionRequired as xe, i18nShowCalendar as Me, i18nSleepingWagonLabel as Fe, i18nSlide as Ie, i18nSupersaver as We, i18nTargetOpensInNewWindow as fe, i18nTimeInputChange as ye, i18nTimeInvalid as Re, i18nTimeMax as Be, i18nTimeMaxLength as ke, i18nTimetableFormSwapButtonLabel as we, i18nToday as Ae, i18nTrain as Oe, i18nTrains as Ye, i18nTransferProcedure as qe, i18nTransferProcedures as He, i18nTravelhints as Ee, i18nTripDuration as Ge, i18nTripQuayChange as Qe, i18nWagonLabel as je, i18nWagonLabelNumber as ze, i18nWagonsLabel as Je, i18nWalkingDistanceArrival as Ke, i18nWalkingDistanceDeparture as Ue, i18nYearMonthSelection as Ve } from "./i18n/i18n.js";
 export {
-  i as i18nAdditionalWagonInformationHeading,
+  n as i18nAdditionalWagonInformationHeading,
   a as i18nArrival,
   o as i18nBlockedPassage,
   t as i18nBreadcrumbEllipsisButtonLabel,
   r as i18nCalendarDateSelection,
   l as i18nCalendarWeekNumber,
-  u as i18nCheckboxRequired,
-  c as i18nChipDelete,
-  s as i18nChipGroupInputDescription,
-  d as i18nClass,
-  g as i18nClearInput,
-  p as i18nCloseAlert,
-  C as i18nCloseDialog,
-  D as i18nCloseNavigation,
-  S as i18nCloseNotification,
-  b as i18nClosePopover,
-  P as i18nCloseSidebar,
-  m as i18nClosedCompartmentLabel,
+  u as i18nCarouselArrowsNavigationHint,
+  s as i18nCarouselItemAriaLabel,
+  c as i18nCheckboxRequired,
+  d as i18nChipDelete,
+  g as i18nChipGroupInputDescription,
+  p as i18nClass,
+  C as i18nClearInput,
+  S as i18nCloseAlert,
+  D as i18nCloseDialog,
+  b as i18nCloseNavigation,
+  P as i18nCloseNotification,
+  m as i18nClosePopover,
+  v as i18nCloseSidebar,
+  L as i18nClosedCompartmentLabel,
   T as i18nCollapsed,
-  v as i18nConnectionFrom,
-  L as i18nConnectionRoundtrip,
-  h as i18nConnectionTo,
-  x as i18nCouchetteWagonLabel,
-  M as i18nDateChangedTo,
-  N as i18nDateInvalid,
+  h as i18nConnectionFrom,
+  N as i18nConnectionRoundtrip,
+  x as i18nConnectionTo,
+  M as i18nCouchetteWagonLabel,
+  F as i18nDateChangedTo,
+  I as i18nDateInvalid,
   W as i18nDateMax,
-  F as i18nDateMin,
-  I as i18nDatePickerPlaceholder,
-  f as i18nDeparture,
-  y as i18nDialog,
-  R as i18nDirection,
-  k as i18nDurationDay,
-  B as i18nDurationHour,
+  f as i18nDateMin,
+  y as i18nDatePickerPlaceholder,
+  R as i18nDeparture,
+  B as i18nDialog,
+  k as i18nDirection,
+  w as i18nDurationDay,
+  A as i18nDurationHour,
   O as i18nDurationMinute,
   Y as i18nExpanded,
-  w as i18nFileSelectorButtonLabel,
-  A as i18nFileSelectorButtonLabelMultiple,
-  q as i18nFileSelectorCurrentlySelected,
-  E as i18nFileSelectorDeleteFile,
-  G as i18nFileSelectorSubtitleLabel,
-  H as i18nFileSelectorSubtitleLabelMultiple,
-  Q as i18nFlipCard,
-  j as i18nFromPlatform,
-  z as i18nGoBack,
-  J as i18nInputRequired,
-  K as i18nItemsPerPage,
-  U as i18nLocomotiveLabel,
-  V as i18nMapContainerButtonLabel,
-  X as i18nMeansOfTransport,
-  Z as i18nNew,
-  _ as i18nNextDay,
-  $ as i18nNextMonth,
-  ee as i18nNextPage,
-  ne as i18nNextYear,
-  ie as i18nNextYearRange,
-  ae as i18nOccupancy,
-  oe as i18nOptional,
-  te as i18nPage,
-  re as i18nPaginatorOf,
-  le as i18nPaginatorSelected,
-  ue as i18nPreviousDay,
-  ce as i18nPreviousMonth,
-  se as i18nPreviousPage,
-  de as i18nPreviousYear,
-  ge as i18nPreviousYearRange,
-  pe as i18nRealTimeInfo,
-  Ce as i18nRestaurantWagonLabel,
-  De as i18nReverseCard,
-  Se as i18nSector,
-  be as i18nSectorShort,
-  Pe as i18nSelectNextDay,
-  me as i18nSelectPreviousDay,
-  Te as i18nSelectedPage,
-  ve as i18nSelectionRequired,
-  Le as i18nShowCalendar,
-  he as i18nSleepingWagonLabel,
-  xe as i18nSupersaver,
-  Me as i18nTargetOpensInNewWindow,
-  Ne as i18nTimeInputChange,
-  We as i18nTimeInvalid,
-  Fe as i18nTimeMax,
-  Ie as i18nTimeMaxLength,
-  fe as i18nToday,
-  ye as i18nTrain,
-  Re as i18nTrains,
-  ke as i18nTransferProcedure,
-  Be as i18nTransferProcedures,
-  Oe as i18nTravelhints,
-  Ye as i18nTripDuration,
-  we as i18nTripQuayChange,
-  Ae as i18nWagonLabel,
-  qe as i18nWagonLabelNumber,
-  Ee as i18nWagonsLabel,
-  Ge as i18nWalkingDistanceArrival,
-  He as i18nWalkingDistanceDeparture,
-  Qe as i18nYearMonthSelection
+  q as i18nFileSelectorButtonLabel,
+  H as i18nFileSelectorButtonLabelMultiple,
+  E as i18nFileSelectorCurrentlySelected,
+  G as i18nFileSelectorDeleteFile,
+  Q as i18nFileSelectorSubtitleLabel,
+  j as i18nFileSelectorSubtitleLabelMultiple,
+  z as i18nFlipCard,
+  J as i18nFromPlatform,
+  K as i18nGoBack,
+  U as i18nInputRequired,
+  V as i18nItemsPerPage,
+  X as i18nLocomotiveLabel,
+  Z as i18nMapContainerButtonLabel,
+  _ as i18nMeansOfTransport,
+  $ as i18nNew,
+  ee as i18nNextDay,
+  ie as i18nNextMonth,
+  ne as i18nNextPage,
+  ae as i18nNextSlide,
+  oe as i18nNextYear,
+  te as i18nNextYearRange,
+  re as i18nOccupancy,
+  le as i18nOptional,
+  ue as i18nPage,
+  se as i18nPaginatorOf,
+  ce as i18nPaginatorSelected,
+  de as i18nPreviousDay,
+  ge as i18nPreviousMonth,
+  pe as i18nPreviousPage,
+  Ce as i18nPreviousSlide,
+  Se as i18nPreviousYear,
+  De as i18nPreviousYearRange,
+  be as i18nRealTimeInfo,
+  Pe as i18nRestaurantWagonLabel,
+  me as i18nReverseCard,
+  ve as i18nSector,
+  Le as i18nSectorShort,
+  Te as i18nSelectNextDay,
+  he as i18nSelectPreviousDay,
+  Ne as i18nSelectedPage,
+  xe as i18nSelectionRequired,
+  Me as i18nShowCalendar,
+  Fe as i18nSleepingWagonLabel,
+  Ie as i18nSlide,
+  We as i18nSupersaver,
+  fe as i18nTargetOpensInNewWindow,
+  ye as i18nTimeInputChange,
+  Re as i18nTimeInvalid,
+  Be as i18nTimeMax,
+  ke as i18nTimeMaxLength,
+  we as i18nTimetableFormSwapButtonLabel,
+  Ae as i18nToday,
+  Oe as i18nTrain,
+  Ye as i18nTrains,
+  qe as i18nTransferProcedure,
+  He as i18nTransferProcedures,
+  Ee as i18nTravelhints,
+  Ge as i18nTripDuration,
+  Qe as i18nTripQuayChange,
+  je as i18nWagonLabel,
+  ze as i18nWagonLabelNumber,
+  Je as i18nWagonsLabel,
+  Ke as i18nWalkingDistanceArrival,
+  Ue as i18nWalkingDistanceDeparture,
+  Ve as i18nYearMonthSelection
 };

package/core/images.d.ts

@@ -1,3 +1,7 @@
+/**
+ * This demo pictures must not be used in production code.
+ * Internally we should only use them in stories.
+ */
 declare const sampleImages: string[];
 export default sampleImages;
 //# sourceMappingURL=images.d.ts.map

package/core/images.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"images.d.ts","sourceRoot":"","sources":["../../../src/elements/core/images.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,YAAY,EAAE,MAAM,EAWzB,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"images.d.ts","sourceRoot":"","sources":["../../../src/elements/core/images.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,QAAA,MAAM,YAAY,EAAE,MAAM,EAWzB,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/core/images.js

@@ -1,15 +1,15 @@
-const n = [
-  "https://cdn.img.sbb.ch/content/dam/internet/lyne/Billetkontrolle.jpg",
-  "https://cdn.img.sbb.ch/content/dam/internet/lyne/Hoehenrundweg-Gryden-Lenk.jpg",
-  "https://cdn.img.sbb.ch/content/dam/internet/lyne/Kaufmann-frau.jpg",
-  "https://cdn.img.sbb.ch/content/dam/internet/lyne/Corona-Schutzkonzept.jpg",
-  "https://cdn.img.sbb.ch/content/dam/internet/lyne/Digitale-Werbung-SBB.jpg",
-  "https://cdn.img.sbb.ch/content/dam/internet/lyne/Bahnhof-Luzern.jpg",
-  "https://cdn.img.sbb.ch/content/dam/internet/lyne/Einheitswagen-IV-EuroCity.jpg",
-  "https://cdn.img.sbb.ch/content/dam/internet/lyne/Einsatzstrecken_EW4-Eurocity.jpg",
-  "https://cdn.img.sbb.ch/content/dam/internet/lyne/Frau-No-Results.png",
-  "https://cdn.img.sbb.ch/content/dam/internet/lyne/Helpteaser-Background-Landscape.png"
+const e = [
+  "https://cdn.img.sbb.ch/content/dam/internet/externe-assets/lyne/Billetkontrolle.jpg",
+  "https://cdn.img.sbb.ch/content/dam/internet/externe-assets/lyne/Hoehenrundweg-Gryden-Lenk.jpg",
+  "https://cdn.img.sbb.ch/content/dam/internet/externe-assets/lyne/Kaufmann-frau.jpg",
+  "https://cdn.img.sbb.ch/content/dam/internet/externe-assets/lyne/Corona-Schutzkonzept.jpg",
+  "https://cdn.img.sbb.ch/content/dam/internet/externe-assets/lyne/Digitale-Werbung-SBB.jpg",
+  "https://cdn.img.sbb.ch/content/dam/internet/externe-assets/lyne/Bahnhof-Luzern.jpg",
+  "https://cdn.img.sbb.ch/content/dam/internet/externe-assets/lyne/Einheitswagen-IV-EuroCity.jpg",
+  "https://cdn.img.sbb.ch/content/dam/internet/externe-assets/lyne/Einsatzstrecken_EW4-Eurocity.jpg",
+  "https://cdn.img.sbb.ch/content/dam/internet/externe-assets/lyne/Frau-No-Results.png",
+  "https://cdn.img.sbb.ch/content/dam/internet/externe-assets/lyne/Helpteaser-Background-Landscape.png"
 ];
 export {
-  n as default
+  e as default
 };

package/core/mixins.js

@@ -1,10 +1,10 @@
-import { SbbAnimationCompleteMixin as i } from "./mixins/animation-complete-mixin.js";
+import { SbbAnimationCompleteMixin as b } from "./mixins/animation-complete-mixin.js";
 import { SbbDisabledInteractiveMixin as a, SbbDisabledMixin as t, SbbDisabledTabIndexActionMixin as l } from "./mixins/disabled-mixin.js";
-import { SbbElementInternalsMixin as c, appendAriaElements as p, removeAriaElements as x } from "./mixins/element-internals-mixin.js";
+import { SbbElementInternalsMixin as c, appendAriaElements as p, removeAriaElements as u } from "./mixins/element-internals-mixin.js";
 import { SbbFormAssociatedCheckboxMixin as v } from "./mixins/form-associated-checkbox-mixin.js";
 import { SbbFormAssociatedInputMixin as f } from "./mixins/form-associated-input-mixin.js";
-import { SbbFormAssociatedMixin as g } from "./mixins/form-associated-mixin.js";
-import { SbbFormAssociatedRadioButtonMixin as M, radioButtonRegistry as k } from "./mixins/form-associated-radio-button-mixin.js";
+import { SbbFormAssociatedMixin as h } from "./mixins/form-associated-mixin.js";
+import { SbbFormAssociatedRadioButtonMixin as k, radioButtonRegistry as M } from "./mixins/form-associated-radio-button-mixin.js";
 import { SbbHydrationMixin as y } from "./mixins/hydration-mixin.js";
 import { SbbNamedSlotListMixin as C } from "./mixins/named-slot-list-mixin.js";
 import { SbbNegativeMixin as I } from "./mixins/negative-mixin.js";
@@ -14,17 +14,17 @@ import { SbbReadonlyMixin as P } from "./mixins/readonly-mixin.js";
 import { SbbSelectionPanelMixin as q } from "./mixins/selection-panel-mixin.js";
 import { SbbUpdateSchedulerMixin as H } from "./mixins/update-scheduler-mixin.js";
 import { css as e } from "lit";
-const n = e`:host{--sbb-selection-panel-background: var( --sbb-selection-panel-inner-background, var(--sbb-color-white) );--sbb-selection-panel-border-color: var(--sbb-color-cloud);--sbb-selection-panel-border-radius: var( --sbb-selection-expansion-panel-border-radius, var(--sbb-border-radius-4x) );--sbb-selection-panel-border-width: var( --sbb-selection-panel-inner-border-width, var(--sbb-border-width-1x) );--sbb-selection-panel-input-padding: var(--sbb-spacing-responsive-xs) var(--sbb-spacing-responsive-xxs);--sbb-selection-panel-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-selection-panel-cursor: pointer;--sbb-selection-panel-suffix-color: var(--sbb-color-charcoal);--sbb-selection-panel-subtext-color: var(--sbb-color-granite);display:block;outline:none!important}:host([size=s]){--sbb-selection-panel-input-padding: var(--sbb-spacing-responsive-xxs) var(--sbb-spacing-responsive-xxxs)}:host([color=milk]){--sbb-selection-panel-background: var( --sbb-selection-panel-inner-background, var(--sbb-color-milk) )}:host([borderless]:not([data-checked])){--sbb-selection-panel-border-color: transparent}:host(:is([data-checked]):not(:disabled,[disabled])){--sbb-selection-panel-border-color: var(--sbb-color-charcoal);--sbb-selection-panel-border-width: var( --sbb-selection-panel-inner-border-width, var(--sbb-border-width-2x) )}:host(:is(:disabled,[disabled])){--sbb-selection-panel-cursor: default}.sbb-selection-panel{display:block;cursor:var(--sbb-selection-panel-cursor);position:relative;border-radius:var(--sbb-selection-panel-border-radius);box-shadow:inset 0 0 0 var(--sbb-selection-panel-border-width) var(--sbb-selection-panel-border-color);padding:var(--sbb-selection-panel-input-padding);background-color:var(--sbb-selection-panel-background);transition-duration:var(--sbb-selection-panel-animation-duration);transition-timing-function:var(--sbb-animation-easing);transition-property:box-shadow}@media (forced-colors: active){.sbb-selection-panel:after{content:"";display:block;position:absolute;inset:0;pointer-events:none;border:var(--sbb-selection-panel-border-width) solid var(--sbb-selection-panel-border-color);border-radius:var(--sbb-selection-panel-border-radius)}}:host(:focus-visible) .sbb-selection-panel{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width)}.sbb-selection-panel__badge{-webkit-user-select:none;user-select:none;pointer-events:none;position:absolute;inset:0;border-radius:var(--sbb-selection-panel-border-radius);overflow:hidden}slot[name=suffix]{color:var(--sbb-selection-panel-suffix-color)}slot[name=subtext]{display:block;color:var(--sbb-selection-panel-subtext-color);padding-inline-start:var(--sbb-spacing-fixed-8x)}:host(:not([data-slot-names~=subtext])) slot[name=subtext]{display:none}`;
+const n = e`:host{--sbb-selection-panel-background: var( --sbb-selection-panel-inner-background, var(--sbb-background-color-1) );--sbb-selection-panel-border-color: var(--sbb-border-color-4-inverted);--sbb-selection-panel-border-radius: var( --sbb-selection-expansion-panel-border-radius, var(--sbb-border-radius-4x) );--sbb-selection-panel-border-width: var( --sbb-selection-panel-inner-border-width, var(--sbb-border-width-1x) );--sbb-selection-panel-input-padding: var(--sbb-spacing-responsive-xs) var(--sbb-spacing-responsive-xxs);--sbb-selection-panel-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-selection-panel-cursor: pointer;--sbb-selection-panel-suffix-color: var(--sbb-color-3);--sbb-selection-panel-subtext-color: var(--sbb-color-granite);--sbb-selection-panel-subtext-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));display:block;outline:none!important}:host([size=s]){--sbb-selection-panel-input-padding: var(--sbb-spacing-responsive-xxs) var(--sbb-spacing-responsive-xxxs)}:host([color=milk]){--sbb-selection-panel-background: var( --sbb-selection-panel-inner-background, var(--sbb-background-color-3) )}:host([borderless]:not([data-checked])){--sbb-selection-panel-border-color: transparent}:host(:is([data-checked]):not(:disabled,[disabled])){--sbb-selection-panel-border-color: var(--sbb-border-color-3);--sbb-selection-panel-border-width: var( --sbb-selection-panel-inner-border-width, var(--sbb-border-width-2x) )}:host(:is(:disabled,[disabled])){--sbb-selection-panel-cursor: default}.sbb-selection-panel{display:block;cursor:var(--sbb-selection-panel-cursor);position:relative;border-radius:var(--sbb-selection-panel-border-radius);box-shadow:inset 0 0 0 var(--sbb-selection-panel-border-width) var(--sbb-selection-panel-border-color);padding:var(--sbb-selection-panel-input-padding);background-color:var(--sbb-selection-panel-background);transition-duration:var(--sbb-selection-panel-animation-duration);transition-timing-function:var(--sbb-animation-easing);transition-property:box-shadow}@media (forced-colors: active){.sbb-selection-panel:after{content:"";display:block;position:absolute;inset:0;pointer-events:none;border:var(--sbb-selection-panel-border-width) solid var(--sbb-selection-panel-border-color);border-radius:var(--sbb-selection-panel-border-radius)}}:host(:focus-visible) .sbb-selection-panel{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width)}.sbb-selection-panel__badge{-webkit-user-select:none;user-select:none;pointer-events:none;position:absolute;inset:0;border-radius:var(--sbb-selection-panel-border-radius);overflow:hidden}slot[name=suffix]{color:var(--sbb-selection-panel-suffix-color)}slot[name=subtext]{display:block;color:var(--sbb-selection-panel-subtext-color);padding-inline-start:var(--sbb-spacing-fixed-8x)}:host(:not([data-slot-names~=subtext])) slot[name=subtext]{display:none}`;
 export {
-  i as SbbAnimationCompleteMixin,
+  b as SbbAnimationCompleteMixin,
   a as SbbDisabledInteractiveMixin,
   t as SbbDisabledMixin,
   l as SbbDisabledTabIndexActionMixin,
   c as SbbElementInternalsMixin,
   v as SbbFormAssociatedCheckboxMixin,
   f as SbbFormAssociatedInputMixin,
-  g as SbbFormAssociatedMixin,
-  M as SbbFormAssociatedRadioButtonMixin,
+  h as SbbFormAssociatedMixin,
+  k as SbbFormAssociatedRadioButtonMixin,
   y as SbbHydrationMixin,
   C as SbbNamedSlotListMixin,
   I as SbbNegativeMixin,
@@ -35,6 +35,6 @@ export {
   H as SbbUpdateSchedulerMixin,
   p as appendAriaElements,
   n as panelCommonStyle,
-  k as radioButtonRegistry,
-  x as removeAriaElements
+  M as radioButtonRegistry,
+  u as removeAriaElements
 };

package/core/overlay/overlay-outside-pointer-event-listener.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Listens globally to pointer events that happen outside the overlay area.
+ *
+ * Ref: https://github.com/angular/components/blob/main/src/cdk/overlay/dispatchers/overlay-outside-click-dispatcher.ts
+ */
+export declare class SbbOverlayOutsidePointerEventListener {
+    private _overlays;
+    private _pointerDownEventTarget?;
+    private _abortController?;
+    private _cursorOriginalValue?;
+    connect(overlay: HTMLElement): void;
+    disconnect(overlay: HTMLElement): void;
+    private _addGlobalEventListeners;
+    /** Store pointerdown event target to track origin of click. */
+    private _pointerDownListener;
+    /** Click event listener that will be attached to the body propagate phase. */
+    private _clickListener;
+}
+/** The global instance for listening for outside pointer events. */
+export declare const sbbOverlayOutsidePointerEventListener: SbbOverlayOutsidePointerEventListener;
+declare global {
+    interface GlobalEventHandlersEventMap {
+        overlayOutsidePointer: CustomEvent;
+    }
+}
+//# sourceMappingURL=overlay-outside-pointer-event-listener.d.ts.map

package/core/overlay/overlay-outside-pointer-event-listener.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"overlay-outside-pointer-event-listener.d.ts","sourceRoot":"","sources":["../../../../src/elements/core/overlay/overlay-outside-pointer-event-listener.ts"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,qBAAa,qCAAqC;IAChD,OAAO,CAAC,SAAS,CAA0B;IAC3C,OAAO,CAAC,uBAAuB,CAAC,CAAc;IAC9C,OAAO,CAAC,gBAAgB,CAAC,CAAkB;IAC3C,OAAO,CAAC,oBAAoB,CAAC,CAAS;IAE/B,OAAO,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IAiBnC,UAAU,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI;IAW7C,OAAO,CAAC,wBAAwB;IAkBhC,+DAA+D;IAC/D,OAAO,CAAC,oBAAoB,CAE1B;IAEF,8EAA8E;IAC9E,OAAO,CAAC,cAAc,CAyBpB;CACH;AAED,oEAAoE;AACpE,eAAO,MAAM,qCAAqC,uCAA8C,CAAC;AAEjG,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,2BAA2B;QACnC,qBAAqB,EAAE,WAAW,CAAC;KACpC;CACF"}

package/core/overlay/overlay-outside-pointer-event-listener.js

@@ -0,0 +1,37 @@
+import { containsPierceShadowDom as r, isIOS as i, isAndroid as n } from "../dom.js";
+class a {
+  constructor() {
+    this._overlays = /* @__PURE__ */ new Set(), this._pointerDownListener = (t) => {
+      this._pointerDownEventTarget = t.composedPath()[0];
+    }, this._clickListener = (t) => {
+      const e = t.composedPath()[0], s = t.type === "click" && this._pointerDownEventTarget ? this._pointerDownEventTarget : e;
+      this._pointerDownEventTarget = void 0;
+      for (const o of Array.from(this._overlays).reverse()) {
+        if (r(o, e) || r(o, s))
+          break;
+        o.dispatchEvent(new CustomEvent("overlayOutsidePointer"));
+      }
+    };
+  }
+  connect(t) {
+    this._overlays.size || (this._addGlobalEventListeners(), i && (this._cursorOriginalValue = document.body.style.cursor, document.body.style.cursor = "pointer")), this._overlays.add(t);
+  }
+  disconnect(t) {
+    this._overlays.delete(t), this._overlays.size || (this._abortController?.abort(), this._abortController = void 0, i && (document.body.style.cursor = this._cursorOriginalValue));
+  }
+  _addGlobalEventListeners() {
+    const t = document.body;
+    this._abortController = new AbortController();
+    const e = {
+      capture: !0,
+      passive: !0,
+      signal: this._abortController.signal
+    };
+    t.addEventListener("click", this._clickListener, e), !n && !i && (t.addEventListener("pointerdown", this._pointerDownListener, e), t.addEventListener("auxclick", this._clickListener, e), t.addEventListener("contextmenu", this._clickListener, e));
+  }
+}
+const d = new a();
+export {
+  a as SbbOverlayOutsidePointerEventListener,
+  d as sbbOverlayOutsidePointerEventListener
+};

package/core/overlay.d.ts

@@ -3,6 +3,7 @@
  */
 export * from './overlay/overlay.js';
 export * from './overlay/overlay-option-panel.js';
+export * from './overlay/overlay-outside-pointer-event-listener.js';
 export * from './overlay/overlay-trigger-attributes.js';
 export * from './overlay/position.js';
 //# sourceMappingURL=overlay.d.ts.map

package/core/overlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"overlay.d.ts","sourceRoot":"","sources":["../../../src/elements/core/overlay.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,cAAc,sBAAsB,CAAC;AACrC,cAAc,mCAAmC,CAAC;AAClD,cAAc,yCAAyC,CAAC;AACxD,cAAc,uBAAuB,CAAC"}
+{"version":3,"file":"overlay.d.ts","sourceRoot":"","sources":["../../../src/elements/core/overlay.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,cAAc,sBAAsB,CAAC;AACrC,cAAc,mCAAmC,CAAC;AAClD,cAAc,qDAAqD,CAAC;AACpE,cAAc,yCAAyC,CAAC;AACxD,cAAc,uBAAuB,CAAC"}

package/core/overlay.js

@@ -1,15 +1,18 @@
-import { overlayGapFixCorners as t } from "./overlay/overlay.js";
+import { overlayGapFixCorners as r } from "./overlay/overlay.js";
 import { setOverlayPosition as i } from "./overlay/overlay-option-panel.js";
-import { removeAriaComboBoxAttributes as s, removeAriaOverlayTriggerAttributes as a, setAriaComboBoxAttributes as n, setAriaOverlayTriggerAttributes as l } from "./overlay/overlay-trigger-attributes.js";
-import { getElementPosition as g, getElementRectangle as v, isEventOnElement as x } from "./overlay/position.js";
+import { SbbOverlayOutsidePointerEventListener as n, sbbOverlayOutsidePointerEventListener as a } from "./overlay/overlay-outside-pointer-event-listener.js";
+import { removeAriaComboBoxAttributes as v, removeAriaOverlayTriggerAttributes as b, setAriaComboBoxAttributes as l, setAriaOverlayTriggerAttributes as x } from "./overlay/overlay-trigger-attributes.js";
+import { getElementPosition as O, getElementRectangle as g, isEventOnElement as p } from "./overlay/position.js";
 export {
-  g as getElementPosition,
-  v as getElementRectangle,
-  x as isEventOnElement,
-  t as overlayGapFixCorners,
-  s as removeAriaComboBoxAttributes,
-  a as removeAriaOverlayTriggerAttributes,
-  n as setAriaComboBoxAttributes,
-  l as setAriaOverlayTriggerAttributes,
+  n as SbbOverlayOutsidePointerEventListener,
+  O as getElementPosition,
+  g as getElementRectangle,
+  p as isEventOnElement,
+  r as overlayGapFixCorners,
+  v as removeAriaComboBoxAttributes,
+  b as removeAriaOverlayTriggerAttributes,
+  a as sbbOverlayOutsidePointerEventListener,
+  l as setAriaComboBoxAttributes,
+  x as setAriaOverlayTriggerAttributes,
   i as setOverlayPosition
 };

package/core/styles/core.scss

@@ -1,4 +1,8 @@
-@use 'node_modules_@sbb-esta_lyne-design-tokens_dist_scss_sbb-variables_css--mixin.scss' as sbb-css-tokens;
+$theme: 'standard' !default;
+
+@use 'node_modules_@sbb-esta_lyne-design-tokens_dist_scss_sbb-variables_css--mixin.scss' as sbb-css-tokens with (
+  $theme: $theme
+);
 @use './core/mediaqueries';
 @use './core/functions';
 @use './mixins/a11y';
@@ -98,10 +102,24 @@
 
 @include font-face.font-declarations;
 
+// TODO: discuss where to add these classes
+.sbb-dark {
+  color-scheme: dark;
+}
+
+.sbb-light {
+  color-scheme: light;
+}
+
+.sbb-light-dark {
+  color-scheme: light dark;
+}
+
 html {
   @include typo.text;
 
   color: var(--sbb-font-default-color);
+  background-color: var(--sbb-background-color-1);
 }
 
 // TODO: Remove if webkit bug is resolved: https://bugs.webkit.org/show_bug.cgi?id=223814
@@ -109,7 +127,7 @@ html {
   @include typo.placeholder;
 }
 
-sbb-form-field {
+:is(sbb-form-field, sbb-timetable-form-field) {
   :where(input, select, textarea, sbb-select, sbb-date-input, sbb-time-input) {
     @include typo.text-m--regular;
     @include helpers.ellipsis;
@@ -153,8 +171,8 @@ sbb-form-field {
 
   // TODO: Remove if webkit bug is resolved: https://bugs.webkit.org/show_bug.cgi?id=223814
   &:not([floating-label]) :where(input, select, textarea, sbb-select):disabled::placeholder {
-    color: var(--sbb-color-granite);
-    -webkit-text-fill-color: var(--sbb-color-granite);
+    color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));
+    -webkit-text-fill-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));
   }
 
   // Fix positioning issue for select which occurs in Safari
@@ -211,12 +229,12 @@ sbb-form-field {
     )
   ),
   :is(.ng-submitted, .sbb-show-errors) &:has(:is(:invalid, .ng-invalid)) {
-    --sbb-form-field-border-color: var(--sbb-color-red125);
-    --sbb-form-field-text-color: var(--sbb-color-red125);
+    --sbb-form-field-border-color: var(--sbb-color-error);
+    --sbb-form-field-text-color: var(--sbb-color-error);
 
     &[negative] {
-      --sbb-form-field-border-color: var(--sbb-color-red-mode-dark);
-      --sbb-form-field-text-color: var(--sbb-color-red-mode-dark);
+      --sbb-form-field-border-color: var(--sbb-color-red85);
+      --sbb-form-field-text-color: var(--sbb-color-red85);
     }
 
     @include a11y.if-forced-colors {
@@ -239,7 +257,8 @@ sbb-form-field {
   sbb-popover,
   sbb-select,
   sbb-skiplink-list,
-  sbb-toast
+  sbb-toast,
+  sbb-tooltip
 ):not(:defined) {
   display: none;
 }
@@ -254,7 +273,8 @@ sbb-form-field {
   sbb-navigation,
   sbb-overlay,
   sbb-popover,
-  sbb-toast
+  sbb-toast,
+  sbb-tooltip
 ) {
   @include popover.popover-reset;
 }
@@ -280,10 +300,11 @@ sbb-breadcrumb-group:not(:defined) {
   padding-inline: var(--sbb-spacing-fixed-4x);
   gap: var(--sbb-spacing-fixed-1x);
   align-items: baseline;
+  color: var(--sbb-color-1);
 
   strong + * {
     font-size: var(--sbb-font-size-text-xxs);
-    color: var(--sbb-color-granite);
+    color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));
   }
 }
 
@@ -560,7 +581,7 @@ sbb-toggle:has(:focus-visible) {
 
 sbb-dialog-actions {
   sbb-dialog[negative] & {
-    --sbb-dialog-actions-border-color: var(--sbb-color-iron);
+    --sbb-dialog-actions-border-color: var(--sbb-background-color-4-negative);
   }
 
   sbb-dialog:state(overflows) & {
@@ -616,7 +637,13 @@ sbb-notification:has(sbb-title) {
 
 sbb-status:has(sbb-title) {
   --sbb-status-gap: var(--sbb-spacing-responsive-xxxs);
-  --_sbb-status-text-color-override: var(--sbb-color-granite);
+  --_sbb-status-text-color-override: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));
   --_sbb-status-title-font-size: var(--sbb-font-size-title-5);
   --_sbb-status-title-line-height: var(--sbb-typo-line-height-titles);
 }
+
+.sbb-overlay-outlet {
+  position: fixed;
+  inset: 0;
+  pointer-events: none;
+}

package/core/styles/mixins/a11y.scss

@@ -27,7 +27,7 @@
 
 @mixin screen-reader-only {
   border: 0;
-  clip: rect(0 0 0 0);
+  clip-path: rect(0 0 0 0);
   height: 1px;
   margin: -1px;
   overflow: hidden;

package/core/styles/mixins/badge.scss

@@ -8,8 +8,8 @@
   justify-content: center;
   padding-inline: var(--sbb-spacing-fixed-1x);
   border-radius: var(--sbb-border-radius-infinity);
-  background-color: var(--sbb-color-red);
-  color: var(--sbb-color-white);
+  background-color: var(--sbb-color-primary);
+  color: var(--sbb-color-1-negative);
   min-width: var(--sbb-spacing-fixed-4x);
   max-height: var(--sbb-spacing-fixed-4x);
 }

package/core/styles/mixins/buttons.scss

@@ -57,13 +57,13 @@ $active: ':active, [data-active]';
 
 // Variables used in the icon-button
 @mixin icon-button-variables {
-  --sbb-button-color-text: var(--sbb-color-charcoal);
-  --sbb-button-color-default-background: var(--sbb-color-black-alpha-0);
-  --sbb-button-color-hover-background: var(--sbb-color-milk);
-  --sbb-button-color-active-background: var(--sbb-color-cloud);
-  --sbb-button-color-disabled-background: var(--sbb-color-milk);
-  --sbb-button-color-disabled-border: var(--sbb-color-smoke);
-  --sbb-button-color-disabled-text: var(--sbb-color-granite);
+  --sbb-button-color-text: var(--sbb-color-3);
+  --sbb-button-color-default-background: transparent;
+  --sbb-button-color-hover-background: var(--sbb-background-color-3);
+  --sbb-button-color-active-background: var(--sbb-background-color-4);
+  --sbb-button-color-disabled-background: var(--sbb-background-color-3);
+  --sbb-button-color-disabled-border: var(--sbb-border-color-5);
+  --sbb-button-color-disabled-text: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));
   --sbb-button-border-disabled-width: var(--sbb-border-width-1x);
   --sbb-button-border-disabled-style: dashed;
   --sbb-button-border-radius: var(--sbb-border-radius-infinity);
@@ -85,13 +85,13 @@ $active: ':active, [data-active]';
 
 // Variables used in the icon-button negative variant
 @mixin icon-button-variables-negative {
-  --sbb-button-color-text: var(--sbb-color-milk);
-  --sbb-button-color-default-background: var(--sbb-color-black-alpha-0);
-  --sbb-button-color-hover-background: var(--sbb-color-charcoal);
-  --sbb-button-color-active-background: var(--sbb-color-iron);
-  --sbb-button-color-disabled-background: var(--sbb-color-charcoal);
-  --sbb-button-color-disabled-border: var(--sbb-color-smoke);
-  --sbb-button-color-disabled-text: var(--sbb-color-smoke);
+  --sbb-button-color-text: var(--sbb-color-3-negative);
+  --sbb-button-color-default-background: transparent;
+  --sbb-button-color-hover-background: var(--sbb-background-color-3-negative);
+  --sbb-button-color-active-background: var(--sbb-background-color-4-negative);
+  --sbb-button-color-disabled-background: var(--sbb-background-color-3-negative);
+  --sbb-button-color-disabled-border: var(--sbb-border-color-5);
+  --sbb-button-color-disabled-text: var(--sbb-color-5);
 }
 
 // Default state for icon-button in form-field