feat: Add toast type function (success, danger, warning)

README.md

@@ -70,6 +70,13 @@ toast.show("Task finished successfully", {
 });
 ```
 
+### success(), danger(), warning()
+```js
+toast.success("success");
+toast.danger("danger");
+toast.warning("warning");
+```
+
 ### update()
 
 ```js

src/hook/context.ts

@@ -3,7 +3,7 @@ import ToastContainer from "../toast-container";
 
 export type ToastType = Pick<
   ToastContainer,
-  "show" | "update" | "hide" | "hideAll" | "isOpen"
+  "show" | "success" | "danger" | "warning" | "update" | "hide" | "hideAll" | "isOpen"
 >;
 
 const ToastContext = React.createContext({} as ToastType);

src/toast-container.tsx

@@ -40,32 +40,22 @@ class ToastContainer extends Component<Props, State> {
   /**
    * Shows a new toast. Returns id
    */
-  show = (message: string | JSX.Element, toastOptions?: ToastOptions) => {
-    let id = toastOptions?.id || Math.random().toString();
-    const onDestroy = () => {
-      toastOptions?.onClose && toastOptions?.onClose();
-      this.setState({ toasts: this.state.toasts.filter((t) => t.id !== id) });
-    };
+  show = (message: string | JSX.Element, toastOptions?: ToastOptions) => this.renderToast(message, toastOptions)
 
-    requestAnimationFrame(() => {
-      this.setState({
-        toasts: [
-          {
-            id,
-            onDestroy,
-            message,
-            open: true,
-            onHide: () => this.hide(id),
-            ...this.props,
-            ...toastOptions,
-          },
-          ...this.state.toasts.filter((t) => t.open),
-        ],
-      });
-    });
+  /**
+   * Shows a new success toast. Returns id
+   */
+  success = (message: string | JSX.Element, toastOptions?: ToastOptions) => this.renderToast(message, { type: "success", ...toastOptions })
 
-    return id;
-  };
+  /**
+   * Shows a new danger toast. Returns id
+   */
+  danger = (message: string | JSX.Element, toastOptions?: ToastOptions) => this.renderToast(message, { type: "danger", ...toastOptions })
+
+  /**
+   * Shows a new warning toast. Returns id
+   */
+  warning = (message: string | JSX.Element, toastOptions?: ToastOptions) => this.renderToast(message, { type: "warning", ...toastOptions })
 
   /**
    * Updates a toast, To use this create you must pass an id to show method first, then pass it here to update the toast.
@@ -109,6 +99,33 @@ class ToastContainer extends Component<Props, State> {
     return this.state.toasts.some((t) => t.id === id && t.open);
   }
 
+  renderToast(message: string | JSX.Element, toastOptions?: ToastOptions) {
+    let id = toastOptions?.id || Math.random().toString();
+    const onDestroy = () => {
+      toastOptions?.onClose && toastOptions?.onClose();
+      this.setState({ toasts: this.state.toasts.filter((t) => t.id !== id) });
+    };
+
+    requestAnimationFrame(() => {
+      this.setState({
+        toasts: [
+          {
+            id,
+            onDestroy,
+            message,
+            open: true,
+            onHide: () => this.hide(id),
+            ...this.props,
+            ...toastOptions,
+          },
+          ...this.state.toasts.filter((t) => t.open),
+        ],
+      });
+    });
+
+    return id;
+  }
+
   renderBottomToasts() {
     const { toasts } = this.state;
     let { offset, offsetBottom } = this.props;