@vueuse/components - npm Package Compare versions

Comparing version 6.4.1 to 6.5.3

index.d.ts

 import * as vue_demi from 'vue-demi';
 import { FunctionDirective } from 'vue-demi';
-import * as _vueuse_core from '@vueuse/core';
 import { UseDarkOptions, UseDevicesListOptions, UseDraggableOptions, ElementSize, GeolocationOptions, IdleOptions, MouseOptions, MouseInElementOptions, MousePressedOptions, UseNowOptions, UsePointerOptions, TimeAgoOptions, TimestampOptions, UseVirtualListOptions, WindowSizeOptions } from '@vueuse/core';
@@ -16,7 +15,3 @@ import { MaybeRef } from '@vueuse/shared';
 
-declare const OnClickOutside: vue_demi.DefineComponent<RenderableComponent, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    as?: unknown;
-} & {} & {
-    as?: string | Object | undefined;
-}>, {}>;
+declare const OnClickOutside: vue_demi.DefineComponent<RenderableComponent, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<RenderableComponent>, {}>;
 
@@ -56,33 +51,3 @@ interface ConfigurableWindow {
 
-declare const UseDark: vue_demi.DefineComponent<UseDarkOptions, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    selector?: unknown;
-    attribute?: unknown;
-    valueDark?: unknown;
-    valueLight?: unknown;
-    onChanged?: unknown;
-    storageKey?: unknown;
-    storage?: unknown;
-    deep?: unknown;
-    listenToStorageChanges?: unknown;
-    serializer?: unknown;
-    onError?: unknown;
-    eventFilter?: unknown;
-    window?: unknown;
-    flush?: unknown;
-} & {} & {
-    flush?: "pre" | "post" | "sync" | undefined;
-    eventFilter?: _vueuse_core.EventFilter<any[], any> | undefined;
-    deep?: boolean | undefined;
-    onError?: ((error: unknown) => void) | undefined;
-    storage?: _vueuse_core.StorageLike | undefined;
-    window?: Window | undefined;
-    listenToStorageChanges?: boolean | undefined;
-    serializer?: _vueuse_core.Serializer<_vueuse_core.ColorSchemes> | undefined;
-    selector?: string | undefined;
-    attribute?: string | undefined;
-    valueDark?: string | undefined;
-    valueLight?: string | undefined;
-    onChanged?: ((isDark: boolean) => void) | undefined;
-    storageKey?: string | null | undefined;
-}>, {}>;
+declare const UseDark: vue_demi.DefineComponent<UseDarkOptions, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<UseDarkOptions>, {}>;
 
@@ -101,11 +66,3 @@ declare const UseDeviceMotion: vue_demi.DefineComponent<{}, () => vue_demi.VNode<vue_demi.RendererNode, vue_demi.RendererElement, {
 
-declare const UseDevicesList: vue_demi.DefineComponent<UseDevicesListOptions, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    onUpdated?: unknown;
-    requestPermissions?: unknown;
-    navigator?: unknown;
-} & {} & {
-    navigator?: Navigator | undefined;
-    onUpdated?: ((devices: MediaDeviceInfo[]) => void) | undefined;
-    requestPermissions?: boolean | undefined;
-}>, {}>;
+declare const UseDevicesList: vue_demi.DefineComponent<UseDevicesListOptions, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<UseDevicesListOptions>, {}>;
 
@@ -128,133 +85,25 @@ declare const UseDocumentVisibility: vue_demi.DefineComponent<{}, () => vue_demi.VNode<vue_demi.RendererNode, vue_demi.RendererElement, {
 }
-declare const UseDraggable: vue_demi.DefineComponent<UseDraggableProps, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    storageKey?: unknown;
-    storageType?: unknown;
-    exact?: unknown;
-    preventDefault?: unknown;
-    draggingElement?: unknown;
-    pointerTypes?: unknown;
-    initialValue?: unknown;
-    onStart?: unknown;
-    onMove?: unknown;
-    as?: unknown;
-} & {} & {
-    initialValue?: _vueuse_core.MaybeRef<_vueuse_core.Position> | undefined;
-    storageKey?: string | undefined;
-    pointerTypes?: _vueuse_core.PointerType[] | undefined;
-    preventDefault?: _vueuse_core.MaybeRef<boolean> | undefined;
-    as?: string | Object | undefined;
-    storageType?: "local" | "session" | undefined;
-    exact?: _vueuse_core.MaybeRef<boolean> | undefined;
-    draggingElement?: _vueuse_core.MaybeRef<Window | Document | HTMLElement | SVGElement | null> | undefined;
-    onStart?: ((position: _vueuse_core.Position, event: PointerEvent) => false | void) | undefined;
-    onMove?: ((position: _vueuse_core.Position, event: PointerEvent) => void) | undefined;
-}>, {}>;
+declare const UseDraggable: vue_demi.DefineComponent<UseDraggableProps, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<UseDraggableProps>, {}>;
 
-declare const UseElementBounding: vue_demi.DefineComponent<ResizeObserverOptions & RenderableComponent, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    box?: unknown;
-    window?: unknown;
-    as?: unknown;
-} & {} & {
-    window?: Window | undefined;
-    box?: "content-box" | "border-box" | undefined;
-    as?: string | Object | undefined;
-}>, {}>;
+declare const UseElementBounding: vue_demi.DefineComponent<ResizeObserverOptions & RenderableComponent, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<ResizeObserverOptions & RenderableComponent>, {}>;
 
-declare const UseElementSize: vue_demi.DefineComponent<ElementSize & ResizeObserverOptions & RenderableComponent, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    width?: unknown;
-    height?: unknown;
-    box?: unknown;
-    window?: unknown;
-    as?: unknown;
-} & {} & {
-    window?: Window | undefined;
-    box?: "content-box" | "border-box" | undefined;
-    width?: number | undefined;
-    height?: number | undefined;
-    as?: string | Object | undefined;
-}>, {}>;
+declare const UseElementSize: vue_demi.DefineComponent<ElementSize & ResizeObserverOptions & RenderableComponent, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<ElementSize & ResizeObserverOptions & RenderableComponent>, {}>;
 
-declare const UseElementVisibility: vue_demi.DefineComponent<RenderableComponent, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    as?: unknown;
-} & {} & {
-    as?: string | Object | undefined;
-}>, {}>;
+declare const UseElementVisibility: vue_demi.DefineComponent<RenderableComponent, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<RenderableComponent>, {}>;
 
-declare const UseFullscreen: vue_demi.DefineComponent<RenderableComponent, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    as?: unknown;
-} & {} & {
-    as?: string | Object | undefined;
-}>, {}>;
+declare const UseFullscreen: vue_demi.DefineComponent<RenderableComponent, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<RenderableComponent>, {}>;
 
-declare const UseGeolocation: vue_demi.DefineComponent<GeolocationOptions, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    enableHighAccuracy?: unknown;
-    maximumAge?: unknown;
-    timeout?: unknown;
-    navigator?: unknown;
-} & {} & {
-    timeout?: number | undefined;
-    navigator?: Navigator | undefined;
-    enableHighAccuracy?: boolean | undefined;
-    maximumAge?: number | undefined;
-}>, {}>;
+declare const UseGeolocation: vue_demi.DefineComponent<GeolocationOptions, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<GeolocationOptions>, {}>;
 
 declare const UseIdle: vue_demi.DefineComponent<IdleOptions & {
     timeout: number;
-}, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    events?: unknown;
-    listenForVisibilityChange?: unknown;
-    initialState?: unknown;
-    window?: unknown;
-    eventFilter?: unknown;
-    timeout?: unknown;
-} & {} & {
-    eventFilter?: _vueuse_core.EventFilter<any[], any> | undefined;
-    timeout?: number | undefined;
-    window?: Window | undefined;
-    events?: (keyof WindowEventMap)[] | undefined;
-    listenForVisibilityChange?: boolean | undefined;
-    initialState?: boolean | undefined;
+}, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<IdleOptions & {
+    timeout: number;
 }>, {}>;
 
-declare const UseMouse: vue_demi.DefineComponent<MouseOptions, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    touch?: unknown;
-    resetOnTouchEnds?: unknown;
-    initialValue?: unknown;
-    window?: unknown;
-} & {} & {
-    initialValue?: _vueuse_core.Position | undefined;
-    window?: Window | undefined;
-    touch?: boolean | undefined;
-    resetOnTouchEnds?: boolean | undefined;
-}>, {}>;
+declare const UseMouse: vue_demi.DefineComponent<MouseOptions, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<MouseOptions>, {}>;
 
-declare const UseMouseInElement: vue_demi.DefineComponent<MouseInElementOptions & RenderableComponent, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    handleOutside?: unknown;
-    touch?: unknown;
-    resetOnTouchEnds?: unknown;
-    initialValue?: unknown;
-    window?: unknown;
-    as?: unknown;
-} & {} & {
-    initialValue?: _vueuse_core.Position | undefined;
-    window?: Window | undefined;
-    touch?: boolean | undefined;
-    resetOnTouchEnds?: boolean | undefined;
-    handleOutside?: boolean | undefined;
-    as?: string | Object | undefined;
-}>, {}>;
+declare const UseMouseInElement: vue_demi.DefineComponent<MouseInElementOptions & RenderableComponent, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<MouseInElementOptions & RenderableComponent>, {}>;
 
