import * as React from 'react'; import ModalManager from './ModalManager'; import { DOMContainer } from './useWaitForDOMRef'; import { TransitionCallbacks } from './types'; export declare type ModalTransitionComponent = React.ComponentType<{ in: boolean; appear?: boolean; unmountOnExit?: boolean; } & TransitionCallbacks>; export interface RenderModalDialogProps { style: React.CSSProperties | undefined; className: string | undefined; tabIndex: number; role: string; ref: React.RefCallback; 'aria-modal': boolean | undefined; } export interface RenderModalBackdropProps { ref: React.RefCallback; onClick: (event: React.SyntheticEvent) => void; } export interface BaseModalProps extends TransitionCallbacks { children?: React.ReactElement; role?: string; style?: React.CSSProperties; className?: string; /** * Set the visibility of the Modal */ show?: boolean; /** * A DOM element, a `ref` to an element, or function that returns either. The Modal is appended to it's `container` element. * */ container?: DOMContainer; /** * A callback fired when the Modal is opening. */ onShow?: () => void; /** * A callback fired when either the backdrop is clicked, or the escape key is pressed. * * The `onHide` callback only signals intent from the Modal, * you must actually set the `show` prop to `false` for the Modal to close. */ onHide?: () => void; /** * A ModalManager instance used to track and manage the state of open * Modals. Useful when customizing how modals interact within a container */ manager?: ModalManager; /** * Include a backdrop component. A `static`backdrop * will not trigger a Modal onHide when clicked. */ backdrop?: true | false | 'static'; /** * A function that returns the dialog component. Useful for custom * rendering. **Note:** the component should make sure to apply the provided ref. * * ```js static * renderDialog={props => } * ``` */ renderDialog?: (props: RenderModalDialogProps) => React.ReactNode; /** * A function that returns a backdrop component. Useful for custom * backdrop rendering. * * ```js * renderBackdrop={props => } * ``` */ renderBackdrop?: (props: RenderModalBackdropProps) => React.ReactNode; /** * A callback fired when the escape key, if specified in `keyboard`, is pressed. * * If preventDefault() is called on the keyboard event, closing the modal will be cancelled. */ onEscapeKeyDown?: (e: KeyboardEvent) => void; /** * A callback fired when the backdrop, if specified, is clicked. */ onBackdropClick?: (e: React.SyntheticEvent) => void; /** * Close the modal when escape key is pressed */ keyboard?: boolean; /** * A `react-transition-group` `` component used * to control animations for the dialog component. */ transition?: ModalTransitionComponent; /** * A `react-transition-group` `` component used * to control animations for the backdrop components. */ backdropTransition?: ModalTransitionComponent; /** * When `true` The modal will automatically shift focus to itself when it opens, and * replace it to the last focused element when it closes. This also * works correctly with any Modal children that have the `autoFocus` prop. * * Generally this should never be set to `false` as it makes the Modal less * accessible to assistive technologies, like screen readers. */ autoFocus?: boolean; /** * When `true` The modal will prevent focus from leaving the Modal while open. * * Generally this should never be set to `false` as it makes the Modal less * accessible to assistive technologies, like screen readers. */ enforceFocus?: boolean; /** * When `true` The modal will restore focus to previously focused element once * modal is hidden */ restoreFocus?: boolean; /** * Options passed to focus function when `restoreFocus` is set to `true` * * @link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/focus#Parameters */ restoreFocusOptions?: { preventScroll: boolean; }; } export interface ModalProps extends BaseModalProps { [other: string]: any; } export interface ModalHandle { dialog: HTMLElement | null; backdrop: HTMLElement | null; } declare const _default: React.ForwardRefExoticComponent> & { Manager: typeof ModalManager; }; export default _default;