next-recomponents 1.4.6 → 1.4.7

package/dist/index.d.mts

@@ -69,7 +69,10 @@ interface TableProps extends React.DetailedHTMLProps<React.TableHTMLAttributes<H
     exportName?: string;
     onSave?: (e: {
         data: Record<string, any>;
-    }) => void;
+    }) => void | Promise<(e: {
+        data: Record<string, any>;
+    }) => void>;
+    loader: React.ReactNode;
 }
 declare function Table({ ...props }: TableProps): react_jsx_runtime.JSX.Element;
 

package/dist/index.d.ts

@@ -69,7 +69,10 @@ interface TableProps extends React.DetailedHTMLProps<React.TableHTMLAttributes<H
     exportName?: string;
     onSave?: (e: {
         data: Record<string, any>;
-    }) => void;
+    }) => void | Promise<(e: {
+        data: Record<string, any>;
+    }) => void>;
+    loader: React.ReactNode;
 }
 declare function Table({ ...props }: TableProps): react_jsx_runtime.JSX.Element;
 

package/dist/index.js

@@ -31940,15 +31940,18 @@ function HTable(_a) {
     symbols,
     totals,
     exportName,
-    onSave
+    onSave,
+    loader = "Loading..."
   } = _b, props = __objRest(_b, [
     "data",
     "symbols",
     "totals",
     "exportName",
-    "onSave"
+    "onSave",
+    "loader"
   ]);
   if (!Array.isArray(data)) return null;
+  const [isLoading, setIsLoading] = (0, import_react25.useState)(false);
   const [mapedData, setMapedData] = (0, import_react25.useState)([...data]);
   const exported = useExportdata();
   const [selected, setSelected] = (0, import_react25.useState)(null);
@@ -31971,9 +31974,6 @@ function HTable(_a) {
       return acc;
     }, {});
   }, [mapedData]);
-  (0, import_react25.useEffect)(() => {
-    setMapedData(data);
-  }, [data]);
   (0, import_react25.useEffect)(() => {
     const newData = data.map((d, trkey) => {
       var _a2, _b2;
@@ -32016,9 +32016,11 @@ function HTable(_a) {
         "button",
         {
           className: "p-2 border rounded shadow bg-blue-800 text-white flex gap-1",
-          onClick: (e) => {
-            onSave({ data: values });
-          },
+          onClick: (e) => __async(null, null, function* () {
+            setIsLoading(true);
+            yield onSave({ data: values });
+            setIsLoading(false);
+          }),
           children: [
             /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SaveIcon, {}),
             " Guardar"
@@ -32133,7 +32135,8 @@ function HTable(_a) {
           fkey
         );
       }) }) })
-    ] }))
+    ] })),
+    isLoading && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "fixed top-0 left-0 w-full h-screen flex items-center justify-center bg-white bg-opacity-50", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { children: loader }) })
   ] });
 }
 
