@vueuse/integrations 10.0.0-beta.0 → 10.0.0-beta.1

package/index.cjs

@@ -37,9 +37,14 @@ var __spreadValues$6 = (a, b) => {
 var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
 const AsyncValidatorSchema = Schema.default || Schema;
 function useAsyncValidator(value, rules, options = {}) {
-  const errorInfo = vueDemi.ref();
-  const isFinished = vueDemi.ref(false);
-  const pass = vueDemi.ref(false);
+  const {
+    validateOption = {},
+    immediate = true
+  } = options;
+  const valueRef = shared.resolveRef(value);
+  const errorInfo = vueDemi.shallowRef(null);
+  const isFinished = vueDemi.ref(true);
+  const pass = vueDemi.ref(!immediate);
   const errors = vueDemi.computed(() => {
     var _a;
     return ((_a = errorInfo.value) == null ? void 0 : _a.errors) || [];
@@ -48,13 +53,12 @@ function useAsyncValidator(value, rules, options = {}) {
     var _a;
     return ((_a = errorInfo.value) == null ? void 0 : _a.fields) || {};
   });
-  const { validateOption = {} } = options;
-  vueDemi.watchEffect(async () => {
+  const validator = vueDemi.computed(() => new AsyncValidatorSchema(shared.resolveUnref(rules)));
+  const execute = async () => {
     isFinished.value = false;
     pass.value = false;
-    const validator = new AsyncValidatorSchema(shared.resolveUnref(rules));
     try {
-      await validator.validate(shared.resolveUnref(value), validateOption);
+      await validator.value.validate(valueRef.value, validateOption);
       pass.value = true;
       errorInfo.value = null;
     } catch (err) {
@@ -62,13 +66,21 @@ function useAsyncValidator(value, rules, options = {}) {
     } finally {
       isFinished.value = true;
     }
-  });
+    return {
+      pass: pass.value,
+      errorInfo: errorInfo.value,
+      errors: errors.value,
+      errorFields: errorFields.value
+    };
+  };
+  vueDemi.watch([valueRef, validator], () => execute(), { immediate, deep: true });
   const shell = {
-    pass,
     isFinished,
-    errorInfo,
+    pass,
     errors,
-    errorFields
+    errorInfo,
+    errorFields,
+    execute
   };
   function waitUntilFinished() {
     return new Promise((resolve, reject) => {

package/index.d.ts

@@ -20,18 +20,26 @@ type AsyncValidatorError = Error & {
     errors: ValidateError[];
     fields: Record<string, ValidateError[]>;
 };
+interface UseAsyncValidatorExecuteReturn {
+    pass: boolean;
+    errors: AsyncValidatorError['errors'] | undefined;
+    errorInfo: AsyncValidatorError | null;
+    errorFields: AsyncValidatorError['fields'] | undefined;
+}
 interface UseAsyncValidatorReturn {
     pass: Ref<boolean>;
-    errorInfo: Ref<AsyncValidatorError | null>;
     isFinished: Ref<boolean>;
     errors: Ref<AsyncValidatorError['errors'] | undefined>;
+    errorInfo: Ref<AsyncValidatorError | null>;
     errorFields: Ref<AsyncValidatorError['fields'] | undefined>;
+    execute: () => Promise<UseAsyncValidatorExecuteReturn>;
 }
 interface UseAsyncValidatorOptions {
     /**
      * @see https://github.com/yiminghe/async-validator#options
      */
     validateOption?: ValidateOption;
+    immediate?: boolean;
 }
 /**
  * Wrapper for async-validator.
@@ -417,4 +425,4 @@ declare function useSortable<T>(selector: string, list: MaybeComputedRef$1<T[]>,
 declare function useSortable<T>(el: MaybeComputedRef$1<HTMLElement | null | undefined>, list: MaybeComputedRef$1<T[]>, options?: UseSortableOptions): UseSortableReturn;
 declare function moveArrayElement<T>(list: MaybeComputedRef$1<T[]>, from: number, to: number): void;
 
-export { AsyncValidatorError, ChangeCaseType, EasyUseAxiosReturn, FuseOptions, StrictUseAxiosReturn, UseAsyncValidatorOptions, UseAsyncValidatorReturn, UseAxiosOptions, UseAxiosReturn, UseDrauuOptions, UseDrauuReturn, UseFocusTrapOptions, UseFocusTrapReturn, UseFuseOptions, UseFuseReturn, UseIDBOptions, UseJwtOptions, UseJwtReturn, UseNProgressOptions, UseNProgressReturn, UseSortableOptions, UseSortableReturn, createCookies, moveArrayElement, useAsyncValidator, useAxios, useChangeCase, useCookies, useDrauu, useFocusTrap, useFuse, useIDBKeyval, useJwt, useNProgress, useQRCode, useSortable };
+export { AsyncValidatorError, ChangeCaseType, EasyUseAxiosReturn, FuseOptions, StrictUseAxiosReturn, UseAsyncValidatorExecuteReturn, UseAsyncValidatorOptions, UseAsyncValidatorReturn, UseAxiosOptions, UseAxiosReturn, UseDrauuOptions, UseDrauuReturn, UseFocusTrapOptions, UseFocusTrapReturn, UseFuseOptions, UseFuseReturn, UseIDBOptions, UseJwtOptions, UseJwtReturn, UseNProgressOptions, UseNProgressReturn, UseSortableOptions, UseSortableReturn, createCookies, moveArrayElement, useAsyncValidator, useAxios, useChangeCase, useCookies, useDrauu, useFocusTrap, useFuse, useIDBKeyval, useJwt, useNProgress, useQRCode, useSortable };

package/index.iife.js

@@ -136,9 +136,14 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
   var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
   const AsyncValidatorSchema = Schema.default || Schema;
   function useAsyncValidator(value, rules, options = {}) {
-    const errorInfo = vueDemi.ref();
-    const isFinished = vueDemi.ref(false);
-    const pass = vueDemi.ref(false);
+    const {
+      validateOption = {},
+      immediate = true
+    } = options;
+    const valueRef = shared.resolveRef(value);
+    const errorInfo = vueDemi.shallowRef(null);
+    const isFinished = vueDemi.ref(true);
+    const pass = vueDemi.ref(!immediate);
     const errors = vueDemi.computed(() => {
       var _a;
       return ((_a = errorInfo.value) == null ? void 0 : _a.errors) || [];
@@ -147,13 +152,12 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
       var _a;
       return ((_a = errorInfo.value) == null ? void 0 : _a.fields) || {};
     });
-    const { validateOption = {} } = options;
-    vueDemi.watchEffect(async () => {
+    const validator = vueDemi.computed(() => new AsyncValidatorSchema(shared.resolveUnref(rules)));
+    const execute = async () => {
       isFinished.value = false;
       pass.value = false;
-      const validator = new AsyncValidatorSchema(shared.resolveUnref(rules));
       try {
-        await validator.validate(shared.resolveUnref(value), validateOption);
+        await validator.value.validate(valueRef.value, validateOption);
         pass.value = true;
         errorInfo.value = null;
       } catch (err) {
@@ -161,13 +165,21 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
       } finally {
         isFinished.value = true;
       }
-    });
+      return {
+        pass: pass.value,
+        errorInfo: errorInfo.value,
+        errors: errors.value,
+        errorFields: errorFields.value
+      };
+    };
+    vueDemi.watch([valueRef, validator], () => execute(), { immediate, deep: true });
     const shell = {
-      pass,
       isFinished,
-      errorInfo,
+      pass,
       errors,
-      errorFields
+      errorInfo,
+      errorFields,
+      execute
     };
     function waitUntilFinished() {
       return new Promise((resolve, reject) => {

package/index.iife.min.js

@@ -1 +1 @@
-var VueDemi=function(l,o,$){if(l.install)return l;if(!o)return console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`."),l;if(o.version.slice(0,4)==="2.7."){let p=function(g,b){var w,L={},H={config:o.config,use:o.use.bind(o),mixin:o.mixin.bind(o),component:o.component.bind(o),provide:function(m,E){return L[m]=E,this},directive:function(m,E){return E?(o.directive(m,E),H):o.directive(m)},mount:function(m,E){return w||(w=new o(Object.assign({propsData:b},g,{provide:Object.assign(L,g.provide)})),w.$mount(m,E),w)},unmount:function(){w&&(w.$destroy(),w=void 0)}};return H};var N=p;for(var a in o)l[a]=o[a];l.isVue2=!0,l.isVue3=!1,l.install=function(){},l.Vue=o,l.Vue2=o,l.version=o.version,l.warn=o.util.warn,l.createApp=p}else if(o.version.slice(0,2)==="2.")if($){for(var a in $)l[a]=$[a];l.isVue2=!0,l.isVue3=!1,l.install=function(){},l.Vue=o,l.Vue2=o,l.version=o.version}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.");else if(o.version.slice(0,2)==="3."){for(var a in o)l[a]=o[a];l.isVue2=!1,l.isVue3=!0,l.install=function(){},l.Vue=o,l.Vue2=void 0,l.version=o.version,l.set=function(p,g,b){return Array.isArray(p)?(p.length=Math.max(p.length,g),p.splice(g,1,b),b):(p[g]=b,b)},l.del=function(p,g){if(Array.isArray(p)){p.splice(g,1);return}delete p[g]}}else console.error("[vue-demi] Vue version "+o.version+" is unsupported.");return l}(this.VueDemi=this.VueDemi||(typeof VueDemi!="undefined"?VueDemi:{}),this.Vue||(typeof Vue!="undefined"?Vue:void 0),this.VueCompositionAPI||(typeof VueCompositionAPI!="undefined"?VueCompositionAPI:void 0));(function(l,o,$,a,N,p,g,b,w,L,H,m,E,C,ve,de){"use strict";var pe=Object.defineProperty,_e=Object.defineProperties,we=Object.getOwnPropertyDescriptors,M=Object.getOwnPropertySymbols,Oe=Object.prototype.hasOwnProperty,ye=Object.prototype.propertyIsEnumerable,W=(t,r,e)=>r in t?pe(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,Pe=(t,r)=>{for(var e in r||(r={}))Oe.call(r,e)&&W(t,e,r[e]);if(M)for(var e of M(r))ye.call(r,e)&&W(t,e,r[e]);return t},he=(t,r)=>_e(t,we(r));const me=$.default||$;function ge(t,r,e={}){const n=a.ref(),s=a.ref(!1),f=a.ref(!1),i=a.computed(()=>{var _;return((_=n.value)==null?void 0:_.errors)||[]}),d=a.computed(()=>{var _;return((_=n.value)==null?void 0:_.fields)||{}}),{validateOption:u={}}=e;a.watchEffect(async()=>{s.value=!1,f.value=!1;const _=new me(o.resolveUnref(r));try{await _.validate(o.resolveUnref(t),u),f.value=!0,n.value=null}catch(y){n.value=y}finally{s.value=!0}});const v={pass:f,isFinished:s,errorInfo:n,errors:i,errorFields:d};function O(){return new Promise((_,y)=>{o.until(s).toBe(!0).then(()=>_(v)).catch(h=>y(h))})}return he(Pe({},v),{then(_,y){return O().then(_,y)}})}var Ce=Object.defineProperty,be=Object.defineProperties,Ee=Object.getOwnPropertyDescriptors,q=Object.getOwnPropertySymbols,Se=Object.prototype.hasOwnProperty,$e=Object.prototype.propertyIsEnumerable,X=(t,r,e)=>r in t?Ce(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,Q=(t,r)=>{for(var e in r||(r={}))Se.call(r,e)&&X(t,e,r[e]);if(q)for(var e of q(r))$e.call(r,e)&&X(t,e,r[e]);return t},Y=(t,r)=>be(t,Ee(r));function Ae(...t){const r=typeof t[0]=="string"?t[0]:void 0,e=o.isString(r)?1:0;let n={},s=N,f={immediate:!!e,shallow:!0};const i=P=>!!(P==null?void 0:P.request);t.length>0+e&&(i(t[0+e])?s=t[0+e]:n=t[0+e]),t.length>1+e&&i(t[1+e])&&(s=t[1+e]),(t.length===2+e&&!i(t[1+e])||t.length===3+e)&&(f=t[t.length-1]);const d=a.shallowRef(),u=f.shallow?a.shallowRef():a.ref(),v=a.ref(!1),O=a.ref(!1),_=a.ref(!1),y=a.shallowRef(),h=N.CancelToken.source;let A=h();const j=P=>{v.value||!O.value||(A.cancel(P),A=h(),_.value=!0,O.value=!1,v.value=!1)},G=P=>{O.value=P,v.value=!P},z=()=>new Promise((P,c)=>{o.until(v).toBe(!0).then(()=>P(U)).catch(c)}),I=(P,c)=>z().then(P,c),J=(P=r,c={})=>{y.value=void 0;const S=typeof P=="string"?P:r??c.url;return S===void 0?(y.value=new N.AxiosError(N.AxiosError.ERR_INVALID_URL),v.value=!0,{then:I}):(j(),G(!0),s(S,Y(Q(Q({},n),typeof P=="object"?P:c),{cancelToken:A.token})).then(R=>{var F;d.value=R;const fe=R.data;u.value=fe,(F=f.onSuccess)==null||F.call(f,fe)}).catch(R=>{var F;y.value=R,(F=f.onError)==null||F.call(f,R)}).finally(()=>G(!1)),{then:I})};f.immediate&&r&&J();const U={response:d,data:u,error:y,finished:v,loading:O,isFinished:v,isLoading:O,cancel:j,isAborted:_,canceled:_,aborted:_,isCanceled:_,abort:j,execute:J};return Y(Q({},U),{then:I})}var Z=Object.freeze({__proto__:null,camelCase:p.camelCase,capitalCase:p.capitalCase,constantCase:p.constantCase,dotCase:p.dotCase,headerCase:p.headerCase,noCase:p.noCase,paramCase:p.paramCase,pascalCase:p.pascalCase,pathCase:p.pathCase,sentenceCase:p.sentenceCase,snakeCase:p.snakeCase});function je(t,r,e){if(o.isFunction(t))return a.computed(()=>Z[r](o.resolveUnref(t),e));const n=a.ref(t);return a.computed({get(){return Z[r](n.value,e)},set(s){n.value=s}})}var Ie=Object.defineProperty,k=Object.getOwnPropertySymbols,Ue=Object.prototype.hasOwnProperty,Re=Object.prototype.propertyIsEnumerable,K=(t,r,e)=>r in t?Ie(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,x=(t,r)=>{for(var e in r||(r={}))Ue.call(r,e)&&K(t,e,r[e]);if(k)for(var e of k(r))Re.call(r,e)&&K(t,e,r[e]);return t};function Fe(t){const r=new g(t?t.headers.cookie:null);return(e,{doNotParse:n=!1,autoUpdateDependencies:s=!1}={})=>V(e,{doNotParse:n,autoUpdateDependencies:s},r)}function V(t,{doNotParse:r=!1,autoUpdateDependencies:e=!1}={},n=new g){const s=e?[...t||[]]:t;let f=n.getAll({doNotParse:!0});const i=a.ref(0),d=()=>{const u=n.getAll({doNotParse:!0});Ne(s||null,u,f)&&i.value++,f=u};return n.addChangeListener(d),o.tryOnScopeDispose(()=>{n.removeChangeListener(d)}),{get:(...u)=>(e&&s&&!s.includes(u[0])&&s.push(u[0]),i.value,n.get(u[0],x({doNotParse:r},u[1]))),getAll:(...u)=>(i.value,n.getAll(x({doNotParse:r},u[0]))),set:(...u)=>n.set(...u),remove:(...u)=>n.remove(...u),addChangeListener:(...u)=>n.addChangeListener(...u),removeChangeListener:(...u)=>n.removeChangeListener(...u)}}function Ne(t,r,e){if(!t)return!0;for(const n of t)if(r[n]!==e[n])return!0;return!1}var Le=Object.defineProperty,D=Object.getOwnPropertySymbols,He=Object.prototype.hasOwnProperty,Te=Object.prototype.propertyIsEnumerable,ee=(t,r,e)=>r in t?Le(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,Be=(t,r)=>{for(var e in r||(r={}))He.call(r,e)&&ee(t,e,r[e]);if(D)for(var e of D(r))Te.call(r,e)&&ee(t,e,r[e]);return t};function Ge(t,r){const e=a.ref();let n=[];const s=w.createEventHook(),f=w.createEventHook(),i=w.createEventHook(),d=w.createEventHook(),u=w.createEventHook(),v=a.ref(!1),O=a.ref(!1),_=a.ref(!1),y=a.ref(!1),h=a.ref({color:"black",size:3,arrowEnd:!1,cornerRadius:0,dasharray:void 0,fill:"transparent",mode:"draw"});a.watch(h,()=>{const c=e.value;c&&(c.brush=h.value,c.mode=h.value.mode)},{deep:!0});const A=()=>{var c;return(c=e.value)==null?void 0:c.undo()},j=()=>{var c;return(c=e.value)==null?void 0:c.redo()},G=()=>{var c;return(c=e.value)==null?void 0:c.clear()},z=()=>{var c;return(c=e.value)==null?void 0:c.cancel()},I=c=>{var S;return(S=e.value)==null?void 0:S.load(c)},J=()=>{var c;return(c=e.value)==null?void 0:c.dump()},U=()=>{var c;n.forEach(S=>S()),(c=e.value)==null||c.unmount()},P=()=>{e.value&&(v.value=e.value.canUndo(),O.value=e.value.canRedo(),_.value=e.value.altPressed,y.value=e.value.shiftPressed)};return a.watch(()=>w.unrefElement(t),c=>{!c||typeof SVGSVGElement=="undefined"||!(c instanceof SVGSVGElement)||(e.value&&U(),e.value=b.createDrauu(Be({el:c},r)),P(),n=[e.value.on("canceled",()=>f.trigger()),e.value.on("committed",()=>i.trigger()),e.value.on("start",()=>d.trigger()),e.value.on("end",()=>u.trigger()),e.value.on("changed",()=>{P(),s.trigger()})])},{flush:"post"}),o.tryOnScopeDispose(()=>U()),{drauuInstance:e,load:I,dump:J,clear:G,cancel:z,undo:A,redo:j,canUndo:v,canRedo:O,brush:h,onChanged:s.on,onCommitted:i.on,onStart:d.on,onEnd:u.on,onCanceled:f.on}}var Je=Object.defineProperty,Qe=Object.defineProperties,ze=Object.getOwnPropertyDescriptors,T=Object.getOwnPropertySymbols,re=Object.prototype.hasOwnProperty,te=Object.prototype.propertyIsEnumerable,ne=(t,r,e)=>r in t?Je(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,Me=(t,r)=>{for(var e in r||(r={}))re.call(r,e)&&ne(t,e,r[e]);if(T)for(var e of T(r))te.call(r,e)&&ne(t,e,r[e]);return t},We=(t,r)=>Qe(t,ze(r)),qe=(t,r)=>{var e={};for(var n in t)re.call(t,n)&&r.indexOf(n)<0&&(e[n]=t[n]);if(t!=null&&T)for(var n of T(t))r.indexOf(n)<0&&te.call(t,n)&&(e[n]=t[n]);return e};function Xe(t,r={}){let e;const n=r,{immediate:s}=n,f=qe(n,["immediate"]),i=a.ref(!1),d=a.ref(!1),u=y=>e&&e.activate(y),v=y=>e&&e.deactivate(y),O=()=>{e&&(e.pause(),d.value=!0)},_=()=>{e&&(e.unpause(),d.value=!1)};return a.watch(()=>w.unrefElement(t),y=>{!y||(e=L.createFocusTrap(y,We(Me({},f),{onActivate(){i.value=!0,r.onActivate&&r.onActivate()},onDeactivate(){i.value=!1,r.onDeactivate&&r.onDeactivate()}})),s&&u())},{flush:"post"}),w.tryOnScopeDispose(()=>v()),{hasFocus:i,isPaused:d,activate:u,deactivate:v,pause:O,unpause:_}}function Ye(t,r,e){const n=()=>{var i,d;return new H((i=o.resolveUnref(r))!=null?i:[],(d=o.resolveUnref(e))==null?void 0:d.fuseOptions)},s=a.ref(n());a.watch(()=>{var i;return(i=o.resolveUnref(e))==null?void 0:i.fuseOptions},()=>{s.value=n()},{deep:!0}),a.watch(()=>o.resolveUnref(r),i=>{s.value.setCollection(i)},{deep:!0});const f=a.computed(()=>{const i=o.resolveUnref(e);if((i==null?void 0:i.matchAllWhenSearchEmpty)&&!a.unref(t))return o.resolveUnref(r).map((u,v)=>({item:u,refIndex:v}));const d=i==null?void 0:i.resultLimit;return s.value.search(o.resolveUnref(t),d?{limit:d}:void 0)});return{fuse:s,results:f}}var Ze=Object.defineProperty,oe=Object.getOwnPropertySymbols,ke=Object.prototype.hasOwnProperty,Ke=Object.prototype.propertyIsEnumerable,ae=(t,r,e)=>r in t?Ze(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,xe=(t,r)=>{for(var e in r||(r={}))ke.call(r,e)&&ae(t,e,r[e]);if(oe)for(var e of oe(r))Ke.call(r,e)&&ae(t,e,r[e]);return t};function Ve(t,r,e={}){const{flush:n="pre",deep:s=!0,shallow:f=!1,onError:i=h=>{console.error(h)},writeDefaults:d=!0}=e,u=a.ref(!1),v=(f?a.shallowRef:a.ref)(r),O=o.resolveUnref(r);async function _(){try{const h=await m.get(t);h===void 0?O!=null&&d&&await m.set(t,O):v.value=h}catch(h){i(h)}u.value=!0}_();async function y(){try{v.value==null?await m.del(t):Array.isArray(v.value)?await m.update(t,()=>JSON.parse(JSON.stringify(v.value))):typeof v.value=="object"?await m.update(t,()=>xe({},v.value)):await m.update(t,()=>v.value)}catch(h){i(h)}}return a.watch(v,()=>y(),{flush:n,deep:s}),{isFinished:u,data:v}}function De(t,r={}){const{onError:e,fallbackValue:n=null}=r,s=(d,u)=>{try{return E(d,u)}catch(v){return e==null||e(v),n}},f=a.computed(()=>s(o.resolveUnref(t),{header:!0})),i=a.computed(()=>s(o.resolveUnref(t)));return{header:f,payload:i}}function er(t=null,r){const e=a.ref(t),n=a.computed({set:f=>f?C.start():C.done(),get:()=>o.isNumber(e.value)&&e.value<1});r&&C.configure(r);const s=C.set;return C.set=f=>(e.value=f,s.call(C,f)),a.watchEffect(()=>{o.isNumber(e.value)&&o.isClient&&s.call(C,e.value)}),o.tryOnScopeDispose(C.remove),{isLoading:n,progress:e,start:C.start,done:C.done,remove:()=>{e.value=null,C.remove()}}}function rr(t,r){const e=o.resolveRef(t),n=a.ref("");return a.watch(e,async s=>{e.value&&o.isClient&&(n.value=await ve.toDataURL(s,r))},{immediate:!0}),n}var tr=Object.defineProperty,B=Object.getOwnPropertySymbols,le=Object.prototype.hasOwnProperty,se=Object.prototype.propertyIsEnumerable,ue=(t,r,e)=>r in t?tr(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,ie=(t,r)=>{for(var e in r||(r={}))le.call(r,e)&&ue(t,e,r[e]);if(B)for(var e of B(r))se.call(r,e)&&ue(t,e,r[e]);return t},nr=(t,r)=>{var e={};for(var n in t)le.call(t,n)&&r.indexOf(n)<0&&(e[n]=t[n]);if(t!=null&&B)for(var n of B(t))r.indexOf(n)<0&&se.call(t,n)&&(e[n]=t[n]);return e};function or(t,r,e={}){let n;const s=e,{document:f=w.defaultDocument}=s,i=nr(s,["document"]),d={onUpdate:O=>{ce(r,O.oldIndex,O.newIndex)}},u=()=>{const O=typeof t=="string"?f==null?void 0:f.querySelector(t):w.unrefElement(t);!O||(n=new de(O,ie(ie({},d),i)))},v=()=>n==null?void 0:n.destroy();return w.tryOnMounted(u),w.tryOnScopeDispose(v),{stop:v,start:u}}function ce(t,r,e){const n=w.resolveUnref(t);e>=0&&e<n.length&&n.splice(e,0,n.splice(r,1)[0])}l.createCookies=Fe,l.moveArrayElement=ce,l.useAsyncValidator=ge,l.useAxios=Ae,l.useChangeCase=je,l.useCookies=V,l.useDrauu=Ge,l.useFocusTrap=Xe,l.useFuse=Ye,l.useIDBKeyval=Ve,l.useJwt=De,l.useNProgress=er,l.useQRCode=rr,l.useSortable=or})(this.VueUse=this.VueUse||{},VueUse,AsyncValidator,VueDemi,axios,changeCase,UniversalCookie,Drauu,VueUse,focusTrap,Fuse,idbKeyval,jwt_decode,nprogress,QRCode,Sortable);
+var VueDemi=function(l,o,I){if(l.install)return l;if(!o)return console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`."),l;if(o.version.slice(0,4)==="2.7."){let p=function(C,E){var w,T={},B={config:o.config,use:o.use.bind(o),mixin:o.mixin.bind(o),component:o.component.bind(o),provide:function(g,S){return T[g]=S,this},directive:function(g,S){return S?(o.directive(g,S),B):o.directive(g)},mount:function(g,S){return w||(w=new o(Object.assign({propsData:E},C,{provide:Object.assign(T,C.provide)})),w.$mount(g,S),w)},unmount:function(){w&&(w.$destroy(),w=void 0)}};return B};var H=p;for(var a in o)l[a]=o[a];l.isVue2=!0,l.isVue3=!1,l.install=function(){},l.Vue=o,l.Vue2=o,l.version=o.version,l.warn=o.util.warn,l.createApp=p}else if(o.version.slice(0,2)==="2.")if(I){for(var a in I)l[a]=I[a];l.isVue2=!0,l.isVue3=!1,l.install=function(){},l.Vue=o,l.Vue2=o,l.version=o.version}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.");else if(o.version.slice(0,2)==="3."){for(var a in o)l[a]=o[a];l.isVue2=!1,l.isVue3=!0,l.install=function(){},l.Vue=o,l.Vue2=void 0,l.version=o.version,l.set=function(p,C,E){return Array.isArray(p)?(p.length=Math.max(p.length,C),p.splice(C,1,E),E):(p[C]=E,E)},l.del=function(p,C){if(Array.isArray(p)){p.splice(C,1);return}delete p[C]}}else console.error("[vue-demi] Vue version "+o.version+" is unsupported.");return l}(this.VueDemi=this.VueDemi||(typeof VueDemi!="undefined"?VueDemi:{}),this.Vue||(typeof Vue!="undefined"?Vue:void 0),this.VueCompositionAPI||(typeof VueCompositionAPI!="undefined"?VueCompositionAPI:void 0));(function(l,o,I,a,H,p,C,E,w,T,B,g,S,b,ve,de){"use strict";var pe=Object.defineProperty,_e=Object.defineProperties,we=Object.getOwnPropertyDescriptors,M=Object.getOwnPropertySymbols,Oe=Object.prototype.hasOwnProperty,ye=Object.prototype.propertyIsEnumerable,W=(t,r,e)=>r in t?pe(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,Pe=(t,r)=>{for(var e in r||(r={}))Oe.call(r,e)&&W(t,e,r[e]);if(M)for(var e of M(r))ye.call(r,e)&&W(t,e,r[e]);return t},he=(t,r)=>_e(t,we(r));const me=I.default||I;function ge(t,r,e={}){const{validateOption:n={},immediate:i=!0}=e,v=o.resolveRef(t),s=a.shallowRef(null),d=a.ref(!0),u=a.ref(!i),f=a.computed(()=>{var h;return((h=s.value)==null?void 0:h.errors)||[]}),_=a.computed(()=>{var h;return((h=s.value)==null?void 0:h.fields)||{}}),m=a.computed(()=>new me(o.resolveUnref(r))),P=async()=>{d.value=!1,u.value=!1;try{await m.value.validate(v.value,n),u.value=!0,s.value=null}catch(h){s.value=h}finally{d.value=!0}return{pass:u.value,errorInfo:s.value,errors:f.value,errorFields:_.value}};a.watch([v,m],()=>P(),{immediate:i,deep:!0});const O={isFinished:d,pass:u,errors:f,errorInfo:s,errorFields:_,execute:P};function A(){return new Promise((h,$)=>{o.until(d).toBe(!0).then(()=>h(O)).catch(U=>$(U))})}return he(Pe({},O),{then(h,$){return A().then(h,$)}})}var Ce=Object.defineProperty,be=Object.defineProperties,Ee=Object.getOwnPropertyDescriptors,q=Object.getOwnPropertySymbols,Se=Object.prototype.hasOwnProperty,$e=Object.prototype.propertyIsEnumerable,X=(t,r,e)=>r in t?Ce(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,z=(t,r)=>{for(var e in r||(r={}))Se.call(r,e)&&X(t,e,r[e]);if(q)for(var e of q(r))$e.call(r,e)&&X(t,e,r[e]);return t},Y=(t,r)=>be(t,Ee(r));function Ae(...t){const r=typeof t[0]=="string"?t[0]:void 0,e=o.isString(r)?1:0;let n={},i=H,v={immediate:!!e,shallow:!0};const s=y=>!!(y==null?void 0:y.request);t.length>0+e&&(s(t[0+e])?i=t[0+e]:n=t[0+e]),t.length>1+e&&s(t[1+e])&&(i=t[1+e]),(t.length===2+e&&!s(t[1+e])||t.length===3+e)&&(v=t[t.length-1]);const d=a.shallowRef(),u=v.shallow?a.shallowRef():a.ref(),f=a.ref(!1),_=a.ref(!1),m=a.ref(!1),P=a.shallowRef(),O=H.CancelToken.source;let A=O();const h=y=>{f.value||!_.value||(A.cancel(y),A=O(),m.value=!0,_.value=!1,f.value=!1)},$=y=>{_.value=y,f.value=!y},U=()=>new Promise((y,c)=>{o.until(f).toBe(!0).then(()=>y(F)).catch(c)}),R=(y,c)=>U().then(y,c),Q=(y=r,c={})=>{P.value=void 0;const j=typeof y=="string"?y:r??c.url;return j===void 0?(P.value=new H.AxiosError(H.AxiosError.ERR_INVALID_URL),f.value=!0,{then:R}):(h(),$(!0),i(j,Y(z(z({},n),typeof y=="object"?y:c),{cancelToken:A.token})).then(N=>{var L;d.value=N;const fe=N.data;u.value=fe,(L=v.onSuccess)==null||L.call(v,fe)}).catch(N=>{var L;P.value=N,(L=v.onError)==null||L.call(v,N)}).finally(()=>$(!1)),{then:R})};v.immediate&&r&&Q();const F={response:d,data:u,error:P,finished:f,loading:_,isFinished:f,isLoading:_,cancel:h,isAborted:m,canceled:m,aborted:m,isCanceled:m,abort:h,execute:Q};return Y(z({},F),{then:R})}var Z=Object.freeze({__proto__:null,camelCase:p.camelCase,capitalCase:p.capitalCase,constantCase:p.constantCase,dotCase:p.dotCase,headerCase:p.headerCase,noCase:p.noCase,paramCase:p.paramCase,pascalCase:p.pascalCase,pathCase:p.pathCase,sentenceCase:p.sentenceCase,snakeCase:p.snakeCase});function je(t,r,e){if(o.isFunction(t))return a.computed(()=>Z[r](o.resolveUnref(t),e));const n=a.ref(t);return a.computed({get(){return Z[r](n.value,e)},set(i){n.value=i}})}var Ie=Object.defineProperty,k=Object.getOwnPropertySymbols,Ue=Object.prototype.hasOwnProperty,Re=Object.prototype.propertyIsEnumerable,x=(t,r,e)=>r in t?Ie(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,K=(t,r)=>{for(var e in r||(r={}))Ue.call(r,e)&&x(t,e,r[e]);if(k)for(var e of k(r))Re.call(r,e)&&x(t,e,r[e]);return t};function Fe(t){const r=new C(t?t.headers.cookie:null);return(e,{doNotParse:n=!1,autoUpdateDependencies:i=!1}={})=>V(e,{doNotParse:n,autoUpdateDependencies:i},r)}function V(t,{doNotParse:r=!1,autoUpdateDependencies:e=!1}={},n=new C){const i=e?[...t||[]]:t;let v=n.getAll({doNotParse:!0});const s=a.ref(0),d=()=>{const u=n.getAll({doNotParse:!0});Ne(i||null,u,v)&&s.value++,v=u};return n.addChangeListener(d),o.tryOnScopeDispose(()=>{n.removeChangeListener(d)}),{get:(...u)=>(e&&i&&!i.includes(u[0])&&i.push(u[0]),s.value,n.get(u[0],K({doNotParse:r},u[1]))),getAll:(...u)=>(s.value,n.getAll(K({doNotParse:r},u[0]))),set:(...u)=>n.set(...u),remove:(...u)=>n.remove(...u),addChangeListener:(...u)=>n.addChangeListener(...u),removeChangeListener:(...u)=>n.removeChangeListener(...u)}}function Ne(t,r,e){if(!t)return!0;for(const n of t)if(r[n]!==e[n])return!0;return!1}var Le=Object.defineProperty,D=Object.getOwnPropertySymbols,He=Object.prototype.hasOwnProperty,Te=Object.prototype.propertyIsEnumerable,ee=(t,r,e)=>r in t?Le(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,Be=(t,r)=>{for(var e in r||(r={}))He.call(r,e)&&ee(t,e,r[e]);if(D)for(var e of D(r))Te.call(r,e)&&ee(t,e,r[e]);return t};function Ge(t,r){const e=a.ref();let n=[];const i=w.createEventHook(),v=w.createEventHook(),s=w.createEventHook(),d=w.createEventHook(),u=w.createEventHook(),f=a.ref(!1),_=a.ref(!1),m=a.ref(!1),P=a.ref(!1),O=a.ref({color:"black",size:3,arrowEnd:!1,cornerRadius:0,dasharray:void 0,fill:"transparent",mode:"draw"});a.watch(O,()=>{const c=e.value;c&&(c.brush=O.value,c.mode=O.value.mode)},{deep:!0});const A=()=>{var c;return(c=e.value)==null?void 0:c.undo()},h=()=>{var c;return(c=e.value)==null?void 0:c.redo()},$=()=>{var c;return(c=e.value)==null?void 0:c.clear()},U=()=>{var c;return(c=e.value)==null?void 0:c.cancel()},R=c=>{var j;return(j=e.value)==null?void 0:j.load(c)},Q=()=>{var c;return(c=e.value)==null?void 0:c.dump()},F=()=>{var c;n.forEach(j=>j()),(c=e.value)==null||c.unmount()},y=()=>{e.value&&(f.value=e.value.canUndo(),_.value=e.value.canRedo(),m.value=e.value.altPressed,P.value=e.value.shiftPressed)};return a.watch(()=>w.unrefElement(t),c=>{!c||typeof SVGSVGElement=="undefined"||!(c instanceof SVGSVGElement)||(e.value&&F(),e.value=E.createDrauu(Be({el:c},r)),y(),n=[e.value.on("canceled",()=>v.trigger()),e.value.on("committed",()=>s.trigger()),e.value.on("start",()=>d.trigger()),e.value.on("end",()=>u.trigger()),e.value.on("changed",()=>{y(),i.trigger()})])},{flush:"post"}),o.tryOnScopeDispose(()=>F()),{drauuInstance:e,load:R,dump:Q,clear:$,cancel:U,undo:A,redo:h,canUndo:f,canRedo:_,brush:O,onChanged:i.on,onCommitted:s.on,onStart:d.on,onEnd:u.on,onCanceled:v.on}}var Je=Object.defineProperty,Qe=Object.defineProperties,ze=Object.getOwnPropertyDescriptors,G=Object.getOwnPropertySymbols,re=Object.prototype.hasOwnProperty,te=Object.prototype.propertyIsEnumerable,ne=(t,r,e)=>r in t?Je(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,Me=(t,r)=>{for(var e in r||(r={}))re.call(r,e)&&ne(t,e,r[e]);if(G)for(var e of G(r))te.call(r,e)&&ne(t,e,r[e]);return t},We=(t,r)=>Qe(t,ze(r)),qe=(t,r)=>{var e={};for(var n in t)re.call(t,n)&&r.indexOf(n)<0&&(e[n]=t[n]);if(t!=null&&G)for(var n of G(t))r.indexOf(n)<0&&te.call(t,n)&&(e[n]=t[n]);return e};function Xe(t,r={}){let e;const n=r,{immediate:i}=n,v=qe(n,["immediate"]),s=a.ref(!1),d=a.ref(!1),u=P=>e&&e.activate(P),f=P=>e&&e.deactivate(P),_=()=>{e&&(e.pause(),d.value=!0)},m=()=>{e&&(e.unpause(),d.value=!1)};return a.watch(()=>w.unrefElement(t),P=>{!P||(e=T.createFocusTrap(P,We(Me({},v),{onActivate(){s.value=!0,r.onActivate&&r.onActivate()},onDeactivate(){s.value=!1,r.onDeactivate&&r.onDeactivate()}})),i&&u())},{flush:"post"}),w.tryOnScopeDispose(()=>f()),{hasFocus:s,isPaused:d,activate:u,deactivate:f,pause:_,unpause:m}}function Ye(t,r,e){const n=()=>{var s,d;return new B((s=o.resolveUnref(r))!=null?s:[],(d=o.resolveUnref(e))==null?void 0:d.fuseOptions)},i=a.ref(n());a.watch(()=>{var s;return(s=o.resolveUnref(e))==null?void 0:s.fuseOptions},()=>{i.value=n()},{deep:!0}),a.watch(()=>o.resolveUnref(r),s=>{i.value.setCollection(s)},{deep:!0});const v=a.computed(()=>{const s=o.resolveUnref(e);if((s==null?void 0:s.matchAllWhenSearchEmpty)&&!a.unref(t))return o.resolveUnref(r).map((u,f)=>({item:u,refIndex:f}));const d=s==null?void 0:s.resultLimit;return i.value.search(o.resolveUnref(t),d?{limit:d}:void 0)});return{fuse:i,results:v}}var Ze=Object.defineProperty,oe=Object.getOwnPropertySymbols,ke=Object.prototype.hasOwnProperty,xe=Object.prototype.propertyIsEnumerable,ae=(t,r,e)=>r in t?Ze(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,Ke=(t,r)=>{for(var e in r||(r={}))ke.call(r,e)&&ae(t,e,r[e]);if(oe)for(var e of oe(r))xe.call(r,e)&&ae(t,e,r[e]);return t};function Ve(t,r,e={}){const{flush:n="pre",deep:i=!0,shallow:v=!1,onError:s=O=>{console.error(O)},writeDefaults:d=!0}=e,u=a.ref(!1),f=(v?a.shallowRef:a.ref)(r),_=o.resolveUnref(r);async function m(){try{const O=await g.get(t);O===void 0?_!=null&&d&&await g.set(t,_):f.value=O}catch(O){s(O)}u.value=!0}m();async function P(){try{f.value==null?await g.del(t):Array.isArray(f.value)?await g.update(t,()=>JSON.parse(JSON.stringify(f.value))):typeof f.value=="object"?await g.update(t,()=>Ke({},f.value)):await g.update(t,()=>f.value)}catch(O){s(O)}}return a.watch(f,()=>P(),{flush:n,deep:i}),{isFinished:u,data:f}}function De(t,r={}){const{onError:e,fallbackValue:n=null}=r,i=(d,u)=>{try{return S(d,u)}catch(f){return e==null||e(f),n}},v=a.computed(()=>i(o.resolveUnref(t),{header:!0})),s=a.computed(()=>i(o.resolveUnref(t)));return{header:v,payload:s}}function er(t=null,r){const e=a.ref(t),n=a.computed({set:v=>v?b.start():b.done(),get:()=>o.isNumber(e.value)&&e.value<1});r&&b.configure(r);const i=b.set;return b.set=v=>(e.value=v,i.call(b,v)),a.watchEffect(()=>{o.isNumber(e.value)&&o.isClient&&i.call(b,e.value)}),o.tryOnScopeDispose(b.remove),{isLoading:n,progress:e,start:b.start,done:b.done,remove:()=>{e.value=null,b.remove()}}}function rr(t,r){const e=o.resolveRef(t),n=a.ref("");return a.watch(e,async i=>{e.value&&o.isClient&&(n.value=await ve.toDataURL(i,r))},{immediate:!0}),n}var tr=Object.defineProperty,J=Object.getOwnPropertySymbols,le=Object.prototype.hasOwnProperty,se=Object.prototype.propertyIsEnumerable,ue=(t,r,e)=>r in t?tr(t,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[r]=e,ie=(t,r)=>{for(var e in r||(r={}))le.call(r,e)&&ue(t,e,r[e]);if(J)for(var e of J(r))se.call(r,e)&&ue(t,e,r[e]);return t},nr=(t,r)=>{var e={};for(var n in t)le.call(t,n)&&r.indexOf(n)<0&&(e[n]=t[n]);if(t!=null&&J)for(var n of J(t))r.indexOf(n)<0&&se.call(t,n)&&(e[n]=t[n]);return e};function or(t,r,e={}){let n;const i=e,{document:v=w.defaultDocument}=i,s=nr(i,["document"]),d={onUpdate:_=>{ce(r,_.oldIndex,_.newIndex)}},u=()=>{const _=typeof t=="string"?v==null?void 0:v.querySelector(t):w.unrefElement(t);!_||(n=new de(_,ie(ie({},d),s)))},f=()=>n==null?void 0:n.destroy();return w.tryOnMounted(u),w.tryOnScopeDispose(f),{stop:f,start:u}}function ce(t,r,e){const n=w.resolveUnref(t);e>=0&&e<n.length&&n.splice(e,0,n.splice(r,1)[0])}l.createCookies=Fe,l.moveArrayElement=ce,l.useAsyncValidator=ge,l.useAxios=Ae,l.useChangeCase=je,l.useCookies=V,l.useDrauu=Ge,l.useFocusTrap=Xe,l.useFuse=Ye,l.useIDBKeyval=Ve,l.useJwt=De,l.useNProgress=er,l.useQRCode=rr,l.useSortable=or})(this.VueUse=this.VueUse||{},VueUse,AsyncValidator,VueDemi,axios,changeCase,UniversalCookie,Drauu,VueUse,focusTrap,Fuse,idbKeyval,jwt_decode,nprogress,QRCode,Sortable);

package/index.mjs

@@ -1,6 +1,6 @@
-import { resolveUnref, until, isString, isFunction, tryOnScopeDispose, isNumber, isClient, resolveRef } from '@vueuse/shared';
+import { resolveRef, resolveUnref, until, isString, isFunction, tryOnScopeDispose, isNumber, isClient } from '@vueuse/shared';
 import Schema from 'async-validator';
-import { ref, computed, watchEffect, shallowRef, watch, unref } from 'vue-demi';
+import { shallowRef, ref, computed, watch, unref, watchEffect } from 'vue-demi';
 import axios, { AxiosError } from 'axios';
 import { camelCase, capitalCase, constantCase, dotCase, headerCase, noCase, paramCase, pascalCase, pathCase, sentenceCase, snakeCase } from 'change-case';
 import Cookie from 'universal-cookie';
@@ -35,9 +35,14 @@ var __spreadValues$6 = (a, b) => {
 var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
 const AsyncValidatorSchema = Schema.default || Schema;
 function useAsyncValidator(value, rules, options = {}) {
-  const errorInfo = ref();
-  const isFinished = ref(false);
-  const pass = ref(false);
+  const {
+    validateOption = {},
+    immediate = true
+  } = options;
+  const valueRef = resolveRef(value);
+  const errorInfo = shallowRef(null);
+  const isFinished = ref(true);
+  const pass = ref(!immediate);
   const errors = computed(() => {
     var _a;
     return ((_a = errorInfo.value) == null ? void 0 : _a.errors) || [];
@@ -46,13 +51,12 @@ function useAsyncValidator(value, rules, options = {}) {
     var _a;
     return ((_a = errorInfo.value) == null ? void 0 : _a.fields) || {};
   });
-  const { validateOption = {} } = options;
-  watchEffect(async () => {
+  const validator = computed(() => new AsyncValidatorSchema(resolveUnref(rules)));
+  const execute = async () => {
     isFinished.value = false;
     pass.value = false;
-    const validator = new AsyncValidatorSchema(resolveUnref(rules));
     try {
-      await validator.validate(resolveUnref(value), validateOption);
+      await validator.value.validate(valueRef.value, validateOption);
       pass.value = true;
       errorInfo.value = null;
     } catch (err) {
@@ -60,13 +64,21 @@ function useAsyncValidator(value, rules, options = {}) {
     } finally {
       isFinished.value = true;
     }
-  });
+    return {
+      pass: pass.value,
+      errorInfo: errorInfo.value,
+      errors: errors.value,
+      errorFields: errorFields.value
+    };
+  };
+  watch([valueRef, validator], () => execute(), { immediate, deep: true });
   const shell = {
-    pass,
     isFinished,
-    errorInfo,
+    pass,
     errors,
-    errorFields
+    errorInfo,
+    errorFields,
+    execute
   };
   function waitUntilFinished() {
     return new Promise((resolve, reject) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vueuse/integrations",
-  "version": "10.0.0-beta.0",
+  "version": "10.0.0-beta.1",
   "description": "Integration wrappers for utility libraries",
   "author": "Anthony Fu <https://github.com/antfu>",
   "license": "MIT",
@@ -161,8 +161,8 @@
     }
   },
   "dependencies": {
-    "@vueuse/core": "10.0.0-beta.0",
-    "@vueuse/shared": "10.0.0-beta.0",
+    "@vueuse/core": "10.0.0-beta.1",
+    "@vueuse/shared": "10.0.0-beta.1",
     "vue-demi": "*"
   },
   "devDependencies": {

package/useAsyncValidator/component.cjs

@@ -25,9 +25,14 @@ var __spreadValues = (a, b) => {
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 const AsyncValidatorSchema = Schema.default || Schema;
 function useAsyncValidator(value, rules, options = {}) {
-  const errorInfo = vueDemi.ref();
-  const isFinished = vueDemi.ref(false);
-  const pass = vueDemi.ref(false);
+  const {
+    validateOption = {},
+    immediate = true
+  } = options;
+  const valueRef = shared.resolveRef(value);
+  const errorInfo = vueDemi.shallowRef(null);
+  const isFinished = vueDemi.ref(true);
+  const pass = vueDemi.ref(!immediate);
   const errors = vueDemi.computed(() => {
     var _a;
     return ((_a = errorInfo.value) == null ? void 0 : _a.errors) || [];
@@ -36,13 +41,12 @@ function useAsyncValidator(value, rules, options = {}) {
     var _a;
     return ((_a = errorInfo.value) == null ? void 0 : _a.fields) || {};
   });
-  const { validateOption = {} } = options;
-  vueDemi.watchEffect(async () => {
+  const validator = vueDemi.computed(() => new AsyncValidatorSchema(shared.resolveUnref(rules)));
+  const execute = async () => {
     isFinished.value = false;
     pass.value = false;
-    const validator = new AsyncValidatorSchema(shared.resolveUnref(rules));
     try {
-      await validator.validate(shared.resolveUnref(value), validateOption);
+      await validator.value.validate(valueRef.value, validateOption);
       pass.value = true;
       errorInfo.value = null;
     } catch (err) {
@@ -50,13 +54,21 @@ function useAsyncValidator(value, rules, options = {}) {
     } finally {
       isFinished.value = true;
     }
-  });
+    return {
+      pass: pass.value,
+      errorInfo: errorInfo.value,
+      errors: errors.value,
+      errorFields: errorFields.value
+    };
+  };
+  vueDemi.watch([valueRef, validator], () => execute(), { immediate, deep: true });
   const shell = {
-    pass,
     isFinished,
-    errorInfo,
+    pass,
     errors,
-    errorFields
+    errorInfo,
+    errorFields,
+    execute
   };
   function waitUntilFinished() {
     return new Promise((resolve, reject) => {

package/useAsyncValidator/component.mjs

@@ -1,5 +1,5 @@
-import { ref, computed, watchEffect, defineComponent, reactive } from 'vue-demi';
-import { resolveUnref, until } from '@vueuse/shared';
+import { shallowRef, ref, computed, watch, defineComponent, reactive } from 'vue-demi';
+import { resolveRef, resolveUnref, until } from '@vueuse/shared';
 import Schema from 'async-validator';
 
 var __defProp = Object.defineProperty;
@@ -23,9 +23,14 @@ var __spreadValues = (a, b) => {
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 const AsyncValidatorSchema = Schema.default || Schema;
 function useAsyncValidator(value, rules, options = {}) {
-  const errorInfo = ref();
-  const isFinished = ref(false);
-  const pass = ref(false);
+  const {
+    validateOption = {},
+    immediate = true
+  } = options;
+  const valueRef = resolveRef(value);
+  const errorInfo = shallowRef(null);
+  const isFinished = ref(true);
+  const pass = ref(!immediate);
   const errors = computed(() => {
     var _a;
     return ((_a = errorInfo.value) == null ? void 0 : _a.errors) || [];
@@ -34,13 +39,12 @@ function useAsyncValidator(value, rules, options = {}) {
     var _a;
     return ((_a = errorInfo.value) == null ? void 0 : _a.fields) || {};
   });
-  const { validateOption = {} } = options;
-  watchEffect(async () => {
+  const validator = computed(() => new AsyncValidatorSchema(resolveUnref(rules)));
+  const execute = async () => {
     isFinished.value = false;
     pass.value = false;
-    const validator = new AsyncValidatorSchema(resolveUnref(rules));
     try {
-      await validator.validate(resolveUnref(value), validateOption);
+      await validator.value.validate(valueRef.value, validateOption);
       pass.value = true;
       errorInfo.value = null;
     } catch (err) {
@@ -48,13 +52,21 @@ function useAsyncValidator(value, rules, options = {}) {
     } finally {
       isFinished.value = true;
     }
-  });
+    return {
+      pass: pass.value,
+      errorInfo: errorInfo.value,
+      errors: errors.value,
+      errorFields: errorFields.value
+    };
+  };
+  watch([valueRef, validator], () => execute(), { immediate, deep: true });
   const shell = {
-    pass,
     isFinished,
-    errorInfo,
+    pass,
     errors,
-    errorFields
+    errorInfo,
+    errorFields,
+    execute
   };
   function waitUntilFinished() {
     return new Promise((resolve, reject) => {

package/useAsyncValidator.cjs

@@ -25,9 +25,14 @@ var __spreadValues = (a, b) => {
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 const AsyncValidatorSchema = Schema.default || Schema;
 function useAsyncValidator(value, rules, options = {}) {
-  const errorInfo = vueDemi.ref();
-  const isFinished = vueDemi.ref(false);
-  const pass = vueDemi.ref(false);
+  const {
+    validateOption = {},
+    immediate = true
+  } = options;
+  const valueRef = shared.resolveRef(value);
+  const errorInfo = vueDemi.shallowRef(null);
+  const isFinished = vueDemi.ref(true);
+  const pass = vueDemi.ref(!immediate);
   const errors = vueDemi.computed(() => {
     var _a;
     return ((_a = errorInfo.value) == null ? void 0 : _a.errors) || [];
@@ -36,13 +41,12 @@ function useAsyncValidator(value, rules, options = {}) {
     var _a;
     return ((_a = errorInfo.value) == null ? void 0 : _a.fields) || {};
   });
-  const { validateOption = {} } = options;
-  vueDemi.watchEffect(async () => {
+  const validator = vueDemi.computed(() => new AsyncValidatorSchema(shared.resolveUnref(rules)));
+  const execute = async () => {
     isFinished.value = false;
     pass.value = false;
-    const validator = new AsyncValidatorSchema(shared.resolveUnref(rules));
     try {
-      await validator.validate(shared.resolveUnref(value), validateOption);
+      await validator.value.validate(valueRef.value, validateOption);
       pass.value = true;
       errorInfo.value = null;
     } catch (err) {
@@ -50,13 +54,21 @@ function useAsyncValidator(value, rules, options = {}) {
     } finally {
       isFinished.value = true;
     }
-  });
+    return {
+      pass: pass.value,
+      errorInfo: errorInfo.value,
+      errors: errors.value,
+      errorFields: errorFields.value
+    };
+  };
+  vueDemi.watch([valueRef, validator], () => execute(), { immediate, deep: true });
   const shell = {
-    pass,
     isFinished,
-    errorInfo,
+    pass,
     errors,
-    errorFields
+    errorInfo,
+    errorFields,
+    execute
   };
   function waitUntilFinished() {
     return new Promise((resolve, reject) => {

package/useAsyncValidator.d.ts

@@ -6,18 +6,26 @@ type AsyncValidatorError = Error & {
     errors: ValidateError[];
     fields: Record<string, ValidateError[]>;
 };
+interface UseAsyncValidatorExecuteReturn {
+    pass: boolean;
+    errors: AsyncValidatorError['errors'] | undefined;
+    errorInfo: AsyncValidatorError | null;
+    errorFields: AsyncValidatorError['fields'] | undefined;
+}
 interface UseAsyncValidatorReturn {
     pass: Ref<boolean>;
-    errorInfo: Ref<AsyncValidatorError | null>;
     isFinished: Ref<boolean>;
     errors: Ref<AsyncValidatorError['errors'] | undefined>;
+    errorInfo: Ref<AsyncValidatorError | null>;
     errorFields: Ref<AsyncValidatorError['fields'] | undefined>;
+    execute: () => Promise<UseAsyncValidatorExecuteReturn>;
 }
 interface UseAsyncValidatorOptions {
     /**
      * @see https://github.com/yiminghe/async-validator#options
      */
     validateOption?: ValidateOption;
+    immediate?: boolean;
 }
 /**
  * Wrapper for async-validator.
@@ -27,4 +35,4 @@ interface UseAsyncValidatorOptions {
  */
 declare function useAsyncValidator(value: MaybeComputedRef<Record<string, any>>, rules: MaybeComputedRef<Rules>, options?: UseAsyncValidatorOptions): UseAsyncValidatorReturn & PromiseLike<UseAsyncValidatorReturn>;
 
-export { AsyncValidatorError, UseAsyncValidatorOptions, UseAsyncValidatorReturn, useAsyncValidator };
+export { AsyncValidatorError, UseAsyncValidatorExecuteReturn, UseAsyncValidatorOptions, UseAsyncValidatorReturn, useAsyncValidator };

package/useAsyncValidator.iife.js

@@ -136,9 +136,14 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
   var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
   const AsyncValidatorSchema = Schema.default || Schema;
   function useAsyncValidator(value, rules, options = {}) {
-    const errorInfo = vueDemi.ref();
-    const isFinished = vueDemi.ref(false);
-    const pass = vueDemi.ref(false);
+    const {
+      validateOption = {},
+      immediate = true
+    } = options;
+    const valueRef = shared.resolveRef(value);
+    const errorInfo = vueDemi.shallowRef(null);
+    const isFinished = vueDemi.ref(true);
+    const pass = vueDemi.ref(!immediate);
     const errors = vueDemi.computed(() => {
       var _a;
       return ((_a = errorInfo.value) == null ? void 0 : _a.errors) || [];
@@ -147,13 +152,12 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
       var _a;
       return ((_a = errorInfo.value) == null ? void 0 : _a.fields) || {};
     });
-    const { validateOption = {} } = options;
-    vueDemi.watchEffect(async () => {
+    const validator = vueDemi.computed(() => new AsyncValidatorSchema(shared.resolveUnref(rules)));
+    const execute = async () => {
       isFinished.value = false;
       pass.value = false;
-      const validator = new AsyncValidatorSchema(shared.resolveUnref(rules));
       try {
-        await validator.validate(shared.resolveUnref(value), validateOption);
+        await validator.value.validate(valueRef.value, validateOption);
         pass.value = true;
         errorInfo.value = null;
       } catch (err) {
@@ -161,13 +165,21 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
       } finally {
         isFinished.value = true;
       }
-    });
+      return {
+        pass: pass.value,
+        errorInfo: errorInfo.value,
+        errors: errors.value,
+        errorFields: errorFields.value
+      };
+    };
+    vueDemi.watch([valueRef, validator], () => execute(), { immediate, deep: true });
     const shell = {
-      pass,
       isFinished,
-      errorInfo,
+      pass,
       errors,
-      errorFields
+      errorInfo,
+      errorFields,
+      execute
     };
     function waitUntilFinished() {
       return new Promise((resolve, reject) => {

package/useAsyncValidator.iife.min.js

@@ -1 +1 @@
-var VueDemi=function(n,r,v){if(n.install)return n;if(!r)return console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`."),n;if(r.version.slice(0,4)==="2.7."){let o=function(i,c){var f,h={},p={config:r.config,use:r.use.bind(r),mixin:r.mixin.bind(r),component:r.component.bind(r),provide:function(d,u){return h[d]=u,this},directive:function(d,u){return u?(r.directive(d,u),p):r.directive(d)},mount:function(d,u){return f||(f=new r(Object.assign({propsData:c},i,{provide:Object.assign(h,i.provide)})),f.$mount(d,u),f)},unmount:function(){f&&(f.$destroy(),f=void 0)}};return p};var b=o;for(var e in r)n[e]=r[e];n.isVue2=!0,n.isVue3=!1,n.install=function(){},n.Vue=r,n.Vue2=r,n.version=r.version,n.warn=r.util.warn,n.createApp=o}else if(r.version.slice(0,2)==="2.")if(v){for(var e in v)n[e]=v[e];n.isVue2=!0,n.isVue3=!1,n.install=function(){},n.Vue=r,n.Vue2=r,n.version=r.version}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.");else if(r.version.slice(0,2)==="3."){for(var e in r)n[e]=r[e];n.isVue2=!1,n.isVue3=!0,n.install=function(){},n.Vue=r,n.Vue2=void 0,n.version=r.version,n.set=function(o,i,c){return Array.isArray(o)?(o.length=Math.max(o.length,i),o.splice(i,1,c),c):(o[i]=c,c)},n.del=function(o,i){if(Array.isArray(o)){o.splice(i,1);return}delete o[i]}}else console.error("[vue-demi] Vue version "+r.version+" is unsupported.");return n}(this.VueDemi=this.VueDemi||(typeof VueDemi!="undefined"?VueDemi:{}),this.Vue||(typeof Vue!="undefined"?Vue:void 0),this.VueCompositionAPI||(typeof VueCompositionAPI!="undefined"?VueCompositionAPI:void 0));(function(n,r,v,e){"use strict";var b=Object.defineProperty,o=Object.defineProperties,i=Object.getOwnPropertyDescriptors,c=Object.getOwnPropertySymbols,f=Object.prototype.hasOwnProperty,h=Object.prototype.propertyIsEnumerable,p=(a,t,s)=>t in a?b(a,t,{enumerable:!0,configurable:!0,writable:!0,value:s}):a[t]=s,d=(a,t)=>{for(var s in t||(t={}))f.call(t,s)&&p(a,s,t[s]);if(c)for(var s of c(t))h.call(t,s)&&p(a,s,t[s]);return a},u=(a,t)=>o(a,i(t));const A=v.default||v;function j(a,t,s={}){const y=e.ref(),w=e.ref(!1),O=e.ref(!1),U=e.computed(()=>{var l;return((l=y.value)==null?void 0:l.errors)||[]}),g=e.computed(()=>{var l;return((l=y.value)==null?void 0:l.fields)||{}}),{validateOption:I={}}=s;e.watchEffect(async()=>{w.value=!1,O.value=!1;const l=new A(r.resolveUnref(t));try{await l.validate(r.resolveUnref(a),I),O.value=!0,y.value=null}catch(_){y.value=_}finally{w.value=!0}});const P={pass:O,isFinished:w,errorInfo:y,errors:U,errorFields:g};function x(){return new Promise((l,_)=>{r.until(w).toBe(!0).then(()=>l(P)).catch(E=>_(E))})}return u(d({},P),{then(l,_){return x().then(l,_)}})}n.useAsyncValidator=j})(this.VueUse=this.VueUse||{},VueUse,AsyncValidator,VueDemi);
+var VueDemi=function(e,r,v){if(e.install)return e;if(!r)return console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`."),e;if(r.version.slice(0,4)==="2.7."){let o=function(i,f){var c,y={},h={config:r.config,use:r.use.bind(r),mixin:r.mixin.bind(r),component:r.component.bind(r),provide:function(u,d){return y[u]=d,this},directive:function(u,d){return d?(r.directive(u,d),h):r.directive(u)},mount:function(u,d){return c||(c=new r(Object.assign({propsData:f},i,{provide:Object.assign(y,i.provide)})),c.$mount(u,d),c)},unmount:function(){c&&(c.$destroy(),c=void 0)}};return h};var x=o;for(var n in r)e[n]=r[n];e.isVue2=!0,e.isVue3=!1,e.install=function(){},e.Vue=r,e.Vue2=r,e.version=r.version,e.warn=r.util.warn,e.createApp=o}else if(r.version.slice(0,2)==="2.")if(v){for(var n in v)e[n]=v[n];e.isVue2=!0,e.isVue3=!1,e.install=function(){},e.Vue=r,e.Vue2=r,e.version=r.version}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.");else if(r.version.slice(0,2)==="3."){for(var n in r)e[n]=r[n];e.isVue2=!1,e.isVue3=!0,e.install=function(){},e.Vue=r,e.Vue2=void 0,e.version=r.version,e.set=function(o,i,f){return Array.isArray(o)?(o.length=Math.max(o.length,i),o.splice(i,1,f),f):(o[i]=f,f)},e.del=function(o,i){if(Array.isArray(o)){o.splice(i,1);return}delete o[i]}}else console.error("[vue-demi] Vue version "+r.version+" is unsupported.");return e}(this.VueDemi=this.VueDemi||(typeof VueDemi!="undefined"?VueDemi:{}),this.Vue||(typeof Vue!="undefined"?Vue:void 0),this.VueCompositionAPI||(typeof VueCompositionAPI!="undefined"?VueCompositionAPI:void 0));(function(e,r,v,n){"use strict";var x=Object.defineProperty,o=Object.defineProperties,i=Object.getOwnPropertyDescriptors,f=Object.getOwnPropertySymbols,c=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable,h=(a,t,s)=>t in a?x(a,t,{enumerable:!0,configurable:!0,writable:!0,value:s}):a[t]=s,u=(a,t)=>{for(var s in t||(t={}))c.call(t,s)&&h(a,s,t[s]);if(f)for(var s of f(t))y.call(t,s)&&h(a,s,t[s]);return a},d=(a,t)=>o(a,i(t));const F=v.default||v;function R(a,t,s={}){const{validateOption:E={},immediate:P=!0}=s,b=r.resolveRef(a),p=n.shallowRef(null),_=n.ref(!0),w=n.ref(!P),A=n.computed(()=>{var l;return((l=p.value)==null?void 0:l.errors)||[]}),j=n.computed(()=>{var l;return((l=p.value)==null?void 0:l.fields)||{}}),I=n.computed(()=>new F(r.resolveUnref(t))),g=async()=>{_.value=!1,w.value=!1;try{await I.value.validate(b.value,E),w.value=!0,p.value=null}catch(l){p.value=l}finally{_.value=!0}return{pass:w.value,errorInfo:p.value,errors:A.value,errorFields:j.value}};n.watch([b,I],()=>g(),{immediate:P,deep:!0});const U={isFinished:_,pass:w,errors:A,errorInfo:p,errorFields:j,execute:g};function S(){return new Promise((l,O)=>{r.until(_).toBe(!0).then(()=>l(U)).catch($=>O($))})}return d(u({},U),{then(l,O){return S().then(l,O)}})}e.useAsyncValidator=R})(this.VueUse=this.VueUse||{},VueUse,AsyncValidator,VueDemi);

package/useAsyncValidator.mjs

@@ -1,6 +1,6 @@
-import { resolveUnref, until } from '@vueuse/shared';
+import { resolveRef, resolveUnref, until } from '@vueuse/shared';
 import Schema from 'async-validator';
-import { ref, computed, watchEffect } from 'vue-demi';
+import { shallowRef, ref, computed, watch } from 'vue-demi';
 
 var __defProp = Object.defineProperty;
 var __defProps = Object.defineProperties;
@@ -23,9 +23,14 @@ var __spreadValues = (a, b) => {
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 const AsyncValidatorSchema = Schema.default || Schema;
 function useAsyncValidator(value, rules, options = {}) {
-  const errorInfo = ref();
-  const isFinished = ref(false);
-  const pass = ref(false);
+  const {
+    validateOption = {},
+    immediate = true
+  } = options;
+  const valueRef = resolveRef(value);
+  const errorInfo = shallowRef(null);
+  const isFinished = ref(true);
+  const pass = ref(!immediate);
   const errors = computed(() => {
     var _a;
     return ((_a = errorInfo.value) == null ? void 0 : _a.errors) || [];
@@ -34,13 +39,12 @@ function useAsyncValidator(value, rules, options = {}) {
     var _a;
     return ((_a = errorInfo.value) == null ? void 0 : _a.fields) || {};
   });
-  const { validateOption = {} } = options;
-  watchEffect(async () => {
+  const validator = computed(() => new AsyncValidatorSchema(resolveUnref(rules)));
+  const execute = async () => {
     isFinished.value = false;
     pass.value = false;
-    const validator = new AsyncValidatorSchema(resolveUnref(rules));
     try {
-      await validator.validate(resolveUnref(value), validateOption);
+      await validator.value.validate(valueRef.value, validateOption);
       pass.value = true;
       errorInfo.value = null;
     } catch (err) {
@@ -48,13 +52,21 @@ function useAsyncValidator(value, rules, options = {}) {
     } finally {
       isFinished.value = true;
     }
-  });
+    return {
+      pass: pass.value,
+      errorInfo: errorInfo.value,
+      errors: errors.value,
+      errorFields: errorFields.value
+    };
+  };
+  watch([valueRef, validator], () => execute(), { immediate, deep: true });
   const shell = {
-    pass,
     isFinished,
-    errorInfo,
+    pass,
     errors,
-    errorFields
+    errorInfo,
+    errorFields,
+    execute
   };
   function waitUntilFinished() {
     return new Promise((resolve, reject) => {