@ariakit/react-core 0.1.8 → 0.2.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 (151) hide show
  1. package/CHANGELOG.md +96 -0
  2. package/cjs/__chunks/{XFZ3MEQZ.cjs → 27JG67F3.cjs} +3 -3
  3. package/cjs/__chunks/{ASQZCUUA.cjs → 4SZYU2PD.cjs} +2 -2
  4. package/cjs/__chunks/5P6HRGY6.cjs +21 -0
  5. package/cjs/__chunks/{YYKQBWQQ.cjs → A6ZSQXNQ.cjs} +2 -2
  6. package/cjs/__chunks/{OMM6PC3A.cjs → D3EUPD6P.cjs} +15 -4
  7. package/cjs/__chunks/{IRSBF3C5.cjs → GOXUG4RX.cjs} +23 -18
  8. package/cjs/__chunks/{RHO5OVPE.cjs → GRL5KGV3.cjs} +2 -2
  9. package/cjs/__chunks/MHL3EECX.cjs +363 -0
  10. package/cjs/__chunks/{AUDANYMJ.cjs → W2XKIB23.cjs} +1 -20
  11. package/cjs/__chunks/{PFD4TS6B.cjs → WWDX5YPG.cjs} +28 -15
  12. package/cjs/combobox/combobox-item.cjs +1 -1
  13. package/cjs/combobox/combobox-popover.cjs +9 -8
  14. package/cjs/combobox/combobox-store.cjs +3 -3
  15. package/cjs/combobox/combobox-store.d.ts +0 -7
  16. package/cjs/combobox/combobox.cjs +3 -3
  17. package/cjs/composite/composite-item.cjs +1 -1
  18. package/cjs/composite/composite-overflow-disclosure.cjs +5 -5
  19. package/cjs/composite/composite-overflow-store.cjs +3 -3
  20. package/cjs/composite/composite-overflow-store.d.ts +1 -13
  21. package/cjs/composite/composite-overflow.cjs +9 -8
  22. package/cjs/composite/composite.cjs +3 -3
  23. package/cjs/dialog/dialog-backdrop.cjs +3 -2
  24. package/cjs/dialog/dialog-backdrop.d.ts +2 -5
  25. package/cjs/dialog/dialog-dismiss.cjs +1 -1
  26. package/cjs/dialog/dialog.cjs +8 -7
  27. package/cjs/dialog/dialog.d.ts +19 -6
  28. package/cjs/form/form-radio.cjs +1 -1
  29. package/cjs/hovercard/hovercard-dismiss.cjs +1 -1
  30. package/cjs/hovercard/hovercard-store.cjs +3 -3
  31. package/cjs/hovercard/hovercard-store.d.ts +1 -13
  32. package/cjs/hovercard/hovercard.cjs +10 -9
  33. package/cjs/menu/menu-bar.cjs +3 -3
  34. package/cjs/menu/menu-button.cjs +8 -8
  35. package/cjs/menu/menu-dismiss.cjs +1 -1
  36. package/cjs/menu/menu-item-checkbox.cjs +1 -1
  37. package/cjs/menu/menu-item-radio.cjs +1 -1
  38. package/cjs/menu/menu-item.cjs +1 -1
  39. package/cjs/menu/menu-list.cjs +4 -4
  40. package/cjs/menu/menu-store.cjs +7 -7
  41. package/cjs/menu/menu-store.d.ts +0 -7
  42. package/cjs/menu/menu.cjs +18 -17
  43. package/cjs/popover/popover-disclosure.cjs +4 -4
  44. package/cjs/popover/popover-dismiss.cjs +1 -1
  45. package/cjs/popover/popover-store.cjs +2 -2
  46. package/cjs/popover/popover-store.d.ts +1 -13
  47. package/cjs/popover/popover.cjs +9 -8
  48. package/cjs/popover/popover.d.ts +96 -0
  49. package/cjs/portal/portal.cjs +2 -2
  50. package/cjs/radio/radio-group.cjs +3 -3
  51. package/cjs/radio/radio.cjs +1 -1
  52. package/cjs/role/role.cjs +3 -14
  53. package/cjs/select/select-item.cjs +1 -1
  54. package/cjs/select/select-list.cjs +4 -4
  55. package/cjs/select/select-popover.cjs +18 -17
  56. package/cjs/select/select-store.cjs +3 -3
  57. package/cjs/select/select-store.d.ts +0 -7
  58. package/cjs/select/select.cjs +5 -5
  59. package/cjs/tab/tab-list.cjs +3 -3
  60. package/cjs/tab/tab-panel.cjs +3 -3
  61. package/cjs/tab/tab.cjs +1 -1
  62. package/cjs/toolbar/toolbar-container.cjs +1 -1
  63. package/cjs/toolbar/toolbar-input.cjs +1 -1
  64. package/cjs/toolbar/toolbar-item.cjs +1 -1
  65. package/cjs/toolbar/toolbar.cjs +3 -3
  66. package/cjs/tooltip/tooltip-anchor.cjs +58 -28
  67. package/cjs/tooltip/tooltip-anchor.d.ts +2 -18
  68. package/cjs/tooltip/tooltip-store.cjs +4 -3
  69. package/cjs/tooltip/tooltip-store.d.ts +5 -17
  70. package/cjs/tooltip/tooltip.cjs +66 -67
  71. package/cjs/tooltip/tooltip.d.ts +6 -25
  72. package/cjs/tsconfig.build.tsbuildinfo +1 -1
  73. package/esm/__chunks/{USCWE5QL.js → 2CA5JWPW.js} +28 -15
  74. package/esm/__chunks/5PIH3SMS.js +35 -0
  75. package/esm/__chunks/{PZK3B6LX.js → 776K5FXB.js} +1 -1
  76. package/esm/__chunks/{DQSQP4IL.js → GDDVBILZ.js} +1 -1
  77. package/esm/__chunks/{CXDKC5CW.js → HJWYYQGA.js} +1 -1
  78. package/esm/__chunks/{3FKA4P4C.js → K5R24MFH.js} +1 -1
  79. package/esm/__chunks/MLEIJKSM.js +363 -0
  80. package/esm/__chunks/{ZFMAA4DD.js → MR75RQGW.js} +16 -5
  81. package/esm/__chunks/{EMZ4NQG4.js → NAG6UD2X.js} +25 -20
  82. package/esm/__chunks/XIACQCPS.js +21 -0
  83. package/esm/combobox/combobox-item.js +1 -1
  84. package/esm/combobox/combobox-popover.js +8 -7
  85. package/esm/combobox/combobox-store.d.ts +0 -7
  86. package/esm/combobox/combobox-store.js +1 -1
  87. package/esm/combobox/combobox.js +2 -2
  88. package/esm/composite/composite-item.js +1 -1
  89. package/esm/composite/composite-overflow-disclosure.js +4 -4
  90. package/esm/composite/composite-overflow-store.d.ts +1 -13
  91. package/esm/composite/composite-overflow-store.js +1 -1
  92. package/esm/composite/composite-overflow.js +8 -7
  93. package/esm/composite/composite.js +2 -2
  94. package/esm/dialog/dialog-backdrop.d.ts +2 -5
  95. package/esm/dialog/dialog-backdrop.js +2 -1
  96. package/esm/dialog/dialog-dismiss.js +1 -1
  97. package/esm/dialog/dialog.d.ts +19 -6
  98. package/esm/dialog/dialog.js +7 -6
  99. package/esm/form/form-radio.js +1 -1
  100. package/esm/hovercard/hovercard-dismiss.js +1 -1
  101. package/esm/hovercard/hovercard-store.d.ts +1 -13
  102. package/esm/hovercard/hovercard-store.js +2 -2
  103. package/esm/hovercard/hovercard.js +9 -8
  104. package/esm/menu/menu-bar.js +2 -2
  105. package/esm/menu/menu-button.js +7 -7
  106. package/esm/menu/menu-dismiss.js +1 -1
  107. package/esm/menu/menu-item-checkbox.js +1 -1
  108. package/esm/menu/menu-item-radio.js +1 -1
  109. package/esm/menu/menu-item.js +1 -1
  110. package/esm/menu/menu-list.js +3 -3
  111. package/esm/menu/menu-store.d.ts +0 -7
  112. package/esm/menu/menu-store.js +5 -5
  113. package/esm/menu/menu.js +17 -16
  114. package/esm/popover/popover-disclosure.js +3 -3
  115. package/esm/popover/popover-dismiss.js +1 -1
  116. package/esm/popover/popover-store.d.ts +1 -13
  117. package/esm/popover/popover-store.js +1 -1
  118. package/esm/popover/popover.d.ts +96 -0
  119. package/esm/popover/popover.js +8 -7
  120. package/esm/portal/portal.js +1 -1
  121. package/esm/radio/radio-group.js +2 -2
  122. package/esm/radio/radio.js +1 -1
  123. package/esm/role/role.js +4 -15
  124. package/esm/select/select-item.js +1 -1
  125. package/esm/select/select-list.js +3 -3
  126. package/esm/select/select-popover.js +16 -15
  127. package/esm/select/select-store.d.ts +0 -7
  128. package/esm/select/select-store.js +1 -1
  129. package/esm/select/select.js +4 -4
  130. package/esm/tab/tab-list.js +2 -2
  131. package/esm/tab/tab-panel.js +3 -3
  132. package/esm/tab/tab.js +1 -1
  133. package/esm/toolbar/toolbar-container.js +1 -1
  134. package/esm/toolbar/toolbar-input.js +1 -1
  135. package/esm/toolbar/toolbar-item.js +1 -1
  136. package/esm/toolbar/toolbar.js +2 -2
  137. package/esm/tooltip/tooltip-anchor.d.ts +2 -18
  138. package/esm/tooltip/tooltip-anchor.js +59 -29
  139. package/esm/tooltip/tooltip-store.d.ts +5 -17
  140. package/esm/tooltip/tooltip-store.js +6 -5
  141. package/esm/tooltip/tooltip.d.ts +6 -25
  142. package/esm/tooltip/tooltip.js +67 -68
  143. package/esm/tsconfig.build.tsbuildinfo +1 -1
  144. package/package.json +3 -2
  145. package/cjs/__chunks/JZRGYPLK.cjs +0 -125
  146. package/esm/__chunks/JJHXFKMC.js +0 -125
  147. package/esm/__chunks/SHGWT5HV.js +0 -54
  148. package/cjs/__chunks/{OV363CW6.cjs → BDJYHP43.cjs} +2 -2
  149. package/cjs/__chunks/{5I6IQHKQ.cjs → BIPONQXE.cjs} +2 -2
  150. package/esm/__chunks/{OY5YT7OV.js → RTOWJJVI.js} +3 -3
  151. package/esm/__chunks/{6O3TZMB4.js → U2KSDJ3W.js} +3 -3
