@sbb-esta/lyne-elements 3.12.0 → 4.0.0-next

package/calendar/calendar.component.js

@@ -9,53 +9,54 @@ import { customElement as He, property as Y, state as G } from "lit/decorators.j
 import { classMap as Q } from "lit/directives/class-map.js";
 import { sbbInputModalityDetector as qe, isArrowKeyOrPageKeysPressed as Ke } from "../core/a11y.js";
 import { readConfig as Ue } from "../core/config.js";
-import { SbbLanguageController as je, SbbMediaMatcherController as Ge, SbbMediaQueryBreakpointMediumAndAbove as Se } from "../core/controllers.js";
+import { SbbLanguageController as je, SbbMediaMatcherController as Ge, SbbMediaQueryBreakpointLargeAndAbove as Se } from "../core/controllers.js";
 import { defaultDateAdapter as Qe, YEARS_PER_PAGE as V, DAYS_PER_ROW as D, MONTHS_PER_ROW as J, YEARS_PER_ROW as X, MONTHS_PER_PAGE as Je } from "../core/datetime.js";
 import { forceType as Z, plainDate as Te, handleDistinctChange as Xe } from "../core/decorators.js";
-import { i18nPreviousMonth as Ze, i18nNextMonth as et, i18nYearMonthSelection as tt, i18nCalendarWeekNumber as K, i18nPreviousYear as at, i18nNextYear as st, i18nCalendarDateSelection as Ee, i18nPreviousYearRange as it, i18nNextYearRange as rt } from "../core/i18n.js";
+import { i18nPreviousMonth as Ze, i18nNextMonth as et, i18nYearMonthSelection as tt, i18nCalendarWeekNumber as K, i18nPreviousYear as at, i18nNextYear as st, i18nCalendarDateSelection as Ee, i18nPreviousYearRange as rt, i18nNextYearRange as it } from "../core/i18n.js";
 import { SbbHydrationMixin as nt } from "../core/mixins.js";
+import { boxSizingStyles as lt } from "../core/styles.js";
 import "../button/secondary-button.js";
 import "../icon.js";
 import "../screen-reader-only.js";
-const lt = 6048e5, Pe = Symbol.for("constructDateFrom");
+const ot = 6048e5, Pe = Symbol.for("constructDateFrom");
 function F(o, n) {
   return typeof o == "function" ? o(n) : o && typeof o == "object" && Pe in o ? o[Pe](n) : o instanceof Date ? new o.constructor(n) : new Date(n);
 }
 function U(o, n) {
   return F(n || o, o);
 }