-declare const UseMousePressed: vue_demi.DefineComponent<Omit<MousePressedOptions, "target"> & RenderableComponent, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    initialValue?: unknown;
-    drag?: unknown;
-    window?: unknown;
-    touch?: unknown;
-    as?: unknown;
-} & {} & {
-    initialValue?: boolean | undefined;
-    drag?: boolean | undefined;
-    window?: Window | undefined;
-    touch?: boolean | undefined;
-    as?: string | Object | undefined;
-}>, {}>;
+declare const UseMousePressed: vue_demi.DefineComponent<Omit<MousePressedOptions, "target"> & RenderableComponent, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<Omit<MousePressedOptions, "target"> & RenderableComponent>, {}>;
 
@@ -265,7 +114,3 @@ declare const UseNetwork: vue_demi.DefineComponent<{}, () => vue_demi.VNode<vue_demi.RendererNode, vue_demi.RendererElement, {
 
-declare const UseNow: vue_demi.DefineComponent<Omit<UseNowOptions<true>, "controls">, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    interval?: unknown;
-} & {} & {
-    interval?: number | "requestAnimationFrame" | undefined;
-}>, {}>;
+declare const UseNow: vue_demi.DefineComponent<Omit<UseNowOptions<true>, "controls">, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<Omit<UseNowOptions<true>, "controls">>, {}>;
 
@@ -282,12 +127,4 @@ declare const UseOnline: vue_demi.DefineComponent<{}, () => vue_demi.VNode<vue_demi.RendererNode, vue_demi.RendererElement, {
     target: 'window' | 'self';
-}, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    initialValue?: unknown;
-    window?: unknown;
-    pointerTypes?: unknown;
-    target?: unknown;
-} & {} & {
-    target?: "window" | "self" | undefined;
-    initialValue?: _vueuse_core.MaybeRef<Partial<_vueuse_core.UsePointerState>> | undefined;
-    window?: Window | undefined;
-    pointerTypes?: _vueuse_core.PointerType[] | undefined;
+}, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<Omit<UsePointerOptions, "target"> & {
+    target: 'window' | 'self';
 }>, {}>;
@@ -310,23 +147,5 @@
 }
-declare const UseTimeAgo: vue_demi.DefineComponent<UseTimeAgoComponentOptions, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    time?: unknown;
-    max?: unknown;
-    updateInterval?: unknown;
-    messages?: unknown;
-    fullDateFormatter?: unknown;
-} & {} & {
-    time?: MaybeRef<string | number | Date> | undefined;
-    max?: number | "second" | "minute" | "hour" | "day" | "week" | "month" | "year" | undefined;
-    updateInterval?: number | undefined;
-    messages?: _vueuse_core.TimeAgoMessages | undefined;
-    fullDateFormatter?: ((date: Date) => string) | undefined;
-}>, {}>;
+declare const UseTimeAgo: vue_demi.DefineComponent<UseTimeAgoComponentOptions, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<UseTimeAgoComponentOptions>, {}>;
 
-declare const UseTimestamp: vue_demi.DefineComponent<Omit<TimestampOptions<true>, "controls">, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    interval?: unknown;
-    offset?: unknown;
-} & {} & {
-    interval?: number | "requestAnimationFrame" | undefined;
-    offset?: number | undefined;
-}>, {}>;
+declare const UseTimestamp: vue_demi.DefineComponent<Omit<TimestampOptions<true>, "controls">, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<Omit<TimestampOptions<true>, "controls">>, {}>;
 
@@ -353,11 +172,3 @@ interface UseVirtualListProps {
 }
-declare const UseVirtualList: vue_demi.DefineComponent<UseVirtualListProps, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    list?: unknown;
-    options?: unknown;
-    height?: unknown;
-} & {} & {
-    options?: UseVirtualListOptions | undefined;
-    height?: string | undefined;
-    list?: any;
-}>, {}>;
+declare const UseVirtualList: vue_demi.DefineComponent<UseVirtualListProps, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<UseVirtualListProps>, {}>;
 