@@ -0,0 +1,363 @@
1
+ "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
+
3
+ var _GOXUG4RXcjs = require('./GOXUG4RX.cjs');
4
+
5
+
6
+ var _W5PBA4D6cjs = require('./W5PBA4D6.cjs');
7
+
8
+
9
+
10
+
11
+ var _7NAIPZYNcjs = require('./7NAIPZYN.cjs');
12
+
13
+
14
+
15
+
16
+
17
+ var _NREUHWTUcjs = require('./NREUHWTU.cjs');
18
+
19
+
20
+
21
+
22
+ var _6455U47Tcjs = require('./6455U47T.cjs');
23
+
24
+ // src/popover/popover.tsx
25
+ var _react = require('react');
26
+ var _misc = require('@ariakit/core/utils/misc');
27
+
28
+
29
+
30
+
31
+
32
+
33
+
34
+
35
+ var _dom = require('@floating-ui/dom');
36
+ var _jsxruntime = require('react/jsx-runtime');
37
+ function createDOMRect(x = 0, y = 0, width = 0, height = 0) {
38
+ if (typeof DOMRect === "function") {
39
+ return new DOMRect(x, y, width, height);
40
+ }
41
+ const rect = {
42
+ x,
43
+ y,
44
+ width,
45
+ height,
46
+ top: y,
47
+ right: x + width,
48
+ bottom: y + height,
49
+ left: x
50
+ };
51
+ return _6455U47Tcjs.__spreadProps.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, {}, rect), { toJSON: () => rect });
52
+ }
53
+ function getDOMRect(anchorRect) {
54
+ if (!anchorRect)
55
+ return createDOMRect();
56
+ const { x, y, width, height } = anchorRect;
57
+ return createDOMRect(x, y, width, height);
58
+ }
59
+ function getAnchorElement(anchorElement, getAnchorRect) {
60
+ const contextElement = anchorElement || void 0;
61
+ return {
62
+ contextElement,
63
+ getBoundingClientRect: () => {
64
+ const anchor = anchorElement;
65
+ const anchorRect = getAnchorRect == null ? void 0 : getAnchorRect(anchor);
66
+ if (anchorRect || !anchor) {
67
+ return getDOMRect(anchorRect);
68
+ }
69
+ return anchor.getBoundingClientRect();
70
+ }
71
+ };
72
+ }
73
+ function isValidPlacement(flip2) {
74
+ return /^(?:top|bottom|left|right)(?:-(?:start|end))?$/.test(flip2);
75
+ }
76
+ function roundByDPR(value) {
77
+ const dpr = window.devicePixelRatio || 1;
78
+ return Math.round(value * dpr) / dpr;
79
+ }
80
+ function getOffsetMiddleware(arrowElement, props) {
81
+ return _dom.offset.call(void 0, ({ placement }) => {
82
+ var _a;
83
+ const arrowOffset = ((arrowElement == null ? void 0 : arrowElement.clientHeight) || 0) / 2;
84
+ const finalGutter = typeof props.gutter === "number" ? props.gutter + arrowOffset : (_a = props.gutter) != null ? _a : arrowOffset;
85
+ const hasAlignment = !!placement.split("-")[1];
86
+ return {
87
+ crossAxis: !hasAlignment ? props.shift : void 0,
88
+ mainAxis: finalGutter,
89
+ alignmentAxis: props.shift
90
+ };
91
+ });
92
+ }
93
+ function getFlipMiddleware(props) {
94
+ if (props.flip === false)
95
+ return;
96
+ const fallbackPlacements = typeof props.flip === "string" ? props.flip.split(" ") : void 0;
97
+ _misc.invariant.call(void 0,
98
+ !fallbackPlacements || fallbackPlacements.every(isValidPlacement),
99
+ process.env.NODE_ENV !== "production" && "`flip` expects a spaced-delimited list of placements"
100
+ );
101
+ return _dom.flip.call(void 0, {
102
+ padding: props.overflowPadding,
103
+ fallbackPlacements
104
+ });
105
+ }
106
+ function getShiftMiddleware(props) {
107
+ if (!props.slide && !props.overlap)
108
+ return;
109
+ return _dom.shift.call(void 0, {
110
+ mainAxis: props.slide,
111
+ crossAxis: props.overlap,
112
+ padding: props.overflowPadding
113
+ });
114
+ }
115
+ function getSizeMiddleware(props) {
116
+ return _dom.size.call(void 0, {
117
+ padding: props.overflowPadding,
118
+ apply({ elements, availableWidth, availableHeight, rects }) {
119
+ const wrapper = elements.floating;
120
+ const referenceWidth = Math.round(rects.reference.width);
121
+ availableWidth = Math.floor(availableWidth);
122
+ availableHeight = Math.floor(availableHeight);
123
+ wrapper.style.setProperty(
124
+ "--popover-anchor-width",
125
+ `${referenceWidth}px`
126
+ );
127
+ wrapper.style.setProperty(
128
+ "--popover-available-width",
129
+ `${availableWidth}px`
130
+ );
131
+ wrapper.style.setProperty(
132
+ "--popover-available-height",
133
+ `${availableHeight}px`
134
+ );
135
+ if (props.sameWidth) {
136
+ wrapper.style.width = `${referenceWidth}px`;
137
+ }
138
+ if (props.fitViewport) {
139
+ wrapper.style.maxWidth = `${availableWidth}px`;
140
+ wrapper.style.maxHeight = `${availableHeight}px`;
141
+ }
142
+ }
143
+ });
144
+ }
145
+ function getArrowMiddleware(arrowElement, props) {
146
+ if (!arrowElement)
147
+ return;
148
+ return _dom.arrow.call(void 0, {
149
+ element: arrowElement,
150
+ padding: props.arrowPadding
151
+ });
152
+ }
153
+ var usePopover = _7NAIPZYNcjs.createHook.call(void 0,
154
+ (_a) => {
155
+ var _b = _a, {
156
+ store,
157
+ modal = false,
158
+ portal = !!modal,
159
+ preserveTabOrder = true,
160
+ autoFocusOnShow = true,
161
+ wrapperProps,
162
+ fixed = false,
163
+ flip: flip2 = true,
164
+ shift: shift2 = 0,
165
+ slide = true,
166
+ overlap = false,
167
+ sameWidth = false,
168
+ fitViewport = false,
169
+ gutter,
170
+ arrowPadding = 4,
171
+ overflowPadding = 8,
172
+ getAnchorRect,
173
+ updatePosition
174
+ } = _b, props = _6455U47Tcjs.__objRest.call(void 0, _b, [
175
+ "store",
176
+ "modal",
177
+ "portal",
178
+ "preserveTabOrder",
179
+ "autoFocusOnShow",
180
+ "wrapperProps",
181
+ "fixed",
182
+ "flip",
183
+ "shift",
184
+ "slide",
185
+ "overlap",
186
+ "sameWidth",
187
+ "fitViewport",
188
+ "gutter",
189
+ "arrowPadding",
190
+ "overflowPadding",
191
+ "getAnchorRect",
192
+ "updatePosition"
193
+ ]);
194
+ const arrowElement = store.useState("arrowElement");
195
+ const anchorElement = store.useState("anchorElement");
196
+ const popoverElement = store.useState("popoverElement");
197
+ const contentElement = store.useState("contentElement");
198
+ const placement = store.useState("placement");
199
+ const mounted = store.useState("mounted");
200
+ const rendered = store.useState("rendered");
201
+ const [positioned, setPositioned] = _react.useState.call(void 0, false);
202
+ const { portalRef, domReady } = _NREUHWTUcjs.usePortalRef.call(void 0, portal, props.portalRef);
203
+ const getAnchorRectProp = _NREUHWTUcjs.useEvent.call(void 0, getAnchorRect);
204
+ const hasCustomUpdatePosition = !!updatePosition;
205
+ const updatePositionProp = _NREUHWTUcjs.useEvent.call(void 0, updatePosition);
206
+ _NREUHWTUcjs.useSafeLayoutEffect.call(void 0, () => {
207
+ if (!(popoverElement == null ? void 0 : popoverElement.isConnected))
208
+ return;
209
+ popoverElement.style.setProperty(
210
+ "--popover-overflow-padding",
211
+ `${overflowPadding}px`
212
+ );
213
+ const anchor = getAnchorElement(anchorElement, getAnchorRectProp);
214
+ const update = async () => {
215
+ if (!mounted)
216
+ return;
217
+ const middleware = [
218
+ getOffsetMiddleware(arrowElement, { gutter, shift: shift2 }),
219
+ getFlipMiddleware({ flip: flip2, overflowPadding }),
220
+ getShiftMiddleware({ slide, overlap, overflowPadding }),
221
+ getArrowMiddleware(arrowElement, { arrowPadding }),
222
+ getSizeMiddleware({
223
+ sameWidth,
224
+ fitViewport,
225
+ overflowPadding
226
+ })
227
+ ];
228
+ const pos = await _dom.computePosition.call(void 0, anchor, popoverElement, {
229
+ placement,
230
+ strategy: fixed ? "fixed" : "absolute",
231
+ middleware
232
+ });
233
+ store.setState("currentPlacement", pos.placement);
234
+ setPositioned(true);
235
+ const x = roundByDPR(pos.x);
236
+ const y = roundByDPR(pos.y);
237
+ Object.assign(popoverElement.style, {
238
+ top: "0",
239
+ left: "0",
240
+ transform: `translate3d(${x}px,${y}px,0)`
241
+ });
242
+ if (arrowElement && pos.middlewareData.arrow) {
243
+ const { x: arrowX, y: arrowY } = pos.middlewareData.arrow;
244
+ const dir = pos.placement.split("-")[0];
245
+ Object.assign(arrowElement.style, {
246
+ left: arrowX != null ? `${arrowX}px` : "",
247
+ top: arrowY != null ? `${arrowY}px` : "",
248
+ [dir]: "100%"
249
+ });
250
+ }
251
+ };
252
+ return _dom.autoUpdate.call(void 0,
253
+ anchor,
254
+ popoverElement,
255
+ () => {
256
+ if (hasCustomUpdatePosition) {
257
+ updatePositionProp({ updatePosition: update });
258
+ } else {
259
+ update();
260
+ }
261
+ },
262
+ {
263
+ // JSDOM doesn't support ResizeObserver
264
+ elementResize: typeof ResizeObserver === "function"
265
+ }
266
+ );
267
+ }, [
268
+ store,
269
+ rendered,
270
+ popoverElement,
271
+ arrowElement,
272
+ anchorElement,
273
+ popoverElement,
274
+ placement,
275
+ mounted,
276
+ domReady,
277
+ fixed,
278
+ flip2,
279
+ shift2,
280
+ slide,
281
+ overlap,
282
+ sameWidth,
283
+ fitViewport,
284
+ gutter,
285
+ arrowPadding,
286
+ overflowPadding,
287
+ getAnchorRectProp,
288
+ hasCustomUpdatePosition,
289
+ updatePositionProp
290
+ ]);
291
+ _NREUHWTUcjs.useSafeLayoutEffect.call(void 0, () => {
292
+ if (!mounted)
293
+ return;
294
+ if (!domReady)
295
+ return;
296
+ if (!(popoverElement == null ? void 0 : popoverElement.isConnected))
297
+ return;
298
+ if (!(contentElement == null ? void 0 : contentElement.isConnected))
299
+ return;
300
+ const applyZIndex = () => {
301
+ popoverElement.style.zIndex = getComputedStyle(contentElement).zIndex;
302
+ };
303
+ applyZIndex();
304
+ let raf = requestAnimationFrame(() => {
305
+ raf = requestAnimationFrame(applyZIndex);
306
+ });
307
+ return () => cancelAnimationFrame(raf);
308
+ }, [mounted, domReady, popoverElement, contentElement]);
309
+ const position = fixed ? "fixed" : "absolute";
310
+ props = _NREUHWTUcjs.useWrapElement.call(void 0,
311
+ props,
312
+ (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
313
+ "div",
314
+ _6455U47Tcjs.__spreadProps.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, {
315
+ role: "presentation"
316
+ }, wrapperProps), {
317
+ style: _6455U47Tcjs.__spreadValues.call(void 0, {
318
+ // https://floating-ui.com/docs/computeposition#initial-layout
319
+ position,
320
+ top: 0,
321
+ left: 0,
322
+ width: "max-content"
323
+ }, wrapperProps == null ? void 0 : wrapperProps.style),
324
+ ref: store.setPopoverElement,
325
+ children: element
326
+ })
327
+ ),
328
+ [store, position, wrapperProps]
329
+ );
330
+ props = _NREUHWTUcjs.useWrapElement.call(void 0,
331
+ props,
332
+ (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _W5PBA4D6cjs.PopoverContext.Provider, { value: store, children: element }),
333
+ [store]
334
+ );
335
+ props = _6455U47Tcjs.__spreadProps.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, {}, props), {
336
+ style: _6455U47Tcjs.__spreadValues.call(void 0, {
337
+ position: "relative"
338
+ }, props.style)
339
+ });
340
+ props = _GOXUG4RXcjs.useDialog.call(void 0, _6455U47Tcjs.__spreadProps.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, {
341
+ store,
342
+ modal,
343
+ preserveTabOrder,
344
+ portal,
345
+ autoFocusOnShow: positioned && autoFocusOnShow
346
+ }, props), {
347
+ portalRef
348
+ }));
349
+ return props;
350
+ }
351
+ );
352
+ var Popover = _7NAIPZYNcjs.createComponent.call(void 0, (props) => {
353
+ const htmlProps = usePopover(props);
354
+ return _7NAIPZYNcjs.createElement.call(void 0, "div", htmlProps);
355
+ });
356
+ if (process.env.NODE_ENV !== "production") {
357
+ Popover.displayName = "Popover";
358
+ }
359
+
360
+
361
+
362
+
363
+ exports.usePopover = usePopover; exports.Popover = Popover;
@@ -8,35 +8,16 @@ var _RD47UJK7cjs = require('./RD47UJK7.cjs');
8
8
  var _F7HVNVHQcjs = require('./F7HVNVHQ.cjs');
