@regle/core 0.0.5-beta.0 → 0.0.5

package/dist/index.cjs

@@ -420,6 +420,9 @@ function createReactiveFieldStatus({
     $watch();
     if (storeResult?.valid != null) {
       $dirty.value = storage.getDirtyState(path);
+      if ($dirty.value) {
+        $commit();
+      }
     }
     storage.addRuleDeclEntry(path, declaredRules);
   }
@@ -553,12 +556,15 @@ function createCollectionElement({
   customMessages,
   rules
 }) {
-  const $path = `${path}.${index}`;
   const $id = randomId();
+  const $path = `${path}.${$id}`;
   if (!value[index].$id) {
     Object.defineProperties(value[index], {
       $id: {
-        value: $id
+        value: $id,
+        enumerable: false,
+        configurable: false,
+        writable: false
       }
     });
   }
@@ -605,27 +611,40 @@ function createReactiveCollectionStatus({
     });
     if (Array.isArray(state.value) && $each) {
       $eachStatus.value = state.value.map((value, index) => {
-        return createCollectionElement({
-          path,
-          rules: $each,
-          value: state.value,
-          index,
-          options,
-          storage
-        });
+        if (value.$id) {
+          const previousStatus = storage.getArrayStatus(value.$id);
+          if (previousStatus) {
+            return previousStatus;
+          }
+        } else {
+          return createCollectionElement({
+            path,
+            rules: $each,
+            value: state.value,
+            index,
+            options,
+            storage
+          });
+        }
       }).filter((f) => !!f);
     } else {
       $eachStatus.value = [];
     }
   }
-  function updateChildrenStatus() {
+  async function updateChildrenStatus() {
     const { $each } = rulesDef.value;
     if (Array.isArray(state.value) && $eachStatus.value && $each) {
+      $unwatchState?.();
       state.value.forEach((value, index) => {
         if (value.$id) {
+          if (Array.isArray(state.value) && !state.value.find((val) => val.$id === $eachStatus.value[index].$id)) {
+            $eachStatus.value[index].$unwatch();
+          }
           const previousStatus = storage.getArrayStatus(value.$id);
           if (previousStatus) {
             $eachStatus.value[index] = previousStatus;
+          } else {
+            $eachStatus.value[index].$unwatch();
           }
         } else {
           const newElement = createCollectionElement({
@@ -642,12 +661,15 @@ function createReactiveCollectionStatus({
           }
         }
       });
-    }
-    if ($eachStatus.value) {
       const deletedItems = $eachStatus.value.filter(($each2) => {
         return Array.isArray(state.value) && !state.value.find((val) => val.$id === $each2.$id);
       });
-      deletedItems.forEach((item) => item.$unwatch());
+      deletedItems.forEach((item) => {
+        storage.deleteArrayStatus(item.$id);
+        item.$unwatch();
+      });
+      $eachStatus.value.length = state.value.length;
+      (0, import_vue6.nextTick)($watch);
     }
   }
   function $unwatch() {
@@ -664,13 +686,9 @@ function createReactiveCollectionStatus({
     }
   }
   function $watch() {
-    $unwatchState = (0, import_vue6.watch)(
-      state,
-      () => {
-        updateChildrenStatus();
-      },
-      { deep: true, flush: "sync" }
-    );
+    $unwatchState = (0, import_vue6.watch)(() => state.value.length, updateChildrenStatus, {
+      flush: "sync"
+    });
   }
   function $touch() {
     $fieldStatus.value.$touch();
@@ -916,6 +934,11 @@ function useStorage() {
   function getArrayStatus($id) {
     return arrayStatusStorage.value.get($id);
   }
+  function deleteArrayStatus($id) {
+    if ($id) {
+      arrayStatusStorage.value.delete($id);
+    }
+  }
   function setDirtyEntry($path, dirty) {
     dirtyStorage.value.set($path, dirty);
   }
@@ -977,7 +1000,8 @@ function useStorage() {
     getFieldsEntry,
     getCollectionsEntry,
     getArrayStatus,
-    addArrayStatus
+    addArrayStatus,
+    deleteArrayStatus
   };
 }
 

package/dist/index.d.cts

@@ -27,6 +27,21 @@ type DefaultValidators = {
     maxLength: RegleRuleWithParamsDefinition<string, [count: number]>;
     required: RegleRuleDefinition<unknown, []>;
     requiredIf: RegleRuleWithParamsDefinition<unknown, [condition: boolean]>;
+    alpha: RegleRuleDefinition<string>;
+    alphaNum: RegleRuleDefinition<string | number>;
+    between: RegleRuleWithParamsDefinition<number, [min: number, max: number]>;
+    decimal: RegleRuleDefinition<number | string>;
+    email: RegleRuleDefinition<string>;
+    integer: RegleRuleDefinition<number | string>;
+    maxValue: RegleRuleWithParamsDefinition<number, [count: number]>;
+    minLength: RegleRuleWithParamsDefinition<string | Record<PropertyKey, any> | any[], [
+        count: number
+    ]>;
+    minValue: RegleRuleWithParamsDefinition<number, [count: number]>;
+    numeric: RegleRuleDefinition<number | string>;
+    requireUnless: RegleRuleWithParamsDefinition<unknown, [condition: boolean]>;
+    sameAs: RegleRuleWithParamsDefinition<unknown, [target: unknown]>;
+    url: RegleRuleDefinition<string>;
 };
 
 type ParamDecl<T = any> = MaybeRef<T> | (() => T);

package/dist/index.d.ts

@@ -27,6 +27,21 @@ type DefaultValidators = {
     maxLength: RegleRuleWithParamsDefinition<string, [count: number]>;
     required: RegleRuleDefinition<unknown, []>;
     requiredIf: RegleRuleWithParamsDefinition<unknown, [condition: boolean]>;
+    alpha: RegleRuleDefinition<string>;
+    alphaNum: RegleRuleDefinition<string | number>;
+    between: RegleRuleWithParamsDefinition<number, [min: number, max: number]>;
+    decimal: RegleRuleDefinition<number | string>;
+    email: RegleRuleDefinition<string>;
+    integer: RegleRuleDefinition<number | string>;
+    maxValue: RegleRuleWithParamsDefinition<number, [count: number]>;
+    minLength: RegleRuleWithParamsDefinition<string | Record<PropertyKey, any> | any[], [
+        count: number
+    ]>;
+    minValue: RegleRuleWithParamsDefinition<number, [count: number]>;
+    numeric: RegleRuleDefinition<number | string>;
+    requireUnless: RegleRuleWithParamsDefinition<unknown, [condition: boolean]>;
+    sameAs: RegleRuleWithParamsDefinition<unknown, [target: unknown]>;
+    url: RegleRuleDefinition<string>;
 };
 
 type ParamDecl<T = any> = MaybeRef<T> | (() => T);

package/dist/index.js

@@ -84,7 +84,7 @@ function createRule(definition) {
 }
 
 // src/core/useRegle/useRegle.ts
-import { computed as computed5, isRef as isRef2, shallowRef as shallowRef2, toRaw } from "vue";
+import { computed as computed5, isRef as isRef2, shallowRef as shallowRef2, toRaw as toRaw2 } from "vue";
 
 // src/core/useRegle/useStateProperties/useStateProperties.ts
 import { reactive as reactive5 } from "vue";
@@ -210,7 +210,7 @@ function useErrors($regle) {
 import { computed as computed4, effectScope as effectScope4, reactive as reactive4, toRef as toRef4, watch as watch4 } from "vue";
 
 // src/core/useRegle/useStateProperties/createReactiveCollectionStatus.ts
-import { reactive as reactive3, ref as ref3, toRef as toRef3, toRefs, watch as watch3 } from "vue";
+import { nextTick, reactive as reactive3, ref as ref3, toRef as toRef3, toRefs, watch as watch3 } from "vue";
 
 // src/core/useRegle/useStateProperties/createReactiveFieldStatus.ts
 import {
@@ -399,6 +399,9 @@ function createReactiveFieldStatus({
     $watch();
     if (storeResult?.valid != null) {
       $dirty.value = storage.getDirtyState(path);
+      if ($dirty.value) {
+        $commit();
+      }
     }
     storage.addRuleDeclEntry(path, declaredRules);
   }
@@ -532,12 +535,15 @@ function createCollectionElement({
   customMessages,
   rules
 }) {
-  const $path = `${path}.${index}`;
   const $id = randomId();
+  const $path = `${path}.${$id}`;
   if (!value[index].$id) {
     Object.defineProperties(value[index], {
       $id: {
-        value: $id
+        value: $id,
+        enumerable: false,
+        configurable: false,
+        writable: false
       }
     });
   }
@@ -584,27 +590,40 @@ function createReactiveCollectionStatus({
     });
     if (Array.isArray(state.value) && $each) {
       $eachStatus.value = state.value.map((value, index) => {
-        return createCollectionElement({
-          path,
-          rules: $each,
-          value: state.value,
-          index,
-          options,
-          storage
-        });
+        if (value.$id) {
+          const previousStatus = storage.getArrayStatus(value.$id);
+          if (previousStatus) {
+            return previousStatus;
+          }
+        } else {
+          return createCollectionElement({
+            path,
+            rules: $each,
+            value: state.value,
+            index,
+            options,
+            storage
+          });
+        }
       }).filter((f) => !!f);
     } else {
       $eachStatus.value = [];
     }
   }
-  function updateChildrenStatus() {
+  async function updateChildrenStatus() {
     const { $each } = rulesDef.value;
     if (Array.isArray(state.value) && $eachStatus.value && $each) {
+      $unwatchState?.();
       state.value.forEach((value, index) => {
         if (value.$id) {
+          if (Array.isArray(state.value) && !state.value.find((val) => val.$id === $eachStatus.value[index].$id)) {
+            $eachStatus.value[index].$unwatch();
+          }
           const previousStatus = storage.getArrayStatus(value.$id);
           if (previousStatus) {
             $eachStatus.value[index] = previousStatus;
+          } else {
+            $eachStatus.value[index].$unwatch();
           }
         } else {
           const newElement = createCollectionElement({
@@ -621,12 +640,15 @@ function createReactiveCollectionStatus({
           }
         }
       });
-    }
-    if ($eachStatus.value) {
       const deletedItems = $eachStatus.value.filter(($each2) => {
         return Array.isArray(state.value) && !state.value.find((val) => val.$id === $each2.$id);
       });
-      deletedItems.forEach((item) => item.$unwatch());
+      deletedItems.forEach((item) => {
+        storage.deleteArrayStatus(item.$id);
+        item.$unwatch();
+      });
+      $eachStatus.value.length = state.value.length;
+      nextTick($watch);
     }
   }
   function $unwatch() {
@@ -643,13 +665,9 @@ function createReactiveCollectionStatus({
     }
   }
   function $watch() {
-    $unwatchState = watch3(
-      state,
-      () => {
-        updateChildrenStatus();
-      },
-      { deep: true, flush: "sync" }
-    );
+    $unwatchState = watch3(() => state.value.length, updateChildrenStatus, {
+      flush: "sync"
+    });
   }
   function $touch() {
     $fieldStatus.value.$touch();
@@ -895,6 +913,11 @@ function useStorage() {
   function getArrayStatus($id) {
     return arrayStatusStorage.value.get($id);
   }
+  function deleteArrayStatus($id) {
+    if ($id) {
+      arrayStatusStorage.value.delete($id);
+    }
+  }
   function setDirtyEntry($path, dirty) {
     dirtyStorage.value.set($path, dirty);
   }
@@ -956,7 +979,8 @@ function useStorage() {
     getFieldsEntry,
     getCollectionsEntry,
     getArrayStatus,
-    addArrayStatus
+    addArrayStatus,
+    deleteArrayStatus
   };
 }
 
@@ -990,7 +1014,7 @@ function createUseRegleComposable(customRules, options) {
       ...globalOptions,
       ...options2
     };
-    const initialState = shallowRef2(structuredClone(toRaw(state.value)));
+    const initialState = shallowRef2(structuredClone(toRaw2(state.value)));
     const { $regle, errors } = useStateProperties(
       scopeRules,
       state,
@@ -998,7 +1022,7 @@ function createUseRegleComposable(customRules, options) {
       customRules
     );
     function resetForm() {
-      state.value = toRaw(initialState.value);
+      state.value = toRaw2(initialState.value);
       $regle.$reset();
     }
     async function validateForm() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@regle/core",
-  "version": "0.0.5-beta.0",
+  "version": "0.0.5",
   "description": "Vue form validator",
   "scripts": {
     "lint": "eslint --ext .ts --ext .vue .",