@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/autocomplete.js CHANGED
@@ -1,33 +1,35 @@
1
- var C = (s) => {
2
- throw TypeError(s);
1
+ var D = (i) => {
2
+ throw TypeError(i);
3
3
  };
4
- var O = (s, a, n) => a.has(s) || C("Cannot " + n);
5
- var w = (s, a, n) => (O(s, a, "read from private field"), n ? n.call(s) : a.get(s)), y = (s, a, n) => a.has(s) ? C("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(s) : a.set(s, n), u = (s, a, n, l) => (O(s, a, "write to private field"), l ? l.call(s, n) : a.set(s, n), n);
6
- import { __runInitializers as m, __esDecorate as x } from "tslib";
7
- import { property as E, customElement as T } from "lit/decorators.js";
8
- import { getNextElementIndex as $ } from "./core/a11y.js";
9
- import { forceType as N, hostAttributes as R } from "./core/decorators.js";
10
- import { isZeroAnimationDuration as U, findReferencedElement as S, isSafari as L } from "./core/dom.js";
11
- import { isEventOnElement as k, setOverlayPosition as j, removeAriaComboBoxAttributes as q, overlayGapFixCorners as K, setAriaComboBoxAttributes as M } from "./core/overlay.js";
12
- import { css as B, isServer as H, html as V, nothing as P } from "lit";
13
- import { ref as z } from "lit/directives/ref.js";
14
- import { SbbOpenCloseBaseElement as Y } from "./core/base-elements.js";
15
- import { SbbConnectedAbortController as Z } from "./core/controllers.js";
16
- import { SbbNegativeMixin as F, SbbHydrationMixin as G } from "./core/mixins.js";
17
- const J = B`*,:before,:after{box-sizing:border-box}.sbb-gap-fix-wrapper{position:relative;overflow:hidden;width:var(--sbb-options-panel-border-radius);height:var(--sbb-options-panel-border-radius);background-color:transparent}.sbb-gap-fix-corner{position:absolute;border-radius:50%;border:calc(var(--sbb-options-panel-border-radius) / 2) solid var(--sbb-options-panel-background-color);width:calc(var(--sbb-options-panel-border-radius) * 3);height:calc(var(--sbb-options-panel-border-radius) * 3);bottom:calc(var(--sbb-options-panel-border-radius) / 2 * -1)}.sbb-gap-fix-corner#left{left:calc(var(--sbb-options-panel-border-radius) / 2 * -1)}:host(:dir(rtl)) .sbb-gap-fix-corner#left{right:calc(var(--sbb-options-panel-border-radius) / 2 * -1);left:unset}.sbb-gap-fix-corner#right{right:calc(var(--sbb-options-panel-border-radius) / 2 * -1)}:host(:dir(rtl)) .sbb-gap-fix-corner#right{left:calc(var(--sbb-options-panel-border-radius) / 2 * -1);right:unset}: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-options-panel-position-x: 0;--sbb-options-panel-position-y: 0;--sbb-options-panel-active-option-y: 0;--sbb-options-panel-max-height: calc(85vh - var(--sbb-spacing-fixed-8x));--sbb-options-panel-min-height: var(--sbb-options-panel-origin-height);--sbb-options-panel-visibility: visible;--sbb-options-panel-width: fit-content;--sbb-options-panel-border-radius: var(--sbb-border-radius-4x);--sbb-options-panel-options-border-radius: 0 0 var(--sbb-options-panel-border-radius) var(--sbb-options-panel-border-radius);--sbb-options-panel-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-options-panel-animation-timing-function: ease;--sbb-options-panel-gap-fix-opacity: 0;--sbb-options-panel-gap-fix-transform: none;--sbb-options-panel-gap-fix-top: calc( var(--sbb-options-panel-position-y) - var(--sbb-options-panel-border-radius) );--sbb-options-panel-background-color: var(--sbb-color-white);--sbb-focus-outline-color: var(--sbb-focus-outline-color-default);--sbb-options-pointer-events: all;--sbb-options-panel-internal-z-index: var( --sbb-autocomplete-z-index, var(--sbb-overlay-default-z-index) );display:block}:host([negative]){--sbb-scrollbar-color: var(--sbb-color-white-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-white-alpha-60);--sbb-options-panel-background-color: var(--sbb-color-midnight);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark)}:host(:not([data-state])),:host([data-state=closed]){--sbb-options-panel-visibility: hidden;--sbb-options-pointer-events: none}:host([data-state=opening]){--sbb-options-panel-animation-name: open}:host([data-state=closing]){--sbb-options-panel-animation-name: close}:host([data-state=opened]),:host([data-state=opening]){--sbb-options-panel-gap-fix-opacity: 1}:host([data-options-panel-position=below]){--sbb-options-panel-animation-transform: translateY( calc((var(--sbb-options-panel-origin-height) / 2) * -1) )}:host([data-options-panel-position=above]){--sbb-options-panel-options-border-radius: var(--sbb-options-panel-border-radius) var(--sbb-options-panel-border-radius) 0 0;--sbb-options-panel-gap-fix-top: var(--sbb-options-panel-max-height);--sbb-options-panel-gap-fix-transform: rotate(180deg);--sbb-options-panel-animation-transform: translateY( calc(var(--sbb-options-panel-origin-height) / 2) )}:host([preserve-icon-space]){--sbb-option-icon-container-display: block}::slotted(sbb-divider){margin-block:var(--sbb-spacing-fixed-3x)}.sbb-autocomplete__container{position:fixed;pointer-events:none;top:0;right:0;bottom:0;left:0;z-index:var(--sbb-options-panel-internal-z-index)}.sbb-autocomplete__gap-fix{display:flex;justify-content:space-between;position:fixed;visibility:var(--sbb-options-panel-visibility);opacity:var(--sbb-options-panel-gap-fix-opacity);background-color:transparent;width:var(--sbb-options-panel-width);height:var(--sbb-options-panel-border-radius);top:var(--sbb-options-panel-gap-fix-top);left:var(--sbb-options-panel-position-x);transform:var(--sbb-options-panel-gap-fix-transform);transition:opacity var(--sbb-options-panel-animation-duration) var(--sbb-options-panel-animation-timing-function)}.sbb-autocomplete__panel{display:block;position:absolute;visibility:var(--sbb-options-panel-visibility);overflow:hidden;background-color:transparent;border:none;border-radius:var(--sbb-options-panel-border-radius);top:var(--sbb-options-panel-position-y);left:var(--sbb-options-panel-position-x);width:var(--sbb-options-panel-width);transition:box-shadow var(--sbb-options-panel-animation-duration) var(--sbb-options-panel-animation-timing-function)}.sbb-autocomplete__panel:before,.sbb-autocomplete__panel:after{content:"";display:none;position:relative;width:100%;height:var(--sbb-options-panel-origin-height);background-color:transparent;border-radius:var(--sbb-options-panel-border-radius);pointer-events:none;transition:box-shadow var(--sbb-options-panel-animation-duration) var(--sbb-options-panel-animation-timing-function);z-index:1}:host([data-options-panel-position=below]) .sbb-autocomplete__panel{inset-block-start:calc(var(--sbb-options-panel-position-y) - var(--sbb-options-panel-origin-height))}:host(:is([data-state=opened],[data-state=opening])) .sbb-autocomplete__panel{box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-elevation-level-5-hard-2-color),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-elevation-level-5-hard-1-color)}:host(:is([data-state=opened],[data-state=opening])[negative]) .sbb-autocomplete__panel{box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-elevation-level-5-hard-negative-2-color),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-elevation-level-5-hard-negative-1-color)}:host([data-options-panel-position=below]) .sbb-autocomplete__panel:before{display:block}:host([data-options-panel-position=above]) .sbb-autocomplete__panel:after{display:block}:host(:is([data-state=opened],[data-state=opening])[data-option-panel-origin-borderless]) .sbb-autocomplete__panel:before,:host(:is([data-state=opened],[data-state=opening])[data-option-panel-origin-borderless]) .sbb-autocomplete__panel:after{box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-elevation-level-5-hard-2-color),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-elevation-level-5-hard-1-color)}:host(:is([data-state=opened],[data-state=opening])[data-option-panel-origin-borderless][negative]) .sbb-autocomplete__panel:before,:host(:is([data-state=opened],[data-state=opening])[data-option-panel-origin-borderless][negative]) .sbb-autocomplete__panel:after{box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-elevation-level-5-hard-negative-2-color),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-elevation-level-5-hard-negative-1-color)}.sbb-autocomplete__wrapper{overflow:hidden}.sbb-autocomplete__options{background-color:var(--sbb-options-panel-background-color);padding-block:var(--sbb-spacing-fixed-3x);padding-inline:0;border-radius:var(--sbb-options-panel-options-border-radius);max-height:var(--sbb-options-panel-max-height);min-height:var(--sbb-options-panel-min-height);pointer-events:all;overflow-y:auto;animation-name:var(--sbb-options-panel-animation-name);animation-duration:var(--sbb-options-panel-animation-duration);animation-timing-function:var(--sbb-options-panel-animation-timing-function);--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-autocomplete__options::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-autocomplete__options::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-autocomplete__options::-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-autocomplete__options::-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-autocomplete__options::-webkit-scrollbar-button,.sbb-autocomplete__options::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-autocomplete__options{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-autocomplete__options{pointer-events:var(--sbb-options-pointer-events)}@media (forced-colors: active){.sbb-autocomplete__options{border:var(--sbb-border-width-1x) solid CanvasText;border-top:none}}@keyframes open{0%{transform:var(--sbb-options-panel-animation-transform);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes close{0%{transform:translateY(0);opacity:1}to{transform:var(--sbb-options-panel-animation-transform);opacity:0}}`, A = L;
18
- let Q = (() => {
19
- var p, v, g, b;
20
- let s = F(G(Y)), a, n = [], l = [], _, c = [], I = [], o, r = [], h = [];
21
- return b = class extends s {
4
+ var z = (i, a, l) => a.has(i) || D("Cannot " + l);
5
+ var A = (i, a, l) => (z(i, a, "read from private field"), l ? l.call(i) : a.get(i)), I = (i, a, l) => a.has(i) ? D("Cannot add the same private member more than once") : a instanceof WeakSet ? a.add(i) : a.set(i, l), v = (i, a, l, n) => (z(i, a, "write to private field"), n ? n.call(i, l) : a.set(i, l), l);
6
+ import { __runInitializers as h, __esDecorate as k } from "tslib";
7
+ import { property as S, customElement as U } from "lit/decorators.js";
8
+ import { getNextElementIndex as j } from "./core/a11y.js";
9
+ import { hostAttributes as N, forceType as q } from "./core/decorators.js";
10
+ import { isZeroAnimationDuration as K, findReferencedElement as L, isSafari as R } from "./core/dom.js";
11
+ import { isEventOnElement as C, setOverlayPosition as M, removeAriaComboBoxAttributes as H, overlayGapFixCorners as V, setAriaComboBoxAttributes as Y } from "./core/overlay.js";
12
+ import { css as Z, isServer as F, html as G, nothing as T } from "lit";
13
+ import { ref as $ } from "lit/directives/ref.js";
14
+ import { SbbOpenCloseBaseElement as J } from "./core/base-elements.js";
15
+ import { SbbConnectedAbortController as Q } from "./core/controllers.js";
16
+ import { SbbNegativeMixin as W, SbbHydrationMixin as X } from "./core/mixins.js";
17
+ const ee = Z`*,:before,:after{box-sizing:border-box}.sbb-gap-fix-wrapper{position:relative;overflow:hidden;width:var(--sbb-options-panel-border-radius);height:var(--sbb-options-panel-border-radius);background-color:transparent}.sbb-gap-fix-corner{position:absolute;border-radius:50%;border:calc(var(--sbb-options-panel-border-radius) / 2) solid var(--sbb-options-panel-background-color);width:calc(var(--sbb-options-panel-border-radius) * 3);height:calc(var(--sbb-options-panel-border-radius) * 3);bottom:calc(var(--sbb-options-panel-border-radius) / 2 * -1)}.sbb-gap-fix-corner#left{left:calc(var(--sbb-options-panel-border-radius) / 2 * -1)}:host(:dir(rtl)) .sbb-gap-fix-corner#left{right:calc(var(--sbb-options-panel-border-radius) / 2 * -1);left:unset}.sbb-gap-fix-corner#right{right:calc(var(--sbb-options-panel-border-radius) / 2 * -1)}:host(:dir(rtl)) .sbb-gap-fix-corner#right{left:calc(var(--sbb-options-panel-border-radius) / 2 * -1);right:unset}: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-options-panel-position-x: 0;--sbb-options-panel-position-y: 0;--sbb-options-panel-active-option-y: 0;--sbb-options-panel-max-height: calc(85vh - var(--sbb-spacing-fixed-8x));--sbb-options-panel-min-height: var(--sbb-options-panel-origin-height);--sbb-options-panel-visibility: visible;--sbb-options-panel-width: fit-content;--sbb-options-panel-border-radius: var(--sbb-border-radius-4x);--sbb-options-panel-options-border-radius: 0 0 var(--sbb-options-panel-border-radius) var(--sbb-options-panel-border-radius);--sbb-options-panel-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-options-panel-animation-timing-function: ease;--sbb-options-panel-gap-fix-opacity: 0;--sbb-options-panel-gap-fix-transform: none;--sbb-options-panel-gap-fix-top: calc( var(--sbb-options-panel-position-y) - var(--sbb-options-panel-border-radius) );--sbb-options-panel-background-color: var(--sbb-color-white);--sbb-focus-outline-color: var(--sbb-focus-outline-color-default);--sbb-options-pointer-events: all;--sbb-options-panel-internal-z-index: var( --sbb-autocomplete-z-index, var(--sbb-overlay-default-z-index) );display:none}:host([data-state]:not([data-state=closed])){display:block}:host([negative]){--sbb-scrollbar-color: var(--sbb-color-white-alpha-30);--sbb-scrollbar-color-hover: var(--sbb-color-white-alpha-60);--sbb-options-panel-background-color: var(--sbb-color-midnight);--sbb-focus-outline-color: var(--sbb-focus-outline-color-dark)}:host(:not([data-state])),:host([data-state=closed]){--sbb-options-panel-visibility: hidden;--sbb-options-pointer-events: none}:host([data-state=opening]){--sbb-options-panel-animation-name: open}:host([data-state=closing]){--sbb-options-panel-animation-name: close}:host([data-state=opened]),:host([data-state=opening]){--sbb-options-panel-gap-fix-opacity: 1}:host([data-options-panel-position=below]){--sbb-options-panel-animation-transform: translateY( calc((var(--sbb-options-panel-origin-height) / 2) * -1) )}:host([data-options-panel-position=above]){--sbb-options-panel-options-border-radius: var(--sbb-options-panel-border-radius) var(--sbb-options-panel-border-radius) 0 0;--sbb-options-panel-gap-fix-top: var(--sbb-options-panel-max-height);--sbb-options-panel-gap-fix-transform: rotate(180deg);--sbb-options-panel-animation-transform: translateY( calc(var(--sbb-options-panel-origin-height) / 2) )}:host([preserve-icon-space]){--sbb-option-icon-container-display: block}::slotted(sbb-divider){margin-block:var(--sbb-spacing-fixed-3x)}.sbb-autocomplete__container{position:fixed;pointer-events:none;top:0;right:0;bottom:0;left:0;z-index:var(--sbb-options-panel-internal-z-index)}.sbb-autocomplete__gap-fix{display:flex;justify-content:space-between;position:fixed;visibility:var(--sbb-options-panel-visibility);opacity:var(--sbb-options-panel-gap-fix-opacity);background-color:transparent;width:var(--sbb-options-panel-width);height:var(--sbb-options-panel-border-radius);top:var(--sbb-options-panel-gap-fix-top);left:var(--sbb-options-panel-position-x);transform:var(--sbb-options-panel-gap-fix-transform);transition:opacity var(--sbb-options-panel-animation-duration) var(--sbb-options-panel-animation-timing-function)}.sbb-autocomplete__panel{display:block;position:absolute;visibility:var(--sbb-options-panel-visibility);overflow:hidden;background-color:transparent;border:none;border-radius:var(--sbb-options-panel-border-radius);top:var(--sbb-options-panel-position-y);left:var(--sbb-options-panel-position-x);width:var(--sbb-options-panel-width);transition:box-shadow var(--sbb-options-panel-animation-duration) var(--sbb-options-panel-animation-timing-function)}.sbb-autocomplete__panel:before,.sbb-autocomplete__panel:after{content:"";display:none;position:relative;width:100%;height:var(--sbb-options-panel-origin-height);background-color:transparent;border-radius:var(--sbb-options-panel-border-radius);pointer-events:none;transition:box-shadow var(--sbb-options-panel-animation-duration) var(--sbb-options-panel-animation-timing-function);z-index:1}:host([data-options-panel-position=below]) .sbb-autocomplete__panel{inset-block-start:calc(var(--sbb-options-panel-position-y) - var(--sbb-options-panel-origin-height))}:host(:is([data-state=opened],[data-state=opening])) .sbb-autocomplete__panel{box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-elevation-level-5-hard-2-color),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-elevation-level-5-hard-1-color)}:host(:is([data-state=opened],[data-state=opening])[negative]) .sbb-autocomplete__panel{box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-elevation-level-5-hard-negative-2-color),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-elevation-level-5-hard-negative-1-color)}:host([data-options-panel-position=below]) .sbb-autocomplete__panel:before{display:block}:host([data-options-panel-position=above]) .sbb-autocomplete__panel:after{display:block}:host(:is([data-state=opened],[data-state=opening])[data-option-panel-origin-borderless]) .sbb-autocomplete__panel:before,:host(:is([data-state=opened],[data-state=opening])[data-option-panel-origin-borderless]) .sbb-autocomplete__panel:after{box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-elevation-level-5-hard-2-color),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-elevation-level-5-hard-1-color)}:host(:is([data-state=opened],[data-state=opening])[data-option-panel-origin-borderless][negative]) .sbb-autocomplete__panel:before,:host(:is([data-state=opened],[data-state=opening])[data-option-panel-origin-borderless][negative]) .sbb-autocomplete__panel:after{box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-elevation-level-5-hard-negative-2-color),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-elevation-level-5-hard-negative-1-color)}.sbb-autocomplete__wrapper{overflow:hidden}.sbb-autocomplete__options{background-color:var(--sbb-options-panel-background-color);padding-block:var(--sbb-spacing-fixed-3x);padding-inline:0;border-radius:var(--sbb-options-panel-options-border-radius);max-height:var(--sbb-options-panel-max-height);min-height:var(--sbb-options-panel-min-height);pointer-events:all;overflow-y:auto;animation-name:var(--sbb-options-panel-animation-name);animation-duration:var(--sbb-options-panel-animation-duration);animation-timing-function:var(--sbb-options-panel-animation-timing-function);--sbb-scrollbar-width: var(--sbb-spacing-fixed-3x)}.sbb-autocomplete__options::-webkit-scrollbar{width:var(--sbb-scrollbar-width);height:var(--sbb-scrollbar-width);background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-autocomplete__options::-webkit-scrollbar-corner{background-color:var(--sbb-scrollbar-track-color, transparent)}.sbb-autocomplete__options::-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-autocomplete__options::-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-autocomplete__options::-webkit-scrollbar-button,.sbb-autocomplete__options::-webkit-scrollbar-corner{display:none}@supports not selector(::-webkit-scrollbar){.sbb-autocomplete__options{scrollbar-width:var(--sbb-scrollbar-width-firefox);scrollbar-color:var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent)}}.sbb-autocomplete__options{pointer-events:var(--sbb-options-pointer-events)}@media (forced-colors: active){.sbb-autocomplete__options{border:var(--sbb-border-width-1x) solid CanvasText;border-top:none}}@keyframes open{0%{transform:var(--sbb-options-panel-animation-transform);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes close{0%{transform:translateY(0);opacity:1}to{transform:var(--sbb-options-panel-animation-transform);opacity:0}}`, O = R;
18
+ let te = (() => {
19
+ var u, m, f, b;
20
+ let i = [N({
21
+ popover: "manual"
22
+ })], a, l = [], n, w = W(X(J)), d, P = [], o = [], r, c = [], g = [], y, x = [], E = [];
23
+ return b = class extends w {
22
24
  constructor() {
23
25
  super(...arguments);
24
- y(this, p);
25
- y(this, v);
26
- y(this, g);
27
- u(this, p, m(this, n, null)), u(this, v, (m(this, l), m(this, c, null))), u(this, g, (m(this, I), m(this, r, !1))), this._originElement = m(this, h), this.abort = new Z(this), this._didLoad = !1, this._isPointerDownEventOnMenu = !1, this._pointerDownListener = (e) => {
28
- this._isPointerDownEventOnMenu = k(this._overlay, e);
26
+ I(this, u);
27
+ I(this, m);
28
+ I(this, f);
29
+ v(this, u, h(this, P, null)), v(this, m, (h(this, o), h(this, c, null))), v(this, f, (h(this, g), h(this, x, !1))), this._originElement = h(this, E), this.abort = new Q(this), this._didLoad = !1, this._isPointerDownEventOnMenu = !1, this._pointerDownListener = (e) => {
30
+ this._isPointerDownEventOnMenu = C(this._overlay, e);
29
31
  }, this._closeOnBackdropClick = (e) => {
30
- !this._isPointerDownEventOnMenu && !k(this._overlay, e) && !k(this.originElement, e) && this.close();
32
+ !this._isPointerDownEventOnMenu && !C(this._overlay, e) && !C(this.originElement, e) && this.close();
31
33
  };
32
34
  }
33
35
  /**
@@ -35,10 +37,10 @@ let Q = (() => {
35
37
  * If not set, it will search for the first 'sbb-form-field' ancestor.
36
38
  */
37
39
  get origin() {
38
- return w(this, p);
40
+ return A(this, u);
39
41
  }
40
42
  set origin(e) {
41
- u(this, p, e);
43
+ v(this, u, e);
42
44
  }
43
45
  /**
44
46
  * The input element that will trigger the autocomplete opening; accepts both an element's id or an HTMLElement.
@@ -46,17 +48,17 @@ let Q = (() => {
46
48
  * If not set, will search for the first 'input' child of a 'sbb-form-field' ancestor.
47
49
  */
48
50
  get trigger() {
49
- return w(this, v);
51
+ return A(this, m);
50
52
  }
51
53
  set trigger(e) {
52
- u(this, v, e);
54
+ v(this, m, e);
53
55
  }
54
56
  /** Whether the icon space is preserved when no icon is set. */
55
57
  get preserveIconSpace() {
56
- return w(this, g);
58
+ return A(this, f);
57
59
  }
58
60
  set preserveIconSpace(e) {
59
- u(this, g, e);
61
+ v(this, f, e);
60
62
  }
61
63
  /** Returns the element where autocomplete overlay is attached to. */
62
64
  get originElement() {
@@ -68,17 +70,18 @@ let Q = (() => {
68
70
  }
69
71
  /** Opens the autocomplete. */
70
72
  open() {
71
- this.state !== "closed" || !this._overlay || this.options.length === 0 || this._readonly() || this.willOpen.emit() && (this.state = "opening", this._setOverlayPosition(), this._isZeroAnimationDuration() && this._handleOpening());
73
+ var e;
74
+ this.state !== "closed" || !this._overlay || this.options.length === 0 || this._readonly() || this.willOpen.emit() && ((e = this.showPopover) == null || e.call(this), this.state = "opening", this._setOverlayPosition(), this._isZeroAnimationDuration() && this._handleOpening());
72
75
  }
73
76
  /** Closes the autocomplete. */
74
77
  close() {
75
78
  this.state === "opened" && this.willClose.emit() && (this.state = "closing", this._openPanelEventsController.abort(), this._isZeroAnimationDuration() && this._handleClosing());
76
79
  }
77
80
  _isZeroAnimationDuration() {
78
- return U(this, "--sbb-options-panel-animation-duration");
81
+ return K(this, "--sbb-options-panel-animation-duration");
79
82
  }
80
83
  connectedCallback() {
81
- super.connectedCallback(), A && (this.id || (this.id = this.overlayId));
84
+ super.connectedCallback(), O && (this.id || (this.id = this.overlayId));
82
85
  const e = this.closest("sbb-form-field") ?? this.closest("[data-form-field]");
83
86
  e && (this.negative = e.hasAttribute("negative")), this._didLoad && this._componentSetup(), this.syncNegative();
84
87
  }
@@ -95,7 +98,7 @@ let Q = (() => {
95
98
  /** When an option is selected, update the input value and close the autocomplete. */
96
99
  onOptionSelected(e) {
97
100
  const t = e.target;
98
- t.selected && (this.options.filter((i) => i.id !== t.id && i.selected).forEach((i) => i.selected = !1), this.triggerElement && (Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, "value").set.call(this.triggerElement, t.value), this.triggerElement.dispatchEvent(new Event("change", { bubbles: !0 })), this.triggerElement.dispatchEvent(new InputEvent("input", { bubbles: !0, composed: !0 })), this.triggerElement.focus()), this.close());
101
+ t.selected && (this.options.filter((s) => s.id !== t.id && s.selected).forEach((s) => s.selected = !1), this.triggerElement && (Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, "value").set.call(this.triggerElement, t.value), this.triggerElement.dispatchEvent(new Event("change", { bubbles: !0 })), this.triggerElement.dispatchEvent(new InputEvent("input", { bubbles: !0, composed: !0 })), this.triggerElement.focus()), this.close());
99
102
  }
100
103
  _handleSlotchange() {
101
104
  var e;
@@ -107,17 +110,17 @@ let Q = (() => {
107
110
  return ((e = this.triggerElement) == null ? void 0 : e.hasAttribute("readonly")) ?? !1;
108
111
  }
109
112
  _componentSetup() {
110
- var e, t, i, d;
111
- H || ((e = this._triggerEventsController) == null || e.abort(), (t = this._openPanelEventsController) == null || t.abort(), this._originElement = void 0, this.toggleAttribute("data-option-panel-origin-borderless", !!((d = (i = this.closest) == null ? void 0 : i.call(this, "sbb-form-field")) != null && d.hasAttribute("borderless"))), this._bindTo(this._getTriggerElement()));
113
+ var e, t, s, p;
114
+ F || ((e = this._triggerEventsController) == null || e.abort(), (t = this._openPanelEventsController) == null || t.abort(), this._originElement = void 0, this.toggleAttribute("data-option-panel-origin-borderless", !!((p = (s = this.closest) == null ? void 0 : s.call(this, "sbb-form-field")) != null && p.hasAttribute("borderless"))), this._bindTo(this._getTriggerElement()));
112
115
  }
113
116
  /**
114
117
  * Retrieve the element where the autocomplete will be attached.
115
118
  * @returns 'origin' or the first 'sbb-form-field' ancestor.
116
119
  */
117
120
  _findOriginElement() {
118
- var t, i, d, f;
121
+ var t, s, p, _;
119
122
  let e;
120
- if (this.origin ? e = S(this.origin) : e = (f = (d = (i = (t = this.closest) == null ? void 0 : t.call(this, "sbb-form-field")) == null ? void 0 : i.shadowRoot) == null ? void 0 : d.querySelector) == null ? void 0 : f.call(d, "#overlay-anchor"), !e)
123
+ if (this.origin ? e = L(this.origin) : e = (_ = (p = (s = (t = this.closest) == null ? void 0 : t.call(this, "sbb-form-field")) == null ? void 0 : s.shadowRoot) == null ? void 0 : p.querySelector) == null ? void 0 : _.call(p, "#overlay-anchor"), !e)
121
124
  throw new Error('Cannot find the origin element. Please specify a valid element or read the "origin" prop documentation');
122
125
  return e;
123
126
  }
@@ -126,10 +129,10 @@ let Q = (() => {
126
129
  * @returns 'trigger' or the first 'input' inside the origin element.
127
130
  */
128
131
  _getTriggerElement() {
129
- var t, i;
132
+ var t, s;
130
133
  if (!this.trigger)
131
- return (i = (t = this.closest) == null ? void 0 : t.call(this, "sbb-form-field")) == null ? void 0 : i.querySelector("input");
132
- const e = S(this.trigger);
134
+ return (s = (t = this.closest) == null ? void 0 : t.call(this, "sbb-form-field")) == null ? void 0 : s.querySelector("input");
135
+ const e = L(this.trigger);
133
136
  if (!e)
134
137
  throw new Error('Cannot find the trigger element. Please specify a valid element or read the "trigger" prop documentation');
135
138
  return e;
@@ -138,18 +141,18 @@ let Q = (() => {
138
141
  e && (this._removeTriggerAttributes(this.triggerElement), this.setTriggerAttributes(e), this._triggerElement = e, this._setupTriggerEvents());
139
142
  }
140
143
  _setupTriggerEvents() {
141
- var e, t, i, d;
144
+ var e, t, s, p;
142
145
  this._triggerEventsController = new AbortController(), (e = this.triggerElement) == null || e.addEventListener("focus", () => this.open(), {
143
146
  signal: this._triggerEventsController.signal
144
147
  }), (t = this.triggerElement) == null || t.addEventListener("click", () => this.open(), {
145
148
  signal: this._triggerEventsController.signal
146
- }), (i = this.triggerElement) == null || i.addEventListener("input", (f) => {
147
- this.open(), this._highlightOptions(f.target.value);
148
- }, { signal: this._triggerEventsController.signal }), (d = this.triggerElement) == null || d.addEventListener("keydown", (f) => this._closedPanelKeyboardInteraction(f), { signal: this._triggerEventsController.signal });
149
+ }), (s = this.triggerElement) == null || s.addEventListener("input", (_) => {
150
+ this.open(), this._highlightOptions(_.target.value);
151
+ }, { signal: this._triggerEventsController.signal }), (p = this.triggerElement) == null || p.addEventListener("keydown", (_) => this._closedPanelKeyboardInteraction(_), { signal: this._triggerEventsController.signal });
149
152
  }
150
153
  // Set overlay position, width and max height
151
154
  _setOverlayPosition() {
152
- j(this._overlay, this.originElement, this._optionContainer, this.shadowRoot.querySelector(".sbb-autocomplete__container"), this);
155
+ M(this._overlay, this.originElement, this._optionContainer, this.shadowRoot.querySelector(".sbb-autocomplete__container"), this);
153
156
  }
154
157
  /**
155
158
  * On open/close animation end.
@@ -164,8 +167,8 @@ let Q = (() => {
164
167
  this.state = "opened", this._attachOpenPanelEvents(), (e = this.triggerElement) == null || e.setAttribute("aria-expanded", "true"), this.didOpen.emit();
165
168
  }
166
169
  _handleClosing() {
167
- var e;
168
- this.state = "closed", (e = this.triggerElement) == null || e.setAttribute("aria-expanded", "false"), this.resetActiveElement(), this._optionContainer.scrollTop = 0, this.didClose.emit();
170
+ var e, t;
171
+ this.state = "closed", (e = this.hidePopover) == null || e.call(this), (t = this.triggerElement) == null || t.setAttribute("aria-expanded", "false"), this.resetActiveElement(), this._optionContainer.scrollTop = 0, this.didClose.emit();
169
172
  }
170
173
  _attachOpenPanelEvents() {
171
174
  var e;
@@ -201,25 +204,25 @@ let Q = (() => {
201
204
  e != null && this.options.forEach((t) => t.highlight(e));
202
205
  }
203
206
  _removeTriggerAttributes(e) {
204
- q(e);
207
+ H(e);
205
208
  }
206
209
  render() {
207
- return V`
210
+ return G`
208
211
  <div class="sbb-autocomplete__gap-fix"></div>
209
212
  <div class="sbb-autocomplete__container">
210
- <div class="sbb-autocomplete__gap-fix">${K()}</div>
213
+ <div class="sbb-autocomplete__gap-fix">${V()}</div>
211
214
  <div
212
215
  @animationend=${this._onAnimationEnd}
213
216
  class="sbb-autocomplete__panel"
214
217
  ?data-open=${this.state === "opened" || this.state === "opening"}
215
- ${z((e) => this._overlay = e)}
218
+ ${$((e) => this._overlay = e)}
216
219
  >
217
220
  <div class="sbb-autocomplete__wrapper">
218
221
  <div
219
222
  class="sbb-autocomplete__options"
220
- role=${A ? P : this.panelRole}
221
- id=${A ? P : this.overlayId}
222
- ${z((e) => this._optionContainer = e)}
223
+ role=${O ? T : this.panelRole}
224
+ id=${O ? T : this.overlayId}
225
+ ${$((e) => this._optionContainer = e)}
223
226
  >
224
227
  <slot @slotchange=${this._handleSlotchange}></slot>
225
228
  </div>
@@ -228,35 +231,35 @@ let Q = (() => {
228
231
  </div>
229
232
  `;
230
233
  }
231
- }, p = new WeakMap(), v = new WeakMap(), g = new WeakMap(), (() => {
232
- const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(s[Symbol.metadata] ?? null) : void 0;
233
- a = [E()], _ = [E()], o = [N(), E({ attribute: "preserve-icon-space", reflect: !0, type: Boolean })], x(b, null, a, { kind: "accessor", name: "origin", static: !1, private: !1, access: { has: (t) => "origin" in t, get: (t) => t.origin, set: (t, i) => {
234
- t.origin = i;
235
- } }, metadata: e }, n, l), x(b, null, _, { kind: "accessor", name: "trigger", static: !1, private: !1, access: { has: (t) => "trigger" in t, get: (t) => t.trigger, set: (t, i) => {
236
- t.trigger = i;
237
- } }, metadata: e }, c, I), x(b, null, o, { kind: "accessor", name: "preserveIconSpace", static: !1, private: !1, access: { has: (t) => "preserveIconSpace" in t, get: (t) => t.preserveIconSpace, set: (t, i) => {
238
- t.preserveIconSpace = i;
239
- } }, metadata: e }, r, h), e && Object.defineProperty(b, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
240
- })(), b.styles = J, b;
241
- })(), W = 0;
242
- const D = L;
243
- let ce = (() => {
244
- var c;
245
- let s = [T("sbb-autocomplete"), R({
246
- role: D ? "listbox" : null
247
- })], a, n = [], l, _ = Q;
248
- return c = class extends _ {
234
+ }, u = new WeakMap(), m = new WeakMap(), f = new WeakMap(), n = b, (() => {
235
+ const e = typeof Symbol == "function" && Symbol.metadata ? Object.create(w[Symbol.metadata] ?? null) : void 0;
236
+ d = [S()], r = [S()], y = [q(), S({ attribute: "preserve-icon-space", reflect: !0, type: Boolean })], k(b, null, d, { kind: "accessor", name: "origin", static: !1, private: !1, access: { has: (t) => "origin" in t, get: (t) => t.origin, set: (t, s) => {
237
+ t.origin = s;
238
+ } }, metadata: e }, P, o), k(b, null, r, { kind: "accessor", name: "trigger", static: !1, private: !1, access: { has: (t) => "trigger" in t, get: (t) => t.trigger, set: (t, s) => {
239
+ t.trigger = s;
240
+ } }, metadata: e }, c, g), k(b, null, y, { kind: "accessor", name: "preserveIconSpace", static: !1, private: !1, access: { has: (t) => "preserveIconSpace" in t, get: (t) => t.preserveIconSpace, set: (t, s) => {
241
+ t.preserveIconSpace = s;
242
+ } }, metadata: e }, x, E), k(null, a = { value: n }, i, { kind: "class", name: n.name, metadata: e }, null, l), n = a.value, e && Object.defineProperty(n, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: e });
243
+ })(), b.styles = ee, h(n, l), n;
244
+ })(), oe = 0;
245
+ const B = R;
246
+ let ue = (() => {
247
+ var d;
248
+ let i = [U("sbb-autocomplete"), N({
249
+ role: B ? "listbox" : null
250
+ })], a, l = [], n, w = te;
251
+ return d = class extends w {
249
252
  get options() {
250
253
  var o;
251
254
  return Array.from(((o = this.querySelectorAll) == null ? void 0 : o.call(this, "sbb-option")) ?? []);
252
255
  }
253
256
  constructor() {
254
257
  var o;
255
- super(), this.overlayId = `sbb-autocomplete-${++W}`, this.panelRole = "listbox", this._activeItemIndex = -1, (o = this.addEventListener) == null || o.call(this, "optionSelectionChange", (r) => this.onOptionSelected(r));
258
+ super(), this.overlayId = `sbb-autocomplete-${++oe}`, this.panelRole = "listbox", this._activeItemIndex = -1, (o = this.addEventListener) == null || o.call(this, "optionSelectionChange", (r) => this.onOptionSelected(r));
256
259
  }
257
260
  syncNegative() {
258
261
  var o, r;
259
- (o = this.querySelectorAll) == null || o.call(this, "sbb-divider").forEach((h) => h.negative = this.negative), (r = this.querySelectorAll) == null || r.call(this, "sbb-option, sbb-optgroup").forEach((h) => h.toggleAttribute("data-negative", this.negative));
262
+ (o = this.querySelectorAll) == null || o.call(this, "sbb-divider").forEach((c) => c.negative = this.negative), (r = this.querySelectorAll) == null || r.call(this, "sbb-option, sbb-optgroup").forEach((c) => c.toggleAttribute("data-negative", this.negative));
260
263
  }
261
264
  openedPanelKeyboardInteraction(o) {
262
265
  if (this.state === "opened")
@@ -280,11 +283,11 @@ let ce = (() => {
280
283
  r && r.setSelectedViaUserInteraction(!0);
281
284
  }
282
285
  setNextActiveOption(o) {
283
- var g;
284
- const r = this.options.filter((b) => !b.disabled && !b.hasAttribute("data-group-disabled")), h = $(o, this._activeItemIndex, r.length), p = r[h];
285
- p.setActive(!0), (g = this.triggerElement) == null || g.setAttribute("aria-activedescendant", p.id), p.scrollIntoView({ block: "nearest" });
286
- const v = r[this._activeItemIndex];
287
- v && v.setActive(!1), this._activeItemIndex = h;
286
+ var x;
287
+ const r = this.options.filter((E) => !E.disabled && !E.hasAttribute("data-group-disabled")), c = j(o, this._activeItemIndex, r.length), g = r[c];
288
+ g.setActive(!0), (x = this.triggerElement) == null || x.setAttribute("aria-activedescendant", g.id), g.scrollIntoView({ block: "nearest" });
289
+ const y = r[this._activeItemIndex];
290
+ y && y.setActive(!1), this._activeItemIndex = c;
288
291
  }
289
292
  resetActiveElement() {
290
293
  var r;
@@ -292,14 +295,14 @@ let ce = (() => {
292
295
  o && o.setActive(!1), this._activeItemIndex = -1, (r = this.triggerElement) == null || r.removeAttribute("aria-activedescendant");
293
296
  }
294
297
  setTriggerAttributes(o) {
295
- M(o, D ? this.id : this.overlayId, !1);
298
+ Y(o, B ? this.id : this.overlayId, !1);
296
299
  }
297
- }, l = c, (() => {
298
- const o = typeof Symbol == "function" && Symbol.metadata ? Object.create(_[Symbol.metadata] ?? null) : void 0;
299
- x(null, a = { value: l }, s, { kind: "class", name: l.name, metadata: o }, null, n), l = a.value, o && Object.defineProperty(l, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: o }), m(l, n);
300
- })(), l;
300
+ }, n = d, (() => {
301
+ const o = typeof Symbol == "function" && Symbol.metadata ? Object.create(w[Symbol.metadata] ?? null) : void 0;
302
+ k(null, a = { value: n }, i, { kind: "class", name: n.name, metadata: o }, null, l), n = a.value, o && Object.defineProperty(n, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: o }), h(n, l);
303
+ })(), n;
301
304
  })();
302
305
  export {
303
- Q as SbbAutocompleteBaseElement,
304
- ce as SbbAutocompleteElement
306
+ te as SbbAutocompleteBaseElement,
307
+ ue as SbbAutocompleteElement
305
308
  };
@@ -1,5 +1,5 @@
1
1
  import { __esDecorate as h, __runInitializers as m } from "tslib";
2
- import { ResizeController as f } from "@lit-labs/observers/resize-controller.js";
2
+ import { ResizeController as _ } from "@lit-labs/observers/resize-controller.js";
3
3
  import { css as v, LitElement as x, html as a, nothing as y } from "lit";
4
4
  import { customElement as C, state as w } from "lit/decorators.js";
5
5
  import { isArrowKeyPressed as k, sbbInputModalityDetector as z, getNextElementIndex as E } from "../core/a11y.js";
@@ -25,7 +25,7 @@ let P = (() => {
25
25
  }
26
26
  constructor() {
27
27
  var e;
28
- super(), this.listChildLocalNames = (m(this, n), ["sbb-breadcrumb"]), this._resizeObserver = new f(this, {
28
+ super(), this.listChildLocalNames = (m(this, n), ["sbb-breadcrumb"]), this._resizeObserver = new _(this, {
29
29
  target: null,
30
30
  skipInitial: !0,
31
31
  callback: () => this._evaluateCollapsedState()
@@ -67,8 +67,8 @@ let P = (() => {
67
67
  }
68
68
  _focusNext(e, r = this.listChildren) {
69
69
  var c;
70
- const i = r.findIndex((u) => u === document.activeElement || u === this.shadowRoot.activeElement), _ = E(e, i, r.length);
71
- (c = r[_]) == null || c.focus(), e.preventDefault();
70
+ const i = r.findIndex((u) => u === document.activeElement || u === this.shadowRoot.activeElement), f = E(e, i, r.length);
71
+ (c = r[f]) == null || c.focus(), e.preventDefault();
72
72
  }
73
73
  /**
74
74
  * Note: due to @State annotation on _state, this method triggers a new render; as a consequence, the focus is moved
@@ -1,17 +1,17 @@
1
- import { __esDecorate as s, __runInitializers as r } from "tslib";
1
+ import { __esDecorate as o, __runInitializers as r } from "tslib";
2
2
  import { customElement as m } from "lit/decorators.js";
3
3
  import { SbbLinkBaseElement as c } from "../core/base-elements.js";
4
4
  import { SbbDisabledInteractiveMixin as b, SbbDisabledMixin as u } from "../core/mixins.js";
5
- import { SbbButtonCommonElementMixin as S, buttonCommonStyle as d, buttonAccentStyle as f } from "./common.js";
6
- let D = (() => {
5
+ import { SbbButtonCommonElementMixin as d, buttonCommonStyle as S, buttonAccentStyle as f } from "./common.js";
6
+ let E = (() => {
7
7
  var e;
8
- let o = [m("sbb-accent-button-link")], l, i = [], t, n = S(b(u(c)));
9
- return e = class extends n {
8
+ let s = [m("sbb-accent-button-link")], l, n = [], t, i = d(b(u(c)));
9
+ return e = class extends i {
10
10
  }, t = e, (() => {
11
- const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(n[Symbol.metadata] ?? null) : void 0;
12
- s(null, l = { value: t }, o, { kind: "class", name: t.name, metadata: a }, null, i), t = l.value, a && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: a });
13
- })(), e.styles = [d, f], r(t, i), t;
11
+ const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(i[Symbol.metadata] ?? null) : void 0;
12
+ o(null, l = { value: t }, s, { 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 });
13
+ })(), e.styles = [S, f], r(t, n), t;
14
14
  })();
15
15
  export {
16
- D as SbbAccentButtonLinkElement
16
+ E as SbbAccentButtonLinkElement
17
17
  };
@@ -1,16 +1,16 @@
1
- import { __esDecorate as n, __runInitializers as r } from "tslib";
1
+ import { __esDecorate as i, __runInitializers as r } from "tslib";
2
2
  import { customElement as m } from "lit/decorators.js";
3
3
  import { SbbActionBaseElement as c } from "../core/base-elements.js";
4
4
  import { SbbDisabledMixin as b } from "../core/mixins.js";
5
5
  import { SbbButtonCommonElementMixin as u, buttonCommonStyle as S, buttonAccentStyle as d } from "./common.js";
6
6
  let E = (() => {
7
7
  var e;
8
- let i = [m("sbb-accent-button-static")], l, o = [], t, s = u(b(c));
9
- return e = class extends s {
8
+ let s = [m("sbb-accent-button-static")], l, n = [], t, o = u(b(c));
9
+ return e = class extends o {
10
10
  }, t = e, (() => {
11
- const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(s[Symbol.metadata] ?? null) : void 0;
12
- n(null, l = { value: t }, i, { 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 });
13
- })(), e.styles = [S, d], r(t, o), t;
11
+ const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(o[Symbol.metadata] ?? null) : void 0;
12
+ i(null, l = { value: t }, s, { 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 });
13
+ })(), e.styles = [S, d], r(t, n), t;
14
14
  })();
15
15
  export {
16
16
  E as SbbAccentButtonStaticElement
@@ -2,15 +2,15 @@ import { __esDecorate as i, __runInitializers as r } from "tslib";
2
2
  import { customElement as m } from "lit/decorators.js";
3
3
  import { SbbButtonBaseElement as c } from "../core/base-elements.js";
4
4
  import { SbbDisabledTabIndexActionMixin as b } from "../core/mixins.js";
5
- import { SbbButtonCommonElementMixin as u, buttonCommonStyle as d, buttonAccentStyle as S } from "./common.js";
5
+ import { SbbButtonCommonElementMixin as u, buttonCommonStyle as d, buttonAccentStyle as f } from "./common.js";
6
6
  let E = (() => {
7
7
  var e;
8
- let s = [m("sbb-accent-button")], l, o = [], t, n = u(b(c));
9
- return e = class extends n {
8
+ let s = [m("sbb-accent-button")], l, n = [], t, o = u(b(c));
9
+ return e = class extends o {
10
10
  }, t = e, (() => {
11
- const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(n[Symbol.metadata] ?? null) : void 0;
12
- i(null, l = { value: t }, s, { 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 });
13
- })(), e.styles = [d, S], r(t, o), t;
11
+ const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(o[Symbol.metadata] ?? null) : void 0;
12
+ i(null, l = { value: t }, s, { 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 });
13
+ })(), e.styles = [d, f], r(t, n), t;
14
14
  })();
15
15
  export {
16
16
  E as SbbAccentButtonElement
@@ -1,17 +1,17 @@
1
- import { __esDecorate as r, __runInitializers as s } from "tslib";
1
+ import { __esDecorate as s, __runInitializers as o } from "tslib";
2
2
  import { customElement as m } from "lit/decorators.js";
3
3
  import { SbbLinkBaseElement as b } from "../core/base-elements.js";
4
4
  import { SbbDisabledInteractiveMixin as c, SbbDisabledMixin as u } from "../core/mixins.js";
5
- import { SbbButtonCommonElementMixin as S, buttonCommonStyle as d, buttonPrimaryStyle as f } from "./common.js";
6
- let D = (() => {
5
+ import { SbbButtonCommonElementMixin as d, buttonCommonStyle as S, buttonPrimaryStyle as f } from "./common.js";
6
+ let E = (() => {
7
7
  var e;
8
- let o = [m("sbb-button-link")], l, i = [], t, n = S(c(u(b)));
8
+ let r = [m("sbb-button-link")], l, i = [], t, n = d(c(u(b)));
9
9
  return e = class extends n {
10
10
  }, t = e, (() => {
11
11
  const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(n[Symbol.metadata] ?? null) : void 0;
12
- r(null, l = { value: t }, o, { kind: "class", name: t.name, metadata: a }, null, i), t = l.value, a && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: a });
13
- })(), e.styles = [d, f], s(t, i), t;
12
+ s(null, l = { value: t }, r, { kind: "class", name: t.name, metadata: a }, null, i), t = l.value, a && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: a });
13
+ })(), e.styles = [S, f], o(t, i), t;
14
14
  })();
15
15
  export {
16
- D as SbbButtonLinkElement
16
+ E as SbbButtonLinkElement
17
17
  };
@@ -1,16 +1,16 @@
1
- import { __esDecorate as r, __runInitializers as m } from "tslib";
2
- import { customElement as n } from "lit/decorators.js";
1
+ import { __esDecorate as r, __runInitializers as n } from "tslib";
2
+ import { customElement as m } from "lit/decorators.js";
3
3
  import { SbbActionBaseElement as c } from "../core/base-elements.js";
4
4
  import { SbbDisabledMixin as b } from "../core/mixins.js";
5
5
  import { SbbButtonCommonElementMixin as u, buttonCommonStyle as S, buttonPrimaryStyle as d } from "./common.js";
6
6
  let E = (() => {
7
7
  var e;
8
- let s = [n("sbb-button-static")], l, o = [], t, i = u(b(c));
9
- return e = class extends i {
8
+ let s = [m("sbb-button-static")], l, i = [], t, o = u(b(c));
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 }, s, { 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 });
13
- })(), e.styles = [S, d], m(t, o), t;
11
+ const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(o[Symbol.metadata] ?? null) : void 0;
12
+ r(null, l = { value: t }, s, { kind: "class", name: t.name, metadata: a }, null, i), t = l.value, a && Object.defineProperty(t, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: a });
13
+ })(), e.styles = [S, d], n(t, i), t;
14
14
  })();
15
15
  export {
16
16
  E as SbbButtonStaticElement
package/button/button.js CHANGED
@@ -1,16 +1,16 @@
1
- import { __esDecorate as i, __runInitializers as n } from "tslib";
1
+ import { __esDecorate as s, __runInitializers as i } from "tslib";
2
2
  import { customElement as m } from "lit/decorators.js";
3
3
  import { SbbButtonBaseElement as b } from "../core/base-elements.js";
4
- import { SbbDisabledTabIndexActionMixin as c } from "../core/mixins.js";
5
- import { SbbButtonCommonElementMixin as u, buttonCommonStyle as d, buttonPrimaryStyle as S } from "./common.js";
4
+ import { SbbDisabledTabIndexActionMixin as u } from "../core/mixins.js";
5
+ import { SbbButtonCommonElementMixin as c, buttonCommonStyle as d, buttonPrimaryStyle as f } from "./common.js";
6
6
  let E = (() => {
7
7
  var e;
8
- let s = [m("sbb-button")], l, o = [], t, r = u(c(b));
9
- return e = class extends r {
8
+ let r = [m("sbb-button")], l, o = [], t, n = c(u(b));
9
+ return e = class extends n {
10
10
  }, t = e, (() => {
11
- const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(r[Symbol.metadata] ?? null) : void 0;
12
- i(null, l = { value: t }, s, { 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 });
13
- })(), e.styles = [d, S], n(t, o), t;
11
+ const a = typeof Symbol == "function" && Symbol.metadata ? Object.create(n[Symbol.metadata] ?? null) : void 0;
12
+ s(null, l = { value: t }, r, { 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 });
13
+ })(), e.styles = [d, f], i(t, o), t;
14
14
  })();
15
15
  export {
16
16
  E as SbbButtonElement