@sbb-esta/lyne-elements 4.0.2 → 4.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (22) hide show
  1. package/autocomplete/autocomplete-base-element.d.ts.map +1 -1
  2. package/autocomplete/autocomplete-base-element.js +6 -5
  3. package/autocomplete/autocomplete.component.d.ts.map +1 -1
  4. package/autocomplete/autocomplete.component.js +8 -9
  5. package/calendar/calendar.component.d.ts +2 -0
  6. package/calendar/calendar.component.d.ts.map +1 -1
  7. package/calendar/calendar.component.js +95 -92
  8. package/core/styles/mixins/lists.scss +3 -3
  9. package/custom-elements.json +6171 -6161
  10. package/development/autocomplete/autocomplete-base-element.d.ts.map +1 -1
  11. package/development/autocomplete/autocomplete-base-element.js +7 -6
  12. package/development/autocomplete/autocomplete.component.d.ts.map +1 -1
  13. package/development/autocomplete/autocomplete.component.js +13 -15
  14. package/development/calendar/calendar.component.d.ts +2 -0
  15. package/development/calendar/calendar.component.d.ts.map +1 -1
  16. package/development/calendar/calendar.component.js +40 -33
  17. package/development/notification/notification.component.js +9 -11
  18. package/development/option/option/option-base-element.js +2 -2
  19. package/loading-indicator-circle/loading-indicator-circle.component.js +1 -1
  20. package/notification/notification.component.js +1 -1
  21. package/option/option/option-base-element.js +1 -1
  22. package/package.json +1 -1
package/calendar/calendar.component.js CHANGED
@@ -1,62 +1,62 @@
1
- var Ie = (o) => {
1
+ var Ce = (o) => {
2
2
  throw TypeError(o);
3
3
  };
4
- var Ce = (o, n, d) => n.has(o) || Ie("Cannot " + d);
5
- var A = (o, n, d) => (Ce(o, n, "read from private field"), d ? d.call(o) : n.get(o)), x = (o, n, d) => n.has(o) ? Ie("Cannot add the same private member more than once") : n instanceof WeakSet ? n.add(o) : n.set(o, d), f = (o, n, d, b) => (Ce(o, n, "write to private field"), b ? b.call(o, d) : n.set(o, d), d);
4
+ var Ie = (o, n, d) => n.has(o) || Ce("Cannot " + d);
5
+ var A = (o, n, d) => (Ie(o, n, "read from private field"), d ? d.call(o) : n.get(o)), x = (o, n, d) => n.has(o) ? Ce("Cannot add the same private member more than once") : n instanceof WeakSet ? n.add(o) : n.set(o, d), f = (o, n, d, b) => (Ie(o, n, "write to private field"), b ? b.call(o, d) : n.set(o, d), d);
6
6
  import { __esDecorate as y, __runInitializers as u } from "tslib";
7
7
  import { css as Le, LitElement as Be, isServer as Se, nothing as m, html as h } from "lit";
8
8
  import { customElement as He, property as Y, state as G } from "lit/decorators.js";
9
9
  import { classMap as Q } from "lit/directives/class-map.js";
10
- import { sbbInputModalityDetector as qe, isArrowKeyOrPageKeysPressed as Ke } from "../core/a11y.js";
10
+ import { isArrowKeyOrPageKeysPressed as Ke } from "../core/a11y.js";
11
11
  import { readConfig as Ue } from "../core/config.js";
12
- import { SbbLanguageController as je, SbbMediaMatcherController as Ge, SbbMediaQueryBreakpointLargeAndAbove as Re } from "../core/controllers.js";
13
- 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";
14
- import { forceType as Z, plainDate as Te, handleDistinctChange as Xe } from "../core/decorators.js";
15
- 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";
16
- import { SbbHydrationMixin as nt, SbbElementInternalsMixin as lt } from "../core/mixins.js";
17
- import { boxSizingStyles as ot } from "../core/styles.js";
12
+ import { SbbLanguageController as qe, SbbMediaMatcherController as je, SbbMediaQueryBreakpointLargeAndAbove as Re } from "../core/controllers.js";
13
+ import { defaultDateAdapter as Ge, YEARS_PER_PAGE as V, DAYS_PER_ROW as D, MONTHS_PER_ROW as J, YEARS_PER_ROW as X, MONTHS_PER_PAGE as Qe } from "../core/datetime.js";
14
+ import { forceType as Z, plainDate as Te, handleDistinctChange as Je } from "../core/decorators.js";
15
+ import { i18nPreviousMonth as Xe, i18nNextMonth as Ze, i18nYearMonthSelection as et, i18nCalendarWeekNumber as U, i18nPreviousYear as tt, i18nNextYear as at, i18nCalendarDateSelection as Ee, i18nPreviousYearRange as st, i18nNextYearRange as it } from "../core/i18n.js";
16
+ import { SbbHydrationMixin as rt, SbbElementInternalsMixin as nt } from "../core/mixins.js";
17
+ import { boxSizingStyles as lt } from "../core/styles.js";
18
18
  import "../button/secondary-button.js";
19
19
  import "../icon.js";
20
20
  import "../screen-reader-only.js";
21
- const dt = 6048e5, Pe = Symbol.for("constructDateFrom");
21
+ const ot = 6048e5, Pe = /* @__PURE__ */ Symbol.for("constructDateFrom");
22
22
  function F(o, n) {
23
23
  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);
24
24
  }