@@ -368,12 +179,4 @@ declare const UseWindowFocus: vue_demi.DefineComponent<{}, () => vue_demi.VNode<vue_demi.RendererNode, vue_demi.RendererElement, {
 
-declare const UseWindowSize: vue_demi.DefineComponent<WindowSizeOptions, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<{
-    initialWidth?: unknown;
-    initialHeight?: unknown;
-    window?: unknown;
-} & {} & {
-    window?: Window | undefined;
-    initialWidth?: number | undefined;
-    initialHeight?: number | undefined;
-}>, {}>;
+declare const UseWindowSize: vue_demi.DefineComponent<WindowSizeOptions, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<WindowSizeOptions>, {}>;
 
 export { OnClickOutside, UseActiveElement, UseBattery, UseBrowserLocation, UseDark, UseDeviceMotion, UseDeviceOrientation, UseDevicePixelRatio, UseDevicesList, UseDocumentVisibility, UseDraggable, UseDraggableProps, UseElementBounding, UseElementSize, UseElementVisibility, UseFullscreen, UseGeolocation, UseIdle, UseMouse, UseMouseInElement, UseMousePressed, UseNetwork, UseNow, UseOnline, UsePageLeave, UsePointer, UsePreferredColorScheme, UsePreferredDark, UsePreferredLanguages, UseTimeAgo, UseTimestamp, UseVirtualList, UseVirtualListProps, UseWindowFocus, UseWindowSize, VOnClickOutside };

index.iife.js

@@ -66,512 +66,627 @@ ;(function (window) {
   const OnClickOutside = vueDemi.defineComponent({
-      name: 'OnClickOutside',
-      props: ['as'],
-      emits: ['trigger'],
-      setup(props, { slots, emit }) {
-          const target = vueDemi.ref();
-          core.onClickOutside(target, (e) => {
-              emit('trigger', e);
-          });
-          return () => {
-              if (slots.default)
-                  return vueDemi.h(props.as || 'div', { ref: target }, slots.default());
-          };
-      },
+    name: "OnClickOutside",
+    props: ["as"],
+    emits: ["trigger"],
+    setup(props, { slots, emit }) {
+      const target = vueDemi.ref();
+      core.onClickOutside(target, (e) => {
+        emit("trigger", e);
+      });
+      return () => {
+        if (slots.default)
+          return vueDemi.h(props.as || "div", { ref: target }, slots.default());
+      };
+    }
   });
 
-  /**
-   * Get the dom element of a ref of element or Vue component instance
-   *
-   * @param elRef
-   */
   function unrefElement(elRef) {
-      var _a, _b;
-      const plain = vueDemi.unref(elRef);
-      return (_b = (_a = plain) === null || _a === void 0 ? void 0 : _a.$el) !== null && _b !== void 0 ? _b : plain;
+    var _a;
+    const plain = vueDemi.unref(elRef);
+    return (_a = plain == null ? void 0 : plain.$el) != null ? _a : plain;
   }
 
-  const defaultWindow =  shared.isClient ? window : undefined;
+  const defaultWindow = shared.isClient ? window : void 0;
 
   function useEventListener(...args) {
-      let target;
-      let event;
-      let listener;
-      let options;
-      if (shared.isString(args[0])) {
-          [event, listener, options] = args;
-          target = defaultWindow;
-      }
-      else {
-          [target, event, listener, options] = args;
-      }
-      if (!target)
-          return shared.noop;
-      let cleanup = shared.noop;
-      const stopWatch = vueDemi.watch(() => vueDemi.unref(target), (el) => {
-          cleanup();
-          if (!el)
-              return;
-          el.addEventListener(event, listener, options);
-          cleanup = () => {
-              el.removeEventListener(event, listener, options);
-              cleanup = shared.noop;
-          };
-      }, { immediate: true, flush: 'post' });
-      const stop = () => {
-          stopWatch();
-          cleanup();
+    let target;
+    let event;
+    let listener;
+    let options;
+    if (shared.isString(args[0])) {
+      [event, listener, options] = args;
+      target = defaultWindow;
+    } else {
+      [target, event, listener, options] = args;
+    }
+    if (!target)
+      return shared.noop;
+    let cleanup = shared.noop;
+    const stopWatch = vueDemi.watch(() => vueDemi.unref(target), (el) => {
+      cleanup();
+      if (!el)
+        return;
+      el.addEventListener(event, listener, options);
+      cleanup = () => {
+        el.removeEventListener(event, listener, options);
+        cleanup = shared.noop;
       };
-      shared.tryOnScopeDispose(stop);
-      return stop;
+    }, { immediate: true, flush: "post" });
+    const stop = () => {
+      stopWatch();
+      cleanup();
+    };
+    shared.tryOnScopeDispose(stop);
+    return stop;
   }
 
-  /**
-   * Listen for clicks outside of an element.
-   *
-   * @see https://vueuse.org/onClickOutside
-   * @param target
-   * @param handler
-   * @param options
-   */
   function onClickOutside(target, handler, options = {}) {
-      const { window = defaultWindow, event = 'pointerdown' } = options;
-      if (!window)
-          return;
-      const listener = (event) => {
-          const el = unrefElement(target);
-          if (!el)
-              return;
-          if (el === event.target || event.composedPath().includes(el))
-              return;
-          handler(event);
-      };
-      return useEventListener(window, event, listener, { passive: true });
+    const { window = defaultWindow, event = "pointerdown" } = options;
+    if (!window)
+      return;
+    const listener = (event2) => {
+      const el = unrefElement(target);
+      if (!el)
+        return;
+      if (el === event2.target || event2.composedPath().includes(el))
+        return;
+      handler(event2);
+    };
+    return useEventListener(window, event, listener, { passive: true });
   }
 
-  /**
-   * TODO: Test that this actually works
-   */
   const VOnClickOutside = (el, binding) => {
-      onClickOutside(el, binding.value);
+    onClickOutside(el, binding.value);
   };
 
   const UseActiveElement = vueDemi.defineComponent({
-      name: 'UseActiveElement',
-      setup(props, { slots }) {
-          const data = vueDemi.reactive({
-              element: core.useActiveElement(),
-          });
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseActiveElement",
+    setup(props, { slots }) {
+      const data = vueDemi.reactive({
+        element: core.useActiveElement()
+      });
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
   const UseBattery = vueDemi.defineComponent({
-      name: 'UseBattery',
-      setup(props, { slots }) {
-          const data = vueDemi.reactive(core.useBattery(props));
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseBattery",
+    setup(props, { slots }) {
+      const data = vueDemi.reactive(core.useBattery(props));
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
   const UseBrowserLocation = vueDemi.defineComponent({
-      name: 'UseBrowserLocation',
-      setup(props, { slots }) {
-          const data = vueDemi.reactive(core.useBrowserLocation());
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseBrowserLocation",
+    setup(props, { slots }) {
+      const data = vueDemi.reactive(core.useBrowserLocation());
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
   const UseDark = vueDemi.defineComponent({
-      name: 'UseDark',
-      props: ['selector', 'attribute', 'valueDark', 'valueLight', 'onChanged', 'storageKey', 'storage'],
-      setup(props, { slots }) {
-          const isDark = core.useDark(props);
-          const data = vueDemi.reactive({
-              isDark,
-              toggleDark: shared.useToggle(isDark),
-          });
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseDark",
+    props: ["selector", "attribute", "valueDark", "valueLight", "onChanged", "storageKey", "storage"],
+    setup(props, { slots }) {
+      const isDark = core.useDark(props);
+      const data = vueDemi.reactive({
+        isDark,
+        toggleDark: shared.useToggle(isDark)
+      });
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
   const UseDeviceMotion = vueDemi.defineComponent({
-      name: 'UseDeviceMotion',
-      setup(props, { slots }) {
-          const data = vueDemi.reactive(core.useDeviceMotion());
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseDeviceMotion",
+    setup(props, { slots }) {
+      const data = vueDemi.reactive(core.useDeviceMotion());
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
   const UseDeviceOrientation = vueDemi.defineComponent({
-      name: 'UseDeviceOrientation',
-      setup(props, { slots }) {
-          const data = vueDemi.reactive(core.useDeviceOrientation());
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseDeviceOrientation",
+    setup(props, { slots }) {
+      const data = vueDemi.reactive(core.useDeviceOrientation());
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
   const UseDevicePixelRatio = vueDemi.defineComponent({
-      name: 'UseDevicePixelRatio',
-      setup(props, { slots }) {
-          const data = vueDemi.reactive({
-              pixelRatio: core.useDevicePixelRatio(),
-          });
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseDevicePixelRatio",
+    setup(props, { slots }) {
+      const data = vueDemi.reactive({
+        pixelRatio: core.useDevicePixelRatio()
+      });
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
   const UseDevicesList = vueDemi.defineComponent({
-      name: 'UseDevicesList',
-      props: ['onUpdated', 'requestPermissions'],
-      setup(props, { slots }) {
-          const data = vueDemi.reactive(core.useDevicesList(props));
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseDevicesList",
+    props: ["onUpdated", "requestPermissions"],
+    setup(props, { slots }) {
+      const data = vueDemi.reactive(core.useDevicesList(props));
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
   const UseDocumentVisibility = vueDemi.defineComponent({
-      name: 'UseDocumentVisibility',
-      setup(props, { slots }) {
-          const data = vueDemi.reactive({
-              visibility: core.useDocumentVisibility(),
-          });
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseDocumentVisibility",
+    setup(props, { slots }) {
+      const data = vueDemi.reactive({
+        visibility: core.useDocumentVisibility()
+      });
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
+  var __defProp$6 = Object.defineProperty;
+  var __defProps$5 = Object.defineProperties;
+  var __getOwnPropDescs$5 = Object.getOwnPropertyDescriptors;
+  var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
+  var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
+  var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
+  var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+  var __spreadValues$6 = (a, b) => {
+    for (var prop in b || (b = {}))
+      if (__hasOwnProp$6.call(b, prop))
+        __defNormalProp$6(a, prop, b[prop]);
+    if (__getOwnPropSymbols$6)
+      for (var prop of __getOwnPropSymbols$6(b)) {
+        if (__propIsEnum$6.call(b, prop))
+          __defNormalProp$6(a, prop, b[prop]);
+      }
+    return a;
+  };
+  var __spreadProps$5 = (a, b) => __defProps$5(a, __getOwnPropDescs$5(b));
   const UseDraggable = vueDemi.defineComponent({
-      name: 'UseDraggable',
-      props: [
-          'storageKey',
-          'initialValue',
-          'exact',
-          'preventDefault',
-          'pointerTypes',
-          'as',
-      ],
-      setup(props, { slots }) {
-          const target = vueDemi.ref();
-          const initialValue = props.storageKey
-              ? core.useStorage(props.storageKey, vueDemi.unref(props.initialValue) || { x: 0, y: 0 }, props.storageType === 'session' ? sessionStorage : localStorage)
-              : props.initialValue || { x: 0, y: 0 };
-          const data = vueDemi.reactive(core.useDraggable(target, Object.assign(Object.assign({}, props), { initialValue })));
-          return () => {
-              if (slots.default)
-                  return vueDemi.h(props.as || 'div', { ref: target, style: `touch-action:none;${data.style}` }, slots.default(data));
-          };
-      },
+    name: "UseDraggable",
+    props: [
+      "storageKey",
+      "initialValue",
+      "exact",
+      "preventDefault",
+      "pointerTypes",
+      "as"
+    ],
+    setup(props, { slots }) {
+      const target = vueDemi.ref();
+      const initialValue = props.storageKey ? core.useStorage(props.storageKey, vueDemi.unref(props.initialValue) || { x: 0, y: 0 }, core.isClient ? props.storageType === "session" ? sessionStorage : localStorage : void 0) : props.initialValue || { x: 0, y: 0 };
+      const data = vueDemi.reactive(core.useDraggable(target, __spreadProps$5(__spreadValues$6({}, props), {
+        initialValue
+      })));
+      return () => {
+        if (slots.default)
+          return vueDemi.h(props.as || "div", { ref: target, style: `touch-action:none;${data.style}` }, slots.default(data));
+      };
+    }
   });
 
   const UseElementBounding = vueDemi.defineComponent({
-      name: 'UseElementBounding',
-      props: ['box', 'as'],
-      setup(props, { slots }) {
-          const target = vueDemi.ref();
-          const data = vueDemi.reactive(core.useElementBounding(target, { box: props.box, window: props.window }));
-          return () => {
-              if (slots.default)
-                  return vueDemi.h(props.as || 'div', { ref: target }, slots.default(data));
-          };
-      },
+    name: "UseElementBounding",
+    props: ["box", "as"],
+    setup(props, { slots }) {
+      const target = vueDemi.ref();
+      const data = vueDemi.reactive(core.useElementBounding(target, { box: props.box, window: props.window }));
+      return () => {
+        if (slots.default)
+          return vueDemi.h(props.as || "div", { ref: target }, slots.default(data));
+      };
+    }
   });
 
   const UseElementSize = vueDemi.defineComponent({
-      name: 'UseElementSize',
-      props: ['width', 'height', 'box'],
-      setup(props, { slots }) {
-          const target = vueDemi.ref();
-          const data = vueDemi.reactive(core.useElementSize(target, { width: props.width, height: props.height }, { box: props.box }));
-          return () => {
-              if (slots.default)
-                  return vueDemi.h(props.as || 'div', { ref: target }, slots.default(data));
-          };
-      },
+    name: "UseElementSize",
+    props: ["width", "height", "box"],
+    setup(props, { slots }) {
+      const target = vueDemi.ref();
+      const data = vueDemi.reactive(core.useElementSize(target, { width: props.width, height: props.height }, { box: props.box }));
+      return () => {
+        if (slots.default)
+          return vueDemi.h(props.as || "div", { ref: target }, slots.default(data));
+      };
+    }
   });
 
   const UseElementVisibility = vueDemi.defineComponent({
-      name: 'UseElementVisibility',
-      as: ['as'],
-      setup(props, { slots }) {
-          const target = vueDemi.ref();
-          const data = vueDemi.reactive({
-              isVisible: core.useElementVisibility(target),
-          });
-          return () => {
-              if (slots.default)
-                  return vueDemi.h(props.as || 'div', { ref: target }, slots.default(data));
-          };
-      },
+    name: "UseElementVisibility",
+    as: ["as"],
+    setup(props, { slots }) {
+      const target = vueDemi.ref();
+      const data = vueDemi.reactive({
+        isVisible: core.useElementVisibility(target)
+      });
+      return () => {
+        if (slots.default)
+          return vueDemi.h(props.as || "div", { ref: target }, slots.default(data));
+      };
+    }
   });
 
   const UseFullscreen = vueDemi.defineComponent({
-      name: 'UseFullscreen',
-      props: ['as'],
-      setup(props, { slots }) {
-          const target = vueDemi.ref();
-          const data = vueDemi.reactive(core.useFullscreen(target));
-          return () => {
-              if (slots.default)
-                  return vueDemi.h(props.as || 'div', { ref: target }, slots.default(data));
-          };
-      },
+    name: "UseFullscreen",
+    props: ["as"],
+    setup(props, { slots }) {
+      const target = vueDemi.ref();
+      const data = vueDemi.reactive(core.useFullscreen(target));
+      return () => {
+        if (slots.default)
+          return vueDemi.h(props.as || "div", { ref: target }, slots.default(data));
+      };
+    }
   });
 
   const UseGeolocation = vueDemi.defineComponent({
-      name: 'UseGeolocation',
-      props: ['enableHighAccuracy', 'maximumAge', 'timeout', 'navigator'],
-      setup(props, { slots }) {
-          const data = vueDemi.reactive(core.useGeolocation(props));
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseGeolocation",
+    props: ["enableHighAccuracy", "maximumAge", "timeout", "navigator"],
+    setup(props, { slots }) {
+      const data = vueDemi.reactive(core.useGeolocation(props));
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
   const UseIdle = vueDemi.defineComponent({
-      name: 'UseIdle',
-      props: ['timeout', 'events', 'listenForVisibilityChange', 'initialState'],
-      setup(props, { slots }) {
-          const data = vueDemi.reactive(core.useIdle(props.timeout, props));
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseIdle",
+    props: ["timeout", "events", "listenForVisibilityChange", "initialState"],
+    setup(props, { slots }) {
+      const data = vueDemi.reactive(core.useIdle(props.timeout, props));
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
   const UseMouse = vueDemi.defineComponent({
-      name: 'UseMouse',
-      props: ['touch', 'resetOnTouchEnds', 'initialValue'],
-      setup(props, { slots }) {
-          const data = vueDemi.reactive(core.useMouse(props));
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseMouse",
+    props: ["touch", "resetOnTouchEnds", "initialValue"],
+    setup(props, { slots }) {
+      const data = vueDemi.reactive(core.useMouse(props));
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
   const UseMouseInElement = vueDemi.defineComponent({
-      name: 'UseMouseElement',
-      props: ['handleOutside', 'as'],
-      setup(props, { slots }) {
-          const target = vueDemi.ref();
-          const data = vueDemi.reactive(core.useMouseInElement(target, props));
-          return () => {
-              if (slots.default)
-                  return vueDemi.h(props.as || 'div', { ref: target }, slots.default(data));
-          };
-      },
+    name: "UseMouseElement",
+    props: ["handleOutside", "as"],
+    setup(props, { slots }) {
+      const target = vueDemi.ref();
+      const data = vueDemi.reactive(core.useMouseInElement(target, props));
+      return () => {
+        if (slots.default)
+          return vueDemi.h(props.as || "div", { ref: target }, slots.default(data));
+      };
+    }
   });
 
+  var __defProp$5 = Object.defineProperty;
+  var __defProps$4 = Object.defineProperties;
+  var __getOwnPropDescs$4 = Object.getOwnPropertyDescriptors;
+  var __getOwnPropSymbols$5 = Object.getOwnPropertySymbols;
+  var __hasOwnProp$5 = Object.prototype.hasOwnProperty;
+  var __propIsEnum$5 = Object.prototype.propertyIsEnumerable;
+  var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+  var __spreadValues$5 = (a, b) => {
+    for (var prop in b || (b = {}))
+      if (__hasOwnProp$5.call(b, prop))
+        __defNormalProp$5(a, prop, b[prop]);
+    if (__getOwnPropSymbols$5)
+      for (var prop of __getOwnPropSymbols$5(b)) {
+        if (__propIsEnum$5.call(b, prop))
+          __defNormalProp$5(a, prop, b[prop]);
+      }
+    return a;
+  };
+  var __spreadProps$4 = (a, b) => __defProps$4(a, __getOwnPropDescs$4(b));
   const UseMousePressed = vueDemi.defineComponent({
-      name: 'UseMousePressed',
-      props: ['touch', 'initialValue', 'as'],
-      setup(props, { slots }) {
-          const target = vueDemi.ref();
-          const data = vueDemi.reactive(core.useMousePressed(Object.assign(Object.assign({}, props), { target })));
-          return () => {
-              if (slots.default)
-                  return vueDemi.h(props.as || 'div', { ref: target }, slots.default(data));
-          };
-      },
+    name: "UseMousePressed",
+    props: ["touch", "initialValue", "as"],
+    setup(props, { slots }) {
+      const target = vueDemi.ref();
+      const data = vueDemi.reactive(core.useMousePressed(__spreadProps$4(__spreadValues$5({}, props), { target })));
+      return () => {
+        if (slots.default)
+          return vueDemi.h(props.as || "div", { ref: target }, slots.default(data));
+      };
+    }
   });
 
   const UseNetwork = vueDemi.defineComponent({
-      name: 'UseNetwork',
-      setup(props, { slots }) {
-          const data = vueDemi.reactive(core.useNetwork());
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseNetwork",
+    setup(props, { slots }) {
+      const data = vueDemi.reactive(core.useNetwork());
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
+  var __defProp$4 = Object.defineProperty;
+  var __defProps$3 = Object.defineProperties;
+  var __getOwnPropDescs$3 = Object.getOwnPropertyDescriptors;
+  var __getOwnPropSymbols$4 = Object.getOwnPropertySymbols;
+  var __hasOwnProp$4 = Object.prototype.hasOwnProperty;
+  var __propIsEnum$4 = Object.prototype.propertyIsEnumerable;
+  var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+  var __spreadValues$4 = (a, b) => {
+    for (var prop in b || (b = {}))
+      if (__hasOwnProp$4.call(b, prop))
+        __defNormalProp$4(a, prop, b[prop]);
+    if (__getOwnPropSymbols$4)
+      for (var prop of __getOwnPropSymbols$4(b)) {
+        if (__propIsEnum$4.call(b, prop))
+          __defNormalProp$4(a, prop, b[prop]);
+      }
+    return a;
+  };
+  var __spreadProps$3 = (a, b) => __defProps$3(a, __getOwnPropDescs$3(b));
   const UseNow = vueDemi.defineComponent({
-      name: 'UseNow',
-      props: ['interval'],
-      setup(props, { slots }) {
-          const data = vueDemi.reactive(core.useNow(Object.assign(Object.assign({}, props), { controls: true })));
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseNow",
+    props: ["interval"],
+    setup(props, { slots }) {
+      const data = vueDemi.reactive(core.useNow(__spreadProps$3(__spreadValues$4({}, props), { controls: true })));
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
   const UseOnline = vueDemi.defineComponent({
-      name: 'UseOnline',
-      setup(props, { slots }) {
-          const data = vueDemi.reactive({
-              isOnline: core.useOnline(),
-          });
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseOnline",
+    setup(props, { slots }) {
+      const data = vueDemi.reactive({
+        isOnline: core.useOnline()
+      });
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
   const UsePageLeave = vueDemi.defineComponent({
-      name: 'UsePageLeave',
-      setup(props, { slots }) {
-          const data = vueDemi.reactive({
-              isLeft: core.usePageLeave(),
-          });
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UsePageLeave",
+    setup(props, { slots }) {
+      const data = vueDemi.reactive({
+        isLeft: core.usePageLeave()
+      });
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
+  var __defProp$3 = Object.defineProperty;
+  var __defProps$2 = Object.defineProperties;
+  var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
+  var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
+  var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
+  var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
+  var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+  var __spreadValues$3 = (a, b) => {
+    for (var prop in b || (b = {}))
+      if (__hasOwnProp$3.call(b, prop))
+        __defNormalProp$3(a, prop, b[prop]);
+    if (__getOwnPropSymbols$3)
+      for (var prop of __getOwnPropSymbols$3(b)) {
+        if (__propIsEnum$3.call(b, prop))
+          __defNormalProp$3(a, prop, b[prop]);
+      }
+    return a;
+  };
+  var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
   const UsePointer = vueDemi.defineComponent({
-      name: 'UsePointer',
-      props: [
-          'pointerTypes',
-          'initialValue',
-          'target',
-      ],
-      setup(props, { slots }) {
-          const el = vueDemi.ref(null);
-          const data = vueDemi.reactive(core.usePointer(Object.assign(Object.assign({}, props), { target: props.target === 'self' ? el : defaultWindow })));
-          return () => {
-              if (slots.default)
-                  return slots.default(data, { ref: el });
-          };
-      },
+    name: "UsePointer",
+    props: [
+      "pointerTypes",
+      "initialValue",
+      "target"
+    ],
+    setup(props, { slots }) {
+      const el = vueDemi.ref(null);
+      const data = vueDemi.reactive(core.usePointer(__spreadProps$2(__spreadValues$3({}, props), {
+        target: props.target === "self" ? el : defaultWindow
+      })));
+      return () => {
+        if (slots.default)
+          return slots.default(data, { ref: el });
+      };
+    }
   });
 
   const UsePreferredColorScheme = vueDemi.defineComponent({
-      name: 'UsePreferredColorScheme',
-      setup(props, { slots }) {
-          const data = vueDemi.reactive({
-              colorScheme: core.usePreferredColorScheme(),
-          });
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UsePreferredColorScheme",
+    setup(props, { slots }) {
+      const data = vueDemi.reactive({
+        colorScheme: core.usePreferredColorScheme()
+      });
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
   const UsePreferredDark = vueDemi.defineComponent({
-      name: 'UsePreferredDark',
-      setup(props, { slots }) {
-          const data = vueDemi.reactive({
-              prefersDark: core.usePreferredDark(),
-          });
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UsePreferredDark",
+    setup(props, { slots }) {
+      const data = vueDemi.reactive({
+        prefersDark: core.usePreferredDark()
+      });
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
   const UsePreferredLanguages = vueDemi.defineComponent({
-      name: 'UsePreferredLanguages',
-      setup(props, { slots }) {
-          const data = vueDemi.reactive({
-              languages: core.usePreferredLanguages(),
-          });
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UsePreferredLanguages",
+    setup(props, { slots }) {
+      const data = vueDemi.reactive({
+        languages: core.usePreferredLanguages()
+      });
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
+  var __defProp$2 = Object.defineProperty;
+  var __defProps$1 = Object.defineProperties;
+  var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
+  var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
+  var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
+  var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
+  var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+  var __spreadValues$2 = (a, b) => {
+    for (var prop in b || (b = {}))
+      if (__hasOwnProp$2.call(b, prop))
+        __defNormalProp$2(a, prop, b[prop]);
+    if (__getOwnPropSymbols$2)
+      for (var prop of __getOwnPropSymbols$2(b)) {
+        if (__propIsEnum$2.call(b, prop))
+          __defNormalProp$2(a, prop, b[prop]);
+      }
+    return a;
+  };
+  var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
   const UseTimeAgo = vueDemi.defineComponent({
-      name: 'UseTimeAgo',
-      props: ['time', 'updateInterval', 'max', 'fullDateFormatter', 'messages'],
-      setup(props, { slots }) {
-          const { time } = vueDemi.toRefs(props);
-          const data = vueDemi.reactive(core.useTimeAgo(time, Object.assign(Object.assign({}, props), { controls: true })));
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseTimeAgo",
+    props: ["time", "updateInterval", "max", "fullDateFormatter", "messages"],
+    setup(props, { slots }) {
+      const { time } = vueDemi.toRefs(props);
+      const data = vueDemi.reactive(core.useTimeAgo(time, __spreadProps$1(__spreadValues$2({}, props), { controls: true })));
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
+  var __defProp$1 = Object.defineProperty;
+  var __defProps = Object.defineProperties;
+  var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+  var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
+  var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
+  var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
+  var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+  var __spreadValues$1 = (a, b) => {
+    for (var prop in b || (b = {}))
+      if (__hasOwnProp$1.call(b, prop))
+        __defNormalProp$1(a, prop, b[prop]);
+    if (__getOwnPropSymbols$1)
+      for (var prop of __getOwnPropSymbols$1(b)) {
+        if (__propIsEnum$1.call(b, prop))
+          __defNormalProp$1(a, prop, b[prop]);
+      }
+    return a;
+  };
+  var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
   const UseTimestamp = vueDemi.defineComponent({
-      name: 'UseTimestamp',
-      props: ['interval', 'offset'],
-      setup(props, { slots }) {
-          const data = vueDemi.reactive(core.useTimestamp(Object.assign(Object.assign({}, props), { controls: true })));
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseTimestamp",
+    props: ["interval", "offset"],
+    setup(props, { slots }) {
+      const data = vueDemi.reactive(core.useTimestamp(__spreadProps(__spreadValues$1({}, props), { controls: true })));
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
+  var __defProp = Object.defineProperty;
+  var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+  var __hasOwnProp = Object.prototype.hasOwnProperty;
+  var __propIsEnum = Object.prototype.propertyIsEnumerable;
+  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+  var __spreadValues = (a, b) => {
+    for (var prop in b || (b = {}))
+      if (__hasOwnProp.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    if (__getOwnPropSymbols)
+      for (var prop of __getOwnPropSymbols(b)) {
+        if (__propIsEnum.call(b, prop))
+          __defNormalProp(a, prop, b[prop]);
+      }
+    return a;
+  };
   const UseVirtualList = vueDemi.defineComponent({
-      name: 'UseVirtualList',
-      props: [
-          'list',
-          'options',
-          'height',
-      ],
-      setup(props, { slots }) {
-          const { list, containerProps, wrapperProps } = core.useVirtualList(props.list, props.options);
-          containerProps.style.height = props.height || '300px';
-          return () => vueDemi.h('div', Object.assign({}, containerProps), [
-              vueDemi.h('div', Object.assign({}, wrapperProps.value), list.value.map((item) => vueDemi.h('div', { style: { overFlow: 'hidden', height: item.height } }, slots.default ? slots.default(item) : 'Please set content!'))),
-          ]);
-      },
+    name: "UseVirtualList",
+    props: [
+      "list",
+      "options",
+      "height"
+    ],
+    setup(props, { slots }) {
+      const { list, containerProps, wrapperProps } = core.useVirtualList(props.list, props.options);
+      containerProps.style.height = props.height || "300px";
+      return () => vueDemi.h("div", __spreadValues({}, containerProps), [
+        vueDemi.h("div", __spreadValues({}, wrapperProps.value), list.value.map((item) => vueDemi.h("div", { style: { overFlow: "hidden", height: item.height } }, slots.default ? slots.default(item) : "Please set content!")))
+      ]);
+    }
   });
 
   const UseWindowFocus = vueDemi.defineComponent({
-      name: 'UseWindowFocus',
-      setup(props, { slots }) {
-          const data = vueDemi.reactive({
-              focused: core.useWindowFocus(),
-          });
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseWindowFocus",
+    setup(props, { slots }) {
+      const data = vueDemi.reactive({
+        focused: core.useWindowFocus()
+      });
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
 
   const UseWindowSize = vueDemi.defineComponent({
-      name: 'UseWindowSize',
-      props: ['initialWidth', 'initialHeight'],
-      setup(props, { slots }) {
-          const data = vueDemi.reactive(core.useWindowSize(props));
-          return () => {
-              if (slots.default)
-                  return slots.default(data);
-          };
-      },
+    name: "UseWindowSize",
+    props: ["initialWidth", "initialHeight"],
+    setup(props, { slots }) {
+      const data = vueDemi.reactive(core.useWindowSize(props));
+      return () => {
+        if (slots.default)
+          return slots.default(data);
+      };
+    }
   });
@@ -616,2 +731,2 @@
 
-}(this.VueUse = this.VueUse || {}, VueDemi, VueUse, VueUse));
+})(this.VueUse = this.VueUse || {}, VueDemi, VueUse, VueUse);

index.iife.min.js

@@ -1,1 +0,1 @@
-!function(e){if(!e.VueDemi){var t={},s=e.Vue;if(s)if("2."===s.version.slice(0,2)){var n=e.VueCompositionAPI;if(n){for(var i in n)t[i]=n[i];t.isVue2=!0,t.isVue3=!1,t.install=function(){},t.Vue=s,t.Vue2=s,t.version=s.version}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.")}else if("3."===s.version.slice(0,2)){for(var i in s)t[i]=s[i];t.isVue2=!1,t.isVue3=!0,t.install=function(){},t.Vue=s,t.Vue2=void 0,t.version=s.version,t.set=function(e,t,s){return Array.isArray(e)?(e.length=Math.max(e.length,t),e.splice(t,1,s),s):(e[t]=s,s)},t.del=function(e,t){Array.isArray(e)?e.splice(t,1):delete e[t]}}else console.error("[vue-demi] Vue version "+s.version+" is unsupported.");else console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`.");e.VueDemi=t}}(window),function(e,t,s,n){"use strict";const i=t.defineComponent({name:"OnClickOutside",props:["as"],emits:["trigger"],setup(e,{slots:n,emit:i}){const r=t.ref();return s.onClickOutside(r,(e=>{i("trigger",e)})),()=>{if(n.default)return t.h(e.as||"div",{ref:r},n.default())}}});const r=n.isClient?window:void 0;function o(e,s,i={}){const{window:o=r,event:u="pointerdown"}=i;if(!o)return;return function(...e){let s,i,o,u;if(n.isString(e[0])?([i,o,u]=e,s=r):[s,i,o,u]=e,!s)return n.noop;let a=n.noop;const l=t.watch((()=>t.unref(s)),(e=>{a(),e&&(e.addEventListener(i,o,u),a=()=>{e.removeEventListener(i,o,u),a=n.noop})}),{immediate:!0,flush:"post"}),f=()=>{l(),a()};return n.tryOnScopeDispose(f),f}(o,u,(n=>{const i=function(e){var s,n;const i=t.unref(e);return null!==(n=null===(s=i)||void 0===s?void 0:s.$el)&&void 0!==n?n:i}(e);i&&(i===n.target||n.composedPath().includes(i)||s(n))}),{passive:!0})}const u=t.defineComponent({name:"UseActiveElement",setup(e,{slots:n}){const i=t.reactive({element:s.useActiveElement()});return()=>{if(n.default)return n.default(i)}}}),a=t.defineComponent({name:"UseBattery",setup(e,{slots:n}){const i=t.reactive(s.useBattery(e));return()=>{if(n.default)return n.default(i)}}}),l=t.defineComponent({name:"UseBrowserLocation",setup(e,{slots:n}){const i=t.reactive(s.useBrowserLocation());return()=>{if(n.default)return n.default(i)}}}),f=t.defineComponent({name:"UseDark",props:["selector","attribute","valueDark","valueLight","onChanged","storageKey","storage"],setup(e,{slots:i}){const r=s.useDark(e),o=t.reactive({isDark:r,toggleDark:n.useToggle(r)});return()=>{if(i.default)return i.default(o)}}}),d=t.defineComponent({name:"UseDeviceMotion",setup(e,{slots:n}){const i=t.reactive(s.useDeviceMotion());return()=>{if(n.default)return n.default(i)}}}),c=t.defineComponent({name:"UseDeviceOrientation",setup(e,{slots:n}){const i=t.reactive(s.useDeviceOrientation());return()=>{if(n.default)return n.default(i)}}}),p=t.defineComponent({name:"UseDevicePixelRatio",setup(e,{slots:n}){const i=t.reactive({pixelRatio:s.useDevicePixelRatio()});return()=>{if(n.default)return n.default(i)}}}),m=t.defineComponent({name:"UseDevicesList",props:["onUpdated","requestPermissions"],setup(e,{slots:n}){const i=t.reactive(s.useDevicesList(e));return()=>{if(n.default)return n.default(i)}}}),v=t.defineComponent({name:"UseDocumentVisibility",setup(e,{slots:n}){const i=t.reactive({visibility:s.useDocumentVisibility()});return()=>{if(n.default)return n.default(i)}}}),g=t.defineComponent({name:"UseDraggable",props:["storageKey","initialValue","exact","preventDefault","pointerTypes","as"],setup(e,{slots:n}){const i=t.ref(),r=e.storageKey?s.useStorage(e.storageKey,t.unref(e.initialValue)||{x:0,y:0},"session"===e.storageType?sessionStorage:localStorage):e.initialValue||{x:0,y:0},o=t.reactive(s.useDraggable(i,Object.assign(Object.assign({},e),{initialValue:r})));return()=>{if(n.default)return t.h(e.as||"div",{ref:i,style:`touch-action:none;${o.style}`},n.default(o))}}}),U=t.defineComponent({name:"UseElementBounding",props:["box","as"],setup(e,{slots:n}){const i=t.ref(),r=t.reactive(s.useElementBounding(i,{box:e.box,window:e.window}));return()=>{if(n.default)return t.h(e.as||"div",{ref:i},n.default(r))}}}),h=t.defineComponent({name:"UseElementSize",props:["width","height","box"],setup(e,{slots:n}){const i=t.ref(),r=t.reactive(s.useElementSize(i,{width:e.width,height:e.height},{box:e.box}));return()=>{if(n.default)return t.h(e.as||"div",{ref:i},n.default(r))}}}),C=t.defineComponent({name:"UseElementVisibility",as:["as"],setup(e,{slots:n}){const i=t.ref(),r=t.reactive({isVisible:s.useElementVisibility(i)});return()=>{if(n.default)return t.h(e.as||"div",{ref:i},n.default(r))}}}),b=t.defineComponent({name:"UseFullscreen",props:["as"],setup(e,{slots:n}){const i=t.ref(),r=t.reactive(s.useFullscreen(i));return()=>{if(n.default)return t.h(e.as||"div",{ref:i},n.default(r))}}}),V=t.defineComponent({name:"UseGeolocation",props:["enableHighAccuracy","maximumAge","timeout","navigator"],setup(e,{slots:n}){const i=t.reactive(s.useGeolocation(e));return()=>{if(n.default)return n.default(i)}}}),D=t.defineComponent({name:"UseIdle",props:["timeout","events","listenForVisibilityChange","initialState"],setup(e,{slots:n}){const i=t.reactive(s.useIdle(e.timeout,e));return()=>{if(n.default)return n.default(i)}}}),w=t.defineComponent({name:"UseMouse",props:["touch","resetOnTouchEnds","initialValue"],setup(e,{slots:n}){const i=t.reactive(s.useMouse(e));return()=>{if(n.default)return n.default(i)}}}),O=t.defineComponent({name:"UseMouseElement",props:["handleOutside","as"],setup(e,{slots:n}){const i=t.ref(),r=t.reactive(s.useMouseInElement(i,e));return()=>{if(n.default)return t.h(e.as||"div",{ref:i},n.default(r))}}}),y=t.defineComponent({name:"UseMousePressed",props:["touch","initialValue","as"],setup(e,{slots:n}){const i=t.ref(),r=t.reactive(s.useMousePressed(Object.assign(Object.assign({},e),{target:i})));return()=>{if(n.default)return t.h(e.as||"div",{ref:i},n.default(r))}}}),P=t.defineComponent({name:"UseNetwork",setup(e,{slots:n}){const i=t.reactive(s.useNetwork());return()=>{if(n.default)return n.default(i)}}}),L=t.defineComponent({name:"UseNow",props:["interval"],setup(e,{slots:n}){const i=t.reactive(s.useNow(Object.assign(Object.assign({},e),{controls:!0})));return()=>{if(n.default)return n.default(i)}}}),E=t.defineComponent({name:"UseOnline",setup(e,{slots:n}){const i=t.reactive({isOnline:s.useOnline()});return()=>{if(n.default)return n.default(i)}}}),k=t.defineComponent({name:"UsePageLeave",setup(e,{slots:n}){const i=t.reactive({isLeft:s.usePageLeave()});return()=>{if(n.default)return n.default(i)}}}),x=t.defineComponent({name:"UsePointer",props:["pointerTypes","initialValue","target"],setup(e,{slots:n}){const i=t.ref(null),o=t.reactive(s.usePointer(Object.assign(Object.assign({},e),{target:"self"===e.target?i:r})));return()=>{if(n.default)return n.default(o,{ref:i})}}}),S=t.defineComponent({name:"UsePreferredColorScheme",setup(e,{slots:n}){const i=t.reactive({colorScheme:s.usePreferredColorScheme()});return()=>{if(n.default)return n.default(i)}}}),j=t.defineComponent({name:"UsePreferredDark",setup(e,{slots:n}){const i=t.reactive({prefersDark:s.usePreferredDark()});return()=>{if(n.default)return n.default(i)}}}),A=t.defineComponent({name:"UsePreferredLanguages",setup(e,{slots:n}){const i=t.reactive({languages:s.usePreferredLanguages()});return()=>{if(n.default)return n.default(i)}}}),M=t.defineComponent({name:"UseTimeAgo",props:["time","updateInterval","max","fullDateFormatter","messages"],setup(e,{slots:n}){const{time:i}=t.toRefs(e),r=t.reactive(s.useTimeAgo(i,Object.assign(Object.assign({},e),{controls:!0})));return()=>{if(n.default)return n.default(r)}}}),T=t.defineComponent({name:"UseTimestamp",props:["interval","offset"],setup(e,{slots:n}){const i=t.reactive(s.useTimestamp(Object.assign(Object.assign({},e),{controls:!0})));return()=>{if(n.default)return n.default(i)}}}),B=t.defineComponent({name:"UseVirtualList",props:["list","options","height"],setup(e,{slots:n}){const{list:i,containerProps:r,wrapperProps:o}=s.useVirtualList(e.list,e.options);return r.style.height=e.height||"300px",()=>t.h("div",Object.assign({},r),[t.h("div",Object.assign({},o.value),i.value.map((e=>t.h("div",{style:{overFlow:"hidden",height:e.height}},n.default?n.default(e):"Please set content!"))))])}}),F=t.defineComponent({name:"UseWindowFocus",setup(e,{slots:n}){const i=t.reactive({focused:s.useWindowFocus()});return()=>{if(n.default)return n.default(i)}}}),I=t.defineComponent({name:"UseWindowSize",props:["initialWidth","initialHeight"],setup(e,{slots:n}){const i=t.reactive(s.useWindowSize(e));return()=>{if(n.default)return n.default(i)}}});e.OnClickOutside=i,e.UseActiveElement=u,e.UseBattery=a,e.UseBrowserLocation=l,e.UseDark=f,e.UseDeviceMotion=d,e.UseDeviceOrientation=c,e.UseDevicePixelRatio=p,e.UseDevicesList=m,e.UseDocumentVisibility=v,e.UseDraggable=g,e.UseElementBounding=U,e.UseElementSize=h,e.UseElementVisibility=C,e.UseFullscreen=b,e.UseGeolocation=V,e.UseIdle=D,e.UseMouse=w,e.UseMouseInElement=O,e.UseMousePressed=y,e.UseNetwork=P,e.UseNow=L,e.UseOnline=E,e.UsePageLeave=k,e.UsePointer=x,e.UsePreferredColorScheme=S,e.UsePreferredDark=j,e.UsePreferredLanguages=A,e.UseTimeAgo=M,e.UseTimestamp=T,e.UseVirtualList=B,e.UseWindowFocus=F,e.UseWindowSize=I,e.VOnClickOutside=(e,t)=>{o(e,t.value)},Object.defineProperty(e,"__esModule",{value:!0})}(this.VueUse=this.VueUse||{},VueDemi,VueUse,VueUse);
+(function(s){if(!s.VueDemi){var n={},a=s.Vue;if(a)if(a.version.slice(0,2)==="2."){var u=s.VueCompositionAPI;if(u){for(var c in u)n[c]=u[c];n.isVue2=!0,n.isVue3=!1,n.install=function(){},n.Vue=a,n.Vue2=a,n.version=a.version}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.")}else if(a.version.slice(0,2)==="3."){for(var c in a)n[c]=a[c];n.isVue2=!1,n.isVue3=!0,n.install=function(){},n.Vue=a,n.Vue2=void 0,n.version=a.version,n.set=function(f,l,p){return Array.isArray(f)?(f.length=Math.max(f.length,l),f.splice(l,1,p),p):(f[l]=p,p)},n.del=function(f,l){if(Array.isArray(f)){f.splice(l,1);return}delete f[l]}}else console.error("[vue-demi] Vue version "+a.version+" is unsupported.");else console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`.");s.VueDemi=n}})(window),function(s,n,a,u){"use strict";const c=n.defineComponent({name:"OnClickOutside",props:["as"],emits:["trigger"],setup(r,{slots:e,emit:t}){const o=n.ref();return a.onClickOutside(o,i=>{t("trigger",i)}),()=>{if(e.default)return n.h(r.as||"div",{ref:o},e.default())}}});function f(r){var e;const t=n.unref(r);return(e=t==null?void 0:t.$el)!=null?e:t}const l=u.isClient?window:void 0;function p(...r){let e,t,o,i;if(u.isString(r[0])?([t,o,i]=r,e=l):[e,t,o,i]=r,!e)return u.noop;let d=u.noop;const P=n.watch(()=>n.unref(e),O=>{d(),!!O&&(O.addEventListener(t,o,i),d=()=>{O.removeEventListener(t,o,i),d=u.noop})},{immediate:!0,flush:"post"}),_=()=>{P(),d()};return u.tryOnScopeDispose(_),_}function I(r,e,t={}){const{window:o=l,event:i="pointerdown"}=t;return o?p(o,i,P=>{const _=f(r);!_||_===P.target||P.composedPath().includes(_)||e(P)},{passive:!0}):void 0}const M=(r,e)=>{I(r,e.value)},N=n.defineComponent({name:"UseActiveElement",setup(r,{slots:e}){const t=n.reactive({element:a.useActiveElement()});return()=>{if(e.default)return e.default(t)}}}),A=n.defineComponent({name:"UseBattery",setup(r,{slots:e}){const t=n.reactive(a.useBattery(r));return()=>{if(e.default)return e.default(t)}}}),T=n.defineComponent({name:"UseBrowserLocation",setup(r,{slots:e}){const t=n.reactive(a.useBrowserLocation());return()=>{if(e.default)return e.default(t)}}}),B=n.defineComponent({name:"UseDark",props:["selector","attribute","valueDark","valueLight","onChanged","storageKey","storage"],setup(r,{slots:e}){const t=a.useDark(r),o=n.reactive({isDark:t,toggleDark:u.useToggle(t)});return()=>{if(e.default)return e.default(o)}}}),F=n.defineComponent({name:"UseDeviceMotion",setup(r,{slots:e}){const t=n.reactive(a.useDeviceMotion());return()=>{if(e.default)return e.default(t)}}}),W=n.defineComponent({name:"UseDeviceOrientation",setup(r,{slots:e}){const t=n.reactive(a.useDeviceOrientation());return()=>{if(e.default)return e.default(t)}}}),z=n.defineComponent({name:"UseDevicePixelRatio",setup(r,{slots:e}){const t=n.reactive({pixelRatio:a.useDevicePixelRatio()});return()=>{if(e.default)return e.default(t)}}}),k=n.defineComponent({name:"UseDevicesList",props:["onUpdated","requestPermissions"],setup(r,{slots:e}){const t=n.reactive(a.useDevicesList(r));return()=>{if(e.default)return e.default(t)}}}),R=n.defineComponent({name:"UseDocumentVisibility",setup(r,{slots:e}){const t=n.reactive({visibility:a.useDocumentVisibility()});return()=>{if(e.default)return e.default(t)}}});var G=Object.defineProperty,K=Object.defineProperties,H=Object.getOwnPropertyDescriptors,g=Object.getOwnPropertySymbols,q=Object.prototype.hasOwnProperty,J=Object.prototype.propertyIsEnumerable,U=(r,e,t)=>e in r?G(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,Q=(r,e)=>{for(var t in e||(e={}))q.call(e,t)&&U(r,t,e[t]);if(g)for(var t of g(e))J.call(e,t)&&U(r,t,e[t]);return r},X=(r,e)=>K(r,H(e));const Y=n.defineComponent({name:"UseDraggable",props:["storageKey","initialValue","exact","preventDefault","pointerTypes","as"],setup(r,{slots:e}){const t=n.ref(),o=r.storageKey?a.useStorage(r.storageKey,n.unref(r.initialValue)||{x:0,y:0},a.isClient?r.storageType==="session"?sessionStorage:localStorage:void 0):r.initialValue||{x:0,y:0},i=n.reactive(a.useDraggable(t,X(Q({},r),{initialValue:o})));return()=>{if(e.default)return n.h(r.as||"div",{ref:t,style:`touch-action:none;${i.style}`},e.default(i))}}}),Z=n.defineComponent({name:"UseElementBounding",props:["box","as"],setup(r,{slots:e}){const t=n.ref(),o=n.reactive(a.useElementBounding(t,{box:r.box,window:r.window}));return()=>{if(e.default)return n.h(r.as||"div",{ref:t},e.default(o))}}}),x=n.defineComponent({name:"UseElementSize",props:["width","height","box"],setup(r,{slots:e}){const t=n.ref(),o=n.reactive(a.useElementSize(t,{width:r.width,height:r.height},{box:r.box}));return()=>{if(e.default)return n.h(r.as||"div",{ref:t},e.default(o))}}}),D=n.defineComponent({name:"UseElementVisibility",as:["as"],setup(r,{slots:e}){const t=n.ref(),o=n.reactive({isVisible:a.useElementVisibility(t)});return()=>{if(e.default)return n.h(r.as||"div",{ref:t},e.default(o))}}}),ee=n.defineComponent({name:"UseFullscreen",props:["as"],setup(r,{slots:e}){const t=n.ref(),o=n.reactive(a.useFullscreen(t));return()=>{if(e.default)return n.h(r.as||"div",{ref:t},e.default(o))}}}),te=n.defineComponent({name:"UseGeolocation",props:["enableHighAccuracy","maximumAge","timeout","navigator"],setup(r,{slots:e}){const t=n.reactive(a.useGeolocation(r));return()=>{if(e.default)return e.default(t)}}}),re=n.defineComponent({name:"UseIdle",props:["timeout","events","listenForVisibilityChange","initialState"],setup(r,{slots:e}){const t=n.reactive(a.useIdle(r.timeout,r));return()=>{if(e.default)return e.default(t)}}}),ne=n.defineComponent({name:"UseMouse",props:["touch","resetOnTouchEnds","initialValue"],setup(r,{slots:e}){const t=n.reactive(a.useMouse(r));return()=>{if(e.default)return e.default(t)}}}),ae=n.defineComponent({name:"UseMouseElement",props:["handleOutside","as"],setup(r,{slots:e}){const t=n.ref(),o=n.reactive(a.useMouseInElement(t,r));return()=>{if(e.default)return n.h(r.as||"div",{ref:t},e.default(o))}}});var se=Object.defineProperty,oe=Object.defineProperties,ie=Object.getOwnPropertyDescriptors,m=Object.getOwnPropertySymbols,ue=Object.prototype.hasOwnProperty,fe=Object.prototype.propertyIsEnumerable,v=(r,e,t)=>e in r?se(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,le=(r,e)=>{for(var t in e||(e={}))ue.call(e,t)&&v(r,t,e[t]);if(m)for(var t of m(e))fe.call(e,t)&&v(r,t,e[t]);return r},de=(r,e)=>oe(r,ie(e));const ce=n.defineComponent({name:"UseMousePressed",props:["touch","initialValue","as"],setup(r,{slots:e}){const t=n.ref(),o=n.reactive(a.useMousePressed(de(le({},r),{target:t})));return()=>{if(e.default)return n.h(r.as||"div",{ref:t},e.default(o))}}}),pe=n.defineComponent({name:"UseNetwork",setup(r,{slots:e}){const t=n.reactive(a.useNetwork());return()=>{if(e.default)return e.default(t)}}});var _e=Object.defineProperty,Pe=Object.defineProperties,Oe=Object.getOwnPropertyDescriptors,w=Object.getOwnPropertySymbols,ge=Object.prototype.hasOwnProperty,Ue=Object.prototype.propertyIsEnumerable,y=(r,e,t)=>e in r?_e(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,me=(r,e)=>{for(var t in e||(e={}))ge.call(e,t)&&y(r,t,e[t]);if(w)for(var t of w(e))Ue.call(e,t)&&y(r,t,e[t]);return r},ve=(r,e)=>Pe(r,Oe(e));const we=n.defineComponent({name:"UseNow",props:["interval"],setup(r,{slots:e}){const t=n.reactive(a.useNow(ve(me({},r),{controls:!0})));return()=>{if(e.default)return e.default(t)}}}),ye=n.defineComponent({name:"UseOnline",setup(r,{slots:e}){const t=n.reactive({isOnline:a.useOnline()});return()=>{if(e.default)return e.default(t)}}}),he=n.defineComponent({name:"UsePageLeave",setup(r,{slots:e}){const t=n.reactive({isLeft:a.usePageLeave()});return()=>{if(e.default)return e.default(t)}}});var be=Object.defineProperty,$e=Object.defineProperties,Ve=Object.getOwnPropertyDescriptors,h=Object.getOwnPropertySymbols,Ce=Object.prototype.hasOwnProperty,Ee=Object.prototype.propertyIsEnumerable,b=(r,e,t)=>e in r?be(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,Se=(r,e)=>{for(var t in e||(e={}))Ce.call(e,t)&&b(r,t,e[t]);if(h)for(var t of h(e))Ee.call(e,t)&&b(r,t,e[t]);return r},je=(r,e)=>$e(r,Ve(e));const Le=n.defineComponent({name:"UsePointer",props:["pointerTypes","initialValue","target"],setup(r,{slots:e}){const t=n.ref(null),o=n.reactive(a.usePointer(je(Se({},r),{target:r.target==="self"?t:l})));return()=>{if(e.default)return e.default(o,{ref:t})}}}),Ie=n.defineComponent({name:"UsePreferredColorScheme",setup(r,{slots:e}){const t=n.reactive({colorScheme:a.usePreferredColorScheme()});return()=>{if(e.default)return e.default(t)}}}),Me=n.defineComponent({name:"UsePreferredDark",setup(r,{slots:e}){const t=n.reactive({prefersDark:a.usePreferredDark()});return()=>{if(e.default)return e.default(t)}}}),Ne=n.defineComponent({name:"UsePreferredLanguages",setup(r,{slots:e}){const t=n.reactive({languages:a.usePreferredLanguages()});return()=>{if(e.default)return e.default(t)}}});var Ae=Object.defineProperty,Te=Object.defineProperties,Be=Object.getOwnPropertyDescriptors,$=Object.getOwnPropertySymbols,Fe=Object.prototype.hasOwnProperty,We=Object.prototype.propertyIsEnumerable,V=(r,e,t)=>e in r?Ae(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,ze=(r,e)=>{for(var t in e||(e={}))Fe.call(e,t)&&V(r,t,e[t]);if($)for(var t of $(e))We.call(e,t)&&V(r,t,e[t]);return r},ke=(r,e)=>Te(r,Be(e));const Re=n.defineComponent({name:"UseTimeAgo",props:["time","updateInterval","max","fullDateFormatter","messages"],setup(r,{slots:e}){const{time:t}=n.toRefs(r),o=n.reactive(a.useTimeAgo(t,ke(ze({},r),{controls:!0})));return()=>{if(e.default)return e.default(o)}}});var Ge=Object.defineProperty,Ke=Object.defineProperties,He=Object.getOwnPropertyDescriptors,C=Object.getOwnPropertySymbols,qe=Object.prototype.hasOwnProperty,Je=Object.prototype.propertyIsEnumerable,E=(r,e,t)=>e in r?Ge(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,Qe=(r,e)=>{for(var t in e||(e={}))qe.call(e,t)&&E(r,t,e[t]);if(C)for(var t of C(e))Je.call(e,t)&&E(r,t,e[t]);return r},Xe=(r,e)=>Ke(r,He(e));const Ye=n.defineComponent({name:"UseTimestamp",props:["interval","offset"],setup(r,{slots:e}){const t=n.reactive(a.useTimestamp(Xe(Qe({},r),{controls:!0})));return()=>{if(e.default)return e.default(t)}}});var Ze=Object.defineProperty,S=Object.getOwnPropertySymbols,xe=Object.prototype.hasOwnProperty,De=Object.prototype.propertyIsEnumerable,j=(r,e,t)=>e in r?Ze(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,L=(r,e)=>{for(var t in e||(e={}))xe.call(e,t)&&j(r,t,e[t]);if(S)for(var t of S(e))De.call(e,t)&&j(r,t,e[t]);return r};const et=n.defineComponent({name:"UseVirtualList",props:["list","options","height"],setup(r,{slots:e}){const{list:t,containerProps:o,wrapperProps:i}=a.useVirtualList(r.list,r.options);return o.style.height=r.height||"300px",()=>n.h("div",L({},o),[n.h("div",L({},i.value),t.value.map(d=>n.h("div",{style:{overFlow:"hidden",height:d.height}},e.default?e.default(d):"Please set content!")))])}}),tt=n.defineComponent({name:"UseWindowFocus",setup(r,{slots:e}){const t=n.reactive({focused:a.useWindowFocus()});return()=>{if(e.default)return e.default(t)}}}),rt=n.defineComponent({name:"UseWindowSize",props:["initialWidth","initialHeight"],setup(r,{slots:e}){const t=n.reactive(a.useWindowSize(r));return()=>{if(e.default)return e.default(t)}}});s.OnClickOutside=c,s.UseActiveElement=N,s.UseBattery=A,s.UseBrowserLocation=T,s.UseDark=B,s.UseDeviceMotion=F,s.UseDeviceOrientation=W,s.UseDevicePixelRatio=z,s.UseDevicesList=k,s.UseDocumentVisibility=R,s.UseDraggable=Y,s.UseElementBounding=Z,s.UseElementSize=x,s.UseElementVisibility=D,s.UseFullscreen=ee,s.UseGeolocation=te,s.UseIdle=re,s.UseMouse=ne,s.UseMouseInElement=ae,s.UseMousePressed=ce,s.UseNetwork=pe,s.UseNow=we,s.UseOnline=ye,s.UsePageLeave=he,s.UsePointer=Le,s.UsePreferredColorScheme=Ie,s.UsePreferredDark=Me,s.UsePreferredLanguages=Ne,s.UseTimeAgo=Re,s.UseTimestamp=Ye,s.UseVirtualList=et,s.UseWindowFocus=tt,s.UseWindowSize=rt,s.VOnClickOutside=M,Object.defineProperty(s,"__esModule",{value:!0})}(this.VueUse=this.VueUse||{},VueDemi,VueUse,VueUse);

package.json

 {
   "name": "@vueuse/components",
-  "version": "6.4.1",
+  "version": "6.5.3",
   "description": "Renderless components for VueUse",
@@ -34,6 +34,6 @@ "keywords": [
   "dependencies": {
-    "@vueuse/core": "6.4.1",
-    "@vueuse/shared": "6.4.1",
+    "@vueuse/core": "6.5.3",
+    "@vueuse/shared": "6.5.3",
     "vue-demi": "*"
   }
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

93737

increased by10.37%

Lines of code

2117

increased by8.18%

Dependency changes

• + Added@vueuse/core@6.5.3(transitive)

• + Added@vueuse/shared@6.5.3(transitive)

• - Removed@vueuse/core@6.4.1(transitive)

• - Removed@vueuse/shared@6.4.1(transitive)

• Updated@vueuse/core@6.5.3

• Updated@vueuse/shared@6.5.3