toast-23 1.0.2 → 2.0.0

package/dist/index.mjs

@@ -1,43 +1,48 @@
-import { jsx as s, jsxs as h } from "react/jsx-runtime";
-import * as T from "react";
-import { createContext as P, useState as y, useEffect as E, useRef as R, useCallback as w, useContext as N, useReducer as D, useMemo as C } from "react";
-import { createRoot as _ } from "react-dom/client";
-const I = P(null);
-function B(e, o) {
-  switch (o.type) {
+import { jsx as i, jsxs as d, Fragment as st } from "react/jsx-runtime";
+import * as Z from "react";
+import { createContext as Tt, useState as P, useEffect as Y, useRef as Q, useCallback as w, useContext as nt, useReducer as Ct, useMemo as ot, useSyncExternalStore as ft } from "react";
+import { createPortal as St } from "react-dom";
+import { createRoot as At } from "react-dom/client";
+const tt = Tt(null);
+function Et(t, n) {
+  switch (n.type) {
     case "ADD":
-      return [...e, o.toast];
+      return [...t, n.toast];
     case "UPSERT":
-      return e.some((i) => i.id === o.toast.id) ? e.map(
-        (i) => i.id === o.toast.id ? {
-          ...i,
-          ...o.toast,
-          version: i.version + 1,
+      return t.some((a) => a.id === n.toast.id) ? t.map(
+        (a) => a.id === n.toast.id ? {
+          ...a,
+          ...n.toast,
+          version: a.version + 1,
           isExiting: !1
-        } : i
-      ) : [...e, o.toast];
+        } : a
+      ) : [...t, n.toast];
     case "UPDATE":
-      return e.map(
-        (t) => t.id === o.id ? {
-          ...t,
-          ...o.updates,
-          // Bump version so progress bar restarts
-          version: t.version + 1,
-          // If the toast was exiting, cancel exit on update
+      return t.map(
+        (o) => o.id === n.id ? {
+          ...o,
+          ...n.updates,
+          version: o.version + 1,
           isExiting: !1
-        } : t
+        } : o
       );
     case "DISMISS":
-      return o.id ? e.map(
-        (t) => t.id === o.id ? { ...t, isExiting: !0 } : t
-      ) : e.map((t) => ({ ...t, isExiting: !0 }));
+      return n.id ? t.map(
+        (o) => o.id === n.id && !o.isExiting ? { ...o, isExiting: !0 } : o
+      ) : t.map((o) => o.isExiting ? o : { ...o, isExiting: !0 });
     case "REMOVE":
-      return o.id ? e.filter((t) => t.id !== o.id) : [];
+      return n.id ? t.filter((o) => o.id !== n.id) : [];
+    case "DISMISS_GROUP":
+      return t.map(
+        (o) => o.group === n.group && !o.isExiting ? { ...o, isExiting: !0 } : o
+      );
+    case "REMOVE_GROUP":
+      return t.filter((o) => o.group !== n.group);
     default:
-      return e;
+      return t;
   }
 }
-const $ = (e) => /* @__PURE__ */ h(
+const Rt = (t) => /* @__PURE__ */ d(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -45,10 +50,10 @@ const $ = (e) => /* @__PURE__ */ h(
     width: "1.25em",
     height: "1.25em",
     fill: "none",
-    ...e,
+    ...t,
     children: [
-      /* @__PURE__ */ s("circle", { cx: 12, cy: 12, r: 10, fill: "currentColor" }),
-      /* @__PURE__ */ s(
+      /* @__PURE__ */ i("circle", { cx: 12, cy: 12, r: 10, fill: "currentColor" }),
+      /* @__PURE__ */ i(
         "path",
         {
           d: "M8 12.5l2.5 2.5 5-5",
@@ -61,7 +66,7 @@ const $ = (e) => /* @__PURE__ */ h(
       )
     ]
   }
-), q = (e) => /* @__PURE__ */ h(
+), It = (t) => /* @__PURE__ */ d(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -69,10 +74,10 @@ const $ = (e) => /* @__PURE__ */ h(
     width: "1.25em",
     height: "1.25em",
     fill: "none",
-    ...e,
+    ...t,
     children: [
-      /* @__PURE__ */ s("circle", { cx: 12, cy: 12, r: 10, fill: "currentColor" }),
-      /* @__PURE__ */ s(
+      /* @__PURE__ */ i("circle", { cx: 12, cy: 12, r: 10, fill: "currentColor" }),
+      /* @__PURE__ */ i(
         "line",
         {
           x1: 12,
@@ -84,10 +89,10 @@ const $ = (e) => /* @__PURE__ */ h(
           strokeLinecap: "round"
         }
       ),
-      /* @__PURE__ */ s("circle", { cx: 12, cy: 16, r: 1, fill: "#fff" })
+      /* @__PURE__ */ i("circle", { cx: 12, cy: 16, r: 1, fill: "#fff" })
     ]
   }
-), W = (e) => /* @__PURE__ */ h(
+), Mt = (t) => /* @__PURE__ */ d(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -95,16 +100,16 @@ const $ = (e) => /* @__PURE__ */ h(
     width: "1.25em",
     height: "1.25em",
     fill: "none",
-    ...e,
+    ...t,
     children: [
-      /* @__PURE__ */ s(
+      /* @__PURE__ */ i(
         "path",
         {
           d: "M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z",
           fill: "currentColor"
         }
       ),
-      /* @__PURE__ */ s(
+      /* @__PURE__ */ i(
         "line",
         {
           x1: 12,
@@ -116,10 +121,10 @@ const $ = (e) => /* @__PURE__ */ h(
           strokeLinecap: "round"
         }
       ),
-      /* @__PURE__ */ s("circle", { cx: 12, cy: 17, r: 1, fill: "#fff" })
+      /* @__PURE__ */ i("circle", { cx: 12, cy: 17, r: 1, fill: "#fff" })
     ]
   }
-), b = (e) => /* @__PURE__ */ h(
+), ct = (t) => /* @__PURE__ */ d(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -127,10 +132,10 @@ const $ = (e) => /* @__PURE__ */ h(
     width: "1.25em",
     height: "1.25em",
     fill: "none",
-    ...e,
+    ...t,
     children: [
-      /* @__PURE__ */ s("circle", { cx: 12, cy: 12, r: 10, fill: "currentColor" }),
-      /* @__PURE__ */ s(
+      /* @__PURE__ */ i("circle", { cx: 12, cy: 12, r: 10, fill: "currentColor" }),
+      /* @__PURE__ */ i(
         "line",
         {
           x1: 12,
@@ -142,10 +147,10 @@ const $ = (e) => /* @__PURE__ */ h(
           strokeLinecap: "round"
         }
       ),
-      /* @__PURE__ */ s("circle", { cx: 12, cy: 8, r: 1, fill: "#fff" })
+      /* @__PURE__ */ i("circle", { cx: 12, cy: 8, r: 1, fill: "#fff" })
     ]
   }
-), j = (e) => /* @__PURE__ */ h(
+), Bt = (t) => /* @__PURE__ */ d(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -157,13 +162,13 @@ const $ = (e) => /* @__PURE__ */ h(
     strokeLinejoin: "round",
     width: "0.875em",
     height: "0.875em",
-    ...e,
+    ...t,
     children: [
-      /* @__PURE__ */ s("line", { x1: 18, y1: 6, x2: 6, y2: 18 }),
-      /* @__PURE__ */ s("line", { x1: 6, y1: 6, x2: 18, y2: 18 })
+      /* @__PURE__ */ i("line", { x1: 18, y1: 6, x2: 6, y2: 18 }),
+      /* @__PURE__ */ i("line", { x1: 6, y1: 6, x2: 18, y2: 18 })
     ]
   }
-), U = (e) => /* @__PURE__ */ s(
+), Nt = (t) => /* @__PURE__ */ i(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -176,126 +181,239 @@ const $ = (e) => /* @__PURE__ */ h(
     width: "1.25em",
     height: "1.25em",
     className: "toast23-spinner",
-    ...e,
-    children: /* @__PURE__ */ s("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" })
+    ...t,
+    children: /* @__PURE__ */ i("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" })
   }
 );
-let X = 0;
-function z() {
-  return `t23-${++X}-${Math.random().toString(36).slice(2, 9)}`;
+let Pt = 0;
+function rt() {
+  return `t23-${++Pt}-${Math.random().toString(36).slice(2, 9)}`;
+}
+function W(...t) {
+  return t.filter(Boolean).join(" ");
 }
-function x(...e) {
-  return e.filter(Boolean).join(" ");
+function Dt(t) {
+  return t.endsWith("right") ? 1 : t.endsWith("left") ? -1 : 0;
 }
-const F = {
-  success: $,
-  error: q,
-  warning: W,
-  info: b,
-  default: b,
-  loading: U
-}, H = 300, L = T.memo(
-  ({ toast: e, onDismiss: o, onRemove: t }) => {
-    const [i, u] = y(!1);
-    E(() => {
-      const v = requestAnimationFrame(() => u(!0));
-      return () => cancelAnimationFrame(v);
-    }, []), E(() => {
-      if (!e.isExiting) return;
-      const v = e.removeDelay ?? H, S = setTimeout(() => t(e.id), v);
-      return () => clearTimeout(S);
-    }, [e.isExiting, e.id, e.removeDelay, t]);
-    const [l, g] = y(!1), d = R(e.duration), [a, m] = y(100), [f, n] = y("none");
-    E(() => {
-      d.current = e.duration, m(100), n("none");
-    }, [e.version, e.duration]), E(() => {
-      if (e.duration <= 0 || e.variant === "loading" || !i || e.isExiting)
+const Lt = {
+  success: Rt,
+  error: It,
+  warning: Mt,
+  info: ct,
+  default: ct,
+  loading: Nt
+}, $t = 200, it = 180, pt = Z.memo(
+  ({
+    toast: t,
+    onDismiss: n,
+    onRemove: o,
+    globallyPaused: a,
+    swipeEnabled: p,
+    swipeThreshold: m,
+    stackIndex: E,
+    stackMode: f,
+    stackExpanded: y,
+    stackIsBottom: B,
+    dir: G
+  }) => {
+    const [k, R] = P(!1);
+    Y(() => {
+      const x = requestAnimationFrame(() => R(!0));
+      return () => cancelAnimationFrame(x);
+    }, []), Y(() => {
+      if (!t.isExiting) return;
+      const x = setTimeout(() => o(t.id), t.removeDelay);
+      return () => clearTimeout(x);
+    }, [t.isExiting, t.id, t.removeDelay, o]);
+    const [b, T] = P(!1), C = b || a, [M, N] = P(1), [v, h] = P("none");
+    Y(() => {
+      N(1), h("none");
+    }, [t.version, t.duration]);
+    const S = typeof t.progress == "number";
+    Y(() => {
+      S && (h("transform 120ms linear"), N(t.progress ?? 0));
+    }, [t.progress, S]), Y(() => {
+      if (S || t.duration <= 0 || t.variant === "loading" || !k || t.isExiting)
         return;
-      if (l) {
-        n("width 200ms ease-out"), m(100);
+      if (C) {
+        h(`transform ${$t}ms ease-out`), N(1);
         return;
       }
-      m(100), requestAnimationFrame(() => {
-        n(`width ${e.duration}ms linear`), m(0);
-      });
-      const v = setTimeout(() => {
-        o(e.id);
-      }, e.duration);
-      return () => clearTimeout(v);
+      h("none"), N(1);
+      const x = requestAnimationFrame(() => {
+        h(`transform ${t.duration}ms linear`), N(0);
+      }), $ = setTimeout(() => n(t.id), t.duration);
+      return () => {
+        cancelAnimationFrame(x), clearTimeout($);
+      };
     }, [
-      l,
-      e.duration,
-      e.variant,
-      e.isExiting,
-      e.id,
-      i,
-      o
+      C,
+      k,
+      t.isExiting,
+      t.duration,
+      t.variant,
+      t.id,
+      t.version,
+      S,
+      n
     ]);
-    const r = w(() => g(!0), []), c = w(() => g(!1), []), p = F[e.variant] ?? b;
-    return e.isCustom ? /* @__PURE__ */ s(
-      "div",
-      {
-        className: x(
-          "toast23-item toast23-item--custom",
-          !i && "toast23-item--entering",
-          e.isExiting && "toast23-item--exiting"
-        ),
-        role: "alert",
-        "aria-live": "polite",
-        "aria-atomic": "true",
-        onMouseEnter: r,
-        onMouseLeave: c,
-        children: e.message
-      }
-    ) : /* @__PURE__ */ h(
+    const u = Q({
+      startX: 0,
+      startY: 0,
+      dx: 0,
+      isDragging: !1,
+      pointerId: -1
+    }), [s, c] = P(0), [A, I] = P(""), _ = Dt(t.position), j = w(
+      (x) => {
+        !p || x.button !== void 0 && x.button !== 0 || x.target.closest("button") || (u.current.startX = x.clientX, u.current.startY = x.clientY, u.current.dx = 0, u.current.isDragging = !0, u.current.pointerId = x.pointerId, I(""));
+      },
+      [p]
+    ), z = w(
+      (x) => {
+        if (!u.current.isDragging || x.pointerId !== u.current.pointerId) return;
+        const $ = x.clientX - u.current.startX, V = x.clientY - u.current.startY;
+        if (Math.abs(V) > Math.abs($) && Math.abs(V) > 10) return;
+        const lt = _ === 0 ? $ : _ === 1 ? Math.max(0, $) : Math.min(0, $);
+        u.current.dx = lt, c(lt);
+      },
+      [_]
+    ), q = w(
+      (x) => {
+        if (!u.current.isDragging || x.pointerId !== u.current.pointerId) return;
+        u.current.isDragging = !1;
+        const $ = u.current.dx;
+        Math.abs($) >= m ? (I(
+          `transform ${it}ms ease-out, opacity ${it}ms ease-out`
+        ), c($ > 0 ? window.innerWidth : -window.innerWidth), setTimeout(() => n(t.id), it)) : (I("transform 180ms ease-out"), c(0));
+      },
+      [m, n, t.id]
+    ), F = 10, r = 0.06, O = Math.min(E, 3), K = (() => {
+      if (!f || y) return "";
+      const $ = (B ? 1 : -1) * O * F, V = 1 - O * r;
+      return `translateY(${$}px) scale(${V})`;
+    })(), H = f && !y && O > 0 ? Math.max(0.4, 1 - O * 0.25) : void 0, U = s !== 0 ? `translateX(${s}px)` : K, l = s !== 0 ? Math.max(0, 1 - Math.abs(s) / (m * 2)) : void 0, e = w(() => T(!0), []), g = w(() => T(!1), []), D = Lt[t.variant] ?? ct, L = w(
+      () => n(t.id),
+      [n, t.id]
+    ), xt = w(() => {
+      if (!t.action) return;
+      const x = t.action.dismissOnClick !== !1;
+      t.action.onClick(L), x && L();
+    }, [t.action, L]), wt = w(() => {
+      if (!t.cancelAction) return;
+      const x = t.cancelAction.dismissOnClick !== !1;
+      t.cancelAction.onClick(L), x && L();
+    }, [t.cancelAction, L]);
+    if (t.isCustom)
+      return /* @__PURE__ */ i(
+        "div",
+        {
+          className: W(
+            "toast23-item toast23-item--custom",
+            !k && "toast23-item--entering",
+            t.isExiting && "toast23-item--exiting"
+          ),
+          role: "status",
+          "aria-live": "polite",
+          "aria-atomic": "true",
+          style: {
+            transform: U || void 0,
+            opacity: l ?? H,
+            transition: A || void 0,
+            pointerEvents: f && !y && O > 0 ? "none" : void 0
+          },
+          onMouseEnter: e,
+          onMouseLeave: g,
+          onPointerDown: j,
+          onPointerMove: z,
+          onPointerUp: q,
+          onPointerCancel: q,
+          children: t.message
+        }
+      );
+    const kt = !!(t.action && t.cancelAction);
+    return /* @__PURE__ */ d(
       "div",
       {
-        className: x(
+        className: W(
           "toast23-item",
-          `toast23-item--${e.variant}`,
-          !i && "toast23-item--entering",
-          e.isExiting && "toast23-item--exiting"
+          `toast23-item--${t.variant}`,
+          !k && "toast23-item--entering",
+          t.isExiting && "toast23-item--exiting",
+          f && "toast23-item--stack",
+          kt && "toast23-item--confirm"
         ),
-        role: "alert",
-        "aria-live": e.variant === "error" ? "assertive" : "polite",
+        role: t.variant === "error" ? "alert" : "status",
+        "aria-live": t.variant === "error" ? "assertive" : "polite",
         "aria-atomic": "true",
-        onMouseEnter: r,
-        onMouseLeave: c,
+        style: {
+          transform: U || void 0,
+          opacity: l ?? H,
+          transition: A || void 0
+        },
+        onMouseEnter: e,
+        onMouseLeave: g,
+        onPointerDown: j,
+        onPointerMove: z,
+        onPointerUp: q,
+        onPointerCancel: q,
         children: [
-          /* @__PURE__ */ s("span", { className: x("toast23-icon", `toast23-icon--${e.variant}`), children: /* @__PURE__ */ s(p, {}) }),
-          /* @__PURE__ */ h("div", { className: "toast23-content", children: [
-            e.title && /* @__PURE__ */ s("div", { className: "toast23-title", children: e.title }),
-            /* @__PURE__ */ s(
+          /* @__PURE__ */ i("span", { className: W("toast23-icon", `toast23-icon--${t.variant}`), children: /* @__PURE__ */ i(D, {}) }),
+          /* @__PURE__ */ d("div", { className: "toast23-content", children: [
+            t.title && /* @__PURE__ */ i("div", { className: "toast23-title", children: t.title }),
+            /* @__PURE__ */ i(
               "div",
               {
-                className: x(
+                className: W(
                   "toast23-message",
-                  e.title && "toast23-message--with-title"
+                  t.title && "toast23-message--with-title"
                 ),
-                children: e.message
+                children: t.message
+              }
+            )
+          ] }),
+          (t.action || t.cancelAction) && /* @__PURE__ */ d("div", { className: "toast23-actions", children: [
+            t.cancelAction && /* @__PURE__ */ i(
+              "button",
+              {
+                type: "button",
+                className: W(
+                  "toast23-action toast23-action--cancel",
+                  t.cancelAction.className
+                ),
+                onClick: wt,
+                children: t.cancelAction.label
+              }
+            ),
+            t.action && /* @__PURE__ */ i(
+              "button",
+              {
+                type: "button",
+                className: W("toast23-action", t.action.className),
+                onClick: xt,
+                children: t.action.label
               }
             )
           ] }),
-          e.dismissible && /* @__PURE__ */ s(
+          t.dismissible && /* @__PURE__ */ i(
             "button",
             {
               type: "button",
               className: "toast23-dismiss",
-              onClick: () => o(e.id),
+              onClick: () => n(t.id),
               "aria-label": "Dismiss notification",
-              children: /* @__PURE__ */ s(j, {})
+              children: /* @__PURE__ */ i(Bt, {})
             }
           ),
-          e.duration > 0 && e.variant !== "loading" && /* @__PURE__ */ s(
+          (t.duration > 0 || S) && t.variant !== "loading" && /* @__PURE__ */ i(
             "div",
             {
-              className: x(
+              className: W(
                 "toast23-progress",
-                `toast23-progress--${e.variant}`
+                `toast23-progress--${t.variant}`
               ),
               style: {
-                width: `${a}%`,
-                transition: f
+                transform: `scaleX(${M})`,
+                transition: v
               }
             }
           )
@@ -304,33 +422,55 @@ const F = {
     );
   }
 );
-L.displayName = "ToastItem";
-const M = T.memo(
-  ({ position: e, toasts: o, maxVisible: t }) => {
-    const i = N(I);
-    if (!i) return null;
-    const u = o.filter((a) => !a.isExiting), l = o.filter((a) => a.isExiting), g = [...u.slice(0, t), ...l];
-    if (g.length === 0) return null;
-    const d = Math.max(0, u.length - t);
-    return /* @__PURE__ */ h(
+pt.displayName = "ToastItem";
+const mt = Z.memo(
+  ({ position: t, toasts: n, maxVisible: o, layout: a, dir: p, theme: m, inline: E }) => {
+    const f = nt(tt), [y, B] = P(!1), G = w(() => B(!0), []), k = w(() => B(!1), []);
+    if (!f) return null;
+    const R = n.filter((v) => !v.isExiting), b = n.filter((v) => v.isExiting), T = [...R.slice(0, o), ...b], C = Math.max(0, R.length - o);
+    if (T.length === 0) return null;
+    const M = a === "stack", N = t.startsWith("bottom");
+    return /* @__PURE__ */ d(
       "div",
       {
-        className: x("toast23-container", `toast23-container--${e}`),
+        className: W(
+          "toast23-container",
+          `toast23-container--${t}`,
+          M && "toast23-container--stack",
+          M && y && "toast23-container--expanded",
+          E && "toast23-container--inline",
+          p === "rtl" && "toast23-container--rtl",
+          m === "dark" && "toast23-container--dark",
+          m === "light" && "toast23-container--light"
+        ),
+        dir: p,
         "aria-label": "Notifications",
         role: "region",
+        tabIndex: -1,
+        "data-toast23-region": "true",
+        onMouseEnter: M ? G : void 0,
+        onMouseLeave: M ? k : void 0,
         children: [
-          g.map((a) => /* @__PURE__ */ s(
-            L,
+          T.map((v, h) => /* @__PURE__ */ i(
+            pt,
             {
-              toast: a,
-              onDismiss: i.dismissToast,
-              onRemove: i.removeToast
+              toast: v,
+              stackIndex: M ? h : 0,
+              stackMode: M,
+              stackExpanded: y,
+              stackIsBottom: N,
+              dir: p,
+              onDismiss: f.dismissToast,
+              onRemove: f.removeToast,
+              globallyPaused: f.isPausedGlobally,
+              swipeEnabled: f.config.swipeEnabled,
+              swipeThreshold: f.config.swipeThreshold
             },
-            a.id
+            v.id
           )),
-          d > 0 && /* @__PURE__ */ h("div", { className: "toast23-queue-badge", "aria-live": "polite", children: [
+          C > 0 && /* @__PURE__ */ d("div", { className: "toast23-queue-badge", "aria-live": "polite", children: [
             "+",
-            d,
+            C,
             " more"
           ] })
         ]
@@ -338,71 +478,291 @@ const M = T.memo(
     );
   }
 );
-M.displayName = "ToastContainer";
-const V = [
+mt.displayName = "ToastContainer";
+const Gt = ':root{--toast23-z: 9999;--toast23-min-width: 320px;--toast23-max-width: 26rem;--toast23-radius: .75rem;--toast23-gap: .75rem;--toast23-padding: .875rem 1rem;--toast23-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;--toast23-shadow: 0 4px 6px -1px rgba(0, 0, 0, .08), 0 2px 4px -2px rgba(0, 0, 0, .05);--toast23-shadow-hover: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .06);--toast23-bg-default: rgba(249, 250, 251, .95);--toast23-bg-success: rgba(240, 253, 244, .95);--toast23-bg-error: rgba(254, 242, 242, .95);--toast23-bg-warning: rgba(254, 252, 232, .95);--toast23-bg-info: rgba(239, 246, 255, .95);--toast23-border-default: #e5e7eb;--toast23-border-success: #bbf7d0;--toast23-border-error: #fecaca;--toast23-border-warning: #fef08a;--toast23-border-info: #bfdbfe;--toast23-color-success: #22c55e;--toast23-color-error: #ef4444;--toast23-color-warning: #eab308;--toast23-color-info: #3b82f6;--toast23-color-default: #6b7280;--toast23-color-loading: #3b82f6;--toast23-text-title: #111827;--toast23-text-body: #1f2937;--toast23-text-muted: #6b7280;--toast23-action-bg: rgba(0, 0, 0, .06);--toast23-action-bg-hover: rgba(0, 0, 0, .1);--toast23-action-text: #111827;--toast23-cancel-bg: #d1d5db;--toast23-cancel-bg-hover: #9ca3af;--toast23-cancel-text: #111827;--toast23-queue-bg: rgba(255, 255, 255, .8);--toast23-enter-duration: .3s;--toast23-exit-duration: .3s;--toast23-easing: cubic-bezier(.4, 0, .2, 1)}.toast23-container,.toast23-container *,.toast23-container *:before,.toast23-container *:after{box-sizing:border-box;margin:0;padding:0}.toast23-container{position:fixed;z-index:var(--toast23-z);display:flex;flex-direction:column;gap:var(--toast23-gap);padding:1rem;pointer-events:none;max-height:100vh;overflow:visible}.toast23-container--inline{position:absolute;inset:0;height:100%;pointer-events:none}.toast23-container--top-right{top:0;right:0}.toast23-container--top-left{top:0;left:0}.toast23-container--top-center{top:0;left:50%;transform:translate(-50%);align-items:center}.toast23-container--bottom-right{bottom:0;right:0;flex-direction:column-reverse}.toast23-container--bottom-left{bottom:0;left:0;flex-direction:column-reverse}.toast23-container--bottom-center{bottom:0;left:50%;transform:translate(-50%);flex-direction:column-reverse;align-items:center}.toast23-container--rtl.toast23-container--top-right,.toast23-container--rtl.toast23-container--bottom-right{right:auto;left:0}.toast23-container--rtl.toast23-container--top-left,.toast23-container--rtl.toast23-container--bottom-left{left:auto;right:0}.toast23-item{pointer-events:auto;position:relative;display:flex;align-items:flex-start;gap:.75rem;min-width:var(--toast23-min-width);max-width:var(--toast23-max-width);padding:var(--toast23-padding);border-radius:var(--toast23-radius);overflow:hidden;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-family:var(--toast23-font);line-height:1.5;box-shadow:inset 0 0 0 1px var(--toast23-item-border, transparent),var(--toast23-shadow);transform:translate(0);opacity:1;transition:transform var(--toast23-enter-duration) var(--toast23-easing),opacity var(--toast23-enter-duration) var(--toast23-easing),box-shadow .15s ease;cursor:default;touch-action:pan-y}.toast23-item:hover{box-shadow:inset 0 0 0 1px var(--toast23-item-border, transparent),var(--toast23-shadow-hover)}.toast23-container--top-right .toast23-item--entering,.toast23-container--top-right .toast23-item--exiting,.toast23-container--bottom-right .toast23-item--entering,.toast23-container--bottom-right .toast23-item--exiting{transform:translate(calc(100% + 1rem));opacity:0}.toast23-container--top-left .toast23-item--entering,.toast23-container--top-left .toast23-item--exiting,.toast23-container--bottom-left .toast23-item--entering,.toast23-container--bottom-left .toast23-item--exiting{transform:translate(calc(-100% - 1rem));opacity:0}.toast23-container--top-center .toast23-item--entering,.toast23-container--top-center .toast23-item--exiting{transform:translateY(-100%);opacity:0}.toast23-container--bottom-center .toast23-item--entering,.toast23-container--bottom-center .toast23-item--exiting{transform:translateY(100%);opacity:0}.toast23-container--stack .toast23-item--stack{transition:transform .25s var(--toast23-easing),opacity .25s var(--toast23-easing),box-shadow .15s ease}.toast23-item--success{background:var(--toast23-bg-success);--toast23-item-border: var(--toast23-border-success)}.toast23-item--error{background:var(--toast23-bg-error);--toast23-item-border: var(--toast23-border-error)}.toast23-item--warning{background:var(--toast23-bg-warning);--toast23-item-border: var(--toast23-border-warning)}.toast23-item--info{background:var(--toast23-bg-info);--toast23-item-border: var(--toast23-border-info)}.toast23-item--default,.toast23-item--loading{background:var(--toast23-bg-default);--toast23-item-border: var(--toast23-border-default)}@media(prefers-color-scheme:dark){:root{--toast23-bg-default: rgba(55, 65, 81, .5);--toast23-bg-success: rgba(22, 101, 52, .25);--toast23-bg-error: rgba(153, 27, 27, .25);--toast23-bg-warning: rgba(133, 77, 14, .25);--toast23-bg-info: rgba(30, 64, 175, .25);--toast23-border-default: #4b5563;--toast23-border-success: #166534;--toast23-border-error: #991b1b;--toast23-border-warning: #854d0e;--toast23-border-info: #1e40af;--toast23-text-title: #f9fafb;--toast23-text-body: #e5e7eb;--toast23-text-muted: #d1d5db;--toast23-action-bg: rgba(255, 255, 255, .08);--toast23-action-bg-hover: rgba(255, 255, 255, .15);--toast23-action-text: #f9fafb;--toast23-cancel-bg: #374151;--toast23-cancel-bg-hover: #4b5563;--toast23-cancel-text: #f9fafb;--toast23-queue-bg: rgba(55, 65, 81, .7)}}.dark,.toast23-container--dark{--toast23-bg-default: rgba(55, 65, 81, .5);--toast23-bg-success: rgba(22, 101, 52, .25);--toast23-bg-error: rgba(153, 27, 27, .25);--toast23-bg-warning: rgba(133, 77, 14, .25);--toast23-bg-info: rgba(30, 64, 175, .25);--toast23-border-default: #4b5563;--toast23-border-success: #166534;--toast23-border-error: #991b1b;--toast23-border-warning: #854d0e;--toast23-border-info: #1e40af;--toast23-text-title: #f9fafb;--toast23-text-body: #e5e7eb;--toast23-text-muted: #d1d5db;--toast23-action-bg: rgba(255, 255, 255, .08);--toast23-action-bg-hover: rgba(255, 255, 255, .15);--toast23-action-text: #f9fafb;--toast23-cancel-bg: #374151;--toast23-cancel-bg-hover: #4b5563;--toast23-cancel-text: #f9fafb;--toast23-queue-bg: rgba(55, 65, 81, .7)}.toast23-container--light{--toast23-bg-default: rgba(249, 250, 251, .95);--toast23-bg-success: rgba(240, 253, 244, .95);--toast23-bg-error: rgba(254, 242, 242, .95);--toast23-bg-warning: rgba(254, 252, 232, .95);--toast23-bg-info: rgba(239, 246, 255, .95);--toast23-border-default: #e5e7eb;--toast23-border-success: #bbf7d0;--toast23-border-error: #fecaca;--toast23-border-warning: #fef08a;--toast23-border-info: #bfdbfe;--toast23-text-title: #111827;--toast23-text-body: #1f2937;--toast23-text-muted: #6b7280;--toast23-action-bg: rgba(0, 0, 0, .06);--toast23-action-bg-hover: rgba(0, 0, 0, .1);--toast23-action-text: #111827;--toast23-cancel-bg: #d1d5db;--toast23-cancel-bg-hover: #9ca3af;--toast23-cancel-text: #111827;--toast23-queue-bg: rgba(255, 255, 255, .8)}.toast23-icon{display:flex;align-items:center;flex-shrink:0;margin-top:1px}.toast23-icon--success{color:var(--toast23-color-success)}.toast23-icon--error{color:var(--toast23-color-error)}.toast23-icon--warning{color:var(--toast23-color-warning)}.toast23-icon--info{color:var(--toast23-color-info)}.toast23-icon--default{color:var(--toast23-color-default)}.toast23-icon--loading{color:var(--toast23-color-loading)}.toast23-content{flex:1;min-width:0}.toast23-title{font-size:.875rem;font-weight:600;color:var(--toast23-text-title);margin-bottom:.125rem;line-height:1.3}.toast23-message{font-size:.875rem;font-weight:500;color:var(--toast23-text-body);word-break:break-word}.toast23-message--with-title{color:var(--toast23-text-muted);font-weight:400}.toast23-actions{display:flex;gap:.375rem;align-items:center;flex-shrink:0;margin-left:.25rem}.toast23-item--confirm{flex-wrap:wrap;padding-right:2.5rem}.toast23-item--confirm .toast23-dismiss{position:absolute;top:.5rem;right:.5rem;margin:0}.toast23-item--confirm .toast23-actions{flex-basis:100%;margin-left:0;margin-top:.625rem;gap:.5rem;justify-content:stretch}.toast23-item--confirm .toast23-action{flex:1 1 0;justify-content:center;padding:.5rem .85rem;font-size:.875rem}.toast23-action{display:inline-flex;align-items:center;justify-content:center;padding:.3rem .65rem;border:none;background:var(--toast23-action-bg);color:var(--toast23-action-text);font:600 .8125rem var(--toast23-font);border-radius:.375rem;cursor:pointer;transition:background-color .15s ease;white-space:nowrap}.toast23-action:hover{background:var(--toast23-action-bg-hover)}.toast23-action:focus-visible{outline:2px solid var(--toast23-color-info);outline-offset:1px}.toast23-action--cancel{background:var(--toast23-cancel-bg);color:var(--toast23-cancel-text);font-weight:600}.toast23-action--cancel:hover{background:var(--toast23-cancel-bg-hover)}.toast23-action--confirm{background:var(--toast23-color-info);color:#fff;box-shadow:0 1px 2px #00000014,0 0 0 1px #0000000d}.toast23-action--confirm:hover{filter:brightness(1.08)}.toast23-action--confirm:active{filter:brightness(.95)}.toast23-dismiss{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1.5rem;height:1.5rem;border:none;background:transparent;color:var(--toast23-text-muted);cursor:pointer;border-radius:.25rem;transition:color .15s ease,background-color .15s ease;margin:-.125rem -.25rem 0 0;padding:0}.toast23-dismiss:hover{color:var(--toast23-text-title);background:#0000000d}.toast23-dismiss:focus-visible{outline:2px solid var(--toast23-color-info);outline-offset:1px}.toast23-progress{position:absolute;bottom:0;left:0;width:100%;height:3.5px;transform-origin:left center;will-change:transform;border-radius:0 0 0 var(--toast23-radius)}.toast23-container--rtl .toast23-progress{transform-origin:right center;left:auto;right:0;border-radius:0 0 var(--toast23-radius) 0}.toast23-progress--success{background:var(--toast23-color-success)}.toast23-progress--error{background:var(--toast23-color-error)}.toast23-progress--warning{background:var(--toast23-color-warning)}.toast23-progress--info{background:var(--toast23-color-info)}.toast23-progress--default{background:var(--toast23-color-default)}.toast23-queue-badge{font-family:inherit;font-size:.75rem;font-weight:500;color:var(--toast23-text-muted);background:var(--toast23-queue-bg);border:1px solid var(--toast23-border-default);border-radius:9999px;padding:.25rem .75rem;text-align:center;pointer-events:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.toast23-spinner{animation:toast23-spin .7s linear infinite}@keyframes toast23-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.toast23-item,.toast23-item--entering,.toast23-item--exiting,.toast23-progress{transition-duration:1ms!important;transform:none!important}.toast23-item--entering,.toast23-item--exiting{opacity:0}.toast23-spinner{animation:none}}@media(max-width:480px){.toast23-container{padding:.75rem;left:0!important;right:0!important}.toast23-item{min-width:0;max-width:100%}}', dt = "data-toast23-styles";
+function bt() {
+  if (typeof document > "u" || document.querySelector(`style[${dt}]`)) return;
+  const t = document.createElement("style");
+  t.setAttribute(dt, ""), t.textContent = Gt, document.head.appendChild(t);
+}
+let et = null;
+function qt() {
+  if (typeof window > "u") return null;
+  if (et) return et;
+  const t = window.AudioContext ?? window.webkitAudioContext;
+  if (!t) return null;
+  try {
+    return et = new t(), et;
+  } catch {
+    return null;
+  }
+}
+const Ot = {
+  // Cheerful two-note rise.
+  success: [
+    { freq: 660, ms: 90, gain: 0.18, type: "sine" },
+    { freq: 880, ms: 130, gain: 0.18, type: "sine" }
+  ],
+  // Descending "uh-oh" — triangle gives richer harmonics so it cuts through.
+  error: [
+    { freq: 622, ms: 140, gain: 0.3, type: "triangle" },
+    { freq: 415, ms: 220, gain: 0.3, type: "triangle" }
+  ],
+  // Quick double pulse — alert feel.
+  warning: [
+    { freq: 880, ms: 110, gain: 0.24, type: "triangle" },
+    { freq: 880, ms: 110, gain: 0.24, type: "triangle" }
+  ],
+  // Soft single chime.
+  info: [{ freq: 784, ms: 130, gain: 0.18, type: "sine" }],
+  default: [{ freq: 660, ms: 100, gain: 0.16, type: "sine" }],
+  loading: []
+};
+function _t(t, n, o) {
+  const a = n.ms / 1e3, p = t.createOscillator(), m = t.createGain();
+  p.type = n.type, p.frequency.value = n.freq;
+  const E = 8e-3;
+  return m.gain.setValueAtTime(1e-4, o), m.gain.exponentialRampToValueAtTime(n.gain, o + E), m.gain.exponentialRampToValueAtTime(1e-4, o + a), p.connect(m).connect(t.destination), p.start(o), p.stop(o + a), o + a;
+}
+function ut(t, n) {
+  try {
+    let o = t.currentTime + 0.03;
+    const a = 0.02;
+    for (const p of n)
+      o = _t(t, p, o) + a;
+  } catch {
+  }
+}
+function ht(t) {
+  const n = qt();
+  if (!n) return;
+  const o = Ot[t];
+  if (!(!o || o.length === 0)) {
+    if (n.state === "suspended") {
+      n.resume().then(
+        () => ut(n, o),
+        () => {
+        }
+      );
+      return;
+    }
+    ut(n, o);
+  }
+}
+function zt() {
+  return typeof document > "u" || typeof Notification > "u" ? !1 : document.hidden;
+}
+let gt = !1;
+function Wt(t, n, o) {
+  if (!zt()) return;
+  const a = () => {
+    try {
+      new Notification(o ?? `[${n}]`, {
+        body: t,
+        tag: "toast-23"
+      });
+    } catch {
+    }
+  };
+  if (Notification.permission === "granted") {
+    a();
+    return;
+  }
+  Notification.permission === "default" && !gt && (gt = !0, Notification.requestPermission().then((p) => {
+    p === "granted" && a();
+  }).catch(() => {
+  }));
+}
+function yt() {
+  let t = [];
+  const n = /* @__PURE__ */ new Set();
+  return {
+    publish(o) {
+      t !== o && (t = o, n.forEach((a) => a()));
+    },
+    getSnapshot() {
+      return t;
+    },
+    subscribe(o) {
+      return n.add(o), () => {
+        n.delete(o);
+      };
+    }
+  };
+}
+bt();
+const jt = [
   "top-right",
   "top-left",
   "top-center",
   "bottom-right",
   "bottom-left",
   "bottom-center"
-], A = ({
-  children: e,
-  maxVisible: o = 5,
-  position: t = "top-right",
-  duration: i = 5e3
+], vt = ({
+  children: t,
+  maxVisible: n = 5,
+  position: o = "top-right",
+  duration: a = 5e3,
+  layout: p = "default",
+  dir: m = "ltr",
+  theme: E = "auto",
+  target: f = null,
+  historySize: y = 50,
+  focusShortcut: B = "F8",
+  swipeThreshold: G = 80,
+  swipeEnabled: k = !0,
+  sound: R = !1,
+  fallbackToNotification: b = !1
 }) => {
-  const [u, l] = D(B, []), g = w(
-    (r, c) => {
-      const p = c?.id ?? z(), v = {
-        id: p,
-        message: r,
-        title: c?.title,
-        variant: c?.variant ?? "default",
-        duration: c?.duration ?? i,
-        position: c?.position ?? t,
-        dismissible: c?.dismissible ?? !0,
-        removeDelay: c?.removeDelay ?? 1e3,
+  const [T, C] = Ct(Et, []), [M, N] = P(!1), v = Q(T);
+  v.current = T;
+  const h = Q();
+  h.current || (h.current = yt());
+  const S = h.current, u = Q([]), s = Q(/* @__PURE__ */ new Set()), c = w(
+    (l) => {
+      if (s.current.has(l.id)) return;
+      s.current.add(l.id);
+      const e = {
+        id: l.id,
+        message: l.message,
+        title: l.title,
+        variant: l.variant === "loading" ? "info" : l.variant,
+        dismissedAt: Date.now(),
+        group: l.group
+      };
+      if (u.current = [e, ...u.current].slice(0, y), l.onDismiss)
+        try {
+          l.onDismiss();
+        } catch {
+        }
+    },
+    [y]
+  ), A = w(
+    (l, e) => {
+      const g = e?.id ?? rt(), D = e?.variant ?? "default", L = {
+        id: g,
+        message: l,
+        title: e?.title,
+        variant: D,
+        duration: e?.duration ?? a,
+        position: e?.position ?? o,
+        dismissible: e?.dismissible ?? !0,
+        removeDelay: e?.removeDelay ?? 300,
         isExiting: !1,
         createdAt: Date.now(),
         version: 0,
-        isCustom: c?.isCustom
+        isCustom: e?.isCustom,
+        action: e?.action,
+        cancelAction: e?.cancelAction,
+        onDismiss: e?.onDismiss,
+        group: e?.group,
+        sound: e?.sound ?? R,
+        fallbackToNotification: e?.fallbackToNotification ?? b
       };
-      return c?.id ? l({ type: "UPSERT", toast: v }) : l({ type: "ADD", toast: v }), p;
+      return e?.id ? C({ type: "UPSERT", toast: L }) : C({ type: "ADD", toast: L }), L.sound && ht(D), L.fallbackToNotification && typeof l == "string" && Wt(l, D, L.title), g;
     },
-    [i, t]
-  ), d = w(
-    (r, c) => {
-      l({ type: "UPDATE", id: r, updates: c });
+    [a, o, R, b]
+  ), I = w(
+    (l, e) => {
+      C({ type: "UPDATE", id: l, updates: e });
     },
     []
-  ), a = w((r) => {
-    l({ type: "DISMISS", id: r });
-  }, []), m = w((r) => {
-    l({ type: "REMOVE", id: r });
-  }, []), f = C(
+  ), _ = w(
+    (l) => {
+      if (l) {
+        const e = v.current.find((g) => g.id === l);
+        e && c(e);
+      } else
+        v.current.forEach(c);
+      C({ type: "DISMISS", id: l });
+    },
+    [c]
+  ), j = w(
+    (l) => {
+      if (l) {
+        const e = v.current.find((g) => g.id === l);
+        e && c(e), C({ type: "REMOVE", id: l }), s.current.delete(l);
+      } else
+        v.current.forEach(c), C({ type: "REMOVE", id: l }), s.current.clear();
+    },
+    [c]
+  ), z = w(
+    (l) => {
+      v.current.filter((e) => e.group === l).forEach(c), C({ type: "DISMISS_GROUP", group: l });
+    },
+    [c]
+  ), q = w(
+    (l) => {
+      const e = v.current.filter((g) => g.group === l);
+      e.forEach(c), C({ type: "REMOVE_GROUP", group: l });
+      for (const g of e) s.current.delete(g.id);
+    },
+    [c]
+  ), F = w(() => N(!0), []), r = w(() => N(!1), []), X = w(() => u.current, []), O = ot(
     () => ({
-      addToast: g,
-      updateToast: d,
-      dismissToast: a,
-      removeToast: m,
+      addToast: A,
+      updateToast: I,
+      dismissToast: _,
+      removeToast: j,
+      dismissGroup: z,
+      removeGroup: q,
+      pauseAll: F,
+      resumeAll: r,
+      history: X,
+      headlessStore: S,
       config: {
-        maxVisible: o,
-        position: t,
-        duration: i
-      }
+        maxVisible: n,
+        position: o,
+        duration: a,
+        layout: p,
+        dir: m,
+        theme: E,
+        swipeThreshold: G,
+        swipeEnabled: k,
+        sound: R,
+        fallbackToNotification: b
+      },
+      isPausedGlobally: M
     }),
     [
-      g,
-      d,
+      A,
+      I,
+      _,
+      j,
+      z,
+      q,
+      F,
+      r,
+      X,
+      S,
+      n,
+      o,
       a,
+      p,
       m,
-      o,
-      t,
-      i
+      E,
+      G,
+      k,
+      R,
+      b,
+      M
     ]
-  ), n = C(() => {
-    const r = {
+  );
+  Y(() => {
+    S.publish(T);
+  }, [T, S]), Y(() => {
+    if (!B || typeof window > "u") return;
+    const l = (e) => {
+      if (e.key !== B) return;
+      const g = document.querySelector(
+        '[data-toast23-region="true"]'
+      );
+      g && (e.preventDefault(), g.focus());
+    };
+    return window.addEventListener("keydown", l), () => window.removeEventListener("keydown", l);
+  }, [B]);
+  const K = ot(() => {
+    const l = {
       "top-right": [],
       "top-left": [],
       "top-center": [],
@@ -410,107 +770,932 @@ const V = [
       "bottom-left": [],
       "bottom-center": []
     };
-    for (const c of u)
-      r[c.position].push(c);
-    return r;
-  }, [u]);
-  return /* @__PURE__ */ h(I.Provider, { value: f, children: [
-    e,
-    V.map(
-      (r) => n[r].length > 0 ? /* @__PURE__ */ s(
-        M,
+    for (const e of T)
+      (l[e.position] ?? l[o]).push(e);
+    return l;
+  }, [T, o]), H = /* @__PURE__ */ i(st, { children: jt.map(
+    (l) => K[l].length > 0 ? /* @__PURE__ */ i(
+      mt,
+      {
+        position: l,
+        toasts: K[l],
+        maxVisible: n,
+        layout: p,
+        dir: m,
+        theme: E,
+        inline: f != null
+      },
+      l
+    ) : null
+  ) }), U = f ?? (typeof document < "u" ? document.body : null);
+  return /* @__PURE__ */ d(tt.Provider, { value: O, children: [
+    t,
+    U ? St(H, U) : H
+  ] });
+};
+vt.displayName = "Toast23Provider";
+const at = [
+  "default",
+  "success",
+  "info",
+  "warning",
+  "error",
+  "loading"
+], Ft = [
+  "top-left",
+  "top-center",
+  "top-right",
+  "bottom-left",
+  "bottom-center",
+  "bottom-right"
+], J = {
+  success: "#16a34a",
+  error: "#dc2626",
+  warning: "#ca8a04",
+  info: "#2563eb",
+  loading: "#7c3aed",
+  default: "#6b7280"
+}, Kt = {
+  compact: { width: 360, height: 480 },
+  expanded: { width: 620, height: 720 }
+}, Ht = yt(), Ut = ({
+  position: t = "bottom-left",
+  collapsed: n = !0
+}) => {
+  const o = nt(tt), [a, p] = P(n), [m, E] = P("compact"), [f, y] = P("queue"), [B, G] = P(/* @__PURE__ */ new Set()), [k, R] = P(null), [b, T] = P(""), [C, M] = P(4e3), N = o?.headlessStore ?? Ht, v = ft(
+    N.subscribe,
+    N.getSnapshot,
+    N.getSnapshot
+  ), h = ot(
+    () => o ? o.history() : [],
+    // `toasts` is in the deps so this memo invalidates whenever the queue
+    // mutates — which is also when `ctx.history()` gains/loses entries.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [o, v]
+  ), S = w((e) => {
+    G((g) => {
+      const D = new Set(g);
+      return D.has(e) ? D.delete(e) : D.add(e), D;
+    });
+  }, []), u = w((e) => {
+    R(e), window.setTimeout(() => {
+      R((g) => g === e ? null : g);
+    }, 1200);
+  }, []), s = w(
+    (e, g) => {
+      const D = JSON.stringify(e, null, 2);
+      try {
+        navigator?.clipboard?.writeText ? navigator.clipboard.writeText(D).then(
+          () => u(g),
+          () => u(g)
+        ) : u(g);
+      } catch {
+        u(g);
+      }
+    },
+    [u]
+  );
+  if (!o) return null;
+  const c = v.filter((e) => !B.has(e.variant)), A = h.filter((e) => !B.has(e.variant)), I = v.length, _ = (e) => {
+    o.addToast(e.message, {
+      variant: e.variant,
+      title: e.title,
+      group: e.group
+    });
+  }, j = (e) => {
+    o.addToast(`Test ${e} toast`, {
+      variant: e,
+      title: e === "default" ? void 0 : e.toUpperCase(),
+      duration: C,
+      position: b || void 0
+    });
+  }, z = Kt[m], q = t.startsWith("top"), F = t.endsWith("right"), r = {
+    chip: {
+      position: "fixed",
+      [q ? "top" : "bottom"]: 16,
+      [F ? "right" : "left"]: 16,
+      zIndex: 1e5,
+      display: "inline-flex",
+      alignItems: "center",
+      gap: 6,
+      padding: "6px 12px",
+      background: "rgba(17, 24, 39, 0.96)",
+      color: "#f9fafb",
+      borderRadius: 999,
+      fontFamily: "ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace",
+      fontSize: 11,
+      lineHeight: 1,
+      boxShadow: "0 6px 20px rgba(0,0,0,0.25)",
+      border: "1px solid rgba(255,255,255,0.08)",
+      cursor: "pointer",
+      userSelect: "none"
+    },
+    panel: {
+      position: "fixed",
+      [q ? "top" : "bottom"]: 16,
+      [F ? "right" : "left"]: 16,
+      zIndex: 1e5,
+      width: `min(${z.width}px, calc(100vw - 32px))`,
+      height: `min(${z.height}px, calc(100vh - 32px))`,
+      background: "rgba(17, 24, 39, 0.97)",
+      color: "#f9fafb",
+      fontFamily: "ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace",
+      fontSize: 11,
+      lineHeight: 1.5,
+      borderRadius: 10,
+      boxShadow: "0 10px 30px rgba(0,0,0,0.35)",
+      border: "1px solid rgba(255,255,255,0.08)",
+      overflow: "hidden",
+      display: "flex",
+      flexDirection: "column"
+    },
+    header: {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "space-between",
+      gap: 8,
+      padding: "8px 10px",
+      borderBottom: "1px solid rgba(255,255,255,0.08)"
+    },
+    title: {
+      display: "inline-flex",
+      alignItems: "center",
+      gap: 6,
+      fontWeight: 700,
+      letterSpacing: 0.3
+    },
+    badge: {
+      display: "inline-flex",
+      alignItems: "center",
+      justifyContent: "center",
+      minWidth: 18,
+      height: 18,
+      padding: "0 5px",
+      borderRadius: 999,
+      background: "#3b82f6",
+      color: "#fff",
+      fontSize: 10,
+      fontWeight: 700
+    },
+    iconBtn: {
+      display: "inline-flex",
+      alignItems: "center",
+      justifyContent: "center",
+      width: 22,
+      height: 22,
+      padding: 0,
+      borderRadius: 4,
+      background: "transparent",
+      color: "#cbd5e1",
+      border: "1px solid rgba(255,255,255,0.12)",
+      cursor: "pointer",
+      fontSize: 12,
+      fontFamily: "inherit"
+    },
+    tabs: {
+      display: "flex",
+      gap: 4,
+      padding: "8px 10px 0"
+    },
+    tab: {
+      flex: 1,
+      padding: "5px 8px",
+      borderRadius: 6,
+      background: "transparent",
+      color: "#9ca3af",
+      border: "1px solid transparent",
+      cursor: "pointer",
+      fontSize: 10,
+      fontFamily: "inherit",
+      fontWeight: 600,
+      textTransform: "uppercase",
+      letterSpacing: 0.5
+    },
+    tabActive: {
+      background: "rgba(59, 130, 246, 0.15)",
+      color: "#bfdbfe",
+      borderColor: "rgba(59, 130, 246, 0.4)"
+    },
+    chipRow: {
+      display: "flex",
+      flexWrap: "wrap",
+      gap: 4,
+      padding: "8px 10px",
+      borderBottom: "1px solid rgba(255,255,255,0.05)"
+    },
+    filterChip: {
+      display: "inline-flex",
+      alignItems: "center",
+      gap: 4,
+      padding: "2px 7px",
+      borderRadius: 999,
+      border: "1px solid rgba(255,255,255,0.12)",
+      background: "rgba(255,255,255,0.04)",
+      color: "#e5e7eb",
+      fontSize: 9,
+      fontWeight: 600,
+      textTransform: "uppercase",
+      letterSpacing: 0.4,
+      cursor: "pointer",
+      fontFamily: "inherit"
+    },
+    filterChipOff: {
+      opacity: 0.35,
+      textDecoration: "line-through"
+    },
+    body: {
+      flex: 1,
+      overflow: "auto"
+    },
+    empty: {
+      padding: "20px 12px",
+      color: "#6b7280",
+      textAlign: "center"
+    },
+    row: {
+      padding: "8px 12px",
+      borderBottom: "1px solid rgba(255,255,255,0.04)"
+    },
+    rowTop: {
+      display: "flex",
+      justifyContent: "space-between",
+      alignItems: "center",
+      gap: 8,
+      marginBottom: 4
+    },
+    variantTag: {
+      fontSize: 9,
+      padding: "1px 6px",
+      borderRadius: 3,
+      color: "#fff",
+      textTransform: "uppercase",
+      letterSpacing: 0.3,
+      fontWeight: 700
+    },
+    rowMeta: {
+      color: "#9ca3af",
+      fontSize: 10,
+      overflow: "hidden",
+      textOverflow: "ellipsis",
+      whiteSpace: "nowrap"
+    },
+    rowMessage: {
+      color: "#e5e7eb",
+      whiteSpace: "pre-wrap",
+      wordBreak: "break-word"
+    },
+    rowActions: {
+      display: "flex",
+      gap: 4,
+      marginTop: 6
+    },
+    smallBtn: {
+      flex: 1,
+      padding: "3px 7px",
+      borderRadius: 4,
+      background: "rgba(255,255,255,0.06)",
+      color: "#f9fafb",
+      border: "1px solid rgba(255,255,255,0.1)",
+      cursor: "pointer",
+      fontSize: 10,
+      fontFamily: "inherit"
+    },
+    smallBtnActive: {
+      background: "rgba(34, 197, 94, 0.18)",
+      borderColor: "rgba(34, 197, 94, 0.5)",
+      color: "#bbf7d0"
+    },
+    footer: {
+      display: "flex",
+      gap: 4,
+      padding: "8px 10px",
+      borderTop: "1px solid rgba(255,255,255,0.08)",
+      background: "rgba(0,0,0,0.2)"
+    },
+    section: {
+      padding: "10px 12px",
+      borderBottom: "1px solid rgba(255,255,255,0.04)"
+    },
+    sectionTitle: {
+      fontSize: 9,
+      fontWeight: 700,
+      textTransform: "uppercase",
+      letterSpacing: 0.6,
+      color: "#9ca3af",
+      marginBottom: 8
+    },
+    grid3: {
+      display: "grid",
+      gridTemplateColumns: "repeat(3, 1fr)",
+      gap: 4
+    },
+    grid6: {
+      display: "grid",
+      gridTemplateColumns: "repeat(6, 1fr)",
+      gap: 4
+    },
+    kvRow: {
+      display: "flex",
+      justifyContent: "space-between",
+      alignItems: "center",
+      padding: "3px 0",
+      color: "#cbd5e1",
+      fontSize: 10
+    },
+    kvKey: { color: "#9ca3af" },
+    inputRow: {
+      display: "flex",
+      alignItems: "center",
+      gap: 6,
+      marginBottom: 8
+    },
+    input: {
+      flex: 1,
+      padding: "3px 6px",
+      borderRadius: 4,
+      background: "rgba(255,255,255,0.06)",
+      color: "#f9fafb",
+      border: "1px solid rgba(255,255,255,0.1)",
+      fontSize: 10,
+      fontFamily: "inherit"
+    }
+  }, X = (e) => ({
+    ...r.variantTag,
+    background: J[e]
+  }), O = /* @__PURE__ */ d(
+    "button",
+    {
+      type: "button",
+      style: r.chip,
+      onClick: () => p(!1),
+      "data-toast23-devtools": "chip",
+      "aria-label": `Open toast-23 devtools (${I} active)`,
+      children: [
+        /* @__PURE__ */ i("span", { style: { fontWeight: 700, letterSpacing: 0.3 }, children: "toast-23 devtools" }),
+        /* @__PURE__ */ i("span", { style: r.badge, children: I }),
+        o.isPausedGlobally && /* @__PURE__ */ i("span", { style: { ...r.badge, background: "#dc2626" }, children: "paused" })
+      ]
+    }
+  );
+  if (a) return O;
+  const K = /* @__PURE__ */ i("div", { style: r.chipRow, children: at.map((e) => {
+    const g = B.has(e);
+    return /* @__PURE__ */ d(
+      "button",
+      {
+        type: "button",
+        onClick: () => S(e),
+        style: {
+          ...r.filterChip,
+          ...g ? r.filterChipOff : null,
+          borderColor: g ? "rgba(255,255,255,0.12)" : J[e] + "80"
+        },
+        "aria-pressed": !g,
+        title: g ? `Show ${e}` : `Hide ${e}`,
+        children: [
+          /* @__PURE__ */ i(
+            "span",
+            {
+              style: {
+                width: 6,
+                height: 6,
+                borderRadius: 999,
+                background: J[e],
+                display: "inline-block"
+              }
+            }
+          ),
+          e
+        ]
+      },
+      e
+    );
+  }) }), H = /* @__PURE__ */ d(st, { children: [
+    K,
+    /* @__PURE__ */ d("div", { style: r.body, children: [
+      c.length === 0 && /* @__PURE__ */ i("div", { style: r.empty, children: v.length === 0 ? "Queue is empty." : "All variants filtered out." }),
+      c.map((e) => {
+        const g = `q-${e.id}`;
+        return /* @__PURE__ */ d("div", { style: r.row, children: [
+          /* @__PURE__ */ d("div", { style: r.rowTop, children: [
+            /* @__PURE__ */ i("span", { style: X(e.variant), children: e.variant }),
+            /* @__PURE__ */ i("span", { style: r.rowMeta, title: e.id, children: e.id })
+          ] }),
+          /* @__PURE__ */ i("div", { style: r.rowMessage, children: typeof e.message == "string" ? e.message : "[ReactNode message]" }),
+          /* @__PURE__ */ d("div", { style: { ...r.rowMeta, marginTop: 2 }, children: [
+            e.duration,
+            "ms · ",
+            e.position,
+            e.group && ` · group: ${e.group}`,
+            e.isExiting && " · exiting"
+          ] }),
+          /* @__PURE__ */ d("div", { style: r.rowActions, children: [
+            /* @__PURE__ */ i(
+              "button",
+              {
+                type: "button",
+                style: r.smallBtn,
+                onClick: () => o.dismissToast(e.id),
+                children: "Dismiss"
+              }
+            ),
+            /* @__PURE__ */ i(
+              "button",
+              {
+                type: "button",
+                style: r.smallBtn,
+                onClick: () => o.removeToast(e.id),
+                children: "Remove"
+              }
+            ),
+            /* @__PURE__ */ i(
+              "button",
+              {
+                type: "button",
+                style: k === g ? { ...r.smallBtn, ...r.smallBtnActive } : r.smallBtn,
+                onClick: () => s(
+                  {
+                    id: e.id,
+                    variant: e.variant,
+                    message: typeof e.message == "string" ? e.message : "[ReactNode]",
+                    title: e.title,
+                    duration: e.duration,
+                    position: e.position,
+                    group: e.group,
+                    createdAt: e.createdAt
+                  },
+                  g
+                ),
+                children: k === g ? "Copied" : "Copy"
+              }
+            )
+          ] })
+        ] }, e.id);
+      })
+    ] }),
+    /* @__PURE__ */ d("div", { style: r.footer, children: [
+      /* @__PURE__ */ i(
+        "button",
+        {
+          type: "button",
+          style: r.smallBtn,
+          onClick: () => o.isPausedGlobally ? o.resumeAll() : o.pauseAll(),
+          children: o.isPausedGlobally ? "Resume all" : "Pause all"
+        }
+      ),
+      /* @__PURE__ */ i(
+        "button",
+        {
+          type: "button",
+          style: r.smallBtn,
+          onClick: () => o.dismissToast(),
+          children: "Dismiss all"
+        }
+      ),
+      /* @__PURE__ */ i(
+        "button",
+        {
+          type: "button",
+          style: r.smallBtn,
+          onClick: () => o.removeToast(),
+          children: "Clear"
+        }
+      )
+    ] })
+  ] }), U = /* @__PURE__ */ d(st, { children: [
+    K,
+    /* @__PURE__ */ d("div", { style: r.body, children: [
+      A.length === 0 && /* @__PURE__ */ i("div", { style: r.empty, children: h.length === 0 ? "No dismissed toasts yet. Fire a toast and dismiss it." : "All variants filtered out." }),
+      A.map((e) => {
+        const g = `h-${e.id}`, D = Yt(Date.now() - e.dismissedAt);
+        return /* @__PURE__ */ d("div", { style: r.row, children: [
+          /* @__PURE__ */ d("div", { style: r.rowTop, children: [
+            /* @__PURE__ */ i("span", { style: X(e.variant), children: e.variant }),
+            /* @__PURE__ */ i("span", { style: r.rowMeta, title: new Date(e.dismissedAt).toISOString(), children: D })
+          ] }),
+          e.title && /* @__PURE__ */ i(
+            "div",
+            {
+              style: { fontWeight: 700, color: "#f9fafb", marginBottom: 2 },
+              children: e.title
+            }
+          ),
+          /* @__PURE__ */ i("div", { style: r.rowMessage, children: typeof e.message == "string" ? e.message : "[ReactNode message]" }),
+          e.group && /* @__PURE__ */ d("div", { style: { ...r.rowMeta, marginTop: 2 }, children: [
+            "group: ",
+            e.group
+          ] }),
+          /* @__PURE__ */ d("div", { style: r.rowActions, children: [
+            /* @__PURE__ */ i(
+              "button",
+              {
+                type: "button",
+                style: r.smallBtn,
+                onClick: () => _(e),
+                title: "Re-fire this toast",
+                children: "Replay"
+              }
+            ),
+            /* @__PURE__ */ i(
+              "button",
+              {
+                type: "button",
+                style: k === g ? { ...r.smallBtn, ...r.smallBtnActive } : r.smallBtn,
+                onClick: () => s(
+                  {
+                    id: e.id,
+                    variant: e.variant,
+                    message: typeof e.message == "string" ? e.message : "[ReactNode]",
+                    title: e.title,
+                    group: e.group,
+                    dismissedAt: e.dismissedAt
+                  },
+                  g
+                ),
+                children: k === g ? "Copied" : "Copy"
+              }
+            )
+          ] })
+        ] }, e.id);
+      })
+    ] }),
+    /* @__PURE__ */ i("div", { style: r.footer, children: /* @__PURE__ */ d("span", { style: { ...r.rowMeta, alignSelf: "center", flex: 1 }, children: [
+      h.length,
+      " entries · cap ",
+      h.length >= 50 ? "reached" : "ok"
+    ] }) })
+  ] }), l = /* @__PURE__ */ d("div", { style: r.body, children: [
+    /* @__PURE__ */ d("div", { style: r.section, children: [
+      /* @__PURE__ */ i("div", { style: r.sectionTitle, children: "Spawn test toast" }),
+      /* @__PURE__ */ i("div", { style: r.grid6, children: at.map((e) => /* @__PURE__ */ i(
+        "button",
         {
-          position: r,
-          toasts: n[r],
-          maxVisible: o
+          type: "button",
+          style: {
+            ...r.smallBtn,
+            background: J[e] + "33",
+            borderColor: J[e] + "80",
+            color: "#fff"
+          },
+          onClick: () => j(e),
+          title: `Fire a ${e} toast`,
+          children: e
         },
-        r
-      ) : null
-    )
+        e
+      )) })
+    ] }),
+    /* @__PURE__ */ d("div", { style: r.section, children: [
+      /* @__PURE__ */ i("div", { style: r.sectionTitle, children: "Sound preview" }),
+      /* @__PURE__ */ i("div", { style: r.grid6, children: at.map((e) => /* @__PURE__ */ d(
+        "button",
+        {
+          type: "button",
+          style: r.smallBtn,
+          onClick: () => ht(e),
+          title: `Play ${e} tone`,
+          children: [
+            "♪ ",
+            e.slice(0, 4)
+          ]
+        },
+        e
+      )) }),
+      /* @__PURE__ */ i("div", { style: { ...r.rowMeta, marginTop: 6 }, children: "Plays the tone patch directly. Requires a prior user gesture (browser autoplay policy)." })
+    ] }),
+    /* @__PURE__ */ d("div", { style: r.section, children: [
+      /* @__PURE__ */ i("div", { style: r.sectionTitle, children: "Test overrides" }),
+      /* @__PURE__ */ d("div", { style: r.inputRow, children: [
+        /* @__PURE__ */ i("span", { style: r.kvKey, children: "duration" }),
+        /* @__PURE__ */ i(
+          "input",
+          {
+            type: "number",
+            min: 0,
+            step: 500,
+            value: C,
+            onChange: (e) => M(Number(e.target.value) || 0),
+            style: r.input
+          }
+        ),
+        /* @__PURE__ */ i("span", { style: r.kvKey, children: "ms" })
+      ] }),
+      /* @__PURE__ */ i("div", { style: { ...r.kvKey, marginBottom: 4, fontSize: 10 }, children: "position" }),
+      /* @__PURE__ */ d("div", { style: r.grid3, children: [
+        /* @__PURE__ */ i(
+          "button",
+          {
+            type: "button",
+            style: b === "" ? { ...r.smallBtn, ...r.smallBtnActive } : r.smallBtn,
+            onClick: () => T(""),
+            children: "inherit"
+          }
+        ),
+        Ft.map((e) => /* @__PURE__ */ i(
+          "button",
+          {
+            type: "button",
+            style: b === e ? { ...r.smallBtn, ...r.smallBtnActive } : r.smallBtn,
+            onClick: () => T(e),
+            title: e,
+            children: e.replace("top-", "↑").replace("bottom-", "↓")
+          },
+          e
+        ))
+      ] })
+    ] }),
+    /* @__PURE__ */ d("div", { style: r.section, children: [
+      /* @__PURE__ */ d(
+        "div",
+        {
+          style: {
+            ...r.sectionTitle,
+            display: "flex",
+            justifyContent: "space-between"
+          },
+          children: [
+            /* @__PURE__ */ i("span", { children: "Provider config" }),
+            /* @__PURE__ */ i(
+              "button",
+              {
+                type: "button",
+                style: k === "config" ? {
+                  ...r.smallBtn,
+                  ...r.smallBtnActive,
+                  flex: "0 0 auto",
+                  padding: "2px 8px"
+                } : { ...r.smallBtn, flex: "0 0 auto", padding: "2px 8px" },
+                onClick: () => s({ ...o.config }, "config"),
+                children: k === "config" ? "Copied" : "Copy JSON"
+              }
+            )
+          ]
+        }
+      ),
+      Object.entries(o.config).map(([e, g]) => /* @__PURE__ */ d("div", { style: r.kvRow, children: [
+        /* @__PURE__ */ i("span", { style: r.kvKey, children: e }),
+        /* @__PURE__ */ i("span", { children: String(g) })
+      ] }, e)),
+      /* @__PURE__ */ d("div", { style: { ...r.kvRow, marginTop: 6 }, children: [
+        /* @__PURE__ */ i("span", { style: r.kvKey, children: "paused" }),
+        /* @__PURE__ */ i("span", { children: o.isPausedGlobally ? "yes" : "no" })
+      ] })
+    ] })
+  ] });
+  return /* @__PURE__ */ d("div", { style: r.panel, "data-toast23-devtools": "panel", children: [
+    /* @__PURE__ */ d("div", { style: r.header, children: [
+      /* @__PURE__ */ d("span", { style: r.title, children: [
+        "toast-23",
+        /* @__PURE__ */ i("span", { style: r.badge, children: I }),
+        o.isPausedGlobally && /* @__PURE__ */ i("span", { style: { ...r.badge, background: "#dc2626" }, children: "paused" })
+      ] }),
+      /* @__PURE__ */ d("span", { style: { display: "inline-flex", gap: 4 }, children: [
+        /* @__PURE__ */ i(
+          "button",
+          {
+            type: "button",
+            style: r.iconBtn,
+            onClick: () => E((e) => e === "compact" ? "expanded" : "compact"),
+            title: m === "compact" ? "Expand" : "Shrink",
+            "aria-label": m === "compact" ? "Expand panel" : "Shrink panel",
+            children: m === "compact" ? "⤢" : "⤡"
+          }
+        ),
+        /* @__PURE__ */ i(
+          "button",
+          {
+            type: "button",
+            style: r.iconBtn,
+            onClick: () => p(!0),
+            title: "Collapse to chip",
+            "aria-label": "Collapse to chip",
+            children: "–"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ i("div", { style: r.tabs, children: ["queue", "history", "settings"].map((e) => /* @__PURE__ */ d(
+      "button",
+      {
+        type: "button",
+        style: f === e ? { ...r.tab, ...r.tabActive } : r.tab,
+        onClick: () => y(e),
+        children: [
+          e,
+          e === "queue" && I > 0 ? ` (${I})` : "",
+          e === "history" && h.length > 0 ? ` (${h.length})` : ""
+        ]
+      },
+      e
+    )) }),
+    f === "queue" && H,
+    f === "history" && U,
+    f === "settings" && l
   ] });
 };
-A.displayName = "Toast23Provider";
-function G() {
-  const e = N(I);
-  if (!e)
+Ut.displayName = "Toast23DevTools";
+function Yt(t) {
+  if (t < 0) return "now";
+  const n = Math.floor(t / 1e3);
+  if (n < 5) return "just now";
+  if (n < 60) return `${n}s ago`;
+  const o = Math.floor(n / 60);
+  if (o < 60) return `${o}m ago`;
+  const a = Math.floor(o / 60);
+  return a < 24 ? `${a}h ago` : `${Math.floor(a / 24)}d ago`;
+}
+function Xt() {
+  const t = nt(tt);
+  if (!t)
     throw new Error(
       "[toast-23] useToast() must be used inside a <Toast23Provider>. Wrap your application root with <Toast23Provider> to fix this."
     );
-  return C(() => {
-    const o = ((t, i) => e.addToast(t, i));
-    return o.success = (t, i) => e.addToast(t, { ...i, variant: "success" }), o.error = (t, i) => e.addToast(t, { ...i, variant: "error" }), o.warning = (t, i) => e.addToast(t, { ...i, variant: "warning" }), o.info = (t, i) => e.addToast(t, { ...i, variant: "info" }), o.loading = (t, i) => e.addToast(t, {
-      ...i,
+  return ot(() => {
+    const n = ((o, a) => t.addToast(o, a));
+    return n.success = (o, a) => t.addToast(o, { ...a, variant: "success" }), n.error = (o, a) => t.addToast(o, { ...a, variant: "error" }), n.warning = (o, a) => t.addToast(o, { ...a, variant: "warning" }), n.info = (o, a) => t.addToast(o, { ...a, variant: "info" }), n.loading = (o, a) => t.addToast(o, {
+      ...a,
       variant: "loading",
-      duration: i?.duration ?? 0,
-      dismissible: i?.dismissible ?? !1
-    }), o.custom = (t, i) => e.addToast(t, { ...i, variant: "default", isCustom: !0 }), o.dismiss = (t) => e.dismissToast(t), o.remove = (t) => e.removeToast(t), o.promise = async (t, i, u) => {
-      const l = e.addToast(i.loading, {
-        ...u,
+      duration: a?.duration ?? 0,
+      dismissible: a?.dismissible ?? !1
+    }), n.custom = (o, a) => t.addToast(o, { ...a, variant: "default", isCustom: !0 }), n.dismiss = (o) => t.dismissToast(o), n.remove = (o) => t.removeToast(o), n.dismissGroup = (o) => t.dismissGroup(o), n.removeGroup = (o) => t.removeGroup(o), n.pauseAll = () => t.pauseAll(), n.resumeAll = () => t.resumeAll(), n.history = () => t.history(), n.promise = async (o, a, p) => {
+      const m = t.addToast(a.loading, {
+        ...p,
         variant: "loading",
         duration: 0,
         dismissible: !1
-      }), g = typeof t == "function" ? t() : t;
+      });
+      if (a.progress)
+        try {
+          a.progress((f) => {
+            t.updateToast(m, { progress: Math.max(0, Math.min(1, f)) });
+          });
+        } catch {
+        }
+      const E = typeof o == "function" ? o() : o;
       try {
-        const d = await g, a = typeof i.success == "function" ? i.success(d) : i.success;
-        return e.updateToast(l, {
-          message: a,
+        const f = await E, y = typeof a.success == "function" ? a.success(f) : a.success;
+        return t.updateToast(m, {
+          message: y,
           variant: "success",
-          duration: u?.duration ?? e.config.duration,
-          dismissible: !0
-        }), d;
-      } catch (d) {
-        const a = typeof i.error == "function" ? i.error(d) : i.error;
-        throw e.updateToast(l, {
-          message: a,
+          duration: p?.duration ?? t.config.duration,
+          dismissible: !0,
+          progress: void 0
+        }), f;
+      } catch (f) {
+        const y = typeof a.error == "function" ? a.error(f) : a.error;
+        throw t.updateToast(m, {
+          message: y,
           variant: "error",
-          duration: u?.duration ?? e.config.duration,
-          dismissible: !0
-        }), d;
+          duration: p?.duration ?? t.config.duration,
+          dismissible: !0,
+          progress: void 0
+        }), f;
       }
-    }, o;
+    }, n.confirm = (o, a) => new Promise((p) => {
+      const m = rt();
+      let E = !1;
+      const f = (y) => {
+        E || (E = !0, p(y));
+      };
+      t.addToast(o, {
+        id: m,
+        variant: a?.variant ?? "warning",
+        title: a?.title,
+        position: a?.position,
+        duration: 0,
+        // never auto-dismiss
+        dismissible: !0,
+        action: {
+          label: a?.confirmLabel ?? "Confirm",
+          onClick: (y) => {
+            f(!0), y();
+          },
+          dismissOnClick: !1,
+          className: "toast23-action--confirm"
+        },
+        cancelAction: {
+          label: a?.cancelLabel ?? "Cancel",
+          onClick: (y) => {
+            f(!1), y();
+          },
+          dismissOnClick: !1
+        },
+        // If user closes via X button or anything else, treat as cancel.
+        onDismiss: () => f(!1)
+      });
+    }), n;
   }, [
-    e.addToast,
-    e.updateToast,
-    e.dismissToast,
-    e.removeToast,
-    e.config.duration
+    t.addToast,
+    t.updateToast,
+    t.dismissToast,
+    t.removeToast,
+    t.dismissGroup,
+    t.removeGroup,
+    t.pauseAll,
+    t.resumeAll,
+    t.history,
+    t.config.duration
   ]);
 }
-let k = null;
-function J() {
-  const e = G();
-  return T.useEffect(() => {
-    k && (k(e), k = null);
-  }, [e]), null;
+function ee() {
+  const t = nt(tt);
+  if (!t)
+    throw new Error(
+      "[toast-23] useToast23Headless() must be used inside a <Toast23Provider>."
+    );
+  const { headlessStore: n } = t;
+  return {
+    toasts: ft(
+      n.subscribe,
+      n.getSnapshot,
+      n.getSnapshot
+    ),
+    dismiss: t.dismissToast,
+    remove: t.removeToast,
+    dismissGroup: t.dismissGroup,
+    removeGroup: t.removeGroup,
+    pauseAll: t.pauseAll,
+    resumeAll: t.resumeAll,
+    history: t.history,
+    isPausedGlobally: t.isPausedGlobally
+  };
 }
-function Y(e = {}) {
-  const { position: o = "top-right", maxVisible: t = 5, duration: i = 5e3 } = e, u = document.createElement("div");
-  u.setAttribute("data-toast23-standalone", ""), u.style.display = "contents", document.body.appendChild(u);
-  let l = _(u);
-  const g = new Promise((n) => {
-    k = n;
-  }), d = [];
-  let a = null;
-  g.then((n) => {
-    a = n;
-    for (const r of d)
-      r.method === "__call__" ? n(...r.args) : n[r.method](...r.args);
-    d.length = 0;
-  }), l.render(
-    T.createElement(
-      A,
-      { position: o, maxVisible: t, duration: i },
-      T.createElement(J)
+function Vt(t) {
+  return function() {
+    const o = Xt();
+    return Z.useEffect(() => {
+      t(o);
+    }, [o]), null;
+  };
+}
+function oe(t = {}) {
+  const {
+    position: n = "top-right",
+    maxVisible: o = 5,
+    duration: a = 5e3,
+    layout: p = "default",
+    dir: m = "ltr",
+    historySize: E,
+    sound: f,
+    fallbackToNotification: y,
+    swipeEnabled: B,
+    swipeThreshold: G
+  } = t;
+  bt();
+  const k = document.createElement("div");
+  k.setAttribute("data-toast23-standalone", ""), k.style.display = "contents", document.body.appendChild(k);
+  let R = At(k), b = null;
+  const T = [];
+  let C;
+  const M = new Promise((s) => {
+    C = s;
+  }), v = Vt((s) => {
+    for (b = s, C(s); T.length > 0; ) {
+      const c = T.shift();
+      try {
+        c.method === "__call__" ? s(...c.args) : s[c.method](...c.args);
+      } catch {
+      }
+    }
+  });
+  R.render(
+    Z.createElement(
+      vt,
+      {
+        position: n,
+        maxVisible: o,
+        duration: a,
+        layout: p,
+        dir: m,
+        ...E !== void 0 && { historySize: E },
+        ...f !== void 0 && { sound: f },
+        ...y !== void 0 && { fallbackToNotification: y },
+        ...B !== void 0 && { swipeEnabled: B },
+        ...G !== void 0 && { swipeThreshold: G }
+      },
+      Z.createElement(v)
     )
   );
-  const m = (n, ...r) => a ? a[n](...r) : (d.push({ method: n, args: r }), "queued"), f = ((n, r) => a ? a(n, r) : (d.push({ method: "__call__", args: [n, r] }), "queued"));
-  return f.success = (n, r) => m("success", n, r), f.error = (n, r) => m("error", n, r), f.warning = (n, r) => m("warning", n, r), f.info = (n, r) => m("info", n, r), f.loading = (n, r) => m("loading", n, r), f.custom = (n, r) => m("custom", n, r), f.dismiss = (n) => m("dismiss", n), f.remove = (n) => m("remove", n), f.promise = (n, r, c) => a ? a.promise(n, r, c) : g.then((p) => p.promise(n, r, c)), f.destroy = () => {
-    l && (l.unmount(), l = null), u.remove(), a = null;
-  }, f;
+  const h = (s, ...c) => {
+    if (b) return b[s](...c);
+    T.push({ method: s, args: c });
+  }, S = (s, c, A) => {
+    if (b) return b[s](c, A);
+    const I = A?.id ?? rt();
+    return T.push({ method: s, args: [c, { ...A, id: I }] }), I;
+  }, u = ((s, c) => {
+    if (b) return b(s, c);
+    const A = c?.id ?? rt();
+    return T.push({ method: "__call__", args: [s, { ...c, id: A }] }), A;
+  });
+  return u.success = (s, c) => S("success", s, c), u.error = (s, c) => S("error", s, c), u.warning = (s, c) => S("warning", s, c), u.info = (s, c) => S("info", s, c), u.loading = (s, c) => S("loading", s, c), u.custom = (s, c) => S("custom", s, c), u.dismiss = (s) => h("dismiss", s), u.remove = (s) => h("remove", s), u.dismissGroup = (s) => h("dismissGroup", s), u.removeGroup = (s) => h("removeGroup", s), u.pauseAll = () => h("pauseAll"), u.resumeAll = () => h("resumeAll"), u.history = () => b ? b.history() : [], u.promise = (s, c, A) => b ? b.promise(s, c, A) : M.then((I) => I.promise(s, c, A)), u.confirm = (s, c) => b ? b.confirm(s, c) : M.then((A) => A.confirm(s, c)), u.destroy = () => {
+    T.length = 0, R && (R.unmount(), R = null), k.remove(), b = null;
+  }, u;
 }
 export {
-  A as Toast23Provider,
-  Y as createToast23,
-  G as useToast
+  Ut as Toast23DevTools,
+  vt as Toast23Provider,
+  oe as createToast23,
+  Xt as useToast,
+  ee as useToast23Headless
 };
 //# sourceMappingURL=index.mjs.map