next-recomponents 2.0.42 → 2.0.44

package/dist/index.js

@@ -37185,13 +37185,16 @@ function usePopup() {
   );
   const close = (0, import_react10.useCallback)(
     async (confirmed, value) => {
-      var _a, _b;
+      var _a, _b, _c;
       const prev = { ...popup };
       let visible = false;
       if (confirmed) {
         (_a = prev.onConfirm) == null ? void 0 : _a.call(prev, value);
-      } else if (prev == null ? void 0 : prev.onCancel) {
-        visible = !Boolean(await ((_b = prev.onCancel) == null ? void 0 : _b.call(prev)));
+      } else if (prev == null ? void 0 : prev.onClose) {
+        visible = !Boolean(await ((_b = prev.onClose) == null ? void 0 : _b.call(prev)));
+      } else {
+        (_c = prev.onCancel) == null ? void 0 : _c.call(prev);
+        visible = false;
       }
       const data = { ...prev, visible, inputValue: "" };
       setPopup(data);
@@ -37216,12 +37219,11 @@ function usePopup() {
         type: "modal",
         message,
         color,
-        // onConfirm: () => {
-        //   resolve();
-        // },
-        onCancel: async () => {
+        onConfirm: () => resolve(),
+        onCancel: () => resolve(),
+        onClose: onClose ? async () => {
           return await (onClose == null ? void 0 : onClose());
-        },
+        } : void 0,
         icons,
         full
       })
@@ -39019,6 +39021,30 @@ var regularExpresions2 = {
 };
 var types_default = regularExpresions2;
 
+// src/table-advanced/formatter.ts
+function valueFormatter({
+  value,
+  currentCoin = ""
+}) {
+  if (value == null || value === "") return "";
+  const isDate = /(\d{4}-\d{2}-\d{2})(T[\d:,.+-]*(Z)?)?/;
+  if (`${value}`.match(isDate)) {
+    return value.toString().split("T")[0].split("-").reverse().join("/");
+  }
+  const splited = `${value}`.split(".");
+  const hasDecimals = splited.length == 2 && splited.every((v) => `${v}`.match(types_default.number));
+  if (hasDecimals) {
+    return [
+      currentCoin,
+      (+`${value}`).toLocaleString("en-US", {
+        minimumFractionDigits: 2,
+        maximumFractionDigits: 2
+      })
+    ].join(" ");
+  }
+  return value;
+}
+
 // src/table-advanced/h.table.tsx
 var import_jsx_runtime36 = require("react/jsx-runtime");
 function HTable({
@@ -39067,7 +39093,10 @@ function HTable({
     );
     const gridTemplateColumns2 = headers2.filter((h) => {
       var _a, _b;
-      return !((_b = (_a = context == null ? void 0 : context.hideColumns) == null ? void 0 : _a.includes) == null ? void 0 : _b.call(_a, h));
+      if (["__modal__", "__select__"].includes(h)) {
+        return true;
+      }
+      return !((_b = (_a = context == null ? void 0 : context.hideColumns) == null ? void 0 : _a.includes) == null ? void 0 : _b.call(_a, h)) && !h.startsWith("_");
     }).map((h) => {
       var _a;
       return `${(_a = widths2[h]) != null ? _a : defaultWidth}px`;
@@ -39078,28 +39107,27 @@ function HTable({
   (0, import_react19.useEffect)(() => {
     if (!tableRef.current) return;
     const observer = new ResizeObserver(([entry]) => {
-      const sizeados = headers.filter(
-        (h) => [
-          "__select__",
-          "__modal__"
-          // ...(context?.hideColumns || []),
-          // ...(context?.colSize ? Object.keys(context.colSize) : []),
-        ].includes(h)
+      const ocultos = headers.filter(
+        (h) => {
+          var _a, _b;
+          return !h.startsWith("__") && (h.startsWith("_") || ((_b = (_a = context == null ? void 0 : context.hideColumns) == null ? void 0 : _a.includes) == null ? void 0 : _b.call(_a, h)));
+        }
       );
+      const sizeados = headers.filter((h) => h.startsWith("__"));
       const personalizados = (context == null ? void 0 : context.colSize) ? Object.values(context.colSize) : [];
       const personalizadosSum = personalizados.length > 0 ? personalizados.reduce((acc, i) => acc + i, 0) : 0;
       const ancho = +entry.contentRect.width;
       const sizeadosLength = sizeados.length;
       const sizeadosWidth = sizeadosLength * 60;
-      const w = (ancho - sizeadosWidth - personalizadosSum) / (headers.length - sizeadosLength - personalizados.length);
+      const w = (ancho - sizeadosWidth - personalizadosSum) / (headers.length - sizeadosLength - personalizados.length - ocultos.length);
       console.log({
         w,
         ancho,
         sizeadosWidth,
-        sizeadosLength,
         personalizadosSum,
-        headers: headers.length,
-        personalizados: personalizados.length
+        headers,
+        sizeadosLength,
+        personalizados
       });
       setWidths(
         Object.fromEntries(
@@ -39137,8 +39165,13 @@ function HTable({
               onClick: (e) => {
                 context.excel.export(
                   context.data.map((d) => {
-                    const { __select__, __modal__, ...datums } = d;
-                    return datums;
+                    const obj = {};
+                    for (let key in d) {
+                      if (!key.startsWith("_")) {
+                        obj[key] = d[key];
+                      }
+                    }
+                    return obj;
                   })
                 );
               },
@@ -39188,6 +39221,7 @@ function HTable({
           headers.map((header, i) => {
             var _a, _b;
             if ((_b = (_a = context == null ? void 0 : context.hideColumns) == null ? void 0 : _a.includes) == null ? void 0 : _b.call(_a, header)) return null;
+            if (header.startsWith("_") && !header.startsWith("__")) return null;
             return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
               "div",
               {
@@ -39230,6 +39264,7 @@ function HTable({
             return items.map(([key, item], i) => {
               var _a, _b, _c, _d, _e, _f, _g;
               if ((_b = (_a = context == null ? void 0 : context.hideColumns) == null ? void 0 : _a.includes) == null ? void 0 : _b.call(_a, key)) return null;
+              if (key.startsWith("_") && !key.startsWith("__")) return null;
               if (key == "__modal__") {
                 return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
                   "div",
@@ -39322,7 +39357,10 @@ function HTable({
                     children: ((_e = (_d = context.buttons[key]) == null ? void 0 : _d.props) == null ? void 0 : _e.children) ? item : null,
                     onClick: async (e) => {
                       var _a2, _b2;
-                      const ret = await ((_b2 = (_a2 = context.buttons[key].props) == null ? void 0 : _a2.onClick) == null ? void 0 : _b2.call(_a2, e)) || {};
+                      const ret = await ((_b2 = (_a2 = context.buttons[key].props) == null ? void 0 : _a2.onClick) == null ? void 0 : _b2.call(_a2, {
+                        e,
+                        row
+                      })) || {};
                       const newData = [...context.data];
                       const index = newData.findIndex((f) => f.id == (row == null ? void 0 : row.id));
                       newData[index] = { ...newData[index], ...ret };
@@ -39331,7 +39369,10 @@ function HTable({
                     onChange: async (e) => {
                       var _a2, _b2, _c2;
                       const value = e.target.value;
-                      const ret = await ((_b2 = (_a2 = context.buttons[key].props) == null ? void 0 : _a2.onChange) == null ? void 0 : _b2.call(_a2, e)) || {};
+                      const ret = await ((_b2 = (_a2 = context.buttons[key].props) == null ? void 0 : _a2.onChange) == null ? void 0 : _b2.call(_a2, {
+                        e,
+                        row
+                      })) || {};
                       const newData = [...context.data];
                       const index = newData.findIndex((f) => f.id == (row == null ? void 0 : row.id));
                       if (index >= 0) {
@@ -39349,7 +39390,7 @@ function HTable({
                   }) : ["number", "string"].includes(typeof item) ? valueFormatter({
                     value: item,
                     currentCoin: context.currentCoin
-                  }) : JSON.stringify(item)
+                  }) : import_react19.default.isValidElement(item) ? item : JSON.stringify(item)
                 },
                 row.id + i
               );
@@ -39381,8 +39422,14 @@ function HTable({
             color: "white",
             onClose: async () => {
               var _a;
-              const c = await ((_a = context == null ? void 0 : context.onCloseModal) == null ? void 0 : _a.call(context, searchedData[currentIndex]));
-              return c;
+              if (context == null ? void 0 : context.onCloseModal) {
+                const c = await ((_a = context == null ? void 0 : context.onCloseModal) == null ? void 0 : _a.call(
+                  context,
+                  searchedData[currentIndex]
+                ));
+                return c;
+              }
+              return true;
             },
             children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "relative", children: [
               /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "fixed top-0 left-0 p-10 ", children: [
@@ -39425,28 +39472,6 @@ function HTable({
     }
   );
 }
-function valueFormatter({
-  value,
-  currentCoin = ""
-}) {
-  if (value == null || value === "") return "";
-  const isDate = /(\d{4}-\d{2}-\d{2})(T[\d:,.+-]*(Z)?)?/;
-  if (`${value}`.match(isDate)) {
-    return value.toString().split("T")[0].split("-").reverse().join("/");
-  }
-  const splited = `${value}`.split(".");
-  const hasDecimals = splited.length == 2 && splited.every((v) => `${v}`.match(types_default.number));
-  if (hasDecimals) {
-    return [
-      currentCoin,
-      (+`${value}`).toLocaleString("en-US", {
-        minimumFractionDigits: 2,
-        maximumFractionDigits: 2
-      })
-    ].join(" ");
-  }
-  return value;
-}
 
 // src/table-advanced/context.ts
 var import_react20 = require("react");

package/dist/index.mjs

@@ -37170,13 +37170,16 @@ function usePopup() {
   );
   const close = useCallback(
     async (confirmed, value) => {
-      var _a, _b;
+      var _a, _b, _c;
       const prev = { ...popup };
       let visible = false;
       if (confirmed) {
         (_a = prev.onConfirm) == null ? void 0 : _a.call(prev, value);
-      } else if (prev == null ? void 0 : prev.onCancel) {
-        visible = !Boolean(await ((_b = prev.onCancel) == null ? void 0 : _b.call(prev)));
+      } else if (prev == null ? void 0 : prev.onClose) {
+        visible = !Boolean(await ((_b = prev.onClose) == null ? void 0 : _b.call(prev)));
+      } else {
+        (_c = prev.onCancel) == null ? void 0 : _c.call(prev);
+        visible = false;
       }
       const data = { ...prev, visible, inputValue: "" };
       setPopup(data);
@@ -37201,12 +37204,11 @@ function usePopup() {
         type: "modal",
         message,
         color,
-        // onConfirm: () => {
-        //   resolve();
-        // },
-        onCancel: async () => {
+        onConfirm: () => resolve(),
+        onCancel: () => resolve(),
+        onClose: onClose ? async () => {
           return await (onClose == null ? void 0 : onClose());
-        },
+        } : void 0,
         icons,
         full
       })
@@ -39017,6 +39019,30 @@ var regularExpresions2 = {
 };
 var types_default = regularExpresions2;
 
+// src/table-advanced/formatter.ts
+function valueFormatter({
+  value,
+  currentCoin = ""
+}) {
+  if (value == null || value === "") return "";
+  const isDate = /(\d{4}-\d{2}-\d{2})(T[\d:,.+-]*(Z)?)?/;
+  if (`${value}`.match(isDate)) {
+    return value.toString().split("T")[0].split("-").reverse().join("/");
+  }
+  const splited = `${value}`.split(".");
+  const hasDecimals = splited.length == 2 && splited.every((v) => `${v}`.match(types_default.number));
+  if (hasDecimals) {
+    return [
+      currentCoin,
+      (+`${value}`).toLocaleString("en-US", {
+        minimumFractionDigits: 2,
+        maximumFractionDigits: 2
+      })
+    ].join(" ");
+  }
+  return value;
+}
+
 // src/table-advanced/h.table.tsx
 import { jsx as jsx33, jsxs as jsxs25 } from "react/jsx-runtime";
 function HTable({
@@ -39065,7 +39091,10 @@ function HTable({
     );
     const gridTemplateColumns2 = headers2.filter((h) => {
       var _a, _b;
-      return !((_b = (_a = context == null ? void 0 : context.hideColumns) == null ? void 0 : _a.includes) == null ? void 0 : _b.call(_a, h));
+      if (["__modal__", "__select__"].includes(h)) {
+        return true;
+      }
+      return !((_b = (_a = context == null ? void 0 : context.hideColumns) == null ? void 0 : _a.includes) == null ? void 0 : _b.call(_a, h)) && !h.startsWith("_");
     }).map((h) => {
       var _a;
       return `${(_a = widths2[h]) != null ? _a : defaultWidth}px`;
@@ -39076,28 +39105,27 @@ function HTable({
   useEffect11(() => {
     if (!tableRef.current) return;
     const observer = new ResizeObserver(([entry]) => {
-      const sizeados = headers.filter(
-        (h) => [
-          "__select__",
-          "__modal__"
-          // ...(context?.hideColumns || []),
-          // ...(context?.colSize ? Object.keys(context.colSize) : []),
-        ].includes(h)
+      const ocultos = headers.filter(
+        (h) => {
+          var _a, _b;
+          return !h.startsWith("__") && (h.startsWith("_") || ((_b = (_a = context == null ? void 0 : context.hideColumns) == null ? void 0 : _a.includes) == null ? void 0 : _b.call(_a, h)));
+        }
       );
+      const sizeados = headers.filter((h) => h.startsWith("__"));
       const personalizados = (context == null ? void 0 : context.colSize) ? Object.values(context.colSize) : [];
       const personalizadosSum = personalizados.length > 0 ? personalizados.reduce((acc, i) => acc + i, 0) : 0;
       const ancho = +entry.contentRect.width;
       const sizeadosLength = sizeados.length;
       const sizeadosWidth = sizeadosLength * 60;
-      const w = (ancho - sizeadosWidth - personalizadosSum) / (headers.length - sizeadosLength - personalizados.length);
+      const w = (ancho - sizeadosWidth - personalizadosSum) / (headers.length - sizeadosLength - personalizados.length - ocultos.length);
       console.log({
         w,
         ancho,
         sizeadosWidth,
-        sizeadosLength,
         personalizadosSum,
-        headers: headers.length,
-        personalizados: personalizados.length
+        headers,
+        sizeadosLength,
+        personalizados
       });
       setWidths(
         Object.fromEntries(
@@ -39135,8 +39163,13 @@ function HTable({
               onClick: (e) => {
                 context.excel.export(
                   context.data.map((d) => {
-                    const { __select__, __modal__, ...datums } = d;
-                    return datums;
+                    const obj = {};
+                    for (let key in d) {
+                      if (!key.startsWith("_")) {
+                        obj[key] = d[key];
+                      }
+                    }
+                    return obj;
                   })
                 );
               },
@@ -39186,6 +39219,7 @@ function HTable({
           headers.map((header, i) => {
             var _a, _b;
             if ((_b = (_a = context == null ? void 0 : context.hideColumns) == null ? void 0 : _a.includes) == null ? void 0 : _b.call(_a, header)) return null;
+            if (header.startsWith("_") && !header.startsWith("__")) return null;
             return /* @__PURE__ */ jsxs25(
               "div",
               {
@@ -39228,6 +39262,7 @@ function HTable({
             return items.map(([key, item], i) => {
               var _a, _b, _c, _d, _e, _f, _g;
               if ((_b = (_a = context == null ? void 0 : context.hideColumns) == null ? void 0 : _a.includes) == null ? void 0 : _b.call(_a, key)) return null;
+              if (key.startsWith("_") && !key.startsWith("__")) return null;
               if (key == "__modal__") {
                 return /* @__PURE__ */ jsx33(
                   "div",
@@ -39320,7 +39355,10 @@ function HTable({
                     children: ((_e = (_d = context.buttons[key]) == null ? void 0 : _d.props) == null ? void 0 : _e.children) ? item : null,
                     onClick: async (e) => {
                       var _a2, _b2;
-                      const ret = await ((_b2 = (_a2 = context.buttons[key].props) == null ? void 0 : _a2.onClick) == null ? void 0 : _b2.call(_a2, e)) || {};
+                      const ret = await ((_b2 = (_a2 = context.buttons[key].props) == null ? void 0 : _a2.onClick) == null ? void 0 : _b2.call(_a2, {
+                        e,
+                        row
+                      })) || {};
                       const newData = [...context.data];
                       const index = newData.findIndex((f) => f.id == (row == null ? void 0 : row.id));
                       newData[index] = { ...newData[index], ...ret };
@@ -39329,7 +39367,10 @@ function HTable({
                     onChange: async (e) => {
                       var _a2, _b2, _c2;
                       const value = e.target.value;
-                      const ret = await ((_b2 = (_a2 = context.buttons[key].props) == null ? void 0 : _a2.onChange) == null ? void 0 : _b2.call(_a2, e)) || {};
+                      const ret = await ((_b2 = (_a2 = context.buttons[key].props) == null ? void 0 : _a2.onChange) == null ? void 0 : _b2.call(_a2, {
+                        e,
+                        row
+                      })) || {};
                       const newData = [...context.data];
                       const index = newData.findIndex((f) => f.id == (row == null ? void 0 : row.id));
                       if (index >= 0) {
@@ -39347,7 +39388,7 @@ function HTable({
                   }) : ["number", "string"].includes(typeof item) ? valueFormatter({
                     value: item,
                     currentCoin: context.currentCoin
-                  }) : JSON.stringify(item)
+                  }) : React10.isValidElement(item) ? item : JSON.stringify(item)
                 },
                 row.id + i
               );
@@ -39379,8 +39420,14 @@ function HTable({
             color: "white",
             onClose: async () => {
               var _a;
-              const c = await ((_a = context == null ? void 0 : context.onCloseModal) == null ? void 0 : _a.call(context, searchedData[currentIndex]));
-              return c;
+              if (context == null ? void 0 : context.onCloseModal) {
+                const c = await ((_a = context == null ? void 0 : context.onCloseModal) == null ? void 0 : _a.call(
+                  context,
+                  searchedData[currentIndex]
+                ));
+                return c;
+              }
+              return true;
             },
             children: /* @__PURE__ */ jsxs25("div", { className: "relative", children: [
               /* @__PURE__ */ jsxs25("div", { className: "fixed top-0 left-0 p-10 ", children: [
@@ -39423,28 +39470,6 @@ function HTable({
     }
   );
 }
-function valueFormatter({
-  value,
-  currentCoin = ""
-}) {
-  if (value == null || value === "") return "";
-  const isDate = /(\d{4}-\d{2}-\d{2})(T[\d:,.+-]*(Z)?)?/;
-  if (`${value}`.match(isDate)) {
-    return value.toString().split("T")[0].split("-").reverse().join("/");
-  }
-  const splited = `${value}`.split(".");
-  const hasDecimals = splited.length == 2 && splited.every((v) => `${v}`.match(types_default.number));
-  if (hasDecimals) {
-    return [
-      currentCoin,
-      (+`${value}`).toLocaleString("en-US", {
-        minimumFractionDigits: 2,
-        maximumFractionDigits: 2
-      })
-    ].join(" ");
-  }
-  return value;
-}
 
 // src/table-advanced/context.ts
 import { useEffect as useEffect12, useMemo as useMemo9, useReducer as useReducer3, useState as useState16 } from "react";

package/package.json

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

package/src/pop/index.tsx

@@ -24,6 +24,7 @@ export default function usePopup() {
   const open = useCallback(
     (partial: Omit<PopupState, "visible" | "inputValue">) => {
       const { message, ...rest } = partial;
+
       messageRef.current = message as any;
       setPopup({ ...rest, visible: true, inputValue: "" });
     },
@@ -36,11 +37,15 @@ export default function usePopup() {
       let visible = false;
       if (confirmed) {
         prev.onConfirm?.(value);
-      } else if (prev?.onCancel) {
-        visible = !Boolean(await prev.onCancel?.());
+      } else if (prev?.onClose) {
+        visible = !Boolean(await prev.onClose?.());
+      } else {
+        prev.onCancel?.();
+        visible = false;
       }
 
       const data = { ...prev, visible, inputValue: "" };
+
       setPopup(data);
     },
     [popup],
@@ -73,12 +78,13 @@ export default function usePopup() {
           type: "modal",
           message,
           color,
-          // onConfirm: () => {
-          //   resolve();
-          // },
-          onCancel: async () => {
-            return await onClose?.();
-          },
+          onConfirm: () => resolve(),
+          onCancel: () => resolve(),
+          onClose: onClose
+            ? async () => {
+                return await onClose?.();
+              }
+            : undefined,
           icons,
           full,
         }),

package/src/pop/types.ts

@@ -41,6 +41,7 @@ export interface PopupState {
   color: PopupColor;
   onConfirm?: (value?: string) => void;
   onCancel?: () => void | Promise<boolean | void>;
+  onClose?: () => void | Promise<boolean | void>;
   icons?: boolean;
   full?: boolean;
 }

package/src/table-advanced/formatter.ts

@@ -0,0 +1,36 @@
+import { ReactNode } from "react";
+import regularExpresions from "./types";
+
+export function valueFormatter({
+  value,
+  currentCoin = "",
+}: {
+  value: any;
+  currentCoin?: ReactNode;
+}) {
+  if (value == null || value === "") return "";
+
+  const isDate = /(\d{4}-\d{2}-\d{2})(T[\d:,.+-]*(Z)?)?/;
+
+  if (`${value}`.match(isDate)) {
+    return value.toString().split("T")[0].split("-").reverse().join("/");
+  }
+
+  const splited = `${value}`.split(".");
+
+  const hasDecimals =
+    splited.length == 2 &&
+    splited.every((v: any) => `${v}`.match(regularExpresions.number));
+
+  if (hasDecimals) {
+    return [
+      currentCoin,
+      (+`${value}`).toLocaleString("en-US", {
+        minimumFractionDigits: 2,
+        maximumFractionDigits: 2,
+      }),
+    ].join(" ");
+  }
+
+  return value;
+}

package/src/table-advanced/h.table.tsx

@@ -14,6 +14,7 @@ import Searchable from "./searchable";
 import Modal from "../modal";
 import { EditIcon } from "./icons";
 import regularExpresions, { TableProps } from "./types";
+import { valueFormatter } from "./formatter";
 type Widths = Record<string, number>;
 export default function HTable({
   context,
@@ -51,18 +52,6 @@ export default function HTable({
     }
     const [widths, setWidths] = useState<Widths>({});
 
-    // si headers cambia dinámicamente, hay que rellenar los que falten
-    // useEffect(() => {
-    //   setWidths((prev) => {
-    //     const missing = headers.filter((h) => !(h in prev));
-    //     if (missing.length === 0) return prev;
-    //     return {
-    //       ...prev,
-    //       ...Object.fromEntries(missing.map((h) => [h, getWidth(h)])),
-    //     };
-    //   });
-    // }, [headers, defaultWidth]);
-
     const startDrag = useCallback(
       (e: React.MouseEvent, headerKey: string) => {
         e.preventDefault();
@@ -87,7 +76,13 @@ export default function HTable({
     );
 
     const gridTemplateColumns = headers
-      .filter((h) => !context?.hideColumns?.includes?.(h))
+      .filter((h) => {
+        if (["__modal__", "__select__"].includes(h)) {
+          return true;
+        }
+
+        return !context?.hideColumns?.includes?.(h) && !h.startsWith("_");
+      })
       .map((h) => `${widths[h] ?? defaultWidth}px`)
       .join(" ");
 
@@ -99,14 +94,12 @@ export default function HTable({
   useEffect(() => {
     if (!tableRef.current) return;
     const observer = new ResizeObserver(([entry]) => {
-      const sizeados = headers.filter((h) =>
-        [
-          "__select__",
-          "__modal__",
-          // ...(context?.hideColumns || []),
-          // ...(context?.colSize ? Object.keys(context.colSize) : []),
-        ].includes(h),
+      const ocultos = headers.filter(
+        (h) =>
+          !h.startsWith("__") &&
+          (h.startsWith("_") || context?.hideColumns?.includes?.(h)),
       );
+      const sizeados = headers.filter((h) => h.startsWith("__"));
 
       const personalizados = context?.colSize
         ? (Object.values(context.colSize) as number[])
@@ -122,15 +115,18 @@ export default function HTable({
 
       const w =
         (ancho - sizeadosWidth - personalizadosSum) /
-        (headers.length - sizeadosLength - personalizados.length);
+        (headers.length -
+          sizeadosLength -
+          personalizados.length -
+          ocultos.length);
       console.log({
         w,
         ancho,
         sizeadosWidth,
-        sizeadosLength,
         personalizadosSum,
-        headers: headers.length,
-        personalizados: personalizados.length,
+        headers,
+        sizeadosLength,
+        personalizados,
       });
       setWidths(
         Object.fromEntries(
@@ -168,8 +164,14 @@ export default function HTable({
             onClick={(e) => {
               context.excel.export(
                 context.data.map((d) => {
-                  const { __select__, __modal__, ...datums } = d;
-                  return datums;
+                  const obj: any = {};
+
+                  for (let key in d) {
+                    if (!key.startsWith("_")) {
+                      obj[key] = d[key];
+                    }
+                  }
+                  return obj;
                 }),
               );
             }}
@@ -228,6 +230,7 @@ export default function HTable({
       <div className="grid " style={{ gridTemplateColumns }}>
         {headers.map((header, i) => {
           if (context?.hideColumns?.includes?.(header)) return null;
+          if (header.startsWith("_") && !header.startsWith("__")) return null;
           return (
             <div
               key={header}
@@ -269,6 +272,7 @@ export default function HTable({
 
           return items.map(([key, item], i) => {
             if (context?.hideColumns?.includes?.(key)) return null;
+            if (key.startsWith("_") && !key.startsWith("__")) return null;
 
             if (key == "__modal__") {
               return (
@@ -407,7 +411,10 @@ export default function HTable({
                       : null,
                     onClick: async (e: any) => {
                       const ret =
-                        (await context.buttons[key].props?.onClick?.(e)) || {};
+                        (await context.buttons[key].props?.onClick?.({
+                          e,
+                          row,
+                        })) || {};
                       const newData = [...context.data];
                       const index = newData.findIndex((f) => f.id == row?.id);
                       newData[index] = { ...newData[index], ...ret };
@@ -416,7 +423,10 @@ export default function HTable({
                     onChange: async (e: { target: { value: string } }) => {
                       const value = e.target.value;
                       const ret =
-                        (await context.buttons[key].props?.onChange?.(e)) || {};
+                        (await context.buttons[key].props?.onChange?.({
+                          e,
+                          row,
+                        })) || {};
 
                       const newData = [...context.data];
                       const index = newData.findIndex((f) => f.id == row?.id);
@@ -441,6 +451,8 @@ export default function HTable({
                     value: item,
                     currentCoin: context.currentCoin,
                   })
+                ) : React.isValidElement(item) ? (
+                  item
                 ) : (
                   JSON.stringify(item)
                 )}
@@ -493,9 +505,15 @@ export default function HTable({
           button={<button ref={modalRef}></button>}
           color={"white"}
           onClose={async () => {
-            const c = await context?.onCloseModal?.(searchedData[currentIndex]);
+            if (context?.onCloseModal) {
+              const c = await context?.onCloseModal?.(
+                searchedData[currentIndex],
+              );
+
+              return c;
+            }
 
-            return c;
+            return true;
           }}
         >
           <div className="relative">
@@ -543,37 +561,3 @@ export default function HTable({
     </div>
   );
 }
-
-function valueFormatter({
-  value,
-  currentCoin = "",
-}: {
-  value: any;
-  currentCoin?: ReactNode;
-}) {
-  if (value == null || value === "") return "";
-
-  const isDate = /(\d{4}-\d{2}-\d{2})(T[\d:,.+-]*(Z)?)?/;
-
-  if (`${value}`.match(isDate)) {
-    return value.toString().split("T")[0].split("-").reverse().join("/");
-  }
-
-  const splited = `${value}`.split(".");
-
-  const hasDecimals =
-    splited.length == 2 &&
-    splited.every((v: any) => `${v}`.match(regularExpresions.number));
-
-  if (hasDecimals) {
-    return [
-      currentCoin,
-      (+`${value}`).toLocaleString("en-US", {
-        minimumFractionDigits: 2,
-        maximumFractionDigits: 2,
-      }),
-    ].join(" ");
-  }
-
-  return value;
-}