@alice-ui/react
Version:
64 lines (62 loc) • 1.56 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: shouldCloseOnInteractOutside ? shouldCloseOnInteractOutside : (element) => {
let trigger = triggerRef == null ? void 0 : triggerRef.current;
return !trigger || !trigger.contains(element);
}
},
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
};