import { ToastActionElement, ToastProps } from '.';
import * as React from "react";
type ToasterToast = ToastProps & {
    id: string;
    title?: React.ReactNode;
    description?: React.ReactNode;
    action?: ToastActionElement;
};
declare const actionTypes: {
    readonly ADD_TOAST: "ADD_TOAST";
    readonly UPDATE_TOAST: "UPDATE_TOAST";
    readonly DISMISS_TOAST: "DISMISS_TOAST";
    readonly REMOVE_TOAST: "REMOVE_TOAST";
};
type ActionType = typeof actionTypes;
type Action = {
    type: ActionType["ADD_TOAST"];
    toast: ToasterToast;
} | {
    type: ActionType["UPDATE_TOAST"];
    toast: Partial<ToasterToast>;
} | {
    type: ActionType["DISMISS_TOAST"];
    toastId?: ToasterToast["id"];
} | {
    type: ActionType["REMOVE_TOAST"];
    toastId?: ToasterToast["id"];
};
interface State {
    toasts: ToasterToast[];
}
export declare const reducer: (state: State, action: Action) => State;
type Toast = Omit<ToasterToast, "id">;
declare function toast({ duration, ...restProps }: Toast): {
    id: string;
    dismiss: () => void;
    update: (props: ToasterToast) => void;
};
/**
 * Toast component as defined in the [NDI Foundation Styles](https://www.figma.com/design/GAUHP88uShhyadfBuEhJrz/[NDI-Web]-Foundation-Styles?node-id=1006-2&t=gzOfoK9ZlYCQivfS-0)
 *
 * `<Toaster/>` needs to be placed in your app's root component before using the `useToast` hook.
 *
 * Setup:
 * ```
 * import { Toaster } from `@mooxin/mx-ui`;
 * function App() {
 * 	return (
 * 		<>
 * 			<YourApp />
 * 			<Toaster />
 * 		</>
 * 	);
 * }
 * ```
 * Usage:
 * ```
 * function YourComponent() {
 * 	const toast = useToast();
 * 	const onClick = () => {
 * 		toast({
 *				description: "Friday, February 10, 2023 at 5:57 PM",
 * 		});
 * 	};
 * 	return <Button onClick={onClick}>Click Me</Button>;
 * }
 * ```
 *
 */
declare function useToast(): {
    toast: typeof toast;
    dismiss: (toastId?: string) => void;
    toasts: ToasterToast[];
};
export { useToast, toast };
