react-toastify - npm Package Compare versions

Comparing version 8.2.0 to 9.0.0-POC

dist/components/CloseButton.d.ts

@@ -1,2 +0,2 @@
-import * as React from 'react';
+import React from 'react';
 import { Theme, TypeOptions } from '../types';
@@ -3,0 +3,0 @@ export interface CloseButtonProps {

dist/components/Icons.d.ts

@@ -1,2 +0,2 @@
-import * as React from 'react';
+import React from 'react';
 import { Theme, TypeOptions } from '../types';
@@ -3,0 +3,0 @@ /**

dist/components/ProgressBar.d.ts

@@ -1,2 +0,2 @@
-import * as React from 'react';
+import React from 'react';
 import { TypeOptions, ToastClassName, Theme } from '../types';
@@ -3,0 +3,0 @@ export interface ProgressBarProps {

dist/components/Toast.d.ts

@@ -1,3 +0,3 @@
-import * as React from 'react';
+import React from 'react';
 import { ToastProps } from '../types';
 export declare const Toast: React.FC<ToastProps>;

dist/components/ToastContainer.d.ts

@@ -1,3 +0,3 @@
-import * as React from 'react';
+import React from 'react';
 import { ToastContainerProps } from '../types';
 export declare const ToastContainer: React.FC<ToastContainerProps>;

dist/components/Transitions.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="react" />
 declare const Bounce: ({ children, position, preventExitTransition, done, nodeRef, isIn }: import("..").ToastTransitionProps) => JSX.Element;
@@ -3,0 +2,0 @@ declare const Slide: ({ children, position, preventExitTransition, done, nodeRef, isIn }: import("..").ToastTransitionProps) => JSX.Element;

dist/core/eventManager.d.ts

 /// <reference types="react" />
-import { Id, ToastContent, ClearWaitingQueueParams, NotValidatedToastProps } from '../types';
+import { Id, ToastContent, ClearWaitingQueueParams, NotValidatedToastProps, ToastItem } from '../types';
 import { ContainerInstance } from '../hooks';
@@ -17,3 +17,8 @@ export declare const enum Event {
 declare type OnWillUnmountCallback = OnDidMountCallback;
-export declare type OnChangeCallback = (toast: number, containerId?: number | string) => void;
+export interface OnChangePayload {
+    toasts: ToastItem[];
+    added?: ToastItem;
+    removed?: ToastItem;
+}
+export declare type OnChangeCallback = (payload: OnChangePayload) => void;
 declare type Callback = OnShowCallback | OnClearCallback | OnClearWaitingQueue | OnDidMountCallback | OnWillUnmountCallback | OnChangeCallback;
@@ -37,5 +42,5 @@ declare type TimeoutId = ReturnType<typeof setTimeout>;
     emit(event: Event.WillUnmount, containerInstance: ContainerInstance): void;
-    emit(event: Event.Change, toast: number, containerId?: number | string): void;
+    emit(event: Event.Change, data: OnChangePayload): void;
 }
 export declare const eventManager: EventManager;
 export {};

dist/core/toast.d.ts

@@ -1,21 +0,19 @@
-import * as React from 'react';
 import { OnChangeCallback } from './eventManager';
-import { ToastContent, ToastOptions, ToastContainerProps, UpdateOptions, ClearWaitingQueueParams, TypeOptions } from '../types';
-declare function toast(content: ToastContent, options?: ToastOptions): React.ReactText;
+import { ToastContent, ToastOptions, Id, UpdateOptions, ClearWaitingQueueParams, TypeOptions } from '../types';
+declare function toast(content: ToastContent, options?: ToastOptions): Id;
 declare namespace toast {
-    var loading: (content: ToastContent, options?: ToastOptions<{}> | undefined) => React.ReactText;
+    var loading: (content: ToastContent, options?: ToastOptions<{}> | undefined) => Id;
     var promise: typeof handlePromise;
-    var success: (content: ToastContent, options?: ToastOptions<{}> | undefined) => React.ReactText;
-    var info: (content: ToastContent, options?: ToastOptions<{}> | undefined) => React.ReactText;
-    var error: (content: ToastContent, options?: ToastOptions<{}> | undefined) => React.ReactText;
-    var warning: (content: ToastContent, options?: ToastOptions<{}> | undefined) => React.ReactText;
-    var warn: (content: ToastContent, options?: ToastOptions<{}> | undefined) => React.ReactText;
-    var dark: (content: ToastContent, options?: ToastOptions<{}> | undefined) => React.ReactText;
-    var dismiss: (id?: string | number | undefined) => void;
+    var success: (content: ToastContent, options?: ToastOptions<{}> | undefined) => Id;
+    var info: (content: ToastContent, options?: ToastOptions<{}> | undefined) => Id;
+    var error: (content: ToastContent, options?: ToastOptions<{}> | undefined) => Id;
+    var warning: (content: ToastContent, options?: ToastOptions<{}> | undefined) => Id;
+    var warn: (content: ToastContent, options?: ToastOptions<{}> | undefined) => Id;
+    var dark: (content: ToastContent, options?: ToastOptions<{}> | undefined) => Id;
+    var dismiss: (id?: Id | undefined) => void;
     var clearWaitingQueue: (params?: ClearWaitingQueueParams) => void;
-    var isActive: (id: React.ReactText) => boolean;
-    var update: (toastId: React.ReactText, options?: UpdateOptions) => void;
-    var done: (id: React.ReactText) => void;
+    var isActive: (id: Id) => boolean;
+    var update: (toastId: Id, options?: UpdateOptions) => void;
+    var done: (id: Id) => void;
     var onChange: (callback: OnChangeCallback) => () => void;
-    var configure: (config?: ToastContainerProps) => void;
     var POSITION: {
@@ -22,0 +20,0 @@ TOP_LEFT: import("../types").ToastPosition;

dist/index.d.ts

@@ -5,2 +5,2 @@ export { useToastContainer, useToast } from './hooks';
 export { toast, ToastPromiseParams } from './core';
-export { TypeOptions, Theme, ToastPosition, ToastContentProps, ToastContent, ToastTransition, ToastClassName, ClearWaitingQueueParams, DraggableDirection, ToastOptions, UpdateOptions, ToastContainerProps, ToastTransitionProps, Id } from './types';
+export { TypeOptions, Theme, ToastPosition, ToastContentProps, ToastContent, ToastTransition, ToastClassName, ClearWaitingQueueParams, DraggableDirection, ToastOptions, UpdateOptions, ToastContainerProps, ToastTransitionProps, Id, ToastItem } from './types';

dist/react-toastify.esm.js

@@ -1,1416 +0,2 @@
-import React__default, { isValidElement, useRef, useLayoutEffect, useEffect, useReducer, useState, cloneElement, createElement } from 'react';
-import cx from 'clsx';
-import { render } from 'react-dom';
-
-function _extends() {
-  _extends = Object.assign || function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-
-    return target;
-  };
-
-  return _extends.apply(this, arguments);
-}
-
-function _objectWithoutPropertiesLoose(source, excluded) {
-  if (source == null) return {};
-  var target = {};
-  var sourceKeys = Object.keys(source);
-  var key, i;
-
-  for (i = 0; i < sourceKeys.length; i++) {
-    key = sourceKeys[i];
-    if (excluded.indexOf(key) >= 0) continue;
-    target[key] = source[key];
-  }
-
-  return target;
-}
-
-function isNum(v) {
-  return typeof v === 'number' && !isNaN(v);
-}
-function isBool(v) {
-  return typeof v === 'boolean';
-}
-function isStr(v) {
-  return typeof v === 'string';
-}
-function isFn(v) {
-  return typeof v === 'function';
-}
-function parseClassName(v) {
-  return isStr(v) || isFn(v) ? v : null;
-}
-function isToastIdValid(toastId) {
-  return toastId === 0 || toastId;
-}
-function getAutoCloseDelay(toastAutoClose, containerAutoClose) {
-  return toastAutoClose === false || isNum(toastAutoClose) && toastAutoClose > 0 ? toastAutoClose : containerAutoClose;
-}
-var canUseDom = !!(typeof window !== 'undefined' && window.document && window.document.createElement);
-function canBeRendered(content) {
-  return isValidElement(content) || isStr(content) || isFn(content) || isNum(content);
-}
-
-var POSITION = {
-  TOP_LEFT: 'top-left',
-  TOP_RIGHT: 'top-right',
-  TOP_CENTER: 'top-center',
-  BOTTOM_LEFT: 'bottom-left',
-  BOTTOM_RIGHT: 'bottom-right',
-  BOTTOM_CENTER: 'bottom-center'
-};
-var TYPE = {
-  INFO: 'info',
-  SUCCESS: 'success',
-  WARNING: 'warning',
-  ERROR: 'error',
-  DEFAULT: 'default'
-};
-
-/**
- * Used to collapse toast after exit animation
- */
-function collapseToast(node, done, duration
-/* COLLAPSE_DURATION */
-) {
-  if (duration === void 0) {
-    duration = 300;
-  }
-
-  var scrollHeight = node.scrollHeight,
-      style = node.style;
-  requestAnimationFrame(function () {
-    style.minHeight = 'initial';
-    style.height = scrollHeight + 'px';
-    style.transition = "all " + duration + "ms";
-    requestAnimationFrame(function () {
-      style.height = '0';
-      style.padding = '0';
-      style.margin = '0';
-      setTimeout(done, duration);
-    });
-  });
-}
-
-/**
- * Css animation that just work.
- * You could use animate.css for instance
- *
- *
- * ```
- * cssTransition({
- *   enter: "animate__animated animate__bounceIn",
- *   exit: "animate__animated animate__bounceOut"
- * })
- * ```
- *
- */
-
-function cssTransition(_ref) {
-  var enter = _ref.enter,
-      exit = _ref.exit,
-      _ref$appendPosition = _ref.appendPosition,
-      appendPosition = _ref$appendPosition === void 0 ? false : _ref$appendPosition,
-      _ref$collapse = _ref.collapse,
-      collapse = _ref$collapse === void 0 ? true : _ref$collapse,
-      _ref$collapseDuration = _ref.collapseDuration,
-      collapseDuration = _ref$collapseDuration === void 0 ? 300 : _ref$collapseDuration;
-  return function ToastTransition(_ref2) {
-    var children = _ref2.children,
-        position = _ref2.position,
-        preventExitTransition = _ref2.preventExitTransition,
-        done = _ref2.done,
-        nodeRef = _ref2.nodeRef,
-        isIn = _ref2.isIn;
-    var enterClassName = appendPosition ? enter + "--" + position : enter;
-    var exitClassName = appendPosition ? exit + "--" + position : exit;
-    var baseClassName = useRef();
-    var animationStep = useRef(0
-    /* Enter */
-    );
-    useLayoutEffect(function () {
-      onEnter();
-    }, []);
-    useEffect(function () {
-      if (!isIn) preventExitTransition ? onExited() : onExit();
-    }, [isIn]);
-
-    function onEnter() {
-      var node = nodeRef.current;
-      baseClassName.current = node.className;
-      node.className += " " + enterClassName;
-      node.addEventListener('animationend', onEntered);
-      node.addEventListener('animationcancel', onEntered);
-    }
-
-    function onEntered(e) {
-      if (e.target !== nodeRef.current) return;
-      var node = nodeRef.current;
-      node.dispatchEvent(new Event("d"
-      /* ENTRANCE_ANIMATION_END */
-      ));
-      node.removeEventListener('animationend', onEntered);
-      node.removeEventListener('animationcancel', onEntered);
-
-      if (animationStep.current === 0
-      /* Enter */
-      ) {
-          node.className = baseClassName.current;
-        }
-    }
-
-    function onExit() {
-      animationStep.current = 1
-      /* Exit */
-      ;
-      var node = nodeRef.current;
-      node.className += " " + exitClassName;
-      node.addEventListener('animationend', onExited);
-    }
-
-    function onExited() {
-      var node = nodeRef.current;
-      node.removeEventListener('animationend', onExited);
-      collapse ? collapseToast(node, done, collapseDuration) : done();
-    }
-
-    return React__default.createElement(React__default.Fragment, null, children);
-  };
-}
-
-var eventManager = {
-  list: /*#__PURE__*/new Map(),
-  emitQueue: /*#__PURE__*/new Map(),
-  on: function on(event, callback) {
-    this.list.has(event) || this.list.set(event, []);
-    this.list.get(event).push(callback);
-    return this;
-  },
-  off: function off(event, callback) {
-    if (callback) {
-      var cb = this.list.get(event).filter(function (cb) {
-        return cb !== callback;
-      });
-      this.list.set(event, cb);
-      return this;
-    }
-
-    this.list["delete"](event);
-    return this;
-  },
-  cancelEmit: function cancelEmit(event) {
-    var timers = this.emitQueue.get(event);
-
-    if (timers) {
-      timers.forEach(clearTimeout);
-      this.emitQueue["delete"](event);
-    }
-
-    return this;
-  },
-
-  /**
-   * Enqueue the event at the end of the call stack
-   * Doing so let the user call toast as follow:
-   * toast('1')
-   * toast('2')
-   * toast('3')
-   * Without setTimemout the code above will not work
-   */
-  emit: function emit(event) {
-    var _this = this;
-
-    for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-      args[_key - 1] = arguments[_key];
-    }
-
-    this.list.has(event) && this.list.get(event).forEach(function (callback) {
-      var timer = setTimeout(function () {
-        // @ts-ignore
-        callback.apply(void 0, args);
-      }, 0);
-      _this.emitQueue.has(event) || _this.emitQueue.set(event, []);
-
-      _this.emitQueue.get(event).push(timer);
-    });
-  }
-};
-
-var _excluded = ["delay", "staleId"];
-function useToastContainer(props) {
-  var _useReducer = useReducer(function (x) {
-    return x + 1;
-  }, 0),
-      forceUpdate = _useReducer[1];
-
-  var _useState = useState([]),
-      toastIds = _useState[0],
-      setToastIds = _useState[1];
-
-  var containerRef = useRef(null);
-  var toastToRender = useRef(new Map()).current;
-
-  var isToastActive = function isToastActive(id) {
-    return toastIds.indexOf(id) !== -1;
-  };
-
-  var instance = useRef({
-    toastKey: 1,
-    displayedToast: 0,
-    count: 0,
-    queue: [],
-    props: props,
-    containerId: null,
-    isToastActive: isToastActive,
-    getToast: function getToast(id) {
-      return toastToRender.get(id);
-    }
-  }).current;
-  useEffect(function () {
-    instance.containerId = props.containerId;
-    eventManager.cancelEmit(3
-    /* WillUnmount */
-    ).on(0
-    /* Show */
-    , buildToast).on(1
-    /* Clear */
-    , function (toastId) {
-      return containerRef.current && removeToast(toastId);
-    }).on(5
-    /* ClearWaitingQueue */
-    , clearWaitingQueue).emit(2
-    /* DidMount */
-    , instance);
-    return function () {
-      return eventManager.emit(3
-      /* WillUnmount */
-      , instance);
-    };
-  }, []);
-  useEffect(function () {
-    instance.isToastActive = isToastActive;
-    instance.displayedToast = toastIds.length;
-    eventManager.emit(4
-    /* Change */
-    , toastIds.length, props.containerId);
-  }, [toastIds]);
-  useEffect(function () {
-    instance.props = props;
-  });
-
-  function clearWaitingQueue(_ref) {
-    var containerId = _ref.containerId;
-    var limit = instance.props.limit;
-
-    if (limit && (!containerId || instance.containerId === containerId)) {
-      instance.count -= instance.queue.length;
-      instance.queue = [];
-    }
-  }
-
-  function removeToast(toastId) {
-    setToastIds(function (state) {
-      return isToastIdValid(toastId) ? state.filter(function (id) {
-        return id !== toastId;
-      }) : [];
-    });
-  }
-
-  function dequeueToast() {
-    var _instance$queue$shift = instance.queue.shift(),
-        toastContent = _instance$queue$shift.toastContent,
-        toastProps = _instance$queue$shift.toastProps,
-        staleId = _instance$queue$shift.staleId;
-
-    appendToast(toastContent, toastProps, staleId);
-  }
-  /**
-   * check if a container is attached to the dom
-   * check for multi-container, build only if associated
-   * check for duplicate toastId if no update
-   */
-
-
-  function isNotValid(options) {
-    return !containerRef.current || instance.props.enableMultiContainer && options.containerId !== instance.props.containerId || toastToRender.has(options.toastId) && options.updateId == null;
-  } // this function and all the function called inside needs to rely on refs
-
-
-  function buildToast(content, _ref2) {
-    var delay = _ref2.delay,
-        staleId = _ref2.staleId,
-        options = _objectWithoutPropertiesLoose(_ref2, _excluded);
-
-    if (!canBeRendered(content) || isNotValid(options)) return;
-    var toastId = options.toastId,
-        updateId = options.updateId,
-        data = options.data;
-    var props = instance.props;
-
-    var closeToast = function closeToast() {
-      return removeToast(toastId);
-    };
-
-    var isNotAnUpdate = updateId == null;
-    if (isNotAnUpdate) instance.count++;
-    var toastProps = {
-      toastId: toastId,
-      updateId: updateId,
-      isLoading: options.isLoading,
-      theme: options.theme || props.theme,
-      icon: options.icon != null ? options.icon : props.icon,
-      isIn: false,
-      key: options.key || instance.toastKey++,
-      type: options.type,
-      closeToast: closeToast,
-      closeButton: options.closeButton,
-      rtl: props.rtl,
-      position: options.position || props.position,
-      transition: options.transition || props.transition,
-      className: parseClassName(options.className || props.toastClassName),
-      bodyClassName: parseClassName(options.bodyClassName || props.bodyClassName),
-      style: options.style || props.toastStyle,
-      bodyStyle: options.bodyStyle || props.bodyStyle,
-      onClick: options.onClick || props.onClick,
-      pauseOnHover: isBool(options.pauseOnHover) ? options.pauseOnHover : props.pauseOnHover,
-      pauseOnFocusLoss: isBool(options.pauseOnFocusLoss) ? options.pauseOnFocusLoss : props.pauseOnFocusLoss,
-      draggable: isBool(options.draggable) ? options.draggable : props.draggable,
-      draggablePercent: options.draggablePercent || props.draggablePercent,
-      draggableDirection: options.draggableDirection || props.draggableDirection,
-      closeOnClick: isBool(options.closeOnClick) ? options.closeOnClick : props.closeOnClick,
-      progressClassName: parseClassName(options.progressClassName || props.progressClassName),
-      progressStyle: options.progressStyle || props.progressStyle,
-      autoClose: options.isLoading ? false : getAutoCloseDelay(options.autoClose, props.autoClose),
-      hideProgressBar: isBool(options.hideProgressBar) ? options.hideProgressBar : props.hideProgressBar,
-      progress: options.progress,
-      role: options.role || props.role,
-      deleteToast: function deleteToast() {
-        toastToRender["delete"](toastId);
-        var queueLen = instance.queue.length;
-        instance.count = isToastIdValid(toastId) ? instance.count - 1 : instance.count - instance.displayedToast;
-        if (instance.count < 0) instance.count = 0;
-
-        if (queueLen > 0) {
-          var freeSlot = isToastIdValid(toastId) ? 1 : instance.props.limit;
-
-          if (queueLen === 1 || freeSlot === 1) {
-            instance.displayedToast++;
-            dequeueToast();
-          } else {
-            var toDequeue = freeSlot > queueLen ? queueLen : freeSlot;
-            instance.displayedToast = toDequeue;
-
-            for (var i = 0; i < toDequeue; i++) {
-              dequeueToast();
-            }
-          }
-        } else {
-          forceUpdate();
-        }
-      }
-    };
-    if (isFn(options.onOpen)) toastProps.onOpen = options.onOpen;
-    if (isFn(options.onClose)) toastProps.onClose = options.onClose;
-    toastProps.closeButton = props.closeButton;
-
-    if (options.closeButton === false || canBeRendered(options.closeButton)) {
-      toastProps.closeButton = options.closeButton;
-    } else if (options.closeButton === true) {
-      toastProps.closeButton = canBeRendered(props.closeButton) ? props.closeButton : true;
-    }
-
-    var toastContent = content;
-
-    if (isValidElement(content) && !isStr(content.type)) {
-      toastContent = cloneElement(content, {
-        closeToast: closeToast,
-        toastProps: toastProps,
-        data: data
-      });
-    } else if (isFn(content)) {
-      toastContent = content({
-        closeToast: closeToast,
-        toastProps: toastProps,
-        data: data
-      });
-    } // not handling limit + delay by design. Waiting for user feedback first
-
-
-    if (props.limit && props.limit > 0 && instance.count > props.limit && isNotAnUpdate) {
-      instance.queue.push({
-        toastContent: toastContent,
-        toastProps: toastProps,
-        staleId: staleId
-      });
-    } else if (isNum(delay) && delay > 0) {
-      setTimeout(function () {
-        appendToast(toastContent, toastProps, staleId);
-      }, delay);
-    } else {
-      appendToast(toastContent, toastProps, staleId);
-    }
-  }
-
-  function appendToast(content, toastProps, staleId) {
-    var toastId = toastProps.toastId;
-    if (staleId) toastToRender["delete"](staleId);
-    toastToRender.set(toastId, {
-      content: content,
-      props: toastProps
-    });
-    setToastIds(function (state) {
-      return [].concat(state, [toastId]).filter(function (id) {
-        return id !== staleId;
-      });
-    });
-  }
-
-  function getToastToRender(cb) {
-    var toRender = new Map();
-    var collection = Array.from(toastToRender.values());
-    if (props.newestOnTop) collection.reverse();
-    collection.forEach(function (toast) {
-      var position = toast.props.position;
-      toRender.has(position) || toRender.set(position, []);
-      toRender.get(position).push(toast);
-    });
-    return Array.from(toRender, function (p) {
-      return cb(p[0], p[1]);
-    });
-  }
-
-  return {
-    getToastToRender: getToastToRender,
-    containerRef: containerRef,
-    isToastActive: isToastActive
-  };
-}
-
-function getX(e) {
-  return e.targetTouches && e.targetTouches.length >= 1 ? e.targetTouches[0].clientX : e.clientX;
-}
-
-function getY(e) {
-  return e.targetTouches && e.targetTouches.length >= 1 ? e.targetTouches[0].clientY : e.clientY;
-}
-
-function useToast(props) {
-  var _useState = useState(false),
-      isRunning = _useState[0],
-      setIsRunning = _useState[1];
-
-  var _useState2 = useState(false),
-      preventExitTransition = _useState2[0],
-      setPreventExitTransition = _useState2[1];
-
-  var toastRef = useRef(null);
-  var drag = useRef({
-    start: 0,
-    x: 0,
-    y: 0,
-    delta: 0,
-    removalDistance: 0,
-    canCloseOnClick: true,
-    canDrag: false,
-    boundingRect: null,
-    didMove: false
-  }).current;
-  var syncProps = useRef(props);
-  var autoClose = props.autoClose,
-      pauseOnHover = props.pauseOnHover,
-      closeToast = props.closeToast,
-      onClick = props.onClick,
-      closeOnClick = props.closeOnClick;
-  useEffect(function () {
-    syncProps.current = props;
-  });
-  useEffect(function () {
-    if (toastRef.current) toastRef.current.addEventListener("d"
-    /* ENTRANCE_ANIMATION_END */
-    , playToast, {
-      once: true
-    });
-    if (isFn(props.onOpen)) props.onOpen(isValidElement(props.children) && props.children.props);
-    return function () {
-      var props = syncProps.current;
-      if (isFn(props.onClose)) props.onClose(isValidElement(props.children) && props.children.props);
-    };
-  }, []);
-  useEffect(function () {
-    props.pauseOnFocusLoss && bindFocusEvents();
-    return function () {
-      props.pauseOnFocusLoss && unbindFocusEvents();
-    };
-  }, [props.pauseOnFocusLoss]);
-
-  function onDragStart(e) {
-    if (props.draggable) {
-      bindDragEvents();
-      var toast = toastRef.current;
-      drag.canCloseOnClick = true;
-      drag.canDrag = true;
-      drag.boundingRect = toast.getBoundingClientRect();
-      toast.style.transition = '';
-      drag.x = getX(e.nativeEvent);
-      drag.y = getY(e.nativeEvent);
-
-      if (props.draggableDirection === "x"
-      /* X */
-      ) {
-          drag.start = drag.x;
-          drag.removalDistance = toast.offsetWidth * (props.draggablePercent / 100);
-        } else {
-        drag.start = drag.y;
-        drag.removalDistance = toast.offsetHeight * (props.draggablePercent === 80
-        /* DRAGGABLE_PERCENT */
-        ? props.draggablePercent * 1.5 : props.draggablePercent / 100);
-      }
-    }
-  }
-
-  function onDragTransitionEnd() {
-    if (drag.boundingRect) {
-      var _drag$boundingRect = drag.boundingRect,
-          top = _drag$boundingRect.top,
-          bottom = _drag$boundingRect.bottom,
-          left = _drag$boundingRect.left,
-          right = _drag$boundingRect.right;
-
-      if (props.pauseOnHover && drag.x >= left && drag.x <= right && drag.y >= top && drag.y <= bottom) {
-        pauseToast();
-      } else {
-        playToast();
-      }
-    }
-  }
-
-  function playToast() {
-    setIsRunning(true);
-  }
-
-  function pauseToast() {
-    setIsRunning(false);
-  }
-
-  function bindFocusEvents() {
-    if (!document.hasFocus()) pauseToast();
-    window.addEventListener('focus', playToast);
-    window.addEventListener('blur', pauseToast);
-  }
-
-  function unbindFocusEvents() {
-    window.removeEventListener('focus', playToast);
-    window.removeEventListener('blur', pauseToast);
-  }
-
-  function bindDragEvents() {
-    drag.didMove = false;
-    document.addEventListener('mousemove', onDragMove);
-    document.addEventListener('mouseup', onDragEnd);
-    document.addEventListener('touchmove', onDragMove);
-    document.addEventListener('touchend', onDragEnd);
-  }
-
-  function unbindDragEvents() {
-    document.removeEventListener('mousemove', onDragMove);
-    document.removeEventListener('mouseup', onDragEnd);
-    document.removeEventListener('touchmove', onDragMove);
-    document.removeEventListener('touchend', onDragEnd);
-  }
-
-  function onDragMove(e) {
-    var toast = toastRef.current;
-
-    if (drag.canDrag && toast) {
-      drag.didMove = true;
-      if (isRunning) pauseToast();
-      drag.x = getX(e);
-      drag.y = getY(e);
-
-      if (props.draggableDirection === "x"
-      /* X */
-      ) {
-          drag.delta = drag.x - drag.start;
-        } else {
-        drag.delta = drag.y - drag.start;
-      } // prevent false positif during a toast click
-
-
-      if (drag.start !== drag.x) drag.canCloseOnClick = false;
-      toast.style.transform = "translate" + props.draggableDirection + "(" + drag.delta + "px)";
-      toast.style.opacity = "" + (1 - Math.abs(drag.delta / drag.removalDistance));
-    }
-  }
-
-  function onDragEnd() {
-    unbindDragEvents();
-    var toast = toastRef.current;
-
-    if (drag.canDrag && drag.didMove && toast) {
-      drag.canDrag = false;
-
-      if (Math.abs(drag.delta) > drag.removalDistance) {
-        setPreventExitTransition(true);
-        props.closeToast();
-        return;
-      }
-
-      toast.style.transition = 'transform 0.2s, opacity 0.2s';
-      toast.style.transform = "translate" + props.draggableDirection + "(0)";
-      toast.style.opacity = '1';
-    }
-  }
-
-  var eventHandlers = {
-    onMouseDown: onDragStart,
-    onTouchStart: onDragStart,
-    onMouseUp: onDragTransitionEnd,
-    onTouchEnd: onDragTransitionEnd
-  };
-
-  if (autoClose && pauseOnHover) {
-    eventHandlers.onMouseEnter = pauseToast;
-    eventHandlers.onMouseLeave = playToast;
-  } // prevent toast from closing when user drags the toast
-
-
-  if (closeOnClick) {
-    eventHandlers.onClick = function (e) {
-      onClick && onClick(e);
-      drag.canCloseOnClick && closeToast();
-    };
-  }
-
-  return {
-    playToast: playToast,
-    pauseToast: pauseToast,
-    isRunning: isRunning,
-    preventExitTransition: preventExitTransition,
-    toastRef: toastRef,
-    eventHandlers: eventHandlers
-  };
-}
-
-function CloseButton(_ref) {
-  var closeToast = _ref.closeToast,
-      theme = _ref.theme,
-      _ref$ariaLabel = _ref.ariaLabel,
-      ariaLabel = _ref$ariaLabel === void 0 ? 'close' : _ref$ariaLabel;
-  return createElement("button", {
-    className: "Toastify"
-    /* CSS_NAMESPACE */
-    + "__close-button " + "Toastify"
-    /* CSS_NAMESPACE */
-    + "__close-button--" + theme,
-    type: "button",
-    onClick: function onClick(e) {
-      e.stopPropagation();
-      closeToast(e);
-    },
-    "aria-label": ariaLabel
-  }, createElement("svg", {
-    "aria-hidden": "true",
-    viewBox: "0 0 14 16"
-  }, createElement("path", {
-    fillRule: "evenodd",
-    d: "M7.71 8.23l3.75 3.75-1.48 1.48-3.75-3.75-3.75 3.75L1 11.98l3.75-3.75L1 4.48 2.48 3l3.75 3.75L9.98 3l1.48 1.48-3.75 3.75z"
-  })));
-}
-
-function ProgressBar(_ref) {
-  var _cx, _animationEvent;
-
-  var delay = _ref.delay,
-      isRunning = _ref.isRunning,
-      closeToast = _ref.closeToast,
-      type = _ref.type,
-      hide = _ref.hide,
-      className = _ref.className,
-      userStyle = _ref.style,
-      controlledProgress = _ref.controlledProgress,
-      progress = _ref.progress,
-      rtl = _ref.rtl,
-      isIn = _ref.isIn,
-      theme = _ref.theme;
-
-  var style = _extends({}, userStyle, {
-    animationDuration: delay + "ms",
-    animationPlayState: isRunning ? 'running' : 'paused',
-    opacity: hide ? 0 : 1
-  });
-
-  if (controlledProgress) style.transform = "scaleX(" + progress + ")";
-  var defaultClassName = cx("Toastify"
-  /* CSS_NAMESPACE */
-  + "__progress-bar", controlledProgress ? "Toastify"
-  /* CSS_NAMESPACE */
-  + "__progress-bar--controlled" : "Toastify"
-  /* CSS_NAMESPACE */
-  + "__progress-bar--animated", "Toastify"
-  /* CSS_NAMESPACE */
-  + "__progress-bar-theme--" + theme, "Toastify"
-  /* CSS_NAMESPACE */
-  + "__progress-bar--" + type, (_cx = {}, _cx["Toastify"
-  /* CSS_NAMESPACE */
-  + "__progress-bar--rtl"] = rtl, _cx));
-  var classNames = isFn(className) ? className({
-    rtl: rtl,
-    type: type,
-    defaultClassName: defaultClassName
-  }) : cx(defaultClassName, className); // 🧐 controlledProgress is derived from progress
-  // so if controlledProgress is set
-  // it means that this is also the case for progress
-
-  var animationEvent = (_animationEvent = {}, _animationEvent[controlledProgress && progress >= 1 ? 'onTransitionEnd' : 'onAnimationEnd'] = controlledProgress && progress < 1 ? null : function () {
-    isIn && closeToast();
-  }, _animationEvent); // TODO: add aria-valuenow, aria-valuemax, aria-valuemin
-
-  return createElement("div", Object.assign({
-    role: "progressbar",
-    "aria-hidden": hide ? 'true' : 'false',
-    "aria-label": "notification timer",
-    className: classNames,
-    style: style
-  }, animationEvent));
-}
-ProgressBar.defaultProps = {
-  type: TYPE.DEFAULT,
-  hide: false
-};
-
-var _excluded$1 = ["theme", "type"];
-
-var Svg = function Svg(_ref) {
-  var theme = _ref.theme,
-      type = _ref.type,
-      rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
-
-  return createElement("svg", Object.assign({
-    viewBox: "0 0 24 24",
-    width: "100%",
-    height: "100%",
-    fill: theme === 'colored' ? 'currentColor' : "var(--toastify-icon-color-" + type + ")"
-  }, rest));
-};
-
-function Warning(props) {
-  return createElement(Svg, Object.assign({}, props), createElement("path", {
-    d: "M23.32 17.191L15.438 2.184C14.728.833 13.416 0 11.996 0c-1.42 0-2.733.833-3.443 2.184L.533 17.448a4.744 4.744 0 000 4.368C1.243 23.167 2.555 24 3.975 24h16.05C22.22 24 24 22.044 24 19.632c0-.904-.251-1.746-.68-2.44zm-9.622 1.46c0 1.033-.724 1.823-1.698 1.823s-1.698-.79-1.698-1.822v-.043c0-1.028.724-1.822 1.698-1.822s1.698.79 1.698 1.822v.043zm.039-12.285l-.84 8.06c-.057.581-.408.943-.897.943-.49 0-.84-.367-.896-.942l-.84-8.065c-.057-.624.25-1.095.779-1.095h1.91c.528.005.84.476.784 1.1z"
-  }));
-}
-
-function Info(props) {
-  return createElement(Svg, Object.assign({}, props), createElement("path", {
-    d: "M12 0a12 12 0 1012 12A12.013 12.013 0 0012 0zm.25 5a1.5 1.5 0 11-1.5 1.5 1.5 1.5 0 011.5-1.5zm2.25 13.5h-4a1 1 0 010-2h.75a.25.25 0 00.25-.25v-4.5a.25.25 0 00-.25-.25h-.75a1 1 0 010-2h1a2 2 0 012 2v4.75a.25.25 0 00.25.25h.75a1 1 0 110 2z"
-  }));
-}
-
-function Success(props) {
-  return createElement(Svg, Object.assign({}, props), createElement("path", {
-    d: "M12 0a12 12 0 1012 12A12.014 12.014 0 0012 0zm6.927 8.2l-6.845 9.289a1.011 1.011 0 01-1.43.188l-4.888-3.908a1 1 0 111.25-1.562l4.076 3.261 6.227-8.451a1 1 0 111.61 1.183z"
-  }));
-}
-
-function Error(props) {
-  return createElement(Svg, Object.assign({}, props), createElement("path", {
-    d: "M11.983 0a12.206 12.206 0 00-8.51 3.653A11.8 11.8 0 000 12.207 11.779 11.779 0 0011.8 24h.214A12.111 12.111 0 0024 11.791 11.766 11.766 0 0011.983 0zM10.5 16.542a1.476 1.476 0 011.449-1.53h.027a1.527 1.527 0 011.523 1.47 1.475 1.475 0 01-1.449 1.53h-.027a1.529 1.529 0 01-1.523-1.47zM11 12.5v-6a1 1 0 012 0v6a1 1 0 11-2 0z"
-  }));
-}
-
-function Spinner() {
-  return createElement("div", {
-    className: "Toastify"
-    /* CSS_NAMESPACE */
-    + "__spinner"
-  });
-}
-
-var Icons = {
-  info: Info,
-  warning: Warning,
-  success: Success,
-  error: Error,
-  spinner: Spinner
-};
-
-var Toast = function Toast(props) {
-  var _cx, _cx2;
-
-  var _useToast = useToast(props),
-      isRunning = _useToast.isRunning,
-      preventExitTransition = _useToast.preventExitTransition,
-      toastRef = _useToast.toastRef,
-      eventHandlers = _useToast.eventHandlers;
-
-  var closeButton = props.closeButton,
-      children = props.children,
-      autoClose = props.autoClose,
-      onClick = props.onClick,
-      type = props.type,
-      hideProgressBar = props.hideProgressBar,
-      closeToast = props.closeToast,
-      Transition = props.transition,
-      position = props.position,
-      className = props.className,
-      style = props.style,
-      bodyClassName = props.bodyClassName,
-      bodyStyle = props.bodyStyle,
-      progressClassName = props.progressClassName,
-      progressStyle = props.progressStyle,
-      updateId = props.updateId,
-      role = props.role,
-      progress = props.progress,
-      rtl = props.rtl,
-      toastId = props.toastId,
-      deleteToast = props.deleteToast,
-      isIn = props.isIn,
-      isLoading = props.isLoading,
-      icon = props.icon,
-      theme = props.theme;
-  var defaultClassName = cx("Toastify"
-  /* CSS_NAMESPACE */
-  + "__toast", "Toastify"
-  /* CSS_NAMESPACE */
-  + "__toast-theme--" + theme, "Toastify"
-  /* CSS_NAMESPACE */
-  + "__toast--" + type, (_cx = {}, _cx["Toastify"
-  /* CSS_NAMESPACE */
-  + "__toast--rtl"] = rtl, _cx));
-  var cssClasses = isFn(className) ? className({
-    rtl: rtl,
-    position: position,
-    type: type,
-    defaultClassName: defaultClassName
-  }) : cx(defaultClassName, className);
-  var isProgressControlled = !!progress;
-  var maybeIcon = Icons[type];
-  var iconProps = {
-    theme: theme,
-    type: type
-  };
-  var Icon = maybeIcon && maybeIcon(iconProps);
-
-  if (icon === false) {
-    Icon = void 0;
-  } else if (isFn(icon)) {
-    Icon = icon(iconProps);
-  } else if (isValidElement(icon)) {
-    Icon = cloneElement(icon, iconProps);
-  } else if (isStr(icon)) {
-    Icon = icon;
-  } else if (isLoading) {
-    Icon = Icons.spinner();
-  }
-
-  function renderCloseButton(closeButton) {
-    if (!closeButton) return;
-    var props = {
-      closeToast: closeToast,
-      type: type,
-      theme: theme
-    };
-    if (isFn(closeButton)) return closeButton(props);
-    if (isValidElement(closeButton)) return cloneElement(closeButton, props);
-  }
-
-  return createElement(Transition, {
-    isIn: isIn,
-    done: deleteToast,
-    position: position,
-    preventExitTransition: preventExitTransition,
-    nodeRef: toastRef
-  }, createElement("div", Object.assign({
-    id: toastId,
-    onClick: onClick,
-    className: cssClasses
-  }, eventHandlers, {
-    style: style,
-    ref: toastRef
-  }), createElement("div", Object.assign({}, isIn && {
-    role: role
-  }, {
-    className: isFn(bodyClassName) ? bodyClassName({
-      type: type
-    }) : cx("Toastify"
-    /* CSS_NAMESPACE */
-    + "__toast-body", bodyClassName),
-    style: bodyStyle
-  }), Icon && createElement("div", {
-    className: cx("Toastify"
-    /* CSS_NAMESPACE */
-    + "__toast-icon", (_cx2 = {}, _cx2["Toastify"
-    /* CSS_NAMESPACE */
-    + "--animate-icon " + "Toastify"
-    /* CSS_NAMESPACE */
-    + "__zoom-enter"] = !isLoading, _cx2))
-  }, Icon), createElement("div", null, children)), renderCloseButton(closeButton), (autoClose || isProgressControlled) && createElement(ProgressBar, Object.assign({}, updateId && !isProgressControlled ? {
-    key: "pb-" + updateId
-  } : {}, {
-    rtl: rtl,
-    theme: theme,
-    delay: autoClose,
-    isRunning: isRunning,
-    isIn: isIn,
-    closeToast: closeToast,
-    hide: hideProgressBar,
-    type: type,
-    style: progressStyle,
-    className: progressClassName,
-    controlledProgress: isProgressControlled,
-    progress: progress
-  }))));
-};
-
-var Bounce = /*#__PURE__*/cssTransition({
-  enter: "Toastify"
-  /* CSS_NAMESPACE */
-  + "--animate " + "Toastify"
-  /* CSS_NAMESPACE */
-  + "__bounce-enter",
-  exit: "Toastify"
-  /* CSS_NAMESPACE */
-  + "--animate " + "Toastify"
-  /* CSS_NAMESPACE */
-  + "__bounce-exit",
-  appendPosition: true
-});
-var Slide = /*#__PURE__*/cssTransition({
-  enter: "Toastify"
-  /* CSS_NAMESPACE */
-  + "--animate " + "Toastify"
-  /* CSS_NAMESPACE */
-  + "__slide-enter",
-  exit: "Toastify"
-  /* CSS_NAMESPACE */
-  + "--animate " + "Toastify"
-  /* CSS_NAMESPACE */
-  + "__slide-exit",
-  appendPosition: true
-});
-var Zoom = /*#__PURE__*/cssTransition({
-  enter: "Toastify"
-  /* CSS_NAMESPACE */
-  + "--animate " + "Toastify"
-  /* CSS_NAMESPACE */
-  + "__zoom-enter",
-  exit: "Toastify"
-  /* CSS_NAMESPACE */
-  + "--animate " + "Toastify"
-  /* CSS_NAMESPACE */
-  + "__zoom-exit"
-});
-var Flip = /*#__PURE__*/cssTransition({
-  enter: "Toastify"
-  /* CSS_NAMESPACE */
-  + "--animate " + "Toastify"
-  /* CSS_NAMESPACE */
-  + "__flip-enter",
-  exit: "Toastify"
-  /* CSS_NAMESPACE */
-  + "--animate " + "Toastify"
-  /* CSS_NAMESPACE */
-  + "__flip-exit"
-});
-
-var ToastContainer = function ToastContainer(props) {
-  var _useToastContainer = useToastContainer(props),
-      getToastToRender = _useToastContainer.getToastToRender,
-      containerRef = _useToastContainer.containerRef,
-      isToastActive = _useToastContainer.isToastActive;
-
-  var className = props.className,
-      style = props.style,
-      rtl = props.rtl,
-      containerId = props.containerId;
-
-  function getClassName(position) {
-    var _cx;
-
-    var defaultClassName = cx("Toastify"
-    /* CSS_NAMESPACE */
-    + "__toast-container", "Toastify"
-    /* CSS_NAMESPACE */
-    + "__toast-container--" + position, (_cx = {}, _cx["Toastify"
-    /* CSS_NAMESPACE */
-    + "__toast-container--rtl"] = rtl, _cx));
-    return isFn(className) ? className({
-      position: position,
-      rtl: rtl,
-      defaultClassName: defaultClassName
-    }) : cx(defaultClassName, parseClassName(className));
-  }
-
-  return createElement("div", {
-    ref: containerRef,
-    className: "Toastify"
-    /* CSS_NAMESPACE */
-    ,
-    id: containerId
-  }, getToastToRender(function (position, toastList) {
-    var containerStyle = !toastList.length ? _extends({}, style, {
-      pointerEvents: 'none'
-    }) : _extends({}, style);
-    return createElement("div", {
-      className: getClassName(position),
-      style: containerStyle,
-      key: "container-" + position
-    }, toastList.map(function (_ref) {
-      var content = _ref.content,
-          toastProps = _ref.props;
-      return createElement(Toast, Object.assign({}, toastProps, {
-        isIn: isToastActive(toastProps.toastId),
-        key: "toast-" + toastProps.key,
-        closeButton: toastProps.closeButton === true ? CloseButton : toastProps.closeButton
-      }), content);
-    }));
-  }));
-};
-ToastContainer.defaultProps = {
-  position: POSITION.TOP_RIGHT,
-  transition: Bounce,
-  rtl: false,
-  autoClose: 5000,
-  hideProgressBar: false,
-  closeButton: CloseButton,
-  pauseOnHover: true,
-  pauseOnFocusLoss: true,
-  closeOnClick: true,
-  newestOnTop: false,
-  draggable: true,
-  draggablePercent: 80
-  /* DRAGGABLE_PERCENT */
-  ,
-  draggableDirection: "x"
-  /* X */
-  ,
-  role: 'alert',
-  theme: 'light'
-};
-
-var containers = /*#__PURE__*/new Map();
-var latestInstance;
-var containerDomNode;
-var containerConfig;
-var queue = [];
-var lazy = false;
-/**
- * Get the toast by id, given it's in the DOM, otherwise returns null
- */
-
-function getToast(toastId, _ref) {
-  var containerId = _ref.containerId;
-  var container = containers.get(containerId || latestInstance);
-  if (!container) return null;
-  return container.getToast(toastId);
-}
-/**
- * Generate a random toastId
- */
-
-
-function generateToastId() {
-  return Math.random().toString(36).substring(2, 9);
-}
-/**
- * Generate a toastId or use the one provided
- */
-
-
-function getToastId(options) {
-  if (options && (isStr(options.toastId) || isNum(options.toastId))) {
-    return options.toastId;
-  }
-
-  return generateToastId();
-}
-/**
- * If the container is not mounted, the toast is enqueued and
- * the container lazy mounted
- */
-
-
-function dispatchToast(content, options) {
-  if (containers.size > 0) {
-    eventManager.emit(0
-    /* Show */
-    , content, options);
-  } else {
-    queue.push({
-      content: content,
-      options: options
-    });
-
-    if (lazy && canUseDom) {
-      lazy = false;
-      containerDomNode = document.createElement('div');
-      document.body.appendChild(containerDomNode);
-      render(createElement(ToastContainer, Object.assign({}, containerConfig)), containerDomNode);
-    }
-  }
-
-  return options.toastId;
-}
-/**
- * Merge provided options with the defaults settings and generate the toastId
- */
-
-
-function mergeOptions(type, options) {
-  return _extends({}, options, {
-    type: options && options.type || type,
-    toastId: getToastId(options)
-  });
-}
-
-function createToastByType(type) {
-  return function (content, options) {
-    return dispatchToast(content, mergeOptions(type, options));
-  };
-}
-
-function toast(content, options) {
-  return dispatchToast(content, mergeOptions(TYPE.DEFAULT, options));
-}
-
-toast.loading = function (content, options) {
-  return dispatchToast(content, mergeOptions(TYPE.DEFAULT, _extends({
-    isLoading: true,
-    autoClose: false,
-    closeOnClick: false,
-    closeButton: false,
-    draggable: false
-  }, options)));
-};
-
-function handlePromise(promise, _ref2, options) {
-  var pending = _ref2.pending,
-      error = _ref2.error,
-      success = _ref2.success;
-  var id;
-
-  if (pending) {
-    id = isStr(pending) ? toast.loading(pending, options) : toast.loading(pending.render, _extends({}, options, pending));
-  }
-
-  var resetParams = {
-    isLoading: null,
-    autoClose: null,
-    closeOnClick: null,
-    closeButton: null,
-    draggable: null
-  };
-
-  var resolver = function resolver(type, input, result) {
-    // Remove the toast if the input has not been provided. This prevents the toast from hanging
-    // in the pending state if a success/error toast has not been provided.
-    if (input == null) {
-      toast.dismiss(id);
-      return;
-    }
-
-    var baseParams = _extends({
-      type: type
-    }, resetParams, options, {
-      data: result
-    });
-
-    var params = isStr(input) ? {
-      render: input
-    } : input; // if the id is set we know that it's an update
-
-    if (id) {
-      toast.update(id, _extends({}, baseParams, params));
-    } else {
-      // using toast.promise without loading
-      toast(params.render, _extends({}, baseParams, params));
-    }
-
-    return result;
-  };
-
-  var p = isFn(promise) ? promise() : promise; //call the resolvers only when needed
-
-  p.then(function (result) {
-    return resolver('success', success, result);
-  })["catch"](function (err) {
-    return resolver('error', error, err);
-  });
-  return p;
-}
-
-toast.promise = handlePromise;
-toast.success = /*#__PURE__*/createToastByType(TYPE.SUCCESS);
-toast.info = /*#__PURE__*/createToastByType(TYPE.INFO);
-toast.error = /*#__PURE__*/createToastByType(TYPE.ERROR);
-toast.warning = /*#__PURE__*/createToastByType(TYPE.WARNING);
-toast.warn = toast.warning;
-
-toast.dark = function (content, options) {
-  return dispatchToast(content, mergeOptions(TYPE.DEFAULT, _extends({
-    theme: 'dark'
-  }, options)));
-};
-/**
- * Remove toast programmaticaly
- */
-
-
-toast.dismiss = function (id) {
-  return eventManager.emit(1
-  /* Clear */
-  , id);
-};
-/**
- * Clear waiting queue when limit is used
- */
-
-
-toast.clearWaitingQueue = function (params) {
-  if (params === void 0) {
-    params = {};
-  }
-
-  return eventManager.emit(5
-  /* ClearWaitingQueue */
-  , params);
-};
-/**
- * return true if one container is displaying the toast
- */
-
-
-toast.isActive = function (id) {
-  var isToastActive = false;
-  containers.forEach(function (container) {
-    if (container.isToastActive && container.isToastActive(id)) {
-      isToastActive = true;
-    }
-  });
-  return isToastActive;
-};
-
-toast.update = function (toastId, options) {
-  if (options === void 0) {
-    options = {};
-  }
-
-  // if you call toast and toast.update directly nothing will be displayed
-  // this is why I defered the update
-  setTimeout(function () {
-    var toast = getToast(toastId, options);
-
-    if (toast) {
-      var oldOptions = toast.props,
-          oldContent = toast.content;
-
-      var nextOptions = _extends({}, oldOptions, options, {
-        toastId: options.toastId || toastId,
-        updateId: generateToastId()
-      });
-
-      if (nextOptions.toastId !== toastId) nextOptions.staleId = toastId;
-      var content = nextOptions.render || oldContent;
-      delete nextOptions.render;
-      dispatchToast(content, nextOptions);
-    }
-  }, 0);
-};
-/**
- * Used for controlled progress bar.
- */
-
-
-toast.done = function (id) {
-  toast.update(id, {
-    progress: 1
-  });
-};
-/**
- * @deprecated
- * API will change in the next major release
- *
- * Track changes. The callback get the number of toast displayed
- */
-
-
-toast.onChange = function (callback) {
-  if (isFn(callback)) {
-    eventManager.on(4
-    /* Change */
-    , callback);
-  }
-
-  return function () {
-    isFn(callback) && eventManager.off(4
-    /* Change */
-    , callback);
-  };
-};
-/**
- * @deprecated
- * will be removed in the next major release
- *
- * Configure the ToastContainer when lazy mounted
- * Prefer ToastContainer over this one
- */
-
-
-toast.configure = function (config) {
-  if (config === void 0) {
-    config = {};
-  }
-
-  lazy = true;
-  containerConfig = config;
-};
-
-toast.POSITION = POSITION;
-toast.TYPE = TYPE;
-/**
- * Wait until the ToastContainer is mounted to dispatch the toast
- * and attach isActive method
- */
-
-eventManager.on(2
-/* DidMount */
-, function (containerInstance) {
-  latestInstance = containerInstance.containerId || containerInstance;
-  containers.set(latestInstance, containerInstance);
-  queue.forEach(function (item) {
-    eventManager.emit(0
-    /* Show */
-    , item.content, item.options);
-  });
-  queue = [];
-}).on(3
-/* WillUnmount */
-, function (containerInstance) {
-  containers["delete"](containerInstance.containerId || containerInstance);
-
-  if (containers.size === 0) {
-    eventManager.off(0
-    /* Show */
-    ).off(1
-    /* Clear */
-    ).off(5
-    /* ClearWaitingQueue */
-    );
-  }
-
-  if (canUseDom && containerDomNode) {
-    document.body.removeChild(containerDomNode);
-  }
-});
-
-export { Bounce, Flip, Icons, Slide, ToastContainer, Zoom, collapseToast, cssTransition, toast, useToast, useToastContainer };
+import e,{isValidElement as t,useRef as n,useLayoutEffect as o,useEffect as s,useReducer as a,useState as r,cloneElement as i}from"react";import c from"clsx";function l(e){return"number"==typeof e&&!isNaN(e)}function u(e){return"boolean"==typeof e}function d(e){return"string"==typeof e}function p(e){return"function"==typeof e}function m(e){return d(e)||p(e)?e:null}function f(e){return 0===e||e}function g(e){return t(e)||d(e)||p(e)||l(e)}const y={TOP_LEFT:"top-left",TOP_RIGHT:"top-right",TOP_CENTER:"top-center",BOTTOM_LEFT:"bottom-left",BOTTOM_RIGHT:"bottom-right",BOTTOM_CENTER:"bottom-center"},h={INFO:"info",SUCCESS:"success",WARNING:"warning",ERROR:"error",DEFAULT:"default"};function T(e,t,n){void 0===n&&(n=300);const{scrollHeight:o,style:s}=e;requestAnimationFrame(()=>{s.minHeight="initial",s.height=o+"px",s.transition="all "+n+"ms",requestAnimationFrame(()=>{s.height="0",s.padding="0",s.margin="0",setTimeout(t,n)})})}function v(t){let{enter:a,exit:r,appendPosition:i=!1,collapse:c=!0,collapseDuration:l=300}=t;return function(t){let{children:u,position:d,preventExitTransition:p,done:m,nodeRef:f,isIn:g}=t;const y=i?a+"--"+d:a,h=i?r+"--"+d:r,v=n(),E=n(0);function b(e){if(e.target!==f.current)return;const t=f.current;t.dispatchEvent(new Event("d")),t.removeEventListener("animationend",b),t.removeEventListener("animationcancel",b),0===E.current&&(t.className=v.current)}function C(){const e=f.current;e.removeEventListener("animationend",C),c?T(e,m,l):m()}return o(()=>{!function(){const e=f.current;v.current=e.className,e.className+=" "+y,e.addEventListener("animationend",b),e.addEventListener("animationcancel",b)}()},[]),s(()=>{g||(p?C():function(){E.current=1;const e=f.current;e.className+=" "+h,e.addEventListener("animationend",C)}())},[g]),e.createElement(e.Fragment,null,u)}}function E(e){return{content:e.content,containerId:e.props.containerId,id:e.props.toastId,theme:e.props.theme,type:e.props.type,data:e.props.data||{},isLoading:e.props.isLoading,icon:e.props.icon}}const b={list:new Map,emitQueue:new Map,on(e,t){return this.list.has(e)||this.list.set(e,[]),this.list.get(e).push(t),this},off(e,t){if(t){const n=this.list.get(e).filter(e=>e!==t);return this.list.set(e,n),this}return this.list.delete(e),this},cancelEmit(e){const t=this.emitQueue.get(e);return t&&(t.forEach(clearTimeout),this.emitQueue.delete(e)),this},emit(e){this.list.has(e)&&this.list.get(e).forEach(t=>{const n=setTimeout(()=>{t(...[].slice.call(arguments,1))},0);this.emitQueue.has(e)||this.emitQueue.set(e,[]),this.emitQueue.get(e).push(n)})}},C=t=>{let{theme:n,type:o,...s}=t;return e.createElement("svg",{viewBox:"0 0 24 24",width:"100%",height:"100%",fill:"colored"===n?"currentColor":"var(--toastify-icon-color-"+o+")",...s})},_={info:function(t){return e.createElement(C,{...t},e.createElement("path",{d:"M12 0a12 12 0 1012 12A12.013 12.013 0 0012 0zm.25 5a1.5 1.5 0 11-1.5 1.5 1.5 1.5 0 011.5-1.5zm2.25 13.5h-4a1 1 0 010-2h.75a.25.25 0 00.25-.25v-4.5a.25.25 0 00-.25-.25h-.75a1 1 0 010-2h1a2 2 0 012 2v4.75a.25.25 0 00.25.25h.75a1 1 0 110 2z"}))},warning:function(t){return e.createElement(C,{...t},e.createElement("path",{d:"M23.32 17.191L15.438 2.184C14.728.833 13.416 0 11.996 0c-1.42 0-2.733.833-3.443 2.184L.533 17.448a4.744 4.744 0 000 4.368C1.243 23.167 2.555 24 3.975 24h16.05C22.22 24 24 22.044 24 19.632c0-.904-.251-1.746-.68-2.44zm-9.622 1.46c0 1.033-.724 1.823-1.698 1.823s-1.698-.79-1.698-1.822v-.043c0-1.028.724-1.822 1.698-1.822s1.698.79 1.698 1.822v.043zm.039-12.285l-.84 8.06c-.057.581-.408.943-.897.943-.49 0-.84-.367-.896-.942l-.84-8.065c-.057-.624.25-1.095.779-1.095h1.91c.528.005.84.476.784 1.1z"}))},success:function(t){return e.createElement(C,{...t},e.createElement("path",{d:"M12 0a12 12 0 1012 12A12.014 12.014 0 0012 0zm6.927 8.2l-6.845 9.289a1.011 1.011 0 01-1.43.188l-4.888-3.908a1 1 0 111.25-1.562l4.076 3.261 6.227-8.451a1 1 0 111.61 1.183z"}))},error:function(t){return e.createElement(C,{...t},e.createElement("path",{d:"M11.983 0a12.206 12.206 0 00-8.51 3.653A11.8 11.8 0 000 12.207 11.779 11.779 0 0011.8 24h.214A12.111 12.111 0 0024 11.791 11.766 11.766 0 0011.983 0zM10.5 16.542a1.476 1.476 0 011.449-1.53h.027a1.527 1.527 0 011.523 1.47 1.475 1.475 0 01-1.449 1.53h-.027a1.529 1.529 0 01-1.523-1.47zM11 12.5v-6a1 1 0 012 0v6a1 1 0 11-2 0z"}))},spinner:function(){return e.createElement("div",{className:"Toastify__spinner"})}};function I(e){const[,o]=a(e=>e+1,0),[c,y]=r([]),h=n(null),T=n(new Map).current,v=e=>-1!==c.indexOf(e),C=n({toastKey:1,displayedToast:0,count:0,queue:[],props:e,containerId:null,isToastActive:v,getToast:e=>T.get(e)}).current;function I(e){let{containerId:t}=e;const{limit:n}=C.props;!n||t&&C.containerId!==t||(C.count-=C.queue.length,C.queue=[])}function O(e){y(t=>f(e)?t.filter(t=>t!==e):[])}function L(){const{toastContent:e,toastProps:t,staleId:n}=C.queue.shift();P(e,t,n)}function N(e,n){let{delay:s,staleId:a,...r}=n;if(!g(e)||function(e){return!h.current||C.props.enableMultiContainer&&e.containerId!==C.props.containerId||T.has(e.toastId)&&null==e.updateId}(r))return;const{toastId:c,updateId:y,data:v}=r,{props:I}=C,N=()=>O(c),x=null==y;x&&C.count++;const B={toastId:c,updateId:y,containerId:r.containerId,isLoading:r.isLoading,theme:r.theme||I.theme,icon:null!=r.icon?r.icon:I.icon,isIn:!1,key:r.key||C.toastKey++,type:r.type,closeToast:N,closeButton:r.closeButton,rtl:I.rtl,position:r.position||I.position,transition:r.transition||I.transition,className:m(r.className||I.toastClassName),bodyClassName:m(r.bodyClassName||I.bodyClassName),style:r.style||I.toastStyle,bodyStyle:r.bodyStyle||I.bodyStyle,onClick:r.onClick||I.onClick,pauseOnHover:u(r.pauseOnHover)?r.pauseOnHover:I.pauseOnHover,pauseOnFocusLoss:u(r.pauseOnFocusLoss)?r.pauseOnFocusLoss:I.pauseOnFocusLoss,draggable:u(r.draggable)?r.draggable:I.draggable,draggablePercent:r.draggablePercent||I.draggablePercent,draggableDirection:r.draggableDirection||I.draggableDirection,closeOnClick:u(r.closeOnClick)?r.closeOnClick:I.closeOnClick,progressClassName:m(r.progressClassName||I.progressClassName),progressStyle:r.progressStyle||I.progressStyle,autoClose:!r.isLoading&&(R=r.autoClose,k=I.autoClose,!1===R||l(R)&&R>0?R:k),hideProgressBar:u(r.hideProgressBar)?r.hideProgressBar:I.hideProgressBar,progress:r.progress,role:r.role||I.role,deleteToast(){const e=E(T.get(c));T.delete(c),b.emit(4,{toasts:Array.from(T.values(),E),removed:e});const t=C.queue.length;if(C.count=f(c)?C.count-1:C.count-C.displayedToast,C.count<0&&(C.count=0),t>0){const e=f(c)?1:C.props.limit;if(1===t||1===e)C.displayedToast++,L();else{const n=e>t?t:e;C.displayedToast=n;for(let e=0;e<n;e++)L()}}else o()}};var R,k;const M=_[B.type],D={theme:B.theme,type:B.type};B.icon=M&&M(D),!1===B.icon?B.icon=void 0:p(B.icon)?B.icon=B.icon(D):t(B.icon)?B.icon=i(B.icon,D):d(B.icon)?B.icon=B.icon:B.isLoading&&(B.icon=_.spinner()),p(r.onOpen)&&(B.onOpen=r.onOpen),p(r.onClose)&&(B.onClose=r.onClose),B.closeButton=I.closeButton,!1===r.closeButton||g(r.closeButton)?B.closeButton=r.closeButton:!0===r.closeButton&&(B.closeButton=!g(I.closeButton)||I.closeButton);let w=e;t(e)&&!d(e.type)?w=i(e,{closeToast:N,toastProps:B,data:v}):p(e)&&(w=e({closeToast:N,toastProps:B,data:v})),I.limit&&I.limit>0&&C.count>I.limit&&x?C.queue.push({toastContent:w,toastProps:B,staleId:a}):l(s)?setTimeout(()=>{P(w,B,a)},s):P(w,B,a)}function P(e,t,n){const{toastId:o}=t;n&&T.delete(n);const s={content:e,props:t};T.set(o,s),y(e=>[...e,o].filter(e=>e!==n)),b.emit(4,{toasts:Array.from(T.values(),E),added:E(s)})}return s(()=>(C.containerId=e.containerId,b.cancelEmit(3).on(0,N).on(1,e=>h.current&&O(e)).on(5,I).emit(2,C),()=>b.emit(3,C)),[]),s(()=>{C.props=e,C.isToastActive=v,C.displayedToast=c.length}),{getToastToRender:function(t){const n=new Map,o=Array.from(T.values());return e.newestOnTop&&o.reverse(),o.forEach(e=>{const{position:t}=e.props;n.has(t)||n.set(t,[]),n.get(t).push(e)}),Array.from(n,e=>t(e[0],e[1]))},containerRef:h,isToastActive:v}}function O(e){return e.targetTouches&&e.targetTouches.length>=1?e.targetTouches[0].clientX:e.clientX}function L(e){return e.targetTouches&&e.targetTouches.length>=1?e.targetTouches[0].clientY:e.clientY}function N(e){const[o,a]=r(!1),[i,c]=r(!1),l=n(null),u=n({start:0,x:0,y:0,delta:0,removalDistance:0,canCloseOnClick:!0,canDrag:!1,boundingRect:null,didMove:!1}).current,d=n(e),{autoClose:m,pauseOnHover:f,closeToast:g,onClick:y,closeOnClick:h}=e;function T(t){if(e.draggable){u.didMove=!1,document.addEventListener("mousemove",C),document.addEventListener("mouseup",_),document.addEventListener("touchmove",C),document.addEventListener("touchend",_);const n=l.current;u.canCloseOnClick=!0,u.canDrag=!0,u.boundingRect=n.getBoundingClientRect(),n.style.transition="",u.x=O(t.nativeEvent),u.y=L(t.nativeEvent),"x"===e.draggableDirection?(u.start=u.x,u.removalDistance=n.offsetWidth*(e.draggablePercent/100)):(u.start=u.y,u.removalDistance=n.offsetHeight*(80===e.draggablePercent?1.5*e.draggablePercent:e.draggablePercent/100))}}function v(){if(u.boundingRect){const{top:t,bottom:n,left:o,right:s}=u.boundingRect;e.pauseOnHover&&u.x>=o&&u.x<=s&&u.y>=t&&u.y<=n?b():E()}}function E(){a(!0)}function b(){a(!1)}function C(t){const n=l.current;u.canDrag&&n&&(u.didMove=!0,o&&b(),u.x=O(t),u.y=L(t),u.delta="x"===e.draggableDirection?u.x-u.start:u.y-u.start,u.start!==u.x&&(u.canCloseOnClick=!1),n.style.transform="translate"+e.draggableDirection+"("+u.delta+"px)",n.style.opacity=""+(1-Math.abs(u.delta/u.removalDistance)))}function _(){document.removeEventListener("mousemove",C),document.removeEventListener("mouseup",_),document.removeEventListener("touchmove",C),document.removeEventListener("touchend",_);const t=l.current;if(u.canDrag&&u.didMove&&t){if(u.canDrag=!1,Math.abs(u.delta)>u.removalDistance)return c(!0),void e.closeToast();t.style.transition="transform 0.2s, opacity 0.2s",t.style.transform="translate"+e.draggableDirection+"(0)",t.style.opacity="1"}}s(()=>{d.current=e}),s(()=>(l.current&&l.current.addEventListener("d",E,{once:!0}),p(e.onOpen)&&e.onOpen(t(e.children)&&e.children.props),()=>{const e=d.current;p(e.onClose)&&e.onClose(t(e.children)&&e.children.props)}),[]),s(()=>(e.pauseOnFocusLoss&&(document.hasFocus()||b(),window.addEventListener("focus",E),window.addEventListener("blur",b)),()=>{e.pauseOnFocusLoss&&(window.removeEventListener("focus",E),window.removeEventListener("blur",b))}),[e.pauseOnFocusLoss]);const I={onMouseDown:T,onTouchStart:T,onMouseUp:v,onTouchEnd:v};return m&&f&&(I.onMouseEnter=b,I.onMouseLeave=E),h&&(I.onClick=e=>{y&&y(e),u.canCloseOnClick&&g()}),{playToast:E,pauseToast:b,isRunning:o,preventExitTransition:i,toastRef:l,eventHandlers:I}}function P(t){let{closeToast:n,theme:o,ariaLabel:s="close"}=t;return e.createElement("button",{className:"Toastify__close-button Toastify__close-button--"+o,type:"button",onClick:e=>{e.stopPropagation(),n(e)},"aria-label":s},e.createElement("svg",{"aria-hidden":"true",viewBox:"0 0 14 16"},e.createElement("path",{fillRule:"evenodd",d:"M7.71 8.23l3.75 3.75-1.48 1.48-3.75-3.75-3.75 3.75L1 11.98l3.75-3.75L1 4.48 2.48 3l3.75 3.75L9.98 3l1.48 1.48-3.75 3.75z"})))}function x(t){let{delay:n,isRunning:o,closeToast:s,type:a,hide:r,className:i,style:l,controlledProgress:u,progress:d,rtl:m,isIn:f,theme:g}=t;const y={...l,animationDuration:n+"ms",animationPlayState:o?"running":"paused",opacity:r?0:1};u&&(y.transform="scaleX("+d+")");const h=c("Toastify__progress-bar",u?"Toastify__progress-bar--controlled":"Toastify__progress-bar--animated","Toastify__progress-bar-theme--"+g,"Toastify__progress-bar--"+a,{"Toastify__progress-bar--rtl":m}),T=p(i)?i({rtl:m,type:a,defaultClassName:h}):c(h,i);return e.createElement("div",{role:"progressbar","aria-hidden":r?"true":"false","aria-label":"notification timer",className:T,style:y,[u&&d>=1?"onTransitionEnd":"onAnimationEnd"]:u&&d<1?null:()=>{f&&s()}})}x.defaultProps={type:h.DEFAULT,hide:!1};const B=t=>{const{isRunning:n,preventExitTransition:o,toastRef:s,eventHandlers:a}=N(t),{closeButton:r,children:i,autoClose:l,onClick:u,type:d,hideProgressBar:m,closeToast:f,transition:g,position:y,className:h,style:T,bodyClassName:v,bodyStyle:E,progressClassName:b,progressStyle:C,updateId:_,role:I,progress:O,rtl:L,toastId:P,deleteToast:B,isIn:R,isLoading:k,icon:M,theme:D}=t,w=c("Toastify__toast","Toastify__toast-theme--"+D,"Toastify__toast--"+d,{"Toastify__toast--rtl":L}),A=p(h)?h({rtl:L,position:y,type:d,defaultClassName:w}):c(w,h),F=!!O;return e.createElement(g,{isIn:R,done:B,position:y,preventExitTransition:o,nodeRef:s},e.createElement("div",{id:P,onClick:u,className:A,...a,style:T,ref:s},e.createElement("div",{...R&&{role:I},className:p(v)?v({type:d}):c("Toastify__toast-body",v),style:E},M&&e.createElement("div",{className:c("Toastify__toast-icon",{"Toastify--animate-icon Toastify__zoom-enter":!k})},M),e.createElement("div",null,i)),function(t){if(!t)return;const n={closeToast:f,type:d,theme:D};return p(t)?t(n):e.isValidElement(t)?e.cloneElement(t,n):void 0}(r),(l||F)&&e.createElement(x,{..._&&!F?{key:"pb-"+_}:{},rtl:L,theme:D,delay:l,isRunning:n,isIn:R,closeToast:f,hide:m,type:d,style:C,className:b,controlledProgress:F,progress:O})))},R=v({enter:"Toastify--animate Toastify__bounce-enter",exit:"Toastify--animate Toastify__bounce-exit",appendPosition:!0}),k=v({enter:"Toastify--animate Toastify__slide-enter",exit:"Toastify--animate Toastify__slide-exit",appendPosition:!0}),M=v({enter:"Toastify--animate Toastify__zoom-enter",exit:"Toastify--animate Toastify__zoom-exit"}),D=v({enter:"Toastify--animate Toastify__flip-enter",exit:"Toastify--animate Toastify__flip-exit"}),w=t=>{const{getToastToRender:n,containerRef:o,isToastActive:s}=I(t),{className:a,style:r,rtl:i,containerId:l}=t;function u(e){const t=c("Toastify__toast-container","Toastify__toast-container--"+e,{"Toastify__toast-container--rtl":i});return p(a)?a({position:e,rtl:i,defaultClassName:t}):c(t,m(a))}return e.createElement("div",{ref:o,className:"Toastify",id:l},n((t,n)=>{const o=n.length?{...r}:{...r,pointerEvents:"none"};return e.createElement("div",{className:u(t),style:o,key:"container-"+t},n.map(t=>{let{content:n,props:o}=t;return e.createElement(B,{...o,isIn:s(o.toastId),key:"toast-"+o.key,closeButton:!0===o.closeButton?P:o.closeButton},n)}))}))};w.defaultProps={position:y.TOP_RIGHT,transition:R,rtl:!1,autoClose:5e3,hideProgressBar:!1,closeButton:P,pauseOnHover:!0,pauseOnFocusLoss:!0,closeOnClick:!0,newestOnTop:!1,draggable:!0,draggablePercent:80,draggableDirection:"x",role:"alert",theme:"light"};let A,F=new Map,S=[];function z(){return Math.random().toString(36).substring(2,9)}function H(e){return e&&(d(e.toastId)||l(e.toastId))?e.toastId:z()}function q(e,t){return F.size>0?b.emit(0,e,t):S.push({content:e,options:t}),t.toastId}function U(e,t){return{...t,type:t&&t.type||e,toastId:H(t)}}function Q(e){return(t,n)=>q(t,U(e,n))}function G(e,t){return q(e,U(h.DEFAULT,t))}G.loading=(e,t)=>q(e,U(h.DEFAULT,{isLoading:!0,autoClose:!1,closeOnClick:!1,closeButton:!1,draggable:!1,...t})),G.promise=function(e,t,n){let o,{pending:s,error:a,success:r}=t;s&&(o=d(s)?G.loading(s,n):G.loading(s.render,{...n,...s}));const i={isLoading:null,autoClose:null,closeOnClick:null,closeButton:null,draggable:null},c=(e,t,s)=>{if(null==t)return void G.dismiss(o);const a={type:e,...i,...n,data:s},r=d(t)?{render:t}:t;return o?G.update(o,{...a,...r}):G(r.render,{...a,...r}),s},l=p(e)?e():e;return l.then(e=>c("success",r,e)).catch(e=>c("error",a,e)),l},G.success=Q(h.SUCCESS),G.info=Q(h.INFO),G.error=Q(h.ERROR),G.warning=Q(h.WARNING),G.warn=G.warning,G.dark=(e,t)=>q(e,U(h.DEFAULT,{theme:"dark",...t})),G.dismiss=e=>b.emit(1,e),G.clearWaitingQueue=function(e){return void 0===e&&(e={}),b.emit(5,e)},G.isActive=e=>{let t=!1;return F.forEach(n=>{n.isToastActive&&n.isToastActive(e)&&(t=!0)}),t},G.update=function(e,t){void 0===t&&(t={}),setTimeout(()=>{const n=function(e,t){let{containerId:n}=t;const o=F.get(n||A);return o?o.getToast(e):null}(e,t);if(n){const{props:o,content:s}=n,a={...o,...t,toastId:t.toastId||e,updateId:z()};a.toastId!==e&&(a.staleId=e);const r=a.render||s;delete a.render,q(r,a)}},0)},G.done=e=>{G.update(e,{progress:1})},G.onChange=e=>(b.on(4,e),()=>{b.off(4,e)}),G.POSITION=y,G.TYPE=h,b.on(2,e=>{A=e.containerId||e,F.set(A,e),S.forEach(e=>{b.emit(0,e.content,e.options)}),S=[]}).on(3,e=>{F.delete(e.containerId||e),0===F.size&&b.off(0).off(1).off(5)});export{R as Bounce,D as Flip,_ as Icons,k as Slide,w as ToastContainer,M as Zoom,T as collapseToast,v as cssTransition,G as toast,N as useToast,I as useToastContainer};
 //# sourceMappingURL=react-toastify.esm.js.map

