@trail-ui/react
Version:
61 lines (59 loc) • 1.35 kB
JavaScript
// src/popover/use-popover.ts
import {
ariaHideOutside,
useOverlay,
useOverlayPosition,
usePreventScroll
} from "@react-aria/overlays";
import { mergeProps, useLayoutEffect } from "@react-aria/utils";
function usePopover(props, state) {
const {
triggerRef,
popoverRef,
isNonModal,
isKeyboardDismissDisabled,
shouldCloseOnInteractOutside,
...otherProps
} = props;
const { overlayProps, underlayProps } = useOverlay(
{
isOpen: state.isOpen,
onClose: state.close,
shouldCloseOnBlur: true,
// isDismissable: !isNonModal,
isDismissable: true,
isKeyboardDismissDisabled,
shouldCloseOnInteractOutside
},
popoverRef
);
const {
overlayProps: positionProps,
arrowProps,
placement
} = useOverlayPosition({
...otherProps,
targetRef: triggerRef,
overlayRef: popoverRef,
isOpen: state.isOpen,
onClose: () => {
}
});
usePreventScroll({
isDisabled: isNonModal || !state.isOpen
});
useLayoutEffect(() => {
if (state.isOpen && !isNonModal && popoverRef.current) {
return ariaHideOutside([popoverRef.current]);
}
}, [isNonModal, state.isOpen, popoverRef]);
return {
popoverProps: mergeProps(overlayProps, positionProps),
arrowProps,
underlayProps,
placement
};
}
export {
usePopover
};