easy-forms-core 1.0.0 → 1.0.2

package/README.md

@@ -20,11 +20,11 @@ No depende de ningún framework.
 ## Instalación
 
 ```bash
-bun add easy-forms
+bun add easy-forms-core
 # o
-npm install easy-forms
+npm install easy-forms-core
 # o
-pnpm add easy-forms
+pnpm add easy-forms-core
 ```
 
 ## Uso Básico
@@ -36,7 +36,7 @@ pnpm add easy-forms
 ```
 
 ```javascript
-import 'easy-forms'
+import 'easy-forms-core'
 
 const form = document.querySelector('#form')
 
@@ -62,7 +62,7 @@ form.addEventListener('submit', (event) => {
 ### React
 
 ```tsx
-import 'easy-forms'
+import 'easy-forms-core'
 
 function MyForm() {
   return (
@@ -81,7 +81,7 @@ function MyForm() {
 
 ```vue
 <script setup>
-import 'easy-forms'
+import 'easy-forms-core'
 
 const schema = {
   fields: [

package/dist/easy-form.d.ts

@@ -6,6 +6,10 @@ type FieldType = 'text' | 'email' | 'number' | 'password' | 'textarea' | 'select
  * Tipos de validaciones soportadas
  */
 type ValidationType = 'required' | 'email' | 'minLength' | 'maxLength' | 'min' | 'max' | 'pattern' | 'custom';
+/**
+ * Operadores de condición
+ */
+type ConditionOperator = 'equals' | 'notEquals' | 'contains' | 'notContains' | 'greaterThan' | 'lessThan' | 'greaterThanOrEqual' | 'lessThanOrEqual' | 'in' | 'notIn' | 'isEmpty' | 'isNotEmpty' | 'regex';
 /**
  * Validación base
  */
@@ -50,6 +54,47 @@ interface CustomValidation extends BaseValidation {
  * Unión de todas las validaciones
  */
 type Validation = RequiredValidation | EmailValidation | MinLengthValidation | MaxLengthValidation | MinValidation | MaxValidation | PatternValidation | CustomValidation;
+/**
+ * Condición individual para campos
+ */
+interface FieldCondition {
+    field: string;
+    operator: ConditionOperator;
+    value: any;
+}
+/**
+ * Dependencias de un campo
+ */
+interface FieldDependencies {
+    show?: FieldCondition | FieldCondition[];
+    hide?: FieldCondition | FieldCondition[];
+    enable?: FieldCondition | FieldCondition[];
+    disable?: FieldCondition | FieldCondition[];
+    required?: FieldCondition | FieldCondition[];
+    optional?: FieldCondition | FieldCondition[];
+}
+/**
+ * Tipos de máscaras predefinidas
+ */
+type PredefinedMask = 'phone' | 'phone-us' | 'phone-international' | 'date' | 'date-us' | 'date-eu' | 'credit-card' | 'ssn' | 'zip-code' | 'currency' | 'percentage' | 'time' | 'datetime';
+/**
+ * Máscara personalizada con patrón
+ */
+interface CustomMask {
+    pattern: string;
+    placeholder?: string;
+    transform?: (value: string) => string;
+}
+/**
+ * Configuración de máscara
+ */
+interface MaskConfig {
+    type?: PredefinedMask;
+    custom?: CustomMask;
+    keepFormat?: boolean;
+    showMaskOnFocus?: boolean;
+    showMaskOnHover?: boolean;
+}
 /**
  * Campo base
  */
@@ -64,6 +109,12 @@ interface BaseField {
     disabled?: boolean;
     hidden?: boolean;
     description?: string;
+    dependencies?: FieldDependencies;
+    conditionalValidations?: Array<{
+        condition: FieldCondition | FieldCondition[];
+        validations: Validation[];
+    }>;
+    mask?: MaskConfig;
 }
 /**
  * Campo de texto
@@ -285,6 +336,15 @@ declare class EasyForm extends BrowserHTMLElement {
      * Maneja el cambio de un campo
      */
     private handleFieldChange;
+    private dependencyRenderTimeout;
+    /**
+     * Re-renderiza campos dependientes
+     */
+    private renderDependentFields;
+    /**
+     * Emite evento de cambio de dependencia
+     */
+    private emitDependencyChange;
     /**
      * Maneja el blur de un campo
      */