@sbb-esta/lyne-elements 1.14.1 → 1.15.0

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 (167) hide show
  1. package/autocomplete/autocomplete.d.ts +1 -1
  2. package/autocomplete/autocomplete.d.ts.map +1 -1
  3. package/autocomplete-grid/autocomplete-grid/autocomplete-grid.d.ts +1 -1
  4. package/autocomplete-grid/autocomplete-grid/autocomplete-grid.d.ts.map +1 -1
  5. package/autocomplete-grid/autocomplete-grid.js +6 -6
  6. package/autocomplete.js +20 -19
  7. package/calendar/calendar.d.ts +1 -1
  8. package/calendar/calendar.d.ts.map +1 -1
  9. package/calendar.js +25 -27
  10. package/checkbox/checkbox-panel/checkbox-panel.d.ts +1 -1
  11. package/checkbox/checkbox-panel/checkbox-panel.d.ts.map +1 -1
  12. package/checkbox/checkbox-panel.js +5 -5
  13. package/checkbox/common.js +1 -1
  14. package/clock/clock.d.ts +1 -1
  15. package/clock/clock.d.ts.map +1 -1
  16. package/clock.js +2 -2
  17. package/container/sticky-bar/sticky-bar.d.ts +29 -2
  18. package/container/sticky-bar/sticky-bar.d.ts.map +1 -1
  19. package/container/sticky-bar.js +69 -31
  20. package/core/controllers/media-matchers-controller.d.ts +32 -0
  21. package/core/controllers/media-matchers-controller.d.ts.map +1 -0
  22. package/core/controllers.d.ts +1 -0
  23. package/core/controllers.d.ts.map +1 -1
  24. package/core/controllers.js +75 -33
  25. package/core/dom/breakpoint.d.ts +2 -1
  26. package/core/dom/breakpoint.d.ts.map +1 -1
  27. package/core/dom.js +7 -7
  28. package/core/mixins/form-associated-checkbox-mixin.d.ts.map +1 -1
  29. package/core/mixins.js +8 -1
  30. package/core/styles/core/mediaqueries.scss +1 -2
  31. package/core/styles/mixins/buttons.scss +5 -5
  32. package/core/testing/event-spy.d.ts +6 -4
  33. package/core/testing/event-spy.d.ts.map +1 -1
  34. package/core/testing.js +82 -55
  35. package/custom-elements.json +609 -62
  36. package/datepicker/datepicker/datepicker.d.ts.map +1 -1
  37. package/development/autocomplete/autocomplete.d.ts +1 -1
  38. package/development/autocomplete/autocomplete.d.ts.map +1 -1
  39. package/development/autocomplete-grid/autocomplete-grid/autocomplete-grid.d.ts +1 -1
  40. package/development/autocomplete-grid/autocomplete-grid/autocomplete-grid.d.ts.map +1 -1
  41. package/development/autocomplete-grid/autocomplete-grid.js +4 -3
  42. package/development/autocomplete.js +4 -3
  43. package/development/calendar/calendar.d.ts +1 -1
  44. package/development/calendar/calendar.d.ts.map +1 -1
  45. package/development/calendar.js +8 -11
  46. package/development/checkbox/checkbox-panel/checkbox-panel.d.ts +1 -1
  47. package/development/checkbox/checkbox-panel/checkbox-panel.d.ts.map +1 -1
  48. package/development/checkbox/checkbox-panel.js +2 -2
  49. package/development/checkbox/common.js +2 -2
  50. package/development/clock/clock.d.ts +1 -1
  51. package/development/clock/clock.d.ts.map +1 -1
  52. package/development/clock.js +3 -3
  53. package/development/container/sticky-bar/sticky-bar.d.ts +29 -2
  54. package/development/container/sticky-bar/sticky-bar.d.ts.map +1 -1
  55. package/development/container/sticky-bar.js +149 -36
  56. package/development/core/controllers/media-matchers-controller.d.ts +32 -0
  57. package/development/core/controllers/media-matchers-controller.d.ts.map +1 -0
  58. package/development/core/controllers.d.ts +1 -0
  59. package/development/core/controllers.d.ts.map +1 -1
  60. package/development/core/controllers.js +65 -1
  61. package/development/core/dom/breakpoint.d.ts +2 -1
  62. package/development/core/dom/breakpoint.d.ts.map +1 -1
  63. package/development/core/dom.js +2 -2
  64. package/development/core/mixins/form-associated-checkbox-mixin.d.ts.map +1 -1
  65. package/development/core/mixins.js +9 -2
  66. package/development/core/testing/event-spy.d.ts +6 -4
  67. package/development/core/testing/event-spy.d.ts.map +1 -1
  68. package/development/core/testing.js +35 -1
  69. package/development/datepicker/datepicker/datepicker.d.ts.map +1 -1
  70. package/development/datepicker/datepicker.js +1 -1
  71. package/development/dialog/dialog.js +2 -2
  72. package/development/expansion-panel/expansion-panel-header/expansion-panel-header.d.ts +2 -0
  73. package/development/expansion-panel/expansion-panel-header/expansion-panel-header.d.ts.map +1 -1
  74. package/development/expansion-panel/expansion-panel-header.js +7 -3
  75. package/development/file-selector/file-selector.d.ts +5 -0
  76. package/development/file-selector/file-selector.d.ts.map +1 -1
  77. package/development/file-selector.js +8 -1
  78. package/development/flip-card/flip-card/flip-card.d.ts +4 -0
  79. package/development/flip-card/flip-card/flip-card.d.ts.map +1 -1
  80. package/development/flip-card/flip-card-details.js +4 -6
  81. package/development/flip-card/flip-card-summary/flip-card-summary.d.ts +1 -1
  82. package/development/flip-card/flip-card-summary/flip-card-summary.d.ts.map +1 -1
  83. package/development/flip-card/flip-card-summary.js +9 -10
  84. package/development/flip-card/flip-card.js +26 -2
  85. package/development/form-field/form-field.js +5 -3
  86. package/development/icon/icon.d.ts +1 -1
  87. package/development/icon.js +1 -1
  88. package/development/image/image.d.ts.map +1 -1
  89. package/development/image.js +3 -19
  90. package/development/map-container.js +3 -2
  91. package/development/menu/menu/menu.d.ts +1 -0
  92. package/development/menu/menu/menu.d.ts.map +1 -1
  93. package/development/menu/menu.js +15 -11
  94. package/development/navigation/navigation-section.js +4 -14
  95. package/development/navigation/navigation.js +2 -7
  96. package/development/notification.js +3 -2
  97. package/development/paginator/paginator/paginator.d.ts +1 -5
  98. package/development/paginator/paginator/paginator.d.ts.map +1 -1
  99. package/development/paginator/paginator.js +19 -27
  100. package/development/popover/popover/popover.d.ts.map +1 -1
  101. package/development/popover/popover.js +9 -16
  102. package/development/radio-button/radio-button-panel/radio-button-panel.d.ts +1 -1
  103. package/development/radio-button/radio-button-panel/radio-button-panel.d.ts.map +1 -1
  104. package/development/radio-button/radio-button-panel.js +2 -2
  105. package/development/sbb-tokens-BdGhUJjM.js +33 -0
  106. package/development/select/select.d.ts +6 -5
  107. package/development/select/select.d.ts.map +1 -1
  108. package/development/select.js +23 -14
  109. package/development/slider/slider.d.ts +5 -0
  110. package/development/slider/slider.d.ts.map +1 -1
  111. package/development/slider.js +8 -1
  112. package/development/table/table-wrapper/table-wrapper.d.ts +1 -1
  113. package/development/table/table-wrapper/table-wrapper.d.ts.map +1 -1
  114. package/development/table/table-wrapper.js +1 -1
  115. package/development/timetable-occupancy-icon/timetable-occupancy-icon.d.ts +2 -1
  116. package/development/timetable-occupancy-icon/timetable-occupancy-icon.d.ts.map +1 -1
  117. package/development/timetable-occupancy-icon.js +11 -9
  118. package/development/toggle-check/toggle-check.d.ts +1 -1
  119. package/development/toggle-check/toggle-check.d.ts.map +1 -1
  120. package/development/toggle-check.js +2 -2
  121. package/dialog/dialog.js +1 -1
  122. package/expansion-panel/expansion-panel-header/expansion-panel-header.d.ts +2 -0
  123. package/expansion-panel/expansion-panel-header/expansion-panel-header.d.ts.map +1 -1
  124. package/expansion-panel/expansion-panel-header.js +25 -23
  125. package/file-selector/file-selector.d.ts +5 -0
  126. package/file-selector/file-selector.d.ts.map +1 -1
  127. package/file-selector.js +7 -0
  128. package/flip-card/flip-card/flip-card.d.ts +4 -0
  129. package/flip-card/flip-card/flip-card.d.ts.map +1 -1
  130. package/flip-card/flip-card-details.js +6 -6
  131. package/flip-card/flip-card-summary/flip-card-summary.d.ts +1 -1
  132. package/flip-card/flip-card-summary/flip-card-summary.d.ts.map +1 -1
  133. package/flip-card/flip-card-summary.js +8 -8
  134. package/flip-card/flip-card.js +56 -42
  135. package/icon/icon.d.ts +1 -1
  136. package/image/image.d.ts.map +1 -1
  137. package/image.js +46 -45
  138. package/map-container.js +7 -7
  139. package/menu/menu/menu.d.ts +1 -0
  140. package/menu/menu/menu.d.ts.map +1 -1
  141. package/menu/menu.js +45 -41
  142. package/navigation/navigation-section.js +7 -7
  143. package/navigation/navigation.js +8 -8
  144. package/package.json +1 -1
  145. package/paginator/paginator/paginator.d.ts +1 -5
  146. package/paginator/paginator/paginator.d.ts.map +1 -1
  147. package/paginator/paginator.js +50 -52
  148. package/popover/popover/popover.d.ts.map +1 -1
  149. package/popover/popover.js +42 -46
  150. package/radio-button/radio-button-panel/radio-button-panel.d.ts +1 -1
  151. package/radio-button/radio-button-panel/radio-button-panel.d.ts.map +1 -1
  152. package/radio-button/radio-button-panel.js +7 -7
  153. package/sbb-tokens-Dx20OtVg.js +18 -0
  154. package/select/select.d.ts +6 -5
  155. package/select/select.d.ts.map +1 -1
  156. package/select.js +55 -53
  157. package/slider/slider.d.ts +5 -0
  158. package/slider/slider.d.ts.map +1 -1
  159. package/slider.js +12 -5
  160. package/table/table-wrapper/table-wrapper.d.ts +1 -1
  161. package/table/table-wrapper/table-wrapper.d.ts.map +1 -1
  162. package/timetable-occupancy-icon/timetable-occupancy-icon.d.ts +2 -1
  163. package/timetable-occupancy-icon/timetable-occupancy-icon.d.ts.map +1 -1
  164. package/timetable-occupancy-icon.js +45 -44
  165. package/toggle-check/toggle-check.d.ts +1 -1
  166. package/toggle-check/toggle-check.d.ts.map +1 -1
  167. package/toggle-check.js +1 -1
