Merge pull request #13 from Blankeos/feat/toast-loading

feat: add toast.loading() api.

README.md

@@ -127,6 +127,14 @@ toast.promise(promise, {
 })
 ```
 
+### Loading
+
+Renders a toast with a loading spinner. Useful when you want to handle various states yourself instead of using a promise toast.
+
+```jsx
+toast.loading('Loading data')
+```
+
 ### Custom JSX
 
 You can pass jsx as the first argument instead of a string to render custom jsx while maintaining default styling. You can use the headless version below for a custom, unstyled toast.

src/state.ts

@@ -143,7 +143,11 @@ class Observer {
     return id
   }
 
-  // We can't provide the toast we just created as a prop as we didn't creat it yet, so we can create a default toast object, I just don't know how to use function in argument when calling()?
+  loading = (message: string | JSX.Element, data?: ExternalToast) => {
+    return this.create({ ...data, type: 'loading', message })
+  }
+
+  // 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) => JSX.Element, data?: ExternalToast) => {
     const id = data?.id || toastsCounter++
     this.publish({ jsx: jsx(id), id, ...data })
@@ -177,4 +181,5 @@ export const toast = Object.assign(basicToast, {
   message: ToastState.message,
   promise: ToastState.promise,
   dismiss: ToastState.dismiss,
+  loading: ToastState.loading,
 })