@cerberus-design/react/dist/context/prompt-modal.d.cts

The Cerberus Design React component library.

import { PropsWithChildren } from 'react';
/**
 * This module provides a context and hook for the prompt modal.
 * @module PromptModal
 */
export interface ShowPromptModalOptions {
    /**
     * The kind of prompt modal to show.
     * @default 'non-destructive'
     */
    kind?: 'destructive' | 'non-destructive';
    /**
     * The heading of the prompt modal.
     */
    heading: string;
    /**
     * The description of the prompt modal.
     */
    description?: string;
    /**
     * The key to confirm the action.
     */
    key: string;
    /**
     * The text for the action button.
     */
    actionText: string;
    /**
     * The text for the cancel button.
     */
    cancelText: string;
}
export type PromptShowResult = ((value: string | PromiseLike<string>) => void) | null;
export interface PromptModalValue {
    /**
     * The method to trigger the prompt modal.
     * @returns the value of the key if the action is confirmed.
     * @example
     * ```tsx
     * const accepted = await prompt.show({
     *  kind: 'destructive',
     *  heading: 'Delete channel?',
     *  description:
     *   'This will permanently delete a channel on your account. There is no going back.',
     *  key: CHANNEL_NAME,
     *  actionText: 'Yes, delete channel',
     *  cancelText: 'No, cancel',
     * })
     */
    show: (options: ShowPromptModalOptions) => Promise<string>;
}
export type PromptModalProviderProps = PropsWithChildren<unknown>;
/**
 * Provides a prompt modal to the app.
 * @see https://cerberus.digitalu.design/react/prompt-modal
 * @example
 * ```tsx
 * // Wrap the Provider around the root of the feature.
 * <PromptModal>
 *   <SomeFeatureSection />
 * </PromptModal>
 *
 * // Use the hook to show the prompt modal.
 * const prompt = usePromptModal()
 *
 * const handleClick = useCallback(async () => {
 *  const accepted = await prompt.show({
 *   kind: 'destructive',
 *   heading: 'Delete channel?',
 *  description:
 *   'This will permanently delete a channel on your account. There is no going back.',
 * key: CHANNEL_NAME,
 * actionText: 'Yes, delete channel',
 * cancelText: 'No, cancel',
 * })
 * // do something with accepted
 * }, [prompt])
 * ```
 */
export declare function PromptModal(props: PropsWithChildren<PromptModalProviderProps>): import("react/jsx-runtime").JSX.Element;
/**
 * Used to retrieve the context of the PromptModal provider.
 */
export declare function usePromptModal(): PromptModalValue;