@deepnoid/ui 0.1.221 → 0.1.223

package/dist/components/toast/use-toast.js

@@ -2151,6 +2151,39 @@ var template = {
       }
     );
   },
+  "new-window": ({ className }) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "svg",
+      {
+        width: "24",
+        height: "24",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        className,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "path",
+            {
+              d: "M18 14V18.75C18 19.3467 17.7629 19.919 17.341 20.341C16.919 20.763 16.3467 21 15.75 21H5.25C4.65326 21 4.08097 20.763 3.65901 20.341C3.23705 19.919 3 19.3467 3 18.75V8.25C3 7.65327 3.23705 7.08097 3.65901 6.65901C4.08097 6.23706 4.65326 6 5.25 6H10",
+              stroke: "currentColor",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "path",
+            {
+              d: "M13.5 4.5H19.5V10.5M19.5 4.5L9.75 14.25",
+              stroke: "currentColor",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            }
+          )
+        ]
+      }
+    );
+  },
   // ----------------------------------- old ---------------------------------
   // ** Status **
   "plus-circle": ({ className, fill }) => {
@@ -5335,7 +5368,7 @@ var Toast = (0, import_react.forwardRef)((originalProps, ref) => {
       style: hasShadow ? { boxShadow: "0px 6px 18px rgba(0, 0, 0, 0.10)" } : {},
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: slots.wrapper({ class: classNames == null ? void 0 : classNames.wrapper }), children: [
-          showIcon && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon_default, { name: originalProps.icon || "info-circle", fill: true, className: "mt-[2px]" }),
+          showIcon && (originalProps.isLoading ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon_default, { name: "loading", className: "mt-[2px] animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon_default, { name: originalProps.icon || "info-circle", fill: true, className: "mt-[2px]" })),
           /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: slots.title({ class: classNames == null ? void 0 : classNames.title }), children: title }),
           showCloseButton && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon_default, { name: "close", className: "cursor-pointer", onClick: onClose })
         ] }),
