/** * Copyright Zendesk, Inc. * * Use of this source code is governed under the Apache License, Version 2.0 * found at http://www.apache.org/licenses/LICENSE-2.0. */ import { HTMLProps, KeyboardEvent, MouseEvent, ReactNode, RefObject } from 'react'; export interface IUseModalProps { /** Handles close actions */ onClose?: (event: KeyboardEvent | MouseEvent) => void; /** Provides ref access to the underlying dialog element */ modalRef: RefObject; /** Prefixes IDs for modal elements */ idPrefix?: string; /** Directs keyboard focus to the modal on mount */ focusOnMount?: boolean; /** Returns keyboard focus to the element that triggered the modal */ restoreFocus?: boolean; /** Sets the environment where the modal is rendered */ environment?: Document; } export interface IUseModalReturnValue { getBackdropProps: (props?: HTMLProps) => HTMLProps; getModalProps: (props?: Omit, 'role'> & { role?: 'dialog' | null; }) => HTMLProps; getTitleProps: (props?: HTMLProps) => HTMLProps; getContentProps: (props?: HTMLProps) => HTMLProps; getCloseProps: (props: Omit, 'aria-label'> & { 'aria-label': NonNullable['aria-label']>; }) => HTMLProps; closeModal?: IUseModalProps['onClose']; } export interface IModalContainerProps extends IUseModalProps { /** * Provides modal render prop functions * * @param {function} [options.getBackdropProps] Backdrop props getter * @param {function} [options.getModalProps] Modal dialog props getter * @param {function} [options.getCloseProps] Modal close button props getter * @param {function} [options.getTitleProps] Modal title props getter * @param {function} [options.getContentProps] Modal content props getter */ render?: (options: { getBackdropProps: IUseModalReturnValue['getBackdropProps']; getModalProps: IUseModalReturnValue['getModalProps']; getCloseProps: IUseModalReturnValue['getCloseProps']; getTitleProps: IUseModalReturnValue['getTitleProps']; getContentProps: IUseModalReturnValue['getContentProps']; closeModal?: IUseModalReturnValue['closeModal']; }) => ReactNode; /** @ignore */ children?: (options: IUseModalReturnValue) => ReactNode; }