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