next-recomponents 2.0.24 → 2.0.26

package/dist/index.d.mts

@@ -72,6 +72,7 @@ interface TableProps {
     editableFields?: string[];
     onSelect?: (data: GridValidRowModel[]) => void;
     onSave?: (data: GridValidRowModel[]) => void;
+    onCloseModal?: (data: GridValidRowModel | undefined) => boolean;
     buttons?: Record<string, any>;
     exportName?: string;
     modal?: React$1.ReactNode;

package/dist/index.d.ts

@@ -72,6 +72,7 @@ interface TableProps {
     editableFields?: string[];
     onSelect?: (data: GridValidRowModel[]) => void;
     onSave?: (data: GridValidRowModel[]) => void;
+    onCloseModal?: (data: GridValidRowModel | undefined) => boolean;
     buttons?: Record<string, any>;
     exportName?: string;
     modal?: React$1.ReactNode;

package/dist/index.js

@@ -3725,10 +3725,9 @@ function Container({
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
         "div",
         {
-          style: {
-            width: typeof window !== "undefined" && (window == null ? void 0 : window.innerWidth) < 768 ? isSidebarOpen ? "100%" : 0 : isSidebarOpen ? 250 : 60
-          },
-          className: "bg-blue-500 text-white overflow-y-auto fixed md:static top-0 left-0 h-full z-50 md:z-auto transition-all duration-300 ease-in-out",
+          className: `bg-blue-500 text-white overflow-y-auto fixed md:static top-0 left-0 h-full z-50 md:z-auto transition-all duration-300 ease-in-out
+    ${isSidebarOpen ? "w-full md:w-[250px]" : "w-0 md:w-[60px]"}
+  `,
           children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "p-4 ", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("ul", { className: "space-y-3", children: [
             /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
               "li",
@@ -35774,12 +35773,12 @@ function CustomFooter({
   }) });
 }
 function ModalDialog({ open, onClose, modal, selectedRow }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_material.Dialog, { open, onClose, maxWidth: "xl", fullWidth: true, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_material.Dialog, { open, maxWidth: "xl", fullWidth: true, children: [
     /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "flex justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
       "button",
       {
         onClick: onClose,
-        className: "text-gray-500 hover:text-gray-800 text-xl font-bold p-5",
+        className: " font-bold p-1 m-5 w-[30px] h-[30px] flex items-center justify-center hover:animate-pulse border shadow rounded bg-red-500 text-white",
         children: "\xD7"
       }
     ) }),
@@ -35868,10 +35867,12 @@ function useColumns(rows, currentCoin, options, colSize) {
         editable: (_b = editableFields == null ? void 0 : editableFields.includes(key)) != null ? _b : false,
         type: typeof rows[0][key] === "number" ? "number" : "string",
         renderCell: (buttons == null ? void 0 : buttons[key]) ? (params) => {
-          var _a2, _b2;
+          var _a2, _b2, _c;
+          const children = ((_a2 = buttons == null ? void 0 : buttons[key]) == null ? void 0 : _a2.type) == "input" ? null : (_b2 = params == null ? void 0 : params.row) == null ? void 0 : _b2[key];
           return import_react4.default.cloneElement(buttons[key], {
-            className: `${(_a2 = params == null ? void 0 : params.className) != null ? _a2 : ""} m-auto text-xs`,
-            children: (_b2 = params == null ? void 0 : params.row) == null ? void 0 : _b2[key],
+            className: `${(_c = params == null ? void 0 : params.className) != null ? _c : ""} m-auto text-xs`,
+            children,
+            row: params == null ? void 0 : params.row,
             onClick: async (e) => {
               var _a3, _b3;
               e.row = params == null ? void 0 : params.row;
@@ -35915,6 +35916,7 @@ function IHTable({
   editableFields,
   onSave,
   onSelect,
+  onCloseModal,
   buttons,
   exportName,
   modal,
@@ -35947,6 +35949,8 @@ function IHTable({
     setOpen(true);
   };
   const handleClose = () => {
+    const pass = onCloseModal ? onCloseModal == null ? void 0 : onCloseModal(modalRow) : true;
+    if (!pass) return;
     setOpen(false);
     setModalRow(void 0);
   };

package/dist/index.mjs

@@ -3700,10 +3700,9 @@ function Container({
       /* @__PURE__ */ jsx3(
         "div",
         {
-          style: {
-            width: typeof window !== "undefined" && (window == null ? void 0 : window.innerWidth) < 768 ? isSidebarOpen ? "100%" : 0 : isSidebarOpen ? 250 : 60
-          },
-          className: "bg-blue-500 text-white overflow-y-auto fixed md:static top-0 left-0 h-full z-50 md:z-auto transition-all duration-300 ease-in-out",
+          className: `bg-blue-500 text-white overflow-y-auto fixed md:static top-0 left-0 h-full z-50 md:z-auto transition-all duration-300 ease-in-out
+    ${isSidebarOpen ? "w-full md:w-[250px]" : "w-0 md:w-[60px]"}
+  `,
           children: /* @__PURE__ */ jsx3("div", { className: "p-4 ", children: /* @__PURE__ */ jsxs2("ul", { className: "space-y-3", children: [
             /* @__PURE__ */ jsxs2(
               "li",
@@ -35754,12 +35753,12 @@ function CustomFooter({
   }) });
 }
 function ModalDialog({ open, onClose, modal, selectedRow }) {
-  return /* @__PURE__ */ jsxs5(Dialog, { open, onClose, maxWidth: "xl", fullWidth: true, children: [
+  return /* @__PURE__ */ jsxs5(Dialog, { open, maxWidth: "xl", fullWidth: true, children: [
     /* @__PURE__ */ jsx6("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx6(
       "button",
       {
         onClick: onClose,
-        className: "text-gray-500 hover:text-gray-800 text-xl font-bold p-5",
+        className: " font-bold p-1 m-5 w-[30px] h-[30px] flex items-center justify-center hover:animate-pulse border shadow rounded bg-red-500 text-white",
         children: "\xD7"
       }
     ) }),
@@ -35848,10 +35847,12 @@ function useColumns(rows, currentCoin, options, colSize) {
         editable: (_b = editableFields == null ? void 0 : editableFields.includes(key)) != null ? _b : false,
         type: typeof rows[0][key] === "number" ? "number" : "string",
         renderCell: (buttons == null ? void 0 : buttons[key]) ? (params) => {
-          var _a2, _b2;
+          var _a2, _b2, _c;
+          const children = ((_a2 = buttons == null ? void 0 : buttons[key]) == null ? void 0 : _a2.type) == "input" ? null : (_b2 = params == null ? void 0 : params.row) == null ? void 0 : _b2[key];
           return React3.cloneElement(buttons[key], {
-            className: `${(_a2 = params == null ? void 0 : params.className) != null ? _a2 : ""} m-auto text-xs`,
-            children: (_b2 = params == null ? void 0 : params.row) == null ? void 0 : _b2[key],
+            className: `${(_c = params == null ? void 0 : params.className) != null ? _c : ""} m-auto text-xs`,
+            children,
+            row: params == null ? void 0 : params.row,
             onClick: async (e) => {
               var _a3, _b3;
               e.row = params == null ? void 0 : params.row;
@@ -35895,6 +35896,7 @@ function IHTable({
   editableFields,
   onSave,
   onSelect,
+  onCloseModal,
   buttons,
   exportName,
   modal,
@@ -35927,6 +35929,8 @@ function IHTable({
     setOpen(true);
   };
   const handleClose = () => {
+    const pass = onCloseModal ? onCloseModal == null ? void 0 : onCloseModal(modalRow) : true;
+    if (!pass) return;
     setOpen(false);
     setModalRow(void 0);
   };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "next-recomponents",
-  "version": "2.0.24",
+  "version": "2.0.26",
   "description": "description nueva",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/container/index.tsx

@@ -87,17 +87,9 @@ export default function Container({
       <div className="flex flex-1 overflow-hidden relative">
         {/* Sidebar como drawer en mobile */}
         <div
-          style={{
-            width:
-              typeof window !== "undefined" && window?.innerWidth < 768
-                ? isSidebarOpen
-                  ? "100%"
-                  : 0
-                : isSidebarOpen
-                  ? 250
-                  : 60,
-          }}
-          className="bg-blue-500 text-white overflow-y-auto fixed md:static top-0 left-0 h-full z-50 md:z-auto transition-all duration-300 ease-in-out"
+          className={`bg-blue-500 text-white overflow-y-auto fixed md:static top-0 left-0 h-full z-50 md:z-auto transition-all duration-300 ease-in-out
+    ${isSidebarOpen ? "w-full md:w-[250px]" : "w-0 md:w-[60px]"}
+  `}
         >
           <div className="p-4 ">
             {

package/src/table/index.tsx

@@ -28,6 +28,7 @@ interface TableProps {
   editableFields?: string[];
   onSelect?: (data: GridValidRowModel[]) => void;
   onSave?: (data: GridValidRowModel[]) => void;
+  onCloseModal?: (data: GridValidRowModel | undefined) => boolean;
   buttons?: Record<string, any>;
   exportName?: string;
   modal?: React.ReactNode;
@@ -167,11 +168,11 @@ interface ModalDialogProps {
 
 function ModalDialog({ open, onClose, modal, selectedRow }: ModalDialogProps) {
   return (
-    <Dialog open={open} onClose={onClose} maxWidth="xl" fullWidth>
+    <Dialog open={open} maxWidth="xl" fullWidth>
       <div className="flex justify-end">
         <button
           onClick={onClose}
-          className="text-gray-500 hover:text-gray-800 text-xl font-bold p-5"
+          className=" font-bold p-1 m-5 w-[30px] h-[30px] flex items-center justify-center hover:animate-pulse border shadow rounded bg-red-500 text-white"
         >
           &times;
         </button>
@@ -317,10 +318,14 @@ function useColumns(
         editable: editableFields?.includes(key) ?? false,
         type: typeof rows[0][key] === "number" ? "number" : "string",
         renderCell: buttons?.[key]
-          ? (params: any) =>
-              React.cloneElement(buttons[key], {
+          ? (params: any) => {
+              const children =
+                buttons?.[key]?.type == "input" ? null : params?.row?.[key];
+
+              return React.cloneElement(buttons[key], {
                 className: `${params?.className ?? ""} m-auto text-xs`,
-                children: params?.row?.[key],
+                children,
+                row: params?.row,
                 onClick: async (e: TableButtonProps) => {
                   e.row = params?.row;
                   if (buttons[key]?.props?.onClick) {
@@ -329,7 +334,8 @@ function useColumns(
                     if (newVal) handleRowUpdate({ ...e.row, newVal });
                   }
                 },
-              })
+              });
+            }
           : null,
       }));
 
@@ -366,6 +372,7 @@ function IHTable({
   editableFields,
   onSave,
   onSelect,
+  onCloseModal,
   buttons,
   exportName,
   modal,
@@ -402,6 +409,9 @@ function IHTable({
     setOpen(true);
   };
   const handleClose = () => {
+    const pass = onCloseModal ? onCloseModal?.(modalRow) : true;
+
+    if (!pass) return;
     setOpen(false);
     setModalRow(undefined);
   };