@radix-ui/react-popover 1.0.8-rc.9 → 1.1.0-rc.2
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.
- package/dist/index.d.mts +49 -37
- package/dist/index.d.ts +49 -37
- package/dist/index.js +316 -326
- package/dist/index.js.map +7 -1
- package/dist/index.mjs +288 -291
- package/dist/index.mjs.map +7 -1
- package/package.json +14 -15
- package/dist/index.d.ts.map +0 -1
package/dist/index.mjs
CHANGED
|
@@ -1,321 +1,318 @@
|
|
|
1
|
-
|
|
2
|
-
import {useRef as $am6gm$useRef, useState as $am6gm$useState, createElement as $am6gm$createElement, useCallback as $am6gm$useCallback, forwardRef as $am6gm$forwardRef, useEffect as $am6gm$useEffect} from "react";
|
|
3
|
-
import {composeEventHandlers as $am6gm$composeEventHandlers} from "@radix-ui/primitive";
|
|
4
|
-
import {useComposedRefs as $am6gm$useComposedRefs} from "@radix-ui/react-compose-refs";
|
|
5
|
-
import {createContextScope as $am6gm$createContextScope} from "@radix-ui/react-context";
|
|
6
|
-
import {DismissableLayer as $am6gm$DismissableLayer} from "@radix-ui/react-dismissable-layer";
|
|
7
|
-
import {useFocusGuards as $am6gm$useFocusGuards} from "@radix-ui/react-focus-guards";
|
|
8
|
-
import {FocusScope as $am6gm$FocusScope} from "@radix-ui/react-focus-scope";
|
|
9
|
-
import {useId as $am6gm$useId} from "@radix-ui/react-id";
|
|
10
|
-
import {createPopperScope as $am6gm$createPopperScope, Root as $am6gm$Root, Anchor as $am6gm$Anchor, Content as $am6gm$Content, Arrow as $am6gm$Arrow} from "@radix-ui/react-popper";
|
|
11
|
-
import {Portal as $am6gm$Portal} from "@radix-ui/react-portal";
|
|
12
|
-
import {Presence as $am6gm$Presence} from "@radix-ui/react-presence";
|
|
13
|
-
import {Primitive as $am6gm$Primitive} from "@radix-ui/react-primitive";
|
|
14
|
-
import {Slot as $am6gm$Slot} from "@radix-ui/react-slot";
|
|
15
|
-
import {useControllableState as $am6gm$useControllableState} from "@radix-ui/react-use-controllable-state";
|
|
16
|
-
import {hideOthers as $am6gm$hideOthers} from "aria-hidden";
|
|
17
|
-
import {RemoveScroll as $am6gm$RemoveScroll} from "react-remove-scroll";
|
|
1
|
+
"use client";
|
|
18
2
|
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
$am6gm$createPopperScope
|
|
3
|
+
// packages/react/popover/src/Popover.tsx
|
|
4
|
+
import * as React from "react";
|
|
5
|
+
import { composeEventHandlers } from "@radix-ui/primitive";
|
|
6
|
+
import { useComposedRefs } from "@radix-ui/react-compose-refs";
|
|
7
|
+
import { createContextScope } from "@radix-ui/react-context";
|
|
8
|
+
import { DismissableLayer } from "@radix-ui/react-dismissable-layer";
|
|
9
|
+
import { useFocusGuards } from "@radix-ui/react-focus-guards";
|
|
10
|
+
import { FocusScope } from "@radix-ui/react-focus-scope";
|
|
11
|
+
import { useId } from "@radix-ui/react-id";
|
|
12
|
+
import * as PopperPrimitive from "@radix-ui/react-popper";
|
|
13
|
+
import { createPopperScope } from "@radix-ui/react-popper";
|
|
14
|
+
import { Portal as PortalPrimitive } from "@radix-ui/react-portal";
|
|
15
|
+
import { Presence } from "@radix-ui/react-presence";
|
|
16
|
+
import { Primitive } from "@radix-ui/react-primitive";
|
|
17
|
+
import { Slot } from "@radix-ui/react-slot";
|
|
18
|
+
import { useControllableState } from "@radix-ui/react-use-controllable-state";
|
|
19
|
+
import { hideOthers } from "aria-hidden";
|
|
20
|
+
import { RemoveScroll } from "react-remove-scroll";
|
|
21
|
+
import { jsx } from "react/jsx-runtime";
|
|
22
|
+
var POPOVER_NAME = "Popover";
|
|
23
|
+
var [createPopoverContext, createPopoverScope] = createContextScope(POPOVER_NAME, [
|
|
24
|
+
createPopperScope
|
|
42
25
|
]);
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
26
|
+
var usePopperScope = createPopperScope();
|
|
27
|
+
var [PopoverProvider, usePopoverContext] = createPopoverContext(POPOVER_NAME);
|
|
28
|
+
var Popover = (props) => {
|
|
29
|
+
const {
|
|
30
|
+
__scopePopover,
|
|
31
|
+
children,
|
|
32
|
+
open: openProp,
|
|
33
|
+
defaultOpen,
|
|
34
|
+
onOpenChange,
|
|
35
|
+
modal = false
|
|
36
|
+
} = props;
|
|
37
|
+
const popperScope = usePopperScope(__scopePopover);
|
|
38
|
+
const triggerRef = React.useRef(null);
|
|
39
|
+
const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false);
|
|
40
|
+
const [open = false, setOpen] = useControllableState({
|
|
41
|
+
prop: openProp,
|
|
42
|
+
defaultProp: defaultOpen,
|
|
43
|
+
onChange: onOpenChange
|
|
44
|
+
});
|
|
45
|
+
return /* @__PURE__ */ jsx(PopperPrimitive.Root, { ...popperScope, children: /* @__PURE__ */ jsx(
|
|
46
|
+
PopoverProvider,
|
|
47
|
+
{
|
|
48
|
+
scope: __scopePopover,
|
|
49
|
+
contentId: useId(),
|
|
50
|
+
triggerRef,
|
|
51
|
+
open,
|
|
52
|
+
onOpenChange: setOpen,
|
|
53
|
+
onOpenToggle: React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen]),
|
|
54
|
+
hasCustomAnchor,
|
|
55
|
+
onCustomAnchorAdd: React.useCallback(() => setHasCustomAnchor(true), []),
|
|
56
|
+
onCustomAnchorRemove: React.useCallback(() => setHasCustomAnchor(false), []),
|
|
57
|
+
modal,
|
|
58
|
+
children
|
|
59
|
+
}
|
|
60
|
+
) });
|
|
73
61
|
};
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
const
|
|
81
|
-
const {
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
/* -------------------------------------------------------------------------------------------------
|
|
101
|
-
* PopoverTrigger
|
|
102
|
-
* -----------------------------------------------------------------------------------------------*/ const $cb5cc270b50c6fcd$var$TRIGGER_NAME = 'PopoverTrigger';
|
|
103
|
-
const $cb5cc270b50c6fcd$export$7dacb05d26466c3 = /*#__PURE__*/ $am6gm$forwardRef((props, forwardedRef)=>{
|
|
104
|
-
const { __scopePopover: __scopePopover , ...triggerProps } = props;
|
|
105
|
-
const context = $cb5cc270b50c6fcd$var$usePopoverContext($cb5cc270b50c6fcd$var$TRIGGER_NAME, __scopePopover);
|
|
106
|
-
const popperScope = $cb5cc270b50c6fcd$var$usePopperScope(__scopePopover);
|
|
107
|
-
const composedTriggerRef = $am6gm$useComposedRefs(forwardedRef, context.triggerRef);
|
|
108
|
-
const trigger = /*#__PURE__*/ $am6gm$createElement($am6gm$Primitive.button, $am6gm$babelruntimehelpersesmextends({
|
|
62
|
+
Popover.displayName = POPOVER_NAME;
|
|
63
|
+
var ANCHOR_NAME = "PopoverAnchor";
|
|
64
|
+
var PopoverAnchor = React.forwardRef(
|
|
65
|
+
(props, forwardedRef) => {
|
|
66
|
+
const { __scopePopover, ...anchorProps } = props;
|
|
67
|
+
const context = usePopoverContext(ANCHOR_NAME, __scopePopover);
|
|
68
|
+
const popperScope = usePopperScope(__scopePopover);
|
|
69
|
+
const { onCustomAnchorAdd, onCustomAnchorRemove } = context;
|
|
70
|
+
React.useEffect(() => {
|
|
71
|
+
onCustomAnchorAdd();
|
|
72
|
+
return () => onCustomAnchorRemove();
|
|
73
|
+
}, [onCustomAnchorAdd, onCustomAnchorRemove]);
|
|
74
|
+
return /* @__PURE__ */ jsx(PopperPrimitive.Anchor, { ...popperScope, ...anchorProps, ref: forwardedRef });
|
|
75
|
+
}
|
|
76
|
+
);
|
|
77
|
+
PopoverAnchor.displayName = ANCHOR_NAME;
|
|
78
|
+
var TRIGGER_NAME = "PopoverTrigger";
|
|
79
|
+
var PopoverTrigger = React.forwardRef(
|
|
80
|
+
(props, forwardedRef) => {
|
|
81
|
+
const { __scopePopover, ...triggerProps } = props;
|
|
82
|
+
const context = usePopoverContext(TRIGGER_NAME, __scopePopover);
|
|
83
|
+
const popperScope = usePopperScope(__scopePopover);
|
|
84
|
+
const composedTriggerRef = useComposedRefs(forwardedRef, context.triggerRef);
|
|
85
|
+
const trigger = /* @__PURE__ */ jsx(
|
|
86
|
+
Primitive.button,
|
|
87
|
+
{
|
|
109
88
|
type: "button",
|
|
110
89
|
"aria-haspopup": "dialog",
|
|
111
90
|
"aria-expanded": context.open,
|
|
112
91
|
"aria-controls": context.contentId,
|
|
113
|
-
"data-state":
|
|
114
|
-
|
|
92
|
+
"data-state": getState(context.open),
|
|
93
|
+
...triggerProps,
|
|
115
94
|
ref: composedTriggerRef,
|
|
116
|
-
onClick:
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
* PopoverPortal
|
|
127
|
-
* -----------------------------------------------------------------------------------------------*/ const $cb5cc270b50c6fcd$var$PORTAL_NAME = 'PopoverPortal';
|
|
128
|
-
const [$cb5cc270b50c6fcd$var$PortalProvider, $cb5cc270b50c6fcd$var$usePortalContext] = $cb5cc270b50c6fcd$var$createPopoverContext($cb5cc270b50c6fcd$var$PORTAL_NAME, {
|
|
129
|
-
forceMount: undefined
|
|
95
|
+
onClick: composeEventHandlers(props.onClick, context.onOpenToggle)
|
|
96
|
+
}
|
|
97
|
+
);
|
|
98
|
+
return context.hasCustomAnchor ? trigger : /* @__PURE__ */ jsx(PopperPrimitive.Anchor, { asChild: true, ...popperScope, children: trigger });
|
|
99
|
+
}
|
|
100
|
+
);
|
|
101
|
+
PopoverTrigger.displayName = TRIGGER_NAME;
|
|
102
|
+
var PORTAL_NAME = "PopoverPortal";
|
|
103
|
+
var [PortalProvider, usePortalContext] = createPopoverContext(PORTAL_NAME, {
|
|
104
|
+
forceMount: void 0
|
|
130
105
|
});
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
scope: __scopePopover,
|
|
136
|
-
forceMount: forceMount
|
|
137
|
-
}, /*#__PURE__*/ $am6gm$createElement($am6gm$Presence, {
|
|
138
|
-
present: forceMount || context.open
|
|
139
|
-
}, /*#__PURE__*/ $am6gm$createElement($am6gm$Portal, {
|
|
140
|
-
asChild: true,
|
|
141
|
-
container: container
|
|
142
|
-
}, children)));
|
|
106
|
+
var PopoverPortal = (props) => {
|
|
107
|
+
const { __scopePopover, forceMount, children, container } = props;
|
|
108
|
+
const context = usePopoverContext(PORTAL_NAME, __scopePopover);
|
|
109
|
+
return /* @__PURE__ */ jsx(PortalProvider, { scope: __scopePopover, forceMount, children: /* @__PURE__ */ jsx(Presence, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(PortalPrimitive, { asChild: true, container, children }) }) });
|
|
143
110
|
};
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
const
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
});
|
|
165
|
-
/* -----------------------------------------------------------------------------------------------*/ const $cb5cc270b50c6fcd$var$PopoverContentModal = /*#__PURE__*/ $am6gm$forwardRef((props, forwardedRef)=>{
|
|
166
|
-
const context = $cb5cc270b50c6fcd$var$usePopoverContext($cb5cc270b50c6fcd$var$CONTENT_NAME, props.__scopePopover);
|
|
167
|
-
const contentRef = $am6gm$useRef(null);
|
|
168
|
-
const composedRefs = $am6gm$useComposedRefs(forwardedRef, contentRef);
|
|
169
|
-
const isRightClickOutsideRef = $am6gm$useRef(false); // aria-hide everything except the content (better supported equivalent to setting aria-modal)
|
|
170
|
-
$am6gm$useEffect(()=>{
|
|
171
|
-
const content = contentRef.current;
|
|
172
|
-
if (content) return $am6gm$hideOthers(content);
|
|
111
|
+
PopoverPortal.displayName = PORTAL_NAME;
|
|
112
|
+
var CONTENT_NAME = "PopoverContent";
|
|
113
|
+
var PopoverContent = React.forwardRef(
|
|
114
|
+
(props, forwardedRef) => {
|
|
115
|
+
const portalContext = usePortalContext(CONTENT_NAME, props.__scopePopover);
|
|
116
|
+
const { forceMount = portalContext.forceMount, ...contentProps } = props;
|
|
117
|
+
const context = usePopoverContext(CONTENT_NAME, props.__scopePopover);
|
|
118
|
+
return /* @__PURE__ */ jsx(Presence, { present: forceMount || context.open, children: context.modal ? /* @__PURE__ */ jsx(PopoverContentModal, { ...contentProps, ref: forwardedRef }) : /* @__PURE__ */ jsx(PopoverContentNonModal, { ...contentProps, ref: forwardedRef }) });
|
|
119
|
+
}
|
|
120
|
+
);
|
|
121
|
+
PopoverContent.displayName = CONTENT_NAME;
|
|
122
|
+
var PopoverContentModal = React.forwardRef(
|
|
123
|
+
(props, forwardedRef) => {
|
|
124
|
+
const context = usePopoverContext(CONTENT_NAME, props.__scopePopover);
|
|
125
|
+
const contentRef = React.useRef(null);
|
|
126
|
+
const composedRefs = useComposedRefs(forwardedRef, contentRef);
|
|
127
|
+
const isRightClickOutsideRef = React.useRef(false);
|
|
128
|
+
React.useEffect(() => {
|
|
129
|
+
const content = contentRef.current;
|
|
130
|
+
if (content) return hideOthers(content);
|
|
173
131
|
}, []);
|
|
174
|
-
return
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
ref: composedRefs
|
|
179
|
-
,
|
|
132
|
+
return /* @__PURE__ */ jsx(RemoveScroll, { as: Slot, allowPinchZoom: true, children: /* @__PURE__ */ jsx(
|
|
133
|
+
PopoverContentImpl,
|
|
134
|
+
{
|
|
135
|
+
...props,
|
|
136
|
+
ref: composedRefs,
|
|
180
137
|
trapFocus: context.open,
|
|
181
138
|
disableOutsidePointerEvents: true,
|
|
182
|
-
onCloseAutoFocus:
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
if (!isRightClickOutsideRef.current) (_context$triggerRef$c = context.triggerRef.current) === null || _context$triggerRef$c === void 0 || _context$triggerRef$c.focus();
|
|
139
|
+
onCloseAutoFocus: composeEventHandlers(props.onCloseAutoFocus, (event) => {
|
|
140
|
+
event.preventDefault();
|
|
141
|
+
if (!isRightClickOutsideRef.current) context.triggerRef.current?.focus();
|
|
186
142
|
}),
|
|
187
|
-
onPointerDownOutside:
|
|
143
|
+
onPointerDownOutside: composeEventHandlers(
|
|
144
|
+
props.onPointerDownOutside,
|
|
145
|
+
(event) => {
|
|
188
146
|
const originalEvent = event.detail.originalEvent;
|
|
189
147
|
const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true;
|
|
190
148
|
const isRightClick = originalEvent.button === 2 || ctrlLeftClick;
|
|
191
149
|
isRightClickOutsideRef.current = isRightClick;
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
});
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
150
|
+
},
|
|
151
|
+
{ checkForDefaultPrevented: false }
|
|
152
|
+
),
|
|
153
|
+
onFocusOutside: composeEventHandlers(
|
|
154
|
+
props.onFocusOutside,
|
|
155
|
+
(event) => event.preventDefault(),
|
|
156
|
+
{ checkForDefaultPrevented: false }
|
|
157
|
+
)
|
|
158
|
+
}
|
|
159
|
+
) });
|
|
160
|
+
}
|
|
161
|
+
);
|
|
162
|
+
var PopoverContentNonModal = React.forwardRef(
|
|
163
|
+
(props, forwardedRef) => {
|
|
164
|
+
const context = usePopoverContext(CONTENT_NAME, props.__scopePopover);
|
|
165
|
+
const hasInteractedOutsideRef = React.useRef(false);
|
|
166
|
+
const hasPointerDownOutsideRef = React.useRef(false);
|
|
167
|
+
return /* @__PURE__ */ jsx(
|
|
168
|
+
PopoverContentImpl,
|
|
169
|
+
{
|
|
170
|
+
...props,
|
|
207
171
|
ref: forwardedRef,
|
|
208
172
|
trapFocus: false,
|
|
209
173
|
disableOutsidePointerEvents: false,
|
|
210
|
-
onCloseAutoFocus: (event)=>{
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
if (!
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
hasInteractedOutsideRef.current = false;
|
|
219
|
-
hasPointerDownOutsideRef.current = false;
|
|
174
|
+
onCloseAutoFocus: (event) => {
|
|
175
|
+
props.onCloseAutoFocus?.(event);
|
|
176
|
+
if (!event.defaultPrevented) {
|
|
177
|
+
if (!hasInteractedOutsideRef.current) context.triggerRef.current?.focus();
|
|
178
|
+
event.preventDefault();
|
|
179
|
+
}
|
|
180
|
+
hasInteractedOutsideRef.current = false;
|
|
181
|
+
hasPointerDownOutsideRef.current = false;
|
|
220
182
|
},
|
|
221
|
-
onInteractOutside: (event)=>{
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
}
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
// already had a pointer down outside event.
|
|
236
|
-
if (event.detail.originalEvent.type === 'focusin' && hasPointerDownOutsideRef.current) event.preventDefault();
|
|
183
|
+
onInteractOutside: (event) => {
|
|
184
|
+
props.onInteractOutside?.(event);
|
|
185
|
+
if (!event.defaultPrevented) {
|
|
186
|
+
hasInteractedOutsideRef.current = true;
|
|
187
|
+
if (event.detail.originalEvent.type === "pointerdown") {
|
|
188
|
+
hasPointerDownOutsideRef.current = true;
|
|
189
|
+
}
|
|
190
|
+
}
|
|
191
|
+
const target = event.target;
|
|
192
|
+
const targetIsTrigger = context.triggerRef.current?.contains(target);
|
|
193
|
+
if (targetIsTrigger) event.preventDefault();
|
|
194
|
+
if (event.detail.originalEvent.type === "focusin" && hasPointerDownOutsideRef.current) {
|
|
195
|
+
event.preventDefault();
|
|
196
|
+
}
|
|
237
197
|
}
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
198
|
+
}
|
|
199
|
+
);
|
|
200
|
+
}
|
|
201
|
+
);
|
|
202
|
+
var PopoverContentImpl = React.forwardRef(
|
|
203
|
+
(props, forwardedRef) => {
|
|
204
|
+
const {
|
|
205
|
+
__scopePopover,
|
|
206
|
+
trapFocus,
|
|
207
|
+
onOpenAutoFocus,
|
|
208
|
+
onCloseAutoFocus,
|
|
209
|
+
disableOutsidePointerEvents,
|
|
210
|
+
onEscapeKeyDown,
|
|
211
|
+
onPointerDownOutside,
|
|
212
|
+
onFocusOutside,
|
|
213
|
+
onInteractOutside,
|
|
214
|
+
...contentProps
|
|
215
|
+
} = props;
|
|
216
|
+
const context = usePopoverContext(CONTENT_NAME, __scopePopover);
|
|
217
|
+
const popperScope = usePopperScope(__scopePopover);
|
|
218
|
+
useFocusGuards();
|
|
219
|
+
return /* @__PURE__ */ jsx(
|
|
220
|
+
FocusScope,
|
|
221
|
+
{
|
|
247
222
|
asChild: true,
|
|
248
223
|
loop: true,
|
|
249
224
|
trapped: trapFocus,
|
|
250
225
|
onMountAutoFocus: onOpenAutoFocus,
|
|
251
|
-
onUnmountAutoFocus: onCloseAutoFocus
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
ref: forwardedRef,
|
|
286
|
-
onClick: $am6gm$composeEventHandlers(props.onClick, ()=>context.onOpenChange(false)
|
|
226
|
+
onUnmountAutoFocus: onCloseAutoFocus,
|
|
227
|
+
children: /* @__PURE__ */ jsx(
|
|
228
|
+
DismissableLayer,
|
|
229
|
+
{
|
|
230
|
+
asChild: true,
|
|
231
|
+
disableOutsidePointerEvents,
|
|
232
|
+
onInteractOutside,
|
|
233
|
+
onEscapeKeyDown,
|
|
234
|
+
onPointerDownOutside,
|
|
235
|
+
onFocusOutside,
|
|
236
|
+
onDismiss: () => context.onOpenChange(false),
|
|
237
|
+
children: /* @__PURE__ */ jsx(
|
|
238
|
+
PopperPrimitive.Content,
|
|
239
|
+
{
|
|
240
|
+
"data-state": getState(context.open),
|
|
241
|
+
role: "dialog",
|
|
242
|
+
id: context.contentId,
|
|
243
|
+
...popperScope,
|
|
244
|
+
...contentProps,
|
|
245
|
+
ref: forwardedRef,
|
|
246
|
+
style: {
|
|
247
|
+
...contentProps.style,
|
|
248
|
+
// re-namespace exposed content custom properties
|
|
249
|
+
...{
|
|
250
|
+
"--radix-popover-content-transform-origin": "var(--radix-popper-transform-origin)",
|
|
251
|
+
"--radix-popover-content-available-width": "var(--radix-popper-available-width)",
|
|
252
|
+
"--radix-popover-content-available-height": "var(--radix-popper-available-height)",
|
|
253
|
+
"--radix-popover-trigger-width": "var(--radix-popper-anchor-width)",
|
|
254
|
+
"--radix-popover-trigger-height": "var(--radix-popper-anchor-height)"
|
|
255
|
+
}
|
|
256
|
+
}
|
|
257
|
+
}
|
|
258
|
+
)
|
|
259
|
+
}
|
|
287
260
|
)
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
const
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
261
|
+
}
|
|
262
|
+
);
|
|
263
|
+
}
|
|
264
|
+
);
|
|
265
|
+
var CLOSE_NAME = "PopoverClose";
|
|
266
|
+
var PopoverClose = React.forwardRef(
|
|
267
|
+
(props, forwardedRef) => {
|
|
268
|
+
const { __scopePopover, ...closeProps } = props;
|
|
269
|
+
const context = usePopoverContext(CLOSE_NAME, __scopePopover);
|
|
270
|
+
return /* @__PURE__ */ jsx(
|
|
271
|
+
Primitive.button,
|
|
272
|
+
{
|
|
273
|
+
type: "button",
|
|
274
|
+
...closeProps,
|
|
275
|
+
ref: forwardedRef,
|
|
276
|
+
onClick: composeEventHandlers(props.onClick, () => context.onOpenChange(false))
|
|
277
|
+
}
|
|
278
|
+
);
|
|
279
|
+
}
|
|
280
|
+
);
|
|
281
|
+
PopoverClose.displayName = CLOSE_NAME;
|
|
282
|
+
var ARROW_NAME = "PopoverArrow";
|
|
283
|
+
var PopoverArrow = React.forwardRef(
|
|
284
|
+
(props, forwardedRef) => {
|
|
285
|
+
const { __scopePopover, ...arrowProps } = props;
|
|
286
|
+
const popperScope = usePopperScope(__scopePopover);
|
|
287
|
+
return /* @__PURE__ */ jsx(PopperPrimitive.Arrow, { ...popperScope, ...arrowProps, ref: forwardedRef });
|
|
288
|
+
}
|
|
289
|
+
);
|
|
290
|
+
PopoverArrow.displayName = ARROW_NAME;
|
|
291
|
+
function getState(open) {
|
|
292
|
+
return open ? "open" : "closed";
|
|
308
293
|
}
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
294
|
+
var Root2 = Popover;
|
|
295
|
+
var Anchor2 = PopoverAnchor;
|
|
296
|
+
var Trigger = PopoverTrigger;
|
|
297
|
+
var Portal = PopoverPortal;
|
|
298
|
+
var Content2 = PopoverContent;
|
|
299
|
+
var Close = PopoverClose;
|
|
300
|
+
var Arrow2 = PopoverArrow;
|
|
301
|
+
export {
|
|
302
|
+
Anchor2 as Anchor,
|
|
303
|
+
Arrow2 as Arrow,
|
|
304
|
+
Close,
|
|
305
|
+
Content2 as Content,
|
|
306
|
+
Popover,
|
|
307
|
+
PopoverAnchor,
|
|
308
|
+
PopoverArrow,
|
|
309
|
+
PopoverClose,
|
|
310
|
+
PopoverContent,
|
|
311
|
+
PopoverPortal,
|
|
312
|
+
PopoverTrigger,
|
|
313
|
+
Portal,
|
|
314
|
+
Root2 as Root,
|
|
315
|
+
Trigger,
|
|
316
|
+
createPopoverScope
|
|
317
|
+
};
|
|
321
318
|
//# sourceMappingURL=index.mjs.map
|