dist/types/index.d.ts

@@ -1,2 +0,2 @@
-import * as React from 'react';
+import React from 'react';
 declare type Nullable<T> = {
@@ -255,2 +255,12 @@ [P in keyof T]: T[P] | null;
 }
+export interface ToastItem<Data = {}> {
+    content: React.ReactNode;
+    id: Id;
+    theme?: Theme;
+    type?: TypeOptions;
+    isLoading?: boolean;
+    containerId?: Id;
+    data: Data;
+    icon?: React.ReactNode | false;
+}
 export {};

dist/utils/cssTransition.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="react" />
 import { ToastTransitionProps } from '../types';
@@ -3,0 +2,0 @@ export interface CSSTransitionProps {

dist/utils/index.d.ts

@@ -5,1 +5,2 @@ export * from './propValidator';
 export * from './collapseToast';
+export * from './mapper';

dist/utils/propValidator.d.ts

@@ -7,5 +7,4 @@ import { Id } from '../types';
 export declare function parseClassName(v: any): any;
-export declare function isToastIdValid(toastId?: Id): string | number | true | undefined;
+export declare function isToastIdValid(toastId?: Id): true | Id | undefined;
 export declare function getAutoCloseDelay(toastAutoClose?: false | number, containerAutoClose?: false | number): number | false | undefined;
-export declare const canUseDom: boolean;
 export declare function canBeRendered<T>(content: T): boolean;

package.json

 {
-  "version": "8.2.0",
+  "version": "9.0.0-POC",
   "license": "MIT",
-  "main": "dist/index.js",
   "typings": "dist/index.d.ts",
@@ -18,2 +17,3 @@ "description": "React notification made easy",
     "dist",
+    "addons",
     "scss"
@@ -24,7 +24,7 @@ ],
     "start": "cd example && npm run start",
-    "build": "npm run prepare",
-    "test": "tsdx test --passWithNoTests",
-    "test:coverage": "tsdx test --coverage",
-    "lint": "tsdx lint src",
-    "prepare": "tsdx build && npm run style",
+    "test": "jest",
+    "clean": "rimraf dist && rimraf addons",
+    "test:coverage": "yarn test --coverage",
+    "lint": "eslint \"src/**/*.{ts,tsx}\"",
+    "prettier": "prettier --write src",
     "sass": "sass scss/main.scss dist/ReactToastify.css",
@@ -35,3 +35,12 @@ "sass-minimal": "sass scss/minimal.scss dist/ReactToastify.minimal.css",
     "style": "npm run sass && npm run sass-minimal && cssnano dist/ReactToastify.css dist/ReactToastify.min.css --no-zindex --no-reduceIdents && npm run style-injector",
-    "style-injector": "style2js --out-dir dist dist/ReactToastify.min.css"
+    "style-injector": "style2js --out-dir dist dist/ReactToastify.min.css",
+    "prebuild": "npm run clean",
+    "build": "npm run build:core && npm run build:addons && npm run style && husky install",
+    "build:core": "microbundle --jsx React.createElement",
+    "build:debug": "microbundle --jsx React.createElement --compress false",
+    "build:addons": "node build-addons.mjs",
+    "build:addons-debug": "node build-addons.mjs debug",
+    "setup:dev": "npm run build && yarn pack -f react-toastify.tgz && npm run rm-pkg && npm run extract-pkg",
+    "rm-pkg": "rimraf node_modules/react-toastify && mkdir -p node_modules/react-toastify",
+    "extract-pkg": "tar xzvf react-toastify.tgz -C node_modules/react-toastify --strip-components 1 && rimraf react-toastify.tgz"
   },
