@base-ui-components/react
Version:
Base UI is a library of headless ('unstyled') React components and low-level hooks. You gain complete control over your app's CSS and accessibility features.
47 lines • 1.35 kB
JavaScript
import * as React from 'react';
import { mergeReactProps } from '../../utils/mergeReactProps.js';
import { useAnchorPositioning } from '../../utils/useAnchorPositioning.js';
import { usePreviewCardRootContext } from '../root/PreviewCardContext.js';
export function usePreviewCardPositioner(params) {
const {
keepMounted,
mounted
} = params;
const {
open
} = usePreviewCardRootContext();
const {
positionerStyles,
arrowStyles,
anchorHidden,
arrowRef,
arrowUncentered,
renderedSide,
renderedAlign,
positionerContext
} = useAnchorPositioning(params);
const getPositionerProps = React.useCallback((externalProps = {}) => {
const hiddenStyles = {};
if (keepMounted && !open) {
hiddenStyles.pointerEvents = 'none';
}
return mergeReactProps(externalProps, {
role: 'presentation',
hidden: !mounted,
style: {
...positionerStyles,
...hiddenStyles
}
});
}, [positionerStyles, open, keepMounted, mounted]);
return React.useMemo(() => ({
getPositionerProps,
arrowRef,
arrowUncentered,
arrowStyles,
side: renderedSide,
align: renderedAlign,
positionerContext,
anchorHidden
}), [getPositionerProps, arrowRef, arrowUncentered, arrowStyles, renderedSide, renderedAlign, positionerContext, anchorHidden]);
}