@sbb-esta/lyne-elements 2.0.3 → 2.1.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 (195) hide show
  1. package/accordion/accordion.d.ts.map +1 -1
  2. package/accordion.js +6 -6
  3. package/alert/alert.js +8 -8
  4. package/autocomplete/autocomplete-base-element.d.ts.map +1 -1
  5. package/autocomplete-grid/autocomplete-grid-button.js +4 -4
  6. package/autocomplete-grid/autocomplete-grid-optgroup.js +4 -4
  7. package/autocomplete-grid/autocomplete-grid-option/autocomplete-grid-option.d.ts +1 -1
  8. package/autocomplete-grid/autocomplete-grid-option/autocomplete-grid-option.d.ts.map +1 -1
  9. package/autocomplete-grid/autocomplete-grid-option.js +10 -10
  10. package/autocomplete-grid/autocomplete-grid-row.js +4 -4
  11. package/autocomplete.js +92 -89
  12. package/breadcrumb/breadcrumb-group.js +4 -4
  13. package/button/accent-button-link.js +9 -9
  14. package/button/accent-button-static.js +6 -6
  15. package/button/accent-button.js +6 -6
  16. package/button/button-link.js +7 -7
  17. package/button/button-static.js +7 -7
  18. package/button/button.js +8 -8
  19. package/button/common.js +1 -1
  20. package/button/mini-button-group.js +8 -8
  21. package/button/secondary-button-link.js +7 -7
  22. package/button/secondary-button-static.js +7 -7
  23. package/button/secondary-button.js +3 -3
  24. package/button/transparent-button-link.js +6 -6
  25. package/button/transparent-button-static.js +5 -5
  26. package/button/transparent-button.js +6 -6
  27. package/card/card-badge.js +9 -9
  28. package/card/card-button.js +5 -5
  29. package/card/card-link.js +7 -7
  30. package/checkbox/checkbox-panel.js +16 -16
  31. package/checkbox/checkbox.js +15 -15
  32. package/checkbox/common.js +3 -3
  33. package/clock.js +8 -8
  34. package/container/container/container.d.ts +1 -1
  35. package/container/container/container.d.ts.map +1 -1
  36. package/container/container.js +21 -21
  37. package/container/sticky-bar/sticky-bar.d.ts +1 -1
  38. package/container/sticky-bar/sticky-bar.d.ts.map +1 -1
  39. package/container/sticky-bar.js +4 -4
  40. package/core/base-elements.js +8 -8
  41. package/core/controllers.js +4 -4
  42. package/core/datetime/date-adapter.d.ts +1 -1
  43. package/core/datetime/date-adapter.d.ts.map +1 -1
  44. package/core/datetime/native-date-adapter.d.ts +1 -1
  45. package/core/datetime/native-date-adapter.d.ts.map +1 -1
  46. package/core/datetime.js +6 -6
  47. package/core/dom/scroll.d.ts +1 -1
  48. package/core/dom/scroll.d.ts.map +1 -1
  49. package/core/dom.js +39 -39
  50. package/core/eventing.js +4 -4
  51. package/core/mixins.js +18 -18
  52. package/core/styles/core.scss +21 -2
  53. package/core/testing.js +14 -14
  54. package/core.css +18 -2
  55. package/custom-elements.json +364 -428
  56. package/datepicker/common/datepicker-association-controllers.d.ts +21 -0
  57. package/datepicker/common/datepicker-association-controllers.d.ts.map +1 -0
  58. package/datepicker/common/datepicker-button.d.ts +17 -9
  59. package/datepicker/common/datepicker-button.d.ts.map +1 -1
  60. package/datepicker/common.d.ts +1 -0
  61. package/datepicker/common.d.ts.map +1 -1
  62. package/datepicker/common.js +130 -92
  63. package/datepicker/datepicker/datepicker.d.ts +19 -4
  64. package/datepicker/datepicker/datepicker.d.ts.map +1 -1
  65. package/datepicker/datepicker-toggle/datepicker-toggle.d.ts +14 -8
  66. package/datepicker/datepicker-toggle/datepicker-toggle.d.ts.map +1 -1
  67. package/datepicker/datepicker-toggle.js +108 -112
  68. package/datepicker/datepicker.js +95 -80
  69. package/development/accordion/accordion.d.ts.map +1 -1
  70. package/development/accordion.js +1 -1
  71. package/development/autocomplete/autocomplete-base-element.d.ts.map +1 -1
  72. package/development/autocomplete-grid/autocomplete-grid-option/autocomplete-grid-option.d.ts +1 -1
  73. package/development/autocomplete-grid/autocomplete-grid-option/autocomplete-grid-option.d.ts.map +1 -1
  74. package/development/autocomplete-grid/autocomplete-grid-option.js +3 -3
  75. package/development/autocomplete.js +24 -8
  76. package/development/button/common.js +4 -2
  77. package/development/calendar.js +1 -1
  78. package/development/container/container/container.d.ts +1 -1
  79. package/development/container/container/container.d.ts.map +1 -1
  80. package/development/container/container.js +17 -1
  81. package/development/container/sticky-bar/sticky-bar.d.ts +1 -1
  82. package/development/container/sticky-bar/sticky-bar.d.ts.map +1 -1
  83. package/development/container/sticky-bar.js +9 -1
  84. package/development/core/datetime/date-adapter.d.ts +1 -1
  85. package/development/core/datetime/date-adapter.d.ts.map +1 -1
  86. package/development/core/datetime/native-date-adapter.d.ts +1 -1
  87. package/development/core/datetime/native-date-adapter.d.ts.map +1 -1
  88. package/development/core/datetime.js +1 -1
  89. package/development/core/dom/scroll.d.ts +1 -1
  90. package/development/core/dom/scroll.d.ts.map +1 -1
  91. package/development/core/dom.js +4 -4
  92. package/development/core/mixins.js +1 -1
  93. package/development/datepicker/common/datepicker-association-controllers.d.ts +21 -0
  94. package/development/datepicker/common/datepicker-association-controllers.d.ts.map +1 -0
  95. package/development/datepicker/common/datepicker-button.d.ts +17 -9
  96. package/development/datepicker/common/datepicker-button.d.ts.map +1 -1
  97. package/development/datepicker/common.d.ts +1 -0
  98. package/development/datepicker/common.d.ts.map +1 -1
  99. package/development/datepicker/common.js +139 -90
  100. package/development/datepicker/datepicker/datepicker.d.ts +19 -4
  101. package/development/datepicker/datepicker/datepicker.d.ts.map +1 -1
  102. package/development/datepicker/datepicker-toggle/datepicker-toggle.d.ts +14 -8
  103. package/development/datepicker/datepicker-toggle/datepicker-toggle.d.ts.map +1 -1
  104. package/development/datepicker/datepicker-toggle.js +65 -69
  105. package/development/datepicker/datepicker.js +54 -36
  106. package/development/dialog/dialog/dialog.d.ts +2 -0
  107. package/development/dialog/dialog/dialog.d.ts.map +1 -1
  108. package/development/dialog/dialog.js +37 -11
  109. package/development/menu/menu/menu.d.ts.map +1 -1
  110. package/development/menu/menu.js +35 -12
  111. package/development/navigation/navigation/navigation.d.ts.map +1 -1
  112. package/development/navigation/navigation.js +15 -8
  113. package/development/option/option/option-base-element.d.ts +3 -2
  114. package/development/option/option/option-base-element.d.ts.map +1 -1
  115. package/development/option/option.js +15 -8
  116. package/development/overlay/overlay-base-element.d.ts.map +1 -1
  117. package/development/overlay/overlay.d.ts.map +1 -1
  118. package/development/overlay.js +29 -13
  119. package/development/popover/popover/popover.d.ts.map +1 -1
  120. package/development/popover/popover.js +16 -13
  121. package/development/select/select.d.ts +11 -0
  122. package/development/select/select.d.ts.map +1 -1
  123. package/development/select.js +60 -9
  124. package/development/toast/toast.d.ts.map +1 -1
  125. package/development/toast.js +14 -8
  126. package/development/toggle/toggle.js +1 -1
  127. package/development/train/train-wagon.js +1 -1
  128. package/dialog/dialog/dialog.d.ts +2 -0
  129. package/dialog/dialog/dialog.d.ts.map +1 -1
  130. package/dialog/dialog-content.js +3 -3
  131. package/dialog/dialog-title.js +8 -8
  132. package/dialog/dialog.js +59 -49
  133. package/divider.js +12 -12
  134. package/file-selector/file-selector-dropzone.js +5 -5
  135. package/file-selector/file-selector.js +6 -6
  136. package/flip-card/flip-card-details.js +4 -4
  137. package/flip-card/flip-card-summary.js +9 -9
  138. package/header/header-button.js +5 -5
  139. package/header/header-link.js +5 -5
  140. package/icon.js +36 -36
  141. package/link/block-link-button.js +4 -4
  142. package/link/block-link-static.js +9 -9
  143. package/link/block-link.js +4 -4
  144. package/link/common.js +16 -16
  145. package/link/link-button.js +7 -7
  146. package/link/link-static.js +7 -7
  147. package/link/link.js +4 -4
  148. package/link-list/common.js +12 -12
  149. package/loading-indicator-circle.js +11 -11
  150. package/map-container.js +4 -4
  151. package/menu/common.js +7 -7
  152. package/menu/menu/menu.d.ts.map +1 -1
  153. package/menu/menu-button.js +8 -8
  154. package/menu/menu-link.js +6 -6
  155. package/menu/menu.js +64 -42
  156. package/navigation/navigation/navigation.d.ts.map +1 -1
  157. package/navigation/navigation-button.js +4 -4
  158. package/navigation/navigation-link.js +7 -7
  159. package/navigation/navigation-list.js +4 -4
  160. package/navigation/navigation-marker.js +3 -3
  161. package/navigation/navigation.js +21 -20
  162. package/notification.js +17 -17
  163. package/option/optgroup.js +11 -11
  164. package/option/option/option-base-element.d.ts +3 -2
  165. package/option/option/option-base-element.d.ts.map +1 -1
  166. package/option/option.js +113 -101
  167. package/overlay/overlay-base-element.d.ts.map +1 -1
  168. package/overlay/overlay.d.ts.map +1 -1
  169. package/overlay.js +87 -84
  170. package/package.json +1 -1
  171. package/paginator/common.js +6 -6
  172. package/popover/popover/popover.d.ts.map +1 -1
  173. package/popover/popover.js +73 -73
  174. package/radio-button/radio-button-panel.js +5 -5
  175. package/screen-reader-only.js +5 -5
  176. package/select/select.d.ts +11 -0
  177. package/select/select.d.ts.map +1 -1
  178. package/select.js +111 -83
  179. package/slider.js +8 -8
  180. package/standard-theme.css +18 -2
  181. package/status.js +3 -3
  182. package/stepper/step-label.js +4 -4
  183. package/table/table-wrapper.js +4 -4
  184. package/tabs/tab-group.js +24 -24
  185. package/tabs/tab.js +3 -3
  186. package/tag/tag-group.js +7 -7
  187. package/teaser-product/common.js +5 -5
  188. package/teaser-product/teaser-product-static.js +2 -2
  189. package/timetable-occupancy-icon.js +3 -3
  190. package/timetable-occupancy.js +6 -6
  191. package/toast/toast.d.ts.map +1 -1
  192. package/toast.js +58 -54
  193. package/toggle/toggle-option.js +11 -11
  194. package/toggle-check.js +5 -5
  195. package/train/train.js +28 -28
package/dialog/dialog.js CHANGED
@@ -1,54 +1,62 @@
1
- var p = (e) => {
2
- throw TypeError(e);
1
+ var E = (i) => {
2
+ throw TypeError(i);
3
3
  };
4
- var u = (e, o, a) => o.has(e) || p("Cannot " + a);
5
- var f = (e, o, a) => (u(e, o, "read from private field"), a ? a.call(e) : o.get(e)), _ = (e, o, a) => o.has(e) ? p("Cannot add the same private member more than once") : o instanceof WeakSet ? o.add(e) : o.set(e, a), b = (e, o, a, l) => (u(e, o, "write to private field"), l ? l.call(e, a) : o.set(e, a), a);
6
- import { __esDecorate as w, __runInitializers as c } from "tslib";
7
- import { ResizeController as x } from "@lit-labs/observers/resize-controller.js";
8
- import { customElement as k, property as C } from "lit/decorators.js";
9
- import { html as A } from "lit/static-html.js";
10
- import { setModalityOnNextFocus as E, getFirstFocusableElement as O } from "../core/a11y.js";
11
- import { isZeroAnimationDuration as H, isBreakpoint as T } from "../core/dom.js";
12
- import { overlayRefs as y, SbbOverlayBaseElement as D } from "../overlay.js";
13
- import { css as S } from "lit";
4
+ var x = (i, a, o) => a.has(i) || E("Cannot " + o);
5
+ var g = (i, a, o) => (x(i, a, "read from private field"), o ? o.call(i) : a.get(i)), m = (i, a, o) => a.has(i) ? E("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(i) : a.set(i, o), c = (i, a, o, n) => (x(i, a, "write to private field"), n ? n.call(i, o) : a.set(i, o), o);
6
+ import { __esDecorate as p, __runInitializers as h } from "tslib";
7
+ import { ResizeController as H } from "@lit-labs/observers/resize-controller.js";
8
+ import { customElement as T, property as C } from "lit/decorators.js";
9
+ import { html as D } from "lit/static-html.js";
10
+ import { setModalityOnNextFocus as A, getFirstFocusableElement as S } from "../core/a11y.js";
11
+ import { isZeroAnimationDuration as z, isBreakpoint as I } from "../core/dom.js";
12
+ import { overlayRefs as O, SbbOverlayBaseElement as L } from "../overlay.js";
13
+ import { css as R } from "lit";
14
14
  import "../screen-reader-only.js";
15
- const z = S`*,:before,:after{box-sizing:border-box}:host{--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: var(--sbb-color-black-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-black-alpha-60);--sbb-scrollbar-track-color: transparent;--sbb-dialog-padding-inline: var(--sbb-spacing-fixed-5x);--sbb-dialog-color: var(--sbb-color-black);--sbb-dialog-background-color: var(--sbb-color-white);--sbb-dialog-width: 100%;--sbb-dialog-height: 100%;--sbb-dialog-max-width: 100%;--sbb-dialog-max-width-default: 55.75rem;--sbb-dialog-max-height: 100%;--sbb-dialog-inset: 0 auto auto 0;--sbb-dialog-border-radius: var(--sbb-border-radius-8x);--sbb-dialog-padding-block: var(--sbb-spacing-responsive-s);--sbb-dialog-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-6x) );--sbb-dialog-animation-easing: ease;--sbb-dialog-pointer-events: none;--sbb-dialog-backdrop-visibility: hidden;--sbb-dialog-backdrop-pointer-events: none;--sbb-dialog-backdrop-color: transparent;--sbb-dialog-content-transition: transform var(--sbb-dialog-animation-duration) var(--sbb-dialog-animation-easing);--sbb-dialog-actions-border: var(--sbb-border-width-1x) solid var(--sbb-color-cloud);display:block;position:fixed;inset:var(--sbb-dialog-inset);z-index:var(--sbb-dialog-z-index, var(--sbb-overlay-default-z-index))}@media (min-width: 22.5rem){:host{--sbb-dialog-padding-inline: var(--sbb-spacing-fixed-6x)}}@media (min-width: 37.5rem){:host{--sbb-dialog-padding-inline: var(--sbb-spacing-fixed-12x)}}@media (min-width: 52.5rem){:host{--sbb-dialog-padding-inline: var(--sbb-spacing-responsive-s);--sbb-dialog-max-width: min( calc(100vw - var(--sbb-spacing-fixed-30x) * 2), var(--sbb-dialog-max-width-default) );--sbb-dialog-max-height: calc(100vh - var(--sbb-spacing-fixed-16x))}}:host(:is([data-state=opened],[data-state=opening])){--sbb-dialog-pointer-events: all;--sbb-dialog-backdrop-color: var(--sbb-color-milk)}@media (min-width: 52.5rem){:host(:is([data-state=opened],[data-state=opening])){--sbb-dialog-backdrop-visibility: visible;--sbb-dialog-backdrop-pointer-events: all}}:host([data-hide-header]){--sbb-dialog-header-margin-block-start: calc(var(--sbb-dialog-header-height) * -1)}:host([negative]){--sbb-scrollbar-color: var(--sbb-color-white-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-white-alpha-60);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);--sbb-dialog-color: var(--sbb-color-white);--sbb-dialog-background-color: var(--sbb-color-midnight);--sbb-dialog-actions-border: none}:host([data-overflows]:not([negative])){--sbb-dialog-actions-border: none}:host(:not([data-state=closed])){--sbb-dialog-inset: 0}.sbb-dialog__container{pointer-events:var(--sbb-dialog-pointer-events);display:flex;align-items:center;position:fixed;inset:var(--sbb-dialog-inset)}.sbb-dialog__container:before{content:"";visibility:var(--sbb-dialog-backdrop-visibility);pointer-events:var(--sbb-dialog-backdrop-pointer-events);position:fixed;inset:var(--sbb-dialog-inset);background-color:var(--sbb-dialog-backdrop-color);transition-duration:var(--sbb-dialog-animation-duration);transition-timing-function:var(--sbb-dialog-animation-easing);transition-property:background-color,visibility}.sbb-dialog{display:none;position:absolute;inset-inline:0;margin:auto;padding:0;border:none;width:var(--sbb-dialog-width);height:var(--sbb-dialog-height);max-width:var(--sbb-dialog-max-width);max-height:var(--sbb-dialog-max-height);overflow:auto;color:var(--sbb-dialog-color);background-color:var(--sbb-dialog-background-color)}:host([data-state]:not([data-state=closed])) .sbb-dialog{display:block;animation-name:open;animation-duration:var(--sbb-dialog-animation-duration);animation-timing-function:ease}:host([data-state][data-state=closing]) .sbb-dialog{pointer-events:none;animation-name:close}@media (forced-colors: active){.sbb-dialog{outline:var(--sbb-border-width-1x) solid CanvasText}}@media (min-width: 52.5rem){.sbb-dialog{border-radius:var(--sbb-dialog-border-radius);overflow:hidden;height:fit-content}}.sbb-dialog__wrapper{display:flex;flex-direction:column;width:var(--sbb-dialog-width);height:var(--sbb-dialog-height);max-width:var(--sbb-dialog-max-width);max-height:var(--sbb-dialog-max-height);outline:none;position:fixed}@media (min-width: 52.5rem){.sbb-dialog__wrapper{position:sticky;inset-block-start:0;height:auto}}@keyframes open{0%{opacity:0;transform:translateY(var(--sbb-spacing-fixed-4x))}to{opacity:1;transform:translateY(0)}}@keyframes close{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(var(--sbb-spacing-fixed-4x))}}`;
16
- let L = 0, Y = (() => {
17
- var d, r;
18
- let e = [k("sbb-dialog")], o, a = [], l, h = D, g, m = [], v = [];
19
- return r = class extends h {
15
+ const F = R`*,:before,:after{box-sizing:border-box}:host{--sbb-scrollbar-thumb-width: .125rem;--sbb-scrollbar-thumb-width-hover: .25rem;--sbb-scrollbar-width-firefox: thin;--sbb-scrollbar-color: var(--sbb-color-black-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-black-alpha-60);--sbb-scrollbar-track-color: transparent;--sbb-dialog-padding-inline: var(--sbb-spacing-fixed-5x);--sbb-dialog-color: var(--sbb-color-black);--sbb-dialog-background-color: var(--sbb-color-white);--sbb-dialog-width: 100%;--sbb-dialog-height: 100%;--sbb-dialog-max-width: 100%;--sbb-dialog-max-width-default: 55.75rem;--sbb-dialog-max-height: 100%;--sbb-dialog-inset: 0 auto auto 0;--sbb-dialog-border-radius: var(--sbb-border-radius-8x);--sbb-dialog-padding-block: var(--sbb-spacing-responsive-s);--sbb-dialog-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-6x) );--sbb-dialog-animation-easing: ease;--sbb-dialog-pointer-events: none;--sbb-dialog-backdrop-visibility: hidden;--sbb-dialog-backdrop-pointer-events: none;--sbb-dialog-backdrop-color: transparent;--sbb-dialog-content-transition: transform var(--sbb-dialog-animation-duration) var(--sbb-dialog-animation-easing);--sbb-dialog-actions-border: var(--sbb-border-width-1x) solid var(--sbb-color-cloud);display:none;position:fixed;inset:var(--sbb-dialog-inset);z-index:var(--sbb-dialog-z-index, var(--sbb-overlay-default-z-index))}@media (min-width: 22.5rem){:host{--sbb-dialog-padding-inline: var(--sbb-spacing-fixed-6x)}}@media (min-width: 37.5rem){:host{--sbb-dialog-padding-inline: var(--sbb-spacing-fixed-12x)}}@media (min-width: 52.5rem){:host{--sbb-dialog-padding-inline: var(--sbb-spacing-responsive-s);--sbb-dialog-max-width: min( calc(100vw - var(--sbb-spacing-fixed-30x) * 2), var(--sbb-dialog-max-width-default) );--sbb-dialog-max-height: calc(100vh - var(--sbb-spacing-fixed-16x))}}:host([data-state]:not([data-state=closed])){display:block}:host(:is([data-state=opening],[data-state=opened])){--sbb-dialog-pointer-events: all;--sbb-dialog-backdrop-color: var(--sbb-color-milk)}@media (min-width: 52.5rem){:host(:is([data-state=opening],[data-state=opened])){--sbb-dialog-backdrop-visibility: visible;--sbb-dialog-backdrop-pointer-events: all}}:host([backdrop=translucent]:is([data-state=opening],[data-state=opened])){--sbb-dialog-backdrop-color: var(--sbb-color-black-alpha-50)}:host([data-hide-header]){--sbb-dialog-header-margin-block-start: calc(var(--sbb-dialog-header-height) * -1)}:host([negative]){--sbb-scrollbar-color: var(--sbb-color-white-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-white-alpha-60);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);--sbb-dialog-color: var(--sbb-color-white);--sbb-dialog-background-color: var(--sbb-color-midnight);--sbb-dialog-actions-border: none}:host([data-overflows]:not([negative])){--sbb-dialog-actions-border: none}:host(:not([data-state=closed])){--sbb-dialog-inset: 0}.sbb-dialog__container{pointer-events:var(--sbb-dialog-pointer-events);display:flex;align-items:center;position:fixed;inset:var(--sbb-dialog-inset)}.sbb-dialog__container:before{content:"";visibility:var(--sbb-dialog-backdrop-visibility);pointer-events:var(--sbb-dialog-backdrop-pointer-events);position:fixed;inset:var(--sbb-dialog-inset);background-color:var(--sbb-dialog-backdrop-color);transition-duration:var(--sbb-dialog-animation-duration);transition-timing-function:var(--sbb-dialog-animation-easing);transition-property:background-color,visibility}.sbb-dialog{display:none;position:absolute;inset-inline:0;margin:auto;padding:0;border:none;width:var(--sbb-dialog-width);height:var(--sbb-dialog-height);max-width:var(--sbb-dialog-max-width);max-height:var(--sbb-dialog-max-height);overflow:auto;color:var(--sbb-dialog-color);background-color:var(--sbb-dialog-background-color)}:host([data-state]:not([data-state=closed])) .sbb-dialog{display:block;animation-name:open;animation-duration:var(--sbb-dialog-animation-duration);animation-timing-function:ease}:host([data-state][data-state=closing]) .sbb-dialog{pointer-events:none;animation-name:close}@media (forced-colors: active){.sbb-dialog{outline:var(--sbb-border-width-1x) solid CanvasText}}@media (min-width: 52.5rem){.sbb-dialog{border-radius:var(--sbb-dialog-border-radius);overflow:hidden;height:fit-content}}.sbb-dialog__wrapper{display:flex;flex-direction:column;width:var(--sbb-dialog-width);height:var(--sbb-dialog-height);max-width:var(--sbb-dialog-max-width);max-height:var(--sbb-dialog-max-height);outline:none;position:fixed}@media (min-width: 52.5rem){.sbb-dialog__wrapper{position:sticky;inset-block-start:0;height:auto}}@keyframes open{0%{opacity:0;transform:translateY(var(--sbb-spacing-fixed-4x))}to{opacity:1;transform:translateY(0)}}@keyframes close{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(var(--sbb-spacing-fixed-4x))}}`;
16
+ let P = 0, J = (() => {
17
+ var d, b, r;
18
+ let i = [T("sbb-dialog")], a, o = [], n, v = L, u, _ = [], f = [], k, w = [], y = [];
19
+ return r = class extends v {
20
20
  constructor() {
21
- var t, i;
21
+ var t, e;
22
22
  super();
23
- _(this, d);
24
- b(this, d, c(this, m, "close")), this._dialogContentResizeObserver = (c(this, v), new x(this, {
23
+ m(this, d);
24
+ m(this, b);
25
+ c(this, d, h(this, _, "close")), c(this, b, (h(this, f), h(this, w, "opaque"))), this._dialogContentResizeObserver = (h(this, y), new H(this, {
25
26
  target: null,
26
27
  skipInitial: !0,
27
28
  callback: () => setTimeout(() => this._onContentResize())
28
- })), this._dialogTitleElement = null, this._dialogContentElement = null, this._dialogActionsElement = null, this._isPointerDownEventOnDialog = !1, this._overflows = !1, this._lastScroll = 0, this._dialogId = `sbb-dialog-${L++}`, this.closeAttribute = "sbb-dialog-close", this._pointerDownListener = (s) => {
29
- this.backdropAction === "close" && (this._isPointerDownEventOnDialog = s.composedPath().filter((n) => n instanceof window.HTMLElement).some((n) => n.id === this._dialogId));
29
+ })), this._dialogTitleElement = null, this._dialogContentElement = null, this._dialogActionsElement = null, this._isPointerDownEventOnDialog = !1, this._overflows = !1, this._lastScroll = 0, this._dialogId = `sbb-dialog-${P++}`, this.closeAttribute = "sbb-dialog-close", this._pointerDownListener = (s) => {
30
+ this.backdropAction === "close" && (this._isPointerDownEventOnDialog = s.composedPath().filter((l) => l instanceof window.HTMLElement).some((l) => l.id === this._dialogId));
30
31
  }, this._closeOnBackdropClick = (s) => {
31
- this.backdropAction === "close" && !this._isPointerDownEventOnDialog && !s.composedPath().filter((n) => n instanceof window.HTMLElement).some((n) => n.id === this._dialogId) && this.close();
32
- }, (t = this.addEventListener) == null || t.call(this, "pointerdown", this._pointerDownListener), (i = this.addEventListener) == null || i.call(this, "pointerup", this._closeOnBackdropClick);
32
+ this.backdropAction === "close" && !this._isPointerDownEventOnDialog && !s.composedPath().filter((l) => l instanceof window.HTMLElement).some((l) => l.id === this._dialogId) && this.close();
33
+ }, (t = this.addEventListener) == null || t.call(this, "pointerdown", this._pointerDownListener), (e = this.addEventListener) == null || e.call(this, "pointerup", this._closeOnBackdropClick);
33
34
  }
34
35
  /** Backdrop click action. */
35
36
  get backdropAction() {
36
- return f(this, d);
37
+ return g(this, d);
37
38
  }
38
39
  set backdropAction(t) {
39
- b(this, d, t);
40
+ c(this, d, t);
41
+ }
42
+ /** Backdrop density. */
43
+ get backdrop() {
44
+ return g(this, b);
45
+ }
46
+ set backdrop(t) {
47
+ c(this, b, t);
40
48
  }
41
49
  /** Opens the component. */
42
50
  open() {
43
- var t;
44
- this.state === "closed" && (this.lastFocusedElement = document.activeElement, this._dialogTitleElement = this.querySelector("sbb-dialog-title"), this._dialogContentElement = (t = this.querySelector("sbb-dialog-content")) == null ? void 0 : t.shadowRoot.firstElementChild, this._dialogActionsElement = this.querySelector("sbb-dialog-actions"), this._syncNegative(), this.willOpen.emit() && (this.state = "opening", y.push(this), this._dialogContentResizeObserver.observe(this._dialogContentElement), this.scrollHandler.disableScroll(), this.isZeroAnimationDuration() && this._handleOpening()));
51
+ var t, e;
52
+ this.state === "closed" && (this.lastFocusedElement = document.activeElement, this._dialogTitleElement = this.querySelector("sbb-dialog-title"), this._dialogContentElement = (t = this.querySelector("sbb-dialog-content")) == null ? void 0 : t.shadowRoot.firstElementChild, this._dialogActionsElement = this.querySelector("sbb-dialog-actions"), this._syncNegative(), this.willOpen.emit() && ((e = this.showPopover) == null || e.call(this), this.state = "opening", O.push(this), this._dialogContentResizeObserver.observe(this._dialogContentElement), this.scrollHandler.disableScroll(), this.isZeroAnimationDuration() && this._handleOpening()));
45
53
  }
46
54
  isZeroAnimationDuration() {
47
- return H(this, "--sbb-dialog-animation-duration");
55
+ return z(this, "--sbb-dialog-animation-duration");
48
56
  }
49
57
  handleClosing() {
50
- var t, i, s;
51
- this._setHideHeaderDataAttribute(!1), (t = this._dialogContentElement) == null || t.scrollTo(0, 0), this.state = "closed", this.inertController.deactivate(), E(this.lastFocusedElement), (i = this.lastFocusedElement) == null || i.focus(), (s = this.openOverlayController) == null || s.abort(), this.focusHandler.disconnect(), this._dialogContentElement && this._dialogContentResizeObserver.unobserve(this._dialogContentElement), this.removeInstanceFromGlobalCollection(), y.length || this.scrollHandler.enableScroll(), this.didClose.emit({
58
+ var t, e, s, l;
59
+ this._setHideHeaderDataAttribute(!1), (t = this._dialogContentElement) == null || t.scrollTo(0, 0), this.state = "closed", (e = this.hidePopover) == null || e.call(this), this.inertController.deactivate(), A(this.lastFocusedElement), (s = this.lastFocusedElement) == null || s.focus(), (l = this.openOverlayController) == null || l.abort(), this.focusHandler.disconnect(), this._dialogContentElement && this._dialogContentResizeObserver.unobserve(this._dialogContentElement), this.removeInstanceFromGlobalCollection(), O.length || this.scrollHandler.enableScroll(), this.didClose.emit({
52
60
  returnValue: this.returnValue,
53
61
  closeTarget: this.overlayCloseElement
54
62
  });
@@ -82,8 +90,8 @@ let L = 0, Y = (() => {
82
90
  }
83
91
  // Set focus on the first focusable element.
84
92
  setOverlayFocus() {
85
- const t = O(Array.from(this.children).filter((i) => i instanceof window.HTMLElement));
86
- E(t), t == null || t.focus();
93
+ const t = S(Array.from(this.children).filter((e) => e instanceof window.HTMLElement));
94
+ A(t), t == null || t.focus();
87
95
  }
88
96
  _syncNegative() {
89
97
  this._dialogTitleElement && (this._dialogTitleElement.negative = this.negative), this._dialogActionsElement && this._dialogActionsElement.toggleAttribute("data-negative", this.negative);
@@ -91,28 +99,28 @@ let L = 0, Y = (() => {
91
99
  _onContentScroll() {
92
100
  if (!this._dialogContentElement || this.dataset.hideHeader === void 0 && this._dialogContentElement.clientHeight + this._dialogTitleHeight >= this._dialogContentElement.scrollHeight)
93
101
  return;
94
- const i = this._dialogContentElement.scrollTop;
95
- Math.round(i + this._dialogContentElement.clientHeight) >= this._dialogContentElement.scrollHeight || (i > 0 && this._lastScroll < i ? this._setHideHeaderDataAttribute(!0) : this._setHideHeaderDataAttribute(!1), this._lastScroll = i <= 0 ? 0 : i);
102
+ const e = this._dialogContentElement.scrollTop;
103
+ Math.round(e + this._dialogContentElement.clientHeight) >= this._dialogContentElement.scrollHeight || (e > 0 && this._lastScroll < e ? this._setHideHeaderDataAttribute(!0) : this._setHideHeaderDataAttribute(!1), this._lastScroll = e <= 0 ? 0 : e);
96
104
  }
97
105
  _setDialogHeaderHeight() {
98
106
  var t;
99
107
  this._dialogTitleHeight = (t = this._dialogTitleElement) == null ? void 0 : t.shadowRoot.firstElementChild.clientHeight, this.style.setProperty("--sbb-dialog-header-height", `${this._dialogTitleHeight}px`);
100
108
  }
101
109
  _onContentResize() {
102
- var t, i;
103
- this._setDialogHeaderHeight(), this._overflows = this._dialogContentElement ? ((t = this._dialogContentElement) == null ? void 0 : t.scrollHeight) > ((i = this._dialogContentElement) == null ? void 0 : i.clientHeight) : !1, this._setOverflowsDataAttribute();
110
+ var t, e;
111
+ this._setDialogHeaderHeight(), this._overflows = this._dialogContentElement ? ((t = this._dialogContentElement) == null ? void 0 : t.scrollHeight) > ((e = this._dialogContentElement) == null ? void 0 : e.clientHeight) : !1, this._setOverflowsDataAttribute();
104
112
  }
105
113
  _setHideHeaderDataAttribute(t) {
106
- var n;
107
- const i = ((n = this._dialogTitleElement) == null ? void 0 : n.hideOnScroll) ?? !1, s = typeof i == "boolean" ? i : T("zero", i, { includeMaxBreakpoint: !0 }) ?? !1;
114
+ var l;
115
+ const e = ((l = this._dialogTitleElement) == null ? void 0 : l.hideOnScroll) ?? !1, s = typeof e == "boolean" ? e : I("zero", e, { includeMaxBreakpoint: !0 }) ?? !1;
108
116
  this.toggleAttribute("data-hide-header", s ? t : !1), this._dialogTitleElement && this._dialogTitleElement.toggleAttribute("data-hide-header", s ? t : !1);
109
117
  }
110
118
  _setOverflowsDataAttribute() {
111
- var t, i;
112
- this.toggleAttribute("data-overflows", this._overflows), (t = this._dialogTitleElement) == null || t.toggleAttribute("data-overflows", this._overflows), (i = this._dialogActionsElement) == null || i.toggleAttribute("data-overflows", this._overflows);
119
+ var t, e;
120
+ this.toggleAttribute("data-overflows", this._overflows), (t = this._dialogTitleElement) == null || t.toggleAttribute("data-overflows", this._overflows), (e = this._dialogActionsElement) == null || e.toggleAttribute("data-overflows", this._overflows);
113
121
  }
114
122
  render() {
115
- return A`
123
+ return D`
116
124
  <div class="sbb-dialog__container">
117
125
  <div @animationend=${this.onOverlayAnimationEnd} class="sbb-dialog" id=${this._dialogId}>
118
126
  <div
@@ -126,13 +134,15 @@ let L = 0, Y = (() => {
126
134
  <sbb-screen-reader-only aria-live="polite"></sbb-screen-reader-only>
127
135
  `;
128
136
  }
129
- }, d = new WeakMap(), l = r, (() => {
130
- const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(h[Symbol.metadata] ?? null) : void 0;
131
- g = [C({ attribute: "backdrop-action" })], w(r, null, g, { kind: "accessor", name: "backdropAction", static: !1, private: !1, access: { has: (i) => "backdropAction" in i, get: (i) => i.backdropAction, set: (i, s) => {
132
- i.backdropAction = s;
133
- } }, metadata: t }, m, v), w(null, o = { value: l }, e, { kind: "class", name: l.name, metadata: t }, null, a), l = o.value, t && Object.defineProperty(l, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
134
- })(), r.styles = z, c(l, a), l;
137
+ }, d = new WeakMap(), b = new WeakMap(), n = r, (() => {
138
+ const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(v[Symbol.metadata] ?? null) : void 0;
139
+ u = [C({ attribute: "backdrop-action" })], k = [C({ attribute: "backdrop", reflect: !0 })], p(r, null, u, { kind: "accessor", name: "backdropAction", static: !1, private: !1, access: { has: (e) => "backdropAction" in e, get: (e) => e.backdropAction, set: (e, s) => {
140
+ e.backdropAction = s;
141
+ } }, metadata: t }, _, f), p(r, null, k, { kind: "accessor", name: "backdrop", static: !1, private: !1, access: { has: (e) => "backdrop" in e, get: (e) => e.backdrop, set: (e, s) => {
142
+ e.backdrop = s;
143
+ } }, metadata: t }, w, y), p(null, a = { value: n }, i, { kind: "class", name: n.name, metadata: t }, null, o), n = a.value, t && Object.defineProperty(n, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
144
+ })(), r.styles = F, h(n, o), n;
135
145
  })();
136
146
  export {
137
- Y as SbbDialogElement
147
+ J as SbbDialogElement
138
148
  };
package/divider.js CHANGED
@@ -2,8 +2,8 @@ var v = (t) => {
2
2
  throw TypeError(t);
3
3
  };
4
4
  var h = (t, e, i) => e.has(t) || v("Cannot " + i);
5
- var u = (t, e, i) => (h(t, e, "read from private field"), i ? i.call(t) : e.get(t)), p = (t, e, i) => e.has(t) ? v("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(t) : e.set(t, i), _ = (t, e, i, r) => (h(t, e, "write to private field"), r ? r.call(t, i) : e.set(t, i), i);
6
- import { __esDecorate as f, __runInitializers as n } from "tslib";
5
+ var u = (t, e, i) => (h(t, e, "read from private field"), i ? i.call(t) : e.get(t)), p = (t, e, i) => e.has(t) ? v("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(t) : e.set(t, i), f = (t, e, i, r) => (h(t, e, "write to private field"), r ? r.call(t, i) : e.set(t, i), i);
6
+ import { __esDecorate as _, __runInitializers as l } from "tslib";
7
7
  import { css as g, LitElement as x, html as w } from "lit";
8
8
  import { customElement as z, property as S } from "lit/decorators.js";
9
9
  import { hostAttributes as D } from "./core/decorators.js";
@@ -13,19 +13,19 @@ let N = (() => {
13
13
  var s, a;
14
14
  let t = [z("sbb-divider"), D({
15
15
  role: "separator"
16
- })], e, i = [], r, b = E(x), d, c = [], m = [];
17
- return a = class extends b {
16
+ })], e, i = [], r, d = E(x), b, c = [], m = [];
17
+ return a = class extends d {
18
18
  constructor() {
19
19
  super(...arguments);
20
- p(this, s, n(this, c, "horizontal"));
21
- n(this, m);
20
+ p(this, s, l(this, c, "horizontal"));
21
+ l(this, m);
22
22
  }
23
23
  /** Orientation property with possible values 'horizontal' | 'vertical'. Defaults to horizontal. */
24
24
  get orientation() {
25
25
  return u(this, s);
26
26
  }
27
27
  set orientation(o) {
28
- _(this, s, o);
28
+ f(this, s, o);
29
29
  }
30
30
  willUpdate(o) {
31
31
  super.willUpdate(o), o.has("orientation") && this.setAttribute("aria-orientation", this.orientation);
@@ -34,11 +34,11 @@ let N = (() => {
34
34
  return w` <div class="sbb-divider"></div> `;
35
35
  }
36
36
  }, s = new WeakMap(), r = a, (() => {
37
- const o = typeof Symbol == "function" && Symbol.metadata ? Object.create(b[Symbol.metadata] ?? null) : void 0;
38
- d = [S({ reflect: !0 })], f(a, null, d, { kind: "accessor", name: "orientation", static: !1, private: !1, access: { has: (l) => "orientation" in l, get: (l) => l.orientation, set: (l, y) => {
39
- l.orientation = y;
40
- } }, metadata: o }, c, m), f(null, e = { value: r }, t, { kind: "class", name: r.name, metadata: o }, null, i), r = e.value, o && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: o });
41
- })(), a.styles = k, n(r, i), r;
37
+ const o = typeof Symbol == "function" && Symbol.metadata ? Object.create(d[Symbol.metadata] ?? null) : void 0;
38
+ b = [S({ reflect: !0 })], _(a, null, b, { kind: "accessor", name: "orientation", static: !1, private: !1, access: { has: (n) => "orientation" in n, get: (n) => n.orientation, set: (n, y) => {
39
+ n.orientation = y;
40
+ } }, metadata: o }, c, m), _(null, e = { value: r }, t, { kind: "class", name: r.name, metadata: o }, null, i), r = e.value, o && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: o });
41
+ })(), a.styles = k, l(r, i), r;
42
42
  })();
43
43
  export {
44
44
  N as SbbDividerElement
@@ -2,8 +2,8 @@ var p = (e) => {
2
2
  throw TypeError(e);
3
3
  };
4
4
  var m = (e, i, s) => i.has(e) || p("Cannot " + s);
5
- var g = (e, i, s) => (m(e, i, "read from private field"), s ? s.call(e) : i.get(e)), _ = (e, i, s) => i.has(e) ? p("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(e) : i.set(e, s), n = (e, i, s, r) => (m(e, i, "write to private field"), r ? r.call(e, s) : i.set(e, s), s);
6
- import { __runInitializers as b, __esDecorate as u } from "tslib";
5
+ var g = (e, i, s) => (m(e, i, "read from private field"), s ? s.call(e) : i.get(e)), u = (e, i, s) => i.has(e) ? p("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(e) : i.set(e, s), n = (e, i, s, r) => (m(e, i, "write to private field"), r ? r.call(e, s) : i.set(e, s), s);
6
+ import { __runInitializers as b, __esDecorate as _ } from "tslib";
7
7
  import { css as y, LitElement as z } from "lit";
8
8
  import { customElement as x, property as S } from "lit/decorators.js";
9
9
  import { ref as D } from "lit/directives/ref.js";
@@ -21,7 +21,7 @@ let Q = (() => {
21
21
  return a = class extends c {
22
22
  constructor() {
23
23
  super(...arguments);
24
- _(this, l);
24
+ u(this, l);
25
25
  n(this, l, b(this, f, "")), this._counter = (b(this, h), 0);
26
26
  }
27
27
  /** The title displayed in `dropzone` variant. */
@@ -85,9 +85,9 @@ let Q = (() => {
85
85
  }
86
86
  }, l = new WeakMap(), r = a, (() => {
87
87
  const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(c[Symbol.metadata] ?? null) : void 0;
88
- d = [E(), S({ attribute: "title-content" })], u(a, null, d, { kind: "accessor", name: "titleContent", static: !1, private: !1, access: { has: (o) => "titleContent" in o, get: (o) => o.titleContent, set: (o, v) => {
88
+ d = [E(), S({ attribute: "title-content" })], _(a, null, d, { kind: "accessor", name: "titleContent", static: !1, private: !1, access: { has: (o) => "titleContent" in o, get: (o) => o.titleContent, set: (o, v) => {
89
89
  o.titleContent = v;
90
- } }, metadata: t }, f, h), u(null, i = { value: r }, e, { kind: "class", name: r.name, metadata: t }, null, s), r = i.value, t && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
90
+ } }, metadata: t }, f, h), _(null, i = { value: r }, e, { kind: "class", name: r.name, metadata: t }, null, s), r = i.value, t && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
91
91
  })(), a.styles = [T, w], a.events = {
92
92
  fileChangedEvent: "fileChanged"
93
93
  }, b(r, s), r;
@@ -1,4 +1,4 @@
1
- import { __esDecorate as m, __runInitializers as n } from "tslib";
1
+ import { __esDecorate as n, __runInitializers as m } from "tslib";
2
2
  import { LitElement as c } from "lit";
3
3
  import { customElement as b } from "lit/decorators.js";
4
4
  import { ref as u } from "lit/directives/ref.js";
@@ -11,7 +11,7 @@ import "../button/secondary-button-static.js";
11
11
  import "../icon.js";
12
12
  let j = (() => {
13
13
  var e;
14
- let o = [b("sbb-file-selector"), f()], i, a = [], t, r = S(c);
14
+ let s = [b("sbb-file-selector"), f()], i, a = [], t, r = S(c);
15
15
  return e = class extends r {
16
16
  renderTemplate(l) {
17
17
  return d`
@@ -21,8 +21,8 @@ let j = (() => {
21
21
  size=${this.size}
22
22
  icon-name="folder-open-small"
23
23
  ?disabled=${this.disabled || this.formDisabled}
24
- ${u((s) => {
25
- this.loadButton = s;
24
+ ${u((o) => {
25
+ this.loadButton = o;
26
26
  })}
27
27
  >
28
28
  ${p[this.language.current]}
@@ -34,10 +34,10 @@ let j = (() => {
34
34
  }
35
35
  }, t = e, (() => {
36
36
  const l = typeof Symbol == "function" && Symbol.metadata ? Object.create(r[Symbol.metadata] ?? null) : void 0;
37
- m(null, i = { value: t }, o, { kind: "class", name: t.name, metadata: l }, null, a), t = i.value, l && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: l });
37
+ n(null, i = { value: t }, s, { kind: "class", name: t.name, metadata: l }, null, a), t = i.value, l && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: l });
38
38
  })(), e.styles = h, e.events = {
39
39
  fileChangedEvent: "fileChanged"
40
- }, n(t, a), t;
40
+ }, m(t, a), t;
41
41
  })();
42
42
  export {
43
43
  j as SbbFileSelectorElement
@@ -22,8 +22,8 @@ let E = (() => {
22
22
  }
23
23
  _checkForSlottedActions() {
24
24
  var o;
25
- const s = "data-card-focusable";
26
- Array.from(((o = this.querySelectorAll) == null ? void 0 : o.call(this, v)) ?? []).filter((e) => !e.hasAttribute(s)).forEach((e) => e.setAttribute(s, ""));
25
+ const e = "data-card-focusable";
26
+ Array.from(((o = this.querySelectorAll) == null ? void 0 : o.call(this, v)) ?? []).filter((s) => !s.hasAttribute(e)).forEach((s) => s.setAttribute(e, ""));
27
27
  }
28
28
  render() {
29
29
  return f`
@@ -35,8 +35,8 @@ let E = (() => {
35
35
  `;
36
36
  }
37
37
  }, t = a, (() => {
38
- const s = typeof Symbol == "function" && Symbol.metadata ? Object.create(l[Symbol.metadata] ?? null) : void 0;
39
- n(null, i = { value: t }, d, { kind: "class", name: t.name, metadata: s }, null, r), t = i.value, s && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: s });
38
+ const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(l[Symbol.metadata] ?? null) : void 0;
39
+ n(null, i = { value: t }, d, { kind: "class", name: t.name, metadata: e }, null, r), t = i.value, e && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
40
40
  })(), a.styles = h, b(t, r), t;
41
41
  })();
42
42
  export {
@@ -9,26 +9,26 @@ import { customElement as x, property as S } from "lit/decorators.js";
9
9
  import { hostAttributes as z } from "../core/decorators.js";
10
10
  const E = w`*,:before,:after{box-sizing:border-box}:host{--sbb-flip-card-summary-opacity: 1;--sbb-flip-card-summary-pointer-events: all;display:contents}.sbb-flip-card-summary{display:grid;min-height:var(--sbb-flip-card-min-height);pointer-events:var(--sbb-flip-card-summary-pointer-events);opacity:var(--sbb-flip-card-summary-opacity);border-radius:var(--sbb-flip-card-border-radius);overflow:hidden;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);width:100%;height:100%;transition:all var(--sbb-flip-card-summary-transition-duration) ease-out;transition-delay:var(--sbb-flip-card-summary-transition-delay)}@media (min-width: 37.5rem){:host([image-alignment=after]) .sbb-flip-card-summary{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:1fr}}@media (min-width: 52.5rem){:host([image-alignment=after]) .sbb-flip-card-summary{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:1fr}}::slotted(sbb-title){padding-inline:var(--sbb-spacing-responsive-s);padding-block:var(--sbb-spacing-responsive-s) var(--sbb-spacing-responsive-xs);margin:0;grid-area:1/1/2/2}@media (min-width: 37.5rem){:host([image-alignment=after]) ::slotted(sbb-title){grid-area:1/1/2/3}}@media (min-width: 52.5rem){:host([image-alignment=after]) ::slotted(sbb-title){grid-area:1/1/2/2}}::slotted(*:not([slot=image])){transform:translateY(var(--sbb-flip-card-translate-title-y-hover, 0rem));transition:transform var(--sbb-disable-animation-duration, var(--sbb-animation-duration-2x)) var(--sbb-animation-easing)}.sbb-flip-card-summary--image-wrapper{grid-area:2/1/3/2}@media (min-width: 37.5rem){:host([image-alignment=after]) .sbb-flip-card-summary--image-wrapper{grid-area:1/3/2/4}}@media (min-width: 52.5rem){:host([image-alignment=after]) .sbb-flip-card-summary--image-wrapper{grid-area:1/2/2/3}}::slotted([slot=image]){width:100%;height:100%}`;
11
11
  let C = (() => {
12
- var l, s;
12
+ var n, s;
13
13
  let a = [x("sbb-flip-card-summary"), z({
14
14
  slot: "summary"
15
15
  })], e, t = [], i, d = A, b, g = [], p = [];
16
16
  return s = class extends d {
17
17
  constructor() {
18
18
  super(...arguments);
19
- h(this, l, o(this, g, "after"));
19
+ h(this, n, o(this, g, "after"));
20
20
  o(this, p);
21
21
  }
22
22
  /** The position where to render the image. */
23
23
  get imageAlignment() {
24
- return f(this, l);
24
+ return f(this, n);
25
25
  }
26
26
  set imageAlignment(r) {
27
- y(this, l, r);
27
+ y(this, n, r);
28
28
  }
29
29
  willUpdate(r) {
30
- var m, n;
31
- super.willUpdate(r), r.has("imageAlignment") && ((n = (m = this.closest) == null ? void 0 : m.call(this, "sbb-flip-card")) == null || n.setAttribute("data-image-alignment", this.imageAlignment));
30
+ var m, l;
31
+ super.willUpdate(r), r.has("imageAlignment") && ((l = (m = this.closest) == null ? void 0 : m.call(this, "sbb-flip-card")) == null || l.setAttribute("data-image-alignment", this.imageAlignment));
32
32
  }
33
33
  render() {
34
34
  return _`
@@ -40,10 +40,10 @@ let C = (() => {
40
40
  </div>
41
41
  `;
42
42
  }
43
- }, l = new WeakMap(), i = s, (() => {
43
+ }, n = new WeakMap(), i = s, (() => {
44
44
  const r = typeof Symbol == "function" && Symbol.metadata ? Object.create(d[Symbol.metadata] ?? null) : void 0;
45
- b = [S({ attribute: "image-alignment", reflect: !0 })], v(s, null, b, { kind: "accessor", name: "imageAlignment", static: !1, private: !1, access: { has: (m) => "imageAlignment" in m, get: (m) => m.imageAlignment, set: (m, n) => {
46
- m.imageAlignment = n;
45
+ b = [S({ attribute: "image-alignment", reflect: !0 })], v(s, null, b, { kind: "accessor", name: "imageAlignment", static: !1, private: !1, access: { has: (m) => "imageAlignment" in m, get: (m) => m.imageAlignment, set: (m, l) => {
46
+ m.imageAlignment = l;
47
47
  } }, metadata: r }, g, p), v(null, e = { value: i }, a, { kind: "class", name: i.name, metadata: r }, null, t), i = e.value, r && Object.defineProperty(i, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: r });
48
48
  })(), s.styles = E, o(i, t), i;
49
49
  })();
@@ -1,14 +1,14 @@
1
- import { __esDecorate as m, __runInitializers as n } from "tslib";
1
+ import { __esDecorate as s, __runInitializers as m } from "tslib";
2
2
  import { customElement as i } from "lit/decorators.js";
3
3
  import { SbbButtonBaseElement as c } from "../core/base-elements.js";
4
4
  import { SbbHeaderActionCommonElementMixin as u } from "./common.js";
5
5
  let p = (() => {
6
6
  var t;
7
- let s = [i("sbb-header-button")], l, r = [], e, o = u(c);
8
- return t = class extends o {
7
+ let o = [i("sbb-header-button")], l, r = [], e, n = u(c);
8
+ return t = class extends n {
9
9
  }, e = t, (() => {
10
- const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(o[Symbol.metadata] ?? null) : void 0;
11
- m(null, l = { value: e }, s, { kind: "class", name: e.name, metadata: a }, null, r), e = l.value, a && Object.defineProperty(e, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: a }), n(e, r);
10
+ const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(n[Symbol.metadata] ?? null) : void 0;
11
+ s(null, l = { value: e }, o, { kind: "class", name: e.name, metadata: a }, null, r), e = l.value, a && Object.defineProperty(e, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: a }), m(e, r);
12
12
  })(), e;
13
13
  })();
14
14
  export {
@@ -1,14 +1,14 @@
1
- import { __esDecorate as m, __runInitializers as n } from "tslib";
1
+ import { __esDecorate as s, __runInitializers as m } from "tslib";
2
2
  import { customElement as o } from "lit/decorators.js";
3
3
  import { SbbLinkBaseElement as c } from "../core/base-elements.js";
4
4
  import { SbbHeaderActionCommonElementMixin as b } from "./common.js";
5
5
  let p = (() => {
6
6
  var t;
7
- let s = [o("sbb-header-link")], l, r = [], e, i = b(c);
8
- return t = class extends i {
7
+ let i = [o("sbb-header-link")], l, r = [], e, n = b(c);
8
+ return t = class extends n {
9
9
  }, e = t, (() => {
10
- const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(i[Symbol.metadata] ?? null) : void 0;
11
- m(null, l = { value: e }, s, { kind: "class", name: e.name, metadata: a }, null, r), e = l.value, a && Object.defineProperty(e, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: a }), n(e, r);
10
+ const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(n[Symbol.metadata] ?? null) : void 0;
11
+ s(null, l = { value: e }, i, { kind: "class", name: e.name, metadata: a }, null, r), e = l.value, a && Object.defineProperty(e, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: a }), m(e, r);
12
12
  })(), e;
13
13
  })();
14
14
  export {
package/icon.js CHANGED
@@ -32,15 +32,15 @@ const R = (t) => typeof t == "string", q = (t) => {
32
32
  const c = a.firstElementChild;
33
33
  return c && c.nodeName.toLowerCase() === "svg" && (i && !c.classList.contains("color-immutable") && c.classList.add("color-immutable"), e === !1 || q(c)) ? a.innerHTML : "";
34
34
  }, U = "https://icons.app.sbb.ch/", X = (/* @__PURE__ */ new Map()).set("default", `${U}icons/`).set("picto", `${U}picto/`), j = /* @__PURE__ */ new Map(), Y = (t, e, i) => {
35
- var u;
36
- const a = Q().icon ?? {}, c = ((u = a.namespaces) == null ? void 0 : u.get(t)) ?? X.get(t);
35
+ var m;
36
+ const a = Q().icon ?? {}, c = ((m = a.namespaces) == null ? void 0 : m.get(t)) ?? X.get(t);
37
37
  if (c == null)
38
38
  throw Error(`Unable to find the namespace "${t}". Please register your custom namespace.`);
39
39
  const l = `${c}${e}.svg`;
40
- let m = j.get(l);
41
- if (!m)
40
+ let u = j.get(l);
41
+ if (!u)
42
42
  if (typeof fetch < "u" && !P)
43
- m = (a.interceptor ?? ((h) => h.request()))({
43
+ u = (a.interceptor ?? ((h) => h.request()))({
44
44
  namespace: t,
45
45
  name: e,
46
46
  url: l,
@@ -51,24 +51,24 @@ const R = (t) => typeof t == "string", q = (t) => {
51
51
  }).catch((h) => {
52
52
  throw Error(h);
53
53
  })
54
- }), j.set(l, m);
54
+ }), j.set(l, u);
55
55
  else
56
56
  return Promise.resolve("");
57
- return m;
57
+ return u;
58
58
  }, Z = B`*,:before,:after{box-sizing:border-box}:host{display:inline-block;line-height:0;-webkit-tap-highlight-color:transparent}:host([data-empty]){--sbb-icon-default-dimension: 0}:host([data-empty][data-namespace=default][name$=-small]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-small)}:host([data-empty][data-namespace=default][name$=-medium]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-medium)}:host([data-empty][data-namespace=default][name$=-large]){--sbb-icon-default-dimension: var(--sbb-size-icon-ui-large)}svg{width:var(--sbb-icon-svg-width, var(--sbb-icon-default-dimension));height:var(--sbb-icon-svg-height, var(--sbb-icon-default-dimension));stroke:var(--sbb-icon-svg-stroke-color);stroke-width:var(--sbb-icon-svg-stroke-width)}svg:not(.color-immutable) [fill]:not([fill=none]){fill:currentcolor}svg:not(.color-immutable) [stroke]:not([stroke=none]){stroke:currentcolor}svg:not(.color-immutable)>:where(path,polygon,polyline):where(:not([stroke]):not([fill])),svg:not(.color-immutable) :where(:not([stroke]):not([fill])) :where(path,polygon,polyline):where(:not([stroke]):not([fill])){fill:currentcolor}`, k = "default";
59
59
  let tt = (() => {
60
60
  var z, A, r, s;
61
61
  let t = [G({
62
62
  "data-namespace": k,
63
63
  "data-empty": ""
64
- })], e, i = [], a, c = F, l, m = [], u = [], w, h = [], g = [], b, p = [], f = [];
64
+ })], e, i = [], a, c = F, l, u = [], m = [], w, h = [], g = [], b, f = [], p = [];
65
65
  return s = class extends c {
66
66
  constructor() {
67
67
  super(...arguments);
68
- N(this, z, d(this, m, k));
69
- N(this, A, (d(this, u), d(this, h, null)));
70
- N(this, r, (d(this, g), d(this, p, !1)));
71
- d(this, f);
68
+ N(this, z, d(this, u, k));
69
+ N(this, A, (d(this, m), d(this, h, null)));
70
+ N(this, r, (d(this, g), d(this, f, !1)));
71
+ d(this, p);
72
72
  }
73
73
  get _svgNamespace() {
74
74
  return I(this, z);
@@ -142,21 +142,21 @@ let tt = (() => {
142
142
  const o = typeof Symbol == "function" && Symbol.metadata ? Object.create(c[Symbol.metadata] ?? null) : void 0;
143
143
  l = [x()], w = [x()], b = [E(), L({ attribute: "no-sanitize", type: Boolean })], v(s, null, l, { kind: "accessor", name: "_svgNamespace", static: !1, private: !1, access: { has: (n) => "_svgNamespace" in n, get: (n) => n._svgNamespace, set: (n, S) => {
144
144
  n._svgNamespace = S;
145
- } }, metadata: o }, m, u), v(s, null, w, { kind: "accessor", name: "_svgIcon", static: !1, private: !1, access: { has: (n) => "_svgIcon" in n, get: (n) => n._svgIcon, set: (n, S) => {
145
+ } }, metadata: o }, u, m), v(s, null, w, { kind: "accessor", name: "_svgIcon", static: !1, private: !1, access: { has: (n) => "_svgIcon" in n, get: (n) => n._svgIcon, set: (n, S) => {
146
146
  n._svgIcon = S;
147
147
  } }, metadata: o }, h, g), v(s, null, b, { kind: "accessor", name: "noSanitize", static: !1, private: !1, access: { has: (n) => "noSanitize" in n, get: (n) => n.noSanitize, set: (n, S) => {
148
148
  n.noSanitize = S;
149
- } }, metadata: o }, p, f), v(null, e = { value: a }, t, { kind: "class", name: a.name, metadata: o }, null, i), a = e.value, o && Object.defineProperty(a, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: o });
149
+ } }, metadata: o }, f, p), v(null, e = { value: a }, t, { kind: "class", name: a.name, metadata: o }, null, i), a = e.value, o && Object.defineProperty(a, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: o });
150
150
  })(), s.styles = Z, d(a, i), a;
151
151
  })(), ct = (() => {
152
- var b, p, f;
153
- let t = [V("sbb-icon")], e, i = [], a, c = tt, l, m = [], u = [], w, h = [], g = [];
154
- return f = class extends c {
152
+ var b, f, p;
153
+ let t = [V("sbb-icon")], e, i = [], a, c = tt, l, u = [], m = [], w, h = [], g = [];
154
+ return p = class extends c {
155
155
  constructor() {
156
156
  super(...arguments);
157
157
  N(this, b);
158
- N(this, p);
159
- _(this, b, d(this, m, "")), this._defaultAriaLabel = (d(this, u), ""), _(this, p, d(this, h, !1)), d(this, g);
158
+ N(this, f);
159
+ _(this, b, d(this, u, "")), this._defaultAriaLabel = (d(this, m), ""), _(this, f, d(this, h, !1)), d(this, g);
160
160
  }
161
161
  /**
162
162
  * We need to additionally observe the svgicon attribute
@@ -183,10 +183,10 @@ let tt = (() => {
183
183
  * components) we need to check whether the attribute svgicon is used.
184
184
  */
185
185
  get _sbbAngularCompatibility() {
186
- return I(this, p);
186
+ return I(this, f);
187
187
  }
188
188
  set _sbbAngularCompatibility(r) {
189
- _(this, p, r);
189
+ _(this, f, r);
190
190
  }
191
191
  async fetchSvgIcon(r, s) {
192
192
  return this.getAttribute("aria-label") === this._defaultAriaLabel && this.removeAttribute("aria-label"), this._defaultAriaLabel = `Icon ${s.replace(/-/g, " ")}`, this.getAttribute("aria-hidden") === "false" && !this.hasAttribute("aria-label") && s && this.setAttribute("aria-label", this._defaultAriaLabel), super.fetchSvgIcon(r, s);
@@ -203,22 +203,22 @@ let tt = (() => {
203
203
  render() {
204
204
  return this._sbbAngularCompatibility ? C`<slot></slot>` : super.render();
205
205
  }
206
- }, b = new WeakMap(), p = new WeakMap(), a = f, (() => {
206
+ }, b = new WeakMap(), f = new WeakMap(), a = p, (() => {
207
207
  const r = typeof Symbol == "function" && Symbol.metadata ? Object.create(c[Symbol.metadata] ?? null) : void 0;
208
- l = [E(), L({ reflect: !0, converter: D })], w = [x()], v(f, null, l, { kind: "accessor", name: "name", static: !1, private: !1, access: { has: (s) => "name" in s, get: (s) => s.name, set: (s, y) => {
208
+ l = [E(), L({ reflect: !0, converter: D })], w = [x()], v(p, null, l, { kind: "accessor", name: "name", static: !1, private: !1, access: { has: (s) => "name" in s, get: (s) => s.name, set: (s, y) => {
209
209
  s.name = y;
210
- } }, metadata: r }, m, u), v(f, null, w, { kind: "accessor", name: "_sbbAngularCompatibility", static: !1, private: !1, access: { has: (s) => "_sbbAngularCompatibility" in s, get: (s) => s._sbbAngularCompatibility, set: (s, y) => {
210
+ } }, metadata: r }, u, m), v(p, null, w, { kind: "accessor", name: "_sbbAngularCompatibility", static: !1, private: !1, access: { has: (s) => "_sbbAngularCompatibility" in s, get: (s) => s._sbbAngularCompatibility, set: (s, y) => {
211
211
  s._sbbAngularCompatibility = y;
212
212
  } }, metadata: r }, h, g), v(null, e = { value: a }, t, { kind: "class", name: a.name, metadata: r }, null, i), a = e.value, r && Object.defineProperty(a, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: r }), d(a, i);
213
213
  })(), a;
214
214
  })();
215
- const mt = (t) => (() => {
216
- var m, u;
215
+ const ut = (t) => (() => {
216
+ var u, m;
217
217
  let i = t, a, c = [], l = [];
218
- return u = class extends i {
218
+ return m = class extends i {
219
219
  constructor() {
220
220
  super(...arguments);
221
- N(this, m, d(this, c, ""));
221
+ N(this, u, d(this, c, ""));
222
222
  d(this, l);
223
223
  }
224
224
  /**
@@ -227,10 +227,10 @@ const mt = (t) => (() => {
227
227
  * https://icons.app.sbb.ch.
228
228
  */
229
229
  get iconName() {
230
- return I(this, m);
230
+ return I(this, u);
231
231
  }
232
232
  set iconName(g) {
233
- _(this, m, g);
233
+ _(this, u, g);
234
234
  }
235
235
  renderIconSlot(g) {
236
236
  return C`
@@ -239,17 +239,17 @@ const mt = (t) => (() => {
239
239
  </slot>
240
240
  `;
241
241
  }
242
- }, m = new WeakMap(), (() => {
242
+ }, u = new WeakMap(), (() => {
243
243
  const g = typeof Symbol == "function" && Symbol.metadata ? Object.create(i[Symbol.metadata] ?? null) : void 0;
244
- a = [E(), L({ attribute: "icon-name", reflect: !0, converter: D })], v(u, null, a, { kind: "accessor", name: "iconName", static: !1, private: !1, access: { has: (b) => "iconName" in b, get: (b) => b.iconName, set: (b, p) => {
245
- b.iconName = p;
246
- } }, metadata: g }, c, l), g && Object.defineProperty(u, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: g });
247
- })(), u;
244
+ a = [E(), L({ attribute: "icon-name", reflect: !0, converter: D })], v(m, null, a, { kind: "accessor", name: "iconName", static: !1, private: !1, access: { has: (b) => "iconName" in b, get: (b) => b.iconName, set: (b, f) => {
245
+ b.iconName = f;
246
+ } }, metadata: g }, c, l), g && Object.defineProperty(m, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: g });
247
+ })(), m;
248
248
  })();
249
249
  export {
250
250
  tt as SbbIconBase,
251
251
  ct as SbbIconElement,
252
- mt as SbbIconNameMixin,
252
+ ut as SbbIconNameMixin,
253
253
  Y as getSvgContent,
254
254
  q as isValid,
255
255
  W as validateContent
@@ -5,11 +5,11 @@ import { SbbDisabledTabIndexActionMixin as c } from "../core/mixins.js";
5
5
  import { SbbBlockLinkCommonElementMixin as u } from "./common.js";
6
6
  let k = (() => {
7
7
  var e;
8
- let n = [s("sbb-block-link-button")], l, o = [], t, i = u(c(b));
9
- return e = class extends i {
8
+ let i = [s("sbb-block-link-button")], l, n = [], t, o = u(c(b));
9
+ return e = class extends o {
10
10
  }, t = e, (() => {
11
- const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(i[Symbol.metadata] ?? null) : void 0;
12
- r(null, l = { value: t }, n, { kind: "class", name: t.name, metadata: a }, null, o), t = l.value, a && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: a }), m(t, o);
11
+ const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(o[Symbol.metadata] ?? null) : void 0;
12
+ r(null, l = { value: t }, i, { kind: "class", name: t.name, metadata: a }, null, n), t = l.value, a && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: a }), m(t, n);
13
13
  })(), t;
14
14
  })();
15
15
  export {