@@ -42,21 +51,38 @@ "peerDependencies": {
   },
-  "husky": {
-    "hooks": {
-      "pre-commit": "npm run lint"
-    }
-  },
   "prettier": {
     "printWidth": 80,
     "semi": true,
-    "singleQuote": true
+    "singleQuote": true,
+    "trailingComma": "none",
+    "arrowParens": "avoid"
   },
-  "eslint": {
-    "rules": {
-      "react-hooks/exhaustive-deps": "warn"
-    }
-  },
   "jest": {
     "verbose": true,
+    "globals": {
+      "ts-jest": {
+        "isolatedModules": true
+      }
+    },
     "coveragePathIgnorePatterns": [
       "/src/index.tsx"
+    ],
+    "roots": [
+      "<rootDir>/test"
+    ],
+    "transform": {
+      "^.+\\.tsx?$": "ts-jest"
+    },
+    "setupFilesAfterEnv": [
+      "@testing-library/jest-dom/extend-expect"
+    ],
+    "testRegex": "(.+(test|spec))\\.tsx?$",
+    "testEnvironment": "jsdom",
+    "testRunner": "jest-jasmine2",
+    "moduleFileExtensions": [
+      "ts",
+      "tsx",
+      "js",
+      "jsx",
+      "json",
+      "node"
     ]
@@ -74,19 +100,30 @@ },
   "homepage": "https://github.com/fkhadra/react-toastify#readme",
