next-recomponents 1.4.2 → 1.4.4

package/dist/index.d.mts

@@ -141,4 +141,9 @@ interface Props extends React$1.DetailedHTMLProps<React$1.DialogHTMLAttributes<H
 }
 declare function Modal({ button, children, ref }: Props): react_jsx_runtime.JSX.Element;
 
-export { Alert, Button, Container, Form, Input, Modal, Select, Table, TextArea, regularExpresions, useResources };
+type PreProps = {
+    data: string;
+};
+declare const Pre: React$1.FC<PreProps>;
+
+export { Alert, Button, Container, Form, Input, Modal, Pre, Select, Table, TextArea, regularExpresions, useResources };

package/dist/index.d.ts

@@ -141,4 +141,9 @@ interface Props extends React$1.DetailedHTMLProps<React$1.DialogHTMLAttributes<H
 }
 declare function Modal({ button, children, ref }: Props): react_jsx_runtime.JSX.Element;
 
-export { Alert, Button, Container, Form, Input, Modal, Select, Table, TextArea, regularExpresions, useResources };
+type PreProps = {
+    data: string;
+};
+declare const Pre: React$1.FC<PreProps>;
+
+export { Alert, Button, Container, Form, Input, Modal, Pre, Select, Table, TextArea, regularExpresions, useResources };

package/dist/index.js

@@ -2974,6 +2974,7 @@ __export(index_exports, {
   Form: () => Form,
   Input: () => Input,
   Modal: () => Modal,
+  Pre: () => pre_default,
   Select: () => Select,
   Table: () => Table,
   TextArea: () => TextArea,
@@ -11183,10 +11184,11 @@ function TD(_a) {
         }) }),
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { children: (item == null ? void 0 : item.handler) ? import_react23.default.Children.map(item.handler, (handler) => {
           if (import_react23.default.isValidElement(handler)) {
-            return import_react23.default.cloneElement(handler, {
+            const _a3 = handler.props, { defaultValue } = _a3, restProps = __objRest(_a3, ["defaultValue"]);
+            return import_react23.default.cloneElement(handler, __spreadProps(__spreadValues({}, restProps), {
               value: mapedData[index][item.name].content,
               onChange: (e) => {
-                var _a3, _b3;
+                var _a4, _b3;
                 const nmd = [...mapedData];
                 nmd[index][item.name].content = e.target.value;
                 e.item = Object.assign(
@@ -11203,9 +11205,9 @@ function TD(_a) {
                   setMapedData == null ? void 0 : setMapedData(nmd2);
                 };
                 setMapedData == null ? void 0 : setMapedData(nmd);
-                (_b3 = (_a3 = handler == null ? void 0 : handler.props) == null ? void 0 : _a3.onChange) == null ? void 0 : _b3.call(_a3, e);
+                (_b3 = (_a4 = handler == null ? void 0 : handler.props) == null ? void 0 : _a4.onChange) == null ? void 0 : _b3.call(_a4, e);
               }
-            });
+            }));
           }
           return handler;
         }) : item == null ? void 0 : item.content })
@@ -32803,6 +32805,35 @@ function Modal({ button, children, ref }) {
     ] }) })
   ] });
 }
+
+// src/pre/index.tsx
+var import_jsx_runtime19 = require("react/jsx-runtime");
+var Pre = ({ data }) => {
+  let formatted = data;
+  try {
+    const parsed = JSON.parse(data);
+    formatted = JSON.stringify(parsed, null, 2);
+  } catch (err) {
+    console.error("Invalid JSON string:", err);
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    "pre",
+    {
+      style: {
+        backgroundColor: "#f4f4f4",
+        padding: "1rem",
+        borderRadius: "8px",
+        whiteSpace: "pre-wrap",
+        // Permite saltos de línea
+        wordBreak: "break-word",
+        // Rompe palabras largas si es necesario
+        fontFamily: "monospace"
+      },
+      children: formatted
+    }
+  );
+};
+var pre_default = Pre;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Alert,
@@ -32811,6 +32842,7 @@ function Modal({ button, children, ref }) {
   Form,
   Input,
   Modal,
+  Pre,
   Select,
   Table,
   TextArea,

package/dist/index.mjs

@@ -11173,10 +11173,11 @@ function TD(_a) {
         }) }),
         /* @__PURE__ */ jsx8("div", { children: (item == null ? void 0 : item.handler) ? React3.Children.map(item.handler, (handler) => {
           if (React3.isValidElement(handler)) {
-            return React3.cloneElement(handler, {
+            const _a3 = handler.props, { defaultValue } = _a3, restProps = __objRest(_a3, ["defaultValue"]);
+            return React3.cloneElement(handler, __spreadProps(__spreadValues({}, restProps), {
               value: mapedData[index][item.name].content,
               onChange: (e) => {
-                var _a3, _b3;
+                var _a4, _b3;
                 const nmd = [...mapedData];
                 nmd[index][item.name].content = e.target.value;
                 e.item = Object.assign(
@@ -11193,9 +11194,9 @@ function TD(_a) {
                   setMapedData == null ? void 0 : setMapedData(nmd2);
                 };
                 setMapedData == null ? void 0 : setMapedData(nmd);
-                (_b3 = (_a3 = handler == null ? void 0 : handler.props) == null ? void 0 : _a3.onChange) == null ? void 0 : _b3.call(_a3, e);
+                (_b3 = (_a4 = handler == null ? void 0 : handler.props) == null ? void 0 : _a4.onChange) == null ? void 0 : _b3.call(_a4, e);
               }
-            });
+            }));
           }
           return handler;
         }) : item == null ? void 0 : item.content })
@@ -32799,6 +32800,35 @@ function Modal({ button, children, ref }) {
     ] }) })
   ] });
 }
+
+// src/pre/index.tsx
+import { jsx as jsx18 } from "react/jsx-runtime";
+var Pre = ({ data }) => {
+  let formatted = data;
+  try {
+    const parsed = JSON.parse(data);
+    formatted = JSON.stringify(parsed, null, 2);
+  } catch (err) {
+    console.error("Invalid JSON string:", err);
+  }
+  return /* @__PURE__ */ jsx18(
+    "pre",
+    {
+      style: {
+        backgroundColor: "#f4f4f4",
+        padding: "1rem",
+        borderRadius: "8px",
+        whiteSpace: "pre-wrap",
+        // Permite saltos de línea
+        wordBreak: "break-word",
+        // Rompe palabras largas si es necesario
+        fontFamily: "monospace"
+      },
+      children: formatted
+    }
+  );
+};
+var pre_default = Pre;
 export {
   Alert,
   Button,
@@ -32806,6 +32836,7 @@ export {
   Form,
   Input,
   Modal,
+  pre_default as Pre,
   Select,
   Table,
   TextArea,

package/package.json

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

package/src/index.tsx

@@ -9,3 +9,4 @@ export { default as TextArea } from "./text-area";
 export { default as useResources } from "./use-resources";
 export { default as Select } from "./select";
 export { default as Modal } from "./modal";
+export { default as Pre } from "./pre";

package/src/pre/index.tsx

@@ -0,0 +1,33 @@
+import React from "react";
+
+type PreProps = {
+  data: string;
+};
+
+const Pre: React.FC<PreProps> = ({ data }) => {
+  let formatted = data;
+
+  try {
+    const parsed = JSON.parse(data);
+    formatted = JSON.stringify(parsed, null, 2); // Formatea con indentación
+  } catch (err) {
+    console.error("Invalid JSON string:", err);
+  }
+
+  return (
+    <pre
+      style={{
+        backgroundColor: "#f4f4f4",
+        padding: "1rem",
+        borderRadius: "8px",
+        whiteSpace: "pre-wrap", // Permite saltos de línea
+        wordBreak: "break-word", // Rompe palabras largas si es necesario
+        fontFamily: "monospace",
+      }}
+    >
+      {formatted}
+    </pre>
+  );
+};
+
+export default Pre;

package/src/table/td.tsx

@@ -77,7 +77,10 @@ export default function TD({
           {item?.handler
             ? React.Children.map(item.handler, (handler) => {
                 if (React.isValidElement(handler)) {
+                  const { defaultValue, ...restProps } = handler.props;
+
                   return React.cloneElement(handler as any, {
+                    ...restProps,
                     value: mapedData[index][item.name].content,
                     onChange: (e: any) => {
                       const nmd = [...mapedData];