No puede seleccionar más de 25 temas Los temas deben comenzar con una letra o número, pueden incluir guiones ('-') y pueden tener hasta 35 caracteres de largo.
 
 
 

543 líneas
16 KiB

  1. import { App } from 'vue';
  2. import { ComputedRef } from 'vue';
  3. import { DefineComponent } from 'vue';
  4. import { DefineSetupFnComponent } from 'vue';
  5. import { Events } from 'vue';
  6. import { Plugin as Plugin_2 } from 'vue';
  7. import { PublicProps } from 'vue';
  8. import { Ref } from 'vue';
  9. import { VNode } from 'vue';
  10. export declare function addExitAnimateToNode(item: ToastOptions, clasback?: (node: HTMLElement) => void): void;
  11. export declare const enum AnimationStep {
  12. Enter = 0,
  13. Exit = 1
  14. }
  15. export declare function appendFromQueue(): void;
  16. export declare const Bounce: CSSTransitionProps;
  17. export declare type BuiltInIconProps = HTMLOrSVGElement & IconProps;
  18. export declare function cacheRenderInstance(app: App<Element>, id: Id): void;
  19. export declare function clearContainers(withExitAnimation?: boolean): void;
  20. export declare type CloseBtnType = boolean | ((props: CloseButtonProps) => VNode) | DefineComponent<IconProps, {}, {}>;
  21. export declare interface CloseButtonProps {
  22. closeToast: (e: MouseEvent) => void;
  23. type: ToastType;
  24. ariaLabel?: string;
  25. theme: ToastTheme;
  26. }
  27. export declare const containerInstances: Record<string, App<Element>>;
  28. export declare type Content = string | VNode | ((props: ToastContentProps) => VNode) | DefineComponent<{}, {}, any>;
  29. export declare interface CSSTransitionProps {
  30. /**
  31. * Css class to apply when toast enter
  32. */
  33. enter: string;
  34. /**
  35. * Css class to apply when toast leave
  36. */
  37. exit: string;
  38. /**
  39. * Append current toast position to the classname.
  40. * If multiple classes are provided, only the last one will get the position
  41. * For instance `myclass--top-center`...
  42. * `Default: false`
  43. */
  44. appendPosition?: boolean;
  45. /**
  46. * Collapse toast smoothly when exit animation end
  47. * `Default: true`
  48. */
  49. collapse?: boolean;
  50. /**
  51. * Collapse transition duration (auto disable when collapse: false)
  52. * `Default: 300`
  53. */
  54. collapseDuration?: number;
  55. }
  56. export declare type Data = Record<string, unknown>;
  57. export declare function doAppend(content: Content, options?: ToastOptions): void;
  58. declare type EventHandlers<E> = {
  59. [K in keyof E]?: E[K] extends Function ? E[K] : (payload: E[K]) => void;
  60. };
  61. export declare const Flip: CSSTransitionProps;
  62. export declare function getAllToast(): ToastOptions<{}>[];
  63. /**
  64. * Get the toast by id, given it's in the DOM, otherwise returns null
  65. */
  66. export declare function getToast(toastId: Id): ToastOptions<{}> | undefined;
  67. export declare const globalCache: {
  68. lastUrl: string;
  69. };
  70. export declare const globalOptions: {
  71. [key: string]: ToastContainerOptions;
  72. };
  73. declare function handlePromise<T = unknown>(promise: Promise<T> | (() => Promise<T>), { pending, error, success }: ToastPromiseParams<T>, options?: OmitLoadingOptsToastOption): Promise<T>;
  74. /**
  75. * Used when providing custom icon
  76. */
  77. export declare interface IconProps {
  78. theme: ToastTheme;
  79. type: ToastType;
  80. path?: string;
  81. }
  82. export declare type IconType = boolean | string | number | VNode | ((props: IconProps) => VNode) | DefineComponent<IconProps, {}, {}>;
  83. export declare type Id = number | string;
  84. export declare interface IToastContainers {
  85. [containerId: Id]: ToastOptions[];
  86. }
  87. declare type Nullable<T> = {
  88. [P in keyof T]: T[P] | null;
  89. };
  90. declare type OmitLoadingOptsToastOption = Omit<ToastOptions, 'isLoading' | 'draggable'>;
  91. declare type OmitThemeToastOption = Omit<ToastOptions, 'theme'>;
  92. declare type OmitTypeToastOption = Omit<ToastOptions, 'type' | 'disabledEnterTransition'>;
  93. /**
  94. * options for toast
  95. */
  96. export declare interface Options {
  97. /**
  98. * use like
  99. * ```
  100. * toast.info("Hello World.\n I am <b>Tom</b>", { dangerouslyHTMLString: true });
  101. * ```
  102. *
  103. * @default false
  104. */
  105. dangerouslyHTMLString?: boolean;
  106. /**
  107. * Support right to left content
  108. * @default false
  109. */
  110. rtl?: boolean;
  111. /** Used to identify the ToastContainer when working with multiple container. Also used to set the id attribute */
  112. containerId?: Id;
  113. /**
  114. * One of top-right, top-center, top-left, bottom-right, bottom-center, bottom-left
  115. * @mark {@link ToastPosition}
  116. * @default 'top-right'
  117. */
  118. position?: ToastPosition;
  119. /**
  120. * Delay in ms to close the toast. If set to false, the notification needs to be closed manually
  121. * @default 5000
  122. */
  123. autoClose?: number | boolean;
  124. /**
  125. * Pass a custom close button.
  126. * To remove the close button pass `false`
  127. */
  128. closeButton?: CloseBtnType;
  129. /**
  130. * A reference to a valid react-transition-group/Transition component
  131. * @default 'bounce'
  132. */
  133. transition?: ToastTransition | CSSTransitionProps;
  134. /**
  135. * disabled the enter transition (for system)
  136. * @default false
  137. */
  138. disabledEnterTransition?: boolean;
  139. /**
  140. * Display or not the progress bar below the toast(remaining time)
  141. * @default false
  142. */
  143. hideProgressBar?: boolean;
  144. /**
  145. * Keep the timer running or not on hover
  146. * @default true
  147. */
  148. pauseOnHover?: boolean;
  149. /**
  150. * Pause the timer when the window loses focus
  151. * @default true
  152. */
  153. pauseOnFocusLoss?: boolean;
  154. /**
  155. * Dismiss toast on click
  156. * @default true
  157. */
  158. closeOnClick?: boolean;
  159. /**
  160. * Add optional classes to the toast wrapper
  161. * @default -
  162. */
  163. toastClassName?: string;
  164. /**
  165. * Add optional classes to the TransitionGroup container
  166. * @default ''
  167. */
  168. bodyClassName?: string;
  169. /**
  170. * Add optional inline style to the container
  171. * @default {}
  172. */
  173. style?: Record<string, any>;
  174. /**
  175. * Add optional classes to the progress bar
  176. * @default -
  177. */
  178. progressClassName?: string;
  179. /**
  180. * Add optional inline style to the progress bar
  181. * @default {}
  182. */
  183. progressStyle?: Record<string, any>;
  184. /**
  185. * Define the ARIA role for the toasts
  186. * @default 'alert'
  187. */
  188. role?: string;
  189. /**
  190. * One of auto, light, dark, colored
  191. * @description `auto` means automatically detects system theme colors
  192. * @mark {@link ToastTheme}
  193. * @default 'auto'
  194. */
  195. theme?: ToastTheme;
  196. /**
  197. * Used to display a custom icon. Set it to `false` to prevent
  198. * the icons from being displayed
  199. * @default -
  200. */
  201. icon?: IconType;
  202. }
  203. declare interface OtherProps extends ToastOptions, ToastContainerOptions {
  204. toastRef: Ref<HTMLDivElement | undefined>;
  205. loading: ComputedRef<boolean>;
  206. /** on propgress end or cancel */
  207. done?: () => void;
  208. }
  209. export declare const queue: {
  210. items: {
  211. toastId: Id;
  212. containerId: Id;
  213. toastContent: Content;
  214. toastProps: {
  215. toastId?: Id | undefined;
  216. updateId?: Id | undefined;
  217. content?: Content | undefined;
  218. data?: {} | undefined;
  219. type?: ToastType | undefined;
  220. delay?: number | undefined;
  221. onOpen?: (<T = {}>(props: T) => void) | undefined;
  222. onClose?: (<T = {}>(props: T) => void) | undefined;
  223. onClick?: ((event: MouseEvent) => void) | undefined;
  224. toastStyle?: Record<string, any> | undefined;
  225. progress?: number | undefined;
  226. isLoading?: boolean | undefined;
  227. dangerouslyHTMLString?: boolean | undefined;
  228. rtl?: boolean | undefined;
  229. containerId?: Id | undefined;
  230. position?: ToastPosition | undefined;
  231. autoClose?: (number | boolean) | undefined;
  232. closeButton?: CloseBtnType | undefined;
  233. transition?: ToastTransition | {
  234. enter: string;
  235. exit: string;
  236. appendPosition?: boolean | undefined;
  237. collapse?: boolean | undefined;
  238. collapseDuration?: number | undefined;
  239. } | undefined;
  240. disabledEnterTransition?: boolean | undefined;
  241. hideProgressBar?: boolean | undefined;
  242. pauseOnHover?: boolean | undefined;
  243. pauseOnFocusLoss?: boolean | undefined;
  244. closeOnClick?: boolean | undefined;
  245. toastClassName?: string | undefined;
  246. bodyClassName?: string | undefined;
  247. style?: Record<string, any> | undefined;
  248. progressClassName?: string | undefined;
  249. progressStyle?: Record<string, any> | undefined;
  250. role?: string | undefined;
  251. theme?: ToastTheme | undefined;
  252. icon?: IconType | undefined;
  253. clearOnUrlChange?: boolean | undefined;
  254. multiple?: boolean | undefined;
  255. limit?: number | undefined;
  256. newestOnTop?: boolean | undefined;
  257. containerClassName?: string | undefined;
  258. };
  259. }[];
  260. };
  261. export declare function removeContainer(containerId: Id, withExitAnimation?: boolean): void;
  262. export declare const Slide: CSSTransitionProps;
  263. export declare interface Toast {
  264. content: Content;
  265. props: ToastOptions;
  266. }
  267. /** default toast */
  268. export declare const toast: {
  269. (content: Content, options?: ToastOptions): Id;
  270. /** info toast */
  271. info(content: Content, options?: OmitTypeToastOption): Id;
  272. /** error toast */
  273. error(content: Content, options?: OmitTypeToastOption): Id;
  274. /** warning toast */
  275. warning(content: Content, options?: OmitTypeToastOption): Id;
  276. warn: (content: Content, options?: OmitTypeToastOption) => Id;
  277. /** success toast */
  278. success(content: Content, options?: OmitTypeToastOption): Id;
  279. /** loading toast */
  280. loading(content: Content, options?: OmitLoadingOptsToastOption): Id;
  281. /** dark toast */
  282. dark(content: Content, options?: OmitThemeToastOption): Id;
  283. /** remove a toast */
  284. remove(toastId?: Id): void;
  285. /** clear all toast */
  286. clearAll(containerId?: Id, withExitAnimation?: boolean): void;
  287. /**
  288. * return true if one container is displaying the toast
  289. */
  290. isActive(toastId: Id): boolean;
  291. update(toastId: Id, options?: UpdateOptions): void;
  292. /**
  293. * Used for controlled progress bar.
  294. */
  295. done(id: Id): void;
  296. promise: typeof handlePromise;
  297. POSITION: {
  298. TOP_LEFT: ToastPosition;
  299. TOP_RIGHT: ToastPosition;
  300. TOP_CENTER: ToastPosition;
  301. BOTTOM_LEFT: ToastPosition;
  302. BOTTOM_RIGHT: ToastPosition;
  303. BOTTOM_CENTER: ToastPosition;
  304. };
  305. THEME: {
  306. AUTO: ToastTheme;
  307. LIGHT: ToastTheme;
  308. DARK: ToastTheme;
  309. COLORED: ToastTheme;
  310. };
  311. TYPE: {
  312. INFO: ToastType;
  313. SUCCESS: ToastType;
  314. WARNING: ToastType;
  315. ERROR: ToastType;
  316. DEFAULT: ToastType;
  317. };
  318. TRANSITIONS: {
  319. FLIP: ToastTransition;
  320. SLIDE: ToastTransition;
  321. ZOOM: ToastTransition;
  322. BOUNCE: ToastTransition;
  323. NONE: ToastTransition;
  324. };
  325. };
  326. export declare const ToastActions: {
  327. /**
  328. * add a toast
  329. * @param _ ..
  330. * @param opts toast props
  331. */
  332. add(_: Content, opts: ToastSetting): void;
  333. /**
  334. * remove a toast
  335. * @param id toastId
  336. */
  337. remove(id?: Id): void;
  338. /**
  339. * update the toast
  340. * @param opts toast props
  341. */
  342. update(opts?: UpdateOptions): void;
  343. /**
  344. * clear all toasts in container.
  345. * @param containerId container id
  346. */
  347. clear(containerId?: Id, withExitAnimation?: boolean): void;
  348. dismissCallback(evt: AnimationEvent): void;
  349. dismiss(toastId?: Id): void;
  350. dismissForce(toastId?: Id): void;
  351. };
  352. /**
  353. * ClassName for the elements - can take a function to build a classname or a raw string that is cx'ed to defaults
  354. */
  355. export declare type ToastClassName = ((context?: {
  356. type?: ToastType;
  357. defaultClassName?: string;
  358. position?: ToastPosition;
  359. rtl?: boolean;
  360. }) => string) | string;
  361. /**
  362. * options for app.use
  363. */
  364. export declare interface ToastContainerOptions extends Options {
  365. /**
  366. * clear all toasts on url change
  367. * @default true
  368. */
  369. clearOnUrlChange?: boolean;
  370. /**
  371. * support multiple
  372. * @default true
  373. */
  374. multiple?: boolean;
  375. /**
  376. * Limit the number of toast displayed at the same time
  377. *
  378. * @default undefined
  379. *
  380. * @ignore Auto disabled when `multiple: false`
  381. */
  382. limit?: number;
  383. /**
  384. * Display newest toast on top
  385. * @default false
  386. */
  387. newestOnTop?: boolean;
  388. /**
  389. * Add optional classes to the container
  390. * @default -
  391. */
  392. containerClassName?: string;
  393. }
  394. export declare const toastContainers: IToastContainers;
  395. export declare type ToastContent<T = unknown> = string | VNode | ((props: ToastContentProps<T>) => string | VNode) | DefineComponent<{}, {}, any> | (() => string);
  396. export declare interface ToastContentProps<Data = {}> {
  397. closeToast?: (e?: MouseEvent) => void;
  398. toastProps?: ToastOptions;
  399. data: Data;
  400. }
  401. export declare type ToastFunc = {
  402. (content: Content, options?: ToastOptions): void;
  403. };
  404. export declare const ToastifyContainer: DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, PublicProps>;
  405. export declare type ToastItemStatus = 'added' | 'removed' | 'updated';
  406. export declare interface ToastOptions<Data = {}> extends Options {
  407. /**
  408. * Set a custom `toastId`
  409. */
  410. toastId?: Id;
  411. /**
  412. * Used during update
  413. */
  414. updateId?: Id;
  415. /** toast content */
  416. content?: Content;
  417. /**
  418. * any additional data you want to pass toast("content", { data: {key: value} })
  419. * @default {}
  420. */
  421. data?: Data;
  422. /**
  423. * One of info, success, warning, error, default, loading
  424. * @mark {@link ToastType}
  425. * @default 'default'
  426. */
  427. type?: ToastType;
  428. /**
  429. * Let you delay the toast appearance. Pass a value in ms
  430. * @default -
  431. */
  432. delay?: number;
  433. /**
  434. * Called when toast is mounted.
  435. */
  436. onOpen?: <T = {}>(props: T) => void;
  437. /**
  438. * Called when toast is unmounted.
  439. */
  440. onClose?: <T = {}>(props: T) => void;
  441. /**
  442. * Called when click inside Toast notification
  443. * @default -
  444. */
  445. onClick?: (event: MouseEvent) => void;
  446. /**
  447. * An optional inline style to apply.
  448. */
  449. toastStyle?: Record<string, any>;
  450. /**
  451. * Set the percentage for the controlled progress bar. `Value must be between 0 and 1.`
  452. */
  453. progress?: number;
  454. /** Only available when using `toast.loading' */
  455. isLoading?: boolean;
  456. }
  457. export declare type ToastPosition = 'top-left' | 'top-right' | 'top-center' | 'bottom-left' | 'bottom-right' | 'bottom-center';
  458. export interface ToastPromiseParams<T = unknown> {
  459. pending?: string | UpdateOptions<void>;
  460. success?: string | UpdateOptions<T>;
  461. error?: string | UpdateOptions<any>;
  462. }
  463. declare type ToastSetting = ToastOptions & ToastContainerOptions;
  464. export declare type ToastTheme = 'auto' | 'light' | 'dark' | 'colored';
  465. export declare type ToastTransition = 'zoom' | 'flip' | 'bounce' | 'slide' | 'none';
  466. export declare type ToastType = 'info' | 'success' | 'error' | 'warning' | 'loading' | 'default';
  467. export declare function updateGlobalOptions(options?: Partial<ToastContainerOptions>): void;
  468. export declare interface UpdateOptions<T = unknown> extends Nullable<ToastOptions<T>> {
  469. /**
  470. * Used to update a toast.
  471. * Pass any valid ReactNode(string, number, component)
  472. */
  473. render?: ToastContent<T>;
  474. }
  475. export declare function useCssTransition(props: CSSTransitionProps & OtherProps): {
  476. isIn: Ref<boolean>;
  477. isRunning: Ref<boolean>;
  478. hideToast: (e?: MouseEvent) => void;
  479. eventHandlers: ComputedRef<EventHandlers<Events>>;
  480. };
  481. declare const Vue3Toastify: Plugin_2;
  482. export default Vue3Toastify;
  483. export declare const Zoom: CSSTransitionProps;
  484. export { }