9
9
 
10
10
 
11
- var _NREUHWTUcjs = require('./NREUHWTU.cjs');
12
-
13
-
14
-
15
11
  var _6455U47Tcjs = require('./6455U47T.cjs');
16
12
 
17
13
  // src/popover/popover-store.ts
18
14
  var _popoverstore = require('@ariakit/core/popover/popover-store'); var Core = _interopRequireWildcard(_popoverstore);
19
15
  function usePopoverStoreOptions(props) {
20
- const getAnchorRect = _NREUHWTUcjs.useEvent.call(void 0, props.getAnchorRect);
21
- const renderCallback = _NREUHWTUcjs.useEvent.call(void 0, props.renderCallback);
22
- return _6455U47Tcjs.__spreadProps.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, {}, _RD47UJK7cjs.useDialogStoreOptions.call(void 0, props)), {
23
- getAnchorRect: props.getAnchorRect ? getAnchorRect : void 0,
24
- renderCallback: props.renderCallback ? renderCallback : void 0
25
- });
16
+ return _RD47UJK7cjs.useDialogStoreOptions.call(void 0, props);
26
17
  }
27
18
  function usePopoverStoreProps(store, props) {
28
19
  store = _RD47UJK7cjs.useDialogStoreProps.call(void 0, store, props);
29
20
  _F7HVNVHQcjs.useStoreProps.call(void 0, store, props, "placement");
30
- _F7HVNVHQcjs.useStoreProps.call(void 0, store, props, "fixed");
31
- _F7HVNVHQcjs.useStoreProps.call(void 0, store, props, "gutter");
32
- _F7HVNVHQcjs.useStoreProps.call(void 0, store, props, "flip");
33
- _F7HVNVHQcjs.useStoreProps.call(void 0, store, props, "shift");
34
- _F7HVNVHQcjs.useStoreProps.call(void 0, store, props, "slide");
35
- _F7HVNVHQcjs.useStoreProps.call(void 0, store, props, "overlap");
36
- _F7HVNVHQcjs.useStoreProps.call(void 0, store, props, "sameWidth");
37
- _F7HVNVHQcjs.useStoreProps.call(void 0, store, props, "fitViewport");
38
- _F7HVNVHQcjs.useStoreProps.call(void 0, store, props, "arrowPadding");
39
- _F7HVNVHQcjs.useStoreProps.call(void 0, store, props, "overflowPadding");
40
21
  return store;
41
22
  }