@@ -32387,7 +32390,7 @@ function useResources({
           }
         }),
         create: (data) => __async(null, null, function* () {
-          var _a, _b, _c2;
+          var _a, _b, _c2, _d2, _e2, _f2;
           const options = {
             method: "POST",
             url: `${baseURI}/${key}`,
@@ -32404,17 +32407,34 @@ function useResources({
             const d = consulta.data;
             newInfo[key].state = "success";
             newInfo[key].errorMessage = "";
-            newInfo[key].selectedItem = d;
-            const index = (_b = (_a = newInfo[key]) == null ? void 0 : _a.data) == null ? void 0 : _b.findIndex(
-              (d2) => (d2 == null ? void 0 : d2.id) == (d2 == null ? void 0 : d2.id)
-            );
-            if (index >= 0) {
-              newInfo[key].data[index] = d;
+            if (Array.isArray(data)) {
+              for (let datum of data) {
+                const index = (_b = (_a = newInfo[key]) == null ? void 0 : _a.data) == null ? void 0 : _b.findIndex(
+                  (d2) => (d2 == null ? void 0 : d2.id) == (datum == null ? void 0 : datum.id)
+                );
+                if (index >= 0) {
+                  newInfo[key].data[index] = d;
+                } else {
+                  if ((_c2 = newInfo[key]) == null ? void 0 : _c2.data) {
+                    newInfo[key].data.unshift(d);
+                  } else {
+                    newInfo[key].data = [d];
+                  }
+                }
+              }
             } else {
-              if ((_c2 = newInfo[key]) == null ? void 0 : _c2.data) {
-                newInfo[key].data.unshift(d);
+              newInfo[key].selectedItem = d;
+              const index = (_e2 = (_d2 = newInfo[key]) == null ? void 0 : _d2.data) == null ? void 0 : _e2.findIndex(
+                (d2) => (d2 == null ? void 0 : d2.id) == (d2 == null ? void 0 : d2.id)
+              );
+              if (index >= 0) {
+                newInfo[key].data[index] = d;
               } else {
-                newInfo[key].data = [d];
+                if ((_f2 = newInfo[key]) == null ? void 0 : _f2.data) {
+                  newInfo[key].data.unshift(d);
+                } else {
+                  newInfo[key].data = [d];
+                }
               }
             }
             setInfo(__spreadValues({}, newInfo));
@@ -32779,13 +32799,14 @@ function Modal({ button, children, ref }) {
   return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
     import_react30.default.Children.map(button, (child) => {
       if (import_react30.default.isValidElement(child)) {
-        return import_react30.default.cloneElement(child, {
+        const { type, props } = child;
+        return import_react30.default.createElement(type, __spreadProps(__spreadValues({}, props), {
           onClick: (e) => {
             var _a, _b;
             show();
             (_b = (_a = child.props) == null ? void 0 : _a.onClick) == null ? void 0 : _b.call(_a, e);
           }
-        });
+        }));
       }
       return child;
     }),
@@ -32800,7 +32821,8 @@ function Modal({ button, children, ref }) {
       ),
       /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex flex-col gap-3 pt-6", children: import_react30.default.Children.map(children, (child) => {
         if (import_react30.default.isValidElement(child)) {
-          return import_react30.default.cloneElement(child, { hide });
+          const { type, props } = child;
+          return import_react30.default.createElement(type, __spreadProps(__spreadValues({}, props), { hide }));
         }
         return child;
       }) })

package/dist/index.mjs

@@ -31928,15 +31928,18 @@ function HTable(_a) {
     symbols,
     totals,
     exportName,
-    onSave
+    onSave,
+    loader = "Loading..."
   } = _b, props = __objRest(_b, [
     "data",
     "symbols",
     "totals",
     "exportName",
-    "onSave"
+    "onSave",
+    "loader"
   ]);
   if (!Array.isArray(data)) return null;
+  const [isLoading, setIsLoading] = useState6(false);
   const [mapedData, setMapedData] = useState6([...data]);
   const exported = useExportdata();
   const [selected, setSelected] = useState6(null);
@@ -31959,9 +31962,6 @@ function HTable(_a) {
       return acc;
     }, {});
   }, [mapedData]);
-  useEffect7(() => {
-    setMapedData(data);
-  }, [data]);
   useEffect7(() => {
     const newData = data.map((d, trkey) => {
       var _a2, _b2;
@@ -32004,9 +32004,11 @@ function HTable(_a) {
         "button",
         {
           className: "p-2 border rounded shadow bg-blue-800 text-white flex gap-1",
-          onClick: (e) => {
-            onSave({ data: values });
-          },
+          onClick: (e) => __async(null, null, function* () {
+            setIsLoading(true);
+            yield onSave({ data: values });
+            setIsLoading(false);
+          }),
           children: [
             /* @__PURE__ */ jsx11(SaveIcon, {}),
             " Guardar"
@@ -32121,7 +32123,8 @@ function HTable(_a) {
           fkey
         );
       }) }) })
-    ] }))
+    ] })),
+    isLoading && /* @__PURE__ */ jsx11("div", { className: "fixed top-0 left-0 w-full h-screen flex items-center justify-center bg-white bg-opacity-50", children: /* @__PURE__ */ jsx11("div", { children: loader }) })
   ] });
 }
 
