@indico-data/design-system 3.13.1 → 3.14.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/floatUI/FloatUI.d.ts +1 -1
- package/lib/components/floatUI/types.d.ts +2 -0
- package/lib/index.d.ts +3 -1
- package/lib/index.esm.js +8 -3
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +8 -3
- package/lib/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/floatUI/FloatUI.tsx +8 -2
- package/src/components/floatUI/__tests__/FloatUI.test.tsx +1 -1
- package/src/components/floatUI/types.ts +2 -0
package/package.json
CHANGED
|
@@ -29,6 +29,7 @@ export function FloatUI({
|
|
|
29
29
|
floatingOptions = defaultOptions,
|
|
30
30
|
className,
|
|
31
31
|
hover = false,
|
|
32
|
+
onOpenChange,
|
|
32
33
|
}: FloatUIProps) {
|
|
33
34
|
const [internalIsOpen, setInternalIsOpen] = useState(false);
|
|
34
35
|
|
|
@@ -56,7 +57,10 @@ export function FloatUI({
|
|
|
56
57
|
const { refs, floatingStyles, context } = useFloating({
|
|
57
58
|
...floatingOptions,
|
|
58
59
|
open: isOpen,
|
|
59
|
-
onOpenChange:
|
|
60
|
+
onOpenChange: (isOpen) => {
|
|
61
|
+
setIsOpen(isOpen);
|
|
62
|
+
onOpenChange?.(isOpen);
|
|
63
|
+
},
|
|
60
64
|
elements: {
|
|
61
65
|
reference: referenceElementRef.current,
|
|
62
66
|
},
|
|
@@ -65,7 +69,9 @@ export function FloatUI({
|
|
|
65
69
|
// Can't call hooks conditionally so this enabled option is needed.
|
|
66
70
|
const click = useClick(context, { enabled: !hover });
|
|
67
71
|
const hoverHook = useHover(context, { enabled: hover });
|
|
68
|
-
const dismiss = useDismiss(context
|
|
72
|
+
const dismiss = useDismiss(context, {
|
|
73
|
+
bubbles: true,
|
|
74
|
+
});
|
|
69
75
|
|
|
70
76
|
const { getReferenceProps, getFloatingProps } = useInteractions([click, hoverHook, dismiss]);
|
|
71
77
|
|
|
@@ -107,7 +107,7 @@ describe('FloatUI Component', () => {
|
|
|
107
107
|
);
|
|
108
108
|
|
|
109
109
|
fireEvent.click(screen.getByText('Toggle'));
|
|
110
|
-
expect(setIsOpen).toHaveBeenCalledWith(true
|
|
110
|
+
expect(setIsOpen).toHaveBeenCalledWith(true);
|
|
111
111
|
});
|
|
112
112
|
|
|
113
113
|
it('displays the FloatUI content when the trigger is hovered in hover mode', async () => {
|
|
@@ -21,4 +21,6 @@ export type FloatUIProps = {
|
|
|
21
21
|
setIsOpen?: React.Dispatch<React.SetStateAction<boolean>>;
|
|
22
22
|
/** If true, opens on hover instead of click. Defaults to false. */
|
|
23
23
|
hover?: boolean;
|
|
24
|
+
/** Callback function to be called when the FloatUI is opened or closed. */
|
|
25
|
+
onOpenChange?: (isOpen: boolean) => void;
|
|
24
26
|
};
|