wj-elements 0.7.7 → 0.8.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 (233) hide show
  1. package/dist/animations.js +28 -51
  2. package/dist/animations.js.map +1 -1
  3. package/dist/base-path.js +19 -31
  4. package/dist/base-path.js.map +1 -1
  5. package/dist/custom-elements.json +11504 -11499
  6. package/dist/dark.css +1 -302
  7. package/dist/date.js +16 -36
  8. package/dist/date.js.map +1 -1
  9. package/dist/element-utils.js +20 -81
  10. package/dist/element-utils.js.map +1 -1
  11. package/dist/event.js +49 -165
  12. package/dist/event.js.map +1 -1
  13. package/dist/form-associated-element-BjeJn7j8.js +101 -0
  14. package/dist/{form-associated-element-DEQ4y-jn.js.map → form-associated-element-BjeJn7j8.js.map} +1 -1
  15. package/dist/icon-DmsqtDpL.js +102 -0
  16. package/dist/{icon-CReYMzAK.js.map → icon-DmsqtDpL.js.map} +1 -1
  17. package/dist/light.css +1 -731
  18. package/dist/localize.js +36 -111
  19. package/dist/localize.js.map +1 -1
  20. package/dist/packages/wje-accordion-item/accordion-item.element.d.ts +3 -2
  21. package/dist/permissions.js +14 -41
  22. package/dist/permissions.js.map +1 -1
  23. package/dist/popup.element-CbkhthPP.js +806 -0
  24. package/dist/{popup.element-CwXvVFK7.js.map → popup.element-CbkhthPP.js.map} +1 -1
  25. package/dist/router-links-CNsJ-elb.js +105 -0
  26. package/dist/{router-links-wjqCnncc.js.map → router-links-CNsJ-elb.js.map} +1 -1
  27. package/dist/skeleton.css +1 -197
  28. package/dist/styles.css +1 -866
  29. package/dist/universal-service.js +48 -109
  30. package/dist/universal-service.js.map +1 -1
  31. package/dist/utils.js +11 -18
  32. package/dist/utils.js.map +1 -1
  33. package/dist/web-types.json +760 -760
  34. package/dist/wje-accordion-item.js +33 -106
  35. package/dist/wje-accordion-item.js.map +1 -1
  36. package/dist/wje-accordion.js +19 -84
  37. package/dist/wje-accordion.js.map +1 -1
  38. package/dist/wje-animation.js +37 -4258
  39. package/dist/wje-animation.js.map +1 -1
  40. package/dist/wje-aside.js +9 -34
  41. package/dist/wje-aside.js.map +1 -1
  42. package/dist/wje-avatar.js +36 -126
  43. package/dist/wje-avatar.js.map +1 -1
  44. package/dist/wje-badge.js +10 -52
  45. package/dist/wje-badge.js.map +1 -1
  46. package/dist/wje-breadcrumb.js +205 -672
  47. package/dist/wje-breadcrumb.js.map +1 -1
  48. package/dist/wje-breadcrumbs.js +177 -633
  49. package/dist/wje-breadcrumbs.js.map +1 -1
  50. package/dist/wje-button-group.js +48 -153
  51. package/dist/wje-button-group.js.map +1 -1
  52. package/dist/wje-button.js +92 -413
  53. package/dist/wje-button.js.map +1 -1
  54. package/dist/wje-card-content.js +7 -30
  55. package/dist/wje-card-content.js.map +1 -1
  56. package/dist/wje-card-controls.js +7 -30
  57. package/dist/wje-card-controls.js.map +1 -1
  58. package/dist/wje-card-header.js +7 -30
  59. package/dist/wje-card-header.js.map +1 -1
  60. package/dist/wje-card-subtitle.js +7 -34
  61. package/dist/wje-card-subtitle.js.map +1 -1
  62. package/dist/wje-card-title.js +7 -34
  63. package/dist/wje-card-title.js.map +1 -1
  64. package/dist/wje-card.js +15 -71
  65. package/dist/wje-card.js.map +1 -1
  66. package/dist/wje-carousel-item.js +12 -56
  67. package/dist/wje-carousel-item.js.map +1 -1
  68. package/dist/wje-carousel.js +154 -509
  69. package/dist/wje-carousel.js.map +1 -1
  70. package/dist/wje-checkbox.js +50 -227
  71. package/dist/wje-checkbox.js.map +1 -1
  72. package/dist/wje-chip.js +43 -160
  73. package/dist/wje-chip.js.map +1 -1
  74. package/dist/wje-col.js +7 -20
  75. package/dist/wje-col.js.map +1 -1
  76. package/dist/wje-color-picker.js +445 -1464
  77. package/dist/wje-color-picker.js.map +1 -1
  78. package/dist/wje-container.js +9 -35
  79. package/dist/wje-container.js.map +1 -1
  80. package/dist/wje-copy-button.js +64 -204
  81. package/dist/wje-copy-button.js.map +1 -1
  82. package/dist/wje-dialog.js +85 -553
  83. package/dist/wje-dialog.js.map +1 -1
  84. package/dist/wje-divider.js +7 -34
  85. package/dist/wje-divider.js.map +1 -1
  86. package/dist/wje-dropdown.js +78 -305
  87. package/dist/wje-dropdown.js.map +1 -1
  88. package/dist/wje-element.js +191 -700
  89. package/dist/wje-element.js.map +1 -1
  90. package/dist/wje-file-upload-item.js +51 -156
  91. package/dist/wje-file-upload-item.js.map +1 -1
  92. package/dist/wje-file-upload.js +181 -619
  93. package/dist/wje-file-upload.js.map +1 -1
  94. package/dist/wje-footer.js +7 -31
  95. package/dist/wje-footer.js.map +1 -1
  96. package/dist/wje-form.js +7 -32
  97. package/dist/wje-form.js.map +1 -1
  98. package/dist/wje-format-digital.js +26 -118
  99. package/dist/wje-format-digital.js.map +1 -1
  100. package/dist/wje-grid.js +7 -33
  101. package/dist/wje-grid.js.map +1 -1
  102. package/dist/wje-header.js +9 -35
  103. package/dist/wje-header.js.map +1 -1
  104. package/dist/wje-icon-library.js +12 -18
  105. package/dist/wje-icon-library.js.map +1 -1
  106. package/dist/wje-icon-picker.js +65 -320
  107. package/dist/wje-icon-picker.js.map +1 -1
  108. package/dist/wje-icon.js +1 -1
  109. package/dist/wje-img-comparer.js +37 -114
  110. package/dist/wje-img-comparer.js.map +1 -1
  111. package/dist/wje-img.js +50 -198
  112. package/dist/wje-img.js.map +1 -1
  113. package/dist/wje-infinite-scroll.js +94 -346
  114. package/dist/wje-infinite-scroll.js.map +1 -1
  115. package/dist/wje-input-file.js +23 -84
  116. package/dist/wje-input-file.js.map +1 -1
  117. package/dist/wje-input.js +78 -392
  118. package/dist/wje-input.js.map +1 -1
  119. package/dist/wje-item.js +11 -64
  120. package/dist/wje-item.js.map +1 -1
  121. package/dist/wje-kanban.js +124 -401
  122. package/dist/wje-kanban.js.map +1 -1
  123. package/dist/wje-label.js +9 -32
  124. package/dist/wje-label.js.map +1 -1
  125. package/dist/wje-level-indicator.js +38 -157
  126. package/dist/wje-level-indicator.js.map +1 -1
  127. package/dist/wje-list.js +10 -40
  128. package/dist/wje-list.js.map +1 -1
  129. package/dist/wje-main.js +7 -31
  130. package/dist/wje-main.js.map +1 -1
  131. package/dist/wje-masonry.js +66 -211
  132. package/dist/wje-masonry.js.map +1 -1
  133. package/dist/wje-master.js +45 -161
  134. package/dist/wje-master.js.map +1 -1
  135. package/dist/wje-menu-button.js +10 -38
  136. package/dist/wje-menu-button.js.map +1 -1
  137. package/dist/wje-menu-item.js +127 -577
  138. package/dist/wje-menu-item.js.map +1 -1
  139. package/dist/wje-menu-label.js +9 -35
  140. package/dist/wje-menu-label.js.map +1 -1
  141. package/dist/wje-menu.js +14 -49
  142. package/dist/wje-menu.js.map +1 -1
  143. package/dist/wje-option.js +48 -279
  144. package/dist/wje-option.js.map +1 -1
  145. package/dist/wje-options.js +130 -384
  146. package/dist/wje-options.js.map +1 -1
  147. package/dist/wje-orgchart-group.js +16 -52
  148. package/dist/wje-orgchart-group.js.map +1 -1
  149. package/dist/wje-orgchart-item.js +24 -93
  150. package/dist/wje-orgchart-item.js.map +1 -1
  151. package/dist/wje-orgchart.js +18 -68
  152. package/dist/wje-orgchart.js.map +1 -1
  153. package/dist/wje-pagination.js +113 -397
  154. package/dist/wje-pagination.js.map +1 -1
  155. package/dist/wje-popup.js +3 -3
  156. package/dist/wje-popup.js.map +1 -1
  157. package/dist/wje-progress-bar.js +53 -205
  158. package/dist/wje-progress-bar.js.map +1 -1
  159. package/dist/wje-qr-code.js +398 -2980
  160. package/dist/wje-qr-code.js.map +1 -1
  161. package/dist/wje-radio-group.js +52 -190
  162. package/dist/wje-radio-group.js.map +1 -1
  163. package/dist/wje-radio.js +24 -118
  164. package/dist/wje-radio.js.map +1 -1
  165. package/dist/wje-rate.js +62 -266
  166. package/dist/wje-rate.js.map +1 -1
  167. package/dist/wje-relative-time.js +24 -99
  168. package/dist/wje-relative-time.js.map +1 -1
  169. package/dist/wje-reorder-dropzone.js +9 -31
  170. package/dist/wje-reorder-dropzone.js.map +1 -1
  171. package/dist/wje-reorder-handle.js +67 -204
  172. package/dist/wje-reorder-handle.js.map +1 -1
  173. package/dist/wje-reorder-item.js +14 -44
  174. package/dist/wje-reorder-item.js.map +1 -1
  175. package/dist/wje-reorder.js +61 -246
  176. package/dist/wje-reorder.js.map +1 -1
  177. package/dist/wje-route.js +6 -24
  178. package/dist/wje-route.js.map +1 -1
  179. package/dist/wje-router-link.js +11 -39
  180. package/dist/wje-router-link.js.map +1 -1
  181. package/dist/wje-router-outlet.js +76 -172
  182. package/dist/wje-router-outlet.js.map +1 -1
  183. package/dist/wje-routerx.js +537 -1331
  184. package/dist/wje-routerx.js.map +1 -1
  185. package/dist/wje-row.js +9 -31
  186. package/dist/wje-row.js.map +1 -1
  187. package/dist/wje-select.js +326 -1152
  188. package/dist/wje-select.js.map +1 -1
  189. package/dist/wje-slider.js +44 -225
  190. package/dist/wje-slider.js.map +1 -1
  191. package/dist/wje-sliding-container.js +295 -1319
  192. package/dist/wje-sliding-container.js.map +1 -1
  193. package/dist/wje-split-view.js +35 -121
  194. package/dist/wje-split-view.js.map +1 -1
  195. package/dist/wje-status.js +14 -45
  196. package/dist/wje-status.js.map +1 -1
  197. package/dist/wje-step.js +9 -32
  198. package/dist/wje-step.js.map +1 -1
  199. package/dist/wje-stepper.js +109 -357
  200. package/dist/wje-stepper.js.map +1 -1
  201. package/dist/wje-store.js +67 -360
  202. package/dist/wje-store.js.map +1 -1
  203. package/dist/wje-tab-group.js +85 -314
  204. package/dist/wje-tab-group.js.map +1 -1
  205. package/dist/wje-tab-panel.js +7 -28
  206. package/dist/wje-tab-panel.js.map +1 -1
  207. package/dist/wje-tab.js +21 -198
  208. package/dist/wje-tab.js.map +1 -1
  209. package/dist/wje-textarea.js +64 -264
  210. package/dist/wje-textarea.js.map +1 -1
  211. package/dist/wje-thumbnail.js +10 -51
  212. package/dist/wje-thumbnail.js.map +1 -1
  213. package/dist/wje-toast.js +127 -632
  214. package/dist/wje-toast.js.map +1 -1
  215. package/dist/wje-toggle.js +52 -177
  216. package/dist/wje-toggle.js.map +1 -1
  217. package/dist/wje-toolbar-action.js +128 -456
  218. package/dist/wje-toolbar-action.js.map +1 -1
  219. package/dist/wje-toolbar.js +75 -270
  220. package/dist/wje-toolbar.js.map +1 -1
  221. package/dist/wje-tooltip.js +50 -161
  222. package/dist/wje-tooltip.js.map +1 -1
  223. package/dist/wje-tree-item.js +70 -301
  224. package/dist/wje-tree-item.js.map +1 -1
  225. package/dist/wje-tree.js +145 -489
  226. package/dist/wje-tree.js.map +1 -1
  227. package/dist/wje-visually-hidden.js +7 -34
  228. package/dist/wje-visually-hidden.js.map +1 -1
  229. package/package.json +3 -2
  230. package/dist/form-associated-element-DEQ4y-jn.js +0 -245
  231. package/dist/icon-CReYMzAK.js +0 -245
  232. package/dist/popup.element-CwXvVFK7.js +0 -2133
  233. package/dist/router-links-wjqCnncc.js +0 -156
