@regle/core 0.0.4-beta.0 → 0.0.5

package/dist/index.cjs

@@ -22,7 +22,8 @@ var src_exports = {};
 __export(src_exports, {
   InternalRuleType: () => InternalRuleType,
   createRule: () => createRule,
-  defineCustomValidators: () => defineCustomValidators
+  defineRegleOptions: () => defineRegleOptions,
+  unwrapRuleParameters: () => unwrapRuleParameters
 });
 module.exports = __toCommonJS(src_exports);
 
@@ -50,6 +51,7 @@ function createReactiveParams(params) {
 // src/core/createRule/defineRuleProcessors.ts
 function defineRuleProcessors(definition, ...params) {
   const { message, validator, active, ...properties } = definition;
+  const isAsync = validator.constructor.name === "AsyncFunction";
   const processors = {
     message(value, ...args) {
       if (typeof definition.message === "function") {
@@ -75,6 +77,7 @@ function defineRuleProcessors(definition, ...params) {
       _active: definition.active,
       _type: definition.type,
       _patched: false,
+      _async: isAsync,
       _params: createReactiveParams(params)
     }
   };
@@ -86,6 +89,7 @@ function createRule(definition) {
   if (typeof definition.validator === "function") {
     let fakeParams = [];
     const staticProcessors = defineRuleProcessors(definition, ...fakeParams);
+    const isAsync = definition.validator.constructor.name === "AsyncFunction";
     if (definition.validator.length > 1) {
       const ruleFactory = function(...params) {
         return defineRuleProcessors(definition, ...params);
@@ -99,6 +103,7 @@ function createRule(definition) {
       ruleFactory._active = definition.active;
       ruleFactory._type = definition.type;
       ruleFactory._patched = false;
+      ruleFactory._async = isAsync;
       return ruleFactory;
     } else {
       return staticProcessors;
@@ -233,6 +238,9 @@ function useErrors($regle) {
 // src/core/useRegle/useStateProperties/createReactiveNestedStatus.ts
 var import_vue7 = require("vue");
 
+// src/core/useRegle/useStateProperties/createReactiveCollectionStatus.ts
+var import_vue6 = require("vue");
+
 // src/core/useRegle/useStateProperties/createReactiveFieldStatus.ts
 var import_vue5 = require("vue");
 
@@ -254,7 +262,8 @@ function createReactiveRuleStatus({
   ruleKey,
   state,
   path,
-  storage
+  storage,
+  options
 }) {
   let scope = (0, import_vue4.effectScope)();
   let scopeState;
@@ -274,7 +283,7 @@ function createReactiveRuleStatus({
       });
       const $message = (0, import_vue4.computed)(() => {
         let message = "";
-        const customMessageRule = customMessages[ruleKey]?.message;
+        const customMessageRule = customMessages ? customMessages[ruleKey]?.message : void 0;
         if (customMessageRule) {
           if (typeof customMessageRule === "function") {
             message = customMessageRule(state.value, ...$params.value);
@@ -327,7 +336,6 @@ function createReactiveRuleStatus({
         $path
       };
     });
-    $validate();
   }
   $watch();
   const $unwatchState = (0, import_vue4.watch)(scopeState.$params, $validate, {
@@ -360,7 +368,6 @@ function createReactiveRuleStatus({
     $unwatchState();
     scope.stop();
     scope = (0, import_vue4.effectScope)();
-    scopeState = null;
   }
   return (0, import_vue4.reactive)({
     ...scopeState,
@@ -378,12 +385,14 @@ function createReactiveFieldStatus({
   rulesDef,
   customMessages,
   path,
-  storage
+  storage,
+  options
 }) {
   let scope = (0, import_vue5.effectScope)();
   let scopeState;
   const $dirty = (0, import_vue5.ref)(false);
   const $anyDirty = (0, import_vue5.computed)(() => $dirty.value);
+  const triggerPunishment = (0, import_vue5.ref)(false);
   function createReactiveRulesResult() {
     const declaredRules = rulesDef.value;
     const storeResult = storage.checkRuleDeclEntry(path, declaredRules);
@@ -400,7 +409,8 @@ function createReactiveFieldStatus({
               ruleKey,
               state,
               path,
-              storage
+              storage,
+              options
             })
           ];
         }
@@ -410,6 +420,9 @@ function createReactiveFieldStatus({
     $watch();
     if (storeResult?.valid != null) {
       $dirty.value = storage.getDirtyState(path);
+      if ($dirty.value) {
+        $commit();
+      }
     }
     storage.addRuleDeclEntry(path, declaredRules);
   }
@@ -417,10 +430,14 @@ function createReactiveFieldStatus({
     storage.setDirtyEntry(path, $dirty.value);
   });
   const $unwatchState = (0, import_vue5.watch)(state, () => {
-    if (!$dirty.value) {
-      $dirty.value = true;
+    if ((0, import_vue5.unref)(options.autoDirty)) {
+      if (!$dirty.value) {
+        $dirty.value = true;
+      }
+    }
+    if (!(0, import_vue5.unref)(options.lazy)) {
+      $commit();
     }
-    $validate();
   });
   function $unwatch() {
     if ($rules.value) {
@@ -433,9 +450,9 @@ function createReactiveFieldStatus({
       storage.setDirtyEntry(path, $dirty.value);
     }
     $unwatchState();
+    $unwatchValid();
     scope.stop();
     scope = (0, import_vue5.effectScope)();
-    scopeState = null;
   }
   function $watch() {
     scopeState = scope.run(() => {
@@ -443,16 +460,30 @@ function createReactiveFieldStatus({
         return $invalid.value && !$pending.value && $dirty.value;
       });
       const $pending = (0, import_vue5.computed)(() => {
-        return Object.entries($rules.value).some(([key, rule]) => {
-          return rule.$pending;
-        });
+        if (triggerPunishment.value || !(0, import_vue5.unref)(options.rewardEarly)) {
+          return Object.entries($rules.value).some(([key, ruleResult]) => {
+            return ruleResult.$pending;
+          });
+        }
+        return false;
       });
       const $invalid = (0, import_vue5.computed)(() => {
-        return Object.entries($rules.value).some(([key, ruleResult]) => {
-          return !ruleResult.$valid;
-        });
+        if (triggerPunishment.value || !(0, import_vue5.unref)(options.rewardEarly)) {
+          return Object.entries($rules.value).some(([key, ruleResult]) => {
+            return !ruleResult.$valid;
+          });
+        }
+        return false;
+      });
+      const $valid = (0, import_vue5.computed)(() => {
+        if ((0, import_vue5.unref)(options.rewardEarly)) {
+          return Object.entries($rules.value).every(([key, ruleResult]) => {
+            return ruleResult.$valid;
+          });
+        } else {
+          return !$invalid.value;
+        }
       });
-      const $valid = (0, import_vue5.computed)(() => !$invalid.value);
       return {
         $error,
         $pending,
@@ -463,15 +494,25 @@ function createReactiveFieldStatus({
   }
   const $rules = (0, import_vue5.ref)();
   createReactiveRulesResult();
+  const $unwatchValid = (0, import_vue5.watch)(scopeState.$valid, (valid) => {
+    if ((0, import_vue5.unref)(options.rewardEarly) && valid) {
+      triggerPunishment.value = false;
+    }
+  });
   function $reset() {
     $dirty.value = false;
   }
   function $touch() {
     $dirty.value = true;
-    $validate();
+  }
+  function $commit() {
+    Object.entries($rules.value).map(([key, rule]) => {
+      return rule.$validate();
+    });
   }
   async function $validate() {
     try {
+      triggerPunishment.value = true;
       const results = await Promise.all(
         Object.entries($rules.value).map(([key, rule]) => {
           return rule.$validate();
@@ -499,14 +540,56 @@ function createReactiveFieldStatus({
   });
 }
 
+// src/utils/randomId.ts
+function randomId() {
+  const uint32 = window.crypto.getRandomValues(new Uint32Array(1))[0];
+  return uint32.toString(8);
+}
+
 // src/core/useRegle/useStateProperties/createReactiveCollectionStatus.ts
-var import_vue6 = require("vue");
+function createCollectionElement({
+  path,
+  index,
+  options,
+  storage,
+  value,
+  customMessages,
+  rules
+}) {
+  const $id = randomId();
+  const $path = `${path}.${$id}`;
+  if (!value[index].$id) {
+    Object.defineProperties(value[index], {
+      $id: {
+        value: $id,
+        enumerable: false,
+        configurable: false,
+        writable: false
+      }
+    });
+  }
+  const $state = (0, import_vue6.toRefs)(value);
+  const $status = createReactiveChildrenStatus({
+    state: $state[index],
+    rulesDef: (0, import_vue6.toRef)(() => rules),
+    customMessages,
+    path: $path,
+    storage,
+    options
+  });
+  if ($status) {
+    $status.$id = value[index].$id ?? $id;
+    storage.addArrayStatus($status.$id, $status);
+  }
+  return $status;
+}
 function createReactiveCollectionStatus({
   state,
   rulesDef,
   customMessages,
   path,
-  storage
+  storage,
+  options
 }) {
   if (Array.isArray(state.value) && !rulesDef.value.$each) {
     return null;
@@ -523,23 +606,72 @@ function createReactiveCollectionStatus({
       rulesDef: (0, import_vue6.toRef)(() => otherFields),
       customMessages,
       path,
-      storage
+      storage,
+      options
     });
     if (Array.isArray(state.value) && $each) {
       $eachStatus.value = state.value.map((value, index) => {
-        const $path = `${path}.${index}`;
-        return createReactiveChildrenStatus({
-          state: (0, import_vue6.toRef)(() => value),
-          rulesDef: (0, import_vue6.toRef)(() => $each),
-          customMessages,
-          path: $path,
-          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 = [];
     }
   }
+  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({
+            value: state.value,
+            rules: $each,
+            customMessages,
+            path,
+            storage,
+            options,
+            index
+          });
+          if (newElement) {
+            $eachStatus.value[index] = newElement;
+          }
+        }
+      });
+      const deletedItems = $eachStatus.value.filter(($each2) => {
+        return Array.isArray(state.value) && !state.value.find((val) => val.$id === $each2.$id);
+      });
+      deletedItems.forEach((item) => {
+        storage.deleteArrayStatus(item.$id);
+        item.$unwatch();
+      });
+      $eachStatus.value.length = state.value.length;
+      (0, import_vue6.nextTick)($watch);
+    }
+  }
   function $unwatch() {
     if ($unwatchState) {
       $unwatchState();
@@ -554,19 +686,42 @@ function createReactiveCollectionStatus({
     }
   }
   function $watch() {
-    $unwatchState = (0, import_vue6.watch)(
-      state,
-      () => {
-        createStatus();
-      },
-      { deep: true, flush: "sync" }
-    );
+    $unwatchState = (0, import_vue6.watch)(() => state.value.length, updateChildrenStatus, {
+      flush: "sync"
+    });
+  }
+  function $touch() {
+    $fieldStatus.value.$touch();
+    $eachStatus.value.forEach(($each) => {
+      $each.$touch();
+    });
+  }
+  function $reset() {
+    $fieldStatus.value.$reset();
+    $eachStatus.value.forEach(($each) => {
+      $each.$reset();
+    });
+  }
+  async function $validate() {
+    try {
+      const results = await Promise.all(
+        $eachStatus.value.map((rule) => {
+          return rule.$validate();
+        })
+      );
+      return results.every((value) => !!value);
+    } catch (e) {
+      return false;
+    }
   }
   return (0, import_vue6.reactive)({
     ...$fieldStatus.value,
     $each: $eachStatus,
+    $validate,
     $unwatch,
-    $watch
+    $watch,
+    $touch,
+    $reset
   });
 }
 
@@ -577,7 +732,8 @@ function createReactiveNestedStatus({
   customMessages,
   path = "",
   rootRules,
-  storage
+  storage,
+  options
 }) {
   let scope = (0, import_vue7.effectScope)();
   let scopeState;
@@ -595,7 +751,8 @@ function createReactiveNestedStatus({
               rulesDef: statePropRulesRef,
               customMessages,
               path: path ? `${path}.${statePropKey}` : statePropKey,
-              storage
+              storage,
+              options
             })
           ];
         }
@@ -689,11 +846,11 @@ function createReactiveNestedStatus({
     }
     scope.stop();
     scope = (0, import_vue7.effectScope)();
-    scopeState = null;
   }
   return (0, import_vue7.reactive)({
     ...scopeState,
     $fields,
+    $value: state,
     $reset,
     $touch,
     $validate,
@@ -706,7 +863,8 @@ function createReactiveChildrenStatus({
   rulesDef,
   customMessages,
   path,
-  storage
+  storage,
+  options
 }) {
   if (isCollectionRulesDef(rulesDef)) {
     return createReactiveCollectionStatus({
@@ -714,7 +872,8 @@ function createReactiveChildrenStatus({
       rulesDef,
       customMessages,
       path,
-      storage
+      storage,
+      options
     });
   } else if (isNestedRulesDef(state, rulesDef) && isRefObject(state)) {
     return createReactiveNestedStatus({
@@ -722,7 +881,8 @@ function createReactiveChildrenStatus({
       state,
       customMessages,
       path,
-      storage
+      storage,
+      options
     });
   } else if (isValidatorRulesDef(rulesDef)) {
     return createReactiveFieldStatus({
@@ -730,7 +890,8 @@ function createReactiveChildrenStatus({
       rulesDef,
       customMessages,
       path,
-      storage
+      storage,
+      options
     });
   }
   return null;
@@ -746,6 +907,7 @@ function useStorage() {
   const collectionsStorage = (0, import_vue8.shallowRef)(/* @__PURE__ */ new Map());
   const dirtyStorage = (0, import_vue8.shallowRef)(/* @__PURE__ */ new Map());
   const ruleStatusStorage = (0, import_vue8.shallowRef)(/* @__PURE__ */ new Map());
+  const arrayStatusStorage = (0, import_vue8.shallowRef)(/* @__PURE__ */ new Map());
   function getFieldsEntry($path) {
     const existingFields = fieldsStorage.value.get($path);
     if (existingFields) {
@@ -766,6 +928,17 @@ function useStorage() {
       return $each;
     }
   }
+  function addArrayStatus($id, value) {
+    arrayStatusStorage.value.set($id, value);
+  }
+  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);
   }
@@ -825,20 +998,24 @@ function useStorage() {
     getDirtyState,
     trySetRuleStatusRef,
     getFieldsEntry,
-    getCollectionsEntry
+    getCollectionsEntry,
+    getArrayStatus,
+    addArrayStatus,
+    deleteArrayStatus
   };
 }
 
 // src/core/useRegle/useStateProperties/useStateProperties.ts
-function useStateProperties(scopeRules, state, customRules) {
+function useStateProperties(scopeRules, state, options, customRules) {
   const storage = useStorage();
   const $regle = (0, import_vue9.reactive)(
     createReactiveNestedStatus({
       rootRules: scopeRules,
       scopeRules,
       state,
-      customMessages: customRules(),
-      storage
+      customMessages: customRules?.(),
+      storage,
+      options
     })
   );
   const errors = useErrors($regle);
@@ -846,13 +1023,23 @@ function useStateProperties(scopeRules, state, customRules) {
 }
 
 // src/core/useRegle/useRegle.ts
-function createUseRegleComposable(customRules) {
-  function useRegle(state, rulesFactory) {
+function createUseRegleComposable(customRules, options) {
+  const globalOptions = {
+    autoDirty: options?.autoDirty ?? true,
+    lazy: options?.lazy ?? false,
+    rewardEarly: options?.rewardEarly ?? false
+  };
+  function useRegle2(state, rulesFactory, options2) {
     const scopeRules = (0, import_vue10.isRef)(rulesFactory) ? rulesFactory : (0, import_vue10.computed)(rulesFactory);
+    const resolvedOptions = {
+      ...globalOptions,
+      ...options2
+    };
     const initialState = (0, import_vue10.shallowRef)(structuredClone((0, import_vue10.toRaw)(state.value)));
     const { $regle, errors } = useStateProperties(
       scopeRules,
       state,
+      resolvedOptions,
       customRules
     );
     function resetForm() {
@@ -861,7 +1048,11 @@ function createUseRegleComposable(customRules) {
     }
     async function validateForm() {
       $regle.$touch();
-      return await $regle.$validate();
+      const result = await $regle.$validate();
+      if (result) {
+        return state.value;
+      }
+      return false;
     }
     return {
       state,
@@ -871,19 +1062,22 @@ function createUseRegleComposable(customRules) {
       validateForm
     };
   }
-  return useRegle;
+  return useRegle2;
 }
+var useRegle = createUseRegleComposable();
 
-// src/core/defineCustomValidators.ts
-function defineCustomValidators(customRules) {
-  const useRegle = createUseRegleComposable(customRules);
-  return {
-    useRegle
-  };
+// src/core/defineRegleOptions.ts
+function defineRegleOptions({
+  rules,
+  options
+}) {
+  const useRegle2 = createUseRegleComposable(rules, options);
+  return useRegle2;
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   InternalRuleType,
   createRule,
-  defineCustomValidators
+  defineRegleOptions,
+  unwrapRuleParameters
 });