@@ -5460,27 +5493,119 @@ var ToastProvider = ({
   const [toasts, setToasts] = (0, import_react2.useState)([]);
   const [containerStyle, setContainerStyle] = (0, import_react2.useState)({});
   const toastRef = (0, import_react2.useRef)(null);
+  const timersRef = (0, import_react2.useRef)(/* @__PURE__ */ new Map());
+  const startTimer = (0, import_react2.useCallback)((id, duration) => {
+    const existing = timersRef.current.get(id);
+    if (existing) clearTimeout(existing);
+    if (!isFinite(duration) || duration <= 0) {
+      timersRef.current.delete(id);
+      return;
+    }
+    const timer = setTimeout(() => {
+      setToasts((prev) => prev.filter((t) => t.id !== id));
+      timersRef.current.delete(id);
+    }, duration);
+    timersRef.current.set(id, timer);
+  }, []);
+  const clearTimer = (0, import_react2.useCallback)((id) => {
+    const timer = timersRef.current.get(id);
+    if (timer) {
+      clearTimeout(timer);
+      timersRef.current.delete(id);
+    }
+  }, []);
+  (0, import_react2.useEffect)(() => {
+    const timers = timersRef.current;
+    return () => {
+      timers.forEach((timer) => clearTimeout(timer));
+      timers.clear();
+    };
+  }, []);
   const addToast = (0, import_react2.useCallback)(
     (title, options = {}) => {
+      var _a, _b;
       const id = Date.now() + Math.floor(Math.random() * 1e5);
+      const duration = options.isLoading ? Infinity : (_b = (_a = options.duration) != null ? _a : globalOptions == null ? void 0 : globalOptions.duration) != null ? _b : 3e3;
       const newToast = {
+        ...globalOptions,
+        ...options,
         id,
         title,
-        duration: 3e3,
-        ...globalOptions,
-        ...options
+        duration
       };
       setToasts((prev) => [...prev, newToast]);
-      setTimeout(() => {
-        setToasts((prevToasts) => prevToasts.filter((toast2) => toast2.id !== id));
-      }, newToast.duration || 3e3);
+      startTimer(id, duration);
+      return id;
     },
-    [globalOptions]
+    [globalOptions, startTimer]
   );
-  const removeToast = (0, import_react2.useCallback)((id) => {
-    setToasts((prevToasts) => prevToasts.filter((toast2) => toast2.id !== id));
-  }, []);
-  const contextValue = addToast;
+  const removeToast = (0, import_react2.useCallback)(
+    (id) => {
+      clearTimer(id);
+      setToasts((prevToasts) => prevToasts.filter((toast2) => toast2.id !== id));
+    },
+    [clearTimer]
+  );
+  const updateToast = (0, import_react2.useCallback)(
+    (id, options) => {
+      setToasts(
+        (prev) => prev.map((t) => {
+          var _a, _b;
+          if (t.id !== id) return t;
+          const updated = { ...t, ...options };
+          if (t.isLoading && options.isLoading === false) {
+            const duration = (_b = (_a = options.duration) != null ? _a : globalOptions == null ? void 0 : globalOptions.duration) != null ? _b : 3e3;
+            updated.duration = duration;
+            startTimer(id, duration);
+          }
+          return updated;
+        })
+      );
+    },
+    [globalOptions == null ? void 0 : globalOptions.duration, startTimer]
+  );
+  const dismissToast = (0, import_react2.useCallback)(
+    (id) => {
+      if (id !== void 0) {
+        removeToast(id);
+      } else {
+        timersRef.current.forEach((timer) => clearTimeout(timer));
+        timersRef.current.clear();
+        setToasts([]);
+      }
+    },
+    [removeToast]
+  );
+  const loadingToast = (0, import_react2.useCallback)(
+    (title, options = {}) => {
+      return addToast(title, { ...options, isLoading: true });
+    },
+    [addToast]
+  );
+  const contextValue = (0, import_react2.useMemo)(() => {
+    const fn = (title, options) => {
+      return addToast(title, options);
+    };
+    fn.loading = loadingToast;
+    fn.update = updateToast;
+    fn.dismiss = dismissToast;
+    fn.promise = (promise, messages, options = {}) => {
+      const id = loadingToast(messages.loading, options);
+      return promise.then(
+        (data) => {
+          const title = typeof messages.success === "function" ? messages.success(data) : messages.success;
+          updateToast(id, { title, color: "success", isLoading: false });
+          return data;
+        },
+        (err) => {
+          const title = typeof messages.error === "function" ? messages.error(err) : messages.error;
+          updateToast(id, { title, color: "danger", isLoading: false });
+          throw err;
+        }
+      );
+    };
+    return fn;
+  }, [addToast, loadingToast, updateToast, dismissToast]);
   (0, import_react2.useEffect)(() => {
     var _a;
     const width = (globalOptions == null ? void 0 : globalOptions.width) ? globalOptions.width : typeof ((_a = toastRef.current) == null ? void 0 : _a.getWidth) === "function" ? toastRef.current.getWidth() : 300;

package/dist/components/toast/use-toast.mjs

@@ -2,12 +2,12 @@
 import {
   ToastProvider,
   useToast
-} from "../../chunk-5UCNLY2A.mjs";
+} from "../../chunk-RY5VVXQ4.mjs";
 import "../../chunk-ZOTHPHXA.mjs";
-import "../../chunk-3HANNN76.mjs";
+import "../../chunk-2URJGQFC.mjs";
 import "../../chunk-ZYIIXWVY.mjs";
-import "../../chunk-AXWICOKO.mjs";
-import "../../chunk-JYW3GEH6.mjs";
+import "../../chunk-6AID2NLT.mjs";
+import "../../chunk-P5L4YI54.mjs";
 import "../../chunk-27Y6K5NK.mjs";
 import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-U4DJHAM5.mjs";

package/dist/components/tree/index.js

@@ -2093,6 +2093,39 @@ var template = {
       }
     );
   },
+  "new-window": ({ className }) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "svg",
+      {
+        width: "24",
+        height: "24",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        className,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "path",
+            {
+              d: "M18 14V18.75C18 19.3467 17.7629 19.919 17.341 20.341C16.919 20.763 16.3467 21 15.75 21H5.25C4.65326 21 4.08097 20.763 3.65901 20.341C3.23705 19.919 3 19.3467 3 18.75V8.25C3 7.65327 3.23705 7.08097 3.65901 6.65901C4.08097 6.23706 4.65326 6 5.25 6H10",
+              stroke: "currentColor",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "path",
+            {
+              d: "M13.5 4.5H19.5V10.5M19.5 4.5L9.75 14.25",
+              stroke: "currentColor",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            }
+          )
+        ]
+      }
+    );
+  },
   // ----------------------------------- old ---------------------------------
   // ** Status **
   "plus-circle": ({ className, fill }) => {

package/dist/components/tree/index.mjs

@@ -2,10 +2,10 @@
 import "../../chunk-MBLZYQCN.mjs";
 import {
   tree_default
-} from "../../chunk-G4G6YXZH.mjs";
+} from "../../chunk-GDHLN463.mjs";
 import "../../chunk-ZYIIXWVY.mjs";
-import "../../chunk-AXWICOKO.mjs";
-import "../../chunk-JYW3GEH6.mjs";
+import "../../chunk-6AID2NLT.mjs";
+import "../../chunk-P5L4YI54.mjs";
 import "../../chunk-27Y6K5NK.mjs";
 import "../../chunk-U4DJHAM5.mjs";
 import "../../chunk-AC6TWLRT.mjs";

package/dist/components/tree/tree.js

@@ -2093,6 +2093,39 @@ var template = {
       }
     );
   },
+  "new-window": ({ className }) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+      "svg",
+      {
+        width: "24",
+        height: "24",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        className,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "path",
+            {
+              d: "M18 14V18.75C18 19.3467 17.7629 19.919 17.341 20.341C16.919 20.763 16.3467 21 15.75 21H5.25C4.65326 21 4.08097 20.763 3.65901 20.341C3.23705 19.919 3 19.3467 3 18.75V8.25C3 7.65327 3.23705 7.08097 3.65901 6.65901C4.08097 6.23706 4.65326 6 5.25 6H10",
+              stroke: "currentColor",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "path",
+            {
+              d: "M13.5 4.5H19.5V10.5M19.5 4.5L9.75 14.25",
+              stroke: "currentColor",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            }
+          )
+        ]
+      }
+    );
+  },
   // ----------------------------------- old ---------------------------------
   // ** Status **
   "plus-circle": ({ className, fill }) => {

package/dist/components/tree/tree.mjs

@@ -3,10 +3,10 @@ import {
   Tree,
   TreeNodeItem,
   tree_default
-} from "../../chunk-G4G6YXZH.mjs";
+} from "../../chunk-GDHLN463.mjs";
 import "../../chunk-ZYIIXWVY.mjs";
-import "../../chunk-AXWICOKO.mjs";
-import "../../chunk-JYW3GEH6.mjs";
+import "../../chunk-6AID2NLT.mjs";
+import "../../chunk-P5L4YI54.mjs";
 import "../../chunk-27Y6K5NK.mjs";
 import "../../chunk-U4DJHAM5.mjs";
 import "../../chunk-AC6TWLRT.mjs";

package/dist/index.d.mts

@@ -27,7 +27,7 @@ export { default as Drawer } from './components/drawer/drawer.mjs';
 export { default as List } from './components/list/list.mjs';
 export { default as ListItem, ListItemProps } from './components/list/listItem.mjs';
 export { default as Toast } from './components/toast/toast.mjs';
-export { ToastProvider, useToast } from './components/toast/use-toast.mjs';
+export { CreateToastOptions, ToastFunction, ToastId, ToastPromiseMessages, ToastProvider, useToast } from './components/toast/use-toast.mjs';
 export { default as Day } from './components/picker/day.mjs';
 export { default as DatePicker, DatePickerProps, DateRangeValue, DateValue } from './components/picker/datePicker.mjs';
 export { default as TimePicker, TimePickerProps } from './components/picker/timePicker/index.mjs';

package/dist/index.d.ts

@@ -27,7 +27,7 @@ export { default as Drawer } from './components/drawer/drawer.js';
 export { default as List } from './components/list/list.js';
 export { default as ListItem, ListItemProps } from './components/list/listItem.js';
 export { default as Toast } from './components/toast/toast.js';
-export { ToastProvider, useToast } from './components/toast/use-toast.js';
+export { CreateToastOptions, ToastFunction, ToastId, ToastPromiseMessages, ToastProvider, useToast } from './components/toast/use-toast.js';
 export { default as Day } from './components/picker/day.js';
 export { default as DatePicker, DatePickerProps, DateRangeValue, DateValue } from './components/picker/datePicker.js';
 export { default as TimePicker, TimePickerProps } from './components/picker/timePicker/index.js';

package/dist/index.js

@@ -2796,6 +2796,39 @@ var template = {
       }
     );
   },
+  "new-window": ({ className }) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+      "svg",
+      {
+        width: "24",
+        height: "24",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        className,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+            "path",
+            {
+              d: "M18 14V18.75C18 19.3467 17.7629 19.919 17.341 20.341C16.919 20.763 16.3467 21 15.75 21H5.25C4.65326 21 4.08097 20.763 3.65901 20.341C3.23705 19.919 3 19.3467 3 18.75V8.25C3 7.65327 3.23705 7.08097 3.65901 6.65901C4.08097 6.23706 4.65326 6 5.25 6H10",
+              stroke: "currentColor",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+            "path",
+            {
+              d: "M13.5 4.5H19.5V10.5M19.5 4.5L9.75 14.25",
+              stroke: "currentColor",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            }
+          )
+        ]
+      }
+    );
+  },
   // ----------------------------------- old ---------------------------------
   // ** Status **
   "plus-circle": ({ className, fill }) => {
@@ -11240,7 +11273,7 @@ var Toast = (0, import_react33.forwardRef)((originalProps, ref) => {
       style: hasShadow ? { boxShadow: "0px 6px 18px rgba(0, 0, 0, 0.10)" } : {},
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: slots.wrapper({ class: classNames == null ? void 0 : classNames.wrapper }), children: [
-          showIcon && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Icon_default, { name: originalProps.icon || "info-circle", fill: true, className: "mt-[2px]" }),
+          showIcon && (originalProps.isLoading ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Icon_default, { name: "loading", className: "mt-[2px] animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Icon_default, { name: originalProps.icon || "info-circle", fill: true, className: "mt-[2px]" })),
           /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: slots.title({ class: classNames == null ? void 0 : classNames.title }), children: title }),
           showCloseButton && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Icon_default, { name: "close", className: "cursor-pointer", onClick: onClose })
         ] }),
@@ -11404,27 +11437,119 @@ var ToastProvider = ({
   const [toasts, setToasts] = (0, import_react34.useState)([]);
   const [containerStyle, setContainerStyle] = (0, import_react34.useState)({});
   const toastRef = (0, import_react34.useRef)(null);
+  const timersRef = (0, import_react34.useRef)(/* @__PURE__ */ new Map());
+  const startTimer = (0, import_react34.useCallback)((id, duration) => {
+    const existing = timersRef.current.get(id);
+    if (existing) clearTimeout(existing);
+    if (!isFinite(duration) || duration <= 0) {
+      timersRef.current.delete(id);
+      return;
+    }
+    const timer = setTimeout(() => {
+      setToasts((prev) => prev.filter((t) => t.id !== id));
+      timersRef.current.delete(id);
+    }, duration);
+    timersRef.current.set(id, timer);
+  }, []);
+  const clearTimer = (0, import_react34.useCallback)((id) => {
+    const timer = timersRef.current.get(id);
+    if (timer) {
+      clearTimeout(timer);
+      timersRef.current.delete(id);
+    }
+  }, []);
+  (0, import_react34.useEffect)(() => {
+    const timers = timersRef.current;
+    return () => {
+      timers.forEach((timer) => clearTimeout(timer));
+      timers.clear();
+    };
+  }, []);
   const addToast = (0, import_react34.useCallback)(
     (title, options = {}) => {
+      var _a, _b;
       const id = Date.now() + Math.floor(Math.random() * 1e5);
+      const duration = options.isLoading ? Infinity : (_b = (_a = options.duration) != null ? _a : globalOptions == null ? void 0 : globalOptions.duration) != null ? _b : 3e3;
       const newToast = {
+        ...globalOptions,
+        ...options,
         id,
         title,
-        duration: 3e3,
-        ...globalOptions,
-        ...options
+        duration
       };
       setToasts((prev) => [...prev, newToast]);
-      setTimeout(() => {
-        setToasts((prevToasts) => prevToasts.filter((toast2) => toast2.id !== id));
-      }, newToast.duration || 3e3);
+      startTimer(id, duration);
+      return id;
     },
-    [globalOptions]
+    [globalOptions, startTimer]
   );
-  const removeToast = (0, import_react34.useCallback)((id) => {
-    setToasts((prevToasts) => prevToasts.filter((toast2) => toast2.id !== id));
-  }, []);
-  const contextValue = addToast;
+  const removeToast = (0, import_react34.useCallback)(
+    (id) => {
+      clearTimer(id);
+      setToasts((prevToasts) => prevToasts.filter((toast2) => toast2.id !== id));
+    },
+    [clearTimer]
+  );
+  const updateToast = (0, import_react34.useCallback)(
+    (id, options) => {
+      setToasts(
+        (prev) => prev.map((t) => {
+          var _a, _b;
+          if (t.id !== id) return t;
+          const updated = { ...t, ...options };
+          if (t.isLoading && options.isLoading === false) {
+            const duration = (_b = (_a = options.duration) != null ? _a : globalOptions == null ? void 0 : globalOptions.duration) != null ? _b : 3e3;
+            updated.duration = duration;
+            startTimer(id, duration);
+          }
+          return updated;
+        })
+      );
+    },
+    [globalOptions == null ? void 0 : globalOptions.duration, startTimer]
+  );
+  const dismissToast = (0, import_react34.useCallback)(
+    (id) => {
+      if (id !== void 0) {
+        removeToast(id);
+      } else {
+        timersRef.current.forEach((timer) => clearTimeout(timer));
+        timersRef.current.clear();
+        setToasts([]);
+      }
+    },
+    [removeToast]
+  );
+  const loadingToast = (0, import_react34.useCallback)(
+    (title, options = {}) => {
+      return addToast(title, { ...options, isLoading: true });
+    },
+    [addToast]
+  );
+  const contextValue = (0, import_react34.useMemo)(() => {
+    const fn = (title, options) => {
+      return addToast(title, options);
+    };
+    fn.loading = loadingToast;
+    fn.update = updateToast;
+    fn.dismiss = dismissToast;
+    fn.promise = (promise, messages, options = {}) => {
+      const id = loadingToast(messages.loading, options);
+      return promise.then(
+        (data) => {
+          const title = typeof messages.success === "function" ? messages.success(data) : messages.success;
+          updateToast(id, { title, color: "success", isLoading: false });
+          return data;
+        },
+        (err) => {
+          const title = typeof messages.error === "function" ? messages.error(err) : messages.error;
+          updateToast(id, { title, color: "danger", isLoading: false });
+          throw err;
+        }
+      );
+    };
+    return fn;
+  }, [addToast, loadingToast, updateToast, dismissToast]);
   (0, import_react34.useEffect)(() => {
     var _a;
     const width = (globalOptions == null ? void 0 : globalOptions.width) ? globalOptions.width : typeof ((_a = toastRef.current) == null ? void 0 : _a.getWidth) === "function" ? toastRef.current.getWidth() : 300;