@@ -1,2133 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
- var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
4
- import WJElement from "./wje-element.js";
5
- import { event } from "./event.js";
6
- const min = Math.min;
7
- const max = Math.max;
8
- const round = Math.round;
9
- const floor = Math.floor;
10
- const createCoords = (v) => ({
11
- x: v,
12
- y: v
13
- });
14
- const oppositeSideMap = {
15
- left: "right",
16
- right: "left",
17
- bottom: "top",
18
- top: "bottom"
19
- };
20
- const oppositeAlignmentMap = {
21
- start: "end",
22
- end: "start"
23
- };
24
- function clamp(start, value, end) {
25
- return max(start, min(value, end));
26
- }
27
- function evaluate(value, param) {
28
- return typeof value === "function" ? value(param) : value;
29
- }
30
- function getSide(placement) {
31
- return placement.split("-")[0];
32
- }
33
- function getAlignment(placement) {
34
- return placement.split("-")[1];
35
- }
36
- function getOppositeAxis(axis) {
37
- return axis === "x" ? "y" : "x";
38
- }
39
- function getAxisLength(axis) {
40
- return axis === "y" ? "height" : "width";
41
- }
42
- const yAxisSides = /* @__PURE__ */ new Set(["top", "bottom"]);
43
- function getSideAxis(placement) {
44
- return yAxisSides.has(getSide(placement)) ? "y" : "x";
45
- }
46
- function getAlignmentAxis(placement) {
47
- return getOppositeAxis(getSideAxis(placement));
48
- }
49
- function getAlignmentSides(placement, rects, rtl) {
50
- if (rtl === void 0) {
51
- rtl = false;
52
- }
53
- const alignment = getAlignment(placement);
54
- const alignmentAxis = getAlignmentAxis(placement);
55
- const length = getAxisLength(alignmentAxis);
56
- let mainAlignmentSide = alignmentAxis === "x" ? alignment === (rtl ? "end" : "start") ? "right" : "left" : alignment === "start" ? "bottom" : "top";
57
- if (rects.reference[length] > rects.floating[length]) {
58
- mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
59
- }
60
- return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
61
- }
62
- function getExpandedPlacements(placement) {
63
- const oppositePlacement = getOppositePlacement(placement);
64
- return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
65
- }
66
- function getOppositeAlignmentPlacement(placement) {
67
- return placement.replace(/start|end/g, (alignment) => oppositeAlignmentMap[alignment]);
68
- }
69
- const lrPlacement = ["left", "right"];
70
- const rlPlacement = ["right", "left"];
71
- const tbPlacement = ["top", "bottom"];
72
- const btPlacement = ["bottom", "top"];
73
- function getSideList(side, isStart, rtl) {
74
- switch (side) {
75
- case "top":
76
- case "bottom":
77
- if (rtl) return isStart ? rlPlacement : lrPlacement;
78
- return isStart ? lrPlacement : rlPlacement;
79
- case "left":
80
- case "right":
81
- return isStart ? tbPlacement : btPlacement;
82
- default:
83
- return [];
84
- }
85
- }
86
- function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
87
- const alignment = getAlignment(placement);
88
- let list = getSideList(getSide(placement), direction === "start", rtl);
89
- if (alignment) {
90
- list = list.map((side) => side + "-" + alignment);
91
- if (flipAlignment) {
92
- list = list.concat(list.map(getOppositeAlignmentPlacement));
93
- }
94
- }
95
- return list;
96
- }
97
- function getOppositePlacement(placement) {
98
- return placement.replace(/left|right|bottom|top/g, (side) => oppositeSideMap[side]);
99
- }
100
- function expandPaddingObject(padding) {
101
- return {
102
- top: 0,
103
- right: 0,
104
- bottom: 0,
105
- left: 0,
106
- ...padding
107
- };
108
- }
109
- function getPaddingObject(padding) {
110
- return typeof padding !== "number" ? expandPaddingObject(padding) : {
111
- top: padding,
112
- right: padding,
113
- bottom: padding,
114
- left: padding
115
- };
116
- }
117
- function rectToClientRect(rect) {
118
- const {
119
- x,
120
- y,
121
- width,
122
- height
123
- } = rect;
124
- return {
125
- width,
126
- height,
127
- top: y,
128
- left: x,
129
- right: x + width,
130
- bottom: y + height,
131
- x,
132
- y
133
- };
134
- }
135
- function computeCoordsFromPlacement(_ref, placement, rtl) {
136
- let {
137
- reference,
138
- floating
139
- } = _ref;
140
- const sideAxis = getSideAxis(placement);
141
- const alignmentAxis = getAlignmentAxis(placement);
142
- const alignLength = getAxisLength(alignmentAxis);
143
- const side = getSide(placement);
144
- const isVertical = sideAxis === "y";
145
- const commonX = reference.x + reference.width / 2 - floating.width / 2;
146
- const commonY = reference.y + reference.height / 2 - floating.height / 2;
147
- const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2;
148
- let coords;
149
- switch (side) {
150
- case "top":
151
- coords = {
152
- x: commonX,
153
- y: reference.y - floating.height
154
- };
155
- break;
156
- case "bottom":
157
- coords = {
158
- x: commonX,
159
- y: reference.y + reference.height
160
- };
161
- break;
162
- case "right":
163
- coords = {
164
- x: reference.x + reference.width,
165
- y: commonY
166
- };
167
- break;
168
- case "left":
169
- coords = {
170
- x: reference.x - floating.width,
171
- y: commonY
172
- };
173
- break;
174
- default:
175
- coords = {
176
- x: reference.x,
177
- y: reference.y
178
- };
179
- }
180
- switch (getAlignment(placement)) {
181
- case "start":
182
- coords[alignmentAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
183
- break;
184
- case "end":
185
- coords[alignmentAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
186
- break;
187
- }
188
- return coords;
189
- }
190
- async function detectOverflow(state, options) {
191
- var _await$platform$isEle;
192
- if (options === void 0) {
193
- options = {};
194
- }
195
- const {
196
- x,
197
- y,
198
- platform: platform2,
199
- rects,
200
- elements,
201
- strategy
202
- } = state;
203
- const {
204
- boundary = "clippingAncestors",
205
- rootBoundary = "viewport",
206
- elementContext = "floating",
207
- altBoundary = false,
208
- padding = 0
209
- } = evaluate(options, state);
210
- const paddingObject = getPaddingObject(padding);
211
- const altContext = elementContext === "floating" ? "reference" : "floating";
212
- const element = elements[altBoundary ? altContext : elementContext];
213
- const clippingClientRect = rectToClientRect(await platform2.getClippingRect({
214
- element: ((_await$platform$isEle = await (platform2.isElement == null ? void 0 : platform2.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || await (platform2.getDocumentElement == null ? void 0 : platform2.getDocumentElement(elements.floating)),
215
- boundary,
216
- rootBoundary,
217
- strategy
218
- }));
219
- const rect = elementContext === "floating" ? {
220
- x,
221
- y,
222
- width: rects.floating.width,
223
- height: rects.floating.height
224
- } : rects.reference;
225
- const offsetParent = await (platform2.getOffsetParent == null ? void 0 : platform2.getOffsetParent(elements.floating));
226
- const offsetScale = await (platform2.isElement == null ? void 0 : platform2.isElement(offsetParent)) ? await (platform2.getScale == null ? void 0 : platform2.getScale(offsetParent)) || {
227
- x: 1,
228
- y: 1
229
- } : {
230
- x: 1,
231
- y: 1
232
- };
233
- const elementClientRect = rectToClientRect(platform2.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform2.convertOffsetParentRelativeRectToViewportRelativeRect({
234
- elements,
235
- rect,
236
- offsetParent,
237
- strategy
238
- }) : rect);
239
- return {
240
- top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
241
- bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
242
- left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
243
- right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
244
- };
245
- }
246
- const computePosition$1 = async (reference, floating, config) => {
247
- const {
248
- placement = "bottom",
249
- strategy = "absolute",
250
- middleware = [],
251
- platform: platform2
252
- } = config;
253
- const validMiddleware = middleware.filter(Boolean);
254
- const rtl = await (platform2.isRTL == null ? void 0 : platform2.isRTL(floating));
255
- let rects = await platform2.getElementRects({
256
- reference,
257
- floating,
258
- strategy
259
- });
260
- let {
261
- x,
262
- y
263
- } = computeCoordsFromPlacement(rects, placement, rtl);
264
- let statefulPlacement = placement;
265
- let middlewareData = {};
266
- let resetCount = 0;
267
- for (let i = 0; i < validMiddleware.length; i++) {
268
- var _platform$detectOverf;
269
- const {
270
- name,
271
- fn
272
- } = validMiddleware[i];
273
- const {
274
- x: nextX,
275
- y: nextY,
276
- data,
277
- reset
278
- } = await fn({
279
- x,
280
- y,
281
- initialPlacement: placement,
282
- placement: statefulPlacement,
283
- strategy,
284
- middlewareData,
285
- rects,
286
- platform: {
287
- ...platform2,
288
- detectOverflow: (_platform$detectOverf = platform2.detectOverflow) != null ? _platform$detectOverf : detectOverflow
289
- },
290
- elements: {
291
- reference,
292
- floating
293
- }
294
- });
295
- x = nextX != null ? nextX : x;
296
- y = nextY != null ? nextY : y;
297
- middlewareData = {
298
- ...middlewareData,
299
- [name]: {
300
- ...middlewareData[name],
301
- ...data
302
- }
303
- };
304
- if (reset && resetCount <= 50) {
305
- resetCount++;
306
- if (typeof reset === "object") {
307
- if (reset.placement) {
308
- statefulPlacement = reset.placement;
309
- }
310
- if (reset.rects) {
311
- rects = reset.rects === true ? await platform2.getElementRects({
312
- reference,
313
- floating,
314
- strategy
315
- }) : reset.rects;
316
- }
317
- ({
318
- x,
319
- y
320
- } = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
321
- }
322
- i = -1;
323
- }
324
- }
325
- return {
326
- x,
327
- y,
328
- placement: statefulPlacement,
329
- strategy,
330
- middlewareData
331
- };
332
- };
333
- const arrow$1 = (options) => ({
334
- name: "arrow",
335
- options,
336
- async fn(state) {
337
- const {
338
- x,
339
- y,
340
- placement,
341
- rects,
342
- platform: platform2,
343
- elements,
344
- middlewareData
345
- } = state;
346
- const {
347
- element,
348
- padding = 0
349
- } = evaluate(options, state) || {};
350
- if (element == null) {
351
- return {};
352
- }
353
- const paddingObject = getPaddingObject(padding);
354
- const coords = {
355
- x,
356
- y
357
- };
358
- const axis = getAlignmentAxis(placement);
359
- const length = getAxisLength(axis);
360
- const arrowDimensions = await platform2.getDimensions(element);
361
- const isYAxis = axis === "y";
362
- const minProp = isYAxis ? "top" : "left";
363
- const maxProp = isYAxis ? "bottom" : "right";
364
- const clientProp = isYAxis ? "clientHeight" : "clientWidth";
365
- const endDiff = rects.reference[length] + rects.reference[axis] - coords[axis] - rects.floating[length];
366
- const startDiff = coords[axis] - rects.reference[axis];
367
- const arrowOffsetParent = await (platform2.getOffsetParent == null ? void 0 : platform2.getOffsetParent(element));
368
- let clientSize = arrowOffsetParent ? arrowOffsetParent[clientProp] : 0;
369
- if (!clientSize || !await (platform2.isElement == null ? void 0 : platform2.isElement(arrowOffsetParent))) {
370
- clientSize = elements.floating[clientProp] || rects.floating[length];
371
- }
372
- const centerToReference = endDiff / 2 - startDiff / 2;
373
- const largestPossiblePadding = clientSize / 2 - arrowDimensions[length] / 2 - 1;
374
- const minPadding = min(paddingObject[minProp], largestPossiblePadding);
375
- const maxPadding = min(paddingObject[maxProp], largestPossiblePadding);
376
- const min$1 = minPadding;
377
- const max2 = clientSize - arrowDimensions[length] - maxPadding;
378
- const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference;
379
- const offset2 = clamp(min$1, center, max2);
380
- const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center !== offset2 && rects.reference[length] / 2 - (center < min$1 ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0;
381
- const alignmentOffset = shouldAddOffset ? center < min$1 ? center - min$1 : center - max2 : 0;
382
- return {
383
- [axis]: coords[axis] + alignmentOffset,
384
- data: {
385
- [axis]: offset2,
386
- centerOffset: center - offset2 - alignmentOffset,
387
- ...shouldAddOffset && {
388
- alignmentOffset
389
- }
390
- },
391
- reset: shouldAddOffset
392
- };
393
- }
394
- });
395
- const flip$1 = function(options) {
396
- if (options === void 0) {
397
- options = {};
398
- }
399
- return {
400
- name: "flip",
401
- options,
402
- async fn(state) {
403
- var _middlewareData$arrow, _middlewareData$flip;
404
- const {
405
- placement,
406
- middlewareData,
407
- rects,
408
- initialPlacement,
409
- platform: platform2,
410
- elements
411
- } = state;
412
- const {
413
- mainAxis: checkMainAxis = true,
414
- crossAxis: checkCrossAxis = true,
415
- fallbackPlacements: specifiedFallbackPlacements,
416
- fallbackStrategy = "bestFit",
417
- fallbackAxisSideDirection = "none",
418
- flipAlignment = true,
419
- ...detectOverflowOptions
420
- } = evaluate(options, state);
421
- if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
422
- return {};
423
- }
424
- const side = getSide(placement);
425
- const initialSideAxis = getSideAxis(initialPlacement);
426
- const isBasePlacement = getSide(initialPlacement) === initialPlacement;
427
- const rtl = await (platform2.isRTL == null ? void 0 : platform2.isRTL(elements.floating));
428
- const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
429
- const hasFallbackAxisSideDirection = fallbackAxisSideDirection !== "none";
430
- if (!specifiedFallbackPlacements && hasFallbackAxisSideDirection) {
431
- fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
432
- }
433
- const placements = [initialPlacement, ...fallbackPlacements];
434
- const overflow = await platform2.detectOverflow(state, detectOverflowOptions);
435
- const overflows = [];
436
- let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
437
- if (checkMainAxis) {
438
- overflows.push(overflow[side]);
439
- }
440
- if (checkCrossAxis) {
441
- const sides = getAlignmentSides(placement, rects, rtl);
442
- overflows.push(overflow[sides[0]], overflow[sides[1]]);
443
- }
444
- overflowsData = [...overflowsData, {
445
- placement,
446
- overflows
447
- }];
448
- if (!overflows.every((side2) => side2 <= 0)) {
449
- var _middlewareData$flip2, _overflowsData$filter;
450
- const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
451
- const nextPlacement = placements[nextIndex];
452
- if (nextPlacement) {
453
- const ignoreCrossAxisOverflow = checkCrossAxis === "alignment" ? initialSideAxis !== getSideAxis(nextPlacement) : false;
454
- if (!ignoreCrossAxisOverflow || // We leave the current main axis only if every placement on that axis
455
- // overflows the main axis.
456
- overflowsData.every((d) => getSideAxis(d.placement) === initialSideAxis ? d.overflows[0] > 0 : true)) {
457
- return {
458
- data: {
459
- index: nextIndex,
460
- overflows: overflowsData
461
- },
462
- reset: {
463
- placement: nextPlacement
464
- }
465
- };
466
- }
467
- }
468
- let resetPlacement = (_overflowsData$filter = overflowsData.filter((d) => d.overflows[0] <= 0).sort((a, b) => a.overflows[1] - b.overflows[1])[0]) == null ? void 0 : _overflowsData$filter.placement;
469
- if (!resetPlacement) {
470
- switch (fallbackStrategy) {
471
- case "bestFit": {
472
- var _overflowsData$filter2;
473
- const placement2 = (_overflowsData$filter2 = overflowsData.filter((d) => {
474
- if (hasFallbackAxisSideDirection) {
475
- const currentSideAxis = getSideAxis(d.placement);
476
- return currentSideAxis === initialSideAxis || // Create a bias to the `y` side axis due to horizontal
477
- // reading directions favoring greater width.
478
- currentSideAxis === "y";
479
- }
480
- return true;
481
- }).map((d) => [d.placement, d.overflows.filter((overflow2) => overflow2 > 0).reduce((acc, overflow2) => acc + overflow2, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$filter2[0];
482
- if (placement2) {
483
- resetPlacement = placement2;
484
- }
485
- break;
486
- }
487
- case "initialPlacement":
488
- resetPlacement = initialPlacement;
489
- break;
490
- }
491
- }
492
- if (placement !== resetPlacement) {
493
- return {
494
- reset: {
495
- placement: resetPlacement
496
- }
497
- };
498
- }
499
- }
500
- return {};
501
- }
502
- };
503
- };
504
- const originSides = /* @__PURE__ */ new Set(["left", "top"]);
505
- async function convertValueToCoords(state, options) {
506
- const {
507
- placement,
508
- platform: platform2,
509
- elements
510
- } = state;
511
- const rtl = await (platform2.isRTL == null ? void 0 : platform2.isRTL(elements.floating));
512
- const side = getSide(placement);
513
- const alignment = getAlignment(placement);
514
- const isVertical = getSideAxis(placement) === "y";
515
- const mainAxisMulti = originSides.has(side) ? -1 : 1;
516
- const crossAxisMulti = rtl && isVertical ? -1 : 1;
517
- const rawValue = evaluate(options, state);
518
- let {
519
- mainAxis,
520
- crossAxis,
521
- alignmentAxis
522
- } = typeof rawValue === "number" ? {
523
- mainAxis: rawValue,
524
- crossAxis: 0,
525
- alignmentAxis: null
526
- } : {
527
- mainAxis: rawValue.mainAxis || 0,
528
- crossAxis: rawValue.crossAxis || 0,
529
- alignmentAxis: rawValue.alignmentAxis
530
- };
531
- if (alignment && typeof alignmentAxis === "number") {
532
- crossAxis = alignment === "end" ? alignmentAxis * -1 : alignmentAxis;
533
- }
534
- return isVertical ? {
535
- x: crossAxis * crossAxisMulti,
536
- y: mainAxis * mainAxisMulti
537
- } : {
538
- x: mainAxis * mainAxisMulti,
539
- y: crossAxis * crossAxisMulti
540
- };
541
- }
542
- const offset$1 = function(options) {
543
- if (options === void 0) {
544
- options = 0;
545
- }
546
- return {
547
- name: "offset",
548
- options,
549
- async fn(state) {
550
- var _middlewareData$offse, _middlewareData$arrow;
551
- const {
552
- x,
553
- y,
554
- placement,
555
- middlewareData
556
- } = state;
557
- const diffCoords = await convertValueToCoords(state, options);
558
- if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
559
- return {};
560
- }
561
- return {
562
- x: x + diffCoords.x,
563
- y: y + diffCoords.y,
564
- data: {
565
- ...diffCoords,
566
- placement
567
- }
568
- };
569
- }
570
- };
571
- };
572
- const size$1 = function(options) {
573
- if (options === void 0) {
574
- options = {};
575
- }
576
- return {
577
- name: "size",
578
- options,
579
- async fn(state) {
580
- var _state$middlewareData, _state$middlewareData2;
581
- const {
582
- placement,
583
- rects,
584
- platform: platform2,
585
- elements
586
- } = state;
587
- const {
588
- apply = () => {
589
- },
590
- ...detectOverflowOptions
591
- } = evaluate(options, state);
592
- const overflow = await platform2.detectOverflow(state, detectOverflowOptions);
593
- const side = getSide(placement);
594
- const alignment = getAlignment(placement);
595
- const isYAxis = getSideAxis(placement) === "y";
596
- const {
597
- width,
598
- height
599
- } = rects.floating;
600
- let heightSide;
601
- let widthSide;
602
- if (side === "top" || side === "bottom") {
603
- heightSide = side;
604
- widthSide = alignment === (await (platform2.isRTL == null ? void 0 : platform2.isRTL(elements.floating)) ? "start" : "end") ? "left" : "right";
605
- } else {
606
- widthSide = side;
607
- heightSide = alignment === "end" ? "top" : "bottom";
608
- }
609
- const maximumClippingHeight = height - overflow.top - overflow.bottom;
610
- const maximumClippingWidth = width - overflow.left - overflow.right;
611
- const overflowAvailableHeight = min(height - overflow[heightSide], maximumClippingHeight);
612
- const overflowAvailableWidth = min(width - overflow[widthSide], maximumClippingWidth);
613
- const noShift = !state.middlewareData.shift;
614
- let availableHeight = overflowAvailableHeight;
615
- let availableWidth = overflowAvailableWidth;
616
- if ((_state$middlewareData = state.middlewareData.shift) != null && _state$middlewareData.enabled.x) {
617
- availableWidth = maximumClippingWidth;
618
- }
619
- if ((_state$middlewareData2 = state.middlewareData.shift) != null && _state$middlewareData2.enabled.y) {
620
- availableHeight = maximumClippingHeight;
621
- }
622
- if (noShift && !alignment) {
623
- const xMin = max(overflow.left, 0);
624
- const xMax = max(overflow.right, 0);
625
- const yMin = max(overflow.top, 0);
626
- const yMax = max(overflow.bottom, 0);
627
- if (isYAxis) {
628
- availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max(overflow.left, overflow.right));
629
- } else {
630
- availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max(overflow.top, overflow.bottom));
631
- }
632
- }
633
- await apply({
634
- ...state,
635
- availableWidth,
636
- availableHeight
637
- });
638
- const nextDimensions = await platform2.getDimensions(elements.floating);
639
- if (width !== nextDimensions.width || height !== nextDimensions.height) {
640
- return {
641
- reset: {
642
- rects: true
643
- }
644
- };
645
- }
646
- return {};
647
- }
648
- };
649
- };
650
- function hasWindow() {
651
- return typeof window !== "undefined";
652
- }
653
- function getNodeName(node) {
654
- if (isNode(node)) {
655
- return (node.nodeName || "").toLowerCase();
656
- }
657
- return "#document";
658
- }
659
- function getWindow(node) {
660
- var _node$ownerDocument;
661
- return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
662
- }
663
- function getDocumentElement(node) {
664
- var _ref;
665
- return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
666
- }
667
- function isNode(value) {
668
- if (!hasWindow()) {
669
- return false;
670
- }
671
- return value instanceof Node || value instanceof getWindow(value).Node;
672
- }
673
- function isElement(value) {
674
- if (!hasWindow()) {
675
- return false;
676
- }
677
- return value instanceof Element || value instanceof getWindow(value).Element;
678
- }
679
- function isHTMLElement(value) {
680
- if (!hasWindow()) {
681
- return false;
682
- }
683
- return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
684
- }
685
- function isShadowRoot(value) {
686
- if (!hasWindow() || typeof ShadowRoot === "undefined") {
687
- return false;
688
- }
689
- return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
690
- }
691
- const invalidOverflowDisplayValues = /* @__PURE__ */ new Set(["inline", "contents"]);
692
- function isOverflowElement(element) {
693
- const {
694
- overflow,
695
- overflowX,
696
- overflowY,
697
- display
698
- } = getComputedStyle$1(element);
699
- return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !invalidOverflowDisplayValues.has(display);
700
- }
701
- const tableElements = /* @__PURE__ */ new Set(["table", "td", "th"]);
702
- function isTableElement(element) {
703
- return tableElements.has(getNodeName(element));
704
- }
705
- const topLayerSelectors = [":popover-open", ":modal"];
706
- function isTopLayer(element) {
707
- return topLayerSelectors.some((selector) => {
708
- try {
709
- return element.matches(selector);
710
- } catch (_e) {
711
- return false;
712
- }
713
- });
714
- }
715
- const transformProperties = ["transform", "translate", "scale", "rotate", "perspective"];
716
- const willChangeValues = ["transform", "translate", "scale", "rotate", "perspective", "filter"];
717
- const containValues = ["paint", "layout", "strict", "content"];
718
- function isContainingBlock(elementOrCss) {
719
- const webkit = isWebKit();
720
- const css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
721
- return transformProperties.some((value) => css[value] ? css[value] !== "none" : false) || (css.containerType ? css.containerType !== "normal" : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== "none" : false) || !webkit && (css.filter ? css.filter !== "none" : false) || willChangeValues.some((value) => (css.willChange || "").includes(value)) || containValues.some((value) => (css.contain || "").includes(value));
722
- }
723
- function getContainingBlock(element) {
724
- let currentNode = getParentNode(element);
725
- while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
726
- if (isContainingBlock(currentNode)) {
727
- return currentNode;
728
- } else if (isTopLayer(currentNode)) {
729
- return null;
730
- }
731
- currentNode = getParentNode(currentNode);
732
- }
733
- return null;
734
- }
735
- function isWebKit() {
736
- if (typeof CSS === "undefined" || !CSS.supports) return false;
737
- return CSS.supports("-webkit-backdrop-filter", "none");
738
- }
739
- const lastTraversableNodeNames = /* @__PURE__ */ new Set(["html", "body", "#document"]);
740
- function isLastTraversableNode(node) {
741
- return lastTraversableNodeNames.has(getNodeName(node));
742
- }
743
- function getComputedStyle$1(element) {
744
- return getWindow(element).getComputedStyle(element);
745
- }
746
- function getNodeScroll(element) {
747
- if (isElement(element)) {
748
- return {
749
- scrollLeft: element.scrollLeft,
750
- scrollTop: element.scrollTop
751
- };
752
- }
753
- return {
754
- scrollLeft: element.scrollX,
755
- scrollTop: element.scrollY
756
- };
757
- }
758
- function getParentNode(node) {
759
- if (getNodeName(node) === "html") {
760
- return node;
761
- }
762
- const result = (
763
- // Step into the shadow DOM of the parent of a slotted node.
764
- node.assignedSlot || // DOM Element detected.
765
- node.parentNode || // ShadowRoot detected.
766
- isShadowRoot(node) && node.host || // Fallback.
767
- getDocumentElement(node)
768
- );
769
- return isShadowRoot(result) ? result.host : result;
770
- }
771
- function getNearestOverflowAncestor(node) {
772
- const parentNode = getParentNode(node);
773
- if (isLastTraversableNode(parentNode)) {
774
- return node.ownerDocument ? node.ownerDocument.body : node.body;
775
- }
776
- if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
777
- return parentNode;
778
- }
779
- return getNearestOverflowAncestor(parentNode);
780
- }
781
- function getOverflowAncestors(node, list, traverseIframes) {
782
- var _node$ownerDocument2;
783
- if (list === void 0) {
784
- list = [];
785
- }
786
- if (traverseIframes === void 0) {
787
- traverseIframes = true;
788
- }
789
- const scrollableAncestor = getNearestOverflowAncestor(node);
790
- const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
791
- const win = getWindow(scrollableAncestor);
792
- if (isBody) {
793
- const frameElement = getFrameElement(win);
794
- return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
795
- }
796
- return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
797
- }
798
- function getFrameElement(win) {
799
- return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
800
- }
801
- function getCssDimensions(element) {
802
- const css = getComputedStyle$1(element);
803
- let width = parseFloat(css.width) || 0;
804
- let height = parseFloat(css.height) || 0;
805
- const hasOffset = isHTMLElement(element);
806
- const offsetWidth = hasOffset ? element.offsetWidth : width;
807
- const offsetHeight = hasOffset ? element.offsetHeight : height;
808
- const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
809
- if (shouldFallback) {
810
- width = offsetWidth;
811
- height = offsetHeight;
812
- }
813
- return {
814
- width,
815
- height,
816
- $: shouldFallback
817
- };
818
- }
819
- function unwrapElement(element) {
820
- return !isElement(element) ? element.contextElement : element;
821
- }
822
- function getScale(element) {
823
- const domElement = unwrapElement(element);
824
- if (!isHTMLElement(domElement)) {
825
- return createCoords(1);
826
- }
827
- const rect = domElement.getBoundingClientRect();
828
- const {
829
- width,
830
- height,
831
- $
832
- } = getCssDimensions(domElement);
833
- let x = ($ ? round(rect.width) : rect.width) / width;
834
- let y = ($ ? round(rect.height) : rect.height) / height;
835
- if (!x || !Number.isFinite(x)) {
836
- x = 1;
837
- }
838
- if (!y || !Number.isFinite(y)) {
839
- y = 1;
840
- }
841
- return {
842
- x,
843
- y
844
- };
845
- }
846
- const noOffsets = /* @__PURE__ */ createCoords(0);
847
- function getVisualOffsets(element) {
848
- const win = getWindow(element);
849
- if (!isWebKit() || !win.visualViewport) {
850
- return noOffsets;
851
- }
852
- return {
853
- x: win.visualViewport.offsetLeft,
854
- y: win.visualViewport.offsetTop
855
- };
856
- }
857
- function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
858
- if (isFixed === void 0) {
859
- isFixed = false;
860
- }
861
- if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) {
862
- return false;
863
- }
864
- return isFixed;
865
- }
866
- function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
867
- if (includeScale === void 0) {
868
- includeScale = false;
869
- }
870
- if (isFixedStrategy === void 0) {
871
- isFixedStrategy = false;
872
- }
873
- const clientRect = element.getBoundingClientRect();
874
- const domElement = unwrapElement(element);
875
- let scale = createCoords(1);
876
- if (includeScale) {
877
- if (offsetParent) {
878
- if (isElement(offsetParent)) {
879
- scale = getScale(offsetParent);
880
- }
881
- } else {
882
- scale = getScale(element);
883
- }
884
- }
885
- const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
886
- let x = (clientRect.left + visualOffsets.x) / scale.x;
887
- let y = (clientRect.top + visualOffsets.y) / scale.y;
888
- let width = clientRect.width / scale.x;
889
- let height = clientRect.height / scale.y;
890
- if (domElement) {
891
- const win = getWindow(domElement);
892
- const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
893
- let currentWin = win;
894
- let currentIFrame = getFrameElement(currentWin);
895
- while (currentIFrame && offsetParent && offsetWin !== currentWin) {
896
- const iframeScale = getScale(currentIFrame);
897
- const iframeRect = currentIFrame.getBoundingClientRect();
898
- const css = getComputedStyle$1(currentIFrame);
899
- const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
900
- const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
901
- x *= iframeScale.x;
902
- y *= iframeScale.y;
903
- width *= iframeScale.x;
904
- height *= iframeScale.y;
905
- x += left;
906
- y += top;
907
- currentWin = getWindow(currentIFrame);
908
- currentIFrame = getFrameElement(currentWin);
909
- }
910
- }
911
- return rectToClientRect({
912
- width,
913
- height,
914
- x,
915
- y
916
- });
917
- }
918
- function getWindowScrollBarX(element, rect) {
919
- const leftScroll = getNodeScroll(element).scrollLeft;
920
- if (!rect) {
921
- return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
922
- }
923
- return rect.left + leftScroll;
924
- }
925
- function getHTMLOffset(documentElement, scroll) {
926
- const htmlRect = documentElement.getBoundingClientRect();
927
- const x = htmlRect.left + scroll.scrollLeft - getWindowScrollBarX(documentElement, htmlRect);
928
- const y = htmlRect.top + scroll.scrollTop;
929
- return {
930
- x,
931
- y
932
- };
933
- }
934
- function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
935
- let {
936
- elements,
937
- rect,
938
- offsetParent,
939
- strategy
940
- } = _ref;
941
- const isFixed = strategy === "fixed";
942
- const documentElement = getDocumentElement(offsetParent);
943
- const topLayer = elements ? isTopLayer(elements.floating) : false;
944
- if (offsetParent === documentElement || topLayer && isFixed) {
945
- return rect;
946
- }
947
- let scroll = {
948
- scrollLeft: 0,
949
- scrollTop: 0
950
- };
951
- let scale = createCoords(1);
952
- const offsets = createCoords(0);
953
- const isOffsetParentAnElement = isHTMLElement(offsetParent);
954
- if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
955
- if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) {
956
- scroll = getNodeScroll(offsetParent);
957
- }
958
- if (isHTMLElement(offsetParent)) {
959
- const offsetRect = getBoundingClientRect(offsetParent);
960
- scale = getScale(offsetParent);
961
- offsets.x = offsetRect.x + offsetParent.clientLeft;
962
- offsets.y = offsetRect.y + offsetParent.clientTop;
963
- }
964
- }
965
- const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
966
- return {
967
- width: rect.width * scale.x,
968
- height: rect.height * scale.y,
969
- x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
970
- y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
971
- };
972
- }
973
- function getClientRects(element) {
974
- return Array.from(element.getClientRects());
975
- }
976
- function getDocumentRect(element) {
977
- const html = getDocumentElement(element);
978
- const scroll = getNodeScroll(element);
979
- const body = element.ownerDocument.body;
980
- const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
981
- const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
982
- let x = -scroll.scrollLeft + getWindowScrollBarX(element);
983
- const y = -scroll.scrollTop;
984
- if (getComputedStyle$1(body).direction === "rtl") {
985
- x += max(html.clientWidth, body.clientWidth) - width;
986
- }
987
- return {
988
- width,
989
- height,
990
- x,
991
- y
992
- };
993
- }
994
- const SCROLLBAR_MAX = 25;
995
- function getViewportRect(element, strategy) {
996
- const win = getWindow(element);
997
- const html = getDocumentElement(element);
998
- const visualViewport = win.visualViewport;
999
- let width = html.clientWidth;
1000
- let height = html.clientHeight;
1001
- let x = 0;
1002
- let y = 0;
1003
- if (visualViewport) {
1004
- width = visualViewport.width;
1005
- height = visualViewport.height;
1006
- const visualViewportBased = isWebKit();
1007
- if (!visualViewportBased || visualViewportBased && strategy === "fixed") {
1008
- x = visualViewport.offsetLeft;
1009
- y = visualViewport.offsetTop;
1010
- }
1011
- }
1012
- const windowScrollbarX = getWindowScrollBarX(html);
1013
- if (windowScrollbarX <= 0) {
1014
- const doc = html.ownerDocument;
1015
- const body = doc.body;
1016
- const bodyStyles = getComputedStyle(body);
1017
- const bodyMarginInline = doc.compatMode === "CSS1Compat" ? parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0 : 0;
1018
- const clippingStableScrollbarWidth = Math.abs(html.clientWidth - body.clientWidth - bodyMarginInline);
1019
- if (clippingStableScrollbarWidth <= SCROLLBAR_MAX) {
1020
- width -= clippingStableScrollbarWidth;
1021
- }
1022
- } else if (windowScrollbarX <= SCROLLBAR_MAX) {
1023
- width += windowScrollbarX;
1024
- }
1025
- return {
1026
- width,
1027
- height,
1028
- x,
1029
- y
1030
- };
1031
- }
1032
- const absoluteOrFixed = /* @__PURE__ */ new Set(["absolute", "fixed"]);
1033
- function getInnerBoundingClientRect(element, strategy) {
1034
- const clientRect = getBoundingClientRect(element, true, strategy === "fixed");
1035
- const top = clientRect.top + element.clientTop;
1036
- const left = clientRect.left + element.clientLeft;
1037
- const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
1038
- const width = element.clientWidth * scale.x;
1039
- const height = element.clientHeight * scale.y;
1040
- const x = left * scale.x;
1041
- const y = top * scale.y;
1042
- return {
1043
- width,
1044
- height,
1045
- x,
1046
- y
1047
- };
1048
- }
1049
- function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
1050
- let rect;
1051
- if (clippingAncestor === "viewport") {
1052
- rect = getViewportRect(element, strategy);
1053
- } else if (clippingAncestor === "document") {
1054
- rect = getDocumentRect(getDocumentElement(element));
1055
- } else if (isElement(clippingAncestor)) {
1056
- rect = getInnerBoundingClientRect(clippingAncestor, strategy);
1057
- } else {
1058
- const visualOffsets = getVisualOffsets(element);
1059
- rect = {
1060
- x: clippingAncestor.x - visualOffsets.x,
1061
- y: clippingAncestor.y - visualOffsets.y,
1062
- width: clippingAncestor.width,
1063
- height: clippingAncestor.height
1064
- };
1065
- }
1066
- return rectToClientRect(rect);
1067
- }
1068
- function hasFixedPositionAncestor(element, stopNode) {
1069
- const parentNode = getParentNode(element);
1070
- if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
1071
- return false;
1072
- }
1073
- return getComputedStyle$1(parentNode).position === "fixed" || hasFixedPositionAncestor(parentNode, stopNode);
1074
- }
1075
- function getClippingElementAncestors(element, cache) {
1076
- const cachedResult = cache.get(element);
1077
- if (cachedResult) {
1078
- return cachedResult;
1079
- }
1080
- let result = getOverflowAncestors(element, [], false).filter((el) => isElement(el) && getNodeName(el) !== "body");
1081
- let currentContainingBlockComputedStyle = null;
1082
- const elementIsFixed = getComputedStyle$1(element).position === "fixed";
1083
- let currentNode = elementIsFixed ? getParentNode(element) : element;
1084
- while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
1085
- const computedStyle = getComputedStyle$1(currentNode);
1086
- const currentNodeIsContaining = isContainingBlock(currentNode);
1087
- if (!currentNodeIsContaining && computedStyle.position === "fixed") {
1088
- currentContainingBlockComputedStyle = null;
1089
- }
1090
- const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === "static" && !!currentContainingBlockComputedStyle && absoluteOrFixed.has(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
1091
- if (shouldDropCurrentNode) {
1092
- result = result.filter((ancestor) => ancestor !== currentNode);
1093
- } else {
1094
- currentContainingBlockComputedStyle = computedStyle;
1095
- }
1096
- currentNode = getParentNode(currentNode);
1097
- }
1098
- cache.set(element, result);
1099
- return result;
1100
- }
1101
- function getClippingRect(_ref) {
1102
- let {
1103
- element,
1104
- boundary,
1105
- rootBoundary,
1106
- strategy
1107
- } = _ref;
1108
- const elementClippingAncestors = boundary === "clippingAncestors" ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
1109
- const clippingAncestors = [...elementClippingAncestors, rootBoundary];
1110
- const firstClippingAncestor = clippingAncestors[0];
1111
- const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
1112
- const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
1113
- accRect.top = max(rect.top, accRect.top);
1114
- accRect.right = min(rect.right, accRect.right);
1115
- accRect.bottom = min(rect.bottom, accRect.bottom);
1116
- accRect.left = max(rect.left, accRect.left);
1117
- return accRect;
1118
- }, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
1119
- return {
1120
- width: clippingRect.right - clippingRect.left,
1121
- height: clippingRect.bottom - clippingRect.top,
1122
- x: clippingRect.left,
1123
- y: clippingRect.top
1124
- };
1125
- }
1126
- function getDimensions(element) {
1127
- const {
1128
- width,
1129
- height
1130
- } = getCssDimensions(element);
1131
- return {
1132
- width,
1133
- height
1134
- };
1135
- }
1136
- function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
1137
- const isOffsetParentAnElement = isHTMLElement(offsetParent);
1138
- const documentElement = getDocumentElement(offsetParent);
1139
- const isFixed = strategy === "fixed";
1140
- const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
1141
- let scroll = {
1142
- scrollLeft: 0,
1143
- scrollTop: 0
1144
- };
1145
- const offsets = createCoords(0);
1146
- function setLeftRTLScrollbarOffset() {
1147
- offsets.x = getWindowScrollBarX(documentElement);
1148
- }
1149
- if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
1150
- if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) {
1151
- scroll = getNodeScroll(offsetParent);
1152
- }
1153
- if (isOffsetParentAnElement) {
1154
- const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
1155
- offsets.x = offsetRect.x + offsetParent.clientLeft;
1156
- offsets.y = offsetRect.y + offsetParent.clientTop;
1157
- } else if (documentElement) {
1158
- setLeftRTLScrollbarOffset();
1159
- }
1160
- }
1161
- if (isFixed && !isOffsetParentAnElement && documentElement) {
1162
- setLeftRTLScrollbarOffset();
1163
- }
1164
- const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
1165
- const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
1166
- const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
1167
- return {
1168
- x,
1169
- y,
1170
- width: rect.width,
1171
- height: rect.height
1172
- };
1173
- }
1174
- function isStaticPositioned(element) {
1175
- return getComputedStyle$1(element).position === "static";
1176
- }
1177
- function getTrueOffsetParent(element, polyfill) {
1178
- if (!isHTMLElement(element) || getComputedStyle$1(element).position === "fixed") {
1179
- return null;
1180
- }
1181
- if (polyfill) {
1182
- return polyfill(element);
1183
- }
1184
- let rawOffsetParent = element.offsetParent;
1185
- if (getDocumentElement(element) === rawOffsetParent) {
1186
- rawOffsetParent = rawOffsetParent.ownerDocument.body;
1187
- }
1188
- return rawOffsetParent;
1189
- }
1190
- function getOffsetParent(element, polyfill) {
1191
- const win = getWindow(element);
1192
- if (isTopLayer(element)) {
1193
- return win;
1194
- }
1195
- if (!isHTMLElement(element)) {
1196
- let svgOffsetParent = getParentNode(element);
1197
- while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
1198
- if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) {
1199
- return svgOffsetParent;
1200
- }
1201
- svgOffsetParent = getParentNode(svgOffsetParent);
1202
- }
1203
- return win;
1204
- }
1205
- let offsetParent = getTrueOffsetParent(element, polyfill);
1206
- while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) {
1207
- offsetParent = getTrueOffsetParent(offsetParent, polyfill);
1208
- }
1209
- if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) {
1210
- return win;
1211
- }
1212
- return offsetParent || getContainingBlock(element) || win;
1213
- }
1214
- const getElementRects = async function(data) {
1215
- const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
1216
- const getDimensionsFn = this.getDimensions;
1217
- const floatingDimensions = await getDimensionsFn(data.floating);
1218
- return {
1219
- reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
1220
- floating: {
1221
- x: 0,
1222
- y: 0,
1223
- width: floatingDimensions.width,
1224
- height: floatingDimensions.height
1225
- }
1226
- };
1227
- };
1228
- function isRTL(element) {
1229
- return getComputedStyle$1(element).direction === "rtl";
1230
- }
1231
- const platform = {
1232
- convertOffsetParentRelativeRectToViewportRelativeRect,
1233
- getDocumentElement,
1234
- getClippingRect,
1235
- getOffsetParent,
1236
- getElementRects,
1237
- getClientRects,
1238
- getDimensions,
1239
- getScale,
1240
- isElement,
1241
- isRTL
1242
- };
1243
- function rectsAreEqual(a, b) {
1244
- return a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height;
1245
- }
1246
- function observeMove(element, onMove) {
1247
- let io = null;
1248
- let timeoutId;
1249
- const root = getDocumentElement(element);
1250
- function cleanup() {
1251
- var _io;
1252
- clearTimeout(timeoutId);
1253
- (_io = io) == null || _io.disconnect();
1254
- io = null;
1255
- }
1256
- function refresh(skip, threshold) {
1257
- if (skip === void 0) {
1258
- skip = false;
1259
- }
1260
- if (threshold === void 0) {
1261
- threshold = 1;
1262
- }
1263
- cleanup();
1264
- const elementRectForRootMargin = element.getBoundingClientRect();
1265
- const {
1266
- left,
1267
- top,
1268
- width,
1269
- height
1270
- } = elementRectForRootMargin;
1271
- if (!skip) {
1272
- onMove();
1273
- }
1274
- if (!width || !height) {
1275
- return;
1276
- }
1277
- const insetTop = floor(top);
1278
- const insetRight = floor(root.clientWidth - (left + width));
1279
- const insetBottom = floor(root.clientHeight - (top + height));
1280
- const insetLeft = floor(left);
1281
- const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px";
1282
- const options = {
1283
- rootMargin,
1284
- threshold: max(0, min(1, threshold)) || 1
1285
- };
1286
- let isFirstUpdate = true;
1287
- function handleObserve(entries) {
1288
- const ratio = entries[0].intersectionRatio;
1289
- if (ratio !== threshold) {
1290
- if (!isFirstUpdate) {
1291
- return refresh();
1292
- }
1293
- if (!ratio) {
1294
- timeoutId = setTimeout(() => {
1295
- refresh(false, 1e-7);
1296
- }, 1e3);
1297
- } else {
1298
- refresh(false, ratio);
1299
- }
1300
- }
1301
- if (ratio === 1 && !rectsAreEqual(elementRectForRootMargin, element.getBoundingClientRect())) {
1302
- refresh();
1303
- }
1304
- isFirstUpdate = false;
1305
- }
1306
- try {
1307
- io = new IntersectionObserver(handleObserve, {
1308
- ...options,
1309
- // Handle <iframe>s
1310
- root: root.ownerDocument
1311
- });
1312
- } catch (_e) {
1313
- io = new IntersectionObserver(handleObserve, options);
1314
- }
1315
- io.observe(element);
1316
- }
1317
- refresh(true);
1318
- return cleanup;
1319
- }
1320
- function autoUpdate(reference, floating, update, options) {
1321
- if (options === void 0) {
1322
- options = {};
1323
- }
1324
- const {
1325
- ancestorScroll = true,
1326
- ancestorResize = true,
1327
- elementResize = typeof ResizeObserver === "function",
1328
- layoutShift = typeof IntersectionObserver === "function",
1329
- animationFrame = false
1330
- } = options;
1331
- const referenceEl = unwrapElement(reference);
1332
- const ancestors = ancestorScroll || ancestorResize ? [...referenceEl ? getOverflowAncestors(referenceEl) : [], ...getOverflowAncestors(floating)] : [];
1333
- ancestors.forEach((ancestor) => {
1334
- ancestorScroll && ancestor.addEventListener("scroll", update, {
1335
- passive: true
1336
- });
1337
- ancestorResize && ancestor.addEventListener("resize", update);
1338
- });
1339
- const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null;
1340
- let reobserveFrame = -1;
1341
- let resizeObserver = null;
1342
- if (elementResize) {
1343
- resizeObserver = new ResizeObserver((_ref) => {
1344
- let [firstEntry] = _ref;
1345
- if (firstEntry && firstEntry.target === referenceEl && resizeObserver) {
1346
- resizeObserver.unobserve(floating);
1347
- cancelAnimationFrame(reobserveFrame);
1348
- reobserveFrame = requestAnimationFrame(() => {
1349
- var _resizeObserver;
1350
- (_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
1351
- });
1352
- }
1353
- update();
1354
- });
1355
- if (referenceEl && !animationFrame) {
1356
- resizeObserver.observe(referenceEl);
1357
- }
1358
- resizeObserver.observe(floating);
1359
- }
1360
- let frameId;
1361
- let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
1362
- if (animationFrame) {
1363
- frameLoop();
1364
- }
1365
- function frameLoop() {
1366
- const nextRefRect = getBoundingClientRect(reference);
1367
- if (prevRefRect && !rectsAreEqual(prevRefRect, nextRefRect)) {
1368
- update();
1369
- }
1370
- prevRefRect = nextRefRect;
1371
- frameId = requestAnimationFrame(frameLoop);
1372
- }
1373
- update();
1374
- return () => {
1375
- var _resizeObserver2;
1376
- ancestors.forEach((ancestor) => {
1377
- ancestorScroll && ancestor.removeEventListener("scroll", update);
1378
- ancestorResize && ancestor.removeEventListener("resize", update);
1379
- });
1380
- cleanupIo == null || cleanupIo();
1381
- (_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
1382
- resizeObserver = null;
1383
- if (animationFrame) {
1384
- cancelAnimationFrame(frameId);
1385
- }
1386
- };
1387
- }
1388
- const offset = offset$1;
1389
- const flip = flip$1;
1390
- const size = size$1;
1391
- const arrow = arrow$1;
1392
- const computePosition = (reference, floating, options) => {
1393
- const cache = /* @__PURE__ */ new Map();
1394
- const mergedOptions = {
1395
- platform,
1396
- ...options
1397
- };
1398
- const platformWithCache = {
1399
- ...mergedOptions.platform,
1400
- _c: cache
1401
- };
1402
- return computePosition$1(reference, floating, {
1403
- ...mergedOptions,
1404
- platform: platformWithCache
1405
- });
1406
- };
1407
- const styles = "/*\n[ WJ Popup ]\n*/\n\n:host {\n --wje-popup-top: auto;\n --wje-popup-left: auto;\n --wje-popup-mobile-transition-duration: 250ms;\n --wje-popup-mobile-transition-easing: ease;\n\n display: flex; /* zmenene z contents na flex kvoli breadcrumbs v a jeho trom bodkam */\n}\n\n.popup-backdrop {\n display: none;\n}\n\n.native-popup {\n position: absolute;\n isolation: isolate;\n z-index: 999;\n left: var(--wje-popup-left);\n top: var(--wje-popup-top);\n}\n.native-popup:not(.popup-active) {\n display: none;\n}\n\n.popup-backdrop.popup-mobile-sheet {\n display: block;\n position: fixed;\n inset: 0;\n z-index: 998;\n opacity: 0;\n pointer-events: none;\n background: var(\n --wje-popup-backdrop-background,\n var(--wje-sliding-container-backdrop-background, var(--wje-backdrop, rgba(0, 0, 0, 0.35)))\n );\n transition:\n opacity var(--wje-popup-mobile-transition-duration) var(--wje-popup-mobile-transition-easing),\n visibility 0s linear var(--wje-popup-mobile-transition-duration);\n visibility: hidden;\n}\n\n.popup-backdrop.popup-mobile-sheet.popup-active {\n opacity: var(\n --wje-popup-backdrop-opacity,\n var(--wje-sliding-container-backdrop-opacity, var(--wje-backdrop-opacity, 1))\n );\n pointer-events: auto;\n visibility: visible;\n transition-delay: 0s;\n}\n\n.native-popup.popup-mobile-sheet {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n position: fixed;\n inset: auto 0 0 0;\n left: 0;\n right: 0;\n top: auto;\n width: 100vw;\n max-width: 100vw;\n max-height: var(--wje-popup-mobile-max-height, 90vh);\n overflow: auto;\n background: var(\n --wje-popup-mobile-background,\n var(--wje-select-options-background-color, var(--wje-color-contrast-0, #fff))\n );\n box-shadow: var(--wje-popup-mobile-box-shadow, 0 -8px 32px rgba(0, 0, 0, 0.16));\n border-radius: var(\n --wje-popup-mobile-border-radius,\n var(\n --wje-sliding-container-sheet-border-radius,\n var(--wje-border-radius-large, 16px) var(--wje-border-radius-large, 16px) 0 0\n )\n );\n padding-bottom: env(safe-area-inset-bottom, 0);\n transform: translateY(100%);\n transition:\n transform var(--wje-popup-mobile-transition-duration) var(--wje-popup-mobile-transition-easing),\n visibility 0s linear var(--wje-popup-mobile-transition-duration);\n visibility: hidden;\n pointer-events: none;\n}\n\n.native-popup.popup-mobile-sheet.popup-active {\n transform: translateY(0);\n visibility: visible;\n pointer-events: auto;\n transition-delay: 0s;\n}\n\n.popup-loader.overlay {\n position: absolute;\n inset: var(--wje-popup-loader-inset, 0);\n background: var(\n --wje-popup-overlay-background,\n var(--wje-select-options-background-color, var(--wje-color-contrast-0, #fff))\n );\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1;\n}\n.popup-loader.fade-out {\n opacity: 0;\n transition: opacity 0.3s ease;\n pointer-events: none;\n}\n";
1408
- const POPUP_MOBILE_SHEET_TRANSITION_FALLBACK_MS = 250;
1409
- class Popup extends WJElement {
1410
- /**
1411
- * Creates an instance of Popup.
1412
- * @class
1413
- */
1414
- constructor() {
1415
- super();
1416
- __publicField(this, "className", "Popup");
1417
- __publicField(this, "manualCallback", (e) => {
1418
- if (this.hasAttribute("disabled")) return;
1419
- this.showHide();
1420
- });
1421
- __publicField(this, "clickHandler", (e) => {
1422
- const path = typeof e.composedPath === "function" ? e.composedPath() : [];
1423
- const isMenuClick = path.some(
1424
- (n) => n && (n.tagName === "WJE-MENU-ITEM" || n.tagName === "WJE-MENU")
1425
- // ||
1426
- // n.tagName === 'WJE-DROPDOWNs'
1427
- );
1428
- if (isMenuClick) return;
1429
- const inside = path.includes(this) || this.floatingEl && path.includes(this.floatingEl);
1430
- if (!inside && this.hasAttribute("active")) this.hide(true);
1431
- });
1432
- __publicField(this, "handleBackdropClick", (e) => {
1433
- var _a;
1434
- if (!this.hasAttribute("active") || !((_a = this.floatingEl) == null ? void 0 : _a.classList.contains("popup-mobile-sheet"))) return;
1435
- e.stopPropagation();
1436
- this.hide(true);
1437
- });
1438
- __publicField(this, "handleViewportResize", () => {
1439
- if (!this.mobilePresentation || !this.hasAttribute("active")) return;
1440
- this.syncResponsivePresentation();
1441
- });
1442
- /**
1443
- * Removes the active attribute when the popup is hidden.
1444
- */
1445
- __publicField(this, "handleHide", () => {
1446
- this.removeAttribute("active");
1447
- });
1448
- this._manual = false;
1449
- this._contentAwareSize = false;
1450
- this._contentReadyHandler = () => this.markContentReady();
1451
- this._bottomSheetRestoreTimeout = null;
1452
- }
1453
- set loader(value) {
1454
- if (value) {
1455
- this.setAttribute("loader", "");
1456
- this._showLoader();
1457
- } else {
1458
- this.removeAttribute("loader");
1459
- this._hideLoader();
1460
- }
1461
- }
1462
- get loader() {
1463
- return this.hasAttribute("loader");
1464
- }
1465
- set contentAwareSize(value) {
1466
- this._contentAwareSize = Boolean(value);
1467
- }
1468
- get contentAwareSize() {
1469
- return this._contentAwareSize === true;
1470
- }
1471
- /**
1472
- * Sets the manual property of the popup.
1473
- * @param {boolean} value The value to set.
1474
- */
1475
- set manual(value) {
1476
- if (value) {
1477
- this.setAttribute("manual", "");
1478
- } else {
1479
- this.removeAttribute("manual");
1480
- }
1481
- }
1482
- /**
1483
- * Gets the manual property of the popup.
1484
- * @returns {boolean} The value of the manual property.
1485
- */
1486
- get manual() {
1487
- return this.hasAttribute("manual");
1488
- }
1489
- /**
1490
- * Sets or removes the 'portal' attribute on the element based on the provided value.
1491
- * If the value is truthy, the 'portal' attribute will be added.
1492
- * If the value is falsy, the 'portal' attribute will be removed.
1493
- * @param {boolean} value Determines whether the 'portal' attribute should be added or removed.
1494
- */
1495
- set portal(value) {
1496
- if (value) this.setAttribute("portal", value);
1497
- else this.removeAttribute("portal");
1498
- }
1499
- /**
1500
- * Returns whether the 'portal' attribute is present on the element.
1501
- * @returns {boolean} True if the 'portal' attribute exists, otherwise false.
1502
- */
1503
- get portal() {
1504
- return this.hasAttribute("portal");
1505
- }
1506
- set mobilePresentation(value) {
1507
- if (value) this.setAttribute("mobile-presentation", value);
1508
- else this.removeAttribute("mobile-presentation");
1509
- }
1510
- get mobilePresentation() {
1511
- return this.getAttribute("mobile-presentation");
1512
- }
1513
- set mobileBreakPoint(value) {
1514
- if (value) this.setAttribute("mobile-break-point", value);
1515
- else this.removeAttribute("mobile-break-point");
1516
- }
1517
- get mobileBreakPoint() {
1518
- return this.getAttribute("mobile-break-point") || "768";
1519
- }
1520
- get floatingEl() {
1521
- return this._floatingEl || this.native;
1522
- }
1523
- get backdropEl() {
1524
- return this._portaled ? this._portalBackdrop : this.backdrop;
1525
- }
1526
- /**
1527
- * Returns the CSS styles for the component.
1528
- * @static
1529
- * @returns {CSSStyleSheet} The CSS styles for the component.
1530
- */
1531
- static get cssStyleSheet() {
1532
- return styles;
1533
- }
1534
- /**
1535
- * Returns the list of attributes to observe for changes.
1536
- * @static
1537
- * @returns {Array<string>}
1538
- */
1539
- static get observedAttributes() {
1540
- return [];
1541
- }
1542
- /**
1543
- * Sets up the attributes for the component.
1544
- */
1545
- setupAttributes() {
1546
- this.isShadowRoot = "open";
1547
- this._hideFloatingLightDomContentBeforeRender();
1548
- }
1549
- _hideFloatingLightDomContentBeforeRender() {
1550
- if (this._hiddenFloatingLightDomContent) return;
1551
- const floatingChildren = Array.from(this.children).filter((el) => el.getAttribute("slot") !== "anchor");
1552
- if (floatingChildren.length === 0) return;
1553
- this._hiddenFloatingLightDomContent = floatingChildren.map((el) => {
1554
- const display = el.style.getPropertyValue("display");
1555
- const priority = el.style.getPropertyPriority("display");
1556
- el.style.setProperty("display", "none");
1557
- return { el, display, priority };
1558
- });
1559
- }
1560
- _restoreFloatingLightDomContentAfterRender() {
1561
- var _a;
1562
- (_a = this._hiddenFloatingLightDomContent) == null ? void 0 : _a.forEach(({ el, display, priority }) => {
1563
- if (display) {
1564
- el.style.setProperty("display", display, priority);
1565
- } else {
1566
- el.style.removeProperty("display");
1567
- }
1568
- });
1569
- this._hiddenFloatingLightDomContent = null;
1570
- }
1571
- afterDisconnect() {
1572
- var _a, _b, _c;
1573
- this.clearBottomSheetRestoreTimeout();
1574
- window.removeEventListener("resize", this.handleViewportResize);
1575
- event.removeListener(this.anchorEl, "click", this.manualCallback);
1576
- document.removeEventListener("click", this.clickHandler, { capture: true });
1577
- this.removeEventListener("wje-popup:content-ready", this._contentReadyHandler);
1578
- this._contentReadyListenerAttached = false;
1579
- (_a = this.backdrop) == null ? void 0 : _a.removeEventListener("click", this.handleBackdropClick);
1580
- (_b = this._portalBackdrop) == null ? void 0 : _b.removeEventListener("click", this.handleBackdropClick);
1581
- this._restoreContentFromPortal();
1582
- (_c = this.cleanup) == null ? void 0 : _c.call(this);
1583
- }
1584
- beforeDraw(context, store, params) {
1585
- var _a;
1586
- (_a = this.cleanup) == null ? void 0 : _a.call(this);
1587
- }
1588
- /**
1589
- * Draws the component for the popup.
1590
- * @returns {DocumentFragment}
1591
- */
1592
- draw() {
1593
- let fragment = document.createDocumentFragment();
1594
- let slotAnchor = document.createElement("slot");
1595
- slotAnchor.setAttribute("name", "anchor");
1596
- let slotArrow = document.createElement("slot");
1597
- slotArrow.setAttribute("name", "arrow");
1598
- let backdrop = document.createElement("div");
1599
- backdrop.setAttribute("part", "backdrop");
1600
- backdrop.classList.add("popup-backdrop");
1601
- backdrop.addEventListener("click", this.handleBackdropClick);
1602
- let native = document.createElement("div");
1603
- native.setAttribute("part", "native");
1604
- native.classList.add("native-popup");
1605
- let slot = document.createElement("slot");
1606
- let loader = document.createElement("div");
1607
- loader.classList.add("popup-loader", "overlay");
1608
- loader.setAttribute("part", "loader");
1609
- loader.textContent = "Loading...";
1610
- if (this.loader) native.append(loader);
1611
- native.append(slot);
1612
- native.append(slotArrow);
1613
- fragment.append(slotAnchor);
1614
- fragment.append(backdrop);
1615
- fragment.append(native);
1616
- this.slotAnchor = slotAnchor;
1617
- this.slotArrow = slotArrow;
1618
- this.defaultSlot = slot;
1619
- this.backdrop = backdrop;
1620
- this.native = native;
1621
- this.loaderEl = loader;
1622
- return fragment;
1623
- }
1624
- /**
1625
- * After Draws the component.
1626
- */
1627
- afterDraw() {
1628
- this._restoreFloatingLightDomContentAfterRender();
1629
- this.setAnchor();
1630
- window.removeEventListener("resize", this.handleViewportResize);
1631
- window.addEventListener("resize", this.handleViewportResize);
1632
- if (!this._contentReadyListenerAttached) {
1633
- this.addEventListener("wje-popup:content-ready", this._contentReadyHandler);
1634
- this._contentReadyListenerAttached = true;
1635
- }
1636
- if (this.hasAttribute("active")) this.show(false);
1637
- if (!this.hasAttribute("active")) this.hide(false);
1638
- }
1639
- /**
1640
- * Sets the anchor for the popup.
1641
- * Adds a click event listener to the anchor element.
1642
- */
1643
- setAnchor() {
1644
- if (this.slotAnchor && typeof this.anchor === "string") {
1645
- const root = this.getRootNode();
1646
- this.anchorEl = root.querySelector("#" + this.anchor);
1647
- } else if (this.slotAnchor instanceof HTMLSlotElement) {
1648
- this.anchorEl = this.slotAnchor.assignedElements({ flatten: true })[0];
1649
- }
1650
- if (this.manual) {
1651
- event.addListener(this.anchorEl, "click", null, this.manualCallback, { stopPropagation: true });
1652
- }
1653
- }
1654
- clearBottomSheetRestoreTimeout() {
1655
- if (this._bottomSheetRestoreTimeout === null) return;
1656
- window.clearTimeout(this._bottomSheetRestoreTimeout);
1657
- this._bottomSheetRestoreTimeout = null;
1658
- }
1659
- isBottomSheetActive() {
1660
- return this.mobilePresentation === "bottom-sheet" && window.innerWidth <= +this.mobileBreakPoint;
1661
- }
1662
- setBottomSheetState(isActive) {
1663
- const native = this.floatingEl;
1664
- const backdrop = this.backdropEl;
1665
- if (!native || !backdrop) return;
1666
- native.classList.add("popup-mobile-sheet");
1667
- backdrop.classList.add("popup-mobile-sheet");
1668
- native.classList.toggle("popup-active", isActive);
1669
- backdrop.classList.toggle("popup-active", isActive);
1670
- }
1671
- clearBottomSheetState() {
1672
- [this.native, this.backdrop, this._portalNative, this._portalBackdrop].forEach((el) => {
1673
- el == null ? void 0 : el.classList.remove("popup-mobile-sheet", "popup-active");
1674
- });
1675
- }
1676
- rebindPortaledRouter() {
1677
- if (!this._portalShadow) return;
1678
- const detail = {
1679
- root: this._portalShadow,
1680
- container: this._portalContainer,
1681
- floating: this._portalNative
1682
- };
1683
- document.dispatchEvent(new CustomEvent("wje-router:rebind", { bubbles: true, composed: true, detail }));
1684
- if (typeof window.bindRouterLinks === "function") {
1685
- window.bindRouterLinks(this._portalShadow);
1686
- }
1687
- }
1688
- syncResponsivePresentation() {
1689
- var _a, _b, _c, _d, _e, _f;
1690
- const shouldUseBottomSheet = this.isBottomSheetActive();
1691
- const isUsingBottomSheet = (_b = (_a = this.floatingEl) == null ? void 0 : _a.classList) == null ? void 0 : _b.contains("popup-mobile-sheet");
1692
- if (shouldUseBottomSheet) {
1693
- (_c = this.cleanup) == null ? void 0 : _c.call(this);
1694
- this.cleanup = void 0;
1695
- if (!this._portaled) {
1696
- this._mountContentToPortal();
1697
- this.rebindPortaledRouter();
1698
- }
1699
- this.setBottomSheetState(false);
1700
- (_d = this.floatingEl) == null ? void 0 : _d.getBoundingClientRect();
1701
- (_e = this.backdropEl) == null ? void 0 : _e.getBoundingClientRect();
1702
- requestAnimationFrame(() => {
1703
- if (!this.hasAttribute("active") || !this.isBottomSheetActive()) return;
1704
- this.setBottomSheetState(true);
1705
- });
1706
- return;
1707
- }
1708
- if (isUsingBottomSheet) {
1709
- this.clearBottomSheetRestoreTimeout();
1710
- this.clearBottomSheetState();
1711
- if (!this.portal && this._portaled) {
1712
- this._restoreContentFromPortal();
1713
- }
1714
- }
1715
- if (this.anchorEl && this.floatingEl) {
1716
- this.floatingEl.classList.add("popup-active");
1717
- (_f = this.cleanup) == null ? void 0 : _f.call(this);
1718
- this.cleanup = autoUpdate(this.anchorEl, this.floatingEl, () => {
1719
- this.reposition();
1720
- });
1721
- this.reposition();
1722
- }
1723
- }
1724
- getBottomSheetTransitionDurationMs() {
1725
- const parseDuration = (value) => {
1726
- const trimmedValue = value == null ? void 0 : value.trim();
1727
- if (!trimmedValue) return 0;
1728
- if (trimmedValue.endsWith("ms")) return Number.parseFloat(trimmedValue) || 0;
1729
- if (trimmedValue.endsWith("s")) return (Number.parseFloat(trimmedValue) || 0) * 1e3;
1730
- return Number.parseFloat(trimmedValue) || 0;
1731
- };
1732
- const getMaxDuration = (el) => {
1733
- if (!el) return 0;
1734
- const computedStyles = getComputedStyle(el);
1735
- const durations = computedStyles.transitionDuration.split(",");
1736
- const delays = computedStyles.transitionDelay.split(",");
1737
- const count = Math.max(durations.length, delays.length);
1738
- let maxDuration = 0;
1739
- for (let i = 0; i < count; i++) {
1740
- const duration = parseDuration(durations[i] || durations[durations.length - 1]);
1741
- const delay = parseDuration(delays[i] || delays[delays.length - 1]);
1742
- maxDuration = Math.max(maxDuration, duration + delay);
1743
- }
1744
- return maxDuration;
1745
- };
1746
- const transitionDuration = Math.max(getMaxDuration(this.floatingEl), getMaxDuration(this.backdropEl));
1747
- return transitionDuration || POPUP_MOBILE_SHEET_TRANSITION_FALLBACK_MS;
1748
- }
1749
- /**
1750
- * Toggles the active attribute of the popup.
1751
- */
1752
- showHide() {
1753
- if (this.hasAttribute("active")) {
1754
- this.hide();
1755
- } else {
1756
- event.dispatchCustomEvent(this, "wje-popup:beforeshow");
1757
- this.show();
1758
- event.dispatchCustomEvent(this, "wje-popup:aftershow");
1759
- }
1760
- }
1761
- /**
1762
- * Repositions the popup.
1763
- * Uses the floating-ui library to compute the position.
1764
- */
1765
- reposition() {
1766
- var _a, _b;
1767
- if ((_b = (_a = this.floatingEl) == null ? void 0 : _a.classList) == null ? void 0 : _b.contains("popup-mobile-sheet")) return;
1768
- const middleware = [];
1769
- this.offsetCalc = +this.offset || 0;
1770
- if (this.portal && this._portaled && this.floatingEl) {
1771
- this.arrow = this.floatingEl.querySelector('[slot="arrow"]');
1772
- } else if (this.slotArrow instanceof HTMLSlotElement) {
1773
- this.arrow = this.slotArrow.assignedElements({ flatten: true })[0];
1774
- }
1775
- if (this.arrow) {
1776
- middleware.push(
1777
- arrow({
1778
- element: this.arrow
1779
- })
1780
- );
1781
- this.offsetCalc = Math.sqrt(2 * this.arrow.offsetWidth ** 2) / 2 + +this.offset;
1782
- }
1783
- middleware.push(offset(this.offsetCalc));
1784
- middleware.push(flip());
1785
- if (this.hasAttribute("size")) {
1786
- middleware.push(
1787
- size({
1788
- apply: ({ elements }) => {
1789
- if (this.contentAwareSize) {
1790
- Object.assign(elements.floating.style, {
1791
- minWidth: `${elements.reference.offsetWidth}px`,
1792
- width: ""
1793
- });
1794
- return;
1795
- }
1796
- Object.assign(elements.floating.style, {
1797
- minWidth: "",
1798
- width: `${elements.reference.offsetWidth}px`
1799
- });
1800
- }
1801
- })
1802
- );
1803
- }
1804
- computePosition(this.anchorEl, this.floatingEl, {
1805
- placement: this.placement || "bottom",
1806
- strategy: "fixed",
1807
- middleware
1808
- }).then(({ x, y, middlewareData, placement, strategy }) => {
1809
- this.floatingEl.style.setProperty("--wje-popup-left", x + "px");
1810
- this.floatingEl.style.setProperty("--wje-popup-top", y + "px");
1811
- this.floatingEl.style.position = strategy;
1812
- if (this.arrow) {
1813
- const staticSide = {
1814
- top: "bottom",
1815
- right: "left",
1816
- bottom: "top",
1817
- left: "right"
1818
- }[placement];
1819
- if (middlewareData.arrow) {
1820
- const { width, height } = this.floatingEl.getBoundingClientRect();
1821
- let osX = middlewareData.arrow.x;
1822
- let osY = middlewareData.arrow.y;
1823
- Object.assign(this.arrow.style, {
1824
- left: osX !== null && osX !== void 0 ? `${width / 2 - this.arrow.offsetWidth / 2}px` : "",
1825
- top: osY !== null && osY !== void 0 ? `${height / 2 - this.arrow.offsetHeight / 2}px` : "",
1826
- [staticSide]: `${-this.arrow.offsetHeight / 2}px`
1827
- });
1828
- }
1829
- }
1830
- });
1831
- event.dispatchCustomEvent(this, "wje-popup:reposition", {
1832
- data: { top: "bottom", right: "left", bottom: "top", left: "right" },
1833
- context: this,
1834
- event: this
1835
- });
1836
- }
1837
- /**
1838
- * Mounts content to a portal container by creating or ensuring a portal root and mirroring
1839
- * the host's classes, attributes, and slot contents onto the portal. This method manages the
1840
- * movement of default and arrow slot content into the portal shadow DOM, while also setting
1841
- * up necessary mutation observers to keep attributes in sync.
1842
- * @returns {void} Does not return a value.
1843
- */
1844
- _mountContentToPortal() {
1845
- if (this._portaled) return;
1846
- this._ensurePortalRoot();
1847
- if (!this._portalNative) {
1848
- this._portalBackdrop = document.createElement("div");
1849
- this._portalBackdrop.setAttribute("part", "backdrop");
1850
- this._portalBackdrop.classList.add("popup-backdrop");
1851
- this._portalBackdrop.addEventListener("click", this.handleBackdropClick);
1852
- this._portalNative = document.createElement("div");
1853
- this._portalNative.setAttribute("part", "native");
1854
- this._portalNative.classList.add("native-popup");
1855
- this._portalSlot = document.createElement("slot");
1856
- this._portalArrowSlot = document.createElement("slot");
1857
- this._portalArrowSlot.setAttribute("name", "arrow");
1858
- this._portalNative.append(this._portalSlot, this._portalArrowSlot);
1859
- }
1860
- this._portalShadow.append(this._portalBackdrop);
1861
- this._portalShadow.append(this._portalNative);
1862
- const mirrorAll = () => {
1863
- for (const { name } of Array.from(this._portalContainer.attributes)) {
1864
- if (name === "data-wje-popup-portal") continue;
1865
- this._portalContainer.removeAttribute(name);
1866
- }
1867
- for (const attr of Array.from(this.attributes)) {
1868
- this._portalContainer.setAttribute(attr.name, attr.value ?? "");
1869
- }
1870
- this._portalContainer.setAttribute("class", this.getAttribute("class") || "");
1871
- };
1872
- mirrorAll();
1873
- this._portalAttrObserver = new MutationObserver((records) => {
1874
- for (const r of records) {
1875
- if (r.type === "attributes") {
1876
- const name = r.attributeName;
1877
- const val = this.getAttribute(name);
1878
- if (val === null) this._portalContainer.removeAttribute(name);
1879
- else this._portalContainer.setAttribute(name, val);
1880
- }
1881
- }
1882
- });
1883
- this._portalAttrObserver.observe(this, { attributes: true });
1884
- const defaultSlot = this.defaultSlot;
1885
- const defNodes = (defaultSlot ? defaultSlot.assignedNodes({ flatten: true }) : []).filter(
1886
- (n) => n && n.nodeType === Node.ELEMENT_NODE || n && n.nodeType === Node.TEXT_NODE
1887
- );
1888
- this._defPlaceholders = [];
1889
- for (const n of defNodes) {
1890
- const ph = document.createComment("wje-portal-default");
1891
- this._defPlaceholders.push({ node: n, ph });
1892
- if (n.parentNode) n.parentNode.insertBefore(ph, n.nextSibling);
1893
- this._portalContainer.append(n);
1894
- }
1895
- const arrowNodes = (this.slotArrow instanceof HTMLSlotElement ? this.slotArrow.assignedNodes({ flatten: true }) : []).filter((n) => n && n.nodeType === Node.ELEMENT_NODE || n && n.nodeType === Node.TEXT_NODE);
1896
- this._arrowPlaceholders = [];
1897
- for (const n of arrowNodes) {
1898
- const ph = document.createComment("wje-portal-arrow");
1899
- this._arrowPlaceholders.push({ node: n, ph });
1900
- if (n.parentNode) n.parentNode.insertBefore(ph, n.nextSibling);
1901
- this._portalContainer.append(n);
1902
- }
1903
- this._floatingEl = this._portalNative;
1904
- this._portaled = true;
1905
- this._floatingEl = this._portalNative;
1906
- this._portaled = true;
1907
- event.dispatchCustomEvent(this, "wje-router:rebind", {
1908
- root: this._portalShadow,
1909
- container: this._portalContainer,
1910
- floating: this._portalNative
1911
- });
1912
- }
1913
- /**
1914
- * Restores the content previously moved to a portal back to its original location.
1915
- * This method handles restoring default slot content, arrow placeholders, disconnecting
1916
- * attribute mirroring observers, and cleaning up elements and containers related to the portal.
1917
- * Ensures all placeholders and native portal elements are properly removed from the DOM.
1918
- * @returns {void} Does not return a value.
1919
- */
1920
- _restoreContentFromPortal() {
1921
- if (!this._portaled) return;
1922
- if (Array.isArray(this._defPlaceholders)) {
1923
- for (const { node, ph } of this._defPlaceholders) {
1924
- if (ph && ph.parentNode) {
1925
- ph.parentNode.insertBefore(node, ph);
1926
- ph.remove();
1927
- }
1928
- }
1929
- }
1930
- this._defPlaceholders = void 0;
1931
- if (Array.isArray(this._arrowPlaceholders)) {
1932
- for (const { node, ph } of this._arrowPlaceholders) {
1933
- if (ph && ph.parentNode) {
1934
- ph.parentNode.insertBefore(node, ph);
1935
- ph.remove();
1936
- }
1937
- }
1938
- }
1939
- this._arrowPlaceholders = void 0;
1940
- if (this._portalAttrObserver) {
1941
- this._portalAttrObserver.disconnect();
1942
- this._portalAttrObserver = null;
1943
- }
1944
- if (this._portalNative && this._portalNative.parentNode) {
1945
- this._portalNative.remove();
1946
- }
1947
- if (this._portalBackdrop && this._portalBackdrop.parentNode) {
1948
- this._portalBackdrop.remove();
1949
- }
1950
- this._floatingEl = void 0;
1951
- this._portaled = false;
1952
- if (this._portalContainer) {
1953
- this._portalContainer.remove();
1954
- this._portalContainer = null;
1955
- this._portalShadow = null;
1956
- }
1957
- const detail = { root: this.shadowRoot, container: this, floating: this.native };
1958
- this.dispatchEvent(new CustomEvent("wje-portal:restored", { bubbles: true, composed: true, detail }));
1959
- try {
1960
- if (typeof window.bindRouterLinks === "function") {
1961
- window.bindRouterLinks(this.shadowRoot);
1962
- }
1963
- document.dispatchEvent(new CustomEvent("wje-router:rebind", { bubbles: true, composed: true, detail }));
1964
- } catch {
1965
- }
1966
- }
1967
- /**
1968
- * Ensures that a portal root is created and initialized properly with a shadow DOM and attached styles.
1969
- * If the portal root already exists, the method exits early.
1970
- * The method creates a `div` element in the document body and attaches a shadow DOM to it.
1971
- * It also applies the required styles to the shadow DOM, either using constructable stylesheets
1972
- * or by appending a `<style>` element. Additionally, it copies CSS custom properties from the
1973
- * component's computed styles to the portal host to ensure proper style resolution.
1974
- * @returns {void} This method does not return a value.
1975
- */
1976
- _ensurePortalRoot() {
1977
- var _a, _b;
1978
- if (this._portalContainer && this._portalShadow) return;
1979
- const host = document.createElement("div");
1980
- host.setAttribute("data-wje-popup-portal", "");
1981
- const shadow = host.attachShadow({ mode: "open" });
1982
- const sheetCandidate = this.constructor.cssStyleSheet;
1983
- try {
1984
- if (sheetCandidate instanceof CSSStyleSheet) {
1985
- shadow.adoptedStyleSheets = [sheetCandidate];
1986
- } else if (typeof sheetCandidate === "string" && "adoptedStyleSheets" in Document.prototype) {
1987
- const sheet = new CSSStyleSheet();
1988
- sheet.replaceSync(sheetCandidate);
1989
- shadow.adoptedStyleSheets = [sheet];
1990
- } else {
1991
- const style = document.createElement("style");
1992
- style.textContent = typeof sheetCandidate === "string" ? sheetCandidate : ((_a = sheetCandidate == null ? void 0 : sheetCandidate.toString) == null ? void 0 : _a.call(sheetCandidate)) || "";
1993
- shadow.append(style);
1994
- }
1995
- } catch (e) {
1996
- const style = document.createElement("style");
1997
- style.textContent = typeof sheetCandidate === "string" ? sheetCandidate : ((_b = sheetCandidate == null ? void 0 : sheetCandidate.toString) == null ? void 0 : _b.call(sheetCandidate)) || "";
1998
- shadow.append(style);
1999
- }
2000
- const comp = getComputedStyle(this);
2001
- for (let i = 0; i < comp.length; i++) {
2002
- const prop = comp[i];
2003
- if (prop.startsWith("--")) {
2004
- host.style.setProperty(prop, comp.getPropertyValue(prop));
2005
- }
2006
- }
2007
- if (this.getAttribute("portal") === "dialog" || this.isBottomSheetActive() && this.findDialog(this)) {
2008
- const dialog = this.findDialog(this);
2009
- if (dialog) {
2010
- dialog.append(host);
2011
- } else {
2012
- document.body.append(host);
2013
- }
2014
- } else {
2015
- document.body.append(host);
2016
- }
2017
- this._portalContainer = host;
2018
- this._portalShadow = shadow;
2019
- }
2020
- findDialog(el) {
2021
- var _a;
2022
- while (el) {
2023
- const d = (_a = el.closest) == null ? void 0 : _a.call(el, "wje-dialog");
2024
- if (d) return d;
2025
- el = el.getRootNode().host || el.parentElement;
2026
- }
2027
- return null;
2028
- }
2029
- /**
2030
- * Displays the popup by portaling the content, managing the loader state, and attaching event handlers.
2031
- * Optionally dispatches a custom event when the popup is shown.
2032
- * @param {boolean} [dispatchEvent] Indicates whether to dispatch a custom event ('wje-popup:show') when the popup is shown.
2033
- * @returns {void} Does not return any value.
2034
- */
2035
- show(dispatchEvent = true) {
2036
- var _a, _b, _c, _d, _e;
2037
- this.clearBottomSheetRestoreTimeout();
2038
- event.dispatchCustomEvent(document, "wje-popup:opened", { popup: this });
2039
- if (this.portal || this.isBottomSheetActive()) {
2040
- this._mountContentToPortal();
2041
- this.rebindPortaledRouter();
2042
- }
2043
- if (this.loader) {
2044
- this._showLoader();
2045
- }
2046
- if (dispatchEvent) {
2047
- event.dispatchCustomEvent(this, "wje-popup:show");
2048
- }
2049
- if (this.isBottomSheetActive()) {
2050
- this.setBottomSheetState(false);
2051
- (_a = this.floatingEl) == null ? void 0 : _a.getBoundingClientRect();
2052
- (_b = this.backdropEl) == null ? void 0 : _b.getBoundingClientRect();
2053
- requestAnimationFrame(() => {
2054
- if (!this.hasAttribute("active")) return;
2055
- this.setBottomSheetState(true);
2056
- });
2057
- document.addEventListener("click", this.clickHandler, { capture: true });
2058
- } else if (this.anchorEl && this.floatingEl) {
2059
- this.clearBottomSheetState();
2060
- (_d = (_c = this.floatingEl) == null ? void 0 : _c.classList) == null ? void 0 : _d.add("popup-active");
2061
- (_e = this.cleanup) == null ? void 0 : _e.call(this);
2062
- this.cleanup = autoUpdate(this.anchorEl, this.floatingEl, () => {
2063
- this.reposition();
2064
- });
2065
- document.addEventListener("click", this.clickHandler, { capture: true });
2066
- }
2067
- if (!this.hasAttribute("active")) {
2068
- this.setAttribute("active", "");
2069
- }
2070
- }
2071
- /**
2072
- * Hides the popup.
2073
- * Removes the popup-active class from the floating element.
2074
- * Cleans up the auto update for repositioning.
2075
- */
2076
- hide(dispatchEvent = true) {
2077
- var _a, _b, _c, _d, _e, _f, _g, _h, _i;
2078
- if (dispatchEvent) {
2079
- event.dispatchCustomEvent(this, "wje-popup:hide");
2080
- }
2081
- (_a = this.cleanup) == null ? void 0 : _a.call(this);
2082
- this.cleanup = void 0;
2083
- document.removeEventListener("click", this.clickHandler, { capture: true });
2084
- const shouldAnimateBottomSheetClose = (_c = (_b = this.floatingEl) == null ? void 0 : _b.classList) == null ? void 0 : _c.contains("popup-mobile-sheet");
2085
- if (shouldAnimateBottomSheetClose) {
2086
- (_e = (_d = this.backdropEl) == null ? void 0 : _d.classList) == null ? void 0 : _e.remove("popup-active");
2087
- (_g = (_f = this.floatingEl) == null ? void 0 : _f.classList) == null ? void 0 : _g.remove("popup-active");
2088
- this.clearBottomSheetRestoreTimeout();
2089
- this._bottomSheetRestoreTimeout = window.setTimeout(() => {
2090
- this.clearBottomSheetState();
2091
- if (this._portaled) {
2092
- this._restoreContentFromPortal();
2093
- }
2094
- this._bottomSheetRestoreTimeout = null;
2095
- }, this.getBottomSheetTransitionDurationMs());
2096
- } else {
2097
- (_i = (_h = this.floatingEl) == null ? void 0 : _h.classList) == null ? void 0 : _i.remove("popup-active");
2098
- this.clearBottomSheetState();
2099
- if (this._portaled) {
2100
- this._restoreContentFromPortal();
2101
- }
2102
- }
2103
- if (this.hasAttribute("active")) {
2104
- this.removeAttribute("active");
2105
- }
2106
- }
2107
- _showLoader() {
2108
- const floating = this.floatingEl;
2109
- if (!(floating instanceof HTMLElement) || !(this.loaderEl instanceof HTMLElement)) return;
2110
- floating.classList.add("loading");
2111
- this.loaderEl.classList.remove("fade-out");
2112
- if (this.loaderEl.parentElement !== floating) {
2113
- floating.prepend(this.loaderEl);
2114
- }
2115
- }
2116
- _hideLoader() {
2117
- var _a, _b, _c, _d, _e, _f;
2118
- (_b = (_a = this.native) == null ? void 0 : _a.classList) == null ? void 0 : _b.remove("loading");
2119
- (_d = (_c = this._portalNative) == null ? void 0 : _c.classList) == null ? void 0 : _d.remove("loading");
2120
- (_f = (_e = this.floatingEl) == null ? void 0 : _e.classList) == null ? void 0 : _f.remove("loading");
2121
- if (this.loaderEl instanceof HTMLElement) {
2122
- this.loaderEl.classList.remove("fade-out");
2123
- this.loaderEl.remove();
2124
- }
2125
- }
2126
- markContentReady() {
2127
- this.loader = false;
2128
- }
2129
- }
2130
- export {
2131
- Popup as P
2132
- };
2133
- //# sourceMappingURL=popup.element-CwXvVFK7.js.map