@@ -32377,7 +32380,7 @@ function useResources({
           }
         }),
         create: (data) => __async(null, null, function* () {
-          var _a, _b, _c2;
+          var _a, _b, _c2, _d2, _e2, _f2;
           const options = {
             method: "POST",
             url: `${baseURI}/${key}`,
@@ -32394,17 +32397,34 @@ function useResources({
             const d = consulta.data;
             newInfo[key].state = "success";
             newInfo[key].errorMessage = "";
-            newInfo[key].selectedItem = d;
-            const index = (_b = (_a = newInfo[key]) == null ? void 0 : _a.data) == null ? void 0 : _b.findIndex(
-              (d2) => (d2 == null ? void 0 : d2.id) == (d2 == null ? void 0 : d2.id)
-            );
-            if (index >= 0) {
-              newInfo[key].data[index] = d;
+            if (Array.isArray(data)) {
+              for (let datum of data) {
+                const index = (_b = (_a = newInfo[key]) == null ? void 0 : _a.data) == null ? void 0 : _b.findIndex(
+                  (d2) => (d2 == null ? void 0 : d2.id) == (datum == null ? void 0 : datum.id)
+                );
+                if (index >= 0) {
+                  newInfo[key].data[index] = d;
+                } else {
+                  if ((_c2 = newInfo[key]) == null ? void 0 : _c2.data) {
+                    newInfo[key].data.unshift(d);
+                  } else {
+                    newInfo[key].data = [d];
+                  }
+                }
+              }
             } else {
-              if ((_c2 = newInfo[key]) == null ? void 0 : _c2.data) {
-                newInfo[key].data.unshift(d);
+              newInfo[key].selectedItem = d;
+              const index = (_e2 = (_d2 = newInfo[key]) == null ? void 0 : _d2.data) == null ? void 0 : _e2.findIndex(
+                (d2) => (d2 == null ? void 0 : d2.id) == (d2 == null ? void 0 : d2.id)
+              );
+              if (index >= 0) {
+                newInfo[key].data[index] = d;
               } else {
-                newInfo[key].data = [d];
+                if ((_f2 = newInfo[key]) == null ? void 0 : _f2.data) {
+                  newInfo[key].data.unshift(d);
+                } else {
+                  newInfo[key].data = [d];
+                }
               }
             }
             setInfo(__spreadValues({}, newInfo));
@@ -32773,13 +32793,14 @@ function Modal({ button, children, ref }) {
   return /* @__PURE__ */ jsxs12(Fragment5, { children: [
     React7.Children.map(button, (child) => {
       if (React7.isValidElement(child)) {
-        return React7.cloneElement(child, {
+        const { type, props } = child;
+        return React7.createElement(type, __spreadProps(__spreadValues({}, props), {
           onClick: (e) => {
             var _a, _b;
             show();
             (_b = (_a = child.props) == null ? void 0 : _a.onClick) == null ? void 0 : _b.call(_a, e);
           }
-        });
+        }));
       }
       return child;
     }),
@@ -32794,7 +32815,8 @@ function Modal({ button, children, ref }) {
       ),
       /* @__PURE__ */ jsx17("div", { className: "flex flex-col gap-3 pt-6", children: React7.Children.map(children, (child) => {
         if (React7.isValidElement(child)) {
-          return React7.cloneElement(child, { hide });
+          const { type, props } = child;
+          return React7.createElement(type, __spreadProps(__spreadValues({}, props), { hide }));
         }
         return child;
       }) })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "next-recomponents",
-  "version": "1.4.6",
+  "version": "1.4.7",
   "description": "",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -17,6 +17,7 @@
     "typescript": "^5.8.3"
   },
   "dependencies": {
+    "@emotion/is-prop-valid": "^1.3.1",
     "axios": "^1.9.0",
     "moment": "^2.30.1",
     "react": "^19.1.0",

package/src/modal/index.tsx

@@ -21,8 +21,10 @@ export default function Modal({ button, children, ref }: Props) {
     <>
       {React.Children.map(button, (child) => {
         if (React.isValidElement(child)) {
-          return React.cloneElement(child, {
-            onClick: (e) => {
+          const { type, props } = child;
+          return React.createElement(type, {
+            ...props,
+            onClick: (e: any) => {
               show();
               child.props?.onClick?.(e);
             },
@@ -42,7 +44,8 @@ export default function Modal({ button, children, ref }: Props) {
           <div className="flex flex-col gap-3 pt-6">
             {React.Children.map(children, (child) => {
               if (React.isValidElement(child)) {
-                return React.cloneElement(child, { hide });
+                const { type, props } = child;
+                return React.createElement(type, { ...props, hide });
               }
               return child;
             })}

package/src/table/h.tsx

@@ -11,9 +11,12 @@ export default function HTable({
   totals,
   exportName,
   onSave,
+  loader = "Loading...",
   ...props
 }: TableProps) {
   if (!Array.isArray(data)) return null;
+
+  const [isLoading, setIsLoading] = useState(false);
   const [mapedData, setMapedData] = useState([...data]);
   const exported = useExportdata();
   const [selected, setSelected] = useState<number | null>(null);
@@ -37,10 +40,6 @@ export default function HTable({
     }, {});
   }, [mapedData]);
 
-  useEffect(() => {
-    setMapedData(data);
-  }, [data]);
-
   useEffect(() => {
     const newData = data.map((d: any, trkey: number) => {
       const obj: any = {};
@@ -92,8 +91,10 @@ export default function HTable({
         {onSave && (
           <button
             className="p-2 border rounded shadow bg-blue-800 text-white flex gap-1"
-            onClick={(e) => {
-              onSave({ data: values });
+            onClick={async (e) => {
+              setIsLoading(true);
+              await onSave({ data: values });
+              setIsLoading(false);
             }}
           >
             <SaveIcon /> Guardar
@@ -215,6 +216,11 @@ export default function HTable({
           </tfoot>
         )}
       </table>
+      {isLoading && (
+        <div className="fixed top-0 left-0 w-full h-screen flex items-center justify-center bg-white bg-opacity-50">
+          <div>{loader}</div>
+        </div>
+      )}
     </>
   );
 }

package/src/table/index.tsx

@@ -14,7 +14,10 @@ export interface TableProps
   totals?: Array<string>;
   symbols?: Record<string, ReactNode>;
   exportName?: string;
-  onSave?: (e: { data: Record<string, any> }) => void;
+  onSave?: (e: {
+    data: Record<string, any>;
+  }) => void | Promise<(e: { data: Record<string, any> }) => void>;
+  loader: React.ReactNode;
 }
 
 export default function Table({ ...props }: TableProps) {

package/src/use-resources/index.ts

@@ -116,7 +116,7 @@ export default function useResources<T extends Record<string, ItemsRecord>>({
             return error;
           }
         },
-        create: async (data: any) => {
+        create: async (data: Record<string, any> | Record<string, any>[]) => {
           const options = {
             method: "POST",
             url: `${baseURI}/${key}`,
@@ -135,17 +135,34 @@ export default function useResources<T extends Record<string, ItemsRecord>>({
             const d = consulta.data;
             newInfo[key].state = "success";
             newInfo[key].errorMessage = "";
-            newInfo[key].selectedItem = d;
-            const index = newInfo[key]?.data?.findIndex(
-              (d: any) => d?.id == d?.id
-            );
-            if (index >= 0) {
-              newInfo[key].data[index] = d;
+            if (Array.isArray(data)) {
+              for (let datum of data) {
+                const index = newInfo[key]?.data?.findIndex(
+                  (d: any) => d?.id == datum?.id
+                );
+                if (index >= 0) {
+                  newInfo[key].data[index] = d;
+                } else {
+                  if (newInfo[key]?.data) {
+                    newInfo[key].data.unshift(d);
+                  } else {
+                    newInfo[key].data = [d];
+                  }
+                }
+              }
             } else {
-              if (newInfo[key]?.data) {
-                newInfo[key].data.unshift(d);
+              newInfo[key].selectedItem = d;
+              const index = newInfo[key]?.data?.findIndex(
+                (d: any) => d?.id == d?.id
+              );
+              if (index >= 0) {
+                newInfo[key].data[index] = d;
               } else {
-                newInfo[key].data = [d];
+                if (newInfo[key]?.data) {
+                  newInfo[key].data.unshift(d);
+                } else {
+                  newInfo[key].data = [d];
+                }
               }
             }
             setInfo({ ...newInfo });