@regle/core 0.0.7 → 0.0.9

package/dist/index.cjs

@@ -233,8 +233,9 @@ function useStorage() {
       const $pending = (0, import_vue2.ref)(false);
       const $valid = (0, import_vue2.ref)(true);
       const $metadata = (0, import_vue2.ref)({});
-      ruleStatusStorage.value.set(path, { $pending, $valid, $metadata });
-      return { $pending, $valid, $metadata };
+      const $validating = (0, import_vue2.ref)(false);
+      ruleStatusStorage.value.set(path, { $pending, $valid, $metadata, $validating });
+      return { $pending, $valid, $metadata, $validating };
     }
   }
   (0, import_vue2.onScopeDispose)(() => {
@@ -296,6 +297,35 @@ function isEmpty(value) {
 // src/utils/composables.ts
 var import_vue3 = require("vue");
 
+// src/utils/debounce.ts
+function debounce(func, wait, immediate) {
+  let timeout;
+  const debouncedFn = (...args) => new Promise((resolve) => {
+    clearTimeout(timeout);
+    timeout = setTimeout(() => {
+      timeout = void 0;
+      if (!immediate) {
+        void Promise.resolve(func.apply(this, [...args])).then(resolve);
+      }
+    }, wait);
+    if (immediate && !timeout) {
+      void Promise.resolve(func.apply(this, [...args])).then(resolve);
+    }
+  });
+  debouncedFn.cancel = () => {
+    clearTimeout(timeout);
+    timeout = void 0;
+  };
+  debouncedFn.doImmediately = (...args) => new Promise((resolve) => {
+    clearTimeout(timeout);
+    timeout = setTimeout(() => {
+      timeout = void 0;
+      void Promise.resolve(func.apply(this, [...args])).then(resolve);
+    }, 0);
+  });
+  return debouncedFn;
+}
+
 // src/core/useRegle/guards/ruleDef.guards.ts
 function isNestedRulesDef(state, rule) {
   return isObject(state.value) && isObject(rule.value) && !Object.entries(rule.value).some((rule2) => isRuleDef(rule2));
@@ -336,7 +366,13 @@ function extractRulesErrors(rules, externalErrors) {
       return rule.$message;
     }
     return null;
-  }).filter((msg) => !!msg).concat(externalErrors ?? []);
+  }).filter((msg) => !!msg).reduce((acc, value) => {
+    if (typeof value === "string") {
+      return acc?.concat([value]);
+    } else {
+      return acc?.concat(value);
+    }
+  }, []).concat(externalErrors ?? []);
 }
 function processFieldErrors(fieldStatus) {
   if (isNestedRulesStatus(fieldStatus)) {
@@ -427,7 +463,9 @@ function createReactiveRuleStatus({
 }) {
   let scope = (0, import_vue5.effectScope)();
   let scopeState;
-  const { $pending, $valid, $metadata } = storage.trySetRuleStatusRef(`${path}.${ruleKey}`);
+  const { $pending, $valid, $metadata, $validating } = storage.trySetRuleStatusRef(
+    `${path}.${ruleKey}`
+  );
   function $watch() {
     scopeState = scope.run(() => {
       const $defaultMetadata = (0, import_vue5.computed)(() => ({
@@ -448,26 +486,28 @@ function createReactiveRuleStatus({
       });
       const $message = (0, import_vue5.computed)(() => {
         let message = "";
-        const customMessageRule = customMessages ? customMessages[ruleKey]?.message : void 0;
-        if (customMessageRule) {
-          if (typeof customMessageRule === "function") {
-            message = customMessageRule(state.value, $defaultMetadata.value);
-          } else {
-            message = customMessageRule;
-          }
-        }
-        if (isFormRuleDefinition(rule)) {
-          if (!(customMessageRule && !rule.value._patched)) {
-            if (typeof rule.value.message === "function") {
-              message = rule.value.message(state.value, $defaultMetadata.value);
+        if ($dirty.value && !$validating.value) {
+          const customMessageRule = customMessages ? customMessages[ruleKey]?.message : void 0;
+          if (customMessageRule) {
+            if (typeof customMessageRule === "function") {
+              message = customMessageRule(state.value, $defaultMetadata.value);
             } else {
-              message = rule.value.message;
+              message = customMessageRule;
             }
           }
-        }
-        if (isEmpty(message)) {
-          message = "Error";
-          console.warn(`No error message defined for ${ruleKey}`);
+          if (isFormRuleDefinition(rule)) {
+            if (!(customMessageRule && !rule.value._patched)) {
+              if (typeof rule.value.message === "function") {
+                message = rule.value.message(state.value, $defaultMetadata.value);
+              } else {
+                message = rule.value.message;
+              }
+            }
+          }
+          if (isEmpty(message)) {
+            message = "Error";
+            console.warn(`No error message defined for ${ruleKey}`);
+          }
         }
         return message;
       });
@@ -507,43 +547,48 @@ function createReactiveRuleStatus({
     deep: true
   });
   async function $validate() {
-    const validator = scopeState.$validator.value;
-    let ruleResult = false;
-    const resultOrPromise = validator(state.value, ...scopeState.$params.value);
-    if (resultOrPromise instanceof Promise) {
-      if ($dirty.value && !$pending.value) {
-        try {
-          $valid.value = true;
-          $pending.value = true;
-          const promiseResult = await resultOrPromise;
-          if (typeof promiseResult === "boolean") {
-            ruleResult = promiseResult;
+    try {
+      $validating.value = true;
+      const validator = scopeState.$validator.value;
+      let ruleResult = false;
+      const resultOrPromise = validator(state.value, ...scopeState.$params.value);
+      if (resultOrPromise instanceof Promise) {
+        if ($dirty.value && !$pending.value) {
+          try {
+            $valid.value = true;
+            $pending.value = true;
+            const promiseResult = await resultOrPromise;
+            if (typeof promiseResult === "boolean") {
+              ruleResult = promiseResult;
+            } else {
+              const { $valid: $valid2, ...rest } = promiseResult;
+              ruleResult = $valid2;
+              $metadata.value = rest;
+            }
+          } catch (e) {
+            ruleResult = false;
+          } finally {
+            $pending.value = false;
+          }
+        }
+      } else {
+        if (resultOrPromise != null) {
+          if (typeof resultOrPromise === "boolean") {
+            ruleResult = resultOrPromise;
           } else {
-            const { $valid: $valid2, ...rest } = promiseResult;
+            const { $valid: $valid2, ...rest } = resultOrPromise;
             ruleResult = $valid2;
             $metadata.value = rest;
           }
-        } catch (e) {
-          ruleResult = false;
-        } finally {
-          $pending.value = false;
         }
       }
-    } else {
-      if (resultOrPromise != null) {
-        if (typeof resultOrPromise === "boolean") {
-          ruleResult = resultOrPromise;
-        } else {
-          const { $valid: $valid2, ...rest } = resultOrPromise;
-          ruleResult = $valid2;
-          $metadata.value = rest;
-        }
+      $valid.value = ruleResult;
+      if (options.$externalErrors) {
       }
+      return ruleResult;
+    } finally {
+      $validating.value = false;
     }
-    $valid.value = ruleResult;
-    if (options.$externalErrors) {
-    }
-    return ruleResult;
   }
   function $unwatch() {
     $unwatchState();
@@ -586,8 +631,11 @@ function createReactiveFieldStatus({
   function createReactiveRulesResult() {
     const declaredRules = rulesDef.value;
     const storeResult = storage.checkRuleDeclEntry(path, declaredRules);
+    $localOptions.value = Object.fromEntries(
+      Object.entries(declaredRules).filter(([ruleKey]) => ruleKey.startsWith("$"))
+    );
     $rules.value = Object.fromEntries(
-      Object.entries(declaredRules).map(([ruleKey, rule]) => {
+      Object.entries(declaredRules).filter(([ruleKey]) => !ruleKey.startsWith("$")).map(([ruleKey, rule]) => {
         if (rule) {
           const ruleRef = (0, import_vue6.toRef)(() => rule);
           return [
@@ -620,15 +668,17 @@ function createReactiveFieldStatus({
     storage.setDirtyEntry(path, $dirty.value);
   });
   const $unwatchState = (0, import_vue6.watch)(state, () => {
-    if ((0, import_vue6.unref)(options.autoDirty)) {
+    if (scopeState.$autoDirty.value) {
       if (!$dirty.value) {
         $dirty.value = true;
       }
     }
-    if (!(0, import_vue6.unref)(options.lazy)) {
+    if (!scopeState.$lazy.value) {
       $commit();
+      if (!scopeState.$rewardEarly.value !== false) {
+        $clearExternalErrors();
+      }
     }
-    $externalErrors.value = [];
   });
   function $unwatch() {
     if ($rules.value) {
@@ -648,11 +698,32 @@ function createReactiveFieldStatus({
   }
   function $watch() {
     scopeState = scope.run(() => {
+      const $debounce = (0, import_vue6.computed)(() => {
+        return $localOptions.value.$debounce;
+      });
+      const $lazy = (0, import_vue6.computed)(() => {
+        if ($localOptions.value.$lazy) {
+          return $localOptions.value.$lazy;
+        }
+        return (0, import_vue6.unref)(options.lazy);
+      });
+      const $rewardEarly = (0, import_vue6.computed)(() => {
+        if ($localOptions.value.$rewardEarly) {
+          return $localOptions.value.$rewardEarly;
+        }
+        return (0, import_vue6.unref)(options.rewardEarly);
+      });
+      const $autoDirty = (0, import_vue6.computed)(() => {
+        if ($localOptions.value.$autoDirty) {
+          return $localOptions.value.$autoDirty;
+        }
+        return (0, import_vue6.unref)(options.autoDirty);
+      });
       const $error = (0, import_vue6.computed)(() => {
         return $invalid.value && !$pending.value && $dirty.value;
       });
       const $pending = (0, import_vue6.computed)(() => {
-        if (triggerPunishment.value || !(0, import_vue6.unref)(options.rewardEarly)) {
+        if (triggerPunishment.value || !$rewardEarly.value) {
           return Object.entries($rules.value).some(([key, ruleResult]) => {
             return ruleResult.$pending;
           });
@@ -660,7 +731,9 @@ function createReactiveFieldStatus({
         return false;
       });
       const $invalid = (0, import_vue6.computed)(() => {
-        if (triggerPunishment.value || !(0, import_vue6.unref)(options.rewardEarly)) {
+        if ($externalErrors.value?.length) {
+          return true;
+        } else if (triggerPunishment.value || !$rewardEarly.value) {
           return Object.entries($rules.value).some(([key, ruleResult]) => {
             return !ruleResult.$valid;
           });
@@ -668,7 +741,9 @@ function createReactiveFieldStatus({
         return false;
       });
       const $valid = (0, import_vue6.computed)(() => {
-        if ((0, import_vue6.unref)(options.rewardEarly)) {
+        if ($externalErrors.value?.length) {
+          return false;
+        } else if ($rewardEarly.value) {
           return Object.entries($rules.value).every(([key, ruleResult]) => {
             return ruleResult.$valid;
           });
@@ -680,14 +755,19 @@ function createReactiveFieldStatus({
         $error,
         $pending,
         $invalid,
-        $valid
+        $valid,
+        $debounce,
+        $lazy,
+        $rewardEarly,
+        $autoDirty
       };
     });
   }
   const $rules = (0, import_vue6.ref)();
+  const $localOptions = (0, import_vue6.ref)();
   createReactiveRulesResult();
   const $unwatchValid = (0, import_vue6.watch)(scopeState.$valid, (valid) => {
-    if ((0, import_vue6.unref)(options.rewardEarly) && valid) {
+    if (scopeState.$rewardEarly.value && valid) {
       triggerPunishment.value = false;
     }
   });
@@ -698,15 +778,18 @@ function createReactiveFieldStatus({
   function $touch() {
     $dirty.value = true;
   }
-  function $commit() {
+  const $commit = debounce($commitHandler, scopeState.$debounce.value ?? 0);
+  function $commitHandler() {
     Object.entries($rules.value).map(([key, rule]) => {
       return rule.$validate();
     });
   }
-  async function $validate() {
+  const $validate = debounce($validateHandler, scopeState.$debounce.value ?? 0);
+  async function $validateHandler() {
     try {
+      $clearExternalErrors();
       triggerPunishment.value = true;
-      const results = await Promise.all(
+      const results = await Promise.allSettled(
         Object.entries($rules.value).map(([key, rule]) => {
           return rule.$validate();
         })