42
23
  function usePopoverStore(props = {}) {
@@ -62,10 +62,10 @@ var usePortal = _7NAIPZYNcjs.createHook.call(void 0,
62
62
  const refProp = _NREUHWTUcjs.useForkRef.call(void 0, ref, props.ref);
63
63
  const context = _react.useContext.call(void 0, _NS56XHXGcjs.PortalContext);
64
64
  const [portalNode, setPortalNode] = _react.useState.call(void 0, null);
65
- const beforeOutsideRef = _react.useRef.call(void 0, null);
66
- const beforeInsideRef = _react.useRef.call(void 0, null);
67
- const afterInsideRef = _react.useRef.call(void 0, null);
68
- const afterOutsideRef = _react.useRef.call(void 0, null);
65
+ const outerBeforeRef = _react.useRef.call(void 0, null);
66
+ const innerBeforeRef = _react.useRef.call(void 0, null);
67
+ const innerAfterRef = _react.useRef.call(void 0, null);
68
+ const outerAfterRef = _react.useRef.call(void 0, null);
69
69
  _NREUHWTUcjs.useSafeLayoutEffect.call(void 0, () => {
70
70
  const element = ref.current;
71
71
  if (!element || !portal) {
@@ -83,7 +83,7 @@ var usePortal = _7NAIPZYNcjs.createHook.call(void 0,
83
83
  rootElement.appendChild(portalEl);
84
84
  }
85
85
  if (!portalEl.id) {
86
- portalEl.id = element.id ? `${element.id}-portal` : getRandomId();
86
+ portalEl.id = element.id ? `portal/${element.id}` : getRandomId();
87
87
  }
88
88
  setPortalNode(portalEl);
89
89
  _2X5K3J7Ycjs.setRef.call(void 0, portalRef, portalEl);
@@ -142,12 +142,13 @@ var usePortal = _7NAIPZYNcjs.createHook.call(void 0,
142
142
  preserveTabOrder && portalNode && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
143
143
  _C7Y26CUVcjs.FocusTrap,
144
144
  {
145
- ref: beforeInsideRef,
145
+ ref: innerBeforeRef,
146
+ className: "__focus-trap-inner-before",
146
147
  onFocus: (event) => {
147
148
  if (_events.isFocusEventOutside.call(void 0, event, portalNode)) {
148
149
  queueFocus(_focus.getNextTabbable.call(void 0, ));
149
150
  } else {
150
- queueFocus(beforeOutsideRef.current);
151
+ queueFocus(outerBeforeRef.current);
151
152
  }
152
153
  }
153
154
  }
@@ -156,12 +157,13 @@ var usePortal = _7NAIPZYNcjs.createHook.call(void 0,
156
157
  preserveTabOrder && portalNode && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
157
158
  _C7Y26CUVcjs.FocusTrap,
158
159
  {
159
- ref: afterInsideRef,
160
+ ref: innerAfterRef,
161
+ className: "__focus-trap-inner-after",
160
162
  onFocus: (event) => {
161
163
  if (_events.isFocusEventOutside.call(void 0, event, portalNode)) {
162
164
  queueFocus(_focus.getPreviousTabbable.call(void 0, ));
163
165
  } else {
164
- queueFocus(afterOutsideRef.current);
166
+ queueFocus(outerAfterRef.current);
165
167
  }
166
168
  }
167
169
  }
@@ -174,10 +176,12 @@ var usePortal = _7NAIPZYNcjs.createHook.call(void 0,
174
176
  preserveTabOrder && portalNode && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
175
177
  _C7Y26CUVcjs.FocusTrap,
176
178
  {
177
- ref: beforeOutsideRef,
179
+ ref: outerBeforeRef,
180
+ className: "__focus-trap-outer-before",
178
181
  onFocus: (event) => {
179
- if (_events.isFocusEventOutside.call(void 0, event, portalNode)) {
180
- queueFocus(beforeInsideRef.current);
182
+ const fromOuter = event.relatedTarget === outerAfterRef.current;
183
+ if (!fromOuter && _events.isFocusEventOutside.call(void 0, event, portalNode)) {
184
+ queueFocus(innerBeforeRef.current);
181
185
  } else {
182
186
  queueFocus(_focus.getPreviousTabbable.call(void 0, ));
183
187
  }
@@ -191,12 +195,21 @@ var usePortal = _7NAIPZYNcjs.createHook.call(void 0,
191
195
  preserveTabOrder && portalNode && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
192
196
  _C7Y26CUVcjs.FocusTrap,
193
197
  {
194
- ref: afterOutsideRef,
198
+ ref: outerAfterRef,
199
+ className: "__focus-trap-outer-after",
195
200
  onFocus: (event) => {
196
201
  if (_events.isFocusEventOutside.call(void 0, event, portalNode)) {
197
- queueFocus(afterInsideRef.current);
202
+ queueFocus(innerAfterRef.current);
198
203
  } else {
199
- queueFocus(_focus.getNextTabbable.call(void 0, ));
204
+ const nextTabbable = _focus.getNextTabbable.call(void 0, );
205
+ if (nextTabbable === innerBeforeRef.current) {
206
+ requestAnimationFrame(() => {
207
+ var _a2;
208
+ return (_a2 = _focus.getNextTabbable.call(void 0, )) == null ? void 0 : _a2.focus();
209
+ });
210
+ return;
211
+ }
212
+ queueFocus(nextTabbable);
200
213
  }
201
214
  }
202
215
  }
@@ -12,9 +12,9 @@ require('../__chunks/DASOL6J2.cjs');
12
12
  require('../__chunks/3FTPSHLH.cjs');
13
13
  require('../__chunks/ZQAFJQIS.cjs');
14
14
  require('../__chunks/KLZID3QO.cjs');
15
+ require('../__chunks/NVMBKFRB.cjs');
15
16
  require('../__chunks/NVBNDB5B.cjs');
16
17
  require('../__chunks/LHHW5ZQP.cjs');
17
- require('../__chunks/NVMBKFRB.cjs');
18
18
 
19
19
 
20
20
 
@@ -4,9 +4,9 @@ var _OHRAT4C4cjs = require('../__chunks/OHRAT4C4.cjs');
4
4
  require('../__chunks/2WZVSPAI.cjs');
5
5
 
6
6
 
7
- var _JZRGYPLKcjs = require('../__chunks/JZRGYPLK.cjs');
8
- require('../__chunks/IRSBF3C5.cjs');
9
- require('../__chunks/OMM6PC3A.cjs');
7
+ var _MHL3EECXcjs = require('../__chunks/MHL3EECX.cjs');
8
+ require('../__chunks/GOXUG4RX.cjs');
9
+ require('../__chunks/D3EUPD6P.cjs');
10
10
  require('../__chunks/O45IXGJW.cjs');
11
11
  require('../__chunks/TVZPJJTX.cjs');
12
12
  require('../__chunks/QRAQT522.cjs');
@@ -20,15 +20,16 @@ require('../__chunks/GHWBKA6H.cjs');
20
20
  require('../__chunks/EE6OIU6X.cjs');
21
21
  require('../__chunks/X2GXTE3P.cjs');
22
22
  require('../__chunks/SOPRUU56.cjs');
23
+ require('../__chunks/WWDX5YPG.cjs');
24
+ require('../__chunks/C7Y26CUV.cjs');
25
+ require('../__chunks/NS56XHXG.cjs');
23
26
  require('../__chunks/CQSUIL2D.cjs');
24
27
  require('../__chunks/N2VCZZLP.cjs');
28
+ require('../__chunks/5P6HRGY6.cjs');
29
+ require('../__chunks/EM2PMFEW.cjs');
25
30
  require('../__chunks/W5PBA4D6.cjs');
26
31
  require('../__chunks/NVBNDB5B.cjs');
27
32
  require('../__chunks/LHHW5ZQP.cjs');
28
- require('../__chunks/PFD4TS6B.cjs');
29
- require('../__chunks/C7Y26CUV.cjs');
30
- require('../__chunks/NS56XHXG.cjs');
31
- require('../__chunks/EM2PMFEW.cjs');
32
33
  require('../__chunks/QTPUX3NM.cjs');
33
34
 
34
35
 
@@ -61,7 +62,7 @@ var useComboboxPopover = _7NAIPZYNcjs.createHook.call(void 0,
61
62
  var _b = _a, { store, tabIndex, hideOnInteractOutside = true } = _b, props = _6455U47Tcjs.__objRest.call(void 0, _b, ["store", "tabIndex", "hideOnInteractOutside"]);
62
63
  const baseElement = store.useState("baseElement");
63
64
  props = _OHRAT4C4cjs.useComboboxList.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, { store }, props));
64
- props = _JZRGYPLKcjs.usePopover.call(void 0, _6455U47Tcjs.__spreadProps.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, {
65
+ props = _MHL3EECXcjs.usePopover.call(void 0, _6455U47Tcjs.__spreadProps.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, {
65
66
  store,
66
67
  autoFocusOnShow: false,
67
68
  autoFocusOnHide: false,
@@ -6,7 +6,7 @@ require('../__chunks/KZLZWIJN.cjs');
6
6
 
7
7
 
8
8
 
9
- var _AUDANYMJcjs = require('../__chunks/AUDANYMJ.cjs');
9
+ var _W2XKIB23cjs = require('../__chunks/W2XKIB23.cjs');
10
10
  require('../__chunks/RD47UJK7.cjs');
11
11
  require('../__chunks/P7TWEJ6I.cjs');
12
12
 
@@ -22,11 +22,11 @@ var _6455U47Tcjs = require('../__chunks/6455U47T.cjs');
22
22
  // src/combobox/combobox-store.ts
23
23
  var _comboboxstore = require('@ariakit/core/combobox/combobox-store'); var Core = _interopRequireWildcard(_comboboxstore);
24
24
  function useComboboxStoreOptions(props) {
25
- return _6455U47Tcjs.__spreadValues.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, {}, _EXKBMUPCcjs.useCompositeStoreOptions.call(void 0, props)), _AUDANYMJcjs.usePopoverStoreOptions.call(void 0, props));
25
+ return _6455U47Tcjs.__spreadValues.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, {}, _EXKBMUPCcjs.useCompositeStoreOptions.call(void 0, props)), _W2XKIB23cjs.usePopoverStoreOptions.call(void 0, props));
26
26
  }
27
27
  function useComboboxStoreProps(store, props) {
28
28
  store = _EXKBMUPCcjs.useCompositeStoreProps.call(void 0, store, props);
29
- store = _AUDANYMJcjs.usePopoverStoreProps.call(void 0, store, props);
29
+ store = _W2XKIB23cjs.usePopoverStoreProps.call(void 0, store, props);
30
30
  _F7HVNVHQcjs.useStoreProps.call(void 0, store, props, "value", "setValue");
31
31
  return store;
32
32
  }
@@ -3,13 +3,6 @@ import type { CompositeStoreFunctions, CompositeStoreOptions, CompositeStoreStat
3
3
  import type { PopoverStoreFunctions, PopoverStoreOptions, PopoverStoreState } from "../popover/popover-store.js";
4
4
  import type { Store } from "../utils/store.js";
5
5
  export declare function useComboboxStoreOptions(props: ComboboxStoreProps): {
6
- getAnchorRect: ((anchor: HTMLElement | null) => {
7
- x?: number | undefined;
8
- y?: number | undefined;
9
- width?: number | undefined;
10
- height?: number | undefined;
11
- } | null) | undefined;
12
- renderCallback: ((props: import("@ariakit/core/popover/popover-store").PopoverStoreRenderCallbackProps) => void | (() => void)) | undefined;
13
6
  setOpen?: ((open: boolean) => void) | undefined;
14
7
  defaultOpen?: boolean | undefined;
15
8
  open?: boolean | undefined;
@@ -3,11 +3,11 @@
3
3
  var _CCVWD45Ycjs = require('../__chunks/CCVWD45Y.cjs');
4
4
 
5
5
 
6
- var _5I6IQHKQcjs = require('../__chunks/5I6IQHKQ.cjs');
6
+ var _BIPONQXEcjs = require('../__chunks/BIPONQXE.cjs');
7
7
  require('../__chunks/KLZID3QO.cjs');
8
+ require('../__chunks/NVMBKFRB.cjs');
8
9
  require('../__chunks/NVBNDB5B.cjs');
9
10
  require('../__chunks/LHHW5ZQP.cjs');
10
- require('../__chunks/NVMBKFRB.cjs');
11
11
 
12
12
 
13
13
 
@@ -323,7 +323,7 @@ var useCombobox = _7NAIPZYNcjs.createHook.call(void 0,
323
323
  onBlur
324
324
  });
325
325
  const moveOnKeyPressProp = _NREUHWTUcjs.useBooleanEvent.call(void 0, moveOnKeyPress);
326
- props = _5I6IQHKQcjs.useComposite.call(void 0, _6455U47Tcjs.__spreadProps.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, {
326
+ props = _BIPONQXEcjs.useComposite.call(void 0, _6455U47Tcjs.__spreadProps.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, {
327
327
  store,
328
328
  focusable
329
329
  }, props), {
@@ -6,9 +6,9 @@ require('../__chunks/DASOL6J2.cjs');
6
6
  require('../__chunks/3FTPSHLH.cjs');
7
7
  require('../__chunks/ZQAFJQIS.cjs');
8
8
  require('../__chunks/KLZID3QO.cjs');
9
+ require('../__chunks/NVMBKFRB.cjs');
9
10
  require('../__chunks/NVBNDB5B.cjs');
10
11
  require('../__chunks/LHHW5ZQP.cjs');
11
- require('../__chunks/NVMBKFRB.cjs');
12
12
  require('../__chunks/7NAIPZYN.cjs');
13
13
  require('../__chunks/F7HVNVHQ.cjs');
14
14
  require('../__chunks/NREUHWTU.cjs');
@@ -1,11 +1,10 @@
1
1
  "use strict";Object.defineProperty(exports, "__esModule", {value: true});
2
2
 
3
- var _OV363CW6cjs = require('../__chunks/OV363CW6.cjs');
3
+ var _BDJYHP43cjs = require('../__chunks/BDJYHP43.cjs');
4
4
  require('../__chunks/WUH43WQ5.cjs');
5
5
  require('../__chunks/GE4P5OCB.cjs');
6
- require('../__chunks/2DVMVYK2.cjs');
7
- require('../__chunks/W5PBA4D6.cjs');
8
6
  require('../__chunks/CCVWD45Y.cjs');
7
+ require('../__chunks/2DVMVYK2.cjs');
9
8
 
10
9
 
11
10
  var _LIP53P4Icjs = require('../__chunks/LIP53P4I.cjs');
@@ -13,9 +12,10 @@ require('../__chunks/DASOL6J2.cjs');
13
12
  require('../__chunks/3FTPSHLH.cjs');
14
13
  require('../__chunks/ZQAFJQIS.cjs');
15
14
  require('../__chunks/KLZID3QO.cjs');
15
+ require('../__chunks/NVMBKFRB.cjs');
16
+ require('../__chunks/W5PBA4D6.cjs');
16
17
  require('../__chunks/NVBNDB5B.cjs');
17
18
  require('../__chunks/LHHW5ZQP.cjs');
18
- require('../__chunks/NVMBKFRB.cjs');
19
19
 
20
20
 
21
21
 
@@ -66,7 +66,7 @@ var useCompositeOverflowDisclosure = _7NAIPZYNcjs.createHook.call(void 0, (_a) =
66
66
  onBlur
67
67
  });
68
68
  props = _LIP53P4Icjs.useCompositeItem.call(void 0, _6455U47Tcjs.__spreadProps.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, {}, props), { shouldRegisterItem }));
69
- props = _OV363CW6cjs.usePopoverDisclosure.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, { store }, props));
69
+ props = _BDJYHP43cjs.usePopoverDisclosure.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, { store }, props));
70
70
  return props;
71
71
  });
72
72
  var CompositeOverflowDisclosure = _7NAIPZYNcjs.createComponent.call(void 0, (props) => {