easy-forms-core 1.0.11 → 1.1.0

package/dist/easy-form.js

@@ -2019,6 +2019,26 @@ var StateManager = class {
     }
     return allFields;
   }
+  /**
+   * Encuentra el path completo de un campo dentro de grupos
+   */
+  findFieldPath(fieldName, fields, parentPath = "") {
+    for (const field of fields) {
+      const currentPath = parentPath ? `${parentPath}.${field.name}` : field.name;
+      if (field.name === fieldName) {
+        return currentPath;
+      }
+      if (field.type === "group" && "fields" in field) {
+        const found = this.findFieldPath(fieldName, field.fields, currentPath);
+        if (found) return found;
+      }
+      if (field.type === "row" && "fields" in field) {
+        const found = this.findFieldPath(fieldName, field.fields, currentPath);
+        if (found) return found;
+      }
+    }
+    return null;
+  }
   /**
    * Construye el mapa de dependencias para optimizar re-evaluaciones
    */
@@ -2201,6 +2221,7 @@ var StateManager = class {
    */
   setValueWithoutValidation(fieldName, value) {
     setNestedValue(this.state.values, fieldName, value);
+    this.invalidateDependencyCache(fieldName);
   }
   /**
    * Valida un campo específico
@@ -2233,6 +2254,13 @@ var StateManager = class {
    */
   getActiveValidations(field) {
     let validations = [...field.validations || []];
+    const isRequired = this.getFieldRequired(field.name);
+    const hasRequiredValidation = validations.some((v) => v.type === "required");
+    if (isRequired && !hasRequiredValidation) {
+      validations = [{ type: "required" }, ...validations];
+    } else if (!isRequired && hasRequiredValidation) {
+      validations = validations.filter((v) => v.type !== "required");
+    }
     if (field.conditionalValidations) {
       for (const conditional of field.conditionalValidations) {
         const conditionMet = this.conditionEngine.evaluateConditions(
@@ -2365,13 +2393,41 @@ var StateManager = class {
     if (!this.schema) return true;
     const topLevelFields = this.schema.isWizard ? this.schema.steps.flatMap((step) => step.fields) : this.schema.fields || [];
     const allFields = this.extractAllFields(topLevelFields);
-    const field = allFields.find((f) => f.name === fieldName);
+    let field = allFields.find((f) => {
+      const fullPath = this.findFieldPath(f.name, topLevelFields);
+      return fullPath === fieldName || f.name === fieldName;
+    });
+    if (!field) {
+      field = allFields.find((f) => f.name === fieldName);
+    }
     if (!field || !field.dependencies) {
       return !field?.hidden;
     }
+    const fieldFullPath = this.findFieldPath(field.name, topLevelFields) || field.name;
+    const groupPath = fieldFullPath.includes(".") ? fieldFullPath.split(".").slice(0, -1).join(".") : "";
+    let valuesContext = { ...this.state.values };
+    if (groupPath && field.dependencies) {
+      const groupValues = getNestedValue(this.state.values, groupPath);
+      if (groupValues && typeof groupValues === "object") {
+        const createRelativeContext = (obj, prefix = "") => {
+          const result2 = {};
+          for (const [key, value] of Object.entries(obj)) {
+            const relativeKey = prefix ? `${prefix}.${key}` : key;
+            if (value && typeof value === "object" && !Array.isArray(value) && value !== null) {
+              Object.assign(result2, createRelativeContext(value, relativeKey));
+            } else {
+              result2[relativeKey] = value;
+            }
+          }
+          return result2;
+        };
+        const relativeContext = createRelativeContext(groupValues);
+        valuesContext = { ...this.state.values, ...relativeContext };
+      }
+    }
     const result = this.conditionEngine.evaluateDependencies(
       field.dependencies,
-      this.state.values
+      valuesContext
     );
     this.dependencyCache.set(fieldName, result);
     return result.visible && !field.hidden;
@@ -2446,7 +2502,15 @@ var BaseInput = class {
    */
   createFieldContainer(input) {
     const container = document.createElement("div");
-    container.className = "easy-form-field";
+    const inputClasses = Array.from(input.classList);
+    const componentContainerClasses = inputClasses.filter(
+      (cls) => cls.startsWith("easy-form-") && cls !== "easy-form-field" && (cls.includes("-container") || cls.includes("-wrapper"))
+    );
+    if (componentContainerClasses.length > 0) {
+      container.className = `easy-form-field ${componentContainerClasses.join(" ")}`;
+    } else {
+      container.className = "easy-form-field";
+    }
     if (this.field.label) {
       const label = document.createElement("label");
       label.className = "easy-form-label";
@@ -2693,7 +2757,18 @@ var MaskEngine = class {
       return value;
     }
     const customMask = this.getCustomMask(mask);
-    const unformatted = this.removeMask(value, mask);
+    const editableTokens = tokens.filter((t) => t.editable);
+    const acceptedTypes = new Set(editableTokens.map((t) => t.type));
+    let unformatted = "";
+    for (const char of value) {
+      if (acceptedTypes.has("any")) {
+        unformatted += char;
+      } else if (acceptedTypes.has("digit") && /\d/.test(char)) {
+        unformatted += char;
+      } else if (acceptedTypes.has("letter") && /[a-zA-Z]/.test(char)) {
+        unformatted += char;
+      }
+    }
     let formatted = formatValue(unformatted, tokens);
     if (customMask.transform) {
       formatted = customMask.transform(formatted);
@@ -2828,7 +2903,9 @@ var TextInput = class extends BaseInput {
     }
     input.value = displayValue;
     this.applyCommonProps(input);
-    if (this.maskEngine && this.field.mask && !this.field.placeholder) {
+    if (this.field.placeholder) {
+      input.placeholder = this.field.placeholder;
+    } else if (this.maskEngine && this.field.mask) {
       const maskPlaceholder = this.maskEngine.getMaskPlaceholder(this.field.mask);
       if (maskPlaceholder) {
         input.placeholder = maskPlaceholder;
@@ -2940,7 +3017,6 @@ var NumberInput = class extends BaseInput {
       input.type = "number";
       input.value = this.value ?? "";
     }
-    input.placeholder = this.field.placeholder || "";
     const numberField = this.field;
     if (!this.maskEngine && input.type === "number") {
       if (numberField.min !== void 0) {
@@ -2954,7 +3030,9 @@ var NumberInput = class extends BaseInput {
       }
     }
     this.applyCommonProps(input);
-    if (this.maskEngine && this.field.mask && !this.field.placeholder) {
+    if (this.field.placeholder) {
+      input.placeholder = this.field.placeholder;
+    } else if (this.maskEngine && this.field.mask) {
       const maskPlaceholder = this.maskEngine.getMaskPlaceholder(this.field.mask);
       if (maskPlaceholder) {
         input.placeholder = maskPlaceholder;