diff --git a/src/state.ts b/src/state.ts
index b917f56..344b7f1 100644
--- a/src/state.ts
+++ b/src/state.ts
@@ -36,6 +36,7 @@ class Observer {
       message?: string | React.ReactNode;
       type?: ToastTypes;
       promise?: PromiseT;
+      jsx?: React.ReactElement;
     },
   ) => {
     const { message, ...rest } = data;
@@ -149,10 +150,9 @@ class Observer {
     return id;
   };
 
-  // We can't provide the toast we just created as a prop as we didn't create it yet, so we can create a default toast object, I just don't know how to use function in argument when calling()?
   custom = (jsx: (id: number | string) => React.ReactElement, data?: ExternalToast) => {
     const id = data?.id || toastsCounter++;
-    this.publish({ jsx: jsx(id), id, ...data });
+    this.create({ jsx: jsx(id), id, ...data });
     return id;
   };
 }
diff --git a/website/src/pages/toast.mdx b/website/src/pages/toast.mdx
index 1cdfe7e..3ec320e 100644
--- a/website/src/pages/toast.mdx
+++ b/website/src/pages/toast.mdx
@@ -162,6 +162,12 @@ const toastId = toast('Event has been created');
 toast.dismiss(toastId);
 ```
 
+You can also dismiss all toasts at once by calling `toast.dismiss()` without an id.
+
+```jsx
+toast.dismiss();
+```
+
 ## API Reference
 
 | Property    |                                              Description                                               |        Default |