-function ot(o, n, d) {
+function dt(o, n, d) {
   const b = U(o, d?.in);
   return isNaN(n) ? F(o, NaN) : (n && b.setDate(b.getDate() + n), b);
 }
-let dt = {};
+let ct = {};
 function te() {
-  return dt;
+  return ct;
 }
 function z(o, n) {
   const d = te(), b = n?.weekStartsOn ?? n?.locale?.options?.weekStartsOn ?? d.weekStartsOn ?? d.locale?.options?.weekStartsOn ?? 0, g = U(o, n?.in), v = g.getDay(), $ = (v < b ? 7 : 0) + v - b;
   return g.setDate(g.getDate() - $), g.setHours(0, 0, 0, 0), g;
 }
-function ct(o, ...n) {
+function ht(o, ...n) {
   const d = F.bind(
     null,
     o || n.find((b) => typeof b == "object")
   );
   return n.map(d);
 }
-function ht(o, n, d) {
-  return ot(o, n * 7, d);
+function bt(o, n, d) {
+  return dt(o, n * 7, d);
 }
-function bt(o, n) {
+function _t(o, n) {
   const d = U(o, n?.in), b = d.getMonth();
   return d.setFullYear(d.getFullYear(), b + 1, 0), d.setHours(23, 59, 59, 999), d;
 }
-function _t(o, n) {
-  const [d, b] = ct(o, n.start, n.end);
+function ut(o, n) {
+  const [d, b] = ht(o, n.start, n.end);
   return { start: d, end: b };
 }
-function ut(o, n) {
-  const { start: d, end: b } = _t(n?.in, o);
+function ft(o, n) {
+  const { start: d, end: b } = ut(n?.in, o);
   let g = +d > +b;
   const v = z(g ? b : d, n), $ = z(g ? d : b, n);
   v.setHours(15), $.setHours(15);
@@ -65,14 +66,14 @@ function ut(o, n) {
   M < 0 && (M = -M, g = !g);
   const W = [];
   for (; +A <= O; )
-    A.setHours(0), W.push(F(d, A)), A = ht(A, M), A.setHours(15);
+    A.setHours(0), W.push(F(d, A)), A = bt(A, M), A.setHours(15);
   return g ? W.reverse() : W;
 }
-function ft(o, n) {
+function pt(o, n) {
   const d = U(o, n?.in);
   return d.setDate(1), d.setHours(0, 0, 0, 0), d;
 }
-function pt(o, n) {
+function gt(o, n) {
   const d = U(o, n?.in), b = d.getFullYear(), g = te(), v = n?.firstWeekContainsDate ?? n?.locale?.options?.firstWeekContainsDate ?? g.firstWeekContainsDate ?? g.locale?.options?.firstWeekContainsDate ?? 1, $ = F(n?.in || o, 0);
   $.setFullYear(b + 1, 0, v), $.setHours(0, 0, 0, 0);
   const O = z($, n), A = F(n?.in || o, 0);
@@ -80,18 +81,18 @@ function pt(o, n) {
   const M = z(A, n);
   return +d >= +O ? b + 1 : +d >= +M ? b : b - 1;
 }
-function gt(o, n) {
-  const d = te(), b = n?.firstWeekContainsDate ?? n?.locale?.options?.firstWeekContainsDate ?? d.firstWeekContainsDate ?? d.locale?.options?.firstWeekContainsDate ?? 1, g = pt(o, n), v = F(n?.in || o, 0);
+function mt(o, n) {
+  const d = te(), b = n?.firstWeekContainsDate ?? n?.locale?.options?.firstWeekContainsDate ?? d.firstWeekContainsDate ?? d.locale?.options?.firstWeekContainsDate ?? 1, g = gt(o, n), v = F(n?.in || o, 0);
   return v.setFullYear(g, 0, b), v.setHours(0, 0, 0, 0), z(v, n);
 }
 function ee(o, n) {
-  const d = U(o, n?.in), b = +z(d, n) - +gt(d, n);
-  return Math.round(b / lt) + 1;
+  const d = U(o, n?.in), b = +z(d, n) - +mt(d, n);
+  return Math.round(b / ot) + 1;
 }
-const mt = Le`*,:before,:after{box-sizing:border-box}:host{display:block;width:max-content;--sbb-calendar-cell-size: 2.5rem;--sbb-calendar-hover-shift: .0625rem;--sbb-calendar-wide-cell-size: 4.375rem;--sbb-calendar-header-color: var(--sbb-color-granite);--sbb-calendar-header-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));--sbb-calendar-cell-background-color: transparent;--sbb-calendar-cell-padding: .125rem;--sbb-calendar-cell-color: var(--sbb-color-2);--sbb-calendar-cell-selected-color: var(--sbb-color-1-inverted);--sbb-calendar-cell-selected-background-color: var(--sbb-background-color-2-inverted);--sbb-calendar-cell-disabled-height: .09375rem;--sbb-calendar-cell-disabled-width: 1.59375rem;--sbb-calendar-cell-disabled-color: var(--sbb-color-granite);--sbb-calendar-cell-disabled-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));--sbb-calendar-cell-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-calendar-cell-transition-easing-function: var(--sbb-animation-easing);--sbb-calendar-tables-gap: var(--sbb-spacing-fixed-10x);--sbb-calendar-table-animation-shift: .00625rem;--sbb-calendar-table-animation-duration: .1ms;--sbb-calendar-table-column-spaces: 12;--sbb-calendar-control-view-change-height: 2.75rem;--sbb-calendar-control-view-change-color: var(--sbb-color-3);--sbb-calendar-control-view-change-background: var(--sbb-background-color-1)}@media(min-width:22.5rem){:host{--sbb-calendar-cell-size: 2.75rem;--sbb-calendar-wide-cell-size: 4.8125rem;--sbb-calendar-control-view-change-height: 3rem}}.sbb-calendar__wrapper{width:100%;display:block;transition-duration:var(--sbb-calendar-cell-transition-duration)}.sbb-calendar__controls{width:100%;display:inline-flex;align-items:center;gap:var(--sbb-spacing-fixed-2x);margin-block-end:var(--sbb-spacing-fixed-4x)}.sbb-calendar__controls-month{width:100%;display:flex;gap:var(--sbb-calendar-tables-gap)}#sbb-calendar__controls-previous,#sbb-calendar__controls-next{-webkit-tap-highlight-color:transparent}.sbb-calendar__controls-change-date{-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;outline:none;border:none;border-radius:0;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;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);display:flex;align-items:center;margin:auto;height:var(--sbb-calendar-control-view-change-height);text-transform:capitalize;cursor:pointer;padding-inline:var(--sbb-spacing-fixed-5x) var(--sbb-spacing-fixed-2x);border-radius:var(--sbb-border-radius-infinity);background-color:var(--sbb-calendar-control-view-change-background);color:var(--sbb-calendar-control-view-change-color);transition-duration:var(--sbb-calendar-cell-transition-duration);transition-timing-function:var(--sbb-calendar-cell-transition-easing-function);transition-property:background-color,padding-block-end}.sbb-calendar__controls-change-date:disabled{--sbb-calendar-control-view-change-background: var(--sbb-color-milk);--sbb-calendar-control-view-change-background: light-dark( var(--sbb-color-milk), var(--sbb-color-anthracite) );--sbb-calendar-control-view-change-color: var(--sbb-color-granite);--sbb-calendar-control-view-change-color: light-dark( var(--sbb-color-granite), var(--sbb-color-aluminium) );cursor:unset}.sbb-calendar__controls-change-date:focus-visible{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);outline-offset:var(--sbb-spacing-fixed-1x)}@media(any-hover:hover){.sbb-calendar__controls-change-date:not(:active,:disabled):hover{padding-block-end:var(--sbb-calendar-hover-shift)}}.sbb-calendar__controls-change-date:not(:disabled):active{--sbb-calendar-control-view-change-background: var(--sbb-background-color-3)}.sbb-calendar__table-month-view,.sbb-calendar__table-year-view{--sbb-calendar-table-column-spaces: 6}.sbb-calendar__table-container{display:flex;gap:var(--sbb-calendar-tables-gap);margin-inline:var(--sbb-calendar-margin);--sbb-calendar-min-width: calc(7 * var(--sbb-calendar-cell-size));--sbb-calendar-overflow: calc(100% - var(--sbb-calendar-min-width));--sbb-calendar-start-offset: min( 0px, -1 * (var(--sbb-calendar-overflow) / var(--sbb-calendar-table-column-spaces)) );--sbb-calendar-margin: var(--sbb-calendar-start-offset)}:host([data-wide]) .sbb-calendar__table-container{--sbb-calendar-min-width: calc( 2 * 7 * var(--sbb-calendar-cell-size) + var(--sbb-calendar-tables-gap) );--sbb-calendar-margin: calc(.5 * var(--sbb-calendar-start-offset))}:host([orientation=horizontal][week-numbers]) .sbb-calendar__table-container{--sbb-calendar-min-width: calc(8 * var(--sbb-calendar-cell-size))}:host([orientation=horizontal][week-numbers][data-wide]) .sbb-calendar__table-container{--sbb-calendar-min-width: calc( 2 * 8 * var(--sbb-calendar-cell-size) + var(--sbb-calendar-tables-gap) )}:host([orientation=vertical]) .sbb-calendar__table-container{min-width:var(--sbb-calendar-min-width);--sbb-calendar-start-offset: 0}:host([orientation=vertical][data-wide]) .sbb-calendar__table-container{--sbb-calendar-min-width: calc( 13 * var(--sbb-calendar-cell-size) + var(--sbb-calendar-tables-gap) )}.sbb-calendar__table{width:100%;border-collapse:collapse;height:max-content;animation-name:show;animation-duration:var(--sbb-calendar-table-animation-duration)}.sbb-calendar__table.sbb-calendar__table-hide{--sbb-calendar-cell-transition-duration: 0ms;animation-name:hide;animation-duration:var(--sbb-calendar-table-animation-duration)}:host(:not([data-wide])) .sbb-calendar__table{min-width:100%}.sbb-calendar__table-header,.sbb-calendar__table-body{text-align:center}.sbb-calendar__table-header-cell{--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;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);width:var(--sbb-calendar-cell-size);color:var(--sbb-calendar-header-color);padding:0}:host(:not([multiple])) .sbb-calendar__table-header-cell{height:var(--sbb-calendar-cell-size)}.sbb-calendar__table-data{position:relative;padding:0;text-align:center}.sbb-calendar__header-cell,.sbb-calendar__cell{-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;margin:0;outline:none;border:none;border-radius:0;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;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);height:var(--sbb-calendar-cell-size);color:var(--sbb-calendar-cell-color);cursor:pointer;position:relative;z-index:0}.sbb-calendar__header-cell:before,.sbb-calendar__cell:before{content:"";position:absolute;inset:var(--sbb-calendar-cell-padding);background-color:var(--sbb-calendar-cell-background-color);border-radius:50%;z-index:-1;transition-duration:var(--sbb-calendar-cell-transition-duration);transition-timing-function:var(--sbb-calendar-cell-transition-easing-function);transition-property:background-color}@media(any-hover:hover){.sbb-calendar__header-cell:not(.sbb-calendar__selected,:active,:disabled):hover,.sbb-calendar__cell:not(.sbb-calendar__selected,:active,:disabled):hover{--sbb-calendar-cell-background-color: var(--sbb-background-color-3);padding-block-end:var(--sbb-calendar-hover-shift)}}@media(any-hover:hover)and (forced-colors:active){.sbb-calendar__header-cell:not(.sbb-calendar__selected,:active,:disabled):hover:before,.sbb-calendar__cell:not(.sbb-calendar__selected,:active,:disabled):hover:before{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-focus-outline-style: initial}}.sbb-calendar__header-cell:disabled,.sbb-calendar__cell:disabled{--sbb-calendar-cell-color: var(--sbb-calendar-cell-disabled-color);cursor:unset}.sbb-calendar__header-cell:focus-visible:before,.sbb-calendar__cell:focus-visible:before{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-calendar__header-cell:not(.sbb-calendar__selected,:disabled):active,.sbb-calendar__cell:not(.sbb-calendar__selected,:disabled):active{--sbb-calendar-cell-background-color: var(--sbb-background-color-4)}@media(forced-colors:active){.sbb-calendar__header-cell:not(.sbb-calendar__selected,:disabled):active:before,.sbb-calendar__cell:not(.sbb-calendar__selected,:disabled):active:before{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-focus-outline-style: initial}}.sbb-calendar__header-cell{--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;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);color:var(--sbb-calendar-header-color)}.sbb-calendar__weekday,.sbb-calendar__day{border-radius:50%;width:var(--sbb-calendar-cell-size)}.sbb-calendar__weekday:before,.sbb-calendar__day:before{border-radius:50%}.sbb-calendar__pill{width:var(--sbb-calendar-wide-cell-size);border-radius:var(--sbb-border-radius-infinity)}.sbb-calendar__pill:before{border-radius:var(--sbb-border-radius-infinity)}.sbb-calendar__crossed-out:after{content:"";height:var(--sbb-calendar-cell-disabled-height);width:var(--sbb-calendar-cell-disabled-width);position:absolute;background-color:var(--sbb-calendar-cell-disabled-color);top:50%;left:50%;transform:translate(-50%,-50%) rotate(-45deg)}.sbb-calendar__cell-current{--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;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);font-weight:700}.sbb-calendar__selected{--sbb-calendar-cell-color: var(--sbb-calendar-cell-selected-color);--sbb-calendar-cell-background-color: var(--sbb-calendar-cell-selected-background-color)}@media(forced-colors:active){.sbb-calendar__selected{--sbb-calendar-cell-background-color: ButtonText !important}}@keyframes show{0%{opacity:0;transform:translateY(var(--sbb-calendar-table-animation-shift))}to{opacity:1;transform:translateY(0)}}@keyframes hide{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(var(--sbb-calendar-table-animation-shift))}}`;
-let Ct = (() => {
+const wt = Le`:host{display:block;width:max-content;--sbb-calendar-cell-size: 2.5rem;--sbb-calendar-hover-shift: .0625rem;--sbb-calendar-wide-cell-size: 4.375rem;--sbb-calendar-header-color: var(--sbb-color-granite);--sbb-calendar-header-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));--sbb-calendar-cell-background-color: transparent;--sbb-calendar-cell-padding: .125rem;--sbb-calendar-cell-color: var(--sbb-color-2);--sbb-calendar-cell-selected-color: var(--sbb-color-1-inverted);--sbb-calendar-cell-selected-background-color: var(--sbb-background-color-2-inverted);--sbb-calendar-cell-disabled-height: .09375rem;--sbb-calendar-cell-disabled-width: 1.59375rem;--sbb-calendar-cell-disabled-color: var(--sbb-color-granite);--sbb-calendar-cell-disabled-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));--sbb-calendar-cell-transition-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-2x) );--sbb-calendar-cell-transition-easing-function: var(--sbb-animation-easing);--sbb-calendar-tables-gap: var(--sbb-spacing-fixed-10x);--sbb-calendar-table-animation-shift: .00625rem;--sbb-calendar-table-animation-duration: .1ms;--sbb-calendar-table-column-spaces: 12;--sbb-calendar-control-view-change-height: 2.75rem;--sbb-calendar-control-view-change-color: var(--sbb-color-3);--sbb-calendar-control-view-change-background: var(--sbb-background-color-1)}@media(min-width:37.5rem){:host{--sbb-calendar-cell-size: 2.75rem;--sbb-calendar-wide-cell-size: 4.8125rem;--sbb-calendar-control-view-change-height: 3rem}}.sbb-calendar__wrapper{width:100%;display:block;transition-duration:var(--sbb-calendar-cell-transition-duration)}.sbb-calendar__controls{width:100%;display:inline-flex;align-items:center;gap:var(--sbb-spacing-fixed-2x);margin-block-end:var(--sbb-spacing-fixed-4x)}.sbb-calendar__controls-month{width:100%;display:flex;gap:var(--sbb-calendar-tables-gap)}#sbb-calendar__controls-previous,#sbb-calendar__controls-next{-webkit-tap-highlight-color:transparent}.sbb-calendar__controls-change-date{-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;outline:none;border:none;border-radius:0;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;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);display:flex;align-items:center;margin:auto;height:var(--sbb-calendar-control-view-change-height);text-transform:capitalize;cursor:var(--sbb-cursor-pointer);padding-inline:var(--sbb-spacing-fixed-5x) var(--sbb-spacing-fixed-2x);border-radius:var(--sbb-border-radius-infinity);background-color:var(--sbb-calendar-control-view-change-background);color:var(--sbb-calendar-control-view-change-color);transition-duration:var(--sbb-calendar-cell-transition-duration);transition-timing-function:var(--sbb-calendar-cell-transition-easing-function);transition-property:background-color,padding-block-end}.sbb-calendar__controls-change-date:disabled{--sbb-calendar-control-view-change-background: var(--sbb-color-milk);--sbb-calendar-control-view-change-background: light-dark( var(--sbb-color-milk), var(--sbb-color-anthracite) );--sbb-calendar-control-view-change-color: var(--sbb-color-granite);--sbb-calendar-control-view-change-color: light-dark( var(--sbb-color-granite), var(--sbb-color-aluminium) );cursor:unset}.sbb-calendar__controls-change-date:focus-visible{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style, solid) var(--sbb-focus-outline-width);outline-offset:var(--sbb-spacing-fixed-1x)}@media(any-hover:hover){.sbb-calendar__controls-change-date:not(:active,:disabled):hover{padding-block-end:var(--sbb-calendar-hover-shift)}}.sbb-calendar__controls-change-date:not(:disabled):active{--sbb-calendar-control-view-change-background: var(--sbb-background-color-3)}.sbb-calendar__table-month-view,.sbb-calendar__table-year-view{--sbb-calendar-table-column-spaces: 6}.sbb-calendar__table-container{display:flex;gap:var(--sbb-calendar-tables-gap);margin-inline:var(--sbb-calendar-margin);--sbb-calendar-min-width: calc(7 * var(--sbb-calendar-cell-size));--sbb-calendar-overflow: calc(100% - var(--sbb-calendar-min-width));--sbb-calendar-start-offset: min( 0px, -1 * (var(--sbb-calendar-overflow) / var(--sbb-calendar-table-column-spaces)) );--sbb-calendar-margin: var(--sbb-calendar-start-offset)}:host([data-wide]) .sbb-calendar__table-container{--sbb-calendar-min-width: calc( 2 * 7 * var(--sbb-calendar-cell-size) + var(--sbb-calendar-tables-gap) );--sbb-calendar-margin: calc(.5 * var(--sbb-calendar-start-offset))}:host([orientation=horizontal][week-numbers]) .sbb-calendar__table-container{--sbb-calendar-min-width: calc(8 * var(--sbb-calendar-cell-size))}:host([orientation=horizontal][week-numbers][data-wide]) .sbb-calendar__table-container{--sbb-calendar-min-width: calc( 2 * 8 * var(--sbb-calendar-cell-size) + var(--sbb-calendar-tables-gap) )}:host([orientation=vertical]) .sbb-calendar__table-container{min-width:var(--sbb-calendar-min-width);--sbb-calendar-start-offset: 0}:host([orientation=vertical][data-wide]) .sbb-calendar__table-container{--sbb-calendar-min-width: calc( 13 * var(--sbb-calendar-cell-size) + var(--sbb-calendar-tables-gap) )}.sbb-calendar__table{width:100%;border-collapse:collapse;height:max-content;animation-name:show;animation-duration:var(--sbb-calendar-table-animation-duration)}.sbb-calendar__table.sbb-calendar__table-hide{--sbb-calendar-cell-transition-duration: 0ms;animation-name:hide;animation-duration:var(--sbb-calendar-table-animation-duration)}:host(:not([data-wide])) .sbb-calendar__table{min-width:100%}.sbb-calendar__table-header,.sbb-calendar__table-body{text-align:center}.sbb-calendar__table-header-cell{--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;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);width:var(--sbb-calendar-cell-size);color:var(--sbb-calendar-header-color);padding:0}:host(:not([multiple])) .sbb-calendar__table-header-cell{height:var(--sbb-calendar-cell-size)}.sbb-calendar__table-data{position:relative;padding:0;text-align:center}.sbb-calendar__header-cell,.sbb-calendar__cell{-webkit-appearance:none;-moz-appearance:none;box-sizing:border-box;margin:0;outline:none;border:none;border-radius:0;padding:0;background:none;-webkit-tap-highlight-color:transparent;color:inherit;--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;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);height:var(--sbb-calendar-cell-size);color:var(--sbb-calendar-cell-color);cursor:var(--sbb-cursor-pointer);position:relative;z-index:0}.sbb-calendar__header-cell:before,.sbb-calendar__cell:before{content:"";position:absolute;inset:var(--sbb-calendar-cell-padding);background-color:var(--sbb-calendar-cell-background-color);border-radius:50%;z-index:-1;transition-duration:var(--sbb-calendar-cell-transition-duration);transition-timing-function:var(--sbb-calendar-cell-transition-easing-function);transition-property:background-color}@media(any-hover:hover){.sbb-calendar__header-cell:not(.sbb-calendar__selected,:active,:disabled):hover,.sbb-calendar__cell:not(.sbb-calendar__selected,:active,:disabled):hover{--sbb-calendar-cell-background-color: var(--sbb-background-color-3);padding-block-end:var(--sbb-calendar-hover-shift)}}@media(any-hover:hover)and (forced-colors:active){.sbb-calendar__header-cell:not(.sbb-calendar__selected,:active,:disabled):hover:before,.sbb-calendar__cell:not(.sbb-calendar__selected,:active,:disabled):hover:before{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-focus-outline-style: initial}}.sbb-calendar__header-cell:disabled,.sbb-calendar__cell:disabled{--sbb-calendar-cell-color: var(--sbb-calendar-cell-disabled-color);cursor:unset}.sbb-calendar__header-cell:focus-visible:before,.sbb-calendar__cell:focus-visible:before{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-calendar__header-cell:not(.sbb-calendar__selected,:disabled):active,.sbb-calendar__cell:not(.sbb-calendar__selected,:disabled):active{--sbb-calendar-cell-background-color: var(--sbb-background-color-4)}@media(forced-colors:active){.sbb-calendar__header-cell:not(.sbb-calendar__selected,:disabled):active:before,.sbb-calendar__cell:not(.sbb-calendar__selected,:disabled):active:before{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-focus-outline-style: initial}}.sbb-calendar__header-cell{--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;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);color:var(--sbb-calendar-header-color)}.sbb-calendar__weekday,.sbb-calendar__day{border-radius:50%;width:var(--sbb-calendar-cell-size)}.sbb-calendar__weekday:before,.sbb-calendar__day:before{border-radius:50%}.sbb-calendar__pill{width:var(--sbb-calendar-wide-cell-size);border-radius:var(--sbb-border-radius-infinity)}.sbb-calendar__pill:before{border-radius:var(--sbb-border-radius-infinity)}.sbb-calendar__crossed-out:after{content:"";height:var(--sbb-calendar-cell-disabled-height);width:var(--sbb-calendar-cell-disabled-width);position:absolute;background-color:var(--sbb-calendar-cell-disabled-color);top:50%;left:50%;transform:translate(-50%,-50%) rotate(-45deg)}.sbb-calendar__cell-current{--sbb-text-font-size: var(--sbb-font-size-text-s);font-family:var(--sbb-typo-font-family);font-weight:400;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);font-weight:700}.sbb-calendar__selected{--sbb-calendar-cell-color: var(--sbb-calendar-cell-selected-color);--sbb-calendar-cell-background-color: var(--sbb-calendar-cell-selected-background-color)}@media(forced-colors:active){.sbb-calendar__selected{--sbb-calendar-cell-background-color: ButtonText !important}}@keyframes show{0%{opacity:0;transform:translateY(var(--sbb-calendar-table-animation-shift))}to{opacity:1;transform:translateY(0)}}@keyframes hide{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(var(--sbb-calendar-table-animation-shift))}}`;
+let Rt = (() => {
   var N, C, I, R, S, T, E, P, L, B, H, q, p;
-  let o = [He("sbb-calendar")], n, d = [], b, g = nt(Be), v = [], $, O = [], A = [], M, W = [], ae = [], se, ie = [], re = [], ne, le = [], oe = [], de, ce = [], he = [], be, _e, ue = [], fe = [], pe, ge = [], me = [], we, ve = [], ye = [], De, Ae = [], ke = [], xe, $e = [], Ve = [], Me, Ye, ze = [], Fe = [], Oe, We = [], Ne = [];
+  let o = [He("sbb-calendar")], n, d = [], b, g = nt(Be), v = [], $, O = [], A = [], M, W = [], ae = [], se, re = [], ie = [], ne, le = [], oe = [], de, ce = [], he = [], be, _e, ue = [], fe = [], pe, ge = [], me = [], we, ve = [], ye = [], De, Ae = [], ke = [], xe, $e = [], Ve = [], Me, Ye, ze = [], Fe = [], Oe, We = [], Ne = [];
   return p = class extends g {
     constructor() {
       super();
@@ -107,7 +108,7 @@ let Ct = (() => {
       x(this, B);
       x(this, H);
       x(this, q);
-      f(this, N, (u(this, v), u(this, O, !1))), f(this, C, (u(this, A), u(this, W, "day"))), f(this, I, (u(this, ae), u(this, ie, null))), f(this, R, (u(this, re), u(this, le, null))), f(this, S, (u(this, oe), u(this, ce, !1))), f(this, T, (u(this, he), u(this, ue, null))), f(this, E, (u(this, fe), u(this, ge, null))), f(this, P, (u(this, me), u(this, ve, "horizontal"))), f(this, L, (u(this, ye), u(this, Ae, !1))), this._dateAdapter = (u(this, ke), Ue().datetime?.dateAdapter ?? Qe), f(this, B, u(this, $e, this._dateAdapter.today())), f(this, H, (u(this, Ve), u(this, ze, "day"))), this._nextCalendarView = (u(this, Fe), "day"), this._keyboardNavigationDayViewParameters = {
+      f(this, N, (u(this, v), u(this, O, !1))), f(this, C, (u(this, A), u(this, W, "day"))), f(this, I, (u(this, ae), u(this, re, null))), f(this, R, (u(this, ie), u(this, le, null))), f(this, S, (u(this, oe), u(this, ce, !1))), f(this, T, (u(this, he), u(this, ue, null))), f(this, E, (u(this, fe), u(this, ge, null))), f(this, P, (u(this, me), u(this, ve, "horizontal"))), f(this, L, (u(this, ye), u(this, Ae, !1))), this._dateAdapter = (u(this, ke), Ue().datetime?.dateAdapter ?? Qe), f(this, B, u(this, $e, this._dateAdapter.today())), f(this, H, (u(this, Ve), u(this, ze, "day"))), this._nextCalendarView = (u(this, Fe), "day"), this._keyboardNavigationDayViewParameters = {
         firstDayInView: null,
         lastDayInView: null,
         firstMonthOffset: 0,
@@ -279,8 +280,8 @@ let Ct = (() => {
     }
     /** Creates the array of weekdays. */
     _setWeekdays() {
-      const e = this._dateAdapter.getDayOfWeekNames("narrow"), a = this._dateAdapter.getDayOfWeekNames("long").map((i, l) => ({
-        long: i,
+      const e = this._dateAdapter.getDayOfWeekNames("narrow"), a = this._dateAdapter.getDayOfWeekNames("long").map((r, l) => ({
+        long: r,
         narrow: e[l]
       })), s = this._dateAdapter.getFirstDayOfWeek();
       this._weekdays = a.slice(s).concat(a.slice(0, s));
@@ -297,12 +298,12 @@ let Ct = (() => {
      * Then, this array is mapped via the `getWeek` function, which returns the ISO week number for that date.
      */
     _createWeekNumbers(e) {
-      return ut({ start: ft(e), end: bt(e) }, { weekStartsOn: 1 }).map((t) => ee(t, { weekStartsOn: 1, firstWeekContainsDate: 4 }));
+      return ft({ start: pt(e), end: _t(e) }, { weekStartsOn: 1 }).map((t) => ee(t, { weekStartsOn: 1, firstWeekContainsDate: 4 }));
     }
     /** Creates the rows along the horizontal direction and sets the parameters used in keyboard navigation. */
     _createWeekRows(e, t = !1) {
-      const a = this._dateAdapter.getDateNames(), s = this._dateAdapter.getNumDaysInMonth(e), i = this._dateAdapter.getFirstWeekOffset(e);
-      return t ? (this._keyboardNavigationDayViewParameters.secondMonthOffset = i, this._keyboardNavigationDayViewParameters.lastDayInView = this._dateAdapter.toIso8601(this._dateAdapter.createDate(this._dateAdapter.getYear(e), this._dateAdapter.getMonth(e), s))) : (this._keyboardNavigationDayViewParameters.firstMonthLength = s, this._keyboardNavigationDayViewParameters.firstMonthOffset = i, this._keyboardNavigationDayViewParameters.firstDayInView = this._dateAdapter.toIso8601(this._dateAdapter.createDate(this._dateAdapter.getYear(e), this._dateAdapter.getMonth(e), 1)), this._keyboardNavigationDayViewParameters.lastDayInView = this._dateAdapter.toIso8601(this._dateAdapter.createDate(this._dateAdapter.getYear(e), this._dateAdapter.getMonth(e), s))), this.orientation === "horizontal" ? this._createWeekRowsHorizontal(e, a, s, i) : this._createWeekRowsVertical(e, a, s, i);
+      const a = this._dateAdapter.getDateNames(), s = this._dateAdapter.getNumDaysInMonth(e), r = this._dateAdapter.getFirstWeekOffset(e);
+      return t ? (this._keyboardNavigationDayViewParameters.secondMonthOffset = r, this._keyboardNavigationDayViewParameters.lastDayInView = this._dateAdapter.toIso8601(this._dateAdapter.createDate(this._dateAdapter.getYear(e), this._dateAdapter.getMonth(e), s))) : (this._keyboardNavigationDayViewParameters.firstMonthLength = s, this._keyboardNavigationDayViewParameters.firstMonthOffset = r, this._keyboardNavigationDayViewParameters.firstDayInView = this._dateAdapter.toIso8601(this._dateAdapter.createDate(this._dateAdapter.getYear(e), this._dateAdapter.getMonth(e), 1)), this._keyboardNavigationDayViewParameters.lastDayInView = this._dateAdapter.toIso8601(this._dateAdapter.createDate(this._dateAdapter.getYear(e), this._dateAdapter.getMonth(e), s))), this.orientation === "horizontal" ? this._createWeekRowsHorizontal(e, a, s, r) : this._createWeekRowsVertical(e, a, s, r);
     }
     /**
      * Creates the rows for each week in orientation='horizontal'.
@@ -313,11 +314,11 @@ let Ct = (() => {
      * The result is a matrix in which every row is a week (or part of it, considering offset).
      */
     _createWeekRowsHorizontal(e, t, a, s) {
-      const i = [[]];
-      for (let l = 0, r = s; l < a; l++, r++) {
-        r === D && (i.push([]), r = 0);
+      const r = [[]];
+      for (let l = 0, i = s; l < a; l++, i++) {
+        i === D && (r.push([]), i = 0);
         const c = this._dateAdapter.createDate(this._dateAdapter.getYear(e), this._dateAdapter.getMonth(e), l + 1), _ = this._dateAdapter.toIso8601(c);
-        i[i.length - 1].push({
+        r[r.length - 1].push({
           value: _,
           dateValue: c,
           dayValue: t[l],
@@ -327,7 +328,7 @@ let Ct = (() => {
           weekDayValue: this._dateAdapter.getDayOfWeek(c)
         });
       }
-      return i;
+      return r;
     }
     /**
      * Creates the rows for each week in orientation='vertical'.
@@ -344,11 +345,11 @@ let Ct = (() => {
      * - row 7: all the Sundays.
      */
     _createWeekRowsVertical(e, t, a, s) {
-      const i = Array.from({ length: D }, () => []);
-      for (let l = 0, r = s; l < a; l++, r++) {
-        r === D && (r = 0);
+      const r = Array.from({ length: D }, () => []);
+      for (let l = 0, i = s; l < a; l++, i++) {
+        i === D && (i = 0);
         const c = this._dateAdapter.createDate(this._dateAdapter.getYear(e), this._dateAdapter.getMonth(e), l + 1), _ = this._dateAdapter.toIso8601(c);
-        i[r].push({
+        r[i].push({
           value: _,
           dateValue: c,
           dayValue: t[l],
@@ -358,25 +359,25 @@ let Ct = (() => {
           weekDayValue: this._dateAdapter.getDayOfWeek(c)
         });
       }
-      return i;
+      return r;
     }
     /** Creates the rows for the month selection view. */
     _createMonthRows() {
-      const e = this._dateAdapter.getMonthNames("short"), t = new Array(12).fill(null).map((i, l) => ({
+      const e = this._dateAdapter.getMonthNames("short"), t = new Array(12).fill(null).map((r, l) => ({
         value: e[l],
         longValue: this._monthNames[l],
         monthValue: l + 1
       })), a = 12 / J, s = [];
-      for (let i = 0; i < a; i++)
-        s.push(t.slice(J * i, J * (i + 1)));
+      for (let r = 0; r < a; r++)
+        s.push(t.slice(J * r, J * (r + 1)));
       this._months = s;
     }
     /** Creates the rows for the year selection view. */
     _createYearRows(e = 0) {
-      const t = this._getStartValueYearView(), a = new Array(V).fill(0).map((l, r) => t + e + r), s = V / X, i = [];
+      const t = this._getStartValueYearView(), a = new Array(V).fill(0).map((l, i) => t + e + i), s = V / X, r = [];
       for (let l = 0; l < s; l++)
-        i.push(a.slice(X * l, X * (l + 1)));
-      return i;
+        r.push(a.slice(X * l, X * (l + 1)));
+      return r;
     }
     /**
      * Calculates the first year that will be shown in the year selection panel.
@@ -455,8 +456,8 @@ let Ct = (() => {
      *     - if not, the selected dates are the new ones.
      */
     _selectMultipleDates(e) {
-      const t = this._cells.filter((r) => !r.disabled).map((r) => r.value), a = e.map((r) => r.value).filter((r) => t.includes(r)), s = new Set(a), i = new Set(this._selected.map((r) => this._dateAdapter.toIso8601(r))), l = this._updateSelectedWithMultipleDates(a, s, i);
-      this._selected = l.map((r) => this._dateAdapter.deserialize(r)), this._emitDateSelectedEvent(this._selected.map((r) => this._dateAdapter.deserialize(r)));
+      const t = this._cells.filter((i) => !i.disabled).map((i) => i.value), a = e.map((i) => i.value).filter((i) => t.includes(i)), s = new Set(a), r = new Set(this._selected.map((i) => this._dateAdapter.toIso8601(i))), l = this._updateSelectedWithMultipleDates(a, s, r);
+      this._selected = l.map((i) => this._dateAdapter.deserialize(i)), this._emitDateSelectedEvent(this._selected.map((i) => this._dateAdapter.deserialize(i)));
     }
     /**
      * Emits the dateselected event given the detail (as T or T[] based on the value of the multiple flag).
@@ -572,43 +573,43 @@ let Ct = (() => {
     }
     _handleKeyboardEvent(e, t) {
       Ke(e) && e.preventDefault();
-      const a = this._cells, s = a.findIndex((r) => r === e.target);
-      let i;
-      t ? i = this._navigateByKeyboardDayView(e, s, a, t) : i = this._navigateByKeyboard(e, s, a);
+      const a = this._cells, s = a.findIndex((i) => i === e.target);
+      let r;
+      t ? r = this._navigateByKeyboardDayView(e, s, a, t) : r = this._navigateByKeyboard(e, s, a);
       const l = this.shadowRoot.activeElement;
-      i !== l && (i.tabIndex = 0, i?.focus(), l.tabIndex = -1);
+      r !== l && (r.tabIndex = 0, r?.focus(), l.tabIndex = -1);
     }
     _navigateByKeyboardDayView(e, t, a, s) {
-      const i = this.orientation === "horizontal" ? { leftRight: 1, upDown: D } : { leftRight: D, upDown: 1 }, l = t < this._keyboardNavigationDayViewParameters.firstMonthLength ? this._keyboardNavigationDayViewParameters.firstMonthOffset : this._keyboardNavigationDayViewParameters.secondMonthOffset;
+      const r = this.orientation === "horizontal" ? { leftRight: 1, upDown: D } : { leftRight: D, upDown: 1 }, l = t < this._keyboardNavigationDayViewParameters.firstMonthLength ? this._keyboardNavigationDayViewParameters.firstMonthOffset : this._keyboardNavigationDayViewParameters.secondMonthOffset;
       switch (e.key) {
         case "ArrowUp":
-          return this._findDayArrows(a, t, s.dateValue, -i.upDown);
+          return this._findDayArrows(a, t, s.dateValue, -r.upDown);
         case "ArrowDown":
-          return this._findDayArrows(a, t, s.dateValue, i.upDown);
+          return this._findDayArrows(a, t, s.dateValue, r.upDown);
         case "ArrowLeft":
-          return this._findDayArrows(a, t, s.dateValue, -i.leftRight);
+          return this._findDayArrows(a, t, s.dateValue, -r.leftRight);
         case "ArrowRight":
-          return this._findDayArrows(a, t, s.dateValue, i.leftRight);
+          return this._findDayArrows(a, t, s.dateValue, r.leftRight);
         case "PageUp":
           if (this.orientation === "horizontal") {
             const c = (+s.dayValue % D || D) - +s.dayValue;
-            return this._findDayPageUpDown(a, t, s, c, i.upDown);
+            return this._findDayPageUpDown(a, t, s, c, r.upDown);
           } else {
             const _ = (Math.ceil((+s.dayValue + l) / D) - 1) * D - l + 1 - +s.dayValue;
-            return this._findDayPageUpDown(a, t, s, _, i.upDown);
+            return this._findDayPageUpDown(a, t, s, _, r.upDown);
           }
         case "PageDown":
           if (this.orientation === "horizontal") {
-            const r = +s.monthValue + 1 > 12 ? 1 : +s.monthValue + 1, c = +s.monthValue + 1 > 12 ? +s.yearValue + 1 : +s.yearValue, _ = this._dateAdapter.createDate(c, r, 1), w = this._dateAdapter.getDate(this._dateAdapter.addCalendarDays(_, -1)), j = Math.trunc((w - +s.dayValue) / D) * D;
-            return this._findDayPageUpDown(a, t, s, j, -i.upDown);
+            const i = +s.monthValue + 1 > 12 ? 1 : +s.monthValue + 1, c = +s.monthValue + 1 > 12 ? +s.yearValue + 1 : +s.yearValue, _ = this._dateAdapter.createDate(c, i, 1), w = this._dateAdapter.getDate(this._dateAdapter.addCalendarDays(_, -1)), j = Math.trunc((w - +s.dayValue) / D) * D;
+            return this._findDayPageUpDown(a, t, s, j, -r.upDown);
           } else {
             const _ = Math.ceil((+s.dayValue + l) / D) * D - l - +s.dayValue;
-            return this._findDayPageUpDown(a, t, s, _, -i.upDown);
+            return this._findDayPageUpDown(a, t, s, _, -r.upDown);
           }
         case "Home":
           return this._findDayFirst(a, t, s, 1);
         case "End": {
-          const r = +s.monthValue + 1 > 12 ? 1 : +s.monthValue + 1, c = +s.monthValue + 1 > 12 ? +s.yearValue + 1 : +s.yearValue, _ = this._dateAdapter.createDate(c, r, 1);
+          const i = +s.monthValue + 1 > 12 ? 1 : +s.monthValue + 1, c = +s.monthValue + 1 > 12 ? +s.yearValue + 1 : +s.yearValue, _ = this._dateAdapter.createDate(c, i, 1);
           return this._findDayLast(a, t, _);
         }
         default:
@@ -619,32 +620,32 @@ let Ct = (() => {
       return e < this._keyboardNavigationDayViewParameters.firstDayInView || e > this._keyboardNavigationDayViewParameters.lastDayInView;
     }
     _findDayArrows(e, t, a, s) {
-      const i = this._dateAdapter.toIso8601(this._dateAdapter.addCalendarDays(a, s));
-      if (this._isDayOutOfView(i))
+      const r = this._dateAdapter.toIso8601(this._dateAdapter.addCalendarDays(a, s));
+      if (this._isDayOutOfView(r))
         return e[t];
-      const l = e.find((r) => r.value === i);
-      return !l || l.disabled ? this._findDayArrows(e, t, this._dateAdapter.deserialize(i), s) : l;
+      const l = e.find((i) => i.value === r);
+      return !l || l.disabled ? this._findDayArrows(e, t, this._dateAdapter.deserialize(r), s) : l;
     }
-    _findDayPageUpDown(e, t, a, s, i) {
+    _findDayPageUpDown(e, t, a, s, r) {
       const l = this._dateAdapter.toIso8601(this._dateAdapter.addCalendarDays(a.dateValue, s));
       if (this._isDayOutOfView(l))
         return e[t];
-      const r = e.find((c) => c.value === l);
-      return !r || r.disabled ? this._findDayPageUpDown(e, t, a, s + i, i) : r;
+      const i = e.find((c) => c.value === l);
+      return !i || i.disabled ? this._findDayPageUpDown(e, t, a, s + r, r) : i;
     }
     _findDayFirst(e, t, a, s) {
-      const i = this._dateAdapter.toIso8601(this._dateAdapter.createDate(+a.yearValue, +a.monthValue, s));
-      if (this._isDayOutOfView(i))
+      const r = this._dateAdapter.toIso8601(this._dateAdapter.createDate(+a.yearValue, +a.monthValue, s));
+      if (this._isDayOutOfView(r))
         return e[t];
-      const l = e.find((r) => r.value === i);
+      const l = e.find((i) => i.value === r);
       return !l || l.disabled ? this._findDayFirst(e, t, a, s + 1) : l;
     }
     _findDayLast(e, t, a) {
       const s = this._dateAdapter.toIso8601(this._dateAdapter.addCalendarDays(a, -1));
       if (this._isDayOutOfView(s))
         return e[t];
-      const i = e.find((l) => l.value === s);
-      return !i || i.disabled ? this._findDayLast(e, t, this._dateAdapter.deserialize(s)) : i;
+      const r = e.find((l) => l.value === s);
+      return !r || r.disabled ? this._findDayLast(e, t, this._dateAdapter.deserialize(s)) : r;
     }
     /**
      * Gets the index of the element to move to, based on a list of elements (which can be potentially disabled),
@@ -653,22 +654,22 @@ let Ct = (() => {
      * while in month and year view it's not due to the fixed amount of rendered cells.
      */
     _navigateByKeyboard(e, t, a) {
-      const { elementIndexForWideMode: s, offsetForWideMode: i, lastElementIndexForWideMode: l, verticalOffset: r } = this._calculateParametersForKeyboardNavigation(t, this._calendarView === "year");
+      const { elementIndexForWideMode: s, offsetForWideMode: r, lastElementIndexForWideMode: l, verticalOffset: i } = this._calculateParametersForKeyboardNavigation(t, this._calendarView === "year");
       switch (e.key) {
         case "ArrowUp":
-          return this._findNext(a, t, -r);
+          return this._findNext(a, t, -i);
         case "ArrowDown":
-          return this._findNext(a, t, r);
+          return this._findNext(a, t, i);
         case "ArrowLeft":
           return this._findNext(a, t, -1);
         case "ArrowRight":
           return this._findNext(a, t, 1);
         case "Home":
-          return this._findFirst(a, i);
+          return this._findFirst(a, r);
         case "PageUp":
-          return this._findFirstOnColumn(a, s, i, r);
+          return this._findFirstOnColumn(a, s, r, i);
         case "PageDown":
-          return this._findLastOnColumn(a, t, l, r);
+          return this._findLastOnColumn(a, t, l, i);
         case "End":
           return this._findLast(a, l - 1);
         default:
@@ -681,11 +682,11 @@ let Ct = (() => {
      * @param isYearView Whether the displayed `view` is the year one.
      */
     _calculateParametersForKeyboardNavigation(e, t) {
-      const a = t ? V : Je, s = Math.trunc(e / a) * a, i = s === 0 ? e : e - a;
+      const a = t ? V : Je, s = Math.trunc(e / a) * a, r = s === 0 ? e : e - a;
       return {
         verticalOffset: t ? X : J,
-        elementIndexForWideMode: i,
-        offsetForWideMode: e - i,
+        elementIndexForWideMode: r,
+        offsetForWideMode: e - r,
         lastElementIndexForWideMode: s === 0 ? a : a * 2
       };
     }
@@ -709,13 +710,13 @@ let Ct = (() => {
     }
     /** Find the first enabled element in the same column of the provided array. */
     _findFirstOnColumn(e, t, a, s) {
-      const i = t % s + a;
-      return e[i].disabled ? this._findNext(e, i, s) : e[i];
+      const r = t % s + a;
+      return e[r].disabled ? this._findNext(e, r, s) : e[r];
     }
     /** Find the last enabled element in the same column of the provided array. */
     _findLastOnColumn(e, t, a, s) {
-      const i = t + Math.trunc((a - t - 1) / s) * s;
-      return e[i].disabled ? this._findNext(e, i, -s) : e[i];
+      const r = t + Math.trunc((a - t - 1) / s) * s;
+      return e[r].disabled ? this._findNext(e, r, -s) : e[r];
     }
     _resetCalendarView(e = !1) {
       this._resetFocus = !0, this._activeDate = (this.multiple ? this._selected.at(-1) : this._selected) ?? this._dateAdapter.today(), this._setChosenYear(), this._chosenMonth = void 0, this._nextCalendarView = this._calendarView = this.view, e && this._startTableTransition();
@@ -772,40 +773,40 @@ let Ct = (() => {
     }
     /** Creates the calendar table for the daily view. */
     _createDayTable(e, t, a = !1) {
-      const s = this._dateAdapter.toIso8601(this._dateAdapter.today()), i = (this._wide ? [...this._weeks, ...this._nextMonthWeeks] : a ? this._nextMonthWeeks : this._weeks).flat(), l = (a ? this._nextMonthWeeks : this._weeks).flat();
+      const s = this._dateAdapter.toIso8601(this._dateAdapter.today()), r = (this._wide ? [...this._weeks, ...this._nextMonthWeeks] : a ? this._nextMonthWeeks : this._weeks).flat(), l = (a ? this._nextMonthWeeks : this._weeks).flat();
       return h`
       <table
         class="sbb-calendar__table"
-        @focusout=${(r) => this._handleTableBlur(r.relatedTarget)}
-        @animationend=${(r) => this._tableAnimationEnd(r)}
+        @focusout=${(i) => this._handleTableBlur(i.relatedTarget)}
+        @animationend=${(i) => this._tableAnimationEnd(i)}
       >
         <thead class="sbb-calendar__table-header">
           <tr>
             ${this.weekNumbers ? h`<th class="sbb-calendar__table-header-cell"></th>` : m}
-            ${this._weekdays.map((r, c) => h`
+            ${this._weekdays.map((i, c) => h`
                 <th class="sbb-calendar__table-header-cell">
                   ${this.multiple ? h`
                         <button
                           class="sbb-calendar__header-cell sbb-calendar__weekday"
-                          aria-label=${r.long}
+                          aria-label=${i.long}
                           @click=${() => {
         const _ = l.filter((w) => w.weekDayValue === (c + 1) % 7);
         this._selectMultipleDates(_);
       }}
                         >
-                          ${r.narrow}
+                          ${i.narrow}
                         </button>
                       ` : h`
-                        <sbb-screen-reader-only>${r.long}</sbb-screen-reader-only>
-                        <span aria-hidden="true">${r.narrow}</span>
+                        <sbb-screen-reader-only>${i.long}</sbb-screen-reader-only>
+                        <span aria-hidden="true">${i.narrow}</span>
                       `}
                 </th>
               `)}
           </tr>
         </thead>
         <tbody class="sbb-calendar__table-body">
-          ${e.map((r, c) => {
-        const _ = D - r.length;
+          ${e.map((i, c) => {
+        const _ = D - i.length;
         return c === 0 && _ ? h`
                 <tr>
                   ${this.weekNumbers ? h`
@@ -815,7 +816,7 @@ let Ct = (() => {
                                   class="sbb-calendar__header-cell sbb-calendar__weekday"
                                   aria-label=${`${K[this._language.current]} ${t[0]}`}
                                   @click=${() => {
-          const w = i.filter((j) => j.weekValue === t[0]);
+          const w = r.filter((j) => j.weekValue === t[0]);
           this._selectMultipleDates(w);
         }}
                                 >
@@ -830,7 +831,7 @@ let Ct = (() => {
                         </td>
                       ` : m}
                   ${[...Array(_).keys()].map(() => h`<td class="sbb-calendar__table-data"></td>`)}
-                  ${this._createDayCells(r, s)}
+                  ${this._createDayCells(i, s)}
                 </tr>
               ` : h`
               <tr>
@@ -841,7 +842,7 @@ let Ct = (() => {
                                 class="sbb-calendar__header-cell sbb-calendar__weekday"
                                 aria-label=${`${K[this._language.current]} ${t[c]}`}
                                 @click=${() => {
-          const w = i.filter((j) => j.weekValue === t[c]);
+          const w = r.filter((j) => j.weekValue === t[c]);
           this._selectMultipleDates(w);
         }}
                               >
@@ -855,7 +856,7 @@ let Ct = (() => {
                             `}
                       </td>
                     ` : m}
-                ${this._createDayCells(r, s)}
+                ${this._createDayCells(i, s)}
               </tr>
             `;
       })}
@@ -865,35 +866,35 @@ let Ct = (() => {
     }
     /* Creates the table in orientation='vertical'. */
     _createDayTableVertical(e, t, a) {
-      const s = this._dateAdapter.toIso8601(this._dateAdapter.today()), i = this._dateAdapter.getFirstWeekOffset(a ?? this._activeDate), l = (this._wide ? [...this._weeks, ...this._nextMonthWeeks] : a ? this._nextMonthWeeks : this._weeks).flat();
+      const s = this._dateAdapter.toIso8601(this._dateAdapter.today()), r = this._dateAdapter.getFirstWeekOffset(a ?? this._activeDate), l = (this._wide ? [...this._weeks, ...this._nextMonthWeeks] : a ? this._nextMonthWeeks : this._weeks).flat();
       return h`
       <table
         class="sbb-calendar__table"
-        @focusout=${(r) => this._handleTableBlur(r.relatedTarget)}
-        @animationend=${(r) => this._tableAnimationEnd(r)}
+        @focusout=${(i) => this._handleTableBlur(i.relatedTarget)}
+        @animationend=${(i) => this._tableAnimationEnd(i)}
       >
         ${this.weekNumbers ? h`
               <thead class="sbb-calendar__table-header">
                 <tr>
                   ${a ? m : h`<th class="sbb-calendar__table-data"></th>`}
-                  ${t.map((r) => h`
+                  ${t.map((i) => h`
                       <th class="sbb-calendar__table-header-cell">
                         ${this.multiple ? h`
                               <button
                                 class="sbb-calendar__header-cell sbb-calendar__weekday"
-                                aria-label=${`${K[this._language.current]} ${r}`}
+                                aria-label=${`${K[this._language.current]} ${i}`}
                                 @click=${() => {
-        const c = l.filter((_) => _.weekValue === r);
+        const c = l.filter((_) => _.weekValue === i);
         this._selectMultipleDates(c);
       }}
                               >
-                                ${r}
+                                ${i}
                               </button>
                             ` : h`
                               <sbb-screen-reader-only
-                                >${`${K[this._language.current]} ${r}`}</sbb-screen-reader-only
+                                >${`${K[this._language.current]} ${i}`}</sbb-screen-reader-only
                               >
-                              <span aria-hidden="true">${r}</span>
+                              <span aria-hidden="true">${i}</span>
                             `}
                       </th>
                     `)}
@@ -901,8 +902,8 @@ let Ct = (() => {
               </thead>
             ` : m}
         <tbody class="sbb-calendar__table-body">
-          ${e.map((r, c) => {
-        const _ = this._weekdays[c], w = this._wide ? [...r, ...this._nextMonthWeeks[c]] : r;
+          ${e.map((i, c) => {
+        const _ = this._weekdays[c], w = this._wide ? [...i, ...this._nextMonthWeeks[c]] : i;
         return h`
               <tr>
                 ${a ? m : h`
@@ -921,8 +922,8 @@ let Ct = (() => {
                             `}
                       </td>
                     `}
-                ${c < i ? h`<td class="sbb-calendar__table-data"></td>` : m}
-                ${this._createDayCells(r, s)}
+                ${c < r ? h`<td class="sbb-calendar__table-data"></td>` : m}
+                ${this._createDayCells(i, s)}
               </tr>
             `;
       })}
@@ -933,13 +934,13 @@ let Ct = (() => {
     /** Creates the cells for the daily view. */
     _createDayCells(e, t) {
       return e.map((a) => {
-        const s = !this._isDayInRange(a.value), i = !this._dateFilter(this._dateAdapter.deserialize(a.value)), l = a.value === t;
-        let r;
-        return this.multiple ? r = this._selected.find((c) => this._dateAdapter.compareDate(a.dateValue, c) === 0) !== void 0 : r = !!this._selected && this._dateAdapter.compareDate(a.dateValue, this._selected) === 0, h`
+        const s = !this._isDayInRange(a.value), r = !this._dateFilter(this._dateAdapter.deserialize(a.value)), l = a.value === t;
+        let i;
+        return this.multiple ? i = this._selected.find((c) => this._dateAdapter.compareDate(a.dateValue, c) === 0) !== void 0 : i = !!this._selected && this._dateAdapter.compareDate(a.dateValue, this._selected) === 0, h`
         <td
           class=${Q({
           "sbb-calendar__table-data": !0,
-          "sbb-calendar__table-data-selected": r
+          "sbb-calendar__table-data-selected": i
         })}
         >
           <button
@@ -947,16 +948,16 @@ let Ct = (() => {
           "sbb-calendar__cell": !0,
           "sbb-calendar__day": !0,
           "sbb-calendar__cell-current": l,
-          "sbb-calendar__selected": r,
-          "sbb-calendar__crossed-out": !s && i
+          "sbb-calendar__selected": i,
+          "sbb-calendar__crossed-out": !s && r
         })}
             @click=${() => this._selectDate(a.dateValue)}
-            ?disabled=${s || i}
+            ?disabled=${s || r}
             value=${a.value}
             type="button"
             aria-label=${this._dateAdapter.getAccessibilityFormatDate(a.value)}
-            aria-pressed=${r}
-            aria-disabled=${s || i}
+            aria-pressed=${i}
+            aria-disabled=${s || r}
             aria-current=${l ? "date" : m}
             tabindex="-1"
             @keydown=${(c) => this._handleKeyboardEvent(c, a)}
@@ -1012,14 +1013,14 @@ let Ct = (() => {
           ${e.map((a) => h`
               <tr>
                 ${a.map((s) => {
-        let i;
+        let r;
         if (this.multiple)
-          i = this._selected.find((_) => t === this._dateAdapter.getYear(_) && s.monthValue === this._dateAdapter.getMonth(_)) !== void 0;
+          r = this._selected.find((_) => t === this._dateAdapter.getYear(_) && s.monthValue === this._dateAdapter.getMonth(_)) !== void 0;
         else {
           const _ = this._selected ? this._dateAdapter.getMonth(this._selected) : void 0, w = this._selected ? this._dateAdapter.getYear(this._selected) : void 0;
-          i = !!this._selected && t === w && s.monthValue === _;
+          r = !!this._selected && t === w && s.monthValue === _;
         }
-        const l = !this._isMonthInRange(s.monthValue, t), r = !this._isMonthFilteredOut(s.monthValue, t), c = t === this._dateAdapter.getYear(this._dateAdapter.today()) && this._dateAdapter.getMonth(this._dateAdapter.today()) === s.monthValue;
+        const l = !this._isMonthInRange(s.monthValue, t), i = !this._isMonthFilteredOut(s.monthValue, t), c = t === this._dateAdapter.getYear(this._dateAdapter.today()) && this._dateAdapter.getMonth(this._dateAdapter.today()) === s.monthValue;
         return h` <td
                     class=${Q({
           "sbb-calendar__table-data": !0,
@@ -1031,14 +1032,14 @@ let Ct = (() => {
           "sbb-calendar__cell": !0,
           "sbb-calendar__pill": !0,
           "sbb-calendar__cell-current": c,
-          "sbb-calendar__crossed-out": !l && r,
-          "sbb-calendar__selected": i
+          "sbb-calendar__crossed-out": !l && i,
+          "sbb-calendar__selected": r
         })}
                       @click=${() => this._onMonthSelection(s.monthValue, t)}
-                      ?disabled=${l || r}
+                      ?disabled=${l || i}
                       aria-label=${`${s.longValue} ${t}`}
-                      aria-pressed=${i}
-                      aria-disabled=${String(l || r)}
+                      aria-pressed=${r}
+                      aria-disabled=${String(l || i)}
                       tabindex="-1"
                       data-month=${s.monthValue || m}
                       @keydown=${(_) => this._handleKeyboardEvent(_)}
@@ -1061,9 +1062,9 @@ let Ct = (() => {
     _renderYearView() {
       return h`
       <div class="sbb-calendar__controls">
-        ${this._getArrow("left", () => this._goToDifferentYearRange(-V), it(V)[this._language.current], this._previousYearRangeDisabled())}
+        ${this._getArrow("left", () => this._goToDifferentYearRange(-V), rt(V)[this._language.current], this._previousYearRangeDisabled())}
         <div class="sbb-calendar__controls-month">${this._createLabelForYearView()}</div>
-        ${this._getArrow("right", () => this._goToDifferentYearRange(V), rt(V)[this._language.current], this._nextYearRangeDisabled())}
+        ${this._getArrow("right", () => this._goToDifferentYearRange(V), it(V)[this._language.current], this._nextYearRangeDisabled())}
       </div>
       <div class="sbb-calendar__table-container sbb-calendar__table-year-view">
         ${this._createYearTable(this._years)}
@@ -1108,34 +1109,34 @@ let Ct = (() => {
     >
       <tbody class="sbb-calendar__table-body">
         ${e.map((s) => h` <tr>
-              ${s.map((i) => {
+              ${s.map((r) => {
         let l;
         if (this.multiple)
-          l = this._selected.find((w) => i === this._dateAdapter.getYear(w)) !== void 0;
+          l = this._selected.find((w) => r === this._dateAdapter.getYear(w)) !== void 0;
         else {
           const w = this._selected ? this._dateAdapter.getYear(this._selected) : void 0;
-          l = !!this._selected && i === w;
+          l = !!this._selected && r === w;
         }
-        const r = !this._isYearInRange(i), c = !this._isYearFilteredOut(i), _ = this._dateAdapter.getYear(a) === i;
+        const i = !this._isYearInRange(r), c = !this._isYearFilteredOut(r), _ = this._dateAdapter.getYear(a) === r;
         return h` <td class="sbb-calendar__table-data sbb-calendar__table-year">
                   <button
                     class=${Q({
           "sbb-calendar__cell": !0,
           "sbb-calendar__pill": !0,
           "sbb-calendar__cell-current": _,
-          "sbb-calendar__crossed-out": !r && c,
+          "sbb-calendar__crossed-out": !i && c,
           "sbb-calendar__selected": l
         })}
-                    @click=${() => this._onYearSelection(i, t)}
-                    ?disabled=${r || c}
-                    aria-label=${i}
+                    @click=${() => this._onYearSelection(r, t)}
+                    ?disabled=${i || c}
+                    aria-label=${r}
                     aria-pressed=${l}
-                    aria-disabled=${String(r || c)}
+                    aria-disabled=${String(i || c)}
                     tabindex="-1"
-                    data-year=${i || m}
+                    data-year=${r || m}
                     @keydown=${(w) => this._handleKeyboardEvent(w)}
                   >
-                    ${i}
+                    ${r}
                   </button>
                 </td>`;
       })}
@@ -1178,7 +1179,7 @@ let Ct = (() => {
       t.view = a;
     } }, metadata: e }, W, ae), y(p, null, se, { kind: "accessor", name: "min", static: !1, private: !1, access: { has: (t) => "min" in t, get: (t) => t.min, set: (t, a) => {
       t.min = a;
-    } }, metadata: e }, ie, re), y(p, null, ne, { kind: "accessor", name: "max", static: !1, private: !1, access: { has: (t) => "max" in t, get: (t) => t.max, set: (t, a) => {
+    } }, metadata: e }, re, ie), y(p, null, ne, { kind: "accessor", name: "max", static: !1, private: !1, access: { has: (t) => "max" in t, get: (t) => t.max, set: (t, a) => {
       t.max = a;
     } }, metadata: e }, le, oe), y(p, null, de, { kind: "accessor", name: "multiple", static: !1, private: !1, access: { has: (t) => "multiple" in t, get: (t) => t.multiple, set: (t, a) => {
       t.multiple = a;
@@ -1201,10 +1202,10 @@ let Ct = (() => {
     } }, metadata: e }, ze, Fe), y(p, null, Oe, { kind: "accessor", name: "_initialized", static: !1, private: !1, access: { has: (t) => "_initialized" in t, get: (t) => t._initialized, set: (t, a) => {
       t._initialized = a;
     } }, metadata: e }, We, Ne), y(null, n = { value: b }, o, { kind: "class", name: b.name, metadata: e }, null, d), b = n.value, e && Object.defineProperty(b, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
-  })(), p.styles = mt, p.events = {
+  })(), p.styles = [lt, wt], p.events = {
     dateselected: "dateselected"
   }, u(b, d), b;
 })();
 export {
-  Ct as SbbCalendarElement
+  Rt as SbbCalendarElement
 };