@particle-academy/react-fancy 5.11.0 → 5.12.0

package/dist/index.cjs

@@ -9180,7 +9180,8 @@ var VARIANT_ICON_COLORS = {
   info: "text-blue-500"
 };
 function ToastItem({ data, onDismiss }) {
-  const { id, title, description, variant = "default", duration = 5e3 } = data;
+  const { id, title, description, variant = "default", action } = data;
+  const duration = data.duration ?? (action ? 0 : 5e3);
   react.useEffect(() => {
     if (duration <= 0) return;
     const timer = setTimeout(() => onDismiss(id), duration);
@@ -9191,6 +9192,9 @@ function ToastItem({ data, onDismiss }) {
     {
       "data-react-fancy-toast-item": "",
       role: "alert",
+      onKeyDown: (e) => {
+        if (e.key === "Escape") onDismiss(id);
+      },
       className: cn(
         "fancy-toast-in pointer-events-auto w-80 rounded-xl border p-4 shadow-lg",
         VARIANT_STYLES[variant]
@@ -9206,6 +9210,18 @@ function ToastItem({ data, onDismiss }) {
           /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium text-zinc-900 dark:text-zinc-100", children: title }),
           description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-xs text-zinc-500 dark:text-zinc-400", children: description })
         ] }),
+        action && /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => {
+              action.onClick();
+              onDismiss(id);
+            },
+            className: "shrink-0 self-center rounded-md px-2 py-1 text-xs font-medium text-zinc-700 underline-offset-2 transition-colors hover:bg-zinc-100 hover:underline dark:text-zinc-200 dark:hover:bg-zinc-800",
+            children: action.label
+          }
+        ),
         /* @__PURE__ */ jsxRuntime.jsx(
           "button",
           {