package/icon/icon.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { PropertyValues, TemplateResult } from 'lit';
2
2
  import { SbbIconBase } from './icon-base.js';
3
3
  /**
4
- * It displays an icon loaded from a registered namespace.
4
+ * Displays an icon loaded from a registered namespace.
5
5
  */
6
6
  export declare class SbbIconElement extends SbbIconBase {
7
7
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"image.d.ts","sourceRoot":"","sources":["../../../src/elements/image/image.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"image.d.ts","sourceRoot":"","sources":["../../../src/elements/image/image.ts"],"names":[],"mappings":"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"}
package/image.js CHANGED
@@ -1,16 +1,17 @@
1
1
  var qt = (r) => {
2
2
  throw TypeError(r);
3
3
  };
4
- var Tt = (r, n, g) => n.has(r) || qt("Cannot " + g);
5
- var p = (r, n, g) => (Tt(r, n, "read from private field"), g ? g.call(r) : n.get(r)), h = (r, n, g) => n.has(r) ? qt("Cannot add the same private member more than once") : n instanceof WeakSet ? n.add(r) : n.set(r, g), s = (r, n, g, b) => (Tt(r, n, "write to private field"), b ? b.call(r, g) : n.set(r, g), g);
4
+ var Tt = (r, n, m) => n.has(r) || qt("Cannot " + m);
5
+ var p = (r, n, m) => (Tt(r, n, "read from private field"), m ? m.call(r) : n.get(r)), h = (r, n, m) => n.has(r) ? qt("Cannot add the same private member more than once") : n instanceof WeakSet ? n.add(r) : n.set(r, m), s = (r, n, m, b) => (Tt(r, n, "write to private field"), b ? b.call(r, m) : n.set(r, m), m);
6
6
  import { __esDecorate as c, __runInitializers as a } from "tslib";
7
- import { css as At, html as T, nothing as _, LitElement as Ut } from "lit";
8
- import { customElement as Vt, property as d, eventOptions as Kt } from "lit/decorators.js";
9
- import { ref as Wt } from "lit/directives/ref.js";
7
+ import { S as At, a as Ut, b as Vt, c as Kt, d as Wt, e as Nt, f as Zt, g as Gt, h as Jt, i as te, j as ee, k as ie, l as ae, m as se, n as re } from "./sbb-tokens-Dx20OtVg.js";
8
+ import { css as oe, html as T, nothing as _, LitElement as ne } from "lit";
9
+ import { customElement as ce, property as d, eventOptions as le } from "lit/decorators.js";
10
+ import { ref as pe } from "lit/directives/ref.js";
10
11
  import { forceType as u } from "./core/decorators.js";
11
- import { hostContext as Nt } from "./core/dom.js";
12
- const Zt = 0, Gt = 359, Jt = 360, te = 599, ee = 600, ie = 839, ae = 840, se = 1023, re = 1024, oe = 1279, ne = 1280, ce = 1439, le = 1440, pe = 2579, he = 16, de = At`*,:before,:after{box-sizing:border-box}:host{--sbb-image-border-radius: var(--sbb-border-radius-4x);--sbb-image-aspect-ratio: auto;--sbb-image-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-4x) );--sbb-image-object-fit: cover;display:block}:host([aspect-ratio="1-1"]){--sbb-image-aspect-ratio: 1 / 1}:host([aspect-ratio="1-2"]){--sbb-image-aspect-ratio: 1 / 2}:host([aspect-ratio="2-1"]){--sbb-image-aspect-ratio: 2 / 1}:host([aspect-ratio="2-3"]){--sbb-image-aspect-ratio: 2 / 3}:host([aspect-ratio="3-2"]){--sbb-image-aspect-ratio: 3 / 2}:host([aspect-ratio="3-4"]){--sbb-image-aspect-ratio: 3 / 4}:host([aspect-ratio="4-3"]){--sbb-image-aspect-ratio: 4 / 3}:host([aspect-ratio="4-5"]){--sbb-image-aspect-ratio: 4 / 5}:host([aspect-ratio="5-4"]){--sbb-image-aspect-ratio: 5 / 4}:host([aspect-ratio="16-9"]){--sbb-image-aspect-ratio: 16 / 9}:host([aspect-ratio="9-16"]){--sbb-image-aspect-ratio: 9 / 16}:host([data-teaser]){--sbb-image-aspect-ratio: 1 / 1}@media (min-width: 37.5rem){:host([data-teaser]){--sbb-image-aspect-ratio: 16 / 9}}:host(:is([border-radius=none],[data-teaser])){--sbb-image-border-radius: 0}:host([border-radius=round]:not([data-teaser])){--sbb-image-border-radius: var(--sbb-border-radius-infinity)}.sbb-image__figure{display:flex;flex-direction:column;gap:var(--sbb-spacing-fixed-4x);margin:0;height:100%}.sbb-image__img{opacity:.000001}:host([data-loaded]) .sbb-image__img{opacity:.999999}:host(:not([skip-lqip])) .sbb-image__img{position:absolute;top:0;right:0;bottom:0;left:0}:host([data-loaded]) .sbb-image__blurred{opacity:0}picture{display:contents}:is(.sbb-image__img,.sbb-image__blurred){width:100%;height:100%;object-fit:var(--sbb-image-object-fit);object-position:var(--sbb-image-object-position);transition:opacity var(--sbb-image-animation-duration) var(--sbb-animation-easing)}.sbb-image__wrapper{display:flex;position:relative;overflow:hidden;width:100%;height:100%;aspect-ratio:var(--sbb-image-aspect-ratio);border-radius:var(--sbb-image-border-radius)}.sbb-image__caption{--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)}`;
13
- var jt = Object.freeze, ge = Object.defineProperty, me = (r, n) => jt(ge(r, "raw", { value: jt(r.slice()) })), Xt;
12
+ import { hostContext as he } from "./core/dom.js";
13
+ const de = oe`*,:before,:after{box-sizing:border-box}:host{--sbb-image-border-radius: var(--sbb-border-radius-4x);--sbb-image-aspect-ratio: auto;--sbb-image-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-4x) );--sbb-image-object-fit: cover;display:block}:host([aspect-ratio="1-1"]){--sbb-image-aspect-ratio: 1 / 1}:host([aspect-ratio="1-2"]){--sbb-image-aspect-ratio: 1 / 2}:host([aspect-ratio="2-1"]){--sbb-image-aspect-ratio: 2 / 1}:host([aspect-ratio="2-3"]){--sbb-image-aspect-ratio: 2 / 3}:host([aspect-ratio="3-2"]){--sbb-image-aspect-ratio: 3 / 2}:host([aspect-ratio="3-4"]){--sbb-image-aspect-ratio: 3 / 4}:host([aspect-ratio="4-3"]){--sbb-image-aspect-ratio: 4 / 3}:host([aspect-ratio="4-5"]){--sbb-image-aspect-ratio: 4 / 5}:host([aspect-ratio="5-4"]){--sbb-image-aspect-ratio: 5 / 4}:host([aspect-ratio="16-9"]){--sbb-image-aspect-ratio: 16 / 9}:host([aspect-ratio="9-16"]){--sbb-image-aspect-ratio: 9 / 16}:host([data-teaser]){--sbb-image-aspect-ratio: 1 / 1}@media (min-width: 37.5rem){:host([data-teaser]){--sbb-image-aspect-ratio: 16 / 9}}:host(:is([border-radius=none],[data-teaser])){--sbb-image-border-radius: 0}:host([border-radius=round]:not([data-teaser])){--sbb-image-border-radius: var(--sbb-border-radius-infinity)}.sbb-image__figure{display:flex;flex-direction:column;gap:var(--sbb-spacing-fixed-4x);margin:0;height:100%}.sbb-image__img{opacity:.000001}:host([data-loaded]) .sbb-image__img{opacity:.999999}:host(:not([skip-lqip])) .sbb-image__img{position:absolute;top:0;right:0;bottom:0;left:0}:host([data-loaded]) .sbb-image__blurred{opacity:0}picture{display:contents}:is(.sbb-image__img,.sbb-image__blurred){width:100%;height:100%;object-fit:var(--sbb-image-object-fit);object-position:var(--sbb-image-object-position);transition:opacity var(--sbb-image-animation-duration) var(--sbb-animation-easing)}.sbb-image__wrapper{display:flex;position:relative;overflow:hidden;width:100%;height:100%;aspect-ratio:var(--sbb-image-aspect-ratio);border-radius:var(--sbb-image-border-radius)}.sbb-image__caption{--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)}`;
14
+ var jt = Object.freeze, me = Object.defineProperty, ge = (r, n) => jt(me(r, "raw", { value: jt(r.slice()) })), Xt;
14
15
  const be = (r) => {
15
16
  if (!r || r.length === 0)
16
17
  return [];
@@ -24,38 +25,38 @@ const be = (r) => {
24
25
  return [];
25
26
  if (!Array.isArray(n.breakpoints))
26
27
  return [];
27
- let g = !1, b = !1;
28
+ let m = !1, b = !1;
28
29
  const Q = ["image", "mediaQueries"];
29
30
  return n.breakpoints.forEach((j) => {
30
31
  const H = Object.keys(j);
31
32
  H.forEach((k) => {
32
- Q.includes(k) || (g = !0);
33
+ Q.includes(k) || (m = !0);
33
34
  }), Q.forEach((k) => {
34
35
  H.includes(k) || (b = !0);
35
36
  });
36
- }), g || b ? [] : n.breakpoints;
37
+ }), m || b ? [] : n.breakpoints;
37
38
  }, ue = {
38
39
  once: !0,
39
40
  passive: !0
40
- }, m = (r) => r / he, _e = {
41
- "sbb-breakpoint-zero-min": m(Zt),
42
- "sbb-breakpoint-zero-max": m(Gt),
43
- "sbb-breakpoint-micro-min": m(Jt),
44
- "sbb-breakpoint-micro-max": m(te),
45
- "sbb-breakpoint-small-min": m(ee),
46
- "sbb-breakpoint-small-max": m(ie),
47
- "sbb-breakpoint-medium-min": m(ae),
48
- "sbb-breakpoint-medium-max": m(se),
49
- "sbb-breakpoint-large-min": m(re),
50
- "sbb-breakpoint-large-max": m(oe),
51
- "sbb-breakpoint-wide-min": m(ne),
52
- "sbb-breakpoint-wide-max": m(ce),
53
- "sbb-breakpoint-ultra-min": m(le),
54
- "sbb-breakpoint-ultra-max": m(pe)
41
+ }, g = (r) => r / At, _e = {
42
+ "sbb-breakpoint-zero-min": g(Ut),
43
+ "sbb-breakpoint-zero-max": g(Vt),
44
+ "sbb-breakpoint-micro-min": g(Kt),
45
+ "sbb-breakpoint-micro-max": g(Wt),
46
+ "sbb-breakpoint-small-min": g(Nt),
47
+ "sbb-breakpoint-small-max": g(Zt),
48
+ "sbb-breakpoint-medium-min": g(Gt),
49
+ "sbb-breakpoint-medium-max": g(Jt),
50
+ "sbb-breakpoint-large-min": g(te),
51
+ "sbb-breakpoint-large-max": g(ee),
52
+ "sbb-breakpoint-wide-min": g(ie),
53
+ "sbb-breakpoint-wide-max": g(ae),
54
+ "sbb-breakpoint-ultra-min": g(se),
55
+ "sbb-breakpoint-ultra-max": g(re)
55
56
  };
56
- let $e = (() => {
57
- var y, z, P, v, x, S, $, M, w, I, L, C, R, D, F, B, E, o;
58
- let r = [Vt("sbb-image")], n, g = [], b, Q = Ut, j = [], H, k = [], X = [], Y, A = [], U = [], V, K = [], W = [], N, Z = [], G = [], J, tt = [], et = [], it, at = [], st = [], rt, ot = [], nt = [], ct, lt = [], pt = [], ht, dt = [], gt = [], mt, bt = [], ut = [], _t, ft = [], kt = [], yt, zt = [], Pt = [], vt, xt = [], St = [], $t, Mt = [], wt = [], It, Lt = [], Ct = [], Rt, Dt = [], Ft = [], Bt, Et = [], Qt = [], Ht;
57
+ let Me = (() => {
58
+ var y, z, P, v, S, x, $, M, w, I, L, C, R, D, F, B, E, o;
59
+ let r = [ce("sbb-image")], n, m = [], b, Q = ne, j = [], H, k = [], X = [], Y, A = [], U = [], V, K = [], W = [], N, Z = [], G = [], J, tt = [], et = [], it, at = [], st = [], rt, ot = [], nt = [], ct, lt = [], pt = [], ht, dt = [], mt = [], gt, bt = [], ut = [], _t, ft = [], kt = [], yt, zt = [], Pt = [], vt, St = [], xt = [], $t, Mt = [], wt = [], It, Lt = [], Ct = [], Rt, Dt = [], Ft = [], Bt, Et = [], Qt = [], Ht;
59
60
  return o = class extends Q {
60
61
  constructor() {
61
62
  super(...arguments);
@@ -63,8 +64,8 @@ let $e = (() => {
63
64
  h(this, z);
64
65
  h(this, P);
65
66
  h(this, v);
66
- h(this, x);
67
67
  h(this, S);
68
+ h(this, x);
68
69
  h(this, $);
69
70
  h(this, M);
70
71
  h(this, w);
@@ -79,7 +80,7 @@ let $e = (() => {
79
80
  this._captionElement = a(this, j), this._config = {
80
81
  nonRetinaQuality: "45",
81
82
  retinaQuality: "20"
82
- }, s(this, y, a(this, k, "")), s(this, z, (a(this, X), a(this, A, !1))), s(this, P, (a(this, U), a(this, K, ""))), s(this, v, (a(this, W), a(this, Z, ""))), s(this, x, (a(this, G), a(this, tt, "Organization"))), s(this, S, (a(this, et), a(this, at, !1))), s(this, $, (a(this, st), a(this, ot, "auto"))), s(this, M, (a(this, nt), a(this, lt, !1))), s(this, w, (a(this, pt), a(this, dt, 1))), s(this, I, (a(this, gt), a(this, bt, 1))), s(this, L, (a(this, ut), a(this, ft, ""))), s(this, C, (a(this, kt), a(this, zt, "high"))), s(this, R, (a(this, Pt), a(this, xt, "eager"))), s(this, D, (a(this, St), a(this, Mt, ""))), s(this, F, (a(this, wt), a(this, Lt, ""))), s(this, B, (a(this, Ct), a(this, Dt, "default"))), s(this, E, (a(this, Ft), a(this, Et, "16-9"))), a(this, Qt);
83
+ }, s(this, y, a(this, k, "")), s(this, z, (a(this, X), a(this, A, !1))), s(this, P, (a(this, U), a(this, K, ""))), s(this, v, (a(this, W), a(this, Z, ""))), s(this, S, (a(this, G), a(this, tt, "Organization"))), s(this, x, (a(this, et), a(this, at, !1))), s(this, $, (a(this, st), a(this, ot, "auto"))), s(this, M, (a(this, nt), a(this, lt, !1))), s(this, w, (a(this, pt), a(this, dt, 1))), s(this, I, (a(this, mt), a(this, bt, 1))), s(this, L, (a(this, ut), a(this, ft, ""))), s(this, C, (a(this, kt), a(this, zt, "high"))), s(this, R, (a(this, Pt), a(this, St, "eager"))), s(this, D, (a(this, xt), a(this, Mt, ""))), s(this, F, (a(this, wt), a(this, Lt, ""))), s(this, B, (a(this, Ct), a(this, Dt, "default"))), s(this, E, (a(this, Ft), a(this, Et, "16-9"))), a(this, Qt);
83
84
  }
84
85
  /**
85
86
  * An alt text is not always necessary (e.g. in teaser cards when
@@ -134,10 +135,10 @@ let $e = (() => {
134
135
  * Copyright holder can either be an Organization or a Person
135
136
  */
136
137
  get copyrightHolder() {
137
- return p(this, x);
138
+ return p(this, S);
138
139
  }
139
140
  set copyrightHolder(e) {
140
- s(this, x, e);
141
+ s(this, S, e);
141
142
  }
142
143
  /**
143
144
  * Set this to true, if you want to pass a custom focal point
@@ -145,10 +146,10 @@ let $e = (() => {
145
146
  * https://docs.imgix.com/apis/rendering/focalpoint-crop
146
147
  */
147
148
  get customFocalPoint() {
148
- return p(this, S);
149
+ return p(this, x);
149
150
  }
150
151
  set customFocalPoint(e) {
151
- s(this, S, e);
152
+ s(this, x, e);
152
153
  }
153
154
  /**
154
155
  * If the lazy property is set to true, the module will automatically
@@ -357,7 +358,7 @@ let $e = (() => {
357
358
  return ((i = (t = (e = this.shadowRoot) == null ? void 0 : e.querySelector) == null ? void 0 : t.call(e, ".sbb-image__img")) == null ? void 0 : i.complete) ?? !1;
358
359
  }
359
360
  connectedCallback() {
360
- super.connectedCallback(), this.toggleAttribute("data-teaser", !!Nt("sbb-teaser-hero", this) || !!this.closest("sbb-teaser-paid"));
361
+ super.connectedCallback(), this.toggleAttribute("data-teaser", !!he("sbb-teaser-hero", this) || !!this.closest("sbb-teaser-paid"));
361
362
  }
362
363
  updated(e) {
363
364
  super.updated(e), this._captionElement && (this._linksInCaption = this._captionElement.querySelectorAll("a"), this._linksInCaption && this._addFocusAbilityToLinksInCaption());
@@ -507,17 +508,17 @@ let $e = (() => {
507
508
  ${e ? T`<figcaption
508
509
  class="sbb-image__caption"
509
510
  .innerHTML=${e}
510
- ${Wt((f) => {
511
+ ${pe((f) => {
511
512
  this._captionElement = f;
512
513
  })}
513
514
  ></figcaption>` : _}
514
- ${t ? T(Xt || (Xt = me(['<script type="application/ld+json" .innerHTML=', "><\/script>"])), t) : _}
515
+ ${t ? T(Xt || (Xt = ge(['<script type="application/ld+json" .innerHTML=', "><\/script>"])), t) : _}
515
516
  </figure>
516
517
  `;
517
518
  }
518
- }, y = new WeakMap(), z = new WeakMap(), P = new WeakMap(), v = new WeakMap(), x = new WeakMap(), S = new WeakMap(), $ = new WeakMap(), M = new WeakMap(), w = new WeakMap(), I = new WeakMap(), L = new WeakMap(), C = new WeakMap(), R = new WeakMap(), D = new WeakMap(), F = new WeakMap(), B = new WeakMap(), E = new WeakMap(), b = o, (() => {
519
+ }, y = new WeakMap(), z = new WeakMap(), P = new WeakMap(), v = new WeakMap(), S = new WeakMap(), x = new WeakMap(), $ = new WeakMap(), M = new WeakMap(), w = new WeakMap(), I = new WeakMap(), L = new WeakMap(), C = new WeakMap(), R = new WeakMap(), D = new WeakMap(), F = new WeakMap(), B = new WeakMap(), E = new WeakMap(), b = o, (() => {
519
520
  const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(Q[Symbol.metadata] ?? null) : void 0;
520
- H = [u(), d()], Y = [u(), d({ attribute: "skip-lqip", type: Boolean, reflect: !0 })], V = [u(), d()], N = [u(), d()], J = [d({ attribute: "copyright-holder" })], it = [u(), d({ attribute: "custom-focal-point", type: Boolean })], rt = [d()], ct = [u(), d({ attribute: "focal-point-debug", type: Boolean })], ht = [u(), d({ attribute: "focal-point-x", type: Number })], mt = [u(), d({ attribute: "focal-point-y", type: Number })], _t = [u(), d({ attribute: "image-src" })], yt = [d()], vt = [d()], $t = [u(), d({ attribute: "performance-mark" })], It = [u(), d({ attribute: "picture-sizes-config" })], Rt = [d({ attribute: "border-radius", reflect: !0 })], Bt = [d({ attribute: "aspect-ratio", reflect: !0 })], Ht = [Kt(ue)], c(o, null, H, { kind: "accessor", name: "alt", static: !1, private: !1, access: { has: (t) => "alt" in t, get: (t) => t.alt, set: (t, i) => {
521
+ H = [u(), d()], Y = [u(), d({ attribute: "skip-lqip", type: Boolean, reflect: !0 })], V = [u(), d()], N = [u(), d()], J = [d({ attribute: "copyright-holder" })], it = [u(), d({ attribute: "custom-focal-point", type: Boolean })], rt = [d()], ct = [u(), d({ attribute: "focal-point-debug", type: Boolean })], ht = [u(), d({ attribute: "focal-point-x", type: Number })], gt = [u(), d({ attribute: "focal-point-y", type: Number })], _t = [u(), d({ attribute: "image-src" })], yt = [d()], vt = [d()], $t = [u(), d({ attribute: "performance-mark" })], It = [u(), d({ attribute: "picture-sizes-config" })], Rt = [d({ attribute: "border-radius", reflect: !0 })], Bt = [d({ attribute: "aspect-ratio", reflect: !0 })], Ht = [le(ue)], c(o, null, H, { kind: "accessor", name: "alt", static: !1, private: !1, access: { has: (t) => "alt" in t, get: (t) => t.alt, set: (t, i) => {
521
522
  t.alt = i;
522
523
  } }, metadata: e }, k, X), c(o, null, Y, { kind: "accessor", name: "skipLqip", static: !1, private: !1, access: { has: (t) => "skipLqip" in t, get: (t) => t.skipLqip, set: (t, i) => {
523
524
  t.skipLqip = i;
@@ -535,7 +536,7 @@ let $e = (() => {
535
536
  t.focalPointDebug = i;
536
537
  } }, metadata: e }, lt, pt), c(o, null, ht, { kind: "accessor", name: "focalPointX", static: !1, private: !1, access: { has: (t) => "focalPointX" in t, get: (t) => t.focalPointX, set: (t, i) => {
537
538
  t.focalPointX = i;
538
- } }, metadata: e }, dt, gt), c(o, null, mt, { kind: "accessor", name: "focalPointY", static: !1, private: !1, access: { has: (t) => "focalPointY" in t, get: (t) => t.focalPointY, set: (t, i) => {
539
+ } }, metadata: e }, dt, mt), c(o, null, gt, { kind: "accessor", name: "focalPointY", static: !1, private: !1, access: { has: (t) => "focalPointY" in t, get: (t) => t.focalPointY, set: (t, i) => {
539
540
  t.focalPointY = i;
540
541
  } }, metadata: e }, bt, ut), c(o, null, _t, { kind: "accessor", name: "imageSrc", static: !1, private: !1, access: { has: (t) => "imageSrc" in t, get: (t) => t.imageSrc, set: (t, i) => {
541
542
  t.imageSrc = i;
@@ -543,7 +544,7 @@ let $e = (() => {
543
544
  t.importance = i;
544
545
  } }, metadata: e }, zt, Pt), c(o, null, vt, { kind: "accessor", name: "loading", static: !1, private: !1, access: { has: (t) => "loading" in t, get: (t) => t.loading, set: (t, i) => {
545
546
  t.loading = i;
546
- } }, metadata: e }, xt, St), c(o, null, $t, { kind: "accessor", name: "performanceMark", static: !1, private: !1, access: { has: (t) => "performanceMark" in t, get: (t) => t.performanceMark, set: (t, i) => {
547
+ } }, metadata: e }, St, xt), c(o, null, $t, { kind: "accessor", name: "performanceMark", static: !1, private: !1, access: { has: (t) => "performanceMark" in t, get: (t) => t.performanceMark, set: (t, i) => {
547
548
  t.performanceMark = i;
548
549
  } }, metadata: e }, Mt, wt), c(o, null, It, { kind: "accessor", name: "pictureSizesConfig", static: !1, private: !1, access: { has: (t) => "pictureSizesConfig" in t, get: (t) => t.pictureSizesConfig, set: (t, i) => {
549
550
  t.pictureSizesConfig = i;
@@ -551,12 +552,12 @@ let $e = (() => {
551
552
  t.borderRadius = i;
552
553
  } }, metadata: e }, Dt, Ft), c(o, null, Bt, { kind: "accessor", name: "aspectRatio", static: !1, private: !1, access: { has: (t) => "aspectRatio" in t, get: (t) => t.aspectRatio, set: (t, i) => {
553
554
  t.aspectRatio = i;
554
- } }, metadata: e }, Et, Qt), c(o, null, Ht, { kind: "method", name: "_imageLoaded", static: !1, private: !1, access: { has: (t) => "_imageLoaded" in t, get: (t) => t._imageLoaded }, metadata: e }, null, j), c(null, n = { value: b }, r, { kind: "class", name: b.name, metadata: e }, null, g), b = n.value, e && Object.defineProperty(b, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
555
+ } }, metadata: e }, Et, Qt), c(o, null, Ht, { kind: "method", name: "_imageLoaded", static: !1, private: !1, access: { has: (t) => "_imageLoaded" in t, get: (t) => t._imageLoaded }, metadata: e }, null, j), c(null, n = { value: b }, r, { kind: "class", name: b.name, metadata: e }, null, m), b = n.value, e && Object.defineProperty(b, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
555
556
  })(), o.styles = de, o.events = {
556
557
  error: "error",
557
558
  load: "load"
558
- }, a(b, g), b;
559
+ }, a(b, m), b;
559
560
  })();
560
561
  export {
561
- $e as SbbImageElement
562
+ Me as SbbImageElement
562
563
  };
package/map-container.js CHANGED
@@ -4,23 +4,23 @@ var y = (a) => {
4
4
  var B = (a, i, o) => i.has(a) || y("Cannot " + o);
5
5
  var m = (a, i, o) => (B(a, i, "read from private field"), o ? o.call(a) : i.get(a)), p = (a, i, o) => i.has(a) ? y("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(a) : i.set(a, o), c = (a, i, o, s) => (B(a, i, "write to private field"), s ? s.call(a, o) : i.set(a, o), o);
6
6
  import { __runInitializers as d, __esDecorate as u } from "tslib";
7
- import { IntersectionController as S } from "@lit-labs/observers/intersection-controller.js";
8
- import { css as x, html as U, nothing as V, LitElement as z } from "lit";
7
+ import { IntersectionController as x } from "@lit-labs/observers/intersection-controller.js";
8
+ import { css as S, html as U, nothing as V, LitElement as z } from "lit";
9
9
  import { customElement as I, property as C, state as E } from "lit/decorators.js";
10
10
  import { SbbLanguageController as O } from "./core/controllers.js";
11
11
  import { forceType as $ } from "./core/decorators.js";
12
12
  import { i18nMapContainerButtonLabel as D } from "./core/i18n.js";
13
13
  import "./button/tertiary-button.js";
14
- const L = x`*,:before,:after{box-sizing:border-box}:host{display:block;--sbb-map-container-map-height-zero: 18.4375rem;--sbb-map-container-map-height-small: 20rem;--sbb-map-container-sidebar-width: 25rem;--sbb-map-container-sidebar-background-color: var(--sbb-color-white);--sbb-map-container-border-radius: var(--sbb-border-radius-4x);--sbb-map-container-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-4x) );--sbb-map-container-map-height: calc( var(--sbb-map-container-map-height-zero) + var(--sbb-map-container-border-radius) );--sbb-map-container-mobile-sticky-block-start: 0}@media (min-width: 37.5rem){:host{--sbb-map-container-map-height: calc( var(--sbb-map-container-map-height-small) + var(--sbb-map-container-border-radius) )}}@media (min-width: 80rem){:host{--sbb-map-container-sidebar-width: 30rem}}.sbb-map-container{display:grid;grid-template-rows:auto auto}@media (min-width: 52.5rem){.sbb-map-container{grid-template-columns:max(var(--sbb-map-container-sidebar-width)) calc(100% - var(--sbb-map-container-sidebar-width));height:calc(100vh - var(--sbb-map-container-margin-start, var(--sbb-header-height)))}}.sbb-map-container__sidebar-button{position:fixed;left:50%;inset-block-end:var(--sbb-spacing-fixed-5x);visibility:hidden;opacity:0;transform:translate(-50%) translateY(calc(100% + var(--sbb-spacing-fixed-5x)));transition:opacity var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),visibility var(--sbb-map-container-animation-duration) var(--sbb-animation-easing) var(--sbb-map-container-animation-duration),transform var(--sbb-map-container-animation-duration) var(--sbb-animation-easing)}:host([data-scroll-up-button-visible]) .sbb-map-container__sidebar-button{transition:visibility var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),opacity var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),transform var(--sbb-map-container-animation-duration) ease-out;visibility:visible;opacity:1;transform:translate(-50%) translateY(0)}@media (min-width: 52.5rem){.sbb-map-container__sidebar-button{display:none}}.sbb-map-container__sidebar{--sbb-scrollbar-thumb-width: .5rem;--sbb-scrollbar-thumb-width-hover: var(--sbb-scrollbar-thumb-width);--sbb-scrollbar-width-firefox: auto;--sbb-scrollbar-color: var(--sbb-color-black-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-black-alpha-60);--sbb-scrollbar-track-color: var(--sbb-color-cloud);--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-map-container__sidebar::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-map-container__sidebar::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-map-container__sidebar::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-map-container__sidebar::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-map-container__sidebar::-webkit-scrollbar-button,.sbb-map-container__sidebar::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-map-container__sidebar{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-map-container__sidebar{grid-column:1/3;grid-row:2/3;width:100%;overflow:hidden auto;position:relative;border-start-end-radius:var(--sbb-map-container-border-radius);border-start-start-radius:var(--sbb-map-container-border-radius);margin-block-start:calc(var(--sbb-map-container-border-radius) * -1);background-color:var(--sbb-map-container-sidebar-background-color)}@media (min-width: 52.5rem){.sbb-map-container__sidebar{grid-column:1/2;grid-row:1/3;border-radius:0;margin-block-start:0;border-block-start:var(--sbb-border-width-1x) solid var(--sbb-color-cloud)}}.sbb-map-container__map{position:sticky;inset-block-start:0;inset-inline:0;grid-row:1/2;grid-column:1/3}@media (max-width: 52.4375rem){.sbb-map-container__map{inset-block-start:var(--sbb-map-container-mobile-sticky-block-start);height:var(--sbb-map-container-map-height)}}@media (min-width: 52.5rem){.sbb-map-container__map{grid-row:1/3;grid-column:2/3;position:relative}}`;
14
+ const L = S`*,:before,:after{box-sizing:border-box}:host{display:block;--sbb-map-container-map-height-zero: 18.4375rem;--sbb-map-container-map-height-small: 20rem;--sbb-map-container-sidebar-width: 25rem;--sbb-map-container-sidebar-background-color: var(--sbb-color-white);--sbb-map-container-border-radius: var(--sbb-border-radius-4x);--sbb-map-container-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-4x) );--sbb-map-container-map-height: calc( var(--sbb-map-container-map-height-zero) + var(--sbb-map-container-border-radius) );--sbb-map-container-mobile-sticky-block-start: 0}@media (min-width: 37.5rem){:host{--sbb-map-container-map-height: calc( var(--sbb-map-container-map-height-small) + var(--sbb-map-container-border-radius) )}}@media (min-width: 80rem){:host{--sbb-map-container-sidebar-width: 30rem}}.sbb-map-container{display:grid;grid-template-rows:auto auto}@media (min-width: 52.5rem){.sbb-map-container{grid-template-columns:max(var(--sbb-map-container-sidebar-width)) calc(100% - var(--sbb-map-container-sidebar-width));position:fixed;inset:var(--sbb-map-container-margin-start, var(--sbb-header-height)) 0 0 0}}.sbb-map-container__sidebar-button{position:fixed;left:50%;inset-block-end:var(--sbb-spacing-fixed-5x);visibility:hidden;opacity:0;transform:translate(-50%) translateY(calc(100% + var(--sbb-spacing-fixed-5x)));transition:opacity var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),visibility var(--sbb-map-container-animation-duration) var(--sbb-animation-easing) var(--sbb-map-container-animation-duration),transform var(--sbb-map-container-animation-duration) var(--sbb-animation-easing)}:host([data-scroll-up-button-visible]) .sbb-map-container__sidebar-button{transition:visibility var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),opacity var(--sbb-map-container-animation-duration) var(--sbb-animation-easing),transform var(--sbb-map-container-animation-duration) ease-out;visibility:visible;opacity:1;transform:translate(-50%) translateY(0)}@media (min-width: 52.5rem){.sbb-map-container__sidebar-button{display:none}}.sbb-map-container__sidebar{--sbb-scrollbar-thumb-width: .5rem;--sbb-scrollbar-thumb-width-hover: var(--sbb-scrollbar-thumb-width);--sbb-scrollbar-width-firefox: auto;--sbb-scrollbar-color: var(--sbb-color-black-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-black-alpha-60);--sbb-scrollbar-track-color: var(--sbb-color-cloud);--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-map-container__sidebar::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-map-container__sidebar::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-map-container__sidebar::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-map-container__sidebar::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-map-container__sidebar::-webkit-scrollbar-button,.sbb-map-container__sidebar::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-map-container__sidebar{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-map-container__sidebar{grid-column:1/3;grid-row:2/3;width:100%;overflow:hidden auto;position:relative;border-start-end-radius:var(--sbb-map-container-border-radius);border-start-start-radius:var(--sbb-map-container-border-radius);margin-block-start:calc(var(--sbb-map-container-border-radius) * -1);background-color:var(--sbb-map-container-sidebar-background-color)}@media (min-width: 52.5rem){.sbb-map-container__sidebar{grid-column:1/2;grid-row:1/3;border-radius:0;margin-block-start:0;border-block-start:var(--sbb-border-width-1x) solid var(--sbb-color-cloud)}}.sbb-map-container__map{position:sticky;inset-block-start:0;inset-inline:0;grid-row:1/2;grid-column:1/3}@media (max-width: 52.4375rem){.sbb-map-container__map{inset-block-start:var(--sbb-map-container-mobile-sticky-block-start);height:var(--sbb-map-container-map-height)}}@media (min-width: 52.5rem){.sbb-map-container__map{grid-row:1/3;grid-column:2/3;position:relative}}`;
15
15
  let J = (() => {
16
16
  var b, n, e;
17
- let a = [I("sbb-map-container")], i, o = [], s, h = z, v, _ = [], g = [], w, f = [], k = [];
17
+ let a = [I("sbb-map-container")], i, o = [], s, h = z, _, v = [], g = [], w, f = [], k = [];
18
18
  return e = class extends h {
19
19
  constructor() {
20
20
  super(...arguments);
21
21
  p(this, b);
22
22
  p(this, n);
23
- c(this, b, d(this, _, !1)), c(this, n, (d(this, g), d(this, f, !1))), this._language = (d(this, k), new O(this)), this._observer = new S(this, {
23
+ c(this, b, d(this, v, !1)), c(this, n, (d(this, g), d(this, f, !1))), this._language = (d(this, k), new O(this)), this._observer = new x(this, {
24
24
  target: null,
25
25
  callback: (r) => this._toggleButtonVisibilityOnIntersect(r)
26
26
  });
@@ -96,9 +96,9 @@ let J = (() => {
96
96
  }
97
97
  }, b = new WeakMap(), n = new WeakMap(), s = e, (() => {
98
98
  const r = typeof Symbol == "function" && Symbol.metadata ? Object.create(h[Symbol.metadata] ?? null) : void 0;
99
- v = [$(), C({ attribute: "hide-scroll-up-button", reflect: !0, type: Boolean })], w = [E()], u(e, null, v, { kind: "accessor", name: "hideScrollUpButton", static: !1, private: !1, access: { has: (t) => "hideScrollUpButton" in t, get: (t) => t.hideScrollUpButton, set: (t, l) => {
99
+ _ = [$(), C({ attribute: "hide-scroll-up-button", reflect: !0, type: Boolean })], w = [E()], u(e, null, _, { kind: "accessor", name: "hideScrollUpButton", static: !1, private: !1, access: { has: (t) => "hideScrollUpButton" in t, get: (t) => t.hideScrollUpButton, set: (t, l) => {
100
100
  t.hideScrollUpButton = l;
101
- } }, metadata: r }, _, g), u(e, null, w, { kind: "accessor", name: "_scrollUpButtonVisible", static: !1, private: !1, access: { has: (t) => "_scrollUpButtonVisible" in t, get: (t) => t._scrollUpButtonVisible, set: (t, l) => {
101
+ } }, metadata: r }, v, g), u(e, null, w, { kind: "accessor", name: "_scrollUpButtonVisible", static: !1, private: !1, access: { has: (t) => "_scrollUpButtonVisible" in t, get: (t) => t._scrollUpButtonVisible, set: (t, l) => {
102
102
  t._scrollUpButtonVisible = l;
103
103
  } }, metadata: r }, f, k), u(null, i = { value: s }, a, { kind: "class", name: s.name, metadata: r }, null, o), s = i.value, r && Object.defineProperty(s, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: r });
104
104
  })(), e.styles = L, d(s, o), s;
@@ -39,6 +39,7 @@ export declare class SbbMenuElement extends SbbMenuElement_base {
39
39
  private _focusHandler;
40
40
  private _scrollHandler;
41
41
  private _inertController;
42
+ private _mediaMatcher;
42
43
  /**
43
44
  * Opens the menu on trigger click.
44
45
  */
@@ -1 +1 @@
1
- {"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../../src/elements/menu/menu/menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAQ,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAYrE,OAAO,EAAE,uBAAuB,EAAE,MAAM,6BAA6B,CAAC;AAWtE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;;AAkB1D;;;;;;;;;;;GAWG;AACH,qBAEM,cAAe,SAAQ,mBAGH;IACxB,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,mBAA4B,mBAAmB,WAAwC;IAEvF;;;OAGG;IACH,IACW,OAAO,CAAC,KAAK,EAAE,MAAM,GAAG,WAAW,GAAG,IAAI,EAIpD;IACD,IAAW,OAAO,IAAI,MAAM,GAAG,WAAW,GAAG,IAAI,CAEhD;IACD,OAAO,CAAC,QAAQ,CAAqC;IAErD;;;OAGG;IACH,SAEgB,sBAAsB,EAAE,MAAM,CAAM;IAEpD,OAAO,CAAC,KAAK,CAAkB;IAC/B,OAAO,CAAC,eAAe,CAA4B;IACnD,OAAO,CAAC,yBAAyB,CAAkB;IACnD,OAAO,CAAC,eAAe,CAAmB;IAC1C,OAAO,CAAC,uBAAuB,CAAmB;IAClD,OAAO,CAAC,MAAM,CAAyC;IACvD,OAAO,CAAC,aAAa,CAAyB;IAC9C,OAAO,CAAC,cAAc,CAA0B;IAChD,OAAO,CAAC,gBAAgB,CAAgC;IAExD;;OAEG;IACI,IAAI,IAAI,IAAI;IAmBnB;;OAEG;IACI,KAAK,IAAI,IAAI;IAapB;;OAEG;IACH,OAAO,CAAC,QAAQ;IAOhB,OAAO,CAAC,cAAc;YAqBR,eAAe;IAY7B,OAAO,CAAC,2BAA2B;IAWnB,iBAAiB,IAAI,IAAI;IAgBzB,oBAAoB,IAAI,IAAI;IAQ5C,OAAO,CAAC,cAAc;IAmBtB,OAAO,CAAC,UAAU;IAsBlB,OAAO,CAAC,mBAAmB;IAwB3B,OAAO,CAAC,+BAA+B;IAQvC,OAAO,CAAC,oBAAoB,CAE1B;IAGF,OAAO,CAAC,qBAAqB,CAI3B;IAMF,OAAO,CAAC,mBAAmB;IA8B3B,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,gBAAgB;cAyBL,MAAM,IAAI,cAAc;CAqB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,UAAU,EAAE,cAAc,CAAC;KAC5B;CACF"}
1
+ {"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../../src/elements/menu/menu/menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAQ,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAYrE,OAAO,EAAE,uBAAuB,EAAE,MAAM,6BAA6B,CAAC;AAgBtE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;;AAkB1D;;;;;;;;;;;GAWG;AACH,qBAEM,cAAe,SAAQ,mBAGH;IACxB,OAAuB,MAAM,EAAE,cAAc,CAAS;IACtD,mBAA4B,mBAAmB,WAAwC;IAEvF;;;OAGG;IACH,IACW,OAAO,CAAC,KAAK,EAAE,MAAM,GAAG,WAAW,GAAG,IAAI,EAIpD;IACD,IAAW,OAAO,IAAI,MAAM,GAAG,WAAW,GAAG,IAAI,CAEhD;IACD,OAAO,CAAC,QAAQ,CAAqC;IAErD;;;OAGG;IACH,SAEgB,sBAAsB,EAAE,MAAM,CAAM;IAEpD,OAAO,CAAC,KAAK,CAAkB;IAC/B,OAAO,CAAC,eAAe,CAA4B;IACnD,OAAO,CAAC,yBAAyB,CAAkB;IACnD,OAAO,CAAC,eAAe,CAAmB;IAC1C,OAAO,CAAC,uBAAuB,CAAmB;IAClD,OAAO,CAAC,MAAM,CAAyC;IACvD,OAAO,CAAC,aAAa,CAAyB;IAC9C,OAAO,CAAC,cAAc,CAA0B;IAChD,OAAO,CAAC,gBAAgB,CAAgC;IACxD,OAAO,CAAC,aAAa,CAQlB;IAEH;;OAEG;IACI,IAAI,IAAI,IAAI;IAmBnB;;OAEG;IACI,KAAK,IAAI,IAAI;IAapB;;OAEG;IACH,OAAO,CAAC,QAAQ;IAOhB,OAAO,CAAC,cAAc;YAqBR,eAAe;IAY7B,OAAO,CAAC,2BAA2B;IAWnB,iBAAiB,IAAI,IAAI;IAgBzB,oBAAoB,IAAI,IAAI;IAQ5C,OAAO,CAAC,cAAc;IAmBtB,OAAO,CAAC,UAAU;IAsBlB,OAAO,CAAC,mBAAmB;IAwB3B,OAAO,CAAC,+BAA+B;IAQvC,OAAO,CAAC,oBAAoB,CAE1B;IAGF,OAAO,CAAC,qBAAqB,CAI3B;IAMF,OAAO,CAAC,mBAAmB;IA8B3B,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,gBAAgB;cAyBL,MAAM,IAAI,cAAc;CAqB5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAE7B,UAAU,EAAE,cAAc,CAAC;KAC5B;CACF"}
package/menu/menu.js CHANGED
@@ -1,20 +1,20 @@
1
- var w = (s) => {
1
+ var y = (s) => {
2
2
  throw TypeError(s);
3
3
  };
4
- var y = (s, n, r) => n.has(s) || w("Cannot " + r);
5
- var k = (s, n, r) => (y(s, n, "read from private field"), r ? r.call(s) : n.get(s)), x = (s, n, r) => n.has(s) ? w("Cannot add the same private member more than once") : n instanceof WeakSet ? n.add(s) : n.set(s, r), m = (s, n, r, o) => (y(s, n, "write to private field"), o ? o.call(s, r) : n.set(s, r), r);
6
- import { __runInitializers as d, __esDecorate as h } from "tslib";
7
- import { css as N, html as E } from "lit";
8
- import { customElement as O, property as C } from "lit/decorators.js";
4
+ var k = (s, n, r) => n.has(s) || y("Cannot " + r);
5
+ var x = (s, n, r) => (k(s, n, "read from private field"), r ? r.call(s) : n.get(s)), E = (s, n, r) => n.has(s) ? y("Cannot add the same private member more than once") : n instanceof WeakSet ? n.add(s) : n.set(s, r), h = (s, n, r, o) => (k(s, n, "write to private field"), o ? o.call(s, r) : n.set(s, r), r);
6
+ import { __runInitializers as d, __esDecorate as m } from "tslib";
7
+ import { css as N, html as C } from "lit";
8
+ import { customElement as O, property as L } from "lit/decorators.js";
9
9
  import { ref as B } from "lit/directives/ref.js";
10
- import { SbbFocusHandler as T, isArrowKeyPressed as I, interactivityChecker as M, getNextElementIndex as P, setModalityOnNextFocus as L, IS_FOCUSABLE_QUERY as z } from "../core/a11y.js";
11
- import { SbbOpenCloseBaseElement as K } from "../core/base-elements.js";
12
- import { SbbConnectedAbortController as D, SbbInertController as H } from "../core/controllers.js";
13
- import { forceType as F } from "../core/decorators.js";
14
- import { SbbScrollHandler as U, isBreakpoint as A, findReferencedElement as $ } from "../core/dom.js";
15
- import { SbbNamedSlotListMixin as R } from "../core/mixins.js";
16
- import { isEventOnElement as S, removeAriaOverlayTriggerAttributes as Y, setAriaOverlayTriggerAttributes as q, getElementPosition as V } from "../core/overlay.js";
17
- const j = N`*,:before,:after{box-sizing:border-box}:host{display:contents;--sbb-menu-position-x: 0;--sbb-menu-position-y: 0;--sbb-menu-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-6x) );--sbb-menu-animation-easing: ease;--sbb-menu-transform: translateY(100%);--sbb-menu-max-width: 100%;--sbb-menu-min-width: 100%;--sbb-menu-inset: 0 auto auto 0;--sbb-menu-container-height: 100vh;--sbb-menu-max-height: calc(85vh - var(--sbb-spacing-fixed-8x));--sbb-menu-min-height: 3.03125rem;--sbb-menu-border-radius: var(--sbb-border-radius-4x);--sbb-menu-visibility: hidden;--sbb-menu-backdrop-color: transparent}@supports (height: 100dvh){:host{--sbb-menu-container-height: 100dvh}}@media (min-width: 52.5rem){:host{--sbb-menu-transform: translateY(var(--sbb-spacing-fixed-2x));--sbb-menu-max-width: 20rem;--sbb-menu-min-width: 11.25rem}}:host(:is([data-state=opened],[data-state=opening])){--sbb-menu-visibility: visible;--sbb-menu-backdrop-color: var(--sbb-color-black-alpha-20)}@media (min-width: 52.5rem){:host(:is([data-state=opened],[data-state=opening])){--sbb-menu-backdrop-color: transparent}}:host(:not([data-state=closed])){--sbb-menu-inset: 0}::slotted(:not(sbb-menu-button,sbb-menu-link,sbb-divider)){display:block;padding-inline:var(--sbb-spacing-fixed-5x)}::slotted(sbb-divider){--sbb-divider-color: var(--sbb-color-iron);margin-block:var(--sbb-spacing-fixed-2x)}.sbb-menu__container{position:fixed;pointer-events:none;inset:var(--sbb-menu-inset);height:var(--sbb-menu-container-height);z-index:var(--sbb-menu-z-index, var(--sbb-overlay-default-z-index))}.sbb-menu__container:before{content:"";visibility:var(--sbb-menu-visibility);pointer-events:all;position:fixed;inset:var(--sbb-menu-inset);height:var(--sbb-menu-container-height);background-color:var(--sbb-menu-backdrop-color);transition-duration:var(--sbb-menu-animation-duration);transition-timing-function:var(--sbb-menu-animation-easing);transition-property:background-color,visibility}.sbb-menu{display:none;opacity:0;pointer-events:none;max-width:var(--sbb-menu-max-width);min-width:var(--sbb-menu-min-width);text-align:start;position:absolute;inset-inline-start:0;inset-block-start:unset;inset-block-end:0;inset-inline-end:unset;color:var(--sbb-color-white);border:none;border-radius:var(--sbb-menu-border-radius) var(--sbb-menu-border-radius) 0 0;background-color:var(--sbb-color-black);padding:0;overflow:hidden}:host([data-state]:not([data-state=closed])) .sbb-menu{display:block;opacity:1;pointer-events:all;animation-name:open;animation-duration:var(--sbb-menu-animation-duration);animation-timing-function:var(--sbb-menu-animation-easing)}:host([data-state][data-state=closing]) .sbb-menu{pointer-events:none;animation-name:close}@media (forced-colors: active){.sbb-menu{outline:var(--sbb-border-width-1x) solid CanvasText}}@media (min-width: 52.5rem){.sbb-menu{top:0;bottom:unset;left:0;right:unset;max-height:fit-content;border-radius:var(--sbb-menu-border-radius)}:host(:not([data-state=closed])) .sbb-menu{top:var(--sbb-menu-position-y);left:var(--sbb-menu-position-x);max-height:var(--sbb-menu-max-height);min-height:var(--sbb-menu-min-height)}}.sbb-menu__content{--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: var(--sbb-color-white-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-white-alpha-60);--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-menu__content::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-menu__content::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-menu__content::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-menu__content::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-menu__content::-webkit-scrollbar-button,.sbb-menu__content::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-menu__content{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-menu__content{max-height:var(--sbb-menu-max-height);padding-block:var(--sbb-spacing-fixed-1x);overflow:auto;outline:none}.sbb-menu__content:after{content:"";display:block;height:var(--sbb-spacing-fixed-8x)}@media (min-width: 52.5rem){.sbb-menu__content{max-height:fit-content}:host(:not([data-state=closed])) .sbb-menu__content{max-height:var(--sbb-menu-max-height);min-height:var(--sbb-menu-min-height)}.sbb-menu__content:after{display:none}}.sbb-menu-list{list-style:none;margin:0;padding:0;font-size:inherit}@keyframes open{0%{opacity:0;transform:var(--sbb-menu-transform)}to{opacity:1;transform:translateY(0)}}@keyframes close{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:var(--sbb-menu-transform)}}`, W = 8, Q = [
10
+ import { SbbFocusHandler as M, isArrowKeyPressed as T, interactivityChecker as I, getNextElementIndex as P, setModalityOnNextFocus as S, IS_FOCUSABLE_QUERY as H } from "../core/a11y.js";
11
+ import { SbbOpenCloseBaseElement as z } from "../core/base-elements.js";
12
+ import { SbbConnectedAbortController as K, SbbInertController as D, SbbMediaMatcherController as F, SbbMediaQueryBreakpointSmallAndBelow as u } from "../core/controllers.js";
13
+ import { forceType as U } from "../core/decorators.js";
14
+ import { SbbScrollHandler as $, findReferencedElement as R } from "../core/dom.js";
15
+ import { SbbNamedSlotListMixin as Y } from "../core/mixins.js";
16
+ import { isEventOnElement as A, removeAriaOverlayTriggerAttributes as q, setAriaOverlayTriggerAttributes as V, getElementPosition as j } from "../core/overlay.js";
17
+ const Q = N`*,:before,:after{box-sizing:border-box}:host{display:contents;--sbb-menu-position-x: 0;--sbb-menu-position-y: 0;--sbb-menu-animation-duration: var( --sbb-disable-animation-zero-time, var(--sbb-animation-duration-6x) );--sbb-menu-animation-easing: ease;--sbb-menu-transform: translateY(100%);--sbb-menu-max-width: 100%;--sbb-menu-min-width: 100%;--sbb-menu-inset: 0 auto auto 0;--sbb-menu-container-height: 100dvh;--sbb-menu-max-height: calc(85vh - var(--sbb-spacing-fixed-8x));--sbb-menu-min-height: 3.03125rem;--sbb-menu-border-radius: var(--sbb-border-radius-4x);--sbb-menu-visibility: hidden;--sbb-menu-backdrop-color: transparent}@media (min-width: 52.5rem){:host{--sbb-menu-transform: translateY(var(--sbb-spacing-fixed-2x));--sbb-menu-max-width: 20rem;--sbb-menu-min-width: 11.25rem}}:host(:is([data-state=opened],[data-state=opening])){--sbb-menu-visibility: visible;--sbb-menu-backdrop-color: var(--sbb-color-black-alpha-20)}@media (min-width: 52.5rem){:host(:is([data-state=opened],[data-state=opening])){--sbb-menu-backdrop-color: transparent}}:host(:not([data-state=closed])){--sbb-menu-inset: 0}::slotted(:not(sbb-menu-button,sbb-menu-link,sbb-divider)){display:block;padding-inline:var(--sbb-spacing-fixed-5x)}::slotted(sbb-divider){--sbb-divider-color: var(--sbb-color-iron);margin-block:var(--sbb-spacing-fixed-2x)}.sbb-menu__container{position:fixed;pointer-events:none;inset:var(--sbb-menu-inset);height:var(--sbb-menu-container-height);z-index:var(--sbb-menu-z-index, var(--sbb-overlay-default-z-index))}.sbb-menu__container:before{content:"";visibility:var(--sbb-menu-visibility);pointer-events:all;position:fixed;inset:var(--sbb-menu-inset);height:var(--sbb-menu-container-height);background-color:var(--sbb-menu-backdrop-color);transition-duration:var(--sbb-menu-animation-duration);transition-timing-function:var(--sbb-menu-animation-easing);transition-property:background-color,visibility}.sbb-menu{display:none;opacity:0;pointer-events:none;max-width:var(--sbb-menu-max-width);min-width:var(--sbb-menu-min-width);text-align:start;position:absolute;inset-inline-start:0;inset-block-start:unset;inset-block-end:0;inset-inline-end:unset;color:var(--sbb-color-white);border:none;border-radius:var(--sbb-menu-border-radius) var(--sbb-menu-border-radius) 0 0;background-color:var(--sbb-color-black);padding:0;overflow:hidden}:host([data-state]:not([data-state=closed])) .sbb-menu{display:block;opacity:1;pointer-events:all;animation-name:open;animation-duration:var(--sbb-menu-animation-duration);animation-timing-function:var(--sbb-menu-animation-easing)}:host([data-state][data-state=closing]) .sbb-menu{pointer-events:none;animation-name:close}@media (forced-colors: active){.sbb-menu{outline:var(--sbb-border-width-1x) solid CanvasText}}@media (min-width: 52.5rem){.sbb-menu{top:0;bottom:unset;left:0;right:unset;max-height:fit-content;border-radius:var(--sbb-menu-border-radius)}:host(:not([data-state=closed])) .sbb-menu{top:var(--sbb-menu-position-y);left:var(--sbb-menu-position-x);max-height:var(--sbb-menu-max-height);min-height:var(--sbb-menu-min-height)}}.sbb-menu__content{--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: var(--sbb-color-white-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-white-alpha-60);--sbb-scrollbar-track-color: transparent;--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-menu__content::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-menu__content::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-menu__content::-webkit-scrollbar-thumb{background-color:var(--sbb-scrollbar-color, currentcolor);border:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;border-radius:var(--sbb-border-radius-4x);background-clip:padding-box}.sbb-menu__content::-webkit-scrollbar-thumb:hover{background-color:var(--sbb-scrollbar-color-hover, currentcolor);border-width:calc(.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)))}.sbb-menu__content::-webkit-scrollbar-button,.sbb-menu__content::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-menu__content{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-menu__content{max-height:var(--sbb-menu-max-height);padding-block:var(--sbb-spacing-fixed-1x);overflow:auto;outline:none}.sbb-menu__content:after{content:"";display:block;height:var(--sbb-spacing-fixed-8x)}@media (min-width: 52.5rem){.sbb-menu__content{max-height:fit-content}:host(:not([data-state=closed])) .sbb-menu__content{max-height:var(--sbb-menu-max-height);min-height:var(--sbb-menu-min-height)}.sbb-menu__content:after{display:none}}.sbb-menu-list{list-style:none;margin:0;padding:0;font-size:inherit}@keyframes open{0%{opacity:0;transform:var(--sbb-menu-transform)}to{opacity:1;transform:translateY(0)}}@keyframes close{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:var(--sbb-menu-transform)}}`, W = 8, G = [
18
18
  "A",
19
19
  "BUTTON",
20
20
  "SBB-BUTTON",
@@ -24,17 +24,21 @@ const j = N`*,:before,:after{box-sizing:border-box}:host{display:contents;--sbb-
24
24
  "SBB-LINK-BUTTON",
25
25
  "SBB-BLOCK-LINK-BUTTON"
26
26
  ];
27
- let G = 0, ct = (() => {
27
+ let J = 0, dt = (() => {
28
28
  var c, a;
29
- let s = [O("sbb-menu")], n, r = [], o, u = R(K), g = [], _, v, p = [], f = [];
30
- return a = class extends u {
29
+ let s = [O("sbb-menu")], n, r = [], o, g = Y(z), _ = [], v, p, f = [], w = [];
30
+ return a = class extends g {
31
31
  constructor() {
32
32
  super(...arguments);
33
- x(this, c);
34
- this.listChildLocalNames = (d(this, g), ["sbb-menu-button", "sbb-menu-link"]), this._trigger = null, m(this, c, d(this, p, "")), this._menu = d(this, f), this._triggerElement = null, this._isPointerDownEventOnMenu = !1, this._abort = new D(this), this._focusHandler = new T(), this._scrollHandler = new U(), this._inertController = new H(this), this._pointerDownListener = (t) => {
35
- this._isPointerDownEventOnMenu = S(this._menu, t);
33
+ E(this, c);
34
+ this.listChildLocalNames = (d(this, _), ["sbb-menu-button", "sbb-menu-link"]), this._trigger = null, h(this, c, d(this, f, "")), this._menu = d(this, w), this._triggerElement = null, this._isPointerDownEventOnMenu = !1, this._abort = new K(this), this._focusHandler = new M(), this._scrollHandler = new $(), this._inertController = new D(this), this._mediaMatcher = new F(this, {
35
+ [u]: (t) => {
36
+ t && (this.state === "opening" || this.state === "opened") ? this._scrollHandler.disableScroll() : this._scrollHandler.enableScroll();
37
+ }
38
+ }), this._pointerDownListener = (t) => {
39
+ this._isPointerDownEventOnMenu = A(this._menu, t);
36
40
  }, this._closeOnBackdropClick = (t) => {
37
- !this._isPointerDownEventOnMenu && !S(this._menu, t) && this.close();
41
+ !this._isPointerDownEventOnMenu && !A(this._menu, t) && this.close();
38
42
  };
39
43
  }
40
44
  /**
@@ -53,17 +57,17 @@ let G = 0, ct = (() => {
53
57
  * Used only if the menu automatically renders the actions inside as a list.
54
58
  */
55
59
  get listAccessibilityLabel() {
56
- return k(this, c);
60
+ return x(this, c);
57
61
  }
58
62
  set listAccessibilityLabel(t) {
59
- m(this, c, t);
63
+ h(this, c, t);
60
64
  }
61
65
  /**
62
66
  * Opens the menu on trigger click.
63
67
  */
64
68
  open() {
65
69
  var t;
66
- this.state === "closing" || !this._menu || this.willOpen.emit() && (this.state = "opening", this._setMenuPosition(), (t = this._triggerElement) == null || t.setAttribute("aria-expanded", "true"), A("medium") || this._scrollHandler.disableScroll());
70
+ this.state === "closing" || !this._menu || this.willOpen.emit() && (this.state = "opening", this._setMenuPosition(), (t = this._triggerElement) == null || t.setAttribute("aria-expanded", "true"), this._mediaMatcher.matches(u) && this._scrollHandler.disableScroll());
67
71
  }
68
72
  /**
69
73
  * Closes the menu.
@@ -80,10 +84,10 @@ let G = 0, ct = (() => {
80
84
  ((e == null ? void 0 : e.localName) === "sbb-menu-button" || (e == null ? void 0 : e.localName) === "sbb-menu-link") && this.close();
81
85
  }
82
86
  _handleKeyDown(t) {
83
- if (!I(t))
87
+ if (!T(t))
84
88
  return;
85
89
  t.preventDefault();
86
- const e = Array.from(this.querySelectorAll("sbb-menu-button, sbb-menu-link")).filter((l) => (!l.disabled || l.disabledInteractive) && M.isVisible(l)), i = e.findIndex((l) => l === t.target), b = P(t, i, e.length);
90
+ const e = Array.from(this.querySelectorAll("sbb-menu-button, sbb-menu-link")).filter((l) => (!l.disabled || l.disabledInteractive) && I.isVisible(l)), i = e.findIndex((l) => l === t.target), b = P(t, i, e.length);
87
91
  e[b].focus();
88
92
  }
89
93
  // Closes the menu on "Esc" key pressed and traps focus within the menu.
@@ -118,7 +122,7 @@ let G = 0, ct = (() => {
118
122
  // Check if the trigger is valid and attach click event listeners.
119
123
  _configure(t) {
120
124
  var e;
121
- Y(this._triggerElement), t && (this._triggerElement = $(t), this._triggerElement && (this.id = this.id || `sbb-menu-${G++}`, q(this._triggerElement, "menu", this.id, this.state), (e = this._menuController) == null || e.abort(), this._menuController = new AbortController(), this._triggerElement.addEventListener("click", () => this.open(), {
125
+ q(this._triggerElement), t && (this._triggerElement = R(t), this._triggerElement && (this.id = this.id || `sbb-menu-${J++}`, V(this._triggerElement, "menu", this.id, this.state), (e = this._menuController) == null || e.abort(), this._menuController = new AbortController(), this._triggerElement.addEventListener("click", () => this.open(), {
122
126
  signal: this._menuController.signal
123
127
  })));
124
128
  }
@@ -140,7 +144,7 @@ let G = 0, ct = (() => {
140
144
  // Close menu at any click on an interactive element inside the <sbb-menu> that bubbles to the container.
141
145
  _closeOnInteractiveElementClick(t) {
142
146
  const e = t.target;
143
- Q.includes(e.nodeName) && !e.hasAttribute("disabled") && this.close();
147
+ G.includes(e.nodeName) && !e.hasAttribute("disabled") && this.close();
144
148
  }
145
149
  // Set menu position (x, y) to '0' once the menu is closed and the transition ended to prevent the
146
150
  // viewport from overflowing. And set the focus to the first focusable element once the menu is open.
@@ -148,27 +152,27 @@ let G = 0, ct = (() => {
148
152
  // To avoid entering a corrupt state, exit when state is not expected.
149
153
  _onMenuAnimationEnd(t) {
150
154
  var e, i, b, l;
151
- t.animationName === "open" && this.state === "opening" ? (this.state = "opened", this.didOpen.emit(), this._inertController.activate(), this._setMenuFocus(), this._focusHandler.trap(this), this._attachWindowEvents()) : t.animationName === "close" && this.state === "closing" && (this.state = "closed", (i = (e = this._menu) == null ? void 0 : e.firstElementChild) == null || i.scrollTo(0, 0), this._inertController.deactivate(), L(this._triggerElement), (b = this._triggerElement) == null || b.focus({
155
+ t.animationName === "open" && this.state === "opening" ? (this.state = "opened", this.didOpen.emit(), this._inertController.activate(), this._setMenuFocus(), this._focusHandler.trap(this), this._attachWindowEvents()) : t.animationName === "close" && this.state === "closing" && (this.state = "closed", (i = (e = this._menu) == null ? void 0 : e.firstElementChild) == null || i.scrollTo(0, 0), this._inertController.deactivate(), S(this._triggerElement), (b = this._triggerElement) == null || b.focus({
152
156
  // When inside the sbb-header, we prevent the scroll to avoid the snapping to the top of the page
153
157
  preventScroll: this._triggerElement.localName === "sbb-header-button" || this._triggerElement.localName === "sbb-header-link"
154
158
  }), this.didClose.emit(), (l = this._windowEventsController) == null || l.abort(), this._focusHandler.disconnect(), this._scrollHandler.enableScroll());
155
159
  }
156
160
  // Set focus on the first focusable element.
157
161
  _setMenuFocus() {
158
- const t = this.querySelector(z);
159
- L(t), t.focus();
162
+ const t = this.querySelector(H);
163
+ S(t), t.focus();
160
164
  }
161
165
  // Set menu position and max height if the breakpoint is medium-ultra.
162
166
  _setMenuPosition() {
163
- if (!A("medium") || !this._menu || !this._triggerElement || this.state === "closing")
167
+ if ((this._mediaMatcher.matches(u) ?? !0) || !this._menu || !this._triggerElement || this.state === "closing")
164
168
  return;
165
- const t = V(this.shadowRoot.querySelector(".sbb-menu__content"), this._triggerElement, this.shadowRoot.querySelector(".sbb-menu__container"), {
169
+ const t = j(this.shadowRoot.querySelector(".sbb-menu__content"), this._triggerElement, this.shadowRoot.querySelector(".sbb-menu__container"), {
166
170
  verticalOffset: W
167
171
  });
168
172
  this.style.setProperty("--sbb-menu-position-x", `${t.left}px`), this.style.setProperty("--sbb-menu-position-y", `${t.top}px`), this.style.setProperty("--sbb-menu-max-height", t.maxHeight);
169
173
  }
170
174
  render() {
171
- return E`
175
+ return C`
172
176
  <div class="sbb-menu__container">
173
177
  <div
174
178
  @animationend=${(t) => this._onMenuAnimationEnd(t)}
@@ -179,21 +183,21 @@ let G = 0, ct = (() => {
179
183
  @click=${(t) => this._closeOnInteractiveElementClick(t)}
180
184
  class="sbb-menu__content"
181
185
  >
182
- ${this.listChildren.length ? this.renderList({ class: "sbb-menu-list", ariaLabel: this.listAccessibilityLabel }) : E`<slot></slot>`}
186
+ ${this.listChildren.length ? this.renderList({ class: "sbb-menu-list", ariaLabel: this.listAccessibilityLabel }) : C`<slot></slot>`}
183
187
  </div>
184
188
  </div>
185
189
  </div>
186
190
  `;
187
191
  }
188
192
  }, c = new WeakMap(), o = a, (() => {
189
- const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(u[Symbol.metadata] ?? null) : void 0;
190
- _ = [C()], v = [F(), C({ attribute: "list-accessibility-label" })], h(a, null, _, { kind: "setter", name: "trigger", static: !1, private: !1, access: { has: (e) => "trigger" in e, set: (e, i) => {
193
+ const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(g[Symbol.metadata] ?? null) : void 0;
194
+ v = [L()], p = [U(), L({ attribute: "list-accessibility-label" })], m(a, null, v, { kind: "setter", name: "trigger", static: !1, private: !1, access: { has: (e) => "trigger" in e, set: (e, i) => {
191
195
  e.trigger = i;
192
- } }, metadata: t }, null, g), h(a, null, v, { kind: "accessor", name: "listAccessibilityLabel", static: !1, private: !1, access: { has: (e) => "listAccessibilityLabel" in e, get: (e) => e.listAccessibilityLabel, set: (e, i) => {
196
+ } }, metadata: t }, null, _), m(a, null, p, { kind: "accessor", name: "listAccessibilityLabel", static: !1, private: !1, access: { has: (e) => "listAccessibilityLabel" in e, get: (e) => e.listAccessibilityLabel, set: (e, i) => {
193
197
  e.listAccessibilityLabel = i;
194
- } }, metadata: t }, p, f), h(null, n = { value: o }, s, { kind: "class", name: o.name, metadata: t }, null, r), o = n.value, t && Object.defineProperty(o, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
195
- })(), a.styles = j, d(o, r), o;
198
+ } }, metadata: t }, f, w), m(null, n = { value: o }, s, { kind: "class", name: o.name, metadata: t }, null, r), o = n.value, t && Object.defineProperty(o, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
199
+ })(), a.styles = Q, d(o, r), o;
196
200
  })();
197
201
  export {
198
- ct as SbbMenuElement
202
+ dt as SbbMenuElement
199
203
  };