@steveyuowo/vue-hot-toast - npm Package Compare versions

Comparing version 1.0.9 to 1.1.0

dist/core/store.d.ts

@@ -1,6 +0,6 @@
-import { CreateToast } from './type';
+import { CreateToast, ToastType } from './type';
 export declare const globalState: {
     notifications: {
         id: string;
-        type: import("./type").ToastType;
+        type: ToastType;
         message: string;
@@ -7,0 +7,0 @@ autoClose: boolean;

dist/core/type.d.ts

 export type ToastType = "success" | "loading" | "error";
 export interface ToastProps {
-    /**
-     * toast id
-     */
-    id: string;
-    /**
-     * toast type
-     */
-    type: ToastType;
-    /**
-     * toast message
-     */
-    message: string;
-    /**
-     * auto close the toast
-     */
-    autoClose: boolean;
-    /**
-     * duration unit: millisecond
-     */
-    duration: number;
+  /**
+   * toast id
+   */
+  id: Id;
+  /**
+   * toast type
+   */
+  type: ToastType;
+  /**
+   * toast message
+   */
+  message: string;
+  /**
+   * auto close the toast
+   */
+  autoClose: boolean;
+  /**
+   * duration unit: millisecond
+   */
+  duration: number;
 }
+export type Id = string;
 export type ToastOptions = Partial<Omit<ToastProps, "id">>;
-export type CreateToast = {
-    (options: ToastOptions): void;
-};
+export type ToastSimpleOptions = Partial<Omit<ToastProps, "id" | "message">>;
+export interface CreateToast {
+  (options: ToastOptions): Id;
+  update: (id: Id, options: ToastOptions) => string;
+  _handleOptions: (type: ToastType, options: ToastOptions) => string;
+  success: (message: string, options?: ToastSimpleOptions) => string;
+  loading: (message: string, options?: ToastSimpleOptions) => string;
+  error: (message: string, options?: ToastSimpleOptions) => string;
+  promise: <T>(
+    promise: Promise<T>,
+    options: {
+      loading?: string,
+      success?: string,
+      error?: string,
+    }
+  ) => string;
+}
 export declare const defaultToastOptions: {
-    type: string;
-    message: string;
-    autoClose: boolean;
-    duration: number;
+  type: string;
+  message: string;
+  autoClose: boolean;
+  duration: number;
 };
-//# sourceMappingURL=type.d.ts.map
+//# sourceMappingURL=type.d.ts.map

dist/core/uuid.d.ts

@@ -1,2 +0,3 @@
-export declare function createUUID(): string;
+import { Id } from "./type";
+export declare function createUUID(): Id;
 //# sourceMappingURL=uuid.d.ts.map

dist/index.d.ts

@@ -1,4 +0,4 @@
-import Toast from "./components/Toast.vue";
+import Toaster from "./components/Toaster.vue";
 import { toast } from "./core/store";
-export { Toast, toast, };
+export { Toaster, toast, };
 //# sourceMappingURL=index.d.ts.map

dist/vue-hot-toast.es.js

@@ -1,13 +0,13 @@
-import { defineComponent as f, ref as u, onMounted as y, openBlock as n, createElementBlock as r, normalizeStyle as v, withModifiers as g, createElementVNode as c, createCommentVNode as d, toDisplayString as T, reactive as h, createBlock as p, Teleport as k, createVNode as C, TransitionGroup as V, withCtx as H, Fragment as w, renderList as B, unref as m } from "vue";
-const D = ["onClick"], M = { class: "VueHotToast__icon" }, S = {
+import { defineComponent as g, ref as d, onMounted as m, openBlock as a, createElementBlock as c, normalizeStyle as h, withModifiers as y, createElementVNode as u, createCommentVNode as l, toDisplayString as v, reactive as T, createBlock as x, Teleport as C, createVNode as O, TransitionGroup as k, withCtx as V, Fragment as H, renderList as b, unref as f } from "vue";
+const w = ["onClick"], j = { class: "VueHotToast__icon" }, I = {
   key: 0,
   class: "VueHotToast__checkmark"
-}, b = {
+}, B = {
   key: 1,
   class: "VueHotToast__error"
-}, I = {
+}, D = {
   key: 2,
   class: "VueHotToast__loading"
-}, N = { class: "content" }, $ = { class: "content-message" }, E = /* @__PURE__ */ f({
-  __name: "ToastItem",
+}, M = { class: "content" }, S = { class: "content-message" }, E = /* @__PURE__ */ g({
+  __name: "ToasterItem",
   props: {
@@ -21,26 +21,26 @@ id: {},
   emits: ["close"],
-  setup(t, { emit: o }) {
-    const s = t, a = u(null), e = u(0), _ = u(0);
-    y(() => {
-      s.autoClose && (e.value = Date.now(), _.value = s.duration, a.value = setTimeout(x, _.value));
+  setup(e, { emit: t }) {
+    const o = e, s = d(null), n = d(0), _ = d(0);
+    m(() => {
+      o.autoClose && (n.value = Date.now(), _.value = o.duration, s.value = setTimeout(p, _.value));
     });
-    const x = () => {
-      o("close");
+    const p = () => {
+      t("close");
     };
-    return (i, A) => (n(), r("div", {
+    return (r, A) => (a(), c("div", {
       class: "VueHotToast__toast",
-      style: v(`--toast-duration: ${i.duration}s;`),
-      onClick: g(x, ["prevent"])
+      style: h(`--toast-duration: ${r.duration}s;`),
+      onClick: y(p, ["prevent"])
     }, [
-      c("div", M, [
-        i.type === "success" ? (n(), r("div", S)) : d("", !0),
-        i.type === "error" ? (n(), r("div", b)) : d("", !0),
-        i.type === "loading" ? (n(), r("div", I)) : d("", !0)
+      u("div", j, [
+        r.type === "success" ? (a(), c("div", I)) : l("", !0),
+        r.type === "error" ? (a(), c("div", B)) : l("", !0),
+        r.type === "loading" ? (a(), c("div", D)) : l("", !0)
       ]),
-      c("div", N, [
-        c("div", $, T(i.message), 1)
+      u("div", M, [
+        u("div", S, v(r.message), 1)
       ])
-    ], 12, D));
+    ], 12, w));
   }
-}), O = {
+}), N = {
   type: "info",
@@ -51,32 +51,43 @@ message: "Here's your toast.",
 };
-function U() {
-  let t = (/* @__PURE__ */ new Date()).getTime();
-  var o = "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(
+function $() {
+  let e = (/* @__PURE__ */ new Date()).getTime();
+  var t = "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(
     /[xy]/g,
-    function(s) {
-      var a = (t + Math.random() * 16) % 16 | 0;
-      return t = Math.floor(t / 16), (s == "x" ? a : a & 3 | 8).toString(16);
+    function(o) {
+      var s = (e + Math.random() * 16) % 16 | 0;
+      return e = Math.floor(e / 16), (o == "x" ? s : s & 3 | 8).toString(16);
     }
   );
-  return o;
+  return t;
 }
-const l = h({
+const i = T({
   notifications: []
-}), G = (t) => {
-  const o = Object.assign({ ...O }, t);
-  l.notifications.push(
-    {
-      id: U(),
-      ...o
-    }
-  );
-}, j = (t) => {
-  const o = l.notifications.findIndex((s) => s.id === t);
-  o !== -1 && l.notifications.splice(o, 1);
-}, z = { class: "VueHotToast__toast-container" }, L = /* @__PURE__ */ f({
-  __name: "Toast",
-  setup(t) {
-    const o = l.notifications;
-    return (s, a) => (n(), p(k, { to: "body" }, [
-      C(V, {
+}), G = function() {
+  const e = (t) => {
+    const o = Object.assign({ ...N }, t), s = $();
+    return i.notifications.push(
+      {
+        id: s,
+        ...o
+      }
+    ), s;
+  };
+  return e.update = (t, o) => {
+    const s = i.notifications.findIndex((n) => n.id === t);
+    if (s === -1)
+      throw e(o), new Error("Can't find toast");
+    return Object.assign(i.notifications[s], o), t;
+  }, e._handleOptions = (t, o) => {
+    const s = Object.assign(o ?? {}, { type: t });
+    return e(s);
+  }, e.loading = (t, o) => e._handleOptions("loading", Object.assign(o ?? {}, { message: t })), e.success = (t, o) => e._handleOptions("success", Object.assign(o ?? {}, { message: t })), e.error = (t, o) => e._handleOptions("error", Object.assign(o ?? {}, { message: t })), e;
+}(), U = (e) => {
+  const t = i.notifications.findIndex((o) => o.id === e);
+  t !== -1 && i.notifications.splice(t, 1);
+}, z = { class: "VueHotToast__toast-container" }, L = /* @__PURE__ */ g({
+  __name: "Toaster",
+  setup(e) {
+    const t = i.notifications;
+    return (o, s) => (a(), x(C, { to: "body" }, [
+      O(k, {
         name: "VueHotToast__teleport-transition",
@@ -86,13 +97,13 @@ tag: "div",
       }, {
-        default: H(() => [
-          c("div", z, [
-            (n(!0), r(w, null, B(m(o), (e) => (n(), p(E, {
-              key: e.id,
-              id: e.id,
-              type: e.type,
-              message: e.message,
-              "auto-close": e.autoClose,
-              duration: e.duration,
+        default: V(() => [
+          u("div", z, [
+            (a(!0), c(H, null, b(f(t), (n) => (a(), x(E, {
+              key: n.id,
+              id: n.id,
+              type: n.type,
+              message: n.message,
+              "auto-close": n.autoClose,
+              duration: n.duration,
               onClose: () => {
-                m(j)(e.id);
+                f(U)(n.id);
               }
@@ -108,4 +119,4 @@ }, null, 8, ["id", "type", "message", "auto-close", "duration", "onClose"]))), 128))
 export {
-  L as Toast,
+  L as Toaster,
   G as toast
 };

dist/vue-hot-toast.umd.js

@@ -1,1 +0,1 @@
-(function(s,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(s=typeof globalThis<"u"?globalThis:s||self,t(s["vue-hot-toast"]={},s.Vue))})(this,function(s,t){"use strict";const p=["onClick"],_={class:"VueHotToast__icon"},f={key:0,class:"VueHotToast__checkmark"},m={key:1,class:"VueHotToast__error"},u={key:2,class:"VueHotToast__loading"},x={class:"content"},y={class:"content-message"},k=t.defineComponent({__name:"ToastItem",props:{id:{},type:{},message:{},autoClose:{type:Boolean},duration:{}},emits:["close"],setup(e,{emit:o}){const a=e,i=t.ref(null),n=t.ref(0),l=t.ref(0);t.onMounted(()=>{a.autoClose&&(n.value=Date.now(),l.value=a.duration,i.value=setTimeout(d,l.value))});const d=()=>{o("close")};return(c,E)=>(t.openBlock(),t.createElementBlock("div",{class:"VueHotToast__toast",style:t.normalizeStyle(`--toast-duration: ${c.duration}s;`),onClick:t.withModifiers(d,["prevent"])},[t.createElementVNode("div",_,[c.type==="success"?(t.openBlock(),t.createElementBlock("div",f)):t.createCommentVNode("",!0),c.type==="error"?(t.openBlock(),t.createElementBlock("div",m)):t.createCommentVNode("",!0),c.type==="loading"?(t.openBlock(),t.createElementBlock("div",u)):t.createCommentVNode("",!0)]),t.createElementVNode("div",x,[t.createElementVNode("div",y,t.toDisplayString(c.message),1)])],12,p))}}),h={type:"info",message:"Here's your toast.",autoClose:!0,duration:3e3};function T(){let e=new Date().getTime();var o="xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,function(a){var i=(e+Math.random()*16)%16|0;return e=Math.floor(e/16),(a=="x"?i:i&3|8).toString(16)});return o}const r=t.reactive({notifications:[]}),g=e=>{const o=Object.assign({...h},e);r.notifications.push({id:T(),...o})},V=e=>{const o=r.notifications.findIndex(a=>a.id===e);o!==-1&&r.notifications.splice(o,1)},B={class:"VueHotToast__toast-container"},C=t.defineComponent({__name:"Toast",setup(e){const o=r.notifications;return(a,i)=>(t.openBlock(),t.createBlock(t.Teleport,{to:"body"},[t.createVNode(t.TransitionGroup,{name:"VueHotToast__teleport-transition",tag:"div",class:"VueHotToast__teleport-transition"},{default:t.withCtx(()=>[t.createElementVNode("div",B,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(t.unref(o),n=>(t.openBlock(),t.createBlock(k,{key:n.id,id:n.id,type:n.type,message:n.message,"auto-close":n.autoClose,duration:n.duration,onClose:()=>{t.unref(V)(n.id)}},null,8,["id","type","message","auto-close","duration","onClose"]))),128))])]),_:1})]))}});s.Toast=C,s.toast=g,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});
+(function(i,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(i=typeof globalThis<"u"?globalThis:i||self,t(i["vue-hot-toast"]={},i.Vue))})(this,function(i,t){"use strict";const p=["onClick"],_={class:"VueHotToast__icon"},f={key:0,class:"VueHotToast__checkmark"},u={key:1,class:"VueHotToast__error"},m={key:2,class:"VueHotToast__loading"},x={class:"content"},g={class:"content-message"},h=t.defineComponent({__name:"ToasterItem",props:{id:{},type:{},message:{},autoClose:{type:Boolean},duration:{}},emits:["close"],setup(o,{emit:e}){const n=o,s=t.ref(null),a=t.ref(0),l=t.ref(0);t.onMounted(()=>{n.autoClose&&(a.value=Date.now(),l.value=n.duration,s.value=setTimeout(d,l.value))});const d=()=>{e("close")};return(c,O)=>(t.openBlock(),t.createElementBlock("div",{class:"VueHotToast__toast",style:t.normalizeStyle(`--toast-duration: ${c.duration}s;`),onClick:t.withModifiers(d,["prevent"])},[t.createElementVNode("div",_,[c.type==="success"?(t.openBlock(),t.createElementBlock("div",f)):t.createCommentVNode("",!0),c.type==="error"?(t.openBlock(),t.createElementBlock("div",u)):t.createCommentVNode("",!0),c.type==="loading"?(t.openBlock(),t.createElementBlock("div",m)):t.createCommentVNode("",!0)]),t.createElementVNode("div",x,[t.createElementVNode("div",g,t.toDisplayString(c.message),1)])],12,p))}}),y={type:"info",message:"Here's your toast.",autoClose:!0,duration:3e3};function k(){let o=new Date().getTime();var e="xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,function(n){var s=(o+Math.random()*16)%16|0;return o=Math.floor(o/16),(n=="x"?s:s&3|8).toString(16)});return e}const r=t.reactive({notifications:[]}),T=function(){const o=e=>{const n=Object.assign({...y},e),s=k();return r.notifications.push({id:s,...n}),s};return o.update=(e,n)=>{const s=r.notifications.findIndex(a=>a.id===e);if(s===-1)throw o(n),new Error("Can't find toast");return Object.assign(r.notifications[s],n),e},o._handleOptions=(e,n)=>{const s=Object.assign(n??{},{type:e});return o(s)},o.loading=(e,n)=>o._handleOptions("loading",Object.assign(n??{},{message:e})),o.success=(e,n)=>o._handleOptions("success",Object.assign(n??{},{message:e})),o.error=(e,n)=>o._handleOptions("error",Object.assign(n??{},{message:e})),o}(),V=o=>{const e=r.notifications.findIndex(n=>n.id===o);e!==-1&&r.notifications.splice(e,1)},B={class:"VueHotToast__toast-container"},C=t.defineComponent({__name:"Toaster",setup(o){const e=r.notifications;return(n,s)=>(t.openBlock(),t.createBlock(t.Teleport,{to:"body"},[t.createVNode(t.TransitionGroup,{name:"VueHotToast__teleport-transition",tag:"div",class:"VueHotToast__teleport-transition"},{default:t.withCtx(()=>[t.createElementVNode("div",B,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(t.unref(e),a=>(t.openBlock(),t.createBlock(h,{key:a.id,id:a.id,type:a.type,message:a.message,"auto-close":a.autoClose,duration:a.duration,onClose:()=>{t.unref(V)(a.id)}},null,8,["id","type","message","auto-close","duration","onClose"]))),128))])]),_:1})]))}});i.Toaster=C,i.toast=T,Object.defineProperty(i,Symbol.toStringTag,{value:"Module"})});

package.json

 {
   "name": "@steveyuowo/vue-hot-toast",
-  "version": "1.0.9",
+  "version": "1.1.0",
   "type": "module",
@@ -29,2 +29,3 @@ "files": [
   "dependencies": {
+    "VscodeProjects": "link:..",
     "vue": "^3.3.4"
@@ -31,0 +32,0 @@ },

README.md

@@ -5,7 +5,19 @@ <img src="./public/header.gif" />
   <img src="https://img.shields.io/npm/l/%40steveyuowo%2Fvue-hot-toast" />
-  <img src="https://img.shields.io/npm/v/%40steveyuowo%2Fvue-hot-toast
-" />
+  <img src="https://img.shields.io/npm/v/%40steveyuowo%2Fvue-hot-toast" />
   <img src="https://img.shields.io/github/last-commit/steveyuowo/vue-hot-toast/main"/>
 </div>
+<p style="font-weight: bold;" align="center">Vue Hot Toast - A neat toast for vue3</p>
 
+<p style="font-style: italic;" align="center">Cooked by <a href="https://github.com/SteveYuOWO">Steve Yu</a>👨🏼‍🍳</p>
+
+## Features
+
+- **Simplicity and Ease of Use**: Just  `loading` / `success` / `error` 
+
+- **Toast Updating Capability:** Vue Hot Toast allows you to update existing toast messages dynamically using a toast ID. 
+
+- **Promise Handling:** Display loading, success, and error toasts based on the resolution of your promises.
+
+  
+
 ## Installation
@@ -25,20 +37,19 @@
 
-## Getting Started
+## Documentation
 
-Add the Toast and call the toast function. 
+This documentation provides a clear and concise overview of how to use the Vue Hot Toast library to display toast notifications in a Vue application. By following the examples provided, developers can quickly implement toast notifications in their projects and customize them to fit their requirements.
 
+##### 1. Simple Usage
+
+To get started with Vue Hot Toast, import the `Toaster` and `toast` objects from `@steveyuowo/vue-hot-toast` and include the necessary CSS file for styling the toasts.
+
 ```vue
 <script setup lang="ts">
-import { Toast, toast } from "@steveyuowo/vue-hot-toast";
+import { Toaster, toast } from "@steveyuowo/vue-hot-toast";
 import "@steveyuowo/vue-hot-toast/vue-hot-toast.css";
 </script>
-
 <template>
   <button
     @click="
-      toast({
-        type: 'success',
-        duration: 9000,
-        autoClose: false
-      })
+      toast.success('Execution Success!');
     "
@@ -48,5 +59,74 @@ >
   </button>
-  <Toast />
+  <button
+    @click="
+      toast.loading('Loading...');
+    "
+  >
+    Loading
+  </button>
+  <button
+    @click="
+      toast.error('Execution Error!');
+    "
+  >
+    Error
+  </button>
+  <Toaster />
 </template>
 ```
 
+##### 2. Passing Options
+
+You can pass options to the `toast` function to customize the appearance and behavior of the toast message.
+
+```ts
+toast({
+  message: 'Execution Success!',
+  type: 'success',
+});
+```
+
+##### 3. Updating Toasts
+
+You can pass options to the `toast` function to customize the appearance and behavior of the toast message.
+
+```ts
+const id = toast.loading("Loading...")
+setTimeout(() => {
+  toast.update(id, {
+    type: "success",
+    message: "Execution Success!"
+  })
+}, 1000)
+```
+
+##### 4. Promise API
+
+Vue Hot Toast provides a `promise` method to handle promise states and show corresponding toast messages for loading, success, and error states.
+
+```ts
+toast.promise(yourPromise, {
+  success: 'Success!',
+  error: 'Error!',
+  loading: 'Loading!',
+});
+
+// random loading => success/error by promise api
+toast.promise(new Promise((resolve, reject) => {
+  setTimeout(() => {
+    const random =Math.floor( Math.random() * 100);
+    if(random > 90) {
+      reject(new Error('An error occurred after 1 seconds'));
+    } else {
+      resolve("success")
+    }
+  }, 1000);
+}), {
+  success: 'Success!',
+  error: 'Error!',
+  loading: 'Loading!',
+})
+```
+
+With the `promise` method, you can easily handle promise states and provide user feedback on the progress of async operations in a declarative manner.
+

src/core/store.ts

 import { reactive } from 'vue';
-import { CreateToast, ToastOptions, ToastProps, defaultToastOptions } from './type';
+import { CreateToast, ToastOptions, ToastProps, defaultToastOptions, Id, ToastSimpleOptions, ToastType } from './type';
 import { createUUID } from './uuid';
@@ -11,16 +11,70 @@
 
+export const toast: CreateToast = (function () {
+  const fn = ((options: ToastOptions) => {
+    const _options = Object.assign({ ...defaultToastOptions }, options);
+    const id = createUUID();
+    globalState.notifications.push(
+      ...[
+        {
+          id,
+          ..._options,
+        },
+      ]
+    );
+    return id;
+  }) as CreateToast;
 
-export const toast: CreateToast = (options: ToastOptions) => {
-  const _options = Object.assign({ ...defaultToastOptions }, options);
+  fn.update = (id: Id, options: ToastOptions) => {
+    const notificationIndex = globalState.notifications.findIndex(notification => notification.id === id);
+    if (notificationIndex === -1) {
+      fn(options); // fallback to create new notification
+      throw new Error("Can't find toast")
+    }
+    Object.assign(globalState.notifications[notificationIndex], options);
+    return id
+  };
 
-  globalState.notifications.push(
-    ...[
-      {
-        id: createUUID(),
-        ..._options,
-      },
-    ]
-  );
-};
+  fn._handleOptions = (type: ToastType, options: ToastOptions) => {
+    const newOptions = Object.assign(options ?? {} as ToastOptions, { type });
+    return fn(newOptions);
+  }
 
+  fn.loading = (message: string, options?: ToastSimpleOptions) => {
+    return fn._handleOptions('loading', Object.assign(options ?? {}, { message }) as ToastOptions);
+  };
+
+  fn.success = (message: string, options?: ToastSimpleOptions) => {
+    return fn._handleOptions('success', Object.assign(options ?? {}, { message }) as ToastOptions);
+  };
+
+  fn.error = (message: string, options?: ToastSimpleOptions) => {
+    return fn._handleOptions('error', Object.assign(options ?? {}, { message }) as ToastOptions);
+  };
+
+  fn.promise = <T>(
+    promise: Promise<T>,
+    options: {
+      loading: string,
+      success: string,
+      error: string,
+    }
+  ) => {
+    const id = fn.loading(options.loading);
+    return promise.then(_ => {
+      fn.update(id, {
+        message: options.success,
+        type: 'success'
+      })
+      return id;
+    }).catch(e => {
+      fn.update(id, {
+        message: options.error,
+        type: 'error'
+      })
+      throw e;
+    });
+  }
+  return fn;
+})();
+
 export const removeToast = (id: string) => {
@@ -27,0 +81,0 @@ const index = globalState.notifications.findIndex((item) => item.id === id);

src/core/type.ts

@@ -6,3 +6,3 @@ export type ToastType = "success" | "loading" | "error"
    */
-  id: string;
+  id: Id;
   /**
@@ -26,6 +26,21 @@ * toast type
 
+export type Id = string;
 export type ToastOptions = Partial<Omit<ToastProps, "id">>;
+export type ToastSimpleOptions = Partial<Omit<ToastProps, "id" | "message">>;
 
-export type CreateToast = {
-  (options: ToastOptions): void;
+export interface CreateToast {
+  (options: ToastOptions): Id;
+  update: (id: Id, options: ToastOptions) => string;
+  _handleOptions: (type: ToastType, options: ToastOptions) => string;
+  success: (message: string, options?: ToastSimpleOptions) => string;
+  loading: (message: string, options?: ToastSimpleOptions) => string;
+  error: (message: string, options?: ToastSimpleOptions) => string;
+  promise: <T>(
+    promise: Promise<T>,
+    options: {
+      loading: string,
+      success: string,
+      error: string,
+    }
+  ) => Promise<string>;
 };
@@ -32,0 +47,0 @@

src/core/uuid.ts

@@ -1,2 +0,4 @@
-export function createUUID(): string {
+import { Id } from "./type";
+
+export function createUUID(): Id {
   let dt = new Date().getTime();
@@ -3,0 +5,0 @@ var uuid = "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(

src/index.ts

@@ -1,7 +0,7 @@
-import Toast from "./components/Toast.vue";
+import Toaster from "./components/Toaster.vue";
 import { toast } from "./core/store";
 
 export {
-  Toast,
+  Toaster,
   toast,
 }

No alert changes

Improved metrics

Total package byte prevSize

31464

increased by26.63%

Lines of code

495

increased by24.06%

Number of lines in readme file

130

increased by160%

Worsened metrics

Dependency count

2

increased by100%

Dependency changes

• + AddedVscodeProjects@link:..