next-recomponents 2.0.42 → 2.0.43

package/dist/index.js

@@ -37192,6 +37192,8 @@ function usePopup() {
         (_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 {
+        visible = false;
       }
       const data = { ...prev, visible, inputValue: "" };
       setPopup(data);
@@ -37219,9 +37221,9 @@ function usePopup() {
         // onConfirm: () => {
         //   resolve();
         // },
-        onCancel: async () => {
+        onCancel: 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(
@@ -39188,6 +39216,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 +39259,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",
@@ -39349,7 +39379,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 +39411,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 +39461,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

@@ -37177,6 +37177,8 @@ function usePopup() {
         (_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 {
+        visible = false;
       }
       const data = { ...prev, visible, inputValue: "" };
       setPopup(data);
@@ -37204,9 +37206,9 @@ function usePopup() {
         // onConfirm: () => {
         //   resolve();
         // },
-        onCancel: async () => {
+        onCancel: 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(
@@ -39186,6 +39214,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 +39257,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",
@@ -39347,7 +39377,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 +39409,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 +39459,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.43",
   "description": "description nueva",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/pop/index.tsx

@@ -38,9 +38,12 @@ export default function usePopup() {
         prev.onConfirm?.(value);
       } else if (prev?.onCancel) {
         visible = !Boolean(await prev.onCancel?.());
+      } else {
+        visible = false;
       }
 
       const data = { ...prev, visible, inputValue: "" };
+
       setPopup(data);
     },
     [popup],
@@ -76,9 +79,11 @@ export default function usePopup() {
           // onConfirm: () => {
           //   resolve();
           // },
-          onCancel: async () => {
-            return await onClose?.();
-          },
+          onCancel: onClose
+            ? async () => {
+                return await onClose?.();
+              }
+            : undefined,
           icons,
           full,
         }),

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(
@@ -228,6 +224,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 +266,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 (
@@ -441,6 +439,8 @@ export default function HTable({
                     value: item,
                     currentCoin: context.currentCoin,
                   })
+                ) : React.isValidElement(item) ? (
+                  item
                 ) : (
                   JSON.stringify(item)
                 )}
@@ -493,9 +493,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 +549,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;
-}