UNPKG

@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.

44 lines (43 loc) 1.44 kB
import * as React from 'react'; import { mergeReactProps } from '../../utils/mergeReactProps.js'; import { usePopoverRootContext } from '../root/PopoverRootContext.js'; export function usePopoverPopup(params) { const { getProps, titleId, descriptionId, initialFocus } = params; const { popupRef, openMethod } = usePopoverRootContext(); const getPopupProps = React.useCallback((externalProps = {}) => { return mergeReactProps(getProps(externalProps), { 'aria-labelledby': titleId, 'aria-describedby': descriptionId }); }, [getProps, titleId, descriptionId]); // Default initial focus logic: // If opened by touch, focus the popup element to prevent the virtual keyboard from opening // (this is required for Android specifically as iOS handles this automatically). const defaultInitialFocus = React.useCallback(interactionType => { if (interactionType === 'touch') { return popupRef; } return 0; }, [popupRef]); const resolvedInitialFocus = React.useMemo(() => { if (initialFocus == null) { return defaultInitialFocus(openMethod ?? ''); } if (typeof initialFocus === 'function') { return initialFocus(openMethod ?? ''); } return initialFocus; }, [defaultInitialFocus, initialFocus, openMethod]); return React.useMemo(() => ({ getPopupProps, resolvedInitialFocus }), [getPopupProps, resolvedInitialFocus]); }