-  "module": "dist/react-toastify.esm.js",
   "devDependencies": {
-    "@testing-library/react": "^12.0.0",
-    "@types/jest": "^24.9.0",
-    "@types/react": "^17.0.19",
+    "@testing-library/jest-dom": "^5.16.2",
+    "@testing-library/react": "^12.1.3",
+    "@types/jest": "^27.4.0",
+    "@types/react": "^17.0.39",
     "@types/react-dom": "^17.0.9",
+    "@typescript-eslint/eslint-plugin": "^5.12.0",
+    "@typescript-eslint/parser": "^5.12.0",
     "coveralls": "^3.0.9",
     "cssnano": "^4.1.10",
     "cssnano-cli": "^1.0.5",
-    "husky": "^4.2.0",
+    "eslint": "^8.9.0",
+    "eslint-plugin-import": "^2.25.4",
+    "eslint-plugin-jsx-a11y": "^6.5.1",
+    "eslint-plugin-react": "^7.28.0",
+    "eslint-plugin-react-hooks": "^4.3.0",
+    "husky": "^7.0.0",
+    "jest": "^27.5.1",
+    "microbundle": "^0.14.2",
     "postcss": "^8.2.13",
     "postcss-cli": "^7.1.0",
+    "prettier": "2.5.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "sass": "^1.26.0",
+    "rimraf": "^3.0.2",
+    "sass": "^1.49.7",
     "style2js": "^1.0.0",
-    "tsdx": "^0.14.1",
+    "ts-jest": "^27.1.3",
     "tslib": "^2.3.1",
@@ -97,3 +134,35 @@ "typescript": "^4.3.5"
     "clsx": "^1.1.1"
+  },
+  "main": "dist/react-toastify.js",
+  "module": "dist/react-toastify.esm.js",
+  "umd:main": "dist/react-toastify.umd.js",
+  "unpkg": "dist/react-toastify.umd.js",
+  "source": "src/index.ts",
+  "exports": {
+    ".": {
+      "require": "./dist/react-toastify.js",
+      "import": "./dist/react-toastify.esm.js",
+      "umd": "./dist/react-toastify.umd.js"
+    },
+    "./dist/ReactToastify.min.css": "./dist/ReactToastify.min.css",
+    "./dist/ReactToastify.css": "./dist/ReactToastify.css",
+    "./dist/ReactToastify.minimal.css": "./dist/ReactToastify.minimal.css",
+    "./ReactToastify.min.css": "./dist/ReactToastify.min.css",
+    "./ReactToastify.css": "./dist/ReactToastify.css",
+    "./ReactToastify.minimal.css": "./dist/ReactToastify.minimal.css",
+    "./dist/inject-style": {
+      "require": "./dist/inject-style.js",
+      "import": "./dist/inject-style.esm.js"
+    },
+    "./inject-style": {
+      "require": "./dist/inject-style.js",
+      "import": "./dist/inject-style.esm.js"
+    },
+    "./package.json": "./package.json",
+    "./scss": "./scss",
+    "./addons/use-notification-center": {
+      "require": "./addons/use-notification-center/index.js",
+      "import": "./addons/use-notification-center/index.esm.js"
+    }
   }
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Improved metrics

Number of package files

57

increased by9.62%

Number of low supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

388034

decreased by-11.9%

Dev dependency count

29

increased by70.59%

Lines of code

1658

decreased by-57.16%

Number of low quality alerts

4

increased by300%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes