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
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTooltipInteractions.cjs","sources":["../../../src/floating/useTooltipInteractions.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import { FloatingFocusManager, useFloatingRootContext, useFloating, autoUpdate, useDismiss, useInteractions } from '@floating-ui/react';
|
|
4
3
|
import clsx from 'clsx';
|
|
5
|
-
import React, {
|
|
6
|
-
import {
|
|
4
|
+
import React, { useEffect, useRef, useId } from 'react';
|
|
5
|
+
import { useDismissibleLayer } from '../floating/dismissibleLayer.mjs';
|
|
6
|
+
import { FocusScope } from '../floating/FocusScope.mjs';
|
|
7
|
+
import { useFloatingPosition } from '../floating/useFloatingPosition.mjs';
|
|
7
8
|
import { useControllableValue } from '../hooks/useControllableState.mjs';
|
|
8
9
|
import { useRovingCollection } from '../hooks/useRovingCollection.mjs';
|
|
9
10
|
import { mergeRefs } from '../utils/mergeRefs.mjs';
|
|
@@ -22,75 +23,52 @@ function useDropdownMenuContext() {
|
|
|
22
23
|
const DropdownMenuRoot = function DropdownMenu({ open, defaultOpen = false, onOpenChange, placement = 'bottom', offset = 8, closeOnEscape = true, closeOnOutsideClick = true, children, }) {
|
|
23
24
|
const idPrefix = useId();
|
|
24
25
|
const menuItems = useRovingCollection();
|
|
25
|
-
const triggerRef = useRef(null);
|
|
26
|
-
const [referenceElement, setReferenceElement] = useState(null);
|
|
27
|
-
const [floatingElement, setFloatingElement] = useState(null);
|
|
28
26
|
const [currentOpen, handleOpenChange] = useControllableValue(open, defaultOpen, onOpenChange);
|
|
29
|
-
const
|
|
30
|
-
handleOpenChange(nextOpen);
|
|
31
|
-
if (!nextOpen && reason === 'escape-key') {
|
|
32
|
-
triggerRef.current?.focus();
|
|
33
|
-
}
|
|
34
|
-
}, [handleOpenChange]);
|
|
35
|
-
const floatingRootContext = useFloatingRootContext({
|
|
27
|
+
const { referenceRef: triggerRef, floatingRef, setReference, setFloating, floatingStyles, } = useFloatingPosition({
|
|
36
28
|
open: currentOpen,
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
floating: floatingElement,
|
|
41
|
-
},
|
|
42
|
-
});
|
|
43
|
-
const { refs, floatingStyles, context: floatingContext, } = useFloating({
|
|
44
|
-
rootContext: floatingRootContext,
|
|
45
|
-
placement: toFloatingPlacement(placement, 'start'),
|
|
46
|
-
middleware: createFloatingMiddleware(offset),
|
|
47
|
-
strategy: 'fixed',
|
|
48
|
-
transform: false,
|
|
49
|
-
whileElementsMounted: autoUpdate,
|
|
29
|
+
side: placement,
|
|
30
|
+
alignment: 'start',
|
|
31
|
+
offset,
|
|
50
32
|
});
|
|
51
|
-
const
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
33
|
+
const handleDismiss = React.useCallback((reason) => {
|
|
34
|
+
handleOpenChange(false);
|
|
35
|
+
if (reason === 'escape')
|
|
36
|
+
triggerRef.current?.focus();
|
|
37
|
+
}, [handleOpenChange, triggerRef]);
|
|
38
|
+
useDismissibleLayer({
|
|
39
|
+
open: currentOpen,
|
|
40
|
+
referenceRef: triggerRef,
|
|
41
|
+
floatingRef,
|
|
42
|
+
closeOnEscape,
|
|
43
|
+
closeOnOutsidePointerDown: closeOnOutsideClick,
|
|
44
|
+
onDismiss: handleDismiss,
|
|
55
45
|
});
|
|
56
|
-
const { getReferenceProps, getFloatingProps } = useInteractions([dismiss]);
|
|
57
|
-
const setReference = React.useCallback((node) => {
|
|
58
|
-
refs.setReference(node);
|
|
59
|
-
setReferenceElement(node);
|
|
60
|
-
}, [refs]);
|
|
61
|
-
const setFloating = React.useCallback((node) => {
|
|
62
|
-
refs.setFloating(node);
|
|
63
|
-
setFloatingElement(node);
|
|
64
|
-
}, [refs]);
|
|
65
46
|
const contextValue = React.useMemo(() => ({
|
|
66
47
|
open: currentOpen,
|
|
67
48
|
onOpenChange: handleOpenChange,
|
|
68
49
|
idPrefix,
|
|
69
50
|
triggerRef,
|
|
51
|
+
floatingRef,
|
|
70
52
|
setReference,
|
|
71
53
|
setFloating,
|
|
72
54
|
floatingStyles,
|
|
73
|
-
floatingContext,
|
|
74
|
-
getReferenceProps,
|
|
75
|
-
getFloatingProps,
|
|
76
55
|
menuItems,
|
|
77
56
|
}), [
|
|
78
57
|
currentOpen,
|
|
79
58
|
handleOpenChange,
|
|
80
59
|
idPrefix,
|
|
60
|
+
triggerRef,
|
|
61
|
+
floatingRef,
|
|
81
62
|
setReference,
|
|
82
63
|
setFloating,
|
|
83
64
|
floatingStyles,
|
|
84
|
-
floatingContext,
|
|
85
|
-
getReferenceProps,
|
|
86
|
-
getFloatingProps,
|
|
87
65
|
menuItems,
|
|
88
66
|
]);
|
|
89
67
|
return (jsx(DropdownMenuContext.Provider, { value: contextValue, children: children }));
|
|
90
68
|
};
|
|
91
69
|
DropdownMenuRoot.displayName = 'DropdownMenu';
|
|
92
70
|
const DropdownMenuTrigger = React.forwardRef(function DropdownMenuTrigger({ children, asChild = false, onClick, type, ...triggerProps }, ref) {
|
|
93
|
-
const { open, onOpenChange, idPrefix, triggerRef, setReference
|
|
71
|
+
const { open, onOpenChange, idPrefix, triggerRef, setReference } = useDropdownMenuContext();
|
|
94
72
|
const mergedRef = mergeRefs(ref, triggerRef, setReference);
|
|
95
73
|
const handleClick = (event) => {
|
|
96
74
|
onClick?.(event);
|
|
@@ -98,13 +76,13 @@ const DropdownMenuTrigger = React.forwardRef(function DropdownMenuTrigger({ chil
|
|
|
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': 'menu',
|
|
105
83
|
'aria-expanded': open,
|
|
106
84
|
'aria-controls': `${idPrefix}-menu`,
|
|
107
|
-
}
|
|
85
|
+
};
|
|
108
86
|
if (asChild) {
|
|
109
87
|
if (!React.isValidElement(children)) {
|
|
110
88
|
throw new Error('DropdownMenu.Trigger with asChild expects a single valid React element child.');
|
|
@@ -115,8 +93,7 @@ const DropdownMenuTrigger = React.forwardRef(function DropdownMenuTrigger({ chil
|
|
|
115
93
|
});
|
|
116
94
|
DropdownMenuTrigger.displayName = 'DropdownMenu.Trigger';
|
|
117
95
|
const DropdownMenuContent = React.forwardRef(function DropdownMenuContent({ className, style, children, ...props }, ref) {
|
|
118
|
-
const { open, idPrefix,
|
|
119
|
-
const menuRef = useRef(null);
|
|
96
|
+
const { open, idPrefix, triggerRef, floatingRef, setFloating, floatingStyles, menuItems, } = useDropdownMenuContext();
|
|
120
97
|
useEffect(() => {
|
|
121
98
|
if (!open)
|
|
122
99
|
return;
|
|
@@ -152,16 +129,12 @@ const DropdownMenuContent = React.forwardRef(function DropdownMenuContent({ clas
|
|
|
152
129
|
menuItems.focusLast();
|
|
153
130
|
}
|
|
154
131
|
};
|
|
155
|
-
const floatingProps = getFloatingProps({
|
|
156
|
-
...props,
|
|
157
|
-
onKeyDown: handleKeyDown,
|
|
158
|
-
});
|
|
159
132
|
if (!open)
|
|
160
133
|
return null;
|
|
161
|
-
return (jsx(Portal, { children: jsx(
|
|
134
|
+
return (jsx(Portal, { children: jsx(FocusScope, { contentRef: floatingRef, triggerRef: triggerRef, children: jsx("div", { id: `${idPrefix}-menu`, role: 'menu', "aria-orientation": 'vertical', ref: mergeRefs(ref, setFloating), className: clsx(styles.dropdown_menu, className), style: {
|
|
162
135
|
...floatingStyles,
|
|
163
136
|
...style,
|
|
164
|
-
}, ...
|
|
137
|
+
}, tabIndex: -1, ...props, onKeyDown: handleKeyDown, children: children }) }) }));
|
|
165
138
|
});
|
|
166
139
|
DropdownMenuContent.displayName = 'DropdownMenu.Content';
|
|
167
140
|
const DropdownMenuItem = React.forwardRef(function DropdownMenuItem({ disabled, destructive, onSelect, className, children, ...props }, ref) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../../src/DropdownMenu/index.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../../src/DropdownMenu/index.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":";;;;;;;;;;;;;;AA6BA,MAAM,mBAAmB,GACvB,KAAK,CAAC,aAAa,CAAkC,IAAI,CAAC;AAE5D,SAAS,sBAAsB,GAAA;IAC7B,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CAAC,mBAAmB,CAAC;IACrD,IAAI,CAAC,OAAO,EAAE;AACZ,QAAA,MAAM,IAAI,KAAK,CACb,2DAA2D,CAC5D;IACH;AACA,IAAA,OAAO,OAAO;AAChB;AAkBA,MAAM,gBAAgB,GAA8B,SAAS,YAAY,CAAC,EACxE,IAAI,EACJ,WAAW,GAAG,KAAK,EACnB,YAAY,EACZ,SAAS,GAAG,QAAQ,EACpB,MAAM,GAAG,CAAC,EACV,aAAa,GAAG,IAAI,EACpB,mBAAmB,GAAG,IAAI,EAC1B,QAAQ,GACoB,EAAA;AAC5B,IAAA,MAAM,QAAQ,GAAG,KAAK,EAAE;AACxB,IAAA,MAAM,SAAS,GAAG,mBAAmB,EAAE;AACvC,IAAA,MAAM,CAAC,WAAW,EAAE,gBAAgB,CAAC,GAAG,oBAAoB,CAC1D,IAAI,EACJ,WAAW,EACX,YAAY,CACb;AACD,IAAA,MAAM,EACJ,YAAY,EAAE,UAAU,EACxB,WAAW,EACX,YAAY,EACZ,WAAW,EACX,cAAc,GACf,GAAG,mBAAmB,CAAC;AACtB,QAAA,IAAI,EAAE,WAAW;AACjB,QAAA,IAAI,EAAE,SAAS;AACf,QAAA,SAAS,EAAE,OAAO;QAClB,MAAM;AACP,KAAA,CAAC;IACF,MAAM,aAAa,GAAG,KAAK,CAAC,WAAW,CACrC,CAAC,MAAqB,KAAI;QACxB,gBAAgB,CAAC,KAAK,CAAC;QACvB,IAAI,MAAM,KAAK,QAAQ;AAAE,YAAA,UAAU,CAAC,OAAO,EAAE,KAAK,EAAE;AACtD,IAAA,CAAC,EACD,CAAC,gBAAgB,EAAE,UAAU,CAAC,CAC/B;AACD,IAAA,mBAAmB,CAAC;AAClB,QAAA,IAAI,EAAE,WAAW;AACjB,QAAA,YAAY,EAAE,UAAU;QACxB,WAAW;QACX,aAAa;AACb,QAAA,yBAAyB,EAAE,mBAAmB;AAC9C,QAAA,SAAS,EAAE,aAAa;AACzB,KAAA,CAAC;IACF,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAChC,OAAO;AACL,QAAA,IAAI,EAAE,WAAW;AACjB,QAAA,YAAY,EAAE,gBAAgB;QAC9B,QAAQ;QACR,UAAU;QACV,WAAW;QACX,YAAY;QACZ,WAAW;QACX,cAAc;QACd,SAAS;AACV,KAAA,CAAC,EACF;QACE,WAAW;QACX,gBAAgB;QAChB,QAAQ;QACR,UAAU;QACV,WAAW;QACX,YAAY;QACZ,WAAW;QACX,cAAc;QACd,SAAS;AACV,KAAA,CACF;AAED,IAAA,QACEA,GAAA,CAAC,mBAAmB,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,YAAY,EAAA,QAAA,EAC9C,QAAQ,EAAA,CACoB;AAEnC,CAAC;AACD,gBAAgB,CAAC,WAAW,GAAG,cAAc;AAW7C,MAAM,mBAAmB,GAAiC,KAAK,CAAC,UAAU,CAGxE,SAAS,mBAAmB,CAC5B,EAAE,QAAQ,EAAE,OAAO,GAAG,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,YAAY,EAAE,EAC7D,GAAG,EAAA;AAEH,IAAA,MAAM,EAAE,IAAI,EAAE,YAAY,EAAE,QAAQ,EAAE,UAAU,EAAE,YAAY,EAAE,GAC9D,sBAAsB,EAAE;IAC1B,MAAM,SAAS,GAAG,SAAS,CACzB,GAAG,EACH,UAAU,EACV,YAA8C,CAC/C;AACD,IAAA,MAAM,WAAW,GAAyC,CAAC,KAAK,KAAI;AAClE,QAAA,OAAO,GAAG,KAA4C,CAAC;AACvD,QAAA,IAAI,CAAC,KAAK,CAAC,gBAAgB,EAAE;AAC3B,YAAA,YAAY,CAAC,CAAC,IAAI,CAAC;QACrB;AACF,IAAA,CAAC;AACD,IAAA,MAAM,cAAc,GAAsC;AACxD,QAAA,GAAG,YAAY;AACf,QAAA,OAAO,EAAE,WAAW;AACpB,QAAA,eAAe,EAAE,MAAM;AACvB,QAAA,eAAe,EAAE,IAAI;QACrB,eAAe,EAAE,CAAA,EAAG,QAAQ,CAAA,KAAA,CAAO;KACpC;IAED,IAAI,OAAO,EAAE;QACX,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE;AACnC,YAAA,MAAM,IAAI,KAAK,CACb,+EAA+E,CAChF;QACH;AAEA,QAAA,QACEA,GAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,SAAS,EAAA,GAAM,cAAc,EAAA,QAAA,EACrC,QAAQ,EAAA,CACJ;IAEX;AAEA,IAAA,QACEA,GAAA,CAAA,QAAA,EAAA,EACE,GAAG,EAAE,SAAyC,EAC9C,IAAI,EAAE,IAAI,IAAI,QAAQ,EAAA,GACjB,cAAgE,YAEpE,QAAQ,EAAA,CACF;AAEb,CAAC,CAAC;AACF,mBAAmB,CAAC,WAAW,GAAG,sBAAsB;AAQxD,MAAM,mBAAmB,GAAiC,KAAK,CAAC,UAAU,CAGxE,SAAS,mBAAmB,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAA;AAC1E,IAAA,MAAM,EACJ,IAAI,EACJ,QAAQ,EACR,UAAU,EACV,WAAW,EACX,WAAW,EACX,cAAc,EACd,SAAS,GACV,GAAG,sBAAsB,EAAE;IAE5B,SAAS,CAAC,MAAK;AACb,QAAA,IAAI,CAAC,IAAI;YAAE;QACX,SAAS,CAAC,UAAU,EAAE;AACxB,IAAA,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;AAErB,IAAA,MAAM,aAAa,GAAG,CAAC,KAA0C,KAAI;AACnE,QAAA,MAAM,aAAa,GACjB,KAAK,CAAC,MAAM,YAAY,WAAW,GAAG,KAAK,CAAC,MAAM,GAAG,IAAI;QAC3D,MAAM,aAAa,GAAG,SAAS,CAAC,mBAAmB,CAAC,aAAa,CAAC;AAElE,QAAA,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,EAAE;YAC7B,KAAK,CAAC,cAAc,EAAE;YACtB,IAAI,aAAa,EAAE;AACjB,gBAAA,SAAS,CAAC,SAAS,CAAC,aAAa,CAAC;YACpC;iBAAO;gBACL,SAAS,CAAC,UAAU,EAAE;YACxB;QACF;AAEA,QAAA,IAAI,KAAK,CAAC,GAAG,KAAK,SAAS,EAAE;YAC3B,KAAK,CAAC,cAAc,EAAE;YACtB,IAAI,aAAa,EAAE;AACjB,gBAAA,SAAS,CAAC,aAAa,CAAC,aAAa,CAAC;YACxC;iBAAO;gBACL,SAAS,CAAC,SAAS,EAAE;YACvB;QACF;AAEA,QAAA,IAAI,KAAK,CAAC,GAAG,KAAK,MAAM,EAAE;YACxB,KAAK,CAAC,cAAc,EAAE;YACtB,SAAS,CAAC,UAAU,EAAE;QACxB;AAEA,QAAA,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,EAAE;YACvB,KAAK,CAAC,cAAc,EAAE;YACtB,SAAS,CAAC,SAAS,EAAE;QACvB;AACF,IAAA,CAAC;AACD,IAAA,IAAI,CAAC,IAAI;AAAE,QAAA,OAAO,IAAI;IAEtB,QACEA,IAAC,MAAM,EAAA,EAAA,QAAA,EACLA,IAAC,UAAU,EAAA,EAAC,UAAU,EAAE,WAAW,EAAE,UAAU,EAAE,UAAU,YACzDA,GAAA,CAAA,KAAA,EAAA,EACE,EAAE,EAAE,CAAA,EAAG,QAAQ,CAAA,KAAA,CAAO,EACtB,IAAI,EAAC,MAAM,EAAA,kBAAA,EACM,UAAU,EAC3B,GAAG,EAAE,SAAS,CAAC,GAAG,EAAE,WAAgD,CAAC,EACrE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,aAAa,EAAE,SAAS,CAAC,EAChD,KAAK,EAAE;AACL,oBAAA,GAAG,cAAc;AACjB,oBAAA,GAAG,KAAK;AACT,iBAAA,EACD,QAAQ,EAAE,EAAE,EAAA,GACR,KAAK,EACT,SAAS,EAAE,aAAa,YAEvB,QAAQ,EAAA,CACL,EAAA,CACK,EAAA,CACN;AAEb,CAAC,CAAC;AACF,mBAAmB,CAAC,WAAW,GAAG,sBAAsB;AAaxD,MAAM,gBAAgB,GAA8B,KAAK,CAAC,UAAU,CAGlE,SAAS,gBAAgB,CACzB,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAClE,GAAG,EAAA;IAEH,MAAM,EAAE,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,sBAAsB,EAAE;AACxE,IAAA,MAAM,OAAO,GAAG,MAAM,CAA2B,IAAI,CAAC;AACtD,IAAA,MAAM,MAAM,GAAG,KAAK,EAAE;IACtB,MAAM,SAAS,GAAG,SAAS,CAAC,GAAG,EAAE,OAAO,CAAC;IAEzC,SAAS,CAAC,MAAK;QACb,SAAS,CAAC,YAAY,CAAC,MAAM,EAAE,OAAO,CAAC,OAAO,EAAE;AAC9C,YAAA,QAAQ,EAAE,OAAO,CAAC,QAAQ,CAAC;AAC5B,SAAA,CAAC;AAEF,QAAA,OAAO,MAAK;AACV,YAAA,SAAS,CAAC,cAAc,CAAC,MAAM,CAAC;AAClC,QAAA,CAAC;IACH,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAC;AAEjC,IAAA,MAAM,WAAW,GAAG,CAAC,KAA0C,KAAI;AACjE,QAAA,IAAI,QAAQ;YAAE;QACd,QAAQ,IAAI;AACZ,QAAA,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC;QACtB,YAAY,CAAC,KAAK,CAAC;AACnB,QAAA,UAAU,CAAC,OAAO,EAAE,KAAK,EAAE;AAC7B,IAAA,CAAC;AAED,IAAA,QACEA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,4BAA4B,EAAA,QAAA,EACjDA,GAAA,CAAA,QAAA,EAAA,EACE,GAAG,EAAE,SAAS,EACd,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,kBAAkB,EAAE,SAAS,EAAE;AACpD,gBAAA,CAAC,MAAM,CAAC,8BAA8B,GAAG,WAAW;AACrD,aAAA,CAAC,KACE,KAAK,EAAA,QAAA,EAER,QAAQ,EAAA,CACF,EAAA,CACL;AAEV,CAAC,CAAC;AACF,gBAAgB,CAAC,WAAW,GAAG,mBAAmB;MAQrC,YAAY,GAA0B,MAAM,CAAC,MAAM,CAC9D,gBAAgB,EAChB;AACE,IAAA,OAAO,EAAE,mBAAmB;AAC5B,IAAA,OAAO,EAAE,mBAAmB;AAC5B,IAAA,IAAI,EAAE,gBAAgB;AACvB,CAAA;;;;"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import { FloatingFocusManager, useFloatingRootContext, useFloating, autoUpdate, useDismiss, useInteractions } from '@floating-ui/react';
|
|
4
3
|
import clsx from 'clsx';
|
|
5
|
-
import React, { useId
|
|
6
|
-
import {
|
|
4
|
+
import React, { useId } from 'react';
|
|
5
|
+
import { useDismissibleLayer } from '../floating/dismissibleLayer.mjs';
|
|
6
|
+
import { FocusScope } from '../floating/FocusScope.mjs';
|
|
7
|
+
import { useFloatingPosition } from '../floating/useFloatingPosition.mjs';
|
|
7
8
|
import { useControllableValue } from '../hooks/useControllableState.mjs';
|
|
8
9
|
import { mergeRefs } from '../utils/mergeRefs.mjs';
|
|
9
10
|
import Portal from '../utils/Portal.mjs';
|
|
@@ -20,73 +21,50 @@ function usePopoverContext() {
|
|
|
20
21
|
}
|
|
21
22
|
const PopoverRoot = function Popover({ open, defaultOpen = false, onOpenChange, placement = 'bottom', offset = 8, closeOnEscape = true, closeOnOutsideClick = true, children, }) {
|
|
22
23
|
const idPrefix = useId();
|
|
23
|
-
const triggerRef = useRef(null);
|
|
24
|
-
const [referenceElement, setReferenceElement] = useState(null);
|
|
25
|
-
const [floatingElement, setFloatingElement] = useState(null);
|
|
26
24
|
const [currentOpen, handleOpenChange] = useControllableValue(open, defaultOpen, onOpenChange);
|
|
27
|
-
const
|
|
28
|
-
handleOpenChange(nextOpen);
|
|
29
|
-
if (!nextOpen && reason === 'escape-key') {
|
|
30
|
-
triggerRef.current?.focus();
|
|
31
|
-
}
|
|
32
|
-
}, [handleOpenChange]);
|
|
33
|
-
const floatingRootContext = useFloatingRootContext({
|
|
25
|
+
const { referenceRef: triggerRef, floatingRef, setReference, setFloating, floatingStyles, } = useFloatingPosition({
|
|
34
26
|
open: currentOpen,
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
floating: floatingElement,
|
|
39
|
-
},
|
|
27
|
+
side: placement,
|
|
28
|
+
alignment: 'center',
|
|
29
|
+
offset,
|
|
40
30
|
});
|
|
41
|
-
const
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
31
|
+
const handleDismiss = React.useCallback((reason) => {
|
|
32
|
+
handleOpenChange(false);
|
|
33
|
+
if (reason === 'escape')
|
|
34
|
+
triggerRef.current?.focus();
|
|
35
|
+
}, [handleOpenChange, triggerRef]);
|
|
36
|
+
useDismissibleLayer({
|
|
37
|
+
open: currentOpen,
|
|
38
|
+
referenceRef: triggerRef,
|
|
39
|
+
floatingRef,
|
|
40
|
+
closeOnEscape,
|
|
41
|
+
closeOnOutsidePointerDown: closeOnOutsideClick,
|
|
42
|
+
onDismiss: handleDismiss,
|
|
53
43
|
});
|
|
54
|
-
const { getReferenceProps, getFloatingProps } = useInteractions([dismiss]);
|
|
55
|
-
const setReference = React.useCallback((node) => {
|
|
56
|
-
refs.setReference(node);
|
|
57
|
-
setReferenceElement(node);
|
|
58
|
-
}, [refs]);
|
|
59
|
-
const setFloating = React.useCallback((node) => {
|
|
60
|
-
refs.setFloating(node);
|
|
61
|
-
setFloatingElement(node);
|
|
62
|
-
}, [refs]);
|
|
63
44
|
const contextValue = React.useMemo(() => ({
|
|
64
45
|
open: currentOpen,
|
|
65
46
|
onOpenChange: handleOpenChange,
|
|
66
47
|
idPrefix,
|
|
67
48
|
triggerRef,
|
|
49
|
+
floatingRef,
|
|
68
50
|
setReference,
|
|
69
51
|
setFloating,
|
|
70
52
|
floatingStyles,
|
|
71
|
-
floatingContext,
|
|
72
|
-
getReferenceProps,
|
|
73
|
-
getFloatingProps,
|
|
74
53
|
}), [
|
|
75
54
|
currentOpen,
|
|
76
55
|
handleOpenChange,
|
|
77
56
|
idPrefix,
|
|
57
|
+
triggerRef,
|
|
58
|
+
floatingRef,
|
|
78
59
|
setReference,
|
|
79
60
|
setFloating,
|
|
80
61
|
floatingStyles,
|
|
81
|
-
floatingContext,
|
|
82
|
-
getReferenceProps,
|
|
83
|
-
getFloatingProps,
|
|
84
62
|
]);
|
|
85
63
|
return (jsx(PopoverContext.Provider, { value: contextValue, children: children }));
|
|
86
64
|
};
|
|
87
65
|
PopoverRoot.displayName = 'Popover';
|
|
88
66
|
const PopoverTrigger = React.forwardRef(function PopoverTrigger({ children, asChild = false, onClick, type, ...triggerProps }, ref) {
|
|
89
|
-
const { open, onOpenChange, idPrefix, triggerRef, setReference
|
|
67
|
+
const { open, onOpenChange, idPrefix, triggerRef, setReference } = usePopoverContext();
|
|
90
68
|
const mergedRef = mergeRefs(ref, triggerRef, setReference);
|
|
91
69
|
const handleClick = (event) => {
|
|
92
70
|
onClick?.(event);
|
|
@@ -94,13 +72,13 @@ const PopoverTrigger = React.forwardRef(function PopoverTrigger({ children, asCh
|
|
|
94
72
|
onOpenChange(!open);
|
|
95
73
|
}
|
|
96
74
|
};
|
|
97
|
-
const referenceProps =
|
|
75
|
+
const referenceProps = {
|
|
98
76
|
...triggerProps,
|
|
99
77
|
onClick: handleClick,
|
|
100
78
|
'aria-haspopup': 'dialog',
|
|
101
79
|
'aria-expanded': open,
|
|
102
80
|
'aria-controls': `${idPrefix}-content`,
|
|
103
|
-
}
|
|
81
|
+
};
|
|
104
82
|
if (asChild) {
|
|
105
83
|
if (!React.isValidElement(children)) {
|
|
106
84
|
throw new Error('Popover.Trigger with asChild expects a single valid React element child.');
|
|
@@ -111,14 +89,13 @@ const PopoverTrigger = React.forwardRef(function PopoverTrigger({ children, asCh
|
|
|
111
89
|
});
|
|
112
90
|
PopoverTrigger.displayName = 'Popover.Trigger';
|
|
113
91
|
const PopoverContent = React.forwardRef(function PopoverContent({ className, style, children, initialFocusRef, ...props }, ref) {
|
|
114
|
-
const { open, idPrefix,
|
|
115
|
-
const floatingProps = getFloatingProps(props);
|
|
92
|
+
const { open, idPrefix, triggerRef, floatingRef, setFloating, floatingStyles, } = usePopoverContext();
|
|
116
93
|
if (!open)
|
|
117
94
|
return null;
|
|
118
|
-
return (jsx(Portal, { children: jsx(
|
|
95
|
+
return (jsx(Portal, { children: jsx(FocusScope, { contentRef: floatingRef, triggerRef: triggerRef, initialFocusRef: initialFocusRef, children: jsx("div", { id: `${idPrefix}-content`, ref: mergeRefs(ref, setFloating), className: clsx(styles.popover_content, className), style: {
|
|
119
96
|
...floatingStyles,
|
|
120
97
|
...style,
|
|
121
|
-
}, ...
|
|
98
|
+
}, tabIndex: -1, ...props, children: children }) }) }));
|
|
122
99
|
});
|
|
123
100
|
PopoverContent.displayName = 'Popover.Content';
|
|
124
101
|
const Popover = Object.assign(PopoverRoot, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../../src/Popover/index.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../../src/Popover/index.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":"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"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
3
|
-
import { useFloating, autoUpdate, useHover, useFocus, useDismiss, useInteractions } from '@floating-ui/react';
|
|
4
3
|
import clsx from 'clsx';
|
|
5
4
|
import React from 'react';
|
|
6
|
-
import {
|
|
5
|
+
import { useDismissibleLayer } from '../floating/dismissibleLayer.mjs';
|
|
6
|
+
import { useFloatingPosition } from '../floating/useFloatingPosition.mjs';
|
|
7
|
+
import { useTooltipInteractions } from '../floating/useTooltipInteractions.mjs';
|
|
7
8
|
import { useControllableValue } from '../hooks/useControllableState.mjs';
|
|
8
9
|
import Portal from '../utils/Portal.mjs';
|
|
9
10
|
import { Slot } from '../utils/slot.mjs';
|
|
@@ -13,56 +14,50 @@ function Tooltip({ children, asChild = false, content, open, defaultOpen = false
|
|
|
13
14
|
const generatedId = React.useId();
|
|
14
15
|
const tooltipId = id ?? `${generatedId}-tooltip`;
|
|
15
16
|
const [isOpen, setOpen] = useControllableValue(open, defaultOpen, onOpenChange);
|
|
16
|
-
const {
|
|
17
|
+
const { referenceRef, floatingRef, setReference, setFloating, floatingStyles, } = useFloatingPosition({
|
|
17
18
|
open: isOpen,
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
strategy: 'fixed',
|
|
22
|
-
transform: false,
|
|
23
|
-
whileElementsMounted: autoUpdate,
|
|
19
|
+
side: placement,
|
|
20
|
+
alignment: 'center',
|
|
21
|
+
offset,
|
|
24
22
|
});
|
|
25
|
-
const
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
move: false,
|
|
23
|
+
const interactionProps = useTooltipInteractions({
|
|
24
|
+
open: isOpen,
|
|
25
|
+
delay,
|
|
26
|
+
reference: referenceRef.current,
|
|
27
|
+
onOpenChange: setOpen,
|
|
31
28
|
});
|
|
32
|
-
const
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
29
|
+
const handleDismiss = React.useCallback(() => {
|
|
30
|
+
setOpen(false);
|
|
31
|
+
}, [setOpen]);
|
|
32
|
+
useDismissibleLayer({
|
|
33
|
+
open: isOpen,
|
|
34
|
+
referenceRef,
|
|
35
|
+
floatingRef,
|
|
36
|
+
closeOnEscape: true,
|
|
37
|
+
closeOnOutsidePointerDown: false,
|
|
38
|
+
onDismiss: handleDismiss,
|
|
36
39
|
});
|
|
37
|
-
const
|
|
38
|
-
|
|
39
|
-
focus,
|
|
40
|
-
dismiss,
|
|
41
|
-
]);
|
|
42
|
-
const referenceProps = getReferenceProps({
|
|
40
|
+
const referenceProps = {
|
|
41
|
+
...interactionProps,
|
|
43
42
|
'aria-describedby': isOpen ? tooltipId : undefined,
|
|
44
|
-
}
|
|
43
|
+
};
|
|
45
44
|
let triggerElement;
|
|
46
45
|
if (asChild) {
|
|
47
46
|
if (!React.isValidElement(children)) {
|
|
48
47
|
throw new Error('Tooltip with asChild expects a single valid React element child.');
|
|
49
48
|
}
|
|
50
|
-
triggerElement = (jsx(Slot, { ref:
|
|
49
|
+
triggerElement = (jsx(Slot, { ref: setReference, ...referenceProps, children: children }));
|
|
51
50
|
}
|
|
52
51
|
else {
|
|
53
|
-
triggerElement = (jsx("button", { ref:
|
|
52
|
+
triggerElement = (jsx("button", { ref: setReference, type: 'button', ...referenceProps, children: children }));
|
|
54
53
|
}
|
|
55
54
|
if (typeof document === 'undefined') {
|
|
56
55
|
return triggerElement;
|
|
57
56
|
}
|
|
58
|
-
|
|
59
|
-
id: tooltipId,
|
|
60
|
-
role: 'tooltip',
|
|
61
|
-
});
|
|
62
|
-
return (jsxs(Fragment, { children: [triggerElement, isOpen && (jsx(Portal, { children: jsx("div", { ref: refs.setFloating, className: clsx(styles.tooltip, className), style: {
|
|
57
|
+
return (jsxs(Fragment, { children: [triggerElement, isOpen && (jsx(Portal, { children: jsx("div", { ref: setFloating, className: clsx(styles.tooltip, className), style: {
|
|
63
58
|
...floatingStyles,
|
|
64
59
|
...style,
|
|
65
|
-
},
|
|
60
|
+
}, id: tooltipId, role: 'tooltip', children: content }) }))] }));
|
|
66
61
|
}
|
|
67
62
|
|
|
68
63
|
export { Tooltip as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../../src/Tooltip/index.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs","_Fragment"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../../src/Tooltip/index.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs","_Fragment"],"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,GAAG,oBAAoB,CAC5C,IAAI,EACJ,WAAW,EACX,YAAY,CACb;AAED,IAAA,MAAM,EACJ,YAAY,EACZ,WAAW,EACX,YAAY,EACZ,WAAW,EACX,cAAc,GACf,GAAG,mBAAmB,CAAC;AACtB,QAAA,IAAI,EAAE,MAAM;AACZ,QAAA,IAAI,EAAE,SAAS;AACf,QAAA,SAAS,EAAE,QAAQ;QACnB,MAAM;AACP,KAAA,CAAC;IAEF,MAAM,gBAAgB,GAAG,sBAAsB,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,IAAA,mBAAmB,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,IACZA,GAAA,CAAC,IAAI,IACH,GAAG,EAAE,YAA8C,EAAA,GAC/C,cAAc,EAAA,QAAA,EAEjB,QAAQ,EAAA,CACJ,CACR;IACH;SAAO;AACL,QAAA,cAAc,IACZA,GAAA,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,QACEC,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACG,cAAc,EAEd,MAAM,KACLF,GAAA,CAAC,MAAM,EAAA,EAAA,QAAA,EACLA,GAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,WAAwC,EAC7C,SAAS,EAAE,IAAI,CAAC,MAAM,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;;;;"}
|