vue-toastflow 0.0.3 → 0.0.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-toastflow",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "main": "src/index.ts",
   "module": "src/index.ts",
   "types": "src/index.ts",

package/src/components/Toast.vue

@@ -9,6 +9,7 @@ import type {
   ToastType,
 } from "toastflow-core";
 import { toastStoreKey } from "../symbols";
+import { getToastStore } from "../toast";
 import CheckCircle from "./icons/CheckCircle.vue";
 import XCircle from "./icons/XCircle.vue";
 import Bell from "./icons/Bell.vue";
@@ -40,10 +41,7 @@ const emit = defineEmits<{
 }>();
 
 const injectedStore = inject<ToastStore | null>(toastStoreKey, null);
-if (!injectedStore) {
-  throw new Error("[vue-toastflow] Plugin not installed");
-}
-const store: ToastStore = injectedStore;
+const store: ToastStore = injectedStore ?? getToastStore();
 
 const isHovered = ref(false);
 const isBumped = ref(false);

package/src/components/ToastContainer.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, onMounted, onUnmounted, ref, watch } from "vue";
+import { computed, inject, onMounted, onUnmounted, ref, watch } from "vue";
 import Toast from "./Toast.vue";
 import type {
   ToastAnimation,
@@ -9,6 +9,7 @@ import type {
   ToastPosition,
   ToastStore,
 } from "toastflow-core";
+import { toastStoreKey } from "../symbols";
 import { getToastStore } from "../toast";
 
 const positions: ToastPosition[] = [
@@ -20,7 +21,8 @@ const positions: ToastPosition[] = [
   "bottom-right",
 ];
 
-const store: ToastStore = getToastStore();
+const injectedStore = inject<ToastStore | null>(toastStoreKey, null);
+const store: ToastStore = injectedStore ?? getToastStore();
 
 const toasts = ref<ToastInstance[]>([]);
 

package/src/symbols.ts

@@ -1,4 +1,6 @@
-import type {InjectionKey} from "vue";
-import type {ToastStore} from "toastflow-core";
-
-export const toastStoreKey: InjectionKey<ToastStore> = Symbol("toast-store");
+import type { InjectionKey } from "vue";
+import type { ToastStore } from "toastflow-core";
+
+export const toastStoreKey: InjectionKey<ToastStore> = Symbol.for(
+  "vue-toastflow.toast-store",
+);

package/src/toast.ts

@@ -1,80 +1,91 @@
-import {
-  ToastConfig,
-  ToastContentInput,
-  ToastEvent,
-  ToastId,
-  ToastLoadingConfig,
-  ToastLoadingInput,
-  ToastLoadingResult,
-  ToastShowInput,
+import {
+  ToastConfig,
+  ToastContentInput,
+  ToastEvent,
+  ToastId,
+  ToastLoadingConfig,
+  ToastLoadingInput,
+  ToastLoadingResult,
+  ToastShowInput,
   ToastState,
   ToastStore,
   ToastUpdateInput,
 } from "toastflow-core";
 
+const GLOBAL_STORE_KEY = "__vue_toastflow_store__";
+type GlobalWithStore = typeof globalThis & { [GLOBAL_STORE_KEY]?: ToastStore };
+
 let globalStore: ToastStore | null = null;
 
 export function setToastStore(store: ToastStore) {
   globalStore = store;
+  try {
+    (globalThis as GlobalWithStore)[GLOBAL_STORE_KEY] = store;
+  } catch {
+    // ignore if globalThis is not writable
+  }
 }
 
 export function getToastStore(): ToastStore {
+  if (!globalStore) {
+    globalStore = (globalThis as GlobalWithStore)[GLOBAL_STORE_KEY] ?? null;
+  }
   if (!globalStore) {
     throw new Error(
       "[vue-toastflow] Toast store not initialized. Did you install the plugin?",
     );
   }
-  return globalStore;
-}
-
-export const toast = {
-  getState(): ToastState {
-    return getToastStore().getState();
-  },
-  subscribeEvents(listener: (event: ToastEvent) => void): () => void {
-    return getToastStore().subscribeEvents(listener);
-  },
-  show(options: ToastShowInput): ToastId {
-    return getToastStore().show(options);
-  },
-  loading<T>(
-    input: ToastLoadingInput<T>,
-    config: ToastLoadingConfig<T>,
-  ): ToastLoadingResult<T> {
-    return getToastStore().loading(input, config);
-  },
-  update(id: ToastId, options: ToastUpdateInput): void {
-    return getToastStore().update(id, options);
-  },
-  dismiss(id: ToastId): void {
-    return getToastStore().dismiss(id);
-  },
-  dismissAll(): void {
-    return getToastStore().dismissAll();
-  },
-  pause(id: ToastId): void {
-    return getToastStore().pause(id);
-  },
-  resume(id: ToastId): void {
-    return getToastStore().resume(id);
-  },
-  getConfig(): ToastConfig {
-    return getToastStore().getConfig();
-  },
-
-  toast(options: ToastContentInput): ToastId {
-    return getToastStore().show({ ...options, type: "default" });
-  },
-  success(options: ToastContentInput): ToastId {
-    return getToastStore().show({ ...options, type: "success" });
-  },
-  error(options: ToastContentInput): ToastId {
-    return getToastStore().show({ ...options, type: "error" });
-  },
-  info(options: ToastContentInput): ToastId {
-    return getToastStore().show({ ...options, type: "info" });
-  },
-  warning(options: ToastContentInput): ToastId {
-    return getToastStore().show({ ...options, type: "warning" });
-  },
-};
+  return globalStore;
+}
+
+export const toast = {
+  getState(): ToastState {
+    return getToastStore().getState();
+  },
+  subscribeEvents(listener: (event: ToastEvent) => void): () => void {
+    return getToastStore().subscribeEvents(listener);
+  },
+  show(options: ToastShowInput): ToastId {
+    return getToastStore().show(options);
+  },
+  loading<T>(
+    input: ToastLoadingInput<T>,
+    config: ToastLoadingConfig<T>,
+  ): ToastLoadingResult<T> {
+    return getToastStore().loading(input, config);
+  },
+  update(id: ToastId, options: ToastUpdateInput): void {
+    return getToastStore().update(id, options);
+  },
+  dismiss(id: ToastId): void {
+    return getToastStore().dismiss(id);
+  },
+  dismissAll(): void {
+    return getToastStore().dismissAll();
+  },
+  pause(id: ToastId): void {
+    return getToastStore().pause(id);
+  },
+  resume(id: ToastId): void {
+    return getToastStore().resume(id);
+  },
+  getConfig(): ToastConfig {
+    return getToastStore().getConfig();
+  },
+
+  toast(options: ToastContentInput): ToastId {
+    return getToastStore().show({ ...options, type: "default" });
+  },
+  success(options: ToastContentInput): ToastId {
+    return getToastStore().show({ ...options, type: "success" });
+  },
+  error(options: ToastContentInput): ToastId {
+    return getToastStore().show({ ...options, type: "error" });
+  },
+  info(options: ToastContentInput): ToastId {
+    return getToastStore().show({ ...options, type: "info" });
+  },
+  warning(options: ToastContentInput): ToastId {
+    return getToastStore().show({ ...options, type: "warning" });
+  },
+};