@visiion/forms-library 1.1.4 → 1.1.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/components/Inputs/SubtitleInput.d.ts +1 -0
  2. package/dist/components/Inputs/SwornDeclaration.d.ts +1 -0
  3. package/dist/index.esm.js +50 -41
  4. package/dist/index.js +50 -41
  5. package/dist/types/index.d.ts +8 -7
  6. package/dist/utils/validationSchemas.d.ts +2 -2
  7. package/package.json +1 -1
package/dist/components/Inputs/SubtitleInput.d.ts CHANGED
@@ -3,6 +3,7 @@ interface SubtitleInputProps {
3
3
  title?: string;
4
4
  description?: string;
5
5
  className?: string;
6
+ textClassName?: string;
6
7
  }
7
8
  declare const SubtitleInput: React.FC<SubtitleInputProps>;
8
9
  export default SubtitleInput;
package/dist/components/Inputs/SwornDeclaration.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import React from "react";
2
2
  interface SwornDeclarationProps {
3
3
  title?: string;
4
+ name?: string;
4
5
  declarationText?: string;
5
6
  checked?: boolean;
6
7
  onChange?: (checked: boolean) => void;
package/dist/index.esm.js CHANGED
@@ -34283,7 +34283,6 @@ var AddressInput = function (_a) {
34283
34283
  var libraries = ["places"];
34284
34284
  var GoogleMaps = function (_a) {
34285
34285
  var children = _a.children, _b = _a.apiKey, apiKey = _b === void 0 ? "" : _b;
34286
- console.log('apiKey', apiKey);
34287
34286
  var _c = useJsApiLoader({
34288
34287
  googleMapsApiKey: apiKey,
34289
34288
  libraries: libraries,
@@ -34298,8 +34297,8 @@ var GoogleMaps = function (_a) {
34298
34297
  };
34299
34298
 
34300
34299
  var SubtitleInput = function (_a) {
34301
- var title = _a.title, description = _a.description, _b = _a.className, className = _b === void 0 ? "" : _b;
34302
- 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" })] }));
34300
+ 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;
34301
+ 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" })] }));
34303
34302
  };
34304
34303
 
34305
34304
  // THIS FILE IS AUTO GENERATED
@@ -34342,15 +34341,15 @@ var DatePicker = function (_a) {
34342
34341
  };
34343
34342
 
34344
34343
  var SwornDeclaration = function (_a) {
34345
- 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;
34346
- var _h = useState(checked), isChecked = _h[0], setIsChecked = _h[1];
34344
+ 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;
34345
+ var _j = useState(checked), isChecked = _j[0], setIsChecked = _j[1];
34347
34346
  var handleCheckboxChange = function (e) {
34348
34347
  var newChecked = e.target.checked;
34349
34348
  setIsChecked(newChecked);
34350
34349
  if (onChange) {
34351
34350
  onChange({
34352
34351
  target: {
34353
- name: "sworn_declaration",
34352
+ name: name,
34354
34353
  value: newChecked,
34355
34354
  type: "declaration",
34356
34355
  },
@@ -34363,7 +34362,7 @@ var SwornDeclaration = function (_a) {
34363
34362
  fontWeight: 500,
34364
34363
  fontSize: "14px",
34365
34364
  lineHeight: "16px",
34366
- }, 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" }))] }));
34365
+ }, 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" }))] }));
34367
34366
  };
34368
34367
 
34369
34368
  var StatusScreen = function (_a) {
@@ -34371,28 +34370,28 @@ var StatusScreen = function (_a) {
34371
34370
  var getStatusStyles = function () {
34372
34371
  switch (type) {
34373
34372
  case "success":
34374
- return "bg-green-50 border-green-200 text-green-800";
34373
+ return "";
34375
34374
  case "error":
34376
- return "bg-red-50 border-red-200 text-red-800";
34375
+ return "";
34377
34376
  case "warning":
34378
- return "bg-yellow-50 border-yellow-200 text-yellow-800";
34377
+ return "";
34379
34378
  default:
34380
- return "bg-blue-50 border-blue-200 text-blue-800";
34379
+ return "";
34381
34380
  }
34382
34381
  };
34383
34382
  var getIcon = function () {
34384
34383
  switch (type) {
34385
34384
  case "success":
34386
- 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" }) }));
34385
+ 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" }) }));
34387
34386
  case "error":
34388
- 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" }) }));
34387
+ 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" }) }));
34389
34388
  case "warning":
34390
- 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" }) }));
34389
+ 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" }) }));
34391
34390
  default:
34392
- 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" }) }));
34391
+ 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" }) }));
34393
34392
  }
34394
34393
  };
34395
- 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 }))] }))] }) }));
34394
+ 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 }))] }))] }) }));
34396
34395
  };