25
- function U(o, n) {
25
+ function q(o, n) {
26
26
  return F(n || o, o);
27
27
  }
28
- function ct(o, n, d) {
29
- const b = U(o, d?.in);
28
+ function dt(o, n, d) {
29
+ const b = q(o, d?.in);
30
30
  return isNaN(n) ? F(o, NaN) : (n && b.setDate(b.getDate() + n), b);
31
31
  }
32
- let ht = {};
32
+ let ct = {};
33
33
  function te() {
34
- return ht;
34
+ return ct;
35
35
  }
36
36
  function z(o, n) {
37
- 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;
37
+ const d = te(), b = n?.weekStartsOn ?? n?.locale?.options?.weekStartsOn ?? d.weekStartsOn ?? d.locale?.options?.weekStartsOn ?? 0, g = q(o, n?.in), v = g.getDay(), $ = (v < b ? 7 : 0) + v - b;
38
38
  return g.setDate(g.getDate() - $), g.setHours(0, 0, 0, 0), g;
39
39
  }
40
- function bt(o, ...n) {
40
+ function ht(o, ...n) {
41
41
  const d = F.bind(
42
42
  null,
43
43
  o || n.find((b) => typeof b == "object")
44
44
  );
45
45
  return n.map(d);
46
46
  }
47
- function _t(o, n, d) {
48
- return ct(o, n * 7, d);
47
+ function bt(o, n, d) {
48
+ return dt(o, n * 7, d);
49
49
  }
50
- function ut(o, n) {
51
- const d = U(o, n?.in), b = d.getMonth();
50
+ function _t(o, n) {
51
+ const d = q(o, n?.in), b = d.getMonth();
52
52
  return d.setFullYear(d.getFullYear(), b + 1, 0), d.setHours(23, 59, 59, 999), d;
53
53
  }
54
- function ft(o, n) {
55
- const [d, b] = bt(o, n.start, n.end);
54
+ function ut(o, n) {
55
+ const [d, b] = ht(o, n.start, n.end);
56
56
  return { start: d, end: b };
57
57
  }
58
- function pt(o, n) {
59
- const { start: d, end: b } = ft(n?.in, o);
58
+ function ft(o, n) {
59
+ const { start: d, end: b } = ut(n?.in, o);
60
60
  let g = +d > +b;
61
61
  const v = z(g ? b : d, n), $ = z(g ? d : b, n);
62
62
  v.setHours(15), $.setHours(15);
@@ -66,39 +66,39 @@ function pt(o, n) {
66
66
  M < 0 && (M = -M, g = !g);
67
67
  const W = [];
68
68
  for (; +k <= O; )
69
- k.setHours(0), W.push(F(d, k)), k = _t(k, M), k.setHours(15);
69
+ k.setHours(0), W.push(F(d, k)), k = bt(k, M), k.setHours(15);
70
70
  return g ? W.reverse() : W;
71
71
  }
72
- function gt(o, n) {
73
- const d = U(o, n?.in);
72
+ function pt(o, n) {
73
+ const d = q(o, n?.in);
74
74
  return d.setDate(1), d.setHours(0, 0, 0, 0), d;
75
75
  }
76
- function mt(o, n) {
77
- 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);
76
+ function gt(o, n) {
77
+ const d = q(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);
78
78
  $.setFullYear(b + 1, 0, v), $.setHours(0, 0, 0, 0);
79
79
  const O = z($, n), k = F(n?.in || o, 0);
80
80
  k.setFullYear(b, 0, v), k.setHours(0, 0, 0, 0);
81
81
  const M = z(k, n);
82
82
  return +d >= +O ? b + 1 : +d >= +M ? b : b - 1;
83
83
  }
84
- function wt(o, n) {
85
- const d = te(), b = n?.firstWeekContainsDate ?? n?.locale?.options?.firstWeekContainsDate ?? d.firstWeekContainsDate ?? d.locale?.options?.firstWeekContainsDate ?? 1, g = mt(o, n), v = F(n?.in || o, 0);
84
+ function mt(o, n) {
85
+ 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);
86
86
  return v.setFullYear(g, 0, b), v.setHours(0, 0, 0, 0), z(v, n);
87
87
  }
88
88
  function ee(o, n) {
89
- const d = U(o, n?.in), b = +z(d, n) - +wt(d, n);
90
- return Math.round(b / dt) + 1;
89
+ const d = q(o, n?.in), b = +z(d, n) - +mt(d, n);
90
+ return Math.round(b / ot) + 1;
91
91
  }
92
- const vt = 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-text-font-size-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-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(:is(:state(wide),[state--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]:is(:state(wide),[state--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]:is(:state(wide),[state--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(:is(:state(wide),[state--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-text-font-size-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-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-text-font-size-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-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-text-font-size-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-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-text-font-size-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-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))}}`;
93
- let Rt = (() => {
94
- var N, I, C, S, R, T, E, P, L, B, H, q, p;
95
- let o = [He("sbb-calendar")], n, d = [], b, g = nt(lt(Be)), v = [], $, O = [], k = [], M, W = [], ae = [], se, ie = [], re = [], ne, le = [], oe = [], de, ce = [], he = [], be, _e, ue = [], fe = [], pe, ge = [], me = [], we, ve = [], ye = [], De, ke = [], Ae = [], xe, $e = [], Ve = [], Me, Ye, ze = [], Fe = [], Oe, We = [], Ne = [];
92
+ 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-text-font-size-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-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-overflow-break{contain:layout}.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(:is(:state(wide),[state--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]:is(:state(wide),[state--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]:is(:state(wide),[state--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(:is(:state(wide),[state--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-text-font-size-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-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-text-font-size-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-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-text-font-size-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-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-text-font-size-s);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-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))}}`;
93
+ let St = (() => {
94
+ var N, C, I, S, R, T, E, P, L, B, H, K, p;
95
+ let o = [He("sbb-calendar")], n, d = [], b, g = rt(nt(Be)), v = [], $, O = [], k = [], M, W = [], ae = [], se, ie = [], re = [], ne, le = [], oe = [], de, ce = [], he = [], be, _e, ue = [], fe = [], pe, ge = [], me = [], we, ve = [], ye = [], De, ke = [], Ae = [], xe, $e = [], Ve = [], Me, Ye, ze = [], Fe = [], Oe, We = [], Ne = [];
96
96
  return p = class extends g {
97
97
  constructor() {
98
98
  super();
99
99
  x(this, N);
100
- x(this, I);
101
100
  x(this, C);
101
+ x(this, I);
102
102
  x(this, S);
103
103
  x(this, R);
104
104
  x(this, T);
@@ -107,18 +107,18 @@ let Rt = (() => {
107
107
  x(this, L);
108
108
  x(this, B);
109
109
  x(this, H);
110
- x(this, q);
111
- f(this, N, (u(this, v), u(this, O, !1))), f(this, I, (u(this, k), u(this, W, "day"))), f(this, C, (u(this, ae), u(this, ie, null))), f(this, S, (u(this, re), u(this, le, null))), f(this, R, (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, ke, !1))), this._dateAdapter = (u(this, Ae), Ue().datetime?.dateAdapter ?? Qe), f(this, B, u(this, $e, this._dateAdapter.today())), this._wideInternal = (u(this, Ve), !1), f(this, H, u(this, ze, "day")), this._nextCalendarView = (u(this, Fe), "day"), this._keyboardNavigationDayViewParameters = {
110
+ x(this, K);
111
+ f(this, N, (u(this, v), u(this, O, !1))), f(this, C, (u(this, k), u(this, W, "day"))), f(this, I, (u(this, ae), u(this, ie, null))), f(this, S, (u(this, re), u(this, le, null))), f(this, R, (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, ke, !1))), this._dateAdapter = (u(this, Ae), Ue().datetime?.dateAdapter ?? Ge), f(this, B, u(this, $e, this._dateAdapter.today())), this._wideInternal = (u(this, Ve), !1), f(this, H, u(this, ze, "day")), this._nextCalendarView = (u(this, Fe), "day"), this._keyboardNavigationDayViewParameters = {
112
112
  firstDayInView: null,
113
113
  lastDayInView: null,
114
114
  firstMonthOffset: 0,
115
115
  firstMonthLength: 0,
116
116
  secondMonthOffset: 0
117
- }, this._weeks = [], this._monthNames = this._dateAdapter.getMonthNames("long"), this._resetFocus = !1, f(this, q, u(this, We, !1)), this._language = (u(this, Ne), new je(this).withHandler(() => {
117
+ }, this._weeks = [], this._monthNames = this._dateAdapter.getMonthNames("long"), this._resetFocus = !1, this._containingFocus = !1, f(this, K, u(this, We, !1)), this._language = (u(this, Ne), new qe(this).withHandler(() => {
118
118
  this._monthNames = this._dateAdapter.getMonthNames("long"), this._createMonthRows();
119
- })), this._mediaMatcher = new Ge(this, {
119
+ })), this._mediaMatcher = new je(this, {
120
120
  [Re]: () => this._init()
121
- }), this._createMonthRows(), this._setWeekdays();
121
+ }), this._createMonthRows(), this._setWeekdays(), this.addEventListener("focusin", () => this._containingFocus = !0), this.addEventListener("focusout", () => this._containingFocus = !1);
122
122
  }
123
123
  /** If set to true, two months are displayed */
124
124
  get wide() {
@@ -129,20 +129,20 @@ let Rt = (() => {
129
129
  }
130
130
  /** The initial view of the calendar which should be displayed on opening. */
131
131
  get view() {
132
- return A(this, I);
132
+ return A(this, C);
133
133
  }
134
134
  set view(e) {
135
- f(this, I, e);
135
+ f(this, C, e);
136
136
  }
137
137
  /**
138
138
  * The minimum valid date. Accepts a date object or null.
139
139
  * Accepts an ISO8601 formatted string (e.g. 2024-12-24) as attribute.
140
140
  */
141
141
  get min() {
142
- return A(this, C);
142
+ return A(this, I);
143
143
  }
144
144
  set min(e) {
145
- f(this, C, e);
145
+ f(this, I, e);
146
146
  }
147
147
  /**
148
148
  * The maximum valid date. Accepts a date object or null.
@@ -227,10 +227,10 @@ let Rt = (() => {
227
227
  return Array.from(this.shadowRoot.querySelectorAll(".sbb-calendar__cell") ?? []);
228
228
  }
229
229
  get _initialized() {
230
- return A(this, q);
230
+ return A(this, K);
231
231
  }
232
232
  set _initialized(e) {
233
- f(this, q, e);
233
+ f(this, K, e);
234
234
  }
235
235
  _dateFilter(e) {
236
236
  return this.dateFilter?.(e) ?? !0;
@@ -250,7 +250,7 @@ let Rt = (() => {
250
250
  super.willUpdate(e), this._initialized && ((e.has("wide") || e.has("orientation")) && this.resetPosition(), e.has("view") && (this._setChosenYear(), this._chosenMonth = void 0, this._nextCalendarView = this._calendarView = this.view));
251
251
  }
252
252
  updated(e) {
253
- super.updated(e), this._setTabIndex(), qe.mostRecentModality === "keyboard" && this._focusCell();
253
+ super.updated(e), this._setTabIndex(), this._focusCell();
254
254
  }
255
255
  /**
256
256
  * The `_selected` state should be adapted when the `multiple` property changes:
@@ -298,7 +298,7 @@ let Rt = (() => {
298
298
  * Then, this array is mapped via the `getWeek` function, which returns the ISO week number for that date.
299
299
  */
300
300
  _createWeekNumbers(e) {
301
- return pt({ start: gt(e), end: ut(e) }, { weekStartsOn: 1 }).map((t) => ee(t, { weekStartsOn: 1, firstWeekContainsDate: 4 }));
301
+ return ft({ start: pt(e), end: _t(e) }, { weekStartsOn: 1 }).map((t) => ee(t, { weekStartsOn: 1, firstWeekContainsDate: 4 }));
302
302
  }
303
303
  /** Creates the rows along the horizontal direction and sets the parameters used in keyboard navigation. */
304
304
  _createWeekRows(e, t = !1) {
@@ -550,10 +550,8 @@ let Rt = (() => {
550
550
  }
551
551
  /** Get the element in the calendar to assign focus. */
552
552
  _getFirstFocusable() {
553
- let e;
554
- this.multiple ? e = this._selected?.length ? [...this._selected].sort()[0] : this._dateAdapter.today() : e = this._selected ?? this._dateAdapter.today();
555
- let t = this.shadowRoot.querySelector(".sbb-calendar__selected") ?? this.shadowRoot.querySelector(`[value="${this._dateAdapter.toIso8601(e)}"]`) ?? this.shadowRoot.querySelector(`[data-month="${this._dateAdapter.getMonth(e)}"]`) ?? this.shadowRoot.querySelector(`[data-year="${this._dateAdapter.getYear(e)}"]`);
556
- return (!t || t?.disabled) && (t = this._calendarView === "day" ? this._getFirstFocusableDay() : this.shadowRoot.querySelector(".sbb-calendar__cell:not([disabled])")), t || null;
553
+ const e = this.shadowRoot.querySelector(".sbb-calendar__selected") ?? this.shadowRoot.querySelector(".sbb-calendar__cell-current");
554
+ return e && !e.disabled ? e : this._calendarView === "day" ? this._getFirstFocusableDay() : this.shadowRoot.querySelector(".sbb-calendar__cell:not([disabled])");
557
555
  }
558
556
  /**
559
557
  * In `day` view in `vertical` orientation,
@@ -682,7 +680,7 @@ let Rt = (() => {
682
680
  * @param isYearView Whether the displayed `view` is the year one.
683
681
  */
684
682
  _calculateParametersForKeyboardNavigation(e, t) {
685
- const a = t ? V : Je, s = Math.trunc(e / a) * a, i = s === 0 ? e : e - a;
683
+ const a = t ? V : Qe, s = Math.trunc(e / a) * a, i = s === 0 ? e : e - a;
686
684
  return {
687
685
  verticalOffset: t ? X : J,
688
686
  elementIndexForWideMode: i,
@@ -719,14 +717,14 @@ let Rt = (() => {
719
717
  return e[i].disabled ? this._findNext(e, i, -s) : e[i];
720
718
  }
721
719
  _resetCalendarView(e = !1) {
722
- 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();
720
+ this._containingFocus && (this._resetFocus = !0), this._activeDate = (this.multiple ? this._selected.at(-1) : this._selected) ?? this._dateAdapter.today(), this._setChosenYear(), this._chosenMonth = void 0, this._init(), this._nextCalendarView = this._calendarView = this.view, e && this._startTableTransition();
723
721
  }
724
722
  /** Render the view for the day selection. */
725
723
  _renderDayView() {
726
724
  const e = this._wide ? this._dateAdapter.addCalendarMonths(this._activeDate, 1) : void 0;
727
725
  return h`
728
726
  <div class="sbb-calendar__controls">
729
- ${this._getArrow("left", () => this._goToDifferentMonth(-1), Ze[this._language.current], this._previousMonthDisabled())}
727
+ ${this._getArrow("left", () => this._goToDifferentMonth(-1), Xe[this._language.current], this._previousMonthDisabled())}
730
728
  <div class="sbb-calendar__controls-month">
731
729
  ${this._createLabelForDayView(this._activeDate)}
732
730
  ${this._wide ? this._createLabelForDayView(e) : m}
@@ -734,16 +732,18 @@ let Rt = (() => {
734
732
  ${this._createAriaLabelForDayView(this._activeDate, e)}
735
733
  </sbb-screen-reader-only>
736
734
  </div>
737
- ${this._getArrow("right", () => this._goToDifferentMonth(1), et[this._language.current], this._nextMonthDisabled())}
735
+ ${this._getArrow("right", () => this._goToDifferentMonth(1), Ze[this._language.current], this._nextMonthDisabled())}
738
736
  </div>
739
- <div class="sbb-calendar__table-container sbb-calendar__table-day-view">
740
- ${this.orientation === "horizontal" ? h`
741
- ${this._createDayTable(this._weeks, this._weekNumbers)}
742
- ${this._wide ? this._createDayTable(this._nextMonthWeeks, this._nextMonthWeekNumbers, !0) : m}
743
- ` : h`
744
- ${this._createDayTableVertical(this._weeks, this._weekNumbers)}
745
- ${this._wide ? this._createDayTableVertical(this._nextMonthWeeks, this._nextMonthWeekNumbers, e) : m}
746
- `}
737
+ <div class="sbb-calendar__table-overflow-break">
738
+ <div class="sbb-calendar__table-container sbb-calendar__table-day-view">
739
+ ${this.orientation === "horizontal" ? h`
740
+ ${this._createDayTable(this._weeks, this._weekNumbers)}
741
+ ${this._wide ? this._createDayTable(this._nextMonthWeeks, this._nextMonthWeekNumbers, !0) : m}
742
+ ` : h`
743
+ ${this._createDayTableVertical(this._weeks, this._weekNumbers)}
744
+ ${this._wide ? this._createDayTableVertical(this._nextMonthWeeks, this._nextMonthWeekNumbers, e) : m}
745
+ `}
746
+ </div>
747
747
  </div>
748
748
  `;
749
749
  }
@@ -754,7 +754,7 @@ let Rt = (() => {
754
754
  <button
755
755
  type="button"
756
756
  class="sbb-calendar__date-selection sbb-calendar__controls-change-date"
757
- aria-label="${tt[this._language.current]} ${t}"
757
+ aria-label="${et[this._language.current]} ${t}"
758
758
  @click=${() => {
759
759
  this._resetFocus = !0, this._nextCalendarView = "year", this._startTableTransition();
760
760
  }}
@@ -814,7 +814,7 @@ let Rt = (() => {
814
814
  ${this.multiple ? h`
815
815
  <button
816
816
  class="sbb-calendar__header-cell sbb-calendar__weekday"
817
- aria-label=${`${K[this._language.current]} ${t[0]}`}
817
+ aria-label=${`${U[this._language.current]} ${t[0]}`}
818
818
  @click=${() => {
819
819
  const w = i.filter((j) => j.weekValue === t[0]);
820
820
  this._selectMultipleDates(w);
@@ -824,7 +824,7 @@ let Rt = (() => {
824
824
  </button>
825
825
  ` : h`
826
826
  <sbb-screen-reader-only
827
- >${`${K[this._language.current]} ${t[0]}`}</sbb-screen-reader-only
827
+ >${`${U[this._language.current]} ${t[0]}`}</sbb-screen-reader-only
828
828
  >
829
829
  <span aria-hidden="true">${t[0]}</span>
830
830
  `}
@@ -840,7 +840,7 @@ let Rt = (() => {
840
840
  ${this.multiple ? h`
841
841
  <button
842
842
  class="sbb-calendar__header-cell sbb-calendar__weekday"
843
- aria-label=${`${K[this._language.current]} ${t[c]}`}
843
+ aria-label=${`${U[this._language.current]} ${t[c]}`}
844
844
  @click=${() => {
845
845
  const w = i.filter((j) => j.weekValue === t[c]);
846
846
  this._selectMultipleDates(w);
@@ -850,7 +850,7 @@ let Rt = (() => {
850
850
  </button>
851
851
  ` : h`
852
852
  <sbb-screen-reader-only
853
- >${`${K[this._language.current]} ${t[c]}`}</sbb-screen-reader-only
853
+ >${`${U[this._language.current]} ${t[c]}`}</sbb-screen-reader-only
854
854
  >
855
855
  <span aria-hidden="true">${t[c]}</span>
856
856
  `}
@@ -882,7 +882,7 @@ let Rt = (() => {
882
882
  ${this.multiple ? h`
883
883
  <button
884
884
  class="sbb-calendar__header-cell sbb-calendar__weekday"
885
- aria-label=${`${K[this._language.current]} ${r}`}
885
+ aria-label=${`${U[this._language.current]} ${r}`}
886
886
  @click=${() => {
887
887
  const c = l.filter((_) => _.weekValue === r);
888
888
  this._selectMultipleDates(c);
@@ -892,7 +892,7 @@ let Rt = (() => {
892
892
  </button>
893
893
  ` : h`
894
894
  <sbb-screen-reader-only
895
- >${`${K[this._language.current]} ${r}`}</sbb-screen-reader-only
895
+ >${`${U[this._language.current]} ${r}`}</sbb-screen-reader-only
896
896
  >
897
897
  <span aria-hidden="true">${r}</span>
898
898
  `}
@@ -973,13 +973,15 @@ let Rt = (() => {
973
973
  _renderMonthView() {
974
974
  return h`
975
975
  <div class="sbb-calendar__controls">
976
- ${this._getArrow("left", () => this._goToDifferentYear(-1), at[this._language.current], this._previousYearDisabled())}
976
+ ${this._getArrow("left", () => this._goToDifferentYear(-1), tt[this._language.current], this._previousYearDisabled())}
977
977
  <div class="sbb-calendar__controls-month">${this._createLabelForMonthView()}</div>
978
- ${this._getArrow("right", () => this._goToDifferentYear(1), st[this._language.current], this._nextYearDisabled())}
978
+ ${this._getArrow("right", () => this._goToDifferentYear(1), at[this._language.current], this._nextYearDisabled())}
979
979
  </div>
980
- <div class="sbb-calendar__table-container sbb-calendar__table-month-view">
981
- ${this._createMonthTable(this._months, this._chosenYear)}
982
- ${this._wide ? this._createMonthTable(this._months, this._chosenYear + 1) : m}
980
+ <div class="sbb-calendar__table-overflow-break">
981
+ <div class="sbb-calendar__table-container sbb-calendar__table-month-view">
982
+ ${this._createMonthTable(this._months, this._chosenYear)}
983
+ ${this._wide ? this._createMonthTable(this._months, this._chosenYear + 1) : m}
984
+ </div>
983
985
  </div>
984
986
  `;
985
987
  }
@@ -1062,13 +1064,15 @@ let Rt = (() => {
1062
1064
  _renderYearView() {
1063
1065
  return h`
1064
1066
  <div class="sbb-calendar__controls">
1065
- ${this._getArrow("left", () => this._goToDifferentYearRange(-V), it(V)[this._language.current], this._previousYearRangeDisabled())}
1067
+ ${this._getArrow("left", () => this._goToDifferentYearRange(-V), st(V)[this._language.current], this._previousYearRangeDisabled())}
1066
1068
  <div class="sbb-calendar__controls-month">${this._createLabelForYearView()}</div>
1067
- ${this._getArrow("right", () => this._goToDifferentYearRange(V), rt(V)[this._language.current], this._nextYearRangeDisabled())}
1069
+ ${this._getArrow("right", () => this._goToDifferentYearRange(V), it(V)[this._language.current], this._nextYearRangeDisabled())}
1068
1070
  </div>
1069
- <div class="sbb-calendar__table-container sbb-calendar__table-year-view">
1070
- ${this._createYearTable(this._years)}
1071
- ${this._wide ? this._createYearTable(this._nextMonthYears, !0) : m}
1071
+ <div class="sbb-calendar__table-overflow-break">
1072
+ <div class="sbb-calendar__table-container sbb-calendar__table-year-view">
1073
+ ${this._createYearTable(this._years)}
1074
+ ${this._wide ? this._createYearTable(this._nextMonthYears, !0) : m}
1075
+ </div>
1072
1076
  </div>
1073
1077
  `;
1074
1078
  }
@@ -1156,14 +1160,13 @@ let Rt = (() => {
1156
1160
  return this._renderYearView();
1157
1161
  case "month":
1158
1162
  return this._renderMonthView();
1159
- case "day":
1160
1163
  default:
1161
1164
  return this._renderDayView();
1162
1165
  }
1163
1166
  }
1164
1167
  _tableAnimationEnd(e) {
1165
1168
  const t = e.target;
1166
- e.animationName === "hide" ? (t.classList.remove("sbb-calendar__table-hide"), this._resetFocus = !0, this._calendarView = this._nextCalendarView) : e.animationName === "show" && this.internals.states.delete("transition");
1169
+ e.animationName === "hide" ? (t.classList.remove("sbb-calendar__table-hide"), this._containingFocus && (this._resetFocus = !0), this._calendarView = this._nextCalendarView) : e.animationName === "show" && this.internals.states.delete("transition");
1167
1170
  }
1168
1171
  _startTableTransition() {
1169
1172
  this.internals.states.add("transition"), this.shadowRoot?.querySelectorAll("table")?.forEach((e) => e.classList.toggle("sbb-calendar__table-hide"));
@@ -1171,9 +1174,9 @@ let Rt = (() => {
1171
1174
  render() {
1172
1175
  return h`<div class="sbb-calendar__wrapper">${this._getView()}</div>`;
1173
1176
  }
1174
- }, N = new WeakMap(), I = new WeakMap(), C = new WeakMap(), S = new WeakMap(), R = new WeakMap(), T = new WeakMap(), E = new WeakMap(), P = new WeakMap(), L = new WeakMap(), B = new WeakMap(), H = new WeakMap(), q = new WeakMap(), b = p, (() => {
1177
+ }, N = new WeakMap(), C = new WeakMap(), I = new WeakMap(), S = new WeakMap(), R = new WeakMap(), T = new WeakMap(), E = new WeakMap(), P = new WeakMap(), L = new WeakMap(), B = new WeakMap(), H = new WeakMap(), K = new WeakMap(), b = p, (() => {
1175
1178
  const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(g[Symbol.metadata] ?? null) : void 0;
1176
- $ = [Z(), Y({ type: Boolean })], M = [Y()], se = [Te(), Y()], ne = [Te(), Y()], de = [Z(), Xe((t, a) => t._onMultipleChanged(a)), Y({ type: Boolean })], be = [Y()], _e = [G()], pe = [Y({ attribute: "date-filter" })], we = [Y({ reflect: !0 })], De = [Z(), Y({ attribute: "week-numbers", type: Boolean })], xe = [G()], Me = [G()], Ye = [G()], Oe = [G()], y(p, null, $, { kind: "accessor", name: "wide", static: !1, private: !1, access: { has: (t) => "wide" in t, get: (t) => t.wide, set: (t, a) => {
1179
+ $ = [Z(), Y({ type: Boolean })], M = [Y()], se = [Te(), Y()], ne = [Te(), Y()], de = [Z(), Je((t, a) => t._onMultipleChanged(a)), Y({ type: Boolean })], be = [Y()], _e = [G()], pe = [Y({ attribute: "date-filter" })], we = [Y({ reflect: !0 })], De = [Z(), Y({ attribute: "week-numbers", type: Boolean })], xe = [G()], Me = [G()], Ye = [G()], Oe = [G()], y(p, null, $, { kind: "accessor", name: "wide", static: !1, private: !1, access: { has: (t) => "wide" in t, get: (t) => t.wide, set: (t, a) => {
1177
1180
  t.wide = a;
1178
1181
  } }, metadata: e }, O, k), y(p, null, M, { kind: "accessor", name: "view", static: !1, private: !1, access: { has: (t) => "view" in t, get: (t) => t.view, set: (t, a) => {
1179
1182
  t.view = a;
@@ -1202,10 +1205,10 @@ let Rt = (() => {
1202
1205
  } }, 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) => {
1203
1206
  t._initialized = a;
1204
1207
  } }, 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 });
1205
- })(), p.styles = [ot, vt], p.events = {
1208
+ })(), p.styles = [lt, wt], p.events = {
1206
1209
  dateselected: "dateselected"
1207
1210
  }, u(b, d), b;
1208
1211
  })();
1209
1212
  export {
1210
- Rt as SbbCalendarElement
1213
+ St as SbbCalendarElement
1211
1214
  };
package/core/styles/mixins/lists.scss CHANGED
@@ -14,7 +14,7 @@
14
14
  @mixin list {
15
15
  // Support both top level usage (& is empty / falsy)
16
16
  // and applied to a selector usage.
17
- #{if(&, '&:where(ol, ul)', ':is(ol, ul)')} {
17
+ #{if(sass(&): "&:where(ol, ul)"; else: ":is(ol, ul)")} {
18
18
  --sbb-list-vertical-gap: 0.75em;
19
19
  --sbb-list-padding-inline-start: 1.5em;
20
20
 
@@ -48,7 +48,7 @@
48
48
 
49
49
  // Support both top level usage (& is empty / falsy)
50
50
  // and applied to a selector usage.
51
- #{if(&, '&:where(ul)', 'ul')} {
51
+ #{if(sass(&): "&:where(ul)"; else: "ul")} {
52
52
  &,
53
53
  ul {
54
54
  list-style-type: none;
@@ -79,7 +79,7 @@
79
79
  @mixin description-list {
80
80
  // Support both top level usage (& is empty / falsy)
81
81
  // and applied to a selector usage.
82
- #{if(&, '&:where(dl)', 'dl')} {
82
+ #{if(sass(&): "&:where(dl)"; else: "dl")} {
83
83
  @include typo.text-s--regular;
84
84
 
85
85
  margin: 0;