@ailuracode/alpine-toast 0.1.1 → 1.0.0

package/dist/index.js

@@ -1,156 +1,394 @@
+// src/controller.ts
+import {
+  BaseController,
+  clearSingleton,
+  createSingleton,
+  generateId
+} from "@ailuracode/alpine-core";
+
 // src/types.ts
 var TOAST_STORE_KEY = "toast";
 
-// src/config.ts
-var DEFAULT_PLUGIN_OPTIONS = {
-  defaultPosition: "bottom-right",
-  defaultDuration: 4e3,
-  maxToasts: 5,
-  listenToWindowEvents: true
-};
-function variantFromList(variants, preferred) {
-  if (variants.includes(preferred)) {
-    return preferred;
-  }
-  return "default";
-}
-function resolvePromiseConfig(variants, promise = {}) {
-  return {
-    loading: promise.loading ?? "Loading...",
-    error: promise.error ?? "Error",
-    duration: promise.duration ?? 4e3,
-    loadingVariant: promise.loadingVariant ?? variantFromList(variants, "loading"),
-    successVariant: promise.successVariant ?? variantFromList(variants, "success"),
-    errorVariant: promise.errorVariant ?? variantFromList(variants, "error")
-  };
+// src/controller.ts
+var DISMISS_DELAY_MS = 400;
+var DEFAULT_MAX_TOASTS = 5;
+var DEFAULT_DURATION_MS = 4e3;
+var TOAST_SINGLETON_KEY = "@ailuracode/alpine-toast/default";
+function createToastController(options = {}) {
+  return createSingleton(TOAST_SINGLETON_KEY, () => {
+    const controller = new ToastController(options);
+    controller.mount();
+    return controller;
+  });
 }
-function resolveToastPluginConfig(options = {}) {
-  const variants = options.variants ?? [];
-  const positions = options.positions ?? [];
-  const maxToasts = options.maxToasts ?? DEFAULT_PLUGIN_OPTIONS.maxToasts;
-  let maxVisible = options.maxVisible ?? maxToasts;
-  if (maxToasts > 0 && maxVisible > maxToasts) {
-    maxVisible = maxToasts;
+var ToastController = class extends BaseController {
+  #defaultPosition;
+  #stackPositions;
+  #defaultDuration;
+  #maxToasts;
+  #maxVisible;
+  #storeKey;
+  #listenToWindowEvents;
+  #getStore;
+  #dismissTimers = /* @__PURE__ */ new Map();
+  #purgeTimers = /* @__PURE__ */ new Map();
+  #items = [];
+  constructor(options) {
+    super(options.id ?? generateId("toast"));
+    this.#defaultPosition = options.defaultPosition ?? "bottom-right";
+    this.#stackPositions = resolveStackPositions(this.#defaultPosition, options.positions);
+    this.#defaultDuration = options.defaultDuration ?? DEFAULT_DURATION_MS;
+    const limits = resolveToastLimits({
+      maxToasts: options.maxToasts,
+      maxVisible: options.maxVisible
+    });
+    this.#maxToasts = limits.maxToasts;
+    this.#maxVisible = limits.maxVisible;
+    this.#storeKey = options.storeKey ?? TOAST_STORE_KEY;
+    this.#listenToWindowEvents = options.listenToWindowEvents !== false;
+    this.#getStore = options.getStore;
   }
-  return {
-    defaultPosition: options.defaultPosition ?? DEFAULT_PLUGIN_OPTIONS.defaultPosition,
-    defaultDuration: options.defaultDuration ?? DEFAULT_PLUGIN_OPTIONS.defaultDuration,
-    maxToasts,
-    maxVisible,
-    listenToWindowEvents: options.listenToWindowEvents ?? DEFAULT_PLUGIN_OPTIONS.listenToWindowEvents,
-    storeKey: options.storeKey ?? TOAST_STORE_KEY,
-    variants,
-    positions,
-    promise: resolvePromiseConfig(variants, options.promise)
-  };
-}
-function toastOptions(options) {
-  return options;
-}
-function toastVariants(variants) {
-  return variants;
-}
-function toastPositions(positions) {
-  return positions;
-}
-
-// src/store.ts
-function resolveToastLimits(options = {}) {
-  const maxToasts = options.maxToasts ?? 5;
-  let maxVisible = options.maxVisible ?? maxToasts;
-  if (maxToasts > 0 && maxVisible > maxToasts) {
-    maxVisible = maxToasts;
+  /**
+   * Tears down every side effect. Idempotent. `super.destroy()` runs
+   * the registered cleanups (currently just the window listener)
+   * first; the timer cleanup runs as a final step. Also releases
+   * the singleton slot so the next `createToastController()` call
+   * builds a fresh controller.
+   */
+  destroy() {
+    if (this.isDestroyed) {
+      return;
+    }
+    super.destroy();
+    this.#clearAllTimers();
+    clearSingleton(TOAST_SINGLETON_KEY);
   }
-  return { maxToasts, maxVisible };
-}
-function resolveStackPositions(defaultPosition, positions) {
-  const stacks = [defaultPosition];
-  for (const position of positions ?? []) {
-    if (!stacks.includes(position)) {
-      stacks.push(position);
+  /**
+   * Starts the controller's side effects. The constructor leaves
+   * `#items` empty; `mount()` registers the `toast` window event
+   * listener (when enabled) and emits the initialization event.
+   *
+   * Calling `mount()` more than once is a no-op — `BaseController`
+   * guards the phase. Calling it after `destroy()` throws.
+   */
+  mount() {
+    if (this.isMounted) {
+      return;
     }
+    super.mount();
+    if (this.#listenToWindowEvents && typeof window !== "undefined") {
+      const abort = new AbortController();
+      const handler = (event) => {
+        if (event instanceof CustomEvent) {
+          this.fromPayload(event.detail ?? {});
+        }
+      };
+      window.addEventListener("toast", handler, { signal: abort.signal });
+      this.registerCleanup(() => abort.abort());
+    }
+    queueMicrotask(() => {
+      if (this.isDestroyed) {
+        return;
+      }
+      this.#emitChange("initialization");
+    });
   }
-  return stacks;
-}
-function createToastId() {
-  if (typeof crypto !== "undefined" && typeof crypto.randomUUID === "function") {
-    return crypto.randomUUID();
+  // ── Public state surface ────────────────────────────────────────
+  get defaultPosition() {
+    return this.#defaultPosition;
   }
-  return `toast-${Date.now()}-${Math.random().toString(36).slice(2)}`;
-}
-function normalizeToastDuration(duration) {
-  if (duration === 0) {
-    return false;
+  get stackPositions() {
+    return this.#stackPositions;
   }
-  return duration;
-}
-function resolveToastDuration(duration, defaultDuration) {
-  if (duration === void 0) {
-    return normalizeToastDuration(defaultDuration);
+  get maxToasts() {
+    return this.#maxToasts;
   }
-  return normalizeToastDuration(duration);
-}
-function shouldAutoDismiss(duration) {
-  return typeof duration === "number" && duration > 0 && Number.isFinite(duration);
-}
-function isPersistentDuration(duration) {
-  return !shouldAutoDismiss(duration);
-}
-var PROMISE_LOADING_DURATION = 36e5;
-function itemsAtPosition(items, position) {
-  return items.filter((item) => item.position === position);
-}
-function timedStackAt(items, position) {
-  return itemsAtPosition(items, position).filter((item) => shouldAutoDismiss(item.duration));
-}
-function persistentStackAt(items, position) {
-  return itemsAtPosition(items, position).filter((item) => isPersistentDuration(item.duration));
-}
-function enforcePositionLimit(items, position, maxToasts, dismissMany, stack) {
-  if (maxToasts <= 0) {
-    return;
-  }
-  const stackAtPosition = stack === "persistent" ? persistentStackAt(items, position) : timedStackAt(items, position);
-  const activeAtPosition = stackAtPosition.filter((item) => !item.removed);
-  const overflowIds = activeAtPosition.slice(maxToasts).map((item) => item.id);
-  dismissMany(overflowIds);
-}
-function applyToastPatch(item, payload) {
-  const next = { ...item };
-  for (const [key, value] of Object.entries(payload)) {
-    if (value !== void 0) {
-      if (key === "duration") {
-        Object.assign(next, { duration: normalizeToastDuration(value) });
-      } else {
-        Object.assign(next, { [key]: value });
+  get maxVisible() {
+    return this.#maxVisible;
+  }
+  get items() {
+    return this.#items;
+  }
+  // ── Public commands ─────────────────────────────────────────────
+  push(payload = {}) {
+    if (this.isDestroyed) {
+      return "";
+    }
+    const position = payload.position ?? this.#defaultPosition;
+    const id = generateId("toast");
+    const toast = {
+      id,
+      key: payload.key ?? null,
+      content: payload.content ?? null,
+      title: payload.title ?? null,
+      description: payload.description ?? null,
+      variant: payload.variant ?? "default",
+      position,
+      duration: resolveToastDuration(payload.duration, this.#defaultDuration),
+      action: payload.action ?? null,
+      removed: false
+    };
+    this.#items = [toast, ...this.#items];
+    this.#enforcePositionLimit(
+      position,
+      shouldAutoDismiss(toast.duration) ? "timed" : "persistent"
+    );
+    this.#scheduleDismiss(id, toast.duration);
+    this.#emitChange("push");
+    return id;
+  }
+  pushUnique(key, payload = {}) {
+    if (this.isDestroyed) {
+      return "";
+    }
+    const activeIds = this.#items.filter((item) => !item.removed && item.key === key).map((item) => item.id);
+    this.#markRemoved(activeIds);
+    return this.push({ ...payload, key });
+  }
+  update(id, payload = {}) {
+    if (this.isDestroyed) {
+      return;
+    }
+    const current = this.#items.find((toast) => toast.id === id);
+    if (!current) {
+      return;
+    }
+    const previousPosition = current.position;
+    const wasPersistent = isPersistentDuration(current.duration);
+    this.#items = this.#items.map(
+      (item) => item.id === id ? applyToastPatch(item, payload) : item
+    );
+    const updated = this.#items.find((toast) => toast.id === id);
+    if (!updated) {
+      return;
+    }
+    const nextPosition = updated.position;
+    const isNowPersistent = isPersistentDuration(updated.duration);
+    const durationStackChanged = payload.duration !== void 0 && wasPersistent !== isNowPersistent;
+    const positionChanged = nextPosition !== previousPosition;
+    if (positionChanged) {
+      this.#enforcePositionLimit(previousPosition, "timed");
+      this.#enforcePositionLimit(previousPosition, "persistent");
+    }
+    if (positionChanged || durationStackChanged) {
+      this.#enforcePositionLimit(nextPosition, "timed");
+      this.#enforcePositionLimit(nextPosition, "persistent");
+    }
+    if (payload.duration !== void 0) {
+      this.#scheduleDismiss(id, updated.duration);
+    }
+    this.#emitChange("update");
+  }
+  dismiss(id) {
+    if (this.isDestroyed) {
+      return;
+    }
+    this.#markRemoved([id]);
+    this.#emitChange("dismiss");
+  }
+  dismissAt(position) {
+    if (this.isDestroyed) {
+      return;
+    }
+    const ids = this.itemsAt(position).filter((item) => !item.removed).map((item) => item.id);
+    this.#markRemoved(ids);
+    this.#emitChange("dismissAt");
+  }
+  dismissAll() {
+    if (this.isDestroyed) {
+      return;
+    }
+    const ids = this.#items.filter((item) => !item.removed).map((item) => item.id);
+    this.#markRemoved(ids);
+    this.#emitChange("dismissAll");
+  }
+  // ── Query helpers ───────────────────────────────────────────────
+  itemsAt(position) {
+    return this.#items.filter((item) => item.position === position);
+  }
+  timedItemsAt(position) {
+    return this.itemsAt(position).filter((item) => shouldAutoDismiss(item.duration));
+  }
+  persistentItemsAt(position) {
+    return this.itemsAt(position).filter((item) => isPersistentDuration(item.duration));
+  }
+  activeTimedItemsAt(position) {
+    return this.timedItemsAt(position).filter((item) => !item.removed);
+  }
+  activePersistentItemsAt(position) {
+    return this.persistentItemsAt(position).filter((item) => !item.removed);
+  }
+  isVisibleAt(position, index) {
+    const stack = this.timedItemsAt(position);
+    const item = stack[index];
+    if (!item || item.removed) {
+      return false;
+    }
+    if (this.#maxVisible <= 0) {
+      return true;
+    }
+    let rank = 0;
+    for (let i = 0; i <= index; i++) {
+      if (stack[i] && !stack[i].removed) {
+        rank++;
       }
     }
+    return rank <= this.#maxVisible;
   }
-  return next;
-}
-function createToastStore(options = {}) {
-  const defaultPosition = options.defaultPosition ?? "bottom-right";
-  const stackPositions = resolveStackPositions(defaultPosition, options.positions);
-  const defaultDuration = options.defaultDuration ?? 4e3;
-  const { maxToasts, maxVisible } = resolveToastLimits(options);
-  const dismissDelayMs = 400;
-  const dismissTimers = /* @__PURE__ */ new Map();
-  const purgeTimers = /* @__PURE__ */ new Map();
-  const getStore = options.getStore;
+  /**
+   * Public escape hatch for callers (mainly the magic's `fromPayload`)
+   * that need to push a toast from a raw `ToastEventPayload` shape.
+   */
+  fromPayload(payload = {}) {
+    const { title = null, content = null, variant = "default", ...options } = payload;
+    return this.push({
+      title,
+      content,
+      variant,
+      ...options
+    });
+  }
+  // ── Internals ───────────────────────────────────────────────────
+  #emitChange(source) {
+    if (this.isDestroyed) {
+      return;
+    }
+    const detail = {
+      source,
+      items: this.#items
+    };
+    this.emit("change", detail);
+  }
+  /**
+   * Marks the given ids as `removed`. Schedules a purge timer so
+   * they drop out of the queue after `DISMISS_DELAY_MS`. Does NOT
+   * emit — the caller (push / update / dismiss / dismissAt /
+   * dismissAll / pushUnique) emits once after the mutation
+   * completes to avoid event storms on bulk dismisses.
+   */
+  #markRemoved(ids) {
+    if (ids.length === 0) {
+      return;
+    }
+    const idsToRemove = [];
+    for (const id of ids) {
+      const toast = this.#items.find((item) => item.id === id);
+      if (!toast || toast.removed) {
+        continue;
+      }
+      this.#clearDismissTimer(id);
+      idsToRemove.push(id);
+    }
+    if (idsToRemove.length === 0) {
+      return;
+    }
+    const removeSet = new Set(idsToRemove);
+    this.#items = this.#items.map(
+      (item) => removeSet.has(item.id) ? { ...item, removed: true } : item
+    );
+    const batchId = generateId("toast-purge");
+    const timer = setTimeout(() => {
+      this.#purgeTimers.delete(batchId);
+      if (this.isDestroyed) {
+        return;
+      }
+      this.#items = this.#items.filter((item) => !removeSet.has(item.id));
+      this.#emitChange("dismiss");
+    }, DISMISS_DELAY_MS);
+    this.#purgeTimers.set(batchId, timer);
+  }
+  /**
+   * Trims the active timed or persistent stack at `position` so it
+   * doesn't exceed `maxToasts`. Overflow items are marked as
+   * `removed` (with the standard delay before purge) — no exception
+   * is thrown.
+   */
+  #enforcePositionLimit(position, stack) {
+    if (this.#maxToasts <= 0) {
+      return;
+    }
+    const itemsAtPosition = this.itemsAt(position);
+    const stackItems = stack === "persistent" ? itemsAtPosition.filter((item) => isPersistentDuration(item.duration)) : itemsAtPosition.filter((item) => shouldAutoDismiss(item.duration));
+    const activeAtPosition = stackItems.filter((item) => !item.removed);
+    const overflowIds = activeAtPosition.slice(this.#maxToasts).map((item) => item.id);
+    this.#markRemoved(overflowIds);
+  }
+  #scheduleDismiss(id, duration) {
+    this.#clearDismissTimer(id);
+    if (duration === PROMISE_LOADING_DURATION) {
+      return;
+    }
+    if (shouldAutoDismiss(duration)) {
+      const timer = setTimeout(() => {
+        this.#dismissTimers.delete(id);
+        if (this.isDestroyed) {
+          return;
+        }
+        const target = this.#getStore?.() ?? null;
+        if (target) {
+          target.dismiss(id);
+        } else {
+          this.dismiss(id);
+        }
+      }, duration);
+      this.#dismissTimers.set(id, timer);
+    }
+  }
+  #clearDismissTimer(id) {
+    const timer = this.#dismissTimers.get(id);
+    if (timer !== void 0) {
+      clearTimeout(timer);
+      this.#dismissTimers.delete(id);
+    }
+  }
+  #clearAllTimers() {
+    for (const timer of this.#dismissTimers.values()) {
+      clearTimeout(timer);
+    }
+    this.#dismissTimers.clear();
+    for (const timer of this.#purgeTimers.values()) {
+      clearTimeout(timer);
+    }
+    this.#purgeTimers.clear();
+  }
+};
+function wrapToastStore(controller) {
   const store = {
-    defaultPosition,
-    stackPositions,
-    maxToasts,
-    maxVisible,
-    items: [],
+    defaultPosition: controller.defaultPosition,
+    stackPositions: controller.stackPositions,
+    maxToasts: controller.maxToasts,
+    maxVisible: controller.maxVisible,
+    items: [...controller.items],
+    push(payload) {
+      return controller.push(payload);
+    },
+    pushUnique(key, payload) {
+      return controller.pushUnique(key, payload ?? {});
+    },
+    update(id, payload) {
+      controller.update(id, payload);
+    },
+    dismiss(id) {
+      controller.dismiss(id);
+    },
+    dismissAt(position) {
+      controller.dismissAt(position);
+    },
+    dismissAll() {
+      controller.dismissAll();
+    },
+    destroy() {
+      unsubscribe();
+      controller.destroy();
+    },
     itemsAt(position) {
-      return itemsAtPosition(this.items, position);
+      return this.items.filter((item) => item.position === position);
     },
     timedItemsAt(position) {
-      return timedStackAt(this.items, position);
+      return this.itemsAt(position).filter((item) => shouldAutoDismiss(item.duration));
     },
     persistentItemsAt(position) {
-      return persistentStackAt(this.items, position);
+      return this.itemsAt(position).filter((item) => isPersistentDuration(item.duration));
     },
     activeTimedItemsAt(position) {
       return this.timedItemsAt(position).filter((item) => !item.removed);
@@ -174,167 +412,90 @@ function createToastStore(options = {}) {
         }
       }
       return rank <= this.maxVisible;
-    },
-    push(payload = {}) {
-      const position = payload.position ?? this.defaultPosition;
-      const id = createToastId();
-      const toast = {
-        id,
-        key: payload.key ?? null,
-        content: payload.content ?? null,
-        title: payload.title ?? null,
-        description: payload.description ?? null,
-        variant: payload.variant ?? "default",
-        position,
-        duration: resolveToastDuration(payload.duration, defaultDuration),
-        action: payload.action ?? null,
-        removed: false
-      };
-      this.items = [toast, ...this.items];
-      enforcePositionLimit(
-        this.items,
-        position,
-        this.maxToasts,
-        (ids) => markRemoved(ids),
-        shouldAutoDismiss(toast.duration) ? "timed" : "persistent"
-      );
-      scheduleDismiss(id, toast.duration);
-      return id;
-    },
-    pushUnique(key, payload = {}) {
-      const activeIds = this.items.filter((item) => !item.removed && item.key === key).map((item) => item.id);
-      markRemoved(activeIds);
-      return this.push({ ...payload, key });
-    },
-    update(id, payload = {}) {
-      const current = this.items.find((toast) => toast.id === id);
-      if (!current) {
-        return;
-      }
-      const previousPosition = current.position;
-      const wasPersistent = isPersistentDuration(current.duration);
-      this.items = this.items.map(
-        (item) => item.id === id ? applyToastPatch(item, payload) : item
-      );
-      const updated = this.items.find((toast) => toast.id === id);
-      if (!updated) {
-        return;
-      }
-      const nextPosition = updated.position;
-      const isNowPersistent = isPersistentDuration(updated.duration);
-      const durationStackChanged = payload.duration !== void 0 && wasPersistent !== isNowPersistent;
-      const positionChanged = nextPosition !== previousPosition;
-      if (positionChanged) {
-        enforcePositionLimit(
-          this.items,
-          previousPosition,
-          this.maxToasts,
-          (ids) => markRemoved(ids),
-          "timed"
-        );
-        enforcePositionLimit(
-          this.items,
-          previousPosition,
-          this.maxToasts,
-          (ids) => markRemoved(ids),
-          "persistent"
-        );
-      }
-      if (positionChanged || durationStackChanged) {
-        enforcePositionLimit(
-          this.items,
-          nextPosition,
-          this.maxToasts,
-          (ids) => markRemoved(ids),
-          "timed"
-        );
-        enforcePositionLimit(
-          this.items,
-          nextPosition,
-          this.maxToasts,
-          (ids) => markRemoved(ids),
-          "persistent"
-        );
-      }
-      if (payload.duration !== void 0) {
-        scheduleDismiss(id, updated.duration);
-      }
-    },
-    dismiss(id) {
-      markRemoved([id]);
-    },
-    dismissAt(position) {
-      const ids = this.itemsAt(position).filter((item) => !item.removed).map((item) => item.id);
-      markRemoved(ids);
-    },
-    dismissAll() {
-      const ids = this.items.filter((item) => !item.removed).map((item) => item.id);
-      markRemoved(ids);
-    },
-    destroy() {
-      for (const timer of dismissTimers.values()) {
-        clearTimeout(timer);
-      }
-      dismissTimers.clear();
-      for (const timer of purgeTimers.values()) {
-        clearTimeout(timer);
-      }
-      purgeTimers.clear();
     }
   };
-  function clearDismissTimer(id) {
-    const timer = dismissTimers.get(id);
-    if (timer !== void 0) {
-      clearTimeout(timer);
-      dismissTimers.delete(id);
-    }
+  const unsubscribe = controller.on("change", (detail) => {
+    store.items = [...detail.items];
+  });
+  return store;
+}
+function createToastStore(options = {}) {
+  const controller = new ToastController(options);
+  controller.mount();
+  return wrapToastStore(controller);
+}
+var PROMISE_LOADING_DURATION = 36e5;
+function normalizeToastDuration(duration) {
+  if (duration === 0) {
+    return false;
   }
-  function markRemoved(ids) {
-    if (ids.length === 0) {
-      return;
-    }
-    const activeStore = getStore?.() ?? store;
-    const idsToRemove = [];
-    for (const id of ids) {
-      const toast = activeStore.items.find((item) => item.id === id);
-      if (!toast || toast.removed) {
-        continue;
-      }
-      clearDismissTimer(id);
-      idsToRemove.push(id);
-    }
-    if (idsToRemove.length === 0) {
-      return;
-    }
-    const removeSet = new Set(idsToRemove);
-    activeStore.items = activeStore.items.map(
-      (item) => removeSet.has(item.id) ? { ...item, removed: true } : item
-    );
-    const batchId = createToastId();
-    const timer = setTimeout(() => {
-      purgeTimers.delete(batchId);
-      const storeForFilter = getStore?.() ?? store;
-      storeForFilter.items = storeForFilter.items.filter((item) => !removeSet.has(item.id));
-    }, dismissDelayMs);
-    purgeTimers.set(batchId, timer);
-  }
-  function scheduleDismiss(id, duration) {
-    clearDismissTimer(id);
-    if (duration === PROMISE_LOADING_DURATION) {
-      return;
-    }
-    if (shouldAutoDismiss(duration)) {
-      const timer = setTimeout(() => {
-        dismissTimers.delete(id);
-        (getStore?.() ?? store).dismiss(id);
-      }, duration);
-      dismissTimers.set(id, timer);
+  return duration;
+}
+function resolveToastDuration(duration, defaultDuration) {
+  if (duration === void 0) {
+    return normalizeToastDuration(defaultDuration);
+  }
+  return normalizeToastDuration(duration);
+}
+function shouldAutoDismiss(duration) {
+  return typeof duration === "number" && duration > 0 && Number.isFinite(duration);
+}
+function isPersistentDuration(duration) {
+  return !shouldAutoDismiss(duration);
+}
+function resolveToastLimits(options = {}) {
+  const maxToasts = options.maxToasts ?? DEFAULT_MAX_TOASTS;
+  let maxVisible = options.maxVisible ?? maxToasts;
+  if (maxToasts > 0 && maxVisible > maxToasts) {
+    maxVisible = maxToasts;
+  }
+  return { maxToasts, maxVisible };
+}
+function resolveStackPositions(defaultPosition, positions) {
+  const stacks = [defaultPosition];
+  for (const position of positions ?? []) {
+    if (!stacks.includes(position)) {
+      stacks.push(position);
     }
   }
-  return store;
+  return stacks;
+}
+function applyToastPatch(item, payload) {
+  let next = { ...item };
+  if (payload.content !== void 0) {
+    next = { ...next, content: payload.content };
+  }
+  if (payload.title !== void 0) {
+    next = { ...next, title: payload.title };
+  }
+  if (payload.description !== void 0) {
+    next = { ...next, description: payload.description };
+  }
+  if (payload.variant !== void 0) {
+    next = { ...next, variant: payload.variant };
+  }
+  if (payload.position !== void 0) {
+    next = { ...next, position: payload.position };
+  }
+  if (payload.duration !== void 0) {
+    next = { ...next, duration: normalizeToastDuration(payload.duration) };
+  }
+  if (payload.action !== void 0) {
+    next = { ...next, action: payload.action };
+  }
+  if (payload.key !== void 0) {
+    next = { ...next, key: payload.key };
+  }
+  return next;
 }
 
-// src/magic.ts
+// src/plugin.ts
+var DEFAULT_PLUGIN_OPTIONS = {
+  defaultPosition: "bottom-right",
+  defaultDuration: 4e3,
+  maxToasts: 5,
+  listenToWindowEvents: true
+};
 var RESERVED_TOAST_MAGIC_KEYS = /* @__PURE__ */ new Set([
   "dismiss",
   "update",
@@ -344,67 +505,79 @@ var RESERVED_TOAST_MAGIC_KEYS = /* @__PURE__ */ new Set([
   "fromPayload",
   "promise"
 ]);
-function pushToast(store, titleOrPayload, options = {}) {
-  if (typeof titleOrPayload === "string") {
-    return store.push({
-      title: titleOrPayload,
-      ...options
-    });
-  }
-  return store.push(titleOrPayload);
-}
-function pushVariantToast(store, variant, titleOrPayload, options = {}) {
-  if (typeof titleOrPayload === "string") {
-    return store.push({
-      title: titleOrPayload,
-      ...options,
-      variant
-    });
+function variantFromList(variants, preferred) {
+  if (variants.includes(preferred)) {
+    return preferred;
   }
-  return store.push({
-    ...titleOrPayload,
-    ...options,
-    variant
-  });
+  return "default";
 }
-function resolveSuccessTitle(data, messages) {
-  if (typeof messages.success === "function") {
-    return messages.success(data);
-  }
-  return messages.success;
+function resolvePromiseConfig(variants, promise = {}) {
+  return {
+    loading: promise.loading ?? "Loading...",
+    error: promise.error ?? "Error",
+    duration: promise.duration ?? 4e3,
+    loadingVariant: promise.loadingVariant ?? variantFromList(variants, "loading"),
+    successVariant: promise.successVariant ?? variantFromList(variants, "success"),
+    errorVariant: promise.errorVariant ?? variantFromList(variants, "error")
+  };
 }
-function resolveSuccessContent(data, messages) {
-  const { successContent } = messages;
-  if (typeof successContent === "function") {
-    return successContent(data);
+function resolveToastPluginConfig(options = {}) {
+  const variants = options.variants ?? [];
+  const positions = options.positions ?? [];
+  const maxToasts = options.maxToasts ?? DEFAULT_PLUGIN_OPTIONS.maxToasts;
+  let maxVisible = options.maxVisible ?? maxToasts;
+  if (maxToasts > 0 && maxVisible > maxToasts) {
+    maxVisible = maxToasts;
   }
-  return successContent;
+  return {
+    defaultPosition: options.defaultPosition ?? DEFAULT_PLUGIN_OPTIONS.defaultPosition,
+    defaultDuration: options.defaultDuration ?? DEFAULT_PLUGIN_OPTIONS.defaultDuration,
+    maxToasts,
+    maxVisible,
+    listenToWindowEvents: options.listenToWindowEvents ?? DEFAULT_PLUGIN_OPTIONS.listenToWindowEvents,
+    storeKey: options.storeKey ?? TOAST_STORE_KEY,
+    variants,
+    positions,
+    promise: resolvePromiseConfig(variants, options.promise)
+  };
 }
-function resolveErrorTitle(messages, fallbackError) {
-  return messages.error ?? fallbackError;
+function toastOptions(options) {
+  return options;
 }
-function resolveToastPromise(factoryOrPromise) {
-  if (typeof factoryOrPromise === "function") {
-    return Promise.resolve(factoryOrPromise());
-  }
-  return Promise.resolve(factoryOrPromise);
+function toastVariants(variants) {
+  return variants;
 }
-function buildPromiseSuccessPatch(data, messages, successVariant, settledDuration) {
-  const successTitle = resolveSuccessTitle(data, messages);
-  const successContent = resolveSuccessContent(data, messages);
-  return {
-    ...successTitle !== void 0 ? { title: successTitle } : {},
-    ...successContent !== void 0 ? { content: successContent } : {},
-    variant: successVariant,
-    duration: settledDuration
-  };
+function toastPositions(positions) {
+  return positions;
 }
-function buildPromiseErrorPatch(messages, promiseConfig, errorVariant, settledDuration) {
-  return {
-    title: resolveErrorTitle(messages, promiseConfig.error),
-    ...messages.errorContent !== void 0 ? { content: messages.errorContent } : {},
-    variant: errorVariant,
-    duration: settledDuration
+function toastPlugin(options = {}) {
+  return function registerToast(alpine) {
+    const Alpine = alpine;
+    const controllerOptions = {
+      defaultPosition: options.defaultPosition,
+      positions: options.positions,
+      defaultDuration: options.defaultDuration,
+      maxToasts: options.maxToasts,
+      maxVisible: options.maxVisible,
+      listenToWindowEvents: options.listenToWindowEvents,
+      storeKey: options.storeKey
+    };
+    const controller = createToastController(controllerOptions);
+    const config = resolveToastPluginConfig(options);
+    const store = wrapToastStore(controller);
+    Alpine.store(config.storeKey, store);
+    const reactiveStore = Alpine.store(config.storeKey);
+    controller.on("change", (detail) => {
+      reactiveStore.items = [...detail.items];
+    });
+    const toast = createToastMagic(
+      config,
+      () => reactiveStore
+    );
+    Alpine.magic("toast", () => toast);
+    if (typeof Alpine.cleanup === "function") {
+      Alpine.cleanup(() => controller.destroy());
+    }
   };
 }
 function createToastMagic(config, getStore) {
@@ -460,69 +633,75 @@ function createToastMagic(config, getStore) {
   }
   return magic;
 }
-
-// src/index.ts
-function registerAlpineToastStore(Alpine, storeKey, store) {
-  const registerStore = Alpine.store;
-  registerStore(storeKey, store);
-}
-function getToastStore(Alpine, storeKey) {
-  return Alpine.store(storeKey);
+function pushToast(store, titleOrPayload, options = {}) {
+  if (typeof titleOrPayload === "string") {
+    return store.push({
+      title: titleOrPayload,
+      ...options
+    });
+  }
+  return store.push(titleOrPayload);
 }
-function registerToastPlugin(Alpine, options = {}) {
-  const config = resolveToastPluginConfig(options);
-  let reactiveStore;
-  let windowEventsAbort;
-  const store = createToastStore({
-    defaultPosition: config.defaultPosition,
-    positions: config.positions,
-    defaultDuration: config.defaultDuration,
-    maxToasts: config.maxToasts,
-    maxVisible: config.maxVisible,
-    getStore: () => reactiveStore ?? store
+function pushVariantToast(store, variant, titleOrPayload, options = {}) {
+  if (typeof titleOrPayload === "string") {
+    return store.push({
+      title: titleOrPayload,
+      ...options,
+      variant
+    });
+  }
+  return store.push({
+    ...titleOrPayload,
+    ...options,
+    variant
   });
-  const baseDestroy = store.destroy.bind(store);
-  store.destroy = () => {
-    windowEventsAbort?.abort();
-    windowEventsAbort = void 0;
-    baseDestroy();
-  };
-  registerAlpineToastStore(Alpine, config.storeKey, store);
-  reactiveStore = getToastStore(Alpine, config.storeKey);
-  const toast = createToastMagic(
-    config,
-    () => getToastStore(Alpine, config.storeKey)
-  );
-  Alpine.magic("toast", () => toast);
-  if (config.listenToWindowEvents && typeof window !== "undefined") {
-    windowEventsAbort = new AbortController();
-    window.addEventListener(
-      "toast",
-      (event) => {
-        if (event instanceof CustomEvent) {
-          toast.fromPayload(
-            event.detail ?? {}
-          );
-        }
-      },
-      { signal: windowEventsAbort.signal }
-    );
+}
+function resolveSuccessTitle(data, messages) {
+  if (typeof messages.success === "function") {
+    return messages.success(data);
   }
+  return messages.success;
 }
-function toastPlugin(optionsOrAlpine) {
-  if (optionsOrAlpine && typeof optionsOrAlpine.magic === "function") {
-    registerToastPlugin(optionsOrAlpine, {});
-    return;
-  }
-  const options = optionsOrAlpine ?? {};
-  return (Alpine) => {
-    registerToastPlugin(Alpine, options);
+function resolveSuccessContent(data, messages) {
+  const { successContent } = messages;
+  if (typeof successContent === "function") {
+    return successContent(data);
+  }
+  return successContent;
+}
+function resolveErrorTitle(messages, fallbackError) {
+  return messages.error ?? fallbackError;
+}
+function resolveToastPromise(factoryOrPromise) {
+  if (typeof factoryOrPromise === "function") {
+    return Promise.resolve(factoryOrPromise());
+  }
+  return Promise.resolve(factoryOrPromise);
+}
+function buildPromiseSuccessPatch(data, messages, successVariant, settledDuration) {
+  const successTitle = resolveSuccessTitle(data, messages);
+  const successContent = resolveSuccessContent(data, messages);
+  return {
+    ...successTitle !== void 0 ? { title: successTitle } : {},
+    ...successContent !== void 0 ? { content: successContent } : {},
+    variant: successVariant,
+    duration: settledDuration
+  };
+}
+function buildPromiseErrorPatch(messages, promiseConfig, errorVariant, settledDuration) {
+  return {
+    title: resolveErrorTitle(messages, promiseConfig.error),
+    ...messages.errorContent !== void 0 ? { content: messages.errorContent } : {},
+    variant: errorVariant,
+    duration: settledDuration
   };
 }
 export {
   PROMISE_LOADING_DURATION,
   RESERVED_TOAST_MAGIC_KEYS,
   TOAST_STORE_KEY,
+  ToastController,
+  createToastController,
   createToastMagic,
   createToastStore,
   toastPlugin as default,
@@ -534,7 +713,8 @@ export {
   resolveToastPluginConfig,
   shouldAutoDismiss,
   toastOptions,
+  toastPlugin,
   toastPositions,
-  toastVariants
+  toastVariants,
+  wrapToastStore
 };
-//# sourceMappingURL=index.js.map