next-recomponents 2.0.19 → 2.0.21

package/dist/index.d.mts

@@ -81,6 +81,9 @@ interface TableProps {
     hideColumns?: string[];
     footer?: FooterType;
     symbols?: any;
+    currentCoin?: string;
+    className?: string;
+    fontSize?: string;
     [key: string]: any;
 }
 declare function Table(props: TableProps): react_jsx_runtime.JSX.Element;

package/dist/index.d.ts

@@ -81,6 +81,9 @@ interface TableProps {
     hideColumns?: string[];
     footer?: FooterType;
     symbols?: any;
+    currentCoin?: string;
+    className?: string;
+    fontSize?: string;
     [key: string]: any;
 }
 declare function Table(props: TableProps): react_jsx_runtime.JSX.Element;

package/dist/index.js

@@ -35822,7 +35822,7 @@ function Toolbar({
     ) : onSave && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Button, { onClick: () => onSave(rows.map(stripMeta)), children: "Guardar" })
   ] });
 }
-function useColumns(rows, options) {
+function useColumns(rows, currentCoin, options) {
   const {
     flex,
     editableFields,
@@ -35841,12 +35841,19 @@ function useColumns(rows, options) {
         headerName: key,
         valueFormatter: (value) => {
           if (value == null || value === "") return "";
-          const num = parseFloat(value);
-          if (isNaN(num)) return value;
-          return num.toLocaleString("en-US", {
-            minimumFractionDigits: num % 1 !== 0 ? 2 : 0,
-            maximumFractionDigits: num % 1 !== 0 ? 2 : 0
-          });
+          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 isNumber = typeof value === "number";
+          if (isNumber) {
+            if (isNaN(value)) return value;
+            return currentCoin + " " + value.toLocaleString("en-US", {
+              minimumFractionDigits: value % 1 !== 0 ? 2 : 0,
+              maximumFractionDigits: value % 1 !== 0 ? 2 : 0
+            });
+          }
+          return value;
         },
         flex,
         editable: (_a = editableFields == null ? void 0 : editableFields.includes(key)) != null ? _a : false,
@@ -35905,7 +35912,10 @@ function IHTable({
   width = "100%",
   header,
   hideColumns = [],
-  footer = {}
+  footer = {},
+  currentCoin = "$",
+  fontSize = "1rem",
+  className
 }) {
   var _a;
   if (modal && onSelect)
@@ -35946,7 +35956,7 @@ function IHTable({
     }
     return [];
   }, [selectedRows, rows]);
-  const columns = useColumns(rows, {
+  const columns = useColumns(rows, currentCoin, {
     flex,
     editableFields,
     buttons: resolvedButtons,
@@ -35991,12 +36001,21 @@ function IHTable({
           /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
             import_x_data_grid.DataGrid,
             {
+              className,
               rows,
               columns,
               checkboxSelection: Boolean(onSelect),
               rowSelectionModel: selectedRows,
               onRowSelectionModelChange: !modal ? setSelectedRows : void 0,
               sx: {
+                fontSize,
+                // equivalente a text-xs
+                "& .MuiDataGrid-cell": {
+                  fontSize
+                },
+                "& .MuiDataGrid-columnHeader": {
+                  fontSize
+                },
                 "& .MuiDataGrid-cell--editable": {
                   backgroundColor: "#c6d8f0",
                   fontWeight: 500

package/dist/index.mjs

@@ -35802,7 +35802,7 @@ function Toolbar({
     ) : onSave && /* @__PURE__ */ jsx6(Button, { onClick: () => onSave(rows.map(stripMeta)), children: "Guardar" })
   ] });
 }
-function useColumns(rows, options) {
+function useColumns(rows, currentCoin, options) {
   const {
     flex,
     editableFields,
@@ -35821,12 +35821,19 @@ function useColumns(rows, options) {
         headerName: key,
         valueFormatter: (value) => {
           if (value == null || value === "") return "";
-          const num = parseFloat(value);
-          if (isNaN(num)) return value;
-          return num.toLocaleString("en-US", {
-            minimumFractionDigits: num % 1 !== 0 ? 2 : 0,
-            maximumFractionDigits: num % 1 !== 0 ? 2 : 0
-          });
+          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 isNumber = typeof value === "number";
+          if (isNumber) {
+            if (isNaN(value)) return value;
+            return currentCoin + " " + value.toLocaleString("en-US", {
+              minimumFractionDigits: value % 1 !== 0 ? 2 : 0,
+              maximumFractionDigits: value % 1 !== 0 ? 2 : 0
+            });
+          }
+          return value;
         },
         flex,
         editable: (_a = editableFields == null ? void 0 : editableFields.includes(key)) != null ? _a : false,
@@ -35885,7 +35892,10 @@ function IHTable({
   width = "100%",
   header,
   hideColumns = [],
-  footer = {}
+  footer = {},
+  currentCoin = "$",
+  fontSize = "1rem",
+  className
 }) {
   var _a;
   if (modal && onSelect)
@@ -35926,7 +35936,7 @@ function IHTable({
     }
     return [];
   }, [selectedRows, rows]);
-  const columns = useColumns(rows, {
+  const columns = useColumns(rows, currentCoin, {
     flex,
     editableFields,
     buttons: resolvedButtons,
@@ -35971,12 +35981,21 @@ function IHTable({
           /* @__PURE__ */ jsx6(
             DataGrid,
             {
+              className,
               rows,
               columns,
               checkboxSelection: Boolean(onSelect),
               rowSelectionModel: selectedRows,
               onRowSelectionModelChange: !modal ? setSelectedRows : void 0,
               sx: {
+                fontSize,
+                // equivalente a text-xs
+                "& .MuiDataGrid-cell": {
+                  fontSize
+                },
+                "& .MuiDataGrid-columnHeader": {
+                  fontSize
+                },
                 "& .MuiDataGrid-cell--editable": {
                   backgroundColor: "#c6d8f0",
                   fontWeight: 500

package/package.json

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

package/src/table/index.tsx

@@ -36,6 +36,9 @@ interface TableProps {
   hideColumns?: string[];
   footer?: FooterType;
   symbols?: any;
+  currentCoin?: string;
+  className?: string;
+  fontSize?: string;
   [key: string]: any;
 }
 
@@ -241,6 +244,7 @@ function Toolbar({
 
 function useColumns(
   rows: GridValidRowModel[],
+  currentCoin: string,
   options: {
     flex: number;
     editableFields?: string[];
@@ -260,7 +264,6 @@ function useColumns(
     handleRowUpdate,
     onModalOpen,
   } = options;
-
   return useMemo(() => {
     if (!rows.length) return [];
 
@@ -271,13 +274,31 @@ function useColumns(
         headerName: key,
         valueFormatter: (value: any) => {
           if (value == null || value === "") return "";
-          const num = parseFloat(value);
-          if (isNaN(num)) return value;
+          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 isNumber = typeof value === "number";
+
+          if (isNumber) {
+            if (isNaN(value)) return value;
+            return (
+              currentCoin +
+              " " +
+              value.toLocaleString("en-US", {
+                minimumFractionDigits: value % 1 !== 0 ? 2 : 0,
+                maximumFractionDigits: value % 1 !== 0 ? 2 : 0,
+              })
+            );
+          }
 
-          return num.toLocaleString("en-US", {
-            minimumFractionDigits: num % 1 !== 0 ? 2 : 0,
-            maximumFractionDigits: num % 1 !== 0 ? 2 : 0,
-          });
+          return value;
         },
         flex,
         editable: editableFields?.includes(key) ?? false,
@@ -339,6 +360,9 @@ function IHTable({
   header,
   hideColumns = [],
   footer = {},
+  currentCoin = "$",
+  fontSize = "1rem",
+  className,
 }: TableProps) {
   if (modal && onSelect)
     throw new Error("Solo se puede usar modal o onSelect por separado");
@@ -386,7 +410,7 @@ function IHTable({
     return [];
   }, [selectedRows, rows]);
 
-  const columns = useColumns(rows, {
+  const columns = useColumns(rows, currentCoin, {
     flex,
     editableFields,
     buttons: resolvedButtons,
@@ -428,12 +452,20 @@ function IHTable({
         )}
 
         <DataGrid
+          className={className}
           rows={rows}
           columns={columns as any}
           checkboxSelection={Boolean(onSelect)}
           rowSelectionModel={selectedRows}
           onRowSelectionModelChange={!modal ? setSelectedRows : undefined}
           sx={{
+            fontSize, // equivalente a text-xs
+            "& .MuiDataGrid-cell": {
+              fontSize,
+            },
+            "& .MuiDataGrid-columnHeader": {
+              fontSize,
+            },
             "& .MuiDataGrid-cell--editable": {
               backgroundColor: "#c6d8f0",
               fontWeight: 500,