@visiion/forms-library 1.1.4 → 1.1.5

package/dist/components/Inputs/SubtitleInput.d.ts

@@ -3,6 +3,7 @@ interface SubtitleInputProps {
     title?: string;
     description?: string;
     className?: string;
+    textClassName?: string;
 }
 declare const SubtitleInput: React.FC<SubtitleInputProps>;
 export default SubtitleInput;

package/dist/components/Inputs/SwornDeclaration.d.ts

@@ -1,6 +1,7 @@
 import React from "react";
 interface SwornDeclarationProps {
     title?: string;
+    name?: string;
     declarationText?: string;
     checked?: boolean;
     onChange?: (checked: boolean) => void;

package/dist/index.esm.js

@@ -34298,8 +34298,8 @@ var GoogleMaps = function (_a) {
 };
 
 var SubtitleInput = function (_a) {
-    var title = _a.title, description = _a.description, _b = _a.className, className = _b === void 0 ? "" : _b;
-    return (jsxs("div", { className: "col-span-12 ".concat(className), children: [title && (jsx("h3", { className: "text-xl font-bold text-gray-800 mb-2", children: title })), description && jsx("p", { className: "text-gray-600 mb-4", children: description }), jsx("hr", { className: "border-gray-300 mb-4" })] }));
+    var title = _a.title, description = _a.description, _b = _a.className, className = _b === void 0 ? "" : _b, _c = _a.textClassName, textClassName = _c === void 0 ? "pl-5 text-[24px] text-text text-xl font-bold font-roboto" : _c;
+    return (jsxs("div", { className: "col-span-12 ".concat(className), children: [title && jsx("h3", { className: textClassName, children: title }), description && jsx("p", { className: "text-gray-600 mb-4", children: description }), jsx("hr", { className: "border-gray-300 mb-4" })] }));
 };
 
 // THIS FILE IS AUTO GENERATED
@@ -34342,15 +34342,15 @@ var DatePicker = function (_a) {
 };
 
 var SwornDeclaration = function (_a) {
-    var _b = _a.title, title = _b === void 0 ? "Declaración Jurada" : _b, _c = _a.declarationText, declarationText = _c === void 0 ? "Declaro bajo juramento ante la Dirección del Trabajo, que los antecedentes entregados son verídicos y que corresponden a la realidad. De ser falsa la presente declaración me hará incurrir en las penas establecidas en el artículo 210 del Código Penal." : _c, _d = _a.checked, checked = _d === void 0 ? false : _d, onChange = _a.onChange, _e = _a.required, required = _e === void 0 ? true : _e, _f = _a.disabled, disabled = _f === void 0 ? false : _f, _g = _a.className, className = _g === void 0 ? "" : _g, error = _a.error;
-    var _h = useState(checked), isChecked = _h[0], setIsChecked = _h[1];
+    var _b = _a.title, title = _b === void 0 ? "Declaración Jurada" : _b, _c = _a.name, name = _c === void 0 ? "sworn_declaration" : _c, _d = _a.declarationText, declarationText = _d === void 0 ? "Declaro bajo juramento ante la Dirección del Trabajo, que los antecedentes entregados son verídicos y que corresponden a la realidad. De ser falsa la presente declaración me hará incurrir en las penas establecidas en el artículo 210 del Código Penal." : _d, _e = _a.checked, checked = _e === void 0 ? false : _e, onChange = _a.onChange, _f = _a.required, required = _f === void 0 ? true : _f, _g = _a.disabled, disabled = _g === void 0 ? false : _g, _h = _a.className, className = _h === void 0 ? "" : _h, error = _a.error;
+    var _j = useState(checked), isChecked = _j[0], setIsChecked = _j[1];
     var handleCheckboxChange = function (e) {
         var newChecked = e.target.checked;
         setIsChecked(newChecked);
         if (onChange) {
             onChange({
                 target: {
-                    name: "sworn_declaration",
+                    name: name,
                     value: newChecked,
                     type: "declaration",
                 },
@@ -34363,7 +34363,7 @@ var SwornDeclaration = function (_a) {
                     fontWeight: 500,
                     fontSize: "14px",
                     lineHeight: "16px",
-                }, children: title }), jsxs("div", { className: "flex items-start gap-3", children: [jsx("input", { type: "checkbox", id: "sworn-declaration", checked: isChecked, onChange: handleCheckboxChange, disabled: disabled, required: required, className: "mt-1 w-4 h-4 text-blue-600 bg-white border-gray-800 rounded focus:ring-blue-500 focus:ring-2 border-2 ".concat(disabled ? "cursor-not-allowed opacity-50" : "cursor-pointer") }), jsx("label", { htmlFor: "sworn-declaration", className: "text-sm text-gray-700 leading-relaxed ".concat(disabled ? "cursor-not-allowed opacity-50" : "cursor-pointer"), children: declarationText })] }), error && !isChecked && (jsx("p", { className: "text-red-500 text-sm font-bold mt-2", children: "Debe aceptar la declaraci\u00F3n jurada para continuar" }))] }));
+                }, children: title }), jsxs("div", { className: "flex items-start gap-3", children: [jsx("input", { type: "checkbox", id: "sworn-declaration", name: name, checked: isChecked, onChange: handleCheckboxChange, disabled: disabled, required: required, className: "mt-1 w-4 h-4 text-blue-600 bg-white border-gray-800 rounded focus:ring-blue-500 focus:ring-2 border-2 ".concat(disabled ? "cursor-not-allowed opacity-50" : "cursor-pointer") }), jsx("label", { htmlFor: "sworn-declaration", className: "text-sm text-gray-700 leading-relaxed ".concat(disabled ? "cursor-not-allowed opacity-50" : "cursor-pointer"), children: declarationText })] }), error && !isChecked && (jsx("p", { className: "text-red-500 text-sm font-bold mt-2", children: "Debe aceptar la declaraci\u00F3n jurada para continuar" }))] }));
 };
 
 var StatusScreen = function (_a) {
@@ -34371,28 +34371,28 @@ var StatusScreen = function (_a) {
     var getStatusStyles = function () {
         switch (type) {
             case "success":
-                return "bg-green-50 border-green-200 text-green-800";
+                return "";
             case "error":
-                return "bg-red-50 border-red-200 text-red-800";
+                return "";
             case "warning":
-                return "bg-yellow-50 border-yellow-200 text-yellow-800";
+                return "";
             default:
-                return "bg-blue-50 border-blue-200 text-blue-800";
+                return "";
         }
     };
     var getIcon = function () {
         switch (type) {
             case "success":
-                return (jsx("svg", { className: "w-12 h-12 text-green-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" }) }));
+                return (jsx("svg", { className: "w-28 h-28 text-green-500", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" }) }));
             case "error":
-                return (jsx("svg", { className: "w-12 h-12 text-red-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" }) }));
+                return (jsx("svg", { className: "w-28 h-28 text-red-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" }) }));
             case "warning":
-                return (jsx("svg", { className: "w-12 h-12 text-yellow-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L3.732 16.5c-.77.833.192 2.5 1.732 2.5z" }) }));
+                return (jsx("svg", { className: "w-28 h-28 text-yellow-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L3.732 16.5c-.77.833.192 2.5 1.732 2.5z" }) }));
             default:
-                return (jsx("svg", { className: "w-12 h-12 text-blue-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }) }));
+                return (jsx("svg", { className: "w-28 h-28 text-blue-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }) }));
         }
     };
-    return (jsx("div", { className: "col-span-12", children: jsxs("div", { className: "flex flex-col items-center p-8 border rounded-lg ".concat(getStatusStyles()), children: [jsx("div", { className: "mb-4", children: getIcon() }), title && (jsx("h2", { className: "text-2xl font-bold text-center mb-4", children: title })), message && jsx("p", { className: "text-center mb-6 max-w-md", children: message }), (leftButton || rightButton) && (jsxs("div", { className: "flex space-x-4", children: [leftButton && (jsx("button", { onClick: leftButton.onClick, className: "px-6 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-gray-500", children: leftButton.label })), rightButton && (jsx("button", { onClick: rightButton.onClick, className: "px-6 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500", children: rightButton.label }))] }))] }) }));
+    return (jsx("div", { className: "col-span-12", children: jsxs("div", { className: "flex flex-col items-center p-8  ".concat(getStatusStyles()), children: [jsx("div", { className: "mb-4", children: getIcon() }), title && (jsx("h2", { className: "text-2xl font-bold text-center mb-4", children: title })), message && jsx("p", { className: "text-center mb-6 max-w-md", children: message }), (leftButton || rightButton) && (jsxs("div", { className: "flex space-x-4", children: [leftButton && (jsx("button", { onClick: leftButton.onClick, className: "px-6 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-gray-500", children: leftButton.label })), rightButton && (jsx("button", { onClick: rightButton.onClick, className: "px-6 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500", children: rightButton.label }))] }))] }) }));
 };
 
 var DynamicInput = function (_a) {
@@ -36556,50 +36556,60 @@ create$3.prototype = ObjectSchema.prototype;
 
 var createValidationSchema = function (fields) {
     var schema = {};
-    fields.forEach(function (field) {
+    // Filtrar campos válidos antes de procesarlos
+    var validFields = fields.filter(function (_a) {
+        var _b = _a.validate, validate = _b === void 0 ? true : _b, _c = _a.name, name = _c === void 0 ? null : _c, type = _a.type;
         // Excluir campos que no tienen name o son de tipos especiales
-        if (!field.name ||
-            ['subtitle', 'alert', 'status'].includes(field.type)) {
-            return;
+        if (!name || ["subtitle", "alert", "status"].includes(type)) {
+            return false;
+        }
+        // Excluir campos que tienen validate: false
+        if (!validate) {
+            return false;
         }
+        return true;
+    });
+    validFields.forEach(function (field) {
         if (field.validations && field.validations.length > 0) {
             var fieldSchema_1 = create$6();
             field.validations.forEach(function (validation) {
                 switch (validation.type) {
-                    case 'required':
-                        fieldSchema_1 = fieldSchema_1.required(validation.params[0] || 'Este campo es requerido');
+                    case "required":
+                        fieldSchema_1 = fieldSchema_1.required(validation.params[0] ||
+                            "El campo ".concat(field.label || field.name || "sin nombre", " es requerido"));
                         break;
-                    case 'min':
+                    case "min":
                         var minLength = parseInt(validation.params[0]);
                         var minMessage = validation.params[1] || "M\u00EDnimo ".concat(minLength, " caracteres");
                         fieldSchema_1 = fieldSchema_1.min(minLength, minMessage);
                         break;
-                    case 'max':
+                    case "max":
                         var maxLength = parseInt(validation.params[0]);
                         var maxMessage = validation.params[1] || "M\u00E1ximo ".concat(maxLength, " caracteres");
                         fieldSchema_1 = fieldSchema_1.max(maxLength, maxMessage);
                         break;
-                    case 'email':
-                        var emailMessage = validation.params[0] || 'Email inválido';
+                    case "email":
+                        var emailMessage = validation.params[0] || "Email inválido";
                         fieldSchema_1 = fieldSchema_1.email(emailMessage);
                         break;
-                    case 'pattern':
+                    case "pattern":
                         var pattern = new RegExp(validation.params[0]);
-                        var patternMessage = validation.params[1] || 'Formato inválido';
+                        var patternMessage = validation.params[1] || "Formato inválido";
                         fieldSchema_1 = fieldSchema_1.matches(pattern, patternMessage);
                         break;
-                    case 'custom':
+                    case "custom":
                         // Para validaciones personalizadas
                         var customValidator = validation.params[0];
-                        if (customValidator === 'rut') {
-                            fieldSchema_1 = fieldSchema_1.test('rut', validation.params[1] || 'RUT inválido', function (value) {
+                        if (customValidator === "rut") {
+                            fieldSchema_1 = fieldSchema_1.test("rut", validation.params[1] || "RUT inválido", function (value) {
                                 if (!value)
                                     return true; // Si está vacío, la validación required se encargará
                                 return validate(clean(value));
                             });
                         }
                         else {
-                            fieldSchema_1 = fieldSchema_1.test('custom', validation.params[1] || 'Validación fallida', function (value) {
+                            fieldSchema_1 = fieldSchema_1.test("custom", validation.params[1] ||
+                                "Validaci\u00F3n fallida para ".concat(field.label || field.name || "sin nombre"), function (value) {
                                 // Aquí puedes implementar lógica personalizada
                                 return value; // Por defecto pasa la validación
                             });
@@ -36611,7 +36621,7 @@ var createValidationSchema = function (fields) {
         }
         else if (field.required) {
             // Validación básica de requerido si no hay validaciones específicas
-            schema[field.name] = create$6().required("El campo ".concat(field.label, " es requerido"));
+            schema[field.name] = create$6().required("El campo ".concat(field.label || field.name || "sin nombre", " es requerido"));
         }
     });
     return create$3().shape(schema);
@@ -36619,24 +36629,24 @@ var createValidationSchema = function (fields) {
 // Validaciones predefinidas
 var commonValidations = {
     required: function (message) { return ({
-        type: 'required',
-        params: [message || 'Este campo es requerido'],
+        type: "required",
+        params: [message || "Este campo es requerido"],
     }); },
     min: function (length, message) { return ({
-        type: 'min',
+        type: "min",
         params: [length.toString(), message || "M\u00EDnimo ".concat(length, " caracteres")],
     }); },
     max: function (length, message) { return ({
-        type: 'max',
+        type: "max",
         params: [length.toString(), message || "M\u00E1ximo ".concat(length, " caracteres")],
     }); },
     email: function (message) { return ({
-        type: 'email',
-        params: [message || 'Email inválido'],
+        type: "email",
+        params: [message || "Email inválido"],
     }); },
     pattern: function (regex, message) { return ({
-        type: 'pattern',
-        params: [regex, message || 'Formato inválido'],
+        type: "pattern",
+        params: [regex, message || "Formato inválido"],
     }); },
 };
 

package/dist/index.js

@@ -34318,8 +34318,8 @@ var GoogleMaps = function (_a) {
 };
 
 var SubtitleInput = function (_a) {
-    var title = _a.title, description = _a.description, _b = _a.className, className = _b === void 0 ? "" : _b;
-    return (jsxRuntime.jsxs("div", { className: "col-span-12 ".concat(className), children: [title && (jsxRuntime.jsx("h3", { className: "text-xl font-bold text-gray-800 mb-2", children: title })), description && jsxRuntime.jsx("p", { className: "text-gray-600 mb-4", children: description }), jsxRuntime.jsx("hr", { className: "border-gray-300 mb-4" })] }));
+    var title = _a.title, description = _a.description, _b = _a.className, className = _b === void 0 ? "" : _b, _c = _a.textClassName, textClassName = _c === void 0 ? "pl-5 text-[24px] text-text text-xl font-bold font-roboto" : _c;
+    return (jsxRuntime.jsxs("div", { className: "col-span-12 ".concat(className), children: [title && jsxRuntime.jsx("h3", { className: textClassName, children: title }), description && jsxRuntime.jsx("p", { className: "text-gray-600 mb-4", children: description }), jsxRuntime.jsx("hr", { className: "border-gray-300 mb-4" })] }));
 };
 
 // THIS FILE IS AUTO GENERATED
@@ -34362,15 +34362,15 @@ var DatePicker = function (_a) {
 };
 
 var SwornDeclaration = function (_a) {
-    var _b = _a.title, title = _b === void 0 ? "Declaración Jurada" : _b, _c = _a.declarationText, declarationText = _c === void 0 ? "Declaro bajo juramento ante la Dirección del Trabajo, que los antecedentes entregados son verídicos y que corresponden a la realidad. De ser falsa la presente declaración me hará incurrir en las penas establecidas en el artículo 210 del Código Penal." : _c, _d = _a.checked, checked = _d === void 0 ? false : _d, onChange = _a.onChange, _e = _a.required, required = _e === void 0 ? true : _e, _f = _a.disabled, disabled = _f === void 0 ? false : _f, _g = _a.className, className = _g === void 0 ? "" : _g, error = _a.error;
-    var _h = React.useState(checked), isChecked = _h[0], setIsChecked = _h[1];
+    var _b = _a.title, title = _b === void 0 ? "Declaración Jurada" : _b, _c = _a.name, name = _c === void 0 ? "sworn_declaration" : _c, _d = _a.declarationText, declarationText = _d === void 0 ? "Declaro bajo juramento ante la Dirección del Trabajo, que los antecedentes entregados son verídicos y que corresponden a la realidad. De ser falsa la presente declaración me hará incurrir en las penas establecidas en el artículo 210 del Código Penal." : _d, _e = _a.checked, checked = _e === void 0 ? false : _e, onChange = _a.onChange, _f = _a.required, required = _f === void 0 ? true : _f, _g = _a.disabled, disabled = _g === void 0 ? false : _g, _h = _a.className, className = _h === void 0 ? "" : _h, error = _a.error;
+    var _j = React.useState(checked), isChecked = _j[0], setIsChecked = _j[1];
     var handleCheckboxChange = function (e) {
         var newChecked = e.target.checked;
         setIsChecked(newChecked);
         if (onChange) {
             onChange({
                 target: {
-                    name: "sworn_declaration",
+                    name: name,
                     value: newChecked,
                     type: "declaration",
                 },
@@ -34383,7 +34383,7 @@ var SwornDeclaration = function (_a) {
                     fontWeight: 500,
                     fontSize: "14px",
                     lineHeight: "16px",
-                }, children: title }), jsxRuntime.jsxs("div", { className: "flex items-start gap-3", children: [jsxRuntime.jsx("input", { type: "checkbox", id: "sworn-declaration", checked: isChecked, onChange: handleCheckboxChange, disabled: disabled, required: required, className: "mt-1 w-4 h-4 text-blue-600 bg-white border-gray-800 rounded focus:ring-blue-500 focus:ring-2 border-2 ".concat(disabled ? "cursor-not-allowed opacity-50" : "cursor-pointer") }), jsxRuntime.jsx("label", { htmlFor: "sworn-declaration", className: "text-sm text-gray-700 leading-relaxed ".concat(disabled ? "cursor-not-allowed opacity-50" : "cursor-pointer"), children: declarationText })] }), error && !isChecked && (jsxRuntime.jsx("p", { className: "text-red-500 text-sm font-bold mt-2", children: "Debe aceptar la declaraci\u00F3n jurada para continuar" }))] }));
+                }, children: title }), jsxRuntime.jsxs("div", { className: "flex items-start gap-3", children: [jsxRuntime.jsx("input", { type: "checkbox", id: "sworn-declaration", name: name, checked: isChecked, onChange: handleCheckboxChange, disabled: disabled, required: required, className: "mt-1 w-4 h-4 text-blue-600 bg-white border-gray-800 rounded focus:ring-blue-500 focus:ring-2 border-2 ".concat(disabled ? "cursor-not-allowed opacity-50" : "cursor-pointer") }), jsxRuntime.jsx("label", { htmlFor: "sworn-declaration", className: "text-sm text-gray-700 leading-relaxed ".concat(disabled ? "cursor-not-allowed opacity-50" : "cursor-pointer"), children: declarationText })] }), error && !isChecked && (jsxRuntime.jsx("p", { className: "text-red-500 text-sm font-bold mt-2", children: "Debe aceptar la declaraci\u00F3n jurada para continuar" }))] }));
 };
 
 var StatusScreen = function (_a) {
@@ -34391,28 +34391,28 @@ var StatusScreen = function (_a) {
     var getStatusStyles = function () {
         switch (type) {
             case "success":
-                return "bg-green-50 border-green-200 text-green-800";
+                return "";
             case "error":
-                return "bg-red-50 border-red-200 text-red-800";
+                return "";
             case "warning":
-                return "bg-yellow-50 border-yellow-200 text-yellow-800";
+                return "";
             default:
-                return "bg-blue-50 border-blue-200 text-blue-800";
+                return "";
         }
     };
     var getIcon = function () {
         switch (type) {
             case "success":
-                return (jsxRuntime.jsx("svg", { className: "w-12 h-12 text-green-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" }) }));
+                return (jsxRuntime.jsx("svg", { className: "w-28 h-28 text-green-500", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" }) }));
             case "error":
-                return (jsxRuntime.jsx("svg", { className: "w-12 h-12 text-red-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" }) }));
+                return (jsxRuntime.jsx("svg", { className: "w-28 h-28 text-red-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z" }) }));
             case "warning":
-                return (jsxRuntime.jsx("svg", { className: "w-12 h-12 text-yellow-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L3.732 16.5c-.77.833.192 2.5 1.732 2.5z" }) }));
+                return (jsxRuntime.jsx("svg", { className: "w-28 h-28 text-yellow-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L3.732 16.5c-.77.833.192 2.5 1.732 2.5z" }) }));
             default:
-                return (jsxRuntime.jsx("svg", { className: "w-12 h-12 text-blue-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }) }));
+                return (jsxRuntime.jsx("svg", { className: "w-28 h-28 text-blue-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }) }));
         }
     };
-    return (jsxRuntime.jsx("div", { className: "col-span-12", children: jsxRuntime.jsxs("div", { className: "flex flex-col items-center p-8 border rounded-lg ".concat(getStatusStyles()), children: [jsxRuntime.jsx("div", { className: "mb-4", children: getIcon() }), title && (jsxRuntime.jsx("h2", { className: "text-2xl font-bold text-center mb-4", children: title })), message && jsxRuntime.jsx("p", { className: "text-center mb-6 max-w-md", children: message }), (leftButton || rightButton) && (jsxRuntime.jsxs("div", { className: "flex space-x-4", children: [leftButton && (jsxRuntime.jsx("button", { onClick: leftButton.onClick, className: "px-6 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-gray-500", children: leftButton.label })), rightButton && (jsxRuntime.jsx("button", { onClick: rightButton.onClick, className: "px-6 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500", children: rightButton.label }))] }))] }) }));
+    return (jsxRuntime.jsx("div", { className: "col-span-12", children: jsxRuntime.jsxs("div", { className: "flex flex-col items-center p-8  ".concat(getStatusStyles()), children: [jsxRuntime.jsx("div", { className: "mb-4", children: getIcon() }), title && (jsxRuntime.jsx("h2", { className: "text-2xl font-bold text-center mb-4", children: title })), message && jsxRuntime.jsx("p", { className: "text-center mb-6 max-w-md", children: message }), (leftButton || rightButton) && (jsxRuntime.jsxs("div", { className: "flex space-x-4", children: [leftButton && (jsxRuntime.jsx("button", { onClick: leftButton.onClick, className: "px-6 py-2 border border-gray-300 rounded-md text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-gray-500", children: leftButton.label })), rightButton && (jsxRuntime.jsx("button", { onClick: rightButton.onClick, className: "px-6 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500", children: rightButton.label }))] }))] }) }));
 };
 
 var DynamicInput = function (_a) {
@@ -36576,50 +36576,60 @@ create$3.prototype = ObjectSchema.prototype;
 
 var createValidationSchema = function (fields) {
     var schema = {};
-    fields.forEach(function (field) {
+    // Filtrar campos válidos antes de procesarlos
+    var validFields = fields.filter(function (_a) {
+        var _b = _a.validate, validate = _b === void 0 ? true : _b, _c = _a.name, name = _c === void 0 ? null : _c, type = _a.type;
         // Excluir campos que no tienen name o son de tipos especiales
-        if (!field.name ||
-            ['subtitle', 'alert', 'status'].includes(field.type)) {
-            return;
+        if (!name || ["subtitle", "alert", "status"].includes(type)) {
+            return false;
+        }
+        // Excluir campos que tienen validate: false
+        if (!validate) {
+            return false;
         }
+        return true;
+    });
+    validFields.forEach(function (field) {
         if (field.validations && field.validations.length > 0) {
             var fieldSchema_1 = create$6();
             field.validations.forEach(function (validation) {
                 switch (validation.type) {
-                    case 'required':
-                        fieldSchema_1 = fieldSchema_1.required(validation.params[0] || 'Este campo es requerido');
+                    case "required":
+                        fieldSchema_1 = fieldSchema_1.required(validation.params[0] ||
+                            "El campo ".concat(field.label || field.name || "sin nombre", " es requerido"));
                         break;
-                    case 'min':
+                    case "min":
                         var minLength = parseInt(validation.params[0]);
                         var minMessage = validation.params[1] || "M\u00EDnimo ".concat(minLength, " caracteres");
                         fieldSchema_1 = fieldSchema_1.min(minLength, minMessage);
                         break;
-                    case 'max':
+                    case "max":
                         var maxLength = parseInt(validation.params[0]);
                         var maxMessage = validation.params[1] || "M\u00E1ximo ".concat(maxLength, " caracteres");
                         fieldSchema_1 = fieldSchema_1.max(maxLength, maxMessage);
                         break;
-                    case 'email':
-                        var emailMessage = validation.params[0] || 'Email inválido';
+                    case "email":
+                        var emailMessage = validation.params[0] || "Email inválido";
                         fieldSchema_1 = fieldSchema_1.email(emailMessage);
                         break;
-                    case 'pattern':
+                    case "pattern":
                         var pattern = new RegExp(validation.params[0]);
-                        var patternMessage = validation.params[1] || 'Formato inválido';
+                        var patternMessage = validation.params[1] || "Formato inválido";
                         fieldSchema_1 = fieldSchema_1.matches(pattern, patternMessage);
                         break;
-                    case 'custom':
+                    case "custom":
                         // Para validaciones personalizadas
                         var customValidator = validation.params[0];
-                        if (customValidator === 'rut') {
-                            fieldSchema_1 = fieldSchema_1.test('rut', validation.params[1] || 'RUT inválido', function (value) {
+                        if (customValidator === "rut") {
+                            fieldSchema_1 = fieldSchema_1.test("rut", validation.params[1] || "RUT inválido", function (value) {
                                 if (!value)
                                     return true; // Si está vacío, la validación required se encargará
                                 return validate(clean(value));
                             });
                         }
                         else {
-                            fieldSchema_1 = fieldSchema_1.test('custom', validation.params[1] || 'Validación fallida', function (value) {
+                            fieldSchema_1 = fieldSchema_1.test("custom", validation.params[1] ||
+                                "Validaci\u00F3n fallida para ".concat(field.label || field.name || "sin nombre"), function (value) {
                                 // Aquí puedes implementar lógica personalizada
                                 return value; // Por defecto pasa la validación
                             });
@@ -36631,7 +36641,7 @@ var createValidationSchema = function (fields) {
         }
         else if (field.required) {
             // Validación básica de requerido si no hay validaciones específicas
-            schema[field.name] = create$6().required("El campo ".concat(field.label, " es requerido"));
+            schema[field.name] = create$6().required("El campo ".concat(field.label || field.name || "sin nombre", " es requerido"));
         }
     });
     return create$3().shape(schema);
@@ -36639,24 +36649,24 @@ var createValidationSchema = function (fields) {
 // Validaciones predefinidas
 var commonValidations = {
     required: function (message) { return ({
-        type: 'required',
-        params: [message || 'Este campo es requerido'],
+        type: "required",
+        params: [message || "Este campo es requerido"],
     }); },
     min: function (length, message) { return ({
-        type: 'min',
+        type: "min",
         params: [length.toString(), message || "M\u00EDnimo ".concat(length, " caracteres")],
     }); },
     max: function (length, message) { return ({
-        type: 'max',
+        type: "max",
         params: [length.toString(), message || "M\u00E1ximo ".concat(length, " caracteres")],
     }); },
     email: function (message) { return ({
-        type: 'email',
-        params: [message || 'Email inválido'],
+        type: "email",
+        params: [message || "Email inválido"],
     }); },
     pattern: function (regex, message) { return ({
-        type: 'pattern',
-        params: [regex, message || 'Formato inválido'],
+        type: "pattern",
+        params: [regex, message || "Formato inválido"],
     }); },
 };
 

package/dist/types/index.d.ts

@@ -1,8 +1,8 @@
-import React from 'react';
+import React from "react";
 export interface IFormField {
     id: string;
-    name: string;
-    type: 'radio' | 'text' | 'select' | 'textarea' | 'checkbox' | 'rut' | 'address' | 'subtitle' | 'alert' | 'date' | 'declaration' | 'status';
+    name: string | null;
+    type: "radio" | "text" | "select" | "textarea" | "checkbox" | "rut" | "address" | "subtitle" | "alert" | "date" | "declaration" | "status";
     label: string;
     value?: string | number | null;
     options?: Array<{
@@ -16,6 +16,7 @@ export interface IFormField {
     minLength?: number;
     maxLength?: number;
     className?: string;
+    validate?: boolean;
     onSearch?: (value: string | any) => void;
     onAddressChange?: (address: any) => void;
     showMap?: boolean;
@@ -25,7 +26,7 @@ export interface IFormField {
         message?: string;
     };
     validations?: Array<{
-        type: 'required' | 'min' | 'max' | 'email' | 'pattern' | 'custom';
+        type: "required" | "min" | "max" | "email" | "pattern" | "custom";
         params: string[];
     }>;
     tooltip?: string;
@@ -40,7 +41,7 @@ export interface IFormConfig {
     showInfoAlert?: boolean;
     steps?: any;
     infoMessage?: {
-        type: string | 'info' | 'warning' | 'error';
+        type: string | "info" | "warning" | "error";
         message: string | null;
     };
     fields: IFormField[];
@@ -48,7 +49,7 @@ export interface IFormConfig {
         containerClass?: string;
         buttons?: {
             key: string;
-            direction: string | 'next' | 'back' | 'success' | 'guardar' | 'out';
+            direction: string | "next" | "back" | "success" | "guardar" | "out";
             label: string;
             onClick: string;
             show: boolean;
@@ -80,7 +81,7 @@ export interface ResponseOnSearch {
     nextStep?: string | null;
 }
 export interface NavigationButtonProps {
-    direction: 'default' | 'next' | 'back' | 'success' | 'guardar' | 'out' | 'out-light';
+    direction: "default" | "next" | "back" | "success" | "guardar" | "out" | "out-light";
     onClick: (e: React.FormEvent) => void;
     disabled?: boolean;
     label?: string;
@@ -106,7 +107,7 @@ export interface StepperContextType {
     currentDate: Date | null;
 }
 export interface ValidationRule {
-    type: 'required' | 'min' | 'max' | 'email' | 'pattern' | 'custom';
+    type: "required" | "min" | "max" | "email" | "pattern" | "custom";
     params: string[];
 }
 export interface CommonValidations {

package/dist/utils/validationSchemas.d.ts

@@ -1,5 +1,5 @@
-import * as Yup from 'yup';
-import { IFormField, CommonValidations } from '../types';
+import * as Yup from "yup";
+import { IFormField, CommonValidations } from "../types";
 export declare const createValidationSchema: (fields: IFormField[]) => Yup.ObjectSchema<{
     [x: string]: any;
 }, Yup.AnyObject, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@visiion/forms-library",
-  "version": "1.1.4",
+  "version": "1.1.5",
   "description": "Librería de componentes de formularios reutilizables",
   "type": "module",
   "main": "dist/index.js",