next-recomponents 2.0.31 → 2.0.33

package/dist/index.d.mts

@@ -232,12 +232,12 @@ type PopupColor = "white" | "primary" | "secondary" | "info" | "danger" | "warni
 
 declare function usePopup(): {
     alert: (message: string, color?: PopupColor) => Promise<void>;
-    confirm: (message: string, color?: PopupColor) => Promise<boolean>;
-    prompt: (message: string, color?: PopupColor) => Promise<string | null>;
+    confirm: typeof confirm;
+    prompt: typeof prompt;
     modal: (message: ReactNode, color?: PopupColor, icons?: boolean, full?: boolean) => Promise<void>;
-    PopupComponent: react_jsx_runtime.JSX.Element | null;
     close: (confirmed: boolean, value?: string) => void;
     updateMessage: (message: ReactNode) => void;
+    PopupComponent: () => react_jsx_runtime.JSX.Element | null;
 };
 
 export { Alert, Button, Container, DocumentViewer, Form, Input, Modal, MyCalendar, Pre, Select, Table, Table3, type TableButtonProps, type TableButtonProps as TableEventProps, TextArea, regularExpresions, useDates, useExcel, useFormValues, usePopup, useResources };

package/dist/index.d.ts

@@ -232,12 +232,12 @@ type PopupColor = "white" | "primary" | "secondary" | "info" | "danger" | "warni
 
 declare function usePopup(): {
     alert: (message: string, color?: PopupColor) => Promise<void>;
-    confirm: (message: string, color?: PopupColor) => Promise<boolean>;
-    prompt: (message: string, color?: PopupColor) => Promise<string | null>;
+    confirm: typeof confirm;
+    prompt: typeof prompt;
     modal: (message: ReactNode, color?: PopupColor, icons?: boolean, full?: boolean) => Promise<void>;
-    PopupComponent: react_jsx_runtime.JSX.Element | null;
     close: (confirmed: boolean, value?: string) => void;
     updateMessage: (message: ReactNode) => void;
+    PopupComponent: () => react_jsx_runtime.JSX.Element | null;
 };
 
 export { Alert, Button, Container, DocumentViewer, Form, Input, Modal, MyCalendar, Pre, Select, Table, Table3, type TableButtonProps, type TableButtonProps as TableEventProps, TextArea, regularExpresions, useDates, useExcel, useFormValues, usePopup, useResources };

package/dist/index.js

