@wordpress/compose
Version:
WordPress higher-order components (HOCs).
54 lines • 1.81 kB
TypeScript
/**
* External dependencies
*/
import type { RefCallback, SyntheticEvent } from 'react';
import { useFocusOnMount } from '../use-focus-on-mount';
import useFocusOutside from '../use-focus-outside';
type DialogOptions = {
/**
* Determines focus behavior when the dialog mounts.
*
* - `"firstElement"` focuses the first tabbable element within.
* - `"firstInputElement"` focuses the first value control within.
* - `true` focuses the element itself.
* - `false` does nothing and _should not be used unless an accessible
* substitute behavior is implemented_.
*
* @default 'firstElement'
*/
focusOnMount?: useFocusOnMount.Mode;
/**
* Determines whether tabbing is constrained to within the popover,
* preventing keyboard focus from leaving the popover content without
* explicit focus elsewhere, or whether the popover remains part of the
* wider tab order.
* If no value is passed, it will be derived from `focusOnMount`.
*
* @see focusOnMount
* @default `focusOnMount` !== false
*/
constrainTabbing?: boolean;
onClose?: () => void;
/**
* Use the `onClose` prop instead.
*
* @deprecated
*/
__unstableOnClose?: (type: string | undefined, event: SyntheticEvent) => void;
};
type useDialogReturn = [
RefCallback<HTMLElement>,
ReturnType<typeof useFocusOutside> & Pick<HTMLElement, 'tabIndex'>
];
/**
* Returns a ref and props to apply to a dialog wrapper to enable the following behaviors:
* - constrained tabbing.
* - focus on mount.
* - return focus on unmount.
* - focus outside.
*
* @param options Dialog Options.
*/
declare function useDialog(options: DialogOptions): useDialogReturn;
export default useDialog;
//# sourceMappingURL=index.d.ts.map