frey-ui 1.2.0 → 1.2.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/README.md +1 -1
- package/dist/cjs/DropdownMenu/index.cjs +28 -55
- package/dist/cjs/DropdownMenu/index.cjs.map +1 -1
- package/dist/cjs/Popover/index.cjs +28 -51
- package/dist/cjs/Popover/index.cjs.map +1 -1
- package/dist/cjs/Tooltip/index.cjs +29 -34
- package/dist/cjs/Tooltip/index.cjs.map +1 -1
- package/dist/cjs/floating/FocusScope.cjs +195 -0
- package/dist/cjs/floating/FocusScope.cjs.map +1 -0
- package/dist/cjs/floating/autoUpdate.cjs +205 -0
- package/dist/cjs/floating/autoUpdate.cjs.map +1 -0
- package/dist/cjs/floating/dismissibleLayer.cjs +116 -0
- package/dist/cjs/floating/dismissibleLayer.cjs.map +1 -0
- package/dist/cjs/floating/geometry.cjs +160 -0
- package/dist/cjs/floating/geometry.cjs.map +1 -0
- package/dist/cjs/floating/platform.cjs +15 -0
- package/dist/cjs/floating/platform.cjs.map +1 -0
- package/dist/cjs/floating/pointerEvent.cjs +92 -0
- package/dist/cjs/floating/pointerEvent.cjs.map +1 -0
- package/dist/cjs/floating/tabbable.cjs +101 -0
- package/dist/cjs/floating/tabbable.cjs.map +1 -0
- package/dist/cjs/floating/useFloatingPosition.cjs +119 -0
- package/dist/cjs/floating/useFloatingPosition.cjs.map +1 -0
- package/dist/cjs/floating/useTooltipInteractions.cjs +136 -0
- package/dist/cjs/floating/useTooltipInteractions.cjs.map +1 -0
- package/dist/esm/DropdownMenu/index.mjs +29 -56
- package/dist/esm/DropdownMenu/index.mjs.map +1 -1
- package/dist/esm/Popover/index.mjs +29 -52
- package/dist/esm/Popover/index.mjs.map +1 -1
- package/dist/esm/Tooltip/index.mjs +29 -34
- package/dist/esm/Tooltip/index.mjs.map +1 -1
- package/dist/esm/floating/FocusScope.mjs +193 -0
- package/dist/esm/floating/FocusScope.mjs.map +1 -0
- package/dist/esm/floating/autoUpdate.mjs +202 -0
- package/dist/esm/floating/autoUpdate.mjs.map +1 -0
- package/dist/esm/floating/dismissibleLayer.mjs +114 -0
- package/dist/esm/floating/dismissibleLayer.mjs.map +1 -0
- package/dist/esm/floating/geometry.mjs +158 -0
- package/dist/esm/floating/geometry.mjs.map +1 -0
- package/dist/esm/floating/platform.mjs +12 -0
- package/dist/esm/floating/platform.mjs.map +1 -0
- package/dist/esm/floating/pointerEvent.mjs +89 -0
- package/dist/esm/floating/pointerEvent.mjs.map +1 -0
- package/dist/esm/floating/tabbable.mjs +99 -0
- package/dist/esm/floating/tabbable.mjs.map +1 -0
- package/dist/esm/floating/useFloatingPosition.mjs +117 -0
- package/dist/esm/floating/useFloatingPosition.mjs.map +1 -0
- package/dist/esm/floating/useTooltipInteractions.mjs +134 -0
- package/dist/esm/floating/useTooltipInteractions.mjs.map +1 -0
- package/dist/types/src/DropdownMenu/index.d.ts.map +1 -1
- package/dist/types/src/Popover/index.d.ts.map +1 -1
- package/dist/types/src/Tooltip/index.d.ts.map +1 -1
- package/dist/types/src/floating/FocusScope.d.ts +11 -0
- package/dist/types/src/floating/FocusScope.d.ts.map +1 -0
- package/dist/types/src/floating/autoUpdate.d.ts +5 -0
- package/dist/types/src/floating/autoUpdate.d.ts.map +1 -0
- package/dist/types/src/floating/dismissibleLayer.d.ts +12 -0
- package/dist/types/src/floating/dismissibleLayer.d.ts.map +1 -0
- package/dist/types/src/floating/geometry.d.ts +27 -0
- package/dist/types/src/floating/geometry.d.ts.map +1 -0
- package/dist/types/src/floating/platform.d.ts +3 -0
- package/dist/types/src/floating/platform.d.ts.map +1 -0
- package/dist/types/src/floating/pointerEvent.d.ts +3 -0
- package/dist/types/src/floating/pointerEvent.d.ts.map +1 -0
- package/dist/types/src/floating/tabbable.d.ts +2 -0
- package/dist/types/src/floating/tabbable.d.ts.map +1 -0
- package/dist/types/src/floating/useFloatingPosition.d.ts +18 -0
- package/dist/types/src/floating/useFloatingPosition.d.ts.map +1 -0
- package/dist/types/src/floating/useTooltipInteractions.d.ts +9 -0
- package/dist/types/src/floating/useTooltipInteractions.d.ts.map +1 -0
- package/package.json +1 -2
- package/dist/cjs/hooks/floatingConfig.cjs +0 -24
- package/dist/cjs/hooks/floatingConfig.cjs.map +0 -1
- package/dist/esm/hooks/floatingConfig.mjs +0 -20
- package/dist/esm/hooks/floatingConfig.mjs.map +0 -1
- package/dist/types/src/hooks/floatingConfig.d.ts +0 -6
- package/dist/types/src/hooks/floatingConfig.d.ts.map +0 -1
package/README.md
CHANGED
|
@@ -30,7 +30,7 @@ Browser E2E coverage is available via Playwright in `apps/playwright` for real-w
|
|
|
30
30
|
### Overlay Focus Management
|
|
31
31
|
|
|
32
32
|
- `Dialog` uses the native `<dialog>` element and modal behavior.
|
|
33
|
-
- `Popover` and `DropdownMenu` use
|
|
33
|
+
- `Popover` and `DropdownMenu` use Frey UI's private modal focus scope.
|
|
34
34
|
- When a `Popover` or `DropdownMenu` is open, keyboard focus is trapped inside the overlay and focus returns to the trigger when it closes.
|
|
35
35
|
|
|
36
36
|
## Installation
|
|
@@ -4,10 +4,11 @@
|
|
|
4
4
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
5
5
|
|
|
6
6
|
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
-
var react = require('@floating-ui/react');
|
|
8
7
|
var clsx = require('clsx');
|
|
9
8
|
var React = require('react');
|
|
10
|
-
var
|
|
9
|
+
var dismissibleLayer = require('../floating/dismissibleLayer.cjs');
|
|
10
|
+
var FocusScope = require('../floating/FocusScope.cjs');
|
|
11
|
+
var useFloatingPosition = require('../floating/useFloatingPosition.cjs');
|
|
11
12
|
var useControllableState = require('../hooks/useControllableState.cjs');
|
|
12
13
|
var useRovingCollection = require('../hooks/useRovingCollection.cjs');
|
|
13
14
|
var mergeRefs = require('../utils/mergeRefs.cjs');
|
|
@@ -26,75 +27,52 @@ function useDropdownMenuContext() {
|
|
|
26
27
|
const DropdownMenuRoot = function DropdownMenu({ open, defaultOpen = false, onOpenChange, placement = 'bottom', offset = 8, closeOnEscape = true, closeOnOutsideClick = true, children, }) {
|
|
27
28
|
const idPrefix = React.useId();
|
|
28
29
|
const menuItems = useRovingCollection.useRovingCollection();
|
|
29
|
-
const triggerRef = React.useRef(null);
|
|
30
|
-
const [referenceElement, setReferenceElement] = React.useState(null);
|
|
31
|
-
const [floatingElement, setFloatingElement] = React.useState(null);
|
|
32
30
|
const [currentOpen, handleOpenChange] = useControllableState.useControllableValue(open, defaultOpen, onOpenChange);
|
|
33
|
-
const
|
|
34
|
-
handleOpenChange(nextOpen);
|
|
35
|
-
if (!nextOpen && reason === 'escape-key') {
|
|
36
|
-
triggerRef.current?.focus();
|
|
37
|
-
}
|
|
38
|
-
}, [handleOpenChange]);
|
|
39
|
-
const floatingRootContext = react.useFloatingRootContext({
|
|
31
|
+
const { referenceRef: triggerRef, floatingRef, setReference, setFloating, floatingStyles, } = useFloatingPosition.useFloatingPosition({
|
|
40
32
|
open: currentOpen,
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
floating: floatingElement,
|
|
45
|
-
},
|
|
46
|
-
});
|
|
47
|
-
const { refs, floatingStyles, context: floatingContext, } = react.useFloating({
|
|
48
|
-
rootContext: floatingRootContext,
|
|
49
|
-
placement: floatingConfig.toFloatingPlacement(placement, 'start'),
|
|
50
|
-
middleware: floatingConfig.createFloatingMiddleware(offset),
|
|
51
|
-
strategy: 'fixed',
|
|
52
|
-
transform: false,
|
|
53
|
-
whileElementsMounted: react.autoUpdate,
|
|
33
|
+
side: placement,
|
|
34
|
+
alignment: 'start',
|
|
35
|
+
offset,
|
|
54
36
|
});
|
|
55
|
-
const
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
37
|
+
const handleDismiss = React.useCallback((reason) => {
|
|
38
|
+
handleOpenChange(false);
|
|
39
|
+
if (reason === 'escape')
|
|
40
|
+
triggerRef.current?.focus();
|
|
41
|
+
}, [handleOpenChange, triggerRef]);
|
|
42
|
+
dismissibleLayer.useDismissibleLayer({
|
|
43
|
+
open: currentOpen,
|
|
44
|
+
referenceRef: triggerRef,
|
|
45
|
+
floatingRef,
|
|
46
|
+
closeOnEscape,
|
|
47
|
+
closeOnOutsidePointerDown: closeOnOutsideClick,
|
|
48
|
+
onDismiss: handleDismiss,
|
|
59
49
|
});
|
|
60
|
-
const { getReferenceProps, getFloatingProps } = react.useInteractions([dismiss]);
|
|
61
|
-
const setReference = React.useCallback((node) => {
|
|
62
|
-
refs.setReference(node);
|
|
63
|
-
setReferenceElement(node);
|
|
64
|
-
}, [refs]);
|
|
65
|
-
const setFloating = React.useCallback((node) => {
|
|
66
|
-
refs.setFloating(node);
|
|
67
|
-
setFloatingElement(node);
|
|
68
|
-
}, [refs]);
|
|
69
50
|
const contextValue = React.useMemo(() => ({
|
|
70
51
|
open: currentOpen,
|
|
71
52
|
onOpenChange: handleOpenChange,
|
|
72
53
|
idPrefix,
|
|
73
54
|
triggerRef,
|
|
55
|
+
floatingRef,
|
|
74
56
|
setReference,
|
|
75
57
|
setFloating,
|
|
76
58
|
floatingStyles,
|
|
77
|
-
floatingContext,
|
|
78
|
-
getReferenceProps,
|
|
79
|
-
getFloatingProps,
|
|
80
59
|
menuItems,
|
|
81
60
|
}), [
|
|
82
61
|
currentOpen,
|
|
83
62
|
handleOpenChange,
|
|
84
63
|
idPrefix,
|
|
64
|
+
triggerRef,
|
|
65
|
+
floatingRef,
|
|
85
66
|
setReference,
|
|
86
67
|
setFloating,
|
|
87
68
|
floatingStyles,
|
|
88
|
-
floatingContext,
|
|
89
|
-
getReferenceProps,
|
|
90
|
-
getFloatingProps,
|
|
91
69
|
menuItems,
|
|
92
70
|
]);
|
|
93
71
|
return (jsxRuntime.jsx(DropdownMenuContext.Provider, { value: contextValue, children: children }));
|
|
94
72
|
};
|
|
95
73
|
DropdownMenuRoot.displayName = 'DropdownMenu';
|
|
96
74
|
const DropdownMenuTrigger = React.forwardRef(function DropdownMenuTrigger({ children, asChild = false, onClick, type, ...triggerProps }, ref) {
|
|
97
|
-
const { open, onOpenChange, idPrefix, triggerRef, setReference
|
|
75
|
+
const { open, onOpenChange, idPrefix, triggerRef, setReference } = useDropdownMenuContext();
|
|
98
76
|
const mergedRef = mergeRefs.mergeRefs(ref, triggerRef, setReference);
|
|
99
77
|
const handleClick = (event) => {
|
|
100
78
|
onClick?.(event);
|
|
@@ -102,13 +80,13 @@ const DropdownMenuTrigger = React.forwardRef(function DropdownMenuTrigger({ chil
|
|
|
102
80
|
onOpenChange(!open);
|
|
103
81
|
}
|
|
104
82
|
};
|
|
105
|
-
const referenceProps =
|
|
83
|
+
const referenceProps = {
|
|
106
84
|
...triggerProps,
|
|
107
85
|
onClick: handleClick,
|
|
108
86
|
'aria-haspopup': 'menu',
|
|
109
87
|
'aria-expanded': open,
|
|
110
88
|
'aria-controls': `${idPrefix}-menu`,
|
|
111
|
-
}
|
|
89
|
+
};
|
|
112
90
|
if (asChild) {
|
|
113
91
|
if (!React.isValidElement(children)) {
|
|
114
92
|
throw new Error('DropdownMenu.Trigger with asChild expects a single valid React element child.');
|
|
@@ -119,8 +97,7 @@ const DropdownMenuTrigger = React.forwardRef(function DropdownMenuTrigger({ chil
|
|
|
119
97
|
});
|
|
120
98
|
DropdownMenuTrigger.displayName = 'DropdownMenu.Trigger';
|
|
121
99
|
const DropdownMenuContent = React.forwardRef(function DropdownMenuContent({ className, style, children, ...props }, ref) {
|
|
122
|
-
const { open, idPrefix,
|
|
123
|
-
const menuRef = React.useRef(null);
|
|
100
|
+
const { open, idPrefix, triggerRef, floatingRef, setFloating, floatingStyles, menuItems, } = useDropdownMenuContext();
|
|
124
101
|
React.useEffect(() => {
|
|
125
102
|
if (!open)
|
|
126
103
|
return;
|
|
@@ -156,16 +133,12 @@ const DropdownMenuContent = React.forwardRef(function DropdownMenuContent({ clas
|
|
|
156
133
|
menuItems.focusLast();
|
|
157
134
|
}
|
|
158
135
|
};
|
|
159
|
-
const floatingProps = getFloatingProps({
|
|
160
|
-
...props,
|
|
161
|
-
onKeyDown: handleKeyDown,
|
|
162
|
-
});
|
|
163
136
|
if (!open)
|
|
164
137
|
return null;
|
|
165
|
-
return (jsxRuntime.jsx(Portal.default, { children: jsxRuntime.jsx(
|
|
138
|
+
return (jsxRuntime.jsx(Portal.default, { children: jsxRuntime.jsx(FocusScope.FocusScope, { contentRef: floatingRef, triggerRef: triggerRef, children: jsxRuntime.jsx("div", { id: `${idPrefix}-menu`, role: 'menu', "aria-orientation": 'vertical', ref: mergeRefs.mergeRefs(ref, setFloating), className: clsx(dropdownmenu_module.default.dropdown_menu, className), style: {
|
|
166
139
|
...floatingStyles,
|
|
167
140
|
...style,
|
|
168
|
-
}, ...
|
|
141
|
+
}, tabIndex: -1, ...props, onKeyDown: handleKeyDown, children: children }) }) }));
|
|
169
142
|
});
|
|
170
143
|
DropdownMenuContent.displayName = 'DropdownMenu.Content';
|
|
171
144
|
const DropdownMenuItem = React.forwardRef(function DropdownMenuItem({ disabled, destructive, onSelect, className, children, ...props }, ref) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../../../src/DropdownMenu/index.tsx"],"sourcesContent":[null],"names":["useId","useRovingCollection","
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../src/DropdownMenu/index.tsx"],"sourcesContent":[null],"names":["useId","useRovingCollection","useControllableValue","useFloatingPosition","useDismissibleLayer","_jsx","mergeRefs","Slot","useEffect","Portal","FocusScope","styles","useRef"],"mappings":"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"}
|
|
@@ -4,10 +4,11 @@
|
|
|
4
4
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
5
5
|
|
|
6
6
|
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
-
var react = require('@floating-ui/react');
|
|
8
7
|
var clsx = require('clsx');
|
|
9
8
|
var React = require('react');
|
|
10
|
-
var
|
|
9
|
+
var dismissibleLayer = require('../floating/dismissibleLayer.cjs');
|
|
10
|
+
var FocusScope = require('../floating/FocusScope.cjs');
|
|
11
|
+
var useFloatingPosition = require('../floating/useFloatingPosition.cjs');
|
|
11
12
|
var useControllableState = require('../hooks/useControllableState.cjs');
|
|
12
13
|
var mergeRefs = require('../utils/mergeRefs.cjs');
|
|
13
14
|
var Portal = require('../utils/Portal.cjs');
|
|
@@ -24,73 +25,50 @@ function usePopoverContext() {
|
|
|
24
25
|
}
|
|
25
26
|
const PopoverRoot = function Popover({ open, defaultOpen = false, onOpenChange, placement = 'bottom', offset = 8, closeOnEscape = true, closeOnOutsideClick = true, children, }) {
|
|
26
27
|
const idPrefix = React.useId();
|
|
27
|
-
const triggerRef = React.useRef(null);
|
|
28
|
-
const [referenceElement, setReferenceElement] = React.useState(null);
|
|
29
|
-
const [floatingElement, setFloatingElement] = React.useState(null);
|
|
30
28
|
const [currentOpen, handleOpenChange] = useControllableState.useControllableValue(open, defaultOpen, onOpenChange);
|
|
31
|
-
const
|
|
32
|
-
handleOpenChange(nextOpen);
|
|
33
|
-
if (!nextOpen && reason === 'escape-key') {
|
|
34
|
-
triggerRef.current?.focus();
|
|
35
|
-
}
|
|
36
|
-
}, [handleOpenChange]);
|
|
37
|
-
const floatingRootContext = react.useFloatingRootContext({
|
|
29
|
+
const { referenceRef: triggerRef, floatingRef, setReference, setFloating, floatingStyles, } = useFloatingPosition.useFloatingPosition({
|
|
38
30
|
open: currentOpen,
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
floating: floatingElement,
|
|
43
|
-
},
|
|
31
|
+
side: placement,
|
|
32
|
+
alignment: 'center',
|
|
33
|
+
offset,
|
|
44
34
|
});
|
|
45
|
-
const
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
35
|
+
const handleDismiss = React.useCallback((reason) => {
|
|
36
|
+
handleOpenChange(false);
|
|
37
|
+
if (reason === 'escape')
|
|
38
|
+
triggerRef.current?.focus();
|
|
39
|
+
}, [handleOpenChange, triggerRef]);
|
|
40
|
+
dismissibleLayer.useDismissibleLayer({
|
|
41
|
+
open: currentOpen,
|
|
42
|
+
referenceRef: triggerRef,
|
|
43
|
+
floatingRef,
|
|
44
|
+
closeOnEscape,
|
|
45
|
+
closeOnOutsidePointerDown: closeOnOutsideClick,
|
|
46
|
+
onDismiss: handleDismiss,
|
|
57
47
|
});
|
|
58
|
-
const { getReferenceProps, getFloatingProps } = react.useInteractions([dismiss]);
|
|
59
|
-
const setReference = React.useCallback((node) => {
|
|
60
|
-
refs.setReference(node);
|
|
61
|
-
setReferenceElement(node);
|
|
62
|
-
}, [refs]);
|
|
63
|
-
const setFloating = React.useCallback((node) => {
|
|
64
|
-
refs.setFloating(node);
|
|
65
|
-
setFloatingElement(node);
|
|
66
|
-
}, [refs]);
|
|
67
48
|
const contextValue = React.useMemo(() => ({
|
|
68
49
|
open: currentOpen,
|
|
69
50
|
onOpenChange: handleOpenChange,
|
|
70
51
|
idPrefix,
|
|
71
52
|
triggerRef,
|
|
53
|
+
floatingRef,
|
|
72
54
|
setReference,
|
|
73
55
|
setFloating,
|
|
74
56
|
floatingStyles,
|
|
75
|
-
floatingContext,
|
|
76
|
-
getReferenceProps,
|
|
77
|
-
getFloatingProps,
|
|
78
57
|
}), [
|
|
79
58
|
currentOpen,
|
|
80
59
|
handleOpenChange,
|
|
81
60
|
idPrefix,
|
|
61
|
+
triggerRef,
|
|
62
|
+
floatingRef,
|
|
82
63
|
setReference,
|
|
83
64
|
setFloating,
|
|
84
65
|
floatingStyles,
|
|
85
|
-
floatingContext,
|
|
86
|
-
getReferenceProps,
|
|
87
|
-
getFloatingProps,
|
|
88
66
|
]);
|
|
89
67
|
return (jsxRuntime.jsx(PopoverContext.Provider, { value: contextValue, children: children }));
|
|
90
68
|
};
|
|
91
69
|
PopoverRoot.displayName = 'Popover';
|
|
92
70
|
const PopoverTrigger = React.forwardRef(function PopoverTrigger({ children, asChild = false, onClick, type, ...triggerProps }, ref) {
|
|
93
|
-
const { open, onOpenChange, idPrefix, triggerRef, setReference
|
|
71
|
+
const { open, onOpenChange, idPrefix, triggerRef, setReference } = usePopoverContext();
|
|
94
72
|
const mergedRef = mergeRefs.mergeRefs(ref, triggerRef, setReference);
|
|
95
73
|
const handleClick = (event) => {
|
|
96
74
|
onClick?.(event);
|
|
@@ -98,13 +76,13 @@ const PopoverTrigger = React.forwardRef(function PopoverTrigger({ children, asCh
|
|
|
98
76
|
onOpenChange(!open);
|
|
99
77
|
}
|
|
100
78
|
};
|
|
101
|
-
const referenceProps =
|
|
79
|
+
const referenceProps = {
|
|
102
80
|
...triggerProps,
|
|
103
81
|
onClick: handleClick,
|
|
104
82
|
'aria-haspopup': 'dialog',
|
|
105
83
|
'aria-expanded': open,
|
|
106
84
|
'aria-controls': `${idPrefix}-content`,
|
|
107
|
-
}
|
|
85
|
+
};
|
|
108
86
|
if (asChild) {
|
|
109
87
|
if (!React.isValidElement(children)) {
|
|
110
88
|
throw new Error('Popover.Trigger with asChild expects a single valid React element child.');
|
|
@@ -115,14 +93,13 @@ const PopoverTrigger = React.forwardRef(function PopoverTrigger({ children, asCh
|
|
|
115
93
|
});
|
|
116
94
|
PopoverTrigger.displayName = 'Popover.Trigger';
|
|
117
95
|
const PopoverContent = React.forwardRef(function PopoverContent({ className, style, children, initialFocusRef, ...props }, ref) {
|
|
118
|
-
const { open, idPrefix,
|
|
119
|
-
const floatingProps = getFloatingProps(props);
|
|
96
|
+
const { open, idPrefix, triggerRef, floatingRef, setFloating, floatingStyles, } = usePopoverContext();
|
|
120
97
|
if (!open)
|
|
121
98
|
return null;
|
|
122
|
-
return (jsxRuntime.jsx(Portal.default, { children: jsxRuntime.jsx(
|
|
99
|
+
return (jsxRuntime.jsx(Portal.default, { children: jsxRuntime.jsx(FocusScope.FocusScope, { contentRef: floatingRef, triggerRef: triggerRef, initialFocusRef: initialFocusRef, children: jsxRuntime.jsx("div", { id: `${idPrefix}-content`, ref: mergeRefs.mergeRefs(ref, setFloating), className: clsx(popover_module.default.popover_content, className), style: {
|
|
123
100
|
...floatingStyles,
|
|
124
101
|
...style,
|
|
125
|
-
}, ...
|
|
102
|
+
}, tabIndex: -1, ...props, children: children }) }) }));
|
|
126
103
|
});
|
|
127
104
|
PopoverContent.displayName = 'Popover.Content';
|
|
128
105
|
const Popover = Object.assign(PopoverRoot, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../../../src/Popover/index.tsx"],"sourcesContent":[null],"names":["useId","
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../src/Popover/index.tsx"],"sourcesContent":[null],"names":["useId","useControllableValue","useFloatingPosition","useDismissibleLayer","_jsx","mergeRefs","Slot","Portal","FocusScope","styles"],"mappings":"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"}
|
|
@@ -4,10 +4,11 @@
|
|
|
4
4
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
5
5
|
|
|
6
6
|
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
-
var react = require('@floating-ui/react');
|
|
8
7
|
var clsx = require('clsx');
|
|
9
8
|
var React = require('react');
|
|
10
|
-
var
|
|
9
|
+
var dismissibleLayer = require('../floating/dismissibleLayer.cjs');
|
|
10
|
+
var useFloatingPosition = require('../floating/useFloatingPosition.cjs');
|
|
11
|
+
var useTooltipInteractions = require('../floating/useTooltipInteractions.cjs');
|
|
11
12
|
var useControllableState = require('../hooks/useControllableState.cjs');
|
|
12
13
|
var Portal = require('../utils/Portal.cjs');
|
|
13
14
|
var slot = require('../utils/slot.cjs');
|
|
@@ -17,56 +18,50 @@ function Tooltip({ children, asChild = false, content, open, defaultOpen = false
|
|
|
17
18
|
const generatedId = React.useId();
|
|
18
19
|
const tooltipId = id ?? `${generatedId}-tooltip`;
|
|
19
20
|
const [isOpen, setOpen] = useControllableState.useControllableValue(open, defaultOpen, onOpenChange);
|
|
20
|
-
const {
|
|
21
|
+
const { referenceRef, floatingRef, setReference, setFloating, floatingStyles, } = useFloatingPosition.useFloatingPosition({
|
|
21
22
|
open: isOpen,
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
strategy: 'fixed',
|
|
26
|
-
transform: false,
|
|
27
|
-
whileElementsMounted: react.autoUpdate,
|
|
23
|
+
side: placement,
|
|
24
|
+
alignment: 'center',
|
|
25
|
+
offset,
|
|
28
26
|
});
|
|
29
|
-
const
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
move: false,
|
|
27
|
+
const interactionProps = useTooltipInteractions.useTooltipInteractions({
|
|
28
|
+
open: isOpen,
|
|
29
|
+
delay,
|
|
30
|
+
reference: referenceRef.current,
|
|
31
|
+
onOpenChange: setOpen,
|
|
35
32
|
});
|
|
36
|
-
const
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
33
|
+
const handleDismiss = React.useCallback(() => {
|
|
34
|
+
setOpen(false);
|
|
35
|
+
}, [setOpen]);
|
|
36
|
+
dismissibleLayer.useDismissibleLayer({
|
|
37
|
+
open: isOpen,
|
|
38
|
+
referenceRef,
|
|
39
|
+
floatingRef,
|
|
40
|
+
closeOnEscape: true,
|
|
41
|
+
closeOnOutsidePointerDown: false,
|
|
42
|
+
onDismiss: handleDismiss,
|
|
40
43
|
});
|
|
41
|
-
const
|
|
42
|
-
|
|
43
|
-
focus,
|
|
44
|
-
dismiss,
|
|
45
|
-
]);
|
|
46
|
-
const referenceProps = getReferenceProps({
|
|
44
|
+
const referenceProps = {
|
|
45
|
+
...interactionProps,
|
|
47
46
|
'aria-describedby': isOpen ? tooltipId : undefined,
|
|
48
|
-
}
|
|
47
|
+
};
|
|
49
48
|
let triggerElement;
|
|
50
49
|
if (asChild) {
|
|
51
50
|
if (!React.isValidElement(children)) {
|
|
52
51
|
throw new Error('Tooltip with asChild expects a single valid React element child.');
|
|
53
52
|
}
|
|
54
|
-
triggerElement = (jsxRuntime.jsx(slot.Slot, { ref:
|
|
53
|
+
triggerElement = (jsxRuntime.jsx(slot.Slot, { ref: setReference, ...referenceProps, children: children }));
|
|
55
54
|
}
|
|
56
55
|
else {
|
|
57
|
-
triggerElement = (jsxRuntime.jsx("button", { ref:
|
|
56
|
+
triggerElement = (jsxRuntime.jsx("button", { ref: setReference, type: 'button', ...referenceProps, children: children }));
|
|
58
57
|
}
|
|
59
58
|
if (typeof document === 'undefined') {
|
|
60
59
|
return triggerElement;
|
|
61
60
|
}
|
|
62
|
-
|
|
63
|
-
id: tooltipId,
|
|
64
|
-
role: 'tooltip',
|
|
65
|
-
});
|
|
66
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [triggerElement, isOpen && (jsxRuntime.jsx(Portal.default, { children: jsxRuntime.jsx("div", { ref: refs.setFloating, className: clsx(tooltip_module.default.tooltip, className), style: {
|
|
61
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [triggerElement, isOpen && (jsxRuntime.jsx(Portal.default, { children: jsxRuntime.jsx("div", { ref: setFloating, className: clsx(tooltip_module.default.tooltip, className), style: {
|
|
67
62
|
...floatingStyles,
|
|
68
63
|
...style,
|
|
69
|
-
},
|
|
64
|
+
}, id: tooltipId, role: 'tooltip', children: content }) }))] }));
|
|
70
65
|
}
|
|
71
66
|
|
|
72
67
|
exports.default = Tooltip;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../../../src/Tooltip/index.tsx"],"sourcesContent":[null],"names":["useControllableValue","
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../src/Tooltip/index.tsx"],"sourcesContent":[null],"names":["useControllableValue","useFloatingPosition","useTooltipInteractions","useDismissibleLayer","_jsx","Slot","_jsxs","_Fragment","Portal","styles"],"mappings":";;;;;;;;;;;;;;;;AA2BA,SAAS,OAAO,CAAC,EACf,QAAQ,EACR,OAAO,GAAG,KAAK,EACf,OAAO,EACP,IAAI,EACJ,WAAW,GAAG,KAAK,EACnB,YAAY,EACZ,SAAS,GAAG,KAAK,EACjB,MAAM,GAAG,CAAC,EACV,KAAK,GAAG,GAAG,EACX,EAAE,EACF,SAAS,EACT,KAAK,GACkB,EAAA;AACvB,IAAA,MAAM,WAAW,GAAG,KAAK,CAAC,KAAK,EAAE;AACjC,IAAA,MAAM,SAAS,GAAG,EAAE,IAAI,CAAA,EAAG,WAAW,UAAU;AAChD,IAAA,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAGA,yCAAoB,CAC5C,IAAI,EACJ,WAAW,EACX,YAAY,CACb;AAED,IAAA,MAAM,EACJ,YAAY,EACZ,WAAW,EACX,YAAY,EACZ,WAAW,EACX,cAAc,GACf,GAAGC,uCAAmB,CAAC;AACtB,QAAA,IAAI,EAAE,MAAM;AACZ,QAAA,IAAI,EAAE,SAAS;AACf,QAAA,SAAS,EAAE,QAAQ;QACnB,MAAM;AACP,KAAA,CAAC;IAEF,MAAM,gBAAgB,GAAGC,6CAAsB,CAAC;AAC9C,QAAA,IAAI,EAAE,MAAM;QACZ,KAAK;QACL,SAAS,EAAE,YAAY,CAAC,OAAO;AAC/B,QAAA,YAAY,EAAE,OAAO;AACtB,KAAA,CAAC;AAEF,IAAA,MAAM,aAAa,GAAG,KAAK,CAAC,WAAW,CAAC,MAAK;QAC3C,OAAO,CAAC,KAAK,CAAC;AAChB,IAAA,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC;AAEb,IAAAC,oCAAmB,CAAC;AAClB,QAAA,IAAI,EAAE,MAAM;QACZ,YAAY;QACZ,WAAW;AACX,QAAA,aAAa,EAAE,IAAI;AACnB,QAAA,yBAAyB,EAAE,KAAK;AAChC,QAAA,SAAS,EAAE,aAAa;AACzB,KAAA,CAAC;AAEF,IAAA,MAAM,cAAc,GAAsC;AACxD,QAAA,GAAG,gBAAgB;QACnB,kBAAkB,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS;KACnD;AAED,IAAA,IAAI,cAAkC;IAEtC,IAAI,OAAO,EAAE;QACX,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE;AACnC,YAAA,MAAM,IAAI,KAAK,CACb,kEAAkE,CACnE;QACH;AAEA,QAAA,cAAc,IACZC,cAAA,CAACC,SAAI,IACH,GAAG,EAAE,YAA8C,EAAA,GAC/C,cAAc,EAAA,QAAA,EAEjB,QAAQ,EAAA,CACJ,CACR;IACH;SAAO;AACL,QAAA,cAAc,IACZD,cAAA,CAAA,QAAA,EAAA,EACE,GAAG,EAAE,YAA4C,EACjD,IAAI,EAAC,QAAQ,KACR,cAAgE,EAAA,QAAA,EAEpE,QAAQ,EAAA,CACF,CACV;IACH;AAEA,IAAA,IAAI,OAAO,QAAQ,KAAK,WAAW,EAAE;AACnC,QAAA,OAAO,cAAc;IACvB;IAEA,QACEE,eAAA,CAAAC,mBAAA,EAAA,EAAA,QAAA,EAAA,CACG,cAAc,EAEd,MAAM,KACLH,cAAA,CAACI,cAAM,EAAA,EAAA,QAAA,EACLJ,cAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,WAAwC,EAC7C,SAAS,EAAE,IAAI,CAACK,sBAAM,CAAC,OAAO,EAAE,SAAS,CAAC,EAC1C,KAAK,EAAE;AACL,wBAAA,GAAG,cAAc;AACjB,wBAAA,GAAG,KAAK;AACT,qBAAA,EACD,EAAE,EAAE,SAAS,EACb,IAAI,EAAC,SAAS,EAAA,QAAA,EAEb,OAAO,EAAA,CACJ,EAAA,CACC,CACV,CAAA,EAAA,CACA;AAEP;;;;"}
|