import { MutableRefObject, PropsWithChildren, ReactElement } from 'react';
import { ShowModalProps } from './LuiModalAsyncContext';
export interface LuiModalAsyncInstance {
    uuid: string;
    ownerRef: MutableRefObject<HTMLElement | null>;
    componentInstance: ReactElement;
    resolve: (result: any) => void;
    showModalProps?: ShowModalProps;
}
/**
 * Provides the ability to show modals using react components without needing useState boilerplate and inline dialogs.
 *
 * To use:
 * <ol>
 * <li>Add this Provider somewhere in your standard providers
 * <pre>
 * <LuiModalAsyncContextProvider>
 *    ...children
 * </LuiModalAsyncContextProvider>
 * </pre>
 * </li>
 * <li>Add the modal return type to the element as below, and use the props resolve/close from ModalProps for results.
 * <pre>
 * export interface SomeModalProps extends ModalProps<number> {
 *   someProp?: number; // user props
 * }
 *
 * export const SomeModal = ({initialState, resolve, close}: SomeModalProps): ReactElement => {
 *    return Modal(
 *       <div>
 *           Itsa me, I'm a modal
 *          <button onClick={close}>Cancel</button>
 *          <button onClick={()=>resolve(someProp)}>Save</button>
 *       </div>
 *    )}
 * }
 * </pre>
 * </li>
 * <li> To show the dialog and get the result...
 * <pre>
 *   // Note: modalOwnerRef is only required if you need to support popout windows
 *   const { showModal, modalOwnerRef  } = useShowAsyncModal();
 *   ...
 *   const showModal = () => {
 *     const result = await showModal(SomeModal, { someProp: 1 });
 *     if (!result) return; // modal cancelled
 *   }
 *
 *   return <button onClick={showModal} ref={modalOwnerRef}>Show Modal!</button>
 * </pre>
 * </li>
 * </ol>
 */
export declare const LuiModalAsyncContextProvider: ({ children }: PropsWithChildren<unknown>) => ReactElement;