import { TemplateRef, Type } from '@angular/core'; export type Expand = T extends object ? T extends infer O ? { [K in keyof O]: O[K]; } : never : T; export type ToastTypes = 'action' | 'success' | 'info' | 'warning' | 'error' | 'loading' | 'default'; export type PromiseT = Promise | (() => Promise); export type PromiseData = ExternalToast & { loading?: string | Type; success?: string | Type | ((data: ToastData) => Type | string); error?: string | Type | ((error: unknown) => Type | string); finally?: () => void | Promise; }; export type ToastT = { /** * Custom id for the toast. * * @default autogenerated */ id: number | string; title?: string | Type; type?: ToastTypes; /** * Icon displayed in front of toast's text, aligned vertically. */ icon?: Type; component?: Type; componentProps?: Record; /** * Dark toast in light mode and vice versa. * * @default false */ invert?: boolean; /** * Adds a close button. * * @default false */ closeButton?: boolean; /** * If `false`, it'll prevent the user from dismissing the toast by swiping. * * @default true */ dismissible?: boolean; /** * Toast's description, renders underneath the title. */ description?: string | Type; /** * Time in milliseconds that should elapse before automatically closing the toast. * * @default 4000 */ duration?: number; delete?: boolean; /** * Control the sensitivity of the toast for screen readers. * * @default false */ important?: boolean; /** * Renders a primary button, clicking it will close the toast. */ action?: { label: string; onClick: (event: MouseEvent) => void; }; /** * Renders a secondary button, clicking it will close the toast. */ cancel?: { label: string; onClick?: () => void; }; /** * The function gets called when either the close button is clicked, or the toast is swiped. * * @param toast */ onDismiss?: (toast: ToastT) => void; /** * Function that gets called when the toast disappears automatically after it's timeout (duration` prop). * * @param toast */ onAutoClose?: (toast: ToastT) => void; promise?: PromiseT; cancelButtonStyle?: string; actionButtonStyle?: string; style?: Record; /** * Removes the default styling, which allows for easier customization. */ unstyled?: boolean; class?: string; classes?: ToastClassnames; descriptionClass?: string; /** * Position of the toast. * * @default 'bottom-right' */ position?: Position; /** * @internal This is used to determine if the toast has been updated to determine when to reset timer. */ updated?: boolean; }; export type Position = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'top-center' | 'bottom-center'; export type HeightT = { height: number; toastId: number | string; }; export type Theme = 'light' | 'dark' | 'system'; export type ToastToDismiss = { id: number | string; dismiss: boolean; }; export type ExternalToast = Omit & { id?: number | string; }; export type ToasterProps = { /** * Dark toasts in light mode and vice versa. * * @default false */ invert: boolean; /** * Toast's theme, either `light`, `dark`, or `system` * * @default 'light' */ theme: 'light' | 'dark' | 'system'; /** * Place where the toasts will be rendered * * @default 'bottom-right' */ position: Position; /** * Keyboard shortcut that will move focus to the toaster area. * * @default '⌥/alt + T' */ hotkey: string[]; /** * Makes error and success state more colorful * * @default false */ richColors: boolean; /** * Toasts will be expanded by default * * @default false */ expand: boolean; /** * The duration of the toast in milliseconds. * * @default 4000 */ duration: number; /** * Amount of visible toasts * * @default 3 */ visibleToasts: number; /** * Adds a close button to all toasts, shows on hover * * @default false */ closeButton: boolean; /** * These will act as default options for all toasts. * * @default {} */ toastOptions: ToastOptions; /** * Offset from the edges of the screen. * * @default '32px' */ offset: string | number | null; /** * Directionality of toast's text * * @default 'ltr' */ dir: 'ltr' | 'rtl' | 'auto'; /** * Gap between toasts when expanded, in pixels. * * @default '14px' */ gap: number; /** * Changes the default loading icon * * @default - */ loadingIcon: TemplateRef; }; export type ToastOptions = { /** * The classes applied to the toast element. */ class?: string; /** * The classes applied to the toast description element. */ descriptionClass?: string; /** * The CSS styles applied to the toast element. */ style?: Record; /** * The CSS styles applied to the cancel button element. */ cancelButtonStyle?: string; /** * The CSS styles applied to the action button element. */ actionButtonStyle?: string; /** * The duration of the toast in milliseconds. */ duration?: number; /** * Whether the toast should be unstyled or not. */ unstyled?: boolean; /** * Classes to apply to the various elements of the toast. */ classes?: Expand; }; /** * The classes applied to the various elements of the toast. */ export type ToastClassnames = { toast?: string; title?: string; description?: string; loader?: string; closeButton?: string; cancelButton?: string; actionButton?: string; } & ToastTypeClasses; type ToastTypeClasses = Partial>; export type ToastProps = { toast: ToastT; index: number; expanded: boolean; invert: boolean; position: Position; visibleToasts: number; expandByDefault: boolean; closeButton: boolean; interacting: boolean; cancelButtonStyle: string; actionButtonStyle: string; duration: number | null; descriptionClass: string; classes: ToastClassnames; unstyled: boolean; }; export {};