import { ReactNode, CSSProperties } from 'react';
import { CourierToastTheme, CourierToast as CourierToastElement, CourierToastItemFactoryProps, CourierToastDismissButtonOption, CourierToastItemClickEvent, CourierToastItemActionClickEvent } from '@trycourier/courier-ui-toast';
import { CourierComponentThemeMode } from '@trycourier/courier-ui-core';
/** Props that may be passed to the CourierToast component. */
export interface CourierToastProps {
    /**
     * Styles applied to the CourierToast component.
     *
     * By default, the component has the following styles:
     *
     * ```css
     * position: "fixed";
     * width: "380px";
     * top: "30px";
     * right: "30px";
     * z-index: 999;
     * ```
     *
     * Setting styles directly on the component is useful to customize the component's
     * position and layout. Setting `height` is effectively a no-op, as `height`
     * will be dynamically set by the component as toast items are added and removed.
     */
    style?: CSSProperties;
    /** Theme object used to render the component when light mode is used. */
    lightTheme?: CourierToastTheme;
    /** Theme object used to render the component when dark mode is used. */
    darkTheme?: CourierToastTheme;
    /** Manually set the theme mode to one of "light", "dark", or "system". Defaults to "system". */
    mode?: CourierComponentThemeMode;
    /** Enable toasts to auto-dismiss, including a timer bar at the top of the toast. Defaults to false. */
    autoDismiss?: boolean;
    /**
     * The timeout before a toast auto-dismisses, if {@link CourierToastProps.autoDismiss} is enabled.
     * Defaults to 5000ms.
     */
    autoDismissTimeoutMs?: number;
    /**
     * Set the dismiss button's visibility.
     *
     * Defaults to "auto", which makes the button always visible if `autoDismiss` is false
     * and visible on hover if `autoDismiss` is true.
     */
    dismissButton?: CourierToastDismissButtonOption;
    /** Callback function invoked when a toast item is clicked. */
    onToastItemClick?: (props: CourierToastItemClickEvent) => void;
    /** Callback function invoked when a toast item action button is clicked. */
    onToastItemActionClick?: (props: CourierToastItemActionClickEvent) => void;
    /**
     * Callback function invoked when the component is ready to receive messages.
     *
     * Use onReady to ensure CourierToast has applied event listeners and
     * render props passed to the component before toasts are presented.
     *
     * @example
     * ```tsx
     * const [toastReady, setToastReady] = useState(false);
     * const courier = useCourier();
     *
     * useEffect(() => {
     *   if (toastReady) {
     *     courier.shared.signIn({ userId, jwt });
     *   }
     * }, [toastReady]);
     *
     * return <CourierToast onReady={setToastReady} renderToastItem={myCustomItem} />
     * ```
     */
    onReady?: (ready: boolean) => void;
    /** Render prop specifying how to render an entire toast item. */
    renderToastItem?: (props: CourierToastItemFactoryProps) => ReactNode;
    /**
     * Render prop specifying how to render a toast item's content.
     *
     * The toast item's container, including the stack, auto-dismiss timer, and dismiss button
     * are still present when this prop is set.
     *
     * This callback is stabilized internally, so wrapping it in `useCallback` is optional.
     * Memoizing in parent components can still reduce parent re-renders.
     *
     * See {@link CourierToastProps.dismissButton} to customize the dismiss button's visibility and
     * {@link CourierToastProps.renderToastItem} to customize the entire toast item, including
     * its container.
     */
    renderToastItemContent?: (props: CourierToastItemFactoryProps) => ReactNode;
}
export declare const CourierToastComponent: import('react').ForwardRefExoticComponent<CourierToastProps & import('react').RefAttributes<CourierToastElement>>;