@vueuse/integrations 11.0.0-beta.1 → 11.0.0-beta.2

package/index.cjs

@@ -427,12 +427,19 @@ function useFocusTrap(target, options = {}) {
       isPaused.value = false;
     }
   };
+  const targets = vueDemi.computed(() => {
+    const _targets = shared.toValue(target);
+    return (Array.isArray(_targets) ? _targets : [_targets]).map((el) => {
+      const _el = shared.toValue(el);
+      return typeof _el === "string" ? _el : core.unrefElement(_el);
+    }).filter(shared.notNullish);
+  });
   vueDemi.watch(
-    () => core.unrefElement(target),
-    (el) => {
-      if (!el)
+    targets,
+    (els) => {
+      if (!els.length)
         return;
-      trap = focusTrap.createFocusTrap(el, {
+      trap = focusTrap.createFocusTrap(els, {
         ...focusTrapOptions,
         onActivate() {
           hasFocus.value = true;

package/index.d.cts

@@ -9,7 +9,7 @@ import * as universal_cookie from 'universal-cookie';
 import universal_cookie__default from 'universal-cookie';
 import { IncomingMessage } from 'node:http';
 import { Options as Options$1, Drauu, Brush } from 'drauu';
-import { EventHookOn, MaybeComputedElementRef, Fn, MaybeElementRef, ConfigurableDocument, MaybeRefOrGetter as MaybeRefOrGetter$1 } from '@vueuse/core';
+import { EventHookOn, MaybeComputedElementRef, Fn, Arrayable, ConfigurableDocument, MaybeRefOrGetter as MaybeRefOrGetter$1 } from '@vueuse/core';
 import { Options as Options$2, ActivateOptions, DeactivateOptions } from 'focus-trap';
 import * as fuse_js from 'fuse.js';
 import { IFuseOptions, FuseResult } from 'fuse.js';
@@ -183,7 +183,7 @@ declare function createCookies(req?: IncomingMessage): (dependencies?: string[]
     /**
      * Reactive get all cookies
      */
-    getAll: <T_1 = any>(options?: universal_cookie.CookieGetOptions | undefined) => T_1;
+    getAll: <T = any>(options?: universal_cookie.CookieGetOptions | undefined) => T;
     set: (name: string, value: any, options?: universal_cookie.CookieSetOptions | undefined) => void;
     remove: (name: string, options?: universal_cookie.CookieSetOptions | undefined) => void;
     addChangeListener: (callback: universal_cookie.CookieChangeListener) => void;
@@ -208,7 +208,7 @@ declare function useCookies(dependencies?: string[] | null, { doNotParse, autoUp
     /**
      * Reactive get all cookies
      */
-    getAll: <T_1 = any>(options?: universal_cookie.CookieGetOptions | undefined) => T_1;
+    getAll: <T = any>(options?: universal_cookie.CookieGetOptions | undefined) => T;
     set: (name: string, value: any, options?: universal_cookie.CookieSetOptions | undefined) => void;
     remove: (name: string, options?: universal_cookie.CookieSetOptions | undefined) => void;
     addChangeListener: (callback: universal_cookie.CookieChangeListener) => void;
@@ -289,7 +289,7 @@ interface UseFocusTrapReturn {
  *
  * @see https://vueuse.org/useFocusTrap
  */
-declare function useFocusTrap(target: MaybeElementRef, options?: UseFocusTrapOptions): UseFocusTrapReturn;
+declare function useFocusTrap(target: Arrayable<MaybeRefOrGetter<string> | MaybeComputedElementRef>, options?: UseFocusTrapOptions): UseFocusTrapReturn;
 
 type FuseOptions<T> = IFuseOptions<T>;
 interface UseFuseOptions<T> {
@@ -299,7 +299,7 @@ interface UseFuseOptions<T> {
 }
 declare function useFuse<DataItem>(search: MaybeRefOrGetter<string>, data: MaybeRefOrGetter<DataItem[]>, options?: MaybeRefOrGetter<UseFuseOptions<DataItem>>): {
     fuse: vue_demi.Ref<{
-        search: <R = DataItem>(pattern: string | fuse_js.Expression, options?: fuse_js.FuseSearchOptions | undefined) => FuseResult<R>[];
+        search: <R = DataItem>(pattern: string | fuse_js.Expression, options?: fuse_js.FuseSearchOptions) => FuseResult<R>[];
         setCollection: (docs: readonly DataItem[], index?: fuse_js.FuseIndex<DataItem> | undefined) => void;
         add: (doc: DataItem) => void;
         remove: (predicate: (doc: DataItem, idx: number) => boolean) => DataItem[];
@@ -382,7 +382,7 @@ declare function useNProgress(currentProgress?: MaybeRefOrGetter<number | null |
     isLoading: vue_demi.WritableComputedRef<boolean>;
     progress: vue_demi.Ref<number | (() => number | null | undefined) | null | undefined>;
     start: () => nprogress.NProgress;
-    done: (force?: boolean | undefined) => nprogress.NProgress;
+    done: (force?: boolean) => nprogress.NProgress;
     remove: () => void;
 };
 type UseNProgressReturn = ReturnType<typeof useNProgress>;

package/index.d.mts

@@ -9,7 +9,7 @@ import * as universal_cookie from 'universal-cookie';
 import universal_cookie__default from 'universal-cookie';
 import { IncomingMessage } from 'node:http';
 import { Options as Options$1, Drauu, Brush } from 'drauu';
-import { EventHookOn, MaybeComputedElementRef, Fn, MaybeElementRef, ConfigurableDocument, MaybeRefOrGetter as MaybeRefOrGetter$1 } from '@vueuse/core';
+import { EventHookOn, MaybeComputedElementRef, Fn, Arrayable, ConfigurableDocument, MaybeRefOrGetter as MaybeRefOrGetter$1 } from '@vueuse/core';
 import { Options as Options$2, ActivateOptions, DeactivateOptions } from 'focus-trap';
 import * as fuse_js from 'fuse.js';
 import { IFuseOptions, FuseResult } from 'fuse.js';
@@ -183,7 +183,7 @@ declare function createCookies(req?: IncomingMessage): (dependencies?: string[]
     /**
      * Reactive get all cookies
      */
-    getAll: <T_1 = any>(options?: universal_cookie.CookieGetOptions | undefined) => T_1;
+    getAll: <T = any>(options?: universal_cookie.CookieGetOptions | undefined) => T;
     set: (name: string, value: any, options?: universal_cookie.CookieSetOptions | undefined) => void;
     remove: (name: string, options?: universal_cookie.CookieSetOptions | undefined) => void;
     addChangeListener: (callback: universal_cookie.CookieChangeListener) => void;
@@ -208,7 +208,7 @@ declare function useCookies(dependencies?: string[] | null, { doNotParse, autoUp
     /**
      * Reactive get all cookies
      */
-    getAll: <T_1 = any>(options?: universal_cookie.CookieGetOptions | undefined) => T_1;
+    getAll: <T = any>(options?: universal_cookie.CookieGetOptions | undefined) => T;
     set: (name: string, value: any, options?: universal_cookie.CookieSetOptions | undefined) => void;
     remove: (name: string, options?: universal_cookie.CookieSetOptions | undefined) => void;
     addChangeListener: (callback: universal_cookie.CookieChangeListener) => void;
@@ -289,7 +289,7 @@ interface UseFocusTrapReturn {
  *
  * @see https://vueuse.org/useFocusTrap
  */
-declare function useFocusTrap(target: MaybeElementRef, options?: UseFocusTrapOptions): UseFocusTrapReturn;
+declare function useFocusTrap(target: Arrayable<MaybeRefOrGetter<string> | MaybeComputedElementRef>, options?: UseFocusTrapOptions): UseFocusTrapReturn;
 
 type FuseOptions<T> = IFuseOptions<T>;
 interface UseFuseOptions<T> {
@@ -299,7 +299,7 @@ interface UseFuseOptions<T> {
 }
 declare function useFuse<DataItem>(search: MaybeRefOrGetter<string>, data: MaybeRefOrGetter<DataItem[]>, options?: MaybeRefOrGetter<UseFuseOptions<DataItem>>): {
     fuse: vue_demi.Ref<{
-        search: <R = DataItem>(pattern: string | fuse_js.Expression, options?: fuse_js.FuseSearchOptions | undefined) => FuseResult<R>[];
+        search: <R = DataItem>(pattern: string | fuse_js.Expression, options?: fuse_js.FuseSearchOptions) => FuseResult<R>[];
         setCollection: (docs: readonly DataItem[], index?: fuse_js.FuseIndex<DataItem> | undefined) => void;
         add: (doc: DataItem) => void;
         remove: (predicate: (doc: DataItem, idx: number) => boolean) => DataItem[];
@@ -382,7 +382,7 @@ declare function useNProgress(currentProgress?: MaybeRefOrGetter<number | null |
     isLoading: vue_demi.WritableComputedRef<boolean>;
     progress: vue_demi.Ref<number | (() => number | null | undefined) | null | undefined>;
     start: () => nprogress.NProgress;
-    done: (force?: boolean | undefined) => nprogress.NProgress;
+    done: (force?: boolean) => nprogress.NProgress;
     remove: () => void;
 };
 type UseNProgressReturn = ReturnType<typeof useNProgress>;

package/index.d.ts

@@ -9,7 +9,7 @@ import * as universal_cookie from 'universal-cookie';
 import universal_cookie__default from 'universal-cookie';
 import { IncomingMessage } from 'node:http';
 import { Options as Options$1, Drauu, Brush } from 'drauu';
-import { EventHookOn, MaybeComputedElementRef, Fn, MaybeElementRef, ConfigurableDocument, MaybeRefOrGetter as MaybeRefOrGetter$1 } from '@vueuse/core';
+import { EventHookOn, MaybeComputedElementRef, Fn, Arrayable, ConfigurableDocument, MaybeRefOrGetter as MaybeRefOrGetter$1 } from '@vueuse/core';
 import { Options as Options$2, ActivateOptions, DeactivateOptions } from 'focus-trap';
 import * as fuse_js from 'fuse.js';
 import { IFuseOptions, FuseResult } from 'fuse.js';
@@ -183,7 +183,7 @@ declare function createCookies(req?: IncomingMessage): (dependencies?: string[]
     /**
      * Reactive get all cookies
      */
-    getAll: <T_1 = any>(options?: universal_cookie.CookieGetOptions | undefined) => T_1;
+    getAll: <T = any>(options?: universal_cookie.CookieGetOptions | undefined) => T;
     set: (name: string, value: any, options?: universal_cookie.CookieSetOptions | undefined) => void;
     remove: (name: string, options?: universal_cookie.CookieSetOptions | undefined) => void;
     addChangeListener: (callback: universal_cookie.CookieChangeListener) => void;
@@ -208,7 +208,7 @@ declare function useCookies(dependencies?: string[] | null, { doNotParse, autoUp
     /**
      * Reactive get all cookies
      */
-    getAll: <T_1 = any>(options?: universal_cookie.CookieGetOptions | undefined) => T_1;
+    getAll: <T = any>(options?: universal_cookie.CookieGetOptions | undefined) => T;
     set: (name: string, value: any, options?: universal_cookie.CookieSetOptions | undefined) => void;
     remove: (name: string, options?: universal_cookie.CookieSetOptions | undefined) => void;
     addChangeListener: (callback: universal_cookie.CookieChangeListener) => void;
@@ -289,7 +289,7 @@ interface UseFocusTrapReturn {
  *
  * @see https://vueuse.org/useFocusTrap
  */
-declare function useFocusTrap(target: MaybeElementRef, options?: UseFocusTrapOptions): UseFocusTrapReturn;
+declare function useFocusTrap(target: Arrayable<MaybeRefOrGetter<string> | MaybeComputedElementRef>, options?: UseFocusTrapOptions): UseFocusTrapReturn;
 
 type FuseOptions<T> = IFuseOptions<T>;
 interface UseFuseOptions<T> {
@@ -299,7 +299,7 @@ interface UseFuseOptions<T> {
 }
 declare function useFuse<DataItem>(search: MaybeRefOrGetter<string>, data: MaybeRefOrGetter<DataItem[]>, options?: MaybeRefOrGetter<UseFuseOptions<DataItem>>): {
     fuse: vue_demi.Ref<{
-        search: <R = DataItem>(pattern: string | fuse_js.Expression, options?: fuse_js.FuseSearchOptions | undefined) => FuseResult<R>[];
+        search: <R = DataItem>(pattern: string | fuse_js.Expression, options?: fuse_js.FuseSearchOptions) => FuseResult<R>[];
         setCollection: (docs: readonly DataItem[], index?: fuse_js.FuseIndex<DataItem> | undefined) => void;
         add: (doc: DataItem) => void;
         remove: (predicate: (doc: DataItem, idx: number) => boolean) => DataItem[];
@@ -382,7 +382,7 @@ declare function useNProgress(currentProgress?: MaybeRefOrGetter<number | null |
     isLoading: vue_demi.WritableComputedRef<boolean>;
     progress: vue_demi.Ref<number | (() => number | null | undefined) | null | undefined>;
     start: () => nprogress.NProgress;
-    done: (force?: boolean | undefined) => nprogress.NProgress;
+    done: (force?: boolean) => nprogress.NProgress;
     remove: () => void;
 };
 type UseNProgressReturn = ReturnType<typeof useNProgress>;

package/index.iife.js

@@ -532,12 +532,19 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
         isPaused.value = false;
       }
     };
+    const targets = vueDemi.computed(() => {
+      const _targets = shared.toValue(target);
+      return (Array.isArray(_targets) ? _targets : [_targets]).map((el) => {
+        const _el = shared.toValue(el);
+        return typeof _el === "string" ? _el : core.unrefElement(_el);
+      }).filter(shared.notNullish);
+    });
     vueDemi.watch(
-      () => core.unrefElement(target),
-      (el) => {
-        if (!el)
+      targets,
+      (els) => {
+        if (!els.length)
           return;
-        trap = focusTrap.createFocusTrap(el, {
+        trap = focusTrap.createFocusTrap(els, {
           ...focusTrapOptions,
           onActivate() {
             hasFocus.value = true;

package/index.iife.min.js

@@ -1 +1 @@
-var VueDemi=function(l,n,H){if(l.install)return l;if(!n)return console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`."),l;if(n.version.slice(0,4)==="2.7."){let b=function(g,F){var p,W={},B={config:n.config,use:n.use.bind(n),mixin:n.mixin.bind(n),component:n.component.bind(n),provide:function(A,j){return W[A]=j,this},directive:function(A,j){return j?(n.directive(A,j),B):n.directive(A)},mount:function(A,j){return p||(p=new n(Object.assign({propsData:F},g,{provide:Object.assign(W,g.provide)})),p.$mount(A,j),p)},unmount:function(){p&&(p.$destroy(),p=void 0)}};return B};var N=b;for(var o in n)l[o]=n[o];l.isVue2=!0,l.isVue3=!1,l.install=function(){},l.Vue=n,l.Vue2=n,l.version=n.version,l.warn=n.util.warn,l.hasInjectionContext=function(){return!!l.getCurrentInstance()},l.createApp=b}else if(n.version.slice(0,2)==="2.")if(H){for(var o in H)l[o]=H[o];l.isVue2=!0,l.isVue3=!1,l.install=function(){},l.Vue=n,l.Vue2=n,l.version=n.version,l.hasInjectionContext=function(){return!!l.getCurrentInstance()}}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.");else if(n.version.slice(0,2)==="3."){for(var o in n)l[o]=n[o];l.isVue2=!1,l.isVue3=!0,l.install=function(){},l.Vue=n,l.Vue2=void 0,l.version=n.version,l.set=function(b,g,F){return Array.isArray(b)?(b.length=Math.max(b.length,g),b.splice(g,1,F),F):(b[g]=F,F)},l.del=function(b,g){if(Array.isArray(b)){b.splice(g,1);return}delete b[g]}}else console.error("[vue-demi] Vue version "+n.version+" is unsupported.");return l}((globalThis||self).VueDemi=(globalThis||self).VueDemi||(typeof VueDemi<"u"?VueDemi:{}),(globalThis||self).Vue||(typeof Vue<"u"?Vue:void 0),(globalThis||self).VueCompositionAPI||(typeof VueCompositionAPI<"u"?VueCompositionAPI:void 0));(function(l,n,H,o,N,b,g,F,p,W,B,A,j,E,Z,V){"use strict";function D(t){var r=Object.create(null);return t&&Object.keys(t).forEach(function(e){if(e!=="default"){var a=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(r,e,a.get?a:{enumerable:!0,get:function(){return t[e]}})}}),r.default=t,Object.freeze(r)}var ee=D(b);const te=H.default||H;function ne(t,r,e={}){const{validateOption:a={},immediate:s=!0,manual:i=!1}=e,c=n.toRef(t),f=o.shallowRef(null),u=o.ref(!0),h=o.ref(!s||i),w=o.computed(()=>{var d;return((d=f.value)==null?void 0:d.errors)||[]}),y=o.computed(()=>{var d;return((d=f.value)==null?void 0:d.fields)||{}}),_=o.computed(()=>new te(n.toValue(r))),O=async()=>{u.value=!1,h.value=!1;try{await _.value.validate(c.value,a),h.value=!0,f.value=null}catch(d){f.value=d}finally{u.value=!0}return{pass:h.value,errorInfo:f.value,errors:w.value,errorFields:y.value}};i||o.watch([c,_],()=>O(),{immediate:s,deep:!0});const I={isFinished:u,pass:h,errors:w,errorInfo:f,errorFields:y,execute:O};function P(){return new Promise((d,R)=>{n.until(u).toBe(!0).then(()=>d(I)).catch(S=>R(S))})}return{...I,then(d,R){return P().then(d,R)}}}function oe(...t){const r=typeof t[0]=="string"?t[0]:void 0,e=typeof r=="string"?1:0,a={immediate:!!e,shallow:!0,abortPrevious:!0};let s={},i=N,c=a;const f=C=>!!C?.request;t.length>0+e&&(f(t[0+e])?i=t[0+e]:s=t[0+e]),t.length>1+e&&f(t[1+e])&&(i=t[1+e]),(t.length===2+e&&!f(t[1+e])||t.length===3+e)&&(c=t[t.length-1]||a);const{initialData:u,shallow:h,onSuccess:w=n.noop,onError:y=n.noop,immediate:_,resetOnExecute:O=!1}=c,I=o.shallowRef(),P=(h?o.shallowRef:o.ref)(u),d=o.ref(!1),R=o.ref(!1),S=o.ref(!1),m=o.shallowRef();let U=new AbortController;const k=C=>{d.value||!R.value||(U.abort(C),U=new AbortController,S.value=!0,R.value=!1,d.value=!1)},v=C=>{R.value=C,d.value=!C},L=()=>{O&&(P.value=u)},q=()=>new Promise((C,G)=>{n.until(d).toBe(!0).then(()=>m.value?G(m.value):C(K))}),Q={then:(...C)=>q().then(...C),catch:(...C)=>q().catch(...C)};let $=0;const J=(C=r,G={})=>{m.value=void 0;const X=typeof C=="string"?C:r??G.url;if(X===void 0)return m.value=new N.AxiosError(N.AxiosError.ERR_INVALID_URL),d.value=!0,Q;L(),c.abortPrevious!==!1&&k(),v(!0),$+=1;const he=$;return S.value=!1,i(X,{...s,...typeof C=="object"?C:G,signal:U.signal}).then(T=>{if(S.value)return;I.value=T;const Y=T.data;P.value=Y,w(Y)}).catch(T=>{m.value=T,y(T)}).finally(()=>{var T;(T=c.onFinish)==null||T.call(c),he===$&&v(!1)}),Q};_&&r&&J();const K={response:I,data:P,error:m,isFinished:d,isLoading:R,cancel:k,isAborted:S,isCanceled:S,abort:k,execute:J};return{...K,...Q}}const x=Object.values(ee).filter(t=>typeof t=="function"&&t.name.endsWith("Case")).reduce((t,r)=>(t[r.name]=r,t),{});function ae(t,r,e){const a=o.computed(()=>{const i=n.toValue(r);if(!x[i])throw new Error(`Invalid change case type "${i}"`);return i});if(typeof t=="function")return o.computed(()=>x[a.value](n.toValue(t),n.toValue(e)));const s=o.ref(t);return o.computed({get(){return x[a.value](s.value,n.toValue(e))},set(i){s.value=i}})}function re(t){const r=new g(t?t.headers.cookie:null);return(e,{doNotParse:a=!1,autoUpdateDependencies:s=!1}={})=>z(e,{doNotParse:a,autoUpdateDependencies:s},r)}function z(t,{doNotParse:r=!1,autoUpdateDependencies:e=!1}={},a=new g){const s=e?[...t||[]]:t;let i=a.getAll({doNotParse:!0});const c=o.ref(0),f=()=>{const u=a.getAll({doNotParse:!0});le(s||null,u,i)&&c.value++,i=u};return a.addChangeListener(f),n.tryOnScopeDispose(()=>{a.removeChangeListener(f)}),{get:(...u)=>(e&&s&&!s.includes(u[0])&&s.push(u[0]),c.value,a.get(u[0],{doNotParse:r,...u[1]})),getAll:(...u)=>(c.value,a.getAll({doNotParse:r,...u[0]})),set:(...u)=>a.set(...u),remove:(...u)=>a.remove(...u),addChangeListener:(...u)=>a.addChangeListener(...u),removeChangeListener:(...u)=>a.removeChangeListener(...u)}}function le(t,r,e){if(!t)return!0;for(const a of t)if(r[a]!==e[a])return!0;return!1}function se(t,r){const e=o.ref();let a=[];const s=p.createEventHook(),i=p.createEventHook(),c=p.createEventHook(),f=p.createEventHook(),u=p.createEventHook(),h=o.ref(!1),w=o.ref(!1),y=o.ref(!1),_=o.ref(!1),O=o.ref({color:"black",size:3,arrowEnd:!1,cornerRadius:0,dasharray:void 0,fill:"transparent",mode:"draw",...r?.brush});o.watch(O,()=>{const v=e.value;v&&(v.brush=O.value,v.mode=O.value.mode)},{deep:!0});const I=()=>{var v;return(v=e.value)==null?void 0:v.undo()},P=()=>{var v;return(v=e.value)==null?void 0:v.redo()},d=()=>{var v;return(v=e.value)==null?void 0:v.clear()},R=()=>{var v;return(v=e.value)==null?void 0:v.cancel()},S=v=>{var L;return(L=e.value)==null?void 0:L.load(v)},m=()=>{var v;return(v=e.value)==null?void 0:v.dump()},U=()=>{var v;a.forEach(L=>L()),(v=e.value)==null||v.unmount()},k=()=>{e.value&&(h.value=e.value.canUndo(),w.value=e.value.canRedo(),y.value=e.value.altPressed,_.value=e.value.shiftPressed)};return o.watch(()=>p.unrefElement(t),v=>{!v||typeof SVGSVGElement>"u"||!(v instanceof SVGSVGElement)||(e.value&&U(),e.value=F.createDrauu({el:v,...r}),k(),a=[e.value.on("canceled",()=>i.trigger()),e.value.on("committed",L=>c.trigger(L)),e.value.on("start",()=>f.trigger()),e.value.on("end",()=>u.trigger()),e.value.on("changed",()=>{k(),s.trigger()})])},{flush:"post"}),n.tryOnScopeDispose(()=>U()),{drauuInstance:e,load:S,dump:m,clear:d,cancel:R,undo:I,redo:P,canUndo:h,canRedo:w,brush:O,onChanged:s.on,onCommitted:c.on,onStart:f.on,onEnd:u.on,onCanceled:i.on}}function ue(t,r={}){let e;const{immediate:a,...s}=r,i=o.ref(!1),c=o.ref(!1),f=y=>e&&e.activate(y),u=y=>e&&e.deactivate(y),h=()=>{e&&(e.pause(),c.value=!0)},w=()=>{e&&(e.unpause(),c.value=!1)};return o.watch(()=>p.unrefElement(t),y=>{y&&(e=W.createFocusTrap(y,{...s,onActivate(){i.value=!0,r.onActivate&&r.onActivate()},onDeactivate(){i.value=!1,r.onDeactivate&&r.onDeactivate()}}),a&&f())},{flush:"post"}),p.tryOnScopeDispose(()=>u()),{hasFocus:i,isPaused:c,activate:f,deactivate:u,pause:h,unpause:w}}function ce(t,r,e){const a=()=>{var c,f;return new B((c=n.toValue(r))!=null?c:[],(f=n.toValue(e))==null?void 0:f.fuseOptions)},s=o.ref(a());o.watch(()=>{var c;return(c=n.toValue(e))==null?void 0:c.fuseOptions},()=>{s.value=a()},{deep:!0}),o.watch(()=>n.toValue(r),c=>{s.value.setCollection(c)},{deep:!0});const i=o.computed(()=>{const c=n.toValue(e);if(c?.matchAllWhenSearchEmpty&&!n.toValue(t))return n.toValue(r).map((u,h)=>({item:u,refIndex:h}));const f=c?.resultLimit;return s.value.search(n.toValue(t),f?{limit:f}:void 0)});return{fuse:s,results:i}}function ie(t,r,e={}){const{flush:a="pre",deep:s=!0,shallow:i=!1,onError:c=d=>{console.error(d)},writeDefaults:f=!0}=e,u=o.ref(!1),h=(i?o.shallowRef:o.ref)(r),w=n.toValue(r);async function y(){try{const d=await A.get(t);d===void 0?w!=null&&f&&await A.set(t,w):h.value=d}catch(d){c(d)}u.value=!0}y();async function _(){try{h.value==null?await A.del(t):await A.update(t,()=>o.toRaw(h.value))}catch(d){c(d)}}const{pause:O,resume:I}=p.watchPausable(h,()=>_(),{flush:a,deep:s});async function P(d){O(),h.value=d,await _(),I()}return{set:P,isFinished:u,data:h}}function fe(t,r={}){const{onError:e,fallbackValue:a=null}=r,s=(f,u)=>{try{return j.jwtDecode(f,u)}catch(h){return e?.(h),a}},i=o.computed(()=>s(n.toValue(t),{header:!0})),c=o.computed(()=>s(n.toValue(t)));return{header:i,payload:c}}function de(t=null,r){const e=o.ref(t),a=o.computed({set:i=>i?E.start():E.done(),get:()=>typeof e.value=="number"&&e.value<1});r&&E.configure(r);const s=E.set;return E.set=i=>(e.value=i,s.call(E,i)),o.watchEffect(()=>{typeof e.value=="number"&&n.isClient&&s.call(E,e.value)}),n.tryOnScopeDispose(E.remove),{isLoading:a,progress:e,start:E.start,done:E.done,remove:()=>{e.value=null,E.remove()}}}function ve(t,r){const e=n.toRef(t),a=o.ref("");return o.watch(e,async s=>{e.value&&n.isClient&&(a.value=await Z.toDataURL(s,r))},{immediate:!0}),a}function pe(t,r,e={}){let a;const{document:s=p.defaultDocument,...i}=e,c={onUpdate:w=>{M(r,w.oldIndex,w.newIndex)}},f=()=>{const w=typeof t=="string"?s?.querySelector(t):p.unrefElement(t);!w||a!==void 0||(a=new V(w,{...c,...i}))},u=()=>{a?.destroy(),a=void 0},h=(w,y)=>{if(y!==void 0)a?.option(w,y);else return a?.option(w)};return p.tryOnMounted(f),p.tryOnScopeDispose(u),{stop:u,start:f,option:h}}function M(t,r,e){const a=o.isRef(t),s=a?[...p.toValue(t)]:p.toValue(t);if(e>=0&&e<s.length){const i=s.splice(r,1)[0];o.nextTick(()=>{s.splice(e,0,i),a&&(t.value=s)})}}l.createCookies=re,l.moveArrayElement=M,l.useAsyncValidator=ne,l.useAxios=oe,l.useChangeCase=ae,l.useCookies=z,l.useDrauu=se,l.useFocusTrap=ue,l.useFuse=ce,l.useIDBKeyval=ie,l.useJwt=fe,l.useNProgress=de,l.useQRCode=ve,l.useSortable=pe})(this.VueUse=this.VueUse||{},VueUse,AsyncValidator,VueDemi,axios,changeCase,UniversalCookie,Drauu,VueUse,focusTrap,Fuse,idbKeyval,jwt_decode,nprogress,QRCode,Sortable);
+var VueDemi=function(l,n,H){if(l.install)return l;if(!n)return console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`."),l;if(n.version.slice(0,4)==="2.7."){let g=function(O,F){var p,W={},B={config:n.config,use:n.use.bind(n),mixin:n.mixin.bind(n),component:n.component.bind(n),provide:function(_,j){return W[_]=j,this},directive:function(_,j){return j?(n.directive(_,j),B):n.directive(_)},mount:function(_,j){return p||(p=new n(Object.assign({propsData:F},O,{provide:Object.assign(W,O.provide)})),p.$mount(_,j),p)},unmount:function(){p&&(p.$destroy(),p=void 0)}};return B};var N=g;for(var o in n)l[o]=n[o];l.isVue2=!0,l.isVue3=!1,l.install=function(){},l.Vue=n,l.Vue2=n,l.version=n.version,l.warn=n.util.warn,l.hasInjectionContext=function(){return!!l.getCurrentInstance()},l.createApp=g}else if(n.version.slice(0,2)==="2.")if(H){for(var o in H)l[o]=H[o];l.isVue2=!0,l.isVue3=!1,l.install=function(){},l.Vue=n,l.Vue2=n,l.version=n.version,l.hasInjectionContext=function(){return!!l.getCurrentInstance()}}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.");else if(n.version.slice(0,2)==="3."){for(var o in n)l[o]=n[o];l.isVue2=!1,l.isVue3=!0,l.install=function(){},l.Vue=n,l.Vue2=void 0,l.version=n.version,l.set=function(g,O,F){return Array.isArray(g)?(g.length=Math.max(g.length,O),g.splice(O,1,F),F):(g[O]=F,F)},l.del=function(g,O){if(Array.isArray(g)){g.splice(O,1);return}delete g[O]}}else console.error("[vue-demi] Vue version "+n.version+" is unsupported.");return l}((globalThis||self).VueDemi=(globalThis||self).VueDemi||(typeof VueDemi<"u"?VueDemi:{}),(globalThis||self).Vue||(typeof Vue<"u"?Vue:void 0),(globalThis||self).VueCompositionAPI||(typeof VueCompositionAPI<"u"?VueCompositionAPI:void 0));(function(l,n,H,o,N,g,O,F,p,W,B,_,j,R,Z,V){"use strict";function D(t){var r=Object.create(null);return t&&Object.keys(t).forEach(function(e){if(e!=="default"){var a=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(r,e,a.get?a:{enumerable:!0,get:function(){return t[e]}})}}),r.default=t,Object.freeze(r)}var ee=D(g);const te=H.default||H;function ne(t,r,e={}){const{validateOption:a={},immediate:s=!0,manual:i=!1}=e,c=n.toRef(t),f=o.shallowRef(null),u=o.ref(!0),h=o.ref(!s||i),w=o.computed(()=>{var d;return((d=f.value)==null?void 0:d.errors)||[]}),b=o.computed(()=>{var d;return((d=f.value)==null?void 0:d.fields)||{}}),y=o.computed(()=>new te(n.toValue(r))),A=async()=>{u.value=!1,h.value=!1;try{await y.value.validate(c.value,a),h.value=!0,f.value=null}catch(d){f.value=d}finally{u.value=!0}return{pass:h.value,errorInfo:f.value,errors:w.value,errorFields:b.value}};i||o.watch([c,y],()=>A(),{immediate:s,deep:!0});const E={isFinished:u,pass:h,errors:w,errorInfo:f,errorFields:b,execute:A};function P(){return new Promise((d,I)=>{n.until(u).toBe(!0).then(()=>d(E)).catch(S=>I(S))})}return{...E,then(d,I){return P().then(d,I)}}}function oe(...t){const r=typeof t[0]=="string"?t[0]:void 0,e=typeof r=="string"?1:0,a={immediate:!!e,shallow:!0,abortPrevious:!0};let s={},i=N,c=a;const f=C=>!!C?.request;t.length>0+e&&(f(t[0+e])?i=t[0+e]:s=t[0+e]),t.length>1+e&&f(t[1+e])&&(i=t[1+e]),(t.length===2+e&&!f(t[1+e])||t.length===3+e)&&(c=t[t.length-1]||a);const{initialData:u,shallow:h,onSuccess:w=n.noop,onError:b=n.noop,immediate:y,resetOnExecute:A=!1}=c,E=o.shallowRef(),P=(h?o.shallowRef:o.ref)(u),d=o.ref(!1),I=o.ref(!1),S=o.ref(!1),m=o.shallowRef();let U=new AbortController;const k=C=>{d.value||!I.value||(U.abort(C),U=new AbortController,S.value=!0,I.value=!1,d.value=!1)},v=C=>{I.value=C,d.value=!C},L=()=>{A&&(P.value=u)},q=()=>new Promise((C,G)=>{n.until(d).toBe(!0).then(()=>m.value?G(m.value):C(K))}),Q={then:(...C)=>q().then(...C),catch:(...C)=>q().catch(...C)};let $=0;const J=(C=r,G={})=>{m.value=void 0;const X=typeof C=="string"?C:r??G.url;if(X===void 0)return m.value=new N.AxiosError(N.AxiosError.ERR_INVALID_URL),d.value=!0,Q;L(),c.abortPrevious!==!1&&k(),v(!0),$+=1;const he=$;return S.value=!1,i(X,{...s,...typeof C=="object"?C:G,signal:U.signal}).then(T=>{if(S.value)return;E.value=T;const Y=T.data;P.value=Y,w(Y)}).catch(T=>{m.value=T,b(T)}).finally(()=>{var T;(T=c.onFinish)==null||T.call(c),he===$&&v(!1)}),Q};y&&r&&J();const K={response:E,data:P,error:m,isFinished:d,isLoading:I,cancel:k,isAborted:S,isCanceled:S,abort:k,execute:J};return{...K,...Q}}const x=Object.values(ee).filter(t=>typeof t=="function"&&t.name.endsWith("Case")).reduce((t,r)=>(t[r.name]=r,t),{});function ae(t,r,e){const a=o.computed(()=>{const i=n.toValue(r);if(!x[i])throw new Error(`Invalid change case type "${i}"`);return i});if(typeof t=="function")return o.computed(()=>x[a.value](n.toValue(t),n.toValue(e)));const s=o.ref(t);return o.computed({get(){return x[a.value](s.value,n.toValue(e))},set(i){s.value=i}})}function re(t){const r=new O(t?t.headers.cookie:null);return(e,{doNotParse:a=!1,autoUpdateDependencies:s=!1}={})=>z(e,{doNotParse:a,autoUpdateDependencies:s},r)}function z(t,{doNotParse:r=!1,autoUpdateDependencies:e=!1}={},a=new O){const s=e?[...t||[]]:t;let i=a.getAll({doNotParse:!0});const c=o.ref(0),f=()=>{const u=a.getAll({doNotParse:!0});le(s||null,u,i)&&c.value++,i=u};return a.addChangeListener(f),n.tryOnScopeDispose(()=>{a.removeChangeListener(f)}),{get:(...u)=>(e&&s&&!s.includes(u[0])&&s.push(u[0]),c.value,a.get(u[0],{doNotParse:r,...u[1]})),getAll:(...u)=>(c.value,a.getAll({doNotParse:r,...u[0]})),set:(...u)=>a.set(...u),remove:(...u)=>a.remove(...u),addChangeListener:(...u)=>a.addChangeListener(...u),removeChangeListener:(...u)=>a.removeChangeListener(...u)}}function le(t,r,e){if(!t)return!0;for(const a of t)if(r[a]!==e[a])return!0;return!1}function se(t,r){const e=o.ref();let a=[];const s=p.createEventHook(),i=p.createEventHook(),c=p.createEventHook(),f=p.createEventHook(),u=p.createEventHook(),h=o.ref(!1),w=o.ref(!1),b=o.ref(!1),y=o.ref(!1),A=o.ref({color:"black",size:3,arrowEnd:!1,cornerRadius:0,dasharray:void 0,fill:"transparent",mode:"draw",...r?.brush});o.watch(A,()=>{const v=e.value;v&&(v.brush=A.value,v.mode=A.value.mode)},{deep:!0});const E=()=>{var v;return(v=e.value)==null?void 0:v.undo()},P=()=>{var v;return(v=e.value)==null?void 0:v.redo()},d=()=>{var v;return(v=e.value)==null?void 0:v.clear()},I=()=>{var v;return(v=e.value)==null?void 0:v.cancel()},S=v=>{var L;return(L=e.value)==null?void 0:L.load(v)},m=()=>{var v;return(v=e.value)==null?void 0:v.dump()},U=()=>{var v;a.forEach(L=>L()),(v=e.value)==null||v.unmount()},k=()=>{e.value&&(h.value=e.value.canUndo(),w.value=e.value.canRedo(),b.value=e.value.altPressed,y.value=e.value.shiftPressed)};return o.watch(()=>p.unrefElement(t),v=>{!v||typeof SVGSVGElement>"u"||!(v instanceof SVGSVGElement)||(e.value&&U(),e.value=F.createDrauu({el:v,...r}),k(),a=[e.value.on("canceled",()=>i.trigger()),e.value.on("committed",L=>c.trigger(L)),e.value.on("start",()=>f.trigger()),e.value.on("end",()=>u.trigger()),e.value.on("changed",()=>{k(),s.trigger()})])},{flush:"post"}),n.tryOnScopeDispose(()=>U()),{drauuInstance:e,load:S,dump:m,clear:d,cancel:I,undo:E,redo:P,canUndo:h,canRedo:w,brush:A,onChanged:s.on,onCommitted:c.on,onStart:f.on,onEnd:u.on,onCanceled:i.on}}function ue(t,r={}){let e;const{immediate:a,...s}=r,i=o.ref(!1),c=o.ref(!1),f=y=>e&&e.activate(y),u=y=>e&&e.deactivate(y),h=()=>{e&&(e.pause(),c.value=!0)},w=()=>{e&&(e.unpause(),c.value=!1)},b=o.computed(()=>{const y=n.toValue(t);return(Array.isArray(y)?y:[y]).map(A=>{const E=n.toValue(A);return typeof E=="string"?E:p.unrefElement(E)}).filter(n.notNullish)});return o.watch(b,y=>{y.length&&(e=W.createFocusTrap(y,{...s,onActivate(){i.value=!0,r.onActivate&&r.onActivate()},onDeactivate(){i.value=!1,r.onDeactivate&&r.onDeactivate()}}),a&&f())},{flush:"post"}),p.tryOnScopeDispose(()=>u()),{hasFocus:i,isPaused:c,activate:f,deactivate:u,pause:h,unpause:w}}function ce(t,r,e){const a=()=>{var c,f;return new B((c=n.toValue(r))!=null?c:[],(f=n.toValue(e))==null?void 0:f.fuseOptions)},s=o.ref(a());o.watch(()=>{var c;return(c=n.toValue(e))==null?void 0:c.fuseOptions},()=>{s.value=a()},{deep:!0}),o.watch(()=>n.toValue(r),c=>{s.value.setCollection(c)},{deep:!0});const i=o.computed(()=>{const c=n.toValue(e);if(c?.matchAllWhenSearchEmpty&&!n.toValue(t))return n.toValue(r).map((u,h)=>({item:u,refIndex:h}));const f=c?.resultLimit;return s.value.search(n.toValue(t),f?{limit:f}:void 0)});return{fuse:s,results:i}}function ie(t,r,e={}){const{flush:a="pre",deep:s=!0,shallow:i=!1,onError:c=d=>{console.error(d)},writeDefaults:f=!0}=e,u=o.ref(!1),h=(i?o.shallowRef:o.ref)(r),w=n.toValue(r);async function b(){try{const d=await _.get(t);d===void 0?w!=null&&f&&await _.set(t,w):h.value=d}catch(d){c(d)}u.value=!0}b();async function y(){try{h.value==null?await _.del(t):await _.update(t,()=>o.toRaw(h.value))}catch(d){c(d)}}const{pause:A,resume:E}=p.watchPausable(h,()=>y(),{flush:a,deep:s});async function P(d){A(),h.value=d,await y(),E()}return{set:P,isFinished:u,data:h}}function fe(t,r={}){const{onError:e,fallbackValue:a=null}=r,s=(f,u)=>{try{return j.jwtDecode(f,u)}catch(h){return e?.(h),a}},i=o.computed(()=>s(n.toValue(t),{header:!0})),c=o.computed(()=>s(n.toValue(t)));return{header:i,payload:c}}function de(t=null,r){const e=o.ref(t),a=o.computed({set:i=>i?R.start():R.done(),get:()=>typeof e.value=="number"&&e.value<1});r&&R.configure(r);const s=R.set;return R.set=i=>(e.value=i,s.call(R,i)),o.watchEffect(()=>{typeof e.value=="number"&&n.isClient&&s.call(R,e.value)}),n.tryOnScopeDispose(R.remove),{isLoading:a,progress:e,start:R.start,done:R.done,remove:()=>{e.value=null,R.remove()}}}function ve(t,r){const e=n.toRef(t),a=o.ref("");return o.watch(e,async s=>{e.value&&n.isClient&&(a.value=await Z.toDataURL(s,r))},{immediate:!0}),a}function pe(t,r,e={}){let a;const{document:s=p.defaultDocument,...i}=e,c={onUpdate:w=>{M(r,w.oldIndex,w.newIndex)}},f=()=>{const w=typeof t=="string"?s?.querySelector(t):p.unrefElement(t);!w||a!==void 0||(a=new V(w,{...c,...i}))},u=()=>{a?.destroy(),a=void 0},h=(w,b)=>{if(b!==void 0)a?.option(w,b);else return a?.option(w)};return p.tryOnMounted(f),p.tryOnScopeDispose(u),{stop:u,start:f,option:h}}function M(t,r,e){const a=o.isRef(t),s=a?[...p.toValue(t)]:p.toValue(t);if(e>=0&&e<s.length){const i=s.splice(r,1)[0];o.nextTick(()=>{s.splice(e,0,i),a&&(t.value=s)})}}l.createCookies=re,l.moveArrayElement=M,l.useAsyncValidator=ne,l.useAxios=oe,l.useChangeCase=ae,l.useCookies=z,l.useDrauu=se,l.useFocusTrap=ue,l.useFuse=ce,l.useIDBKeyval=ie,l.useJwt=fe,l.useNProgress=de,l.useQRCode=ve,l.useSortable=pe})(this.VueUse=this.VueUse||{},VueUse,AsyncValidator,VueDemi,axios,changeCase,UniversalCookie,Drauu,VueUse,focusTrap,Fuse,idbKeyval,jwt_decode,nprogress,QRCode,Sortable);

package/index.mjs

@@ -1,4 +1,4 @@
-import { toRef, toValue, until, noop, tryOnScopeDispose, isClient } from '@vueuse/shared';
+import { toRef, toValue, until, noop, tryOnScopeDispose, notNullish, isClient } from '@vueuse/shared';
 import Schema from 'async-validator';
 import { shallowRef, ref, computed, watch, toRaw, watchEffect, isRef, nextTick } from 'vue-demi';
 import axios, { AxiosError } from 'axios';
@@ -406,12 +406,19 @@ function useFocusTrap(target, options = {}) {
       isPaused.value = false;
     }
   };
+  const targets = computed(() => {
+    const _targets = toValue(target);
+    return (Array.isArray(_targets) ? _targets : [_targets]).map((el) => {
+      const _el = toValue(el);
+      return typeof _el === "string" ? _el : unrefElement(_el);
+    }).filter(notNullish);
+  });
   watch(
-    () => unrefElement(target),
-    (el) => {
-      if (!el)
+    targets,
+    (els) => {
+      if (!els.length)
         return;
-      trap = createFocusTrap(el, {
+      trap = createFocusTrap(els, {
         ...focusTrapOptions,
         onActivate() {
           hasFocus.value = true;

package/package.json

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

package/useCookies.d.cts

@@ -19,7 +19,7 @@ declare function createCookies(req?: IncomingMessage): (dependencies?: string[]
     /**
      * Reactive get all cookies
      */
-    getAll: <T_1 = any>(options?: universal_cookie.CookieGetOptions | undefined) => T_1;
+    getAll: <T = any>(options?: universal_cookie.CookieGetOptions | undefined) => T;
     set: (name: string, value: any, options?: universal_cookie.CookieSetOptions | undefined) => void;
     remove: (name: string, options?: universal_cookie.CookieSetOptions | undefined) => void;
     addChangeListener: (callback: universal_cookie.CookieChangeListener) => void;
@@ -44,7 +44,7 @@ declare function useCookies(dependencies?: string[] | null, { doNotParse, autoUp
     /**
      * Reactive get all cookies
      */
-    getAll: <T_1 = any>(options?: universal_cookie.CookieGetOptions | undefined) => T_1;
+    getAll: <T = any>(options?: universal_cookie.CookieGetOptions | undefined) => T;
     set: (name: string, value: any, options?: universal_cookie.CookieSetOptions | undefined) => void;
     remove: (name: string, options?: universal_cookie.CookieSetOptions | undefined) => void;
     addChangeListener: (callback: universal_cookie.CookieChangeListener) => void;

package/useCookies.d.mts

@@ -19,7 +19,7 @@ declare function createCookies(req?: IncomingMessage): (dependencies?: string[]
     /**
      * Reactive get all cookies
      */
-    getAll: <T_1 = any>(options?: universal_cookie.CookieGetOptions | undefined) => T_1;
+    getAll: <T = any>(options?: universal_cookie.CookieGetOptions | undefined) => T;
     set: (name: string, value: any, options?: universal_cookie.CookieSetOptions | undefined) => void;
     remove: (name: string, options?: universal_cookie.CookieSetOptions | undefined) => void;
     addChangeListener: (callback: universal_cookie.CookieChangeListener) => void;
@@ -44,7 +44,7 @@ declare function useCookies(dependencies?: string[] | null, { doNotParse, autoUp
     /**
      * Reactive get all cookies
      */
-    getAll: <T_1 = any>(options?: universal_cookie.CookieGetOptions | undefined) => T_1;
+    getAll: <T = any>(options?: universal_cookie.CookieGetOptions | undefined) => T;
     set: (name: string, value: any, options?: universal_cookie.CookieSetOptions | undefined) => void;
     remove: (name: string, options?: universal_cookie.CookieSetOptions | undefined) => void;
     addChangeListener: (callback: universal_cookie.CookieChangeListener) => void;

package/useCookies.d.ts

@@ -19,7 +19,7 @@ declare function createCookies(req?: IncomingMessage): (dependencies?: string[]
     /**
      * Reactive get all cookies
      */
-    getAll: <T_1 = any>(options?: universal_cookie.CookieGetOptions | undefined) => T_1;
+    getAll: <T = any>(options?: universal_cookie.CookieGetOptions | undefined) => T;
     set: (name: string, value: any, options?: universal_cookie.CookieSetOptions | undefined) => void;
     remove: (name: string, options?: universal_cookie.CookieSetOptions | undefined) => void;
     addChangeListener: (callback: universal_cookie.CookieChangeListener) => void;
@@ -44,7 +44,7 @@ declare function useCookies(dependencies?: string[] | null, { doNotParse, autoUp
     /**
      * Reactive get all cookies
      */
-    getAll: <T_1 = any>(options?: universal_cookie.CookieGetOptions | undefined) => T_1;
+    getAll: <T = any>(options?: universal_cookie.CookieGetOptions | undefined) => T;
     set: (name: string, value: any, options?: universal_cookie.CookieSetOptions | undefined) => void;
     remove: (name: string, options?: universal_cookie.CookieSetOptions | undefined) => void;
     addChangeListener: (callback: universal_cookie.CookieChangeListener) => void;

package/useFocusTrap.cjs

@@ -1,6 +1,7 @@
 'use strict';
 
 var core = require('@vueuse/core');
+var shared = require('@vueuse/shared');
 var vueDemi = require('vue-demi');
 var focusTrap = require('focus-trap');
 
@@ -23,12 +24,19 @@ function useFocusTrap(target, options = {}) {
       isPaused.value = false;
     }
   };
+  const targets = vueDemi.computed(() => {
+    const _targets = shared.toValue(target);
+    return (Array.isArray(_targets) ? _targets : [_targets]).map((el) => {
+      const _el = shared.toValue(el);
+      return typeof _el === "string" ? _el : core.unrefElement(_el);
+    }).filter(shared.notNullish);
+  });
   vueDemi.watch(
-    () => core.unrefElement(target),
-    (el) => {
-      if (!el)
+    targets,
+    (els) => {
+      if (!els.length)
         return;
-      trap = focusTrap.createFocusTrap(el, {
+      trap = focusTrap.createFocusTrap(els, {
         ...focusTrapOptions,
         onActivate() {
           hasFocus.value = true;

package/useFocusTrap.d.cts

@@ -1,4 +1,5 @@
-import { Fn, MaybeElementRef } from '@vueuse/core';
+import { Fn, Arrayable, MaybeComputedElementRef } from '@vueuse/core';
+import { MaybeRefOrGetter } from '@vueuse/shared';
 import { Ref } from 'vue-demi';
 import { Options, ActivateOptions, DeactivateOptions } from 'focus-trap';
 
@@ -49,6 +50,6 @@ interface UseFocusTrapReturn {
  *
  * @see https://vueuse.org/useFocusTrap
  */
-declare function useFocusTrap(target: MaybeElementRef, options?: UseFocusTrapOptions): UseFocusTrapReturn;
+declare function useFocusTrap(target: Arrayable<MaybeRefOrGetter<string> | MaybeComputedElementRef>, options?: UseFocusTrapOptions): UseFocusTrapReturn;
 
 export { type UseFocusTrapOptions, type UseFocusTrapReturn, useFocusTrap };

package/useFocusTrap.d.mts

@@ -1,4 +1,5 @@
-import { Fn, MaybeElementRef } from '@vueuse/core';
+import { Fn, Arrayable, MaybeComputedElementRef } from '@vueuse/core';
+import { MaybeRefOrGetter } from '@vueuse/shared';
 import { Ref } from 'vue-demi';
 import { Options, ActivateOptions, DeactivateOptions } from 'focus-trap';
 
@@ -49,6 +50,6 @@ interface UseFocusTrapReturn {
  *
  * @see https://vueuse.org/useFocusTrap
  */
-declare function useFocusTrap(target: MaybeElementRef, options?: UseFocusTrapOptions): UseFocusTrapReturn;
+declare function useFocusTrap(target: Arrayable<MaybeRefOrGetter<string> | MaybeComputedElementRef>, options?: UseFocusTrapOptions): UseFocusTrapReturn;
 
 export { type UseFocusTrapOptions, type UseFocusTrapReturn, useFocusTrap };

package/useFocusTrap.d.ts

@@ -1,4 +1,5 @@
-import { Fn, MaybeElementRef } from '@vueuse/core';
+import { Fn, Arrayable, MaybeComputedElementRef } from '@vueuse/core';
+import { MaybeRefOrGetter } from '@vueuse/shared';
 import { Ref } from 'vue-demi';
 import { Options, ActivateOptions, DeactivateOptions } from 'focus-trap';
 
@@ -49,6 +50,6 @@ interface UseFocusTrapReturn {
  *
  * @see https://vueuse.org/useFocusTrap
  */
-declare function useFocusTrap(target: MaybeElementRef, options?: UseFocusTrapOptions): UseFocusTrapReturn;
+declare function useFocusTrap(target: Arrayable<MaybeRefOrGetter<string> | MaybeComputedElementRef>, options?: UseFocusTrapOptions): UseFocusTrapReturn;
 
 export { type UseFocusTrapOptions, type UseFocusTrapReturn, useFocusTrap };

package/useFocusTrap.iife.js

@@ -118,7 +118,7 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
   (globalThis || self).VueCompositionAPI || (typeof VueCompositionAPI !== 'undefined' ? VueCompositionAPI : undefined)
 );
 ;
-;(function (exports, core, vueDemi, focusTrap) {
+;(function (exports, core, shared, vueDemi, focusTrap) {
   'use strict';
 
   function useFocusTrap(target, options = {}) {
@@ -140,12 +140,19 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
         isPaused.value = false;
       }
     };
+    const targets = vueDemi.computed(() => {
+      const _targets = shared.toValue(target);
+      return (Array.isArray(_targets) ? _targets : [_targets]).map((el) => {
+        const _el = shared.toValue(el);
+        return typeof _el === "string" ? _el : core.unrefElement(_el);
+      }).filter(shared.notNullish);
+    });
     vueDemi.watch(
-      () => core.unrefElement(target),
-      (el) => {
-        if (!el)
+      targets,
+      (els) => {
+        if (!els.length)
           return;
-        trap = focusTrap.createFocusTrap(el, {
+        trap = focusTrap.createFocusTrap(els, {
           ...focusTrapOptions,
           onActivate() {
             hasFocus.value = true;
@@ -176,4 +183,4 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
 
   exports.useFocusTrap = useFocusTrap;
 
-})(this.VueUse = this.VueUse || {}, VueUse, VueDemi, focusTrap);
+})(this.VueUse = this.VueUse || {}, VueUse, VueUse, VueDemi, focusTrap);

package/useFocusTrap.iife.min.js

@@ -1 +1 @@
-var VueDemi=function(n,e,c){if(n.install)return n;if(!e)return console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`."),n;if(e.version.slice(0,4)==="2.7."){let r=function(t,s){var o,v={},l={config:e.config,use:e.use.bind(e),mixin:e.mixin.bind(e),component:e.component.bind(e),provide:function(a,f){return v[a]=f,this},directive:function(a,f){return f?(e.directive(a,f),l):e.directive(a)},mount:function(a,f){return o||(o=new e(Object.assign({propsData:s},t,{provide:Object.assign(v,t.provide)})),o.$mount(a,f),o)},unmount:function(){o&&(o.$destroy(),o=void 0)}};return l};var d=r;for(var i in e)n[i]=e[i];n.isVue2=!0,n.isVue3=!1,n.install=function(){},n.Vue=e,n.Vue2=e,n.version=e.version,n.warn=e.util.warn,n.hasInjectionContext=function(){return!!n.getCurrentInstance()},n.createApp=r}else if(e.version.slice(0,2)==="2.")if(c){for(var i in c)n[i]=c[i];n.isVue2=!0,n.isVue3=!1,n.install=function(){},n.Vue=e,n.Vue2=e,n.version=e.version,n.hasInjectionContext=function(){return!!n.getCurrentInstance()}}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.");else if(e.version.slice(0,2)==="3."){for(var i in e)n[i]=e[i];n.isVue2=!1,n.isVue3=!0,n.install=function(){},n.Vue=e,n.Vue2=void 0,n.version=e.version,n.set=function(r,t,s){return Array.isArray(r)?(r.length=Math.max(r.length,t),r.splice(t,1,s),s):(r[t]=s,s)},n.del=function(r,t){if(Array.isArray(r)){r.splice(t,1);return}delete r[t]}}else console.error("[vue-demi] Vue version "+e.version+" is unsupported.");return n}((globalThis||self).VueDemi=(globalThis||self).VueDemi||(typeof VueDemi<"u"?VueDemi:{}),(globalThis||self).Vue||(typeof Vue<"u"?Vue:void 0),(globalThis||self).VueCompositionAPI||(typeof VueCompositionAPI<"u"?VueCompositionAPI:void 0));(function(n,e,c,i){"use strict";function d(r,t={}){let s;const{immediate:o,...v}=t,l=c.ref(!1),a=c.ref(!1),f=u=>s&&s.activate(u),p=u=>s&&s.deactivate(u),h=()=>{s&&(s.pause(),a.value=!0)},b=()=>{s&&(s.unpause(),a.value=!1)};return c.watch(()=>e.unrefElement(r),u=>{u&&(s=i.createFocusTrap(u,{...v,onActivate(){l.value=!0,t.onActivate&&t.onActivate()},onDeactivate(){l.value=!1,t.onDeactivate&&t.onDeactivate()}}),o&&f())},{flush:"post"}),e.tryOnScopeDispose(()=>p()),{hasFocus:l,isPaused:a,activate:f,deactivate:p,pause:h,unpause:b}}n.useFocusTrap=d})(this.VueUse=this.VueUse||{},VueUse,VueDemi,focusTrap);
+var VueDemi=function(n,t,l){if(n.install)return n;if(!t)return console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`."),n;if(t.version.slice(0,4)==="2.7."){let s=function(i,o){var e,u={},v={config:t.config,use:t.use.bind(t),mixin:t.mixin.bind(t),component:t.component.bind(t),provide:function(a,c){return u[a]=c,this},directive:function(a,c){return c?(t.directive(a,c),v):t.directive(a)},mount:function(a,c){return e||(e=new t(Object.assign({propsData:o},i,{provide:Object.assign(u,i.provide)})),e.$mount(a,c),e)},unmount:function(){e&&(e.$destroy(),e=void 0)}};return v};var d=s;for(var r in t)n[r]=t[r];n.isVue2=!0,n.isVue3=!1,n.install=function(){},n.Vue=t,n.Vue2=t,n.version=t.version,n.warn=t.util.warn,n.hasInjectionContext=function(){return!!n.getCurrentInstance()},n.createApp=s}else if(t.version.slice(0,2)==="2.")if(l){for(var r in l)n[r]=l[r];n.isVue2=!0,n.isVue3=!1,n.install=function(){},n.Vue=t,n.Vue2=t,n.version=t.version,n.hasInjectionContext=function(){return!!n.getCurrentInstance()}}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.");else if(t.version.slice(0,2)==="3."){for(var r in t)n[r]=t[r];n.isVue2=!1,n.isVue3=!0,n.install=function(){},n.Vue=t,n.Vue2=void 0,n.version=t.version,n.set=function(s,i,o){return Array.isArray(s)?(s.length=Math.max(s.length,i),s.splice(i,1,o),o):(s[i]=o,o)},n.del=function(s,i){if(Array.isArray(s)){s.splice(i,1);return}delete s[i]}}else console.error("[vue-demi] Vue version "+t.version+" is unsupported.");return n}((globalThis||self).VueDemi=(globalThis||self).VueDemi||(typeof VueDemi<"u"?VueDemi:{}),(globalThis||self).Vue||(typeof Vue<"u"?Vue:void 0),(globalThis||self).VueCompositionAPI||(typeof VueCompositionAPI<"u"?VueCompositionAPI:void 0));(function(n,t,l,r,d){"use strict";function s(i,o={}){let e;const{immediate:u,...v}=o,a=r.ref(!1),c=r.ref(!1),h=f=>e&&e.activate(f),b=f=>e&&e.deactivate(f),A=()=>{e&&(e.pause(),c.value=!0)},g=()=>{e&&(e.unpause(),c.value=!1)},y=r.computed(()=>{const f=l.toValue(i);return(Array.isArray(f)?f:[f]).map(T=>{const p=l.toValue(T);return typeof p=="string"?p:t.unrefElement(p)}).filter(l.notNullish)});return r.watch(y,f=>{f.length&&(e=d.createFocusTrap(f,{...v,onActivate(){a.value=!0,o.onActivate&&o.onActivate()},onDeactivate(){a.value=!1,o.onDeactivate&&o.onDeactivate()}}),u&&h())},{flush:"post"}),t.tryOnScopeDispose(()=>b()),{hasFocus:a,isPaused:c,activate:h,deactivate:b,pause:A,unpause:g}}n.useFocusTrap=s})(this.VueUse=this.VueUse||{},VueUse,VueUse,VueDemi,focusTrap);

package/useFocusTrap.mjs

@@ -1,5 +1,6 @@
 import { unrefElement, tryOnScopeDispose } from '@vueuse/core';
-import { ref, watch } from 'vue-demi';
+import { toValue, notNullish } from '@vueuse/shared';
+import { ref, computed, watch } from 'vue-demi';
 import { createFocusTrap } from 'focus-trap';
 
 function useFocusTrap(target, options = {}) {
@@ -21,12 +22,19 @@ function useFocusTrap(target, options = {}) {
       isPaused.value = false;
     }
   };
+  const targets = computed(() => {
+    const _targets = toValue(target);
+    return (Array.isArray(_targets) ? _targets : [_targets]).map((el) => {
+      const _el = toValue(el);
+      return typeof _el === "string" ? _el : unrefElement(_el);
+    }).filter(notNullish);
+  });
   watch(
-    () => unrefElement(target),
-    (el) => {
-      if (!el)
+    targets,
+    (els) => {
+      if (!els.length)
         return;
-      trap = createFocusTrap(el, {
+      trap = createFocusTrap(els, {
         ...focusTrapOptions,
         onActivate() {
           hasFocus.value = true;

package/useFuse.d.cts

@@ -12,7 +12,7 @@ interface UseFuseOptions<T> {
 }
 declare function useFuse<DataItem>(search: MaybeRefOrGetter<string>, data: MaybeRefOrGetter<DataItem[]>, options?: MaybeRefOrGetter<UseFuseOptions<DataItem>>): {
     fuse: vue_demi.Ref<{
-        search: <R = DataItem>(pattern: string | fuse_js.Expression, options?: fuse_js.FuseSearchOptions | undefined) => FuseResult<R>[];
+        search: <R = DataItem>(pattern: string | fuse_js.Expression, options?: fuse_js.FuseSearchOptions) => FuseResult<R>[];
         setCollection: (docs: readonly DataItem[], index?: fuse_js.FuseIndex<DataItem> | undefined) => void;
         add: (doc: DataItem) => void;
         remove: (predicate: (doc: DataItem, idx: number) => boolean) => DataItem[];

package/useFuse.d.mts

@@ -12,7 +12,7 @@ interface UseFuseOptions<T> {
 }
 declare function useFuse<DataItem>(search: MaybeRefOrGetter<string>, data: MaybeRefOrGetter<DataItem[]>, options?: MaybeRefOrGetter<UseFuseOptions<DataItem>>): {
     fuse: vue_demi.Ref<{
-        search: <R = DataItem>(pattern: string | fuse_js.Expression, options?: fuse_js.FuseSearchOptions | undefined) => FuseResult<R>[];
+        search: <R = DataItem>(pattern: string | fuse_js.Expression, options?: fuse_js.FuseSearchOptions) => FuseResult<R>[];
         setCollection: (docs: readonly DataItem[], index?: fuse_js.FuseIndex<DataItem> | undefined) => void;
         add: (doc: DataItem) => void;
         remove: (predicate: (doc: DataItem, idx: number) => boolean) => DataItem[];

package/useFuse.d.ts

@@ -12,7 +12,7 @@ interface UseFuseOptions<T> {
 }
 declare function useFuse<DataItem>(search: MaybeRefOrGetter<string>, data: MaybeRefOrGetter<DataItem[]>, options?: MaybeRefOrGetter<UseFuseOptions<DataItem>>): {
     fuse: vue_demi.Ref<{
-        search: <R = DataItem>(pattern: string | fuse_js.Expression, options?: fuse_js.FuseSearchOptions | undefined) => FuseResult<R>[];
+        search: <R = DataItem>(pattern: string | fuse_js.Expression, options?: fuse_js.FuseSearchOptions) => FuseResult<R>[];
         setCollection: (docs: readonly DataItem[], index?: fuse_js.FuseIndex<DataItem> | undefined) => void;
         add: (doc: DataItem) => void;
         remove: (predicate: (doc: DataItem, idx: number) => boolean) => DataItem[];

package/useNProgress.d.cts

@@ -12,7 +12,7 @@ declare function useNProgress(currentProgress?: MaybeRefOrGetter<number | null |
     isLoading: vue_demi.WritableComputedRef<boolean>;
     progress: vue_demi.Ref<number | (() => number | null | undefined) | null | undefined>;
     start: () => nprogress.NProgress;
-    done: (force?: boolean | undefined) => nprogress.NProgress;
+    done: (force?: boolean) => nprogress.NProgress;
     remove: () => void;
 };
 type UseNProgressReturn = ReturnType<typeof useNProgress>;

package/useNProgress.d.mts

@@ -12,7 +12,7 @@ declare function useNProgress(currentProgress?: MaybeRefOrGetter<number | null |
     isLoading: vue_demi.WritableComputedRef<boolean>;
     progress: vue_demi.Ref<number | (() => number | null | undefined) | null | undefined>;
     start: () => nprogress.NProgress;
-    done: (force?: boolean | undefined) => nprogress.NProgress;
+    done: (force?: boolean) => nprogress.NProgress;
     remove: () => void;
 };
 type UseNProgressReturn = ReturnType<typeof useNProgress>;

package/useNProgress.d.ts

@@ -12,7 +12,7 @@ declare function useNProgress(currentProgress?: MaybeRefOrGetter<number | null |
     isLoading: vue_demi.WritableComputedRef<boolean>;
     progress: vue_demi.Ref<number | (() => number | null | undefined) | null | undefined>;
     start: () => nprogress.NProgress;
-    done: (force?: boolean | undefined) => nprogress.NProgress;
+    done: (force?: boolean) => nprogress.NProgress;
     remove: () => void;
 };
 type UseNProgressReturn = ReturnType<typeof useNProgress>;