@@ -35882,6 +35882,7 @@ function ModalDialog({
     /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "mt-4 m-auto p-5", children: selectedRow && import_react5.default.cloneElement(
       modal,
       {
+        key: selectedRow.id,
         row: selectedRow,
         hide: onClose
       }
@@ -36957,7 +36958,7 @@ var import_react10 = require("react");
 var import_jsx_runtime12 = require("react/jsx-runtime");
 function PopupActions({
   type,
-  confirm,
+  confirm: confirm2,
   focusRing,
   onConfirm,
   onCancel
@@ -36976,7 +36977,7 @@ function PopupActions({
       "button",
       {
         onClick: onConfirm,
-        className: `px-5 py-2 rounded-lg text-sm font-semibold text-white ${confirm} transition focus:outline-none focus:ring-2 ${focusRing}`,
+        className: `px-5 py-2 rounded-lg text-sm font-semibold text-white ${confirm2} transition focus:outline-none focus:ring-2 ${focusRing}`,
         children: "Aceptar"
       }
     )
@@ -37192,16 +37193,18 @@ var INITIAL_STATE = {
   inputValue: "",
   color: "primary",
   icons: true,
-  full: false
+  full: false,
+  message: null
 };
 function usePopup() {
   const [popup, setPopup] = (0, import_react10.useState)(INITIAL_STATE);
-  const messageRef = (0, import_react10.useRef)(null);
   const open = (0, import_react10.useCallback)(
     (partial) => {
-      const { message, ...rest } = partial;
-      messageRef.current = message;
-      setPopup({ ...rest, visible: true, inputValue: "" });
+      setPopup({
+        ...partial,
+        visible: true,
+        inputValue: ""
+      });
     },
     []
   );
@@ -37210,9 +37213,19 @@ function usePopup() {
       var _a, _b;
       if (confirmed) (_a = prev.onConfirm) == null ? void 0 : _a.call(prev, value);
       else (_b = prev.onCancel) == null ? void 0 : _b.call(prev);
-      return { ...prev, visible: false, inputValue: "" };
+      return {
+        ...prev,
+        visible: false,
+        inputValue: ""
+      };
     });
   }, []);
+  const updateMessage = (0, import_react10.useCallback)((message) => {
+    setPopup((prev) => ({
+      ...prev,
+      message
+    }));
+  }, []);
   const alert2 = (0, import_react10.useCallback)(
     (message, color = "primary") => new Promise(
       (resolve) => open({
@@ -37220,7 +37233,9 @@ function usePopup() {
         message,
         color,
         onConfirm: () => resolve(),
-        onCancel: () => resolve()
+        onCancel: () => resolve(),
+        icons: true,
+        full: false
       })
     ),
     [open]
@@ -37231,58 +37246,36 @@ function usePopup() {
         type: "modal",
         message,
         color,
-        onConfirm: () => resolve(),
-        onCancel: () => resolve(),
         icons,
-        full
-      })
-    ),
-    [open]
-  );
-  const confirm = (0, import_react10.useCallback)(
-    (message, color = "primary") => new Promise(
-      (resolve) => open({
-        type: "confirm",
-        message,
-        color,
-        onConfirm: () => resolve(true),
-        onCancel: () => resolve(false)
-      })
-    ),
-    [open]
-  );
-  const prompt = (0, import_react10.useCallback)(
-    (message, color = "primary") => new Promise(
-      (resolve) => open({
-        type: "prompt",
-        message,
-        color,
-        onConfirm: (value) => resolve(value != null ? value : ""),
-        onCancel: () => resolve(null)
+        full,
+        onConfirm: () => resolve(),
+        onCancel: () => resolve()
       })
     ),
     [open]
   );
-  const updateMessage = (0, import_react10.useCallback)((message) => {
-    messageRef.current = message;
-    setPopup((prev) => ({ ...prev }));
-  }, []);
-  const PopupComponent = popup.visible ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-    PopupOverlay,
-    {
-      popup: { ...popup, message: messageRef.current },
-      onClose: close,
-      onInputChange: (v) => setPopup((prev) => ({ ...prev, inputValue: v }))
-    }
-  ) : null;
+  const PopupComponent = () => {
+    if (!popup.visible) return null;
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+      PopupOverlay,
+      {
+        popup,
+        onClose: close,
+        onInputChange: (v) => setPopup((prev) => ({
+          ...prev,
+          inputValue: v
+        }))
+      }
+    );
+  };
   return {
     alert: alert2,
     confirm,
     prompt,
     modal,
-    PopupComponent,
     close,
-    updateMessage
+    updateMessage,
+    PopupComponent
   };
 }
 
@@ -37296,20 +37289,25 @@ function Modal({
 }) {
   const pop = usePopup();
   const hide = () => pop.close(false);
-  const childrenWithHide = (0, import_react11.cloneElement)(children, { hide });
-  (0, import_react11.useEffect)(() => {
-    pop.updateMessage(childrenWithHide);
+  const content = (0, import_react11.useMemo)(() => {
+    return (0, import_react11.cloneElement)(children, {
+      hide,
+      key: crypto.randomUUID()
+    });
   }, [children]);
+  (0, import_react11.useEffect)(() => {
+    pop.updateMessage(content);
+  }, [content]);
   const props = button == null ? void 0 : button.props;
-  const onClick = props == null ? void 0 : props.onClick;
+  const originalOnClick = props == null ? void 0 : props.onClick;
   return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
     (0, import_react11.cloneElement)(button, {
-      onClick: (e) => {
-        onClick == null ? void 0 : onClick(e);
-        pop.modal(childrenWithHide, color, false, true);
+      onClick: async (e) => {
+        originalOnClick == null ? void 0 : originalOnClick(e);
+        await pop.modal(content, color, false, true);
       }
     }),
-    pop.PopupComponent
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(pop.PopupComponent, {})
   ] });
 }