34397
34396
 
34398
34397
  var DynamicInput = function (_a) {
@@ -36556,50 +36555,60 @@ create$3.prototype = ObjectSchema.prototype;
36556
36555
 
36557
36556
  var createValidationSchema = function (fields) {
36558
36557
  var schema = {};
36559
- fields.forEach(function (field) {
36558
+ // Filtrar campos válidos antes de procesarlos
36559
+ var validFields = fields.filter(function (_a) {
36560
+ var _b = _a.validate, validate = _b === void 0 ? true : _b, name = _a.name, type = _a.type;
36560
36561
  // Excluir campos que no tienen name o son de tipos especiales
36561
- if (!field.name ||
36562
- ['subtitle', 'alert', 'status'].includes(field.type)) {
36563
- return;
36562
+ if (!name || ["subtitle", "alert", "status"].includes(type)) {
36563
+ return false;
36564
+ }
36565
+ // Excluir campos que tienen validate: false
36566
+ if (!validate) {
36567
+ return false;
36564
36568
  }
36569
+ return true;
36570
+ });
36571
+ validFields.forEach(function (field) {
36565
36572
  if (field.validations && field.validations.length > 0) {
36566
36573
  var fieldSchema_1 = create$6();
36567
36574
  field.validations.forEach(function (validation) {
36568
36575
  switch (validation.type) {
36569
- case 'required':
36570
- fieldSchema_1 = fieldSchema_1.required(validation.params[0] || 'Este campo es requerido');
36576
+ case "required":
36577
+ fieldSchema_1 = fieldSchema_1.required(validation.params[0] ||
36578
+ "El campo ".concat(field.label || field.name || "sin nombre", " es requerido"));
36571
36579
  break;
36572
- case 'min':
36580
+ case "min":
36573
36581
  var minLength = parseInt(validation.params[0]);
36574
36582
  var minMessage = validation.params[1] || "M\u00EDnimo ".concat(minLength, " caracteres");
36575
36583
  fieldSchema_1 = fieldSchema_1.min(minLength, minMessage);
36576
36584
  break;
36577
- case 'max':
36585
+ case "max":
36578
36586
  var maxLength = parseInt(validation.params[0]);
36579
36587
  var maxMessage = validation.params[1] || "M\u00E1ximo ".concat(maxLength, " caracteres");
36580
36588
  fieldSchema_1 = fieldSchema_1.max(maxLength, maxMessage);
36581
36589
  break;
36582
- case 'email':
36583
- var emailMessage = validation.params[0] || 'Email inválido';
36590
+ case "email":
36591
+ var emailMessage = validation.params[0] || "Email inválido";
36584
36592
  fieldSchema_1 = fieldSchema_1.email(emailMessage);
36585
36593
  break;
36586
- case 'pattern':
36594
+ case "pattern":
36587
36595
  var pattern = new RegExp(validation.params[0]);
36588
- var patternMessage = validation.params[1] || 'Formato inválido';
36596
+ var patternMessage = validation.params[1] || "Formato inválido";
36589
36597
  fieldSchema_1 = fieldSchema_1.matches(pattern, patternMessage);
36590
36598
  break;
36591
- case 'custom':
36599
+ case "custom":
36592
36600
  // Para validaciones personalizadas
36593
36601
  var customValidator = validation.params[0];
36594
- if (customValidator === 'rut') {
36595
- fieldSchema_1 = fieldSchema_1.test('rut', validation.params[1] || 'RUT inválido', function (value) {
36602
+ if (customValidator === "rut") {
36603
+ fieldSchema_1 = fieldSchema_1.test("rut", validation.params[1] || "RUT inválido", function (value) {
36596
36604
  if (!value)
36597
36605
  return true; // Si está vacío, la validación required se encargará
36598
36606
  return validate(clean(value));
36599
36607
  });
36600
36608
  }
36601
36609
  else {
36602
- fieldSchema_1 = fieldSchema_1.test('custom', validation.params[1] || 'Validación fallida', function (value) {
36610
+ fieldSchema_1 = fieldSchema_1.test("custom", validation.params[1] ||
36611
+ "Validaci\u00F3n fallida para ".concat(field.label || field.name || "sin nombre"), function (value) {
36603
36612
  // Aquí puedes implementar lógica personalizada
36604
36613
  return value; // Por defecto pasa la validación
36605
36614
  });
@@ -36611,7 +36620,7 @@ var createValidationSchema = function (fields) {
36611
36620
  }
36612
36621
  else if (field.required) {
36613
36622
  // Validación básica de requerido si no hay validaciones específicas
36614
- schema[field.name] = create$6().required("El campo ".concat(field.label, " es requerido"));
36623
+ schema[field.name] = create$6().required("El campo ".concat(field.label || field.name || "sin nombre", " es requerido"));
36615
36624
  }
36616
36625
  });
36617
36626
  return create$3().shape(schema);
@@ -36619,24 +36628,24 @@ var createValidationSchema = function (fields) {
36619
36628
  // Validaciones predefinidas
36620
36629
  var commonValidations = {
36621
36630
  required: function (message) { return ({
36622
- type: 'required',
36623
- params: [message || 'Este campo es requerido'],
36631
+ type: "required",
36632
+ params: [message || "Este campo es requerido"],
36624
36633
  }); },
36625
36634
  min: function (length, message) { return ({
36626
- type: 'min',
36635
+ type: "min",
36627
36636
  params: [length.toString(), message || "M\u00EDnimo ".concat(length, " caracteres")],
36628
36637
  }); },
36629
36638
  max: function (length, message) { return ({
36630
- type: 'max',
36639
+ type: "max",
36631
36640
  params: [length.toString(), message || "M\u00E1ximo ".concat(length, " caracteres")],
36632
36641
  }); },
36633
36642
  email: function (message) { return ({
36634
- type: 'email',
36635
- params: [message || 'Email inválido'],
36643
+ type: "email",
36644
+ params: [message || "Email inválido"],
36636
36645
  }); },
36637
36646
  pattern: function (regex, message) { return ({
36638
- type: 'pattern',
36639
- params: [regex, message || 'Formato inválido'],
36647
+ type: "pattern",
36648
+ params: [regex, message || "Formato inválido"],
36640
36649
  }); },
36641
36650
  };
36642
36651
 
package/dist/index.js CHANGED
@@ -34303,7 +34303,6 @@ var AddressInput = function (_a) {
34303
34303
  var libraries = ["places"];
34304
34304
  var GoogleMaps = function (_a) {
34305
34305
  var children = _a.children, _b = _a.apiKey, apiKey = _b === void 0 ? "" : _b;
34306
- console.log('apiKey', apiKey);
34307
34306
  var _c = useJsApiLoader({
34308
34307
  googleMapsApiKey: apiKey,
34309
34308
  libraries: libraries,
@@ -34318,8 +34317,8 @@ var GoogleMaps = function (_a) {
34318
34317
  };
34319
34318
 
34320
34319
  var SubtitleInput = function (_a) {
34321
- var title = _a.title, description = _a.description, _b = _a.className, className = _b === void 0 ? "" : _b;
34322
- 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" })] }));
34320
+ 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;
34321
+ 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" })] }));
34323
34322
  };
34324
34323
 
34325
34324
  // THIS FILE IS AUTO GENERATED
@@ -34362,15 +34361,15 @@ var DatePicker = function (_a) {
34362
34361
  };
34363
34362
 
34364
34363
  var SwornDeclaration = function (_a) {
34365
- 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;
34366
- var _h = React.useState(checked), isChecked = _h[0], setIsChecked = _h[1];
34364
+ 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;
34365
+ var _j = React.useState(checked), isChecked = _j[0], setIsChecked = _j[1];
34367
34366
  var handleCheckboxChange = function (e) {
34368
34367
  var newChecked = e.target.checked;
34369
34368
  setIsChecked(newChecked);
34370
34369
  if (onChange) {
34371
34370
  onChange({
34372
34371
  target: {
34373
- name: "sworn_declaration",
34372
+ name: name,
34374
34373
  value: newChecked,
34375
34374
  type: "declaration",
34376
34375
  },
@@ -34383,7 +34382,7 @@ var SwornDeclaration = function (_a) {
34383
34382
  fontWeight: 500,
34384
34383
  fontSize: "14px",
34385
34384
  lineHeight: "16px",
34386
- }, 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" }))] }));
34385
+ }, 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" }))] }));
34387
34386
  };
34388
34387
 
34389
34388
  var StatusScreen = function (_a) {
@@ -34391,28 +34390,28 @@ var StatusScreen = function (_a) {
34391
34390
  var getStatusStyles = function () {
34392
34391
  switch (type) {
34393
34392
  case "success":
34394
- return "bg-green-50 border-green-200 text-green-800";
34393
+ return "";
34395
34394
  case "error":
34396
- return "bg-red-50 border-red-200 text-red-800";
34395
+ return "";
34397
34396
  case "warning":
34398
- return "bg-yellow-50 border-yellow-200 text-yellow-800";
34397
+ return "";
34399
34398
  default:
34400
- return "bg-blue-50 border-blue-200 text-blue-800";
34399
+ return "";
34401
34400
  }
34402
34401
  };
34403
34402
  var getIcon = function () {
34404
34403
  switch (type) {
34405
34404
  case "success":
34406
- 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" }) }));
34405
+ 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" }) }));
34407
34406
  case "error":
34408
- 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" }) }));
34407
+ 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" }) }));
34409
34408
  case "warning":
34410
- 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" }) }));
34409
+ 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" }) }));
34411
34410
  default:
34412
- 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" }) }));
34411
+ 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" }) }));
34413
34412
  }
34414
34413
  };
34415
- 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 }))] }))] }) }));
34414
+ 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 }))] }))] }) }));
34416
34415
  };
34417
34416
 
34418
34417
  var DynamicInput = function (_a) {
@@ -36576,50 +36575,60 @@ create$3.prototype = ObjectSchema.prototype;
36576
36575
 
36577
36576
  var createValidationSchema = function (fields) {
36578
36577
  var schema = {};
36579
- fields.forEach(function (field) {
36578
+ // Filtrar campos válidos antes de procesarlos
36579
+ var validFields = fields.filter(function (_a) {
36580
+ var _b = _a.validate, validate = _b === void 0 ? true : _b, name = _a.name, type = _a.type;
36580
36581
  // Excluir campos que no tienen name o son de tipos especiales
36581
- if (!field.name ||
36582
- ['subtitle', 'alert', 'status'].includes(field.type)) {
36583
- return;
36582
+ if (!name || ["subtitle", "alert", "status"].includes(type)) {
36583
+ return false;
36584
+ }
36585
+ // Excluir campos que tienen validate: false
36586
+ if (!validate) {
36587
+ return false;
36584
36588
  }
36589
+ return true;
36590
+ });
36591
+ validFields.forEach(function (field) {
36585
36592
  if (field.validations && field.validations.length > 0) {
36586
36593
  var fieldSchema_1 = create$6();
36587
36594
  field.validations.forEach(function (validation) {
36588
36595
  switch (validation.type) {
36589
- case 'required':
36590
- fieldSchema_1 = fieldSchema_1.required(validation.params[0] || 'Este campo es requerido');
36596
+ case "required":
36597
+ fieldSchema_1 = fieldSchema_1.required(validation.params[0] ||
36598
+ "El campo ".concat(field.label || field.name || "sin nombre", " es requerido"));
36591
36599
  break;
36592
- case 'min':
36600
+ case "min":
36593
36601
  var minLength = parseInt(validation.params[0]);
36594
36602
  var minMessage = validation.params[1] || "M\u00EDnimo ".concat(minLength, " caracteres");
36595
36603
  fieldSchema_1 = fieldSchema_1.min(minLength, minMessage);
36596
36604
  break;
36597
- case 'max':
36605
+ case "max":
36598
36606
  var maxLength = parseInt(validation.params[0]);
36599
36607
  var maxMessage = validation.params[1] || "M\u00E1ximo ".concat(maxLength, " caracteres");
36600
36608
  fieldSchema_1 = fieldSchema_1.max(maxLength, maxMessage);
36601
36609
  break;
36602
- case 'email':
36603
- var emailMessage = validation.params[0] || 'Email inválido';
36610
+ case "email":
36611
+ var emailMessage = validation.params[0] || "Email inválido";
36604
36612
  fieldSchema_1 = fieldSchema_1.email(emailMessage);
36605
36613
  break;
36606
- case 'pattern':
36614
+ case "pattern":
36607
36615
  var pattern = new RegExp(validation.params[0]);
36608
- var patternMessage = validation.params[1] || 'Formato inválido';
36616
+ var patternMessage = validation.params[1] || "Formato inválido";
36609
36617
  fieldSchema_1 = fieldSchema_1.matches(pattern, patternMessage);
36610
36618
  break;
36611
- case 'custom':
36619
+ case "custom":
36612
36620
  // Para validaciones personalizadas
36613
36621
  var customValidator = validation.params[0];
36614
- if (customValidator === 'rut') {
36615
- fieldSchema_1 = fieldSchema_1.test('rut', validation.params[1] || 'RUT inválido', function (value) {
36622
+ if (customValidator === "rut") {
36623
+ fieldSchema_1 = fieldSchema_1.test("rut", validation.params[1] || "RUT inválido", function (value) {
36616
36624
  if (!value)
36617
36625
  return true; // Si está vacío, la validación required se encargará
36618
36626
  return validate(clean(value));
36619
36627
  });
36620
36628
  }
36621
36629
  else {
36622
- fieldSchema_1 = fieldSchema_1.test('custom', validation.params[1] || 'Validación fallida', function (value) {
36630
+ fieldSchema_1 = fieldSchema_1.test("custom", validation.params[1] ||
36631
+ "Validaci\u00F3n fallida para ".concat(field.label || field.name || "sin nombre"), function (value) {
36623
36632
  // Aquí puedes implementar lógica personalizada
36624
36633
  return value; // Por defecto pasa la validación
36625
36634
  });
@@ -36631,7 +36640,7 @@ var createValidationSchema = function (fields) {
36631
36640
  }
36632
36641
  else if (field.required) {
36633
36642
  // Validación básica de requerido si no hay validaciones específicas
36634
- schema[field.name] = create$6().required("El campo ".concat(field.label, " es requerido"));
36643
+ schema[field.name] = create$6().required("El campo ".concat(field.label || field.name || "sin nombre", " es requerido"));
36635
36644
  }
36636
36645
  });
36637
36646
  return create$3().shape(schema);
@@ -36639,24 +36648,24 @@ var createValidationSchema = function (fields) {
36639
36648
  // Validaciones predefinidas
36640
36649
  var commonValidations = {
36641
36650
  required: function (message) { return ({
36642
- type: 'required',
36643
- params: [message || 'Este campo es requerido'],
36651
+ type: "required",
36652
+ params: [message || "Este campo es requerido"],
36644
36653
  }); },
36645
36654
  min: function (length, message) { return ({
36646
- type: 'min',
36655
+ type: "min",
36647
36656
  params: [length.toString(), message || "M\u00EDnimo ".concat(length, " caracteres")],
36648
36657
  }); },
36649
36658
  max: function (length, message) { return ({
36650
- type: 'max',
36659
+ type: "max",
36651
36660
  params: [length.toString(), message || "M\u00E1ximo ".concat(length, " caracteres")],
36652
36661
  }); },
36653
36662
  email: function (message) { return ({
36654
- type: 'email',
36655
- params: [message || 'Email inválido'],
36663
+ type: "email",
36664
+ params: [message || "Email inválido"],
36656
36665
  }); },
36657
36666
  pattern: function (regex, message) { return ({
36658
- type: 'pattern',
36659
- params: [regex, message || 'Formato inválido'],
36667
+ type: "pattern",
36668
+ params: [regex, message || "Formato inválido"],
36660
36669
  }); },
36661
36670
  };
36662
36671
 
package/dist/types/index.d.ts CHANGED
@@ -1,8 +1,8 @@
1
- import React from 'react';
1
+ import React from "react";
2
2
  export interface IFormField {
3
3
  id: string;
4
4
  name: string;
5
- type: 'radio' | 'text' | 'select' | 'textarea' | 'checkbox' | 'rut' | 'address' | 'subtitle' | 'alert' | 'date' | 'declaration' | 'status';
5
+ type: "radio" | "text" | "select" | "textarea" | "checkbox" | "rut" | "address" | "subtitle" | "alert" | "date" | "declaration" | "status";
6
6
  label: string;
7
7
  value?: string | number | null;
8
8
  options?: Array<{
@@ -16,6 +16,7 @@ export interface IFormField {
16
16
  minLength?: number;
17
17
  maxLength?: number;
18
18
  className?: string;
19
+ validate?: boolean;
19
20
  onSearch?: (value: string | any) => void;
20
21
  onAddressChange?: (address: any) => void;
21
22
  showMap?: boolean;
@@ -25,7 +26,7 @@ export interface IFormField {
25
26
  message?: string;
26
27
  };
27
28
  validations?: Array<{
28
- type: 'required' | 'min' | 'max' | 'email' | 'pattern' | 'custom';
29
+ type: "required" | "min" | "max" | "email" | "pattern" | "custom";
29
30
  params: string[];
30
31
  }>;
31
32
  tooltip?: string;
@@ -40,7 +41,7 @@ export interface IFormConfig {
40
41
  showInfoAlert?: boolean;
41
42
  steps?: any;
42
43
  infoMessage?: {
43
- type: string | 'info' | 'warning' | 'error';
44
+ type: string | "info" | "warning" | "error";
44
45
  message: string | null;
45
46
  };
46
47
  fields: IFormField[];
@@ -48,7 +49,7 @@ export interface IFormConfig {
48
49
  containerClass?: string;
49
50
  buttons?: {
50
51
  key: string;
51
- direction: string | 'next' | 'back' | 'success' | 'guardar' | 'out';
52
+ direction: string | "next" | "back" | "success" | "guardar" | "out";
52
53
  label: string;
53
54
  onClick: string;
54
55
  show: boolean;
@@ -80,7 +81,7 @@ export interface ResponseOnSearch {
80
81
  nextStep?: string | null;
81
82
  }
82
83
  export interface NavigationButtonProps {
83
- direction: 'default' | 'next' | 'back' | 'success' | 'guardar' | 'out' | 'out-light';
84
+ direction: "default" | "next" | "back" | "success" | "guardar" | "out" | "out-light";
84
85
  onClick: (e: React.FormEvent) => void;
85
86
  disabled?: boolean;
86
87
  label?: string;
@@ -106,7 +107,7 @@ export interface StepperContextType {
106
107
  currentDate: Date | null;
107
108
  }
108
109
  export interface ValidationRule {
109
- type: 'required' | 'min' | 'max' | 'email' | 'pattern' | 'custom';
110
+ type: "required" | "min" | "max" | "email" | "pattern" | "custom";
110
111
  params: string[];
111
112
  }
112
113
  export interface CommonValidations {
package/dist/utils/validationSchemas.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import * as Yup from 'yup';
2
- import { IFormField, CommonValidations } from '../types';
1
+ import * as Yup from "yup";
2
+ import { IFormField, CommonValidations } from "../types";
3
3
  export declare const createValidationSchema: (fields: IFormField[]) => Yup.ObjectSchema<{
4
4
  [x: string]: any;
5
5
  }, Yup.AnyObject, {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@visiion/forms-library",
3
- "version": "1.1.4",
3
+ "version": "1.1.6",
4
4
  "description": "Librería de componentes de formularios reutilizables",
5
5
  "type": "module",
6
6
  "main": "dist/index.js",