import * as React from "react"; import { utils } from "../../utilities/utils"; import { Dialog, IDialogLayerPropsCore } from "./dialog"; const DialogProviderContext = React.createContext(undefined) export const DialogProvider: React.FC<{}> = p => { const ref = React.useRef() return ( ref.current && ref.current.useDialogPromise(component, argument, settings) }}> {p.children} ) } export function useDialogProvider(component: React.FC>, settings?: IDialogSettings) { const ctx = React.useContext(DialogProviderContext) if (!ctx) { // tslint:disable-next-line: no-console console.log("You are trying to use DialogProvider Context, but no DialogProvider was found in the component hierarchy"); } return React.useCallback((argument?: TArg) => ctx.useDialogPromise(component, argument, settings), [component, settings]) } export function useConfirmDialogProvider(component: React.FC>, settings?: IDialogSettings) { return useDialogProvider(component, settings) } interface IDialogSettings extends IDialogLayerPropsCore { allowCloseOnBackgroundClick?: boolean } interface IDialogContent extends IDialogSettings { body: React.ReactNode close: () => void } export interface IDialogProviderProps { close(): void choose(data: T): void argument?: TArg } interface IDialogStackRef { useDialogPromise(component: React.FC>, argument: TArg, settings?: IDialogSettings): Promise } function DialogStackRef(props: {}, ref: React.Ref) { const [dialogContent, setDialogContent] = React.useState([]) const closeDialog = React.useCallback(() => { setDialogContent([...utils.array.first(dialogContent, dialogContent.length - 1)]) }, [dialogContent, setDialogContent]) React.useImperativeHandle(ref, () => ({ useDialogPromise(Body: React.FC>, argument: TArg, settings?: IDialogSettings) { return new Promise(async resolve => { const choose = (d?: TResult) => { closeDialog() resolve(d) } const close = () => { closeDialog() resolve() } setDialogContent([...dialogContent, { body: , close, ...(settings || {}) }]) }) }, }), [dialogContent, closeDialog, setDialogContent]) return ( <> {dialogContent.map((dc, idx) => ( ))} ) } const DialogStack = React.forwardRef(DialogStackRef)