Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@vueuse/components

Package Overview
Dependencies
Maintainers
3
Versions
169
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@vueuse/components - npm Package Compare versions

Comparing version 7.3.0 to 7.4.0

105

index.d.ts
import * as vue_demi from 'vue-demi';
import { FunctionDirective } from 'vue-demi';
import { UseDarkOptions, UseDevicesListOptions, UseDraggableOptions, ElementSize, GeolocationOptions, IdleOptions, MouseOptions, MouseInElementOptions, MousePressedOptions, UseNowOptions, UsePointerOptions, TimeAgoOptions, TimestampOptions, UseVirtualListOptions, WindowSizeOptions } from '@vueuse/core';
import { MaybeRef } from '@vueuse/shared';
import { FunctionDirective, Ref } from 'vue-demi';
import { ConfigurableEventFilter, ConfigurableFlush, MaybeRef } from '@vueuse/shared';
import { UseDarkOptions, UseDevicesListOptions, UseDraggableOptions, ElementSize, GeolocationOptions, IdleOptions, MouseOptions, MouseInElementOptions, MousePressedOptions, UseNowOptions, UsePointerOptions, UseTimeAgoOptions, TimestampOptions, UseVirtualListOptions, WindowSizeOptions } from '@vueuse/core';

@@ -38,2 +38,97 @@ interface ConfigurableWindow {

declare type Serializer<T> = {
read(raw: string): T;
write(value: T): string;
};
interface StorageLike {
getItem(key: string): string | null;
setItem(key: string, value: string): void;
removeItem(key: string): void;
}
interface StorageOptions<T> extends ConfigurableEventFilter, ConfigurableWindow, ConfigurableFlush {
/**
* Watch for deep changes
*
* @default true
*/
deep?: boolean;
/**
* Listen to storage changes, useful for multiple tabs application
*
* @default true
*/
listenToStorageChanges?: boolean;
/**
* Write the default value to the storage when it does not existed
*
* @default true
*/
writeDefaults?: boolean;
/**
* Custom data serialization
*/
serializer?: Serializer<T>;
/**
* On error callback
*
* Default log error to `console.error`
*/
onError?: (error: unknown) => void;
/**
* Use shallow ref as reference
*
* @default false
*/
shallow?: boolean;
}
declare type BasicColorSchema = 'light' | 'dark' | 'auto';
interface UseColorModeOptions<T extends string = BasicColorSchema> extends StorageOptions<T | BasicColorSchema> {
/**
* CSS Selector for the target element applying to
*
* @default 'html'
*/
selector?: string;
/**
* HTML attribute applying the target element
*
* @default 'class'
*/
attribute?: string;
/**
* Prefix when adding value to the attribute
*/
modes?: Partial<Record<T | BasicColorSchema, string>>;
/**
* A custom handler for handle the updates.
* When specified, the default behavior will be overridded.
*
* @default undefined
*/
onChanged?: (mode: T | BasicColorSchema, defaultHandler: ((mode: T | BasicColorSchema) => void)) => void;
/**
* Custom storage ref
*
* When provided, `useStorage` will be skipped
*/
storageRef?: Ref<T | BasicColorSchema>;
/**
* Key to persist the data into localStorage/sessionStorage.
*
* Pass `null` to disable persistence
*
* @default 'vueuse-color-scheme'
*/
storageKey?: string | null;
/**
* Storage object, can be localStorage or sessionStorage
*
* @default localStorage
*/
storage?: StorageLike;
}
declare const UseColorMode: vue_demi.DefineComponent<UseColorModeOptions<BasicColorSchema>, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, vue_demi.EmitsOptions, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<UseColorModeOptions<BasicColorSchema>>, {}>;
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>, {}>;

@@ -171,3 +266,3 @@

interface UseTimeAgoComponentOptions extends Omit<TimeAgoOptions<true>, 'controls'> {
interface UseTimeAgoComponentOptions extends Omit<UseTimeAgoOptions<true>, 'controls'> {
time: MaybeRef<Date | number | string>;

@@ -207,2 +302,2 @@ }

export { OnClickOutside, UseActiveElement, UseBattery, UseBrowserLocation, UseDark, UseDeviceMotion, UseDeviceOrientation, UseDevicePixelRatio, UseDevicesList, UseDocumentVisibility, UseDraggable, UseDraggableProps, UseElementBounding, UseElementSize, UseElementVisibility, UseEyeDropper, UseFullscreen, UseGeolocation, UseIdle, UseMouse, UseMouseInElement, UseMousePressed, UseNetwork, UseNow, UseOnline, UsePageLeave, UsePointer, UsePreferredColorScheme, UsePreferredDark, UsePreferredLanguages, UseScreenSafeArea, UseTimeAgo, UseTimestamp, UseVirtualList, UseVirtualListProps, UseWindowFocus, UseWindowSize, VOnClickOutside };
export { OnClickOutside, UseActiveElement, UseBattery, UseBrowserLocation, UseColorMode, UseDark, UseDeviceMotion, UseDeviceOrientation, UseDevicePixelRatio, UseDevicesList, UseDocumentVisibility, UseDraggable, UseDraggableProps, UseElementBounding, UseElementSize, UseElementVisibility, UseEyeDropper, UseFullscreen, UseGeolocation, UseIdle, UseMouse, UseMouseInElement, UseMousePressed, UseNetwork, UseNow, UseOnline, UsePageLeave, UsePointer, UsePreferredColorScheme, UsePreferredDark, UsePreferredLanguages, UseScreenSafeArea, UseTimeAgo, UseTimestamp, UseVirtualList, UseVirtualListProps, UseWindowFocus, UseWindowSize, VOnClickOutside };

@@ -182,2 +182,210 @@ ;(function (window) {

function guessSerializerType(rawInit) {
return rawInit == null ? "any" : rawInit instanceof Set ? "set" : rawInit instanceof Map ? "map" : typeof rawInit === "boolean" ? "boolean" : typeof rawInit === "string" ? "string" : typeof rawInit === "object" ? "object" : Array.isArray(rawInit) ? "object" : !Number.isNaN(rawInit) ? "number" : "any";
}
const StorageSerializers = {
boolean: {
read: (v) => v === "true",
write: (v) => String(v)
},
object: {
read: (v) => JSON.parse(v),
write: (v) => JSON.stringify(v)
},
number: {
read: (v) => Number.parseFloat(v),
write: (v) => String(v)
},
any: {
read: (v) => v,
write: (v) => String(v)
},
string: {
read: (v) => v,
write: (v) => String(v)
},
map: {
read: (v) => new Map(JSON.parse(v)),
write: (v) => JSON.stringify(Array.from(v.entries()))
},
set: {
read: (v) => new Set(JSON.parse(v)),
write: (v) => JSON.stringify(Array.from(v.entries()))
}
};
function useStorage(key, initialValue, storage = ((_a) => (_a = defaultWindow) == null ? void 0 : _a.localStorage)(), options = {}) {
var _a2;
const {
flush = "pre",
deep = true,
listenToStorageChanges = true,
writeDefaults = true,
shallow,
window = defaultWindow,
eventFilter,
onError = (e) => {
console.error(e);
}
} = options;
const rawInit = vueDemi.unref(initialValue);
const type = guessSerializerType(rawInit);
const data = (shallow ? vueDemi.shallowRef : vueDemi.ref)(initialValue);
const serializer = (_a2 = options.serializer) != null ? _a2 : StorageSerializers[type];
function read(event) {
if (!storage || event && event.key !== key)
return;
try {
const rawValue = event ? event.newValue : storage.getItem(key);
if (rawValue == null) {
data.value = rawInit;
if (writeDefaults && rawInit !== null)
storage.setItem(key, serializer.write(rawInit));
} else {
data.value = serializer.read(rawValue);
}
} catch (e) {
onError(e);
}
}
read();
if (window && listenToStorageChanges)
useEventListener(window, "storage", (e) => setTimeout(() => read(e), 0));
if (storage) {
shared.watchWithFilter(data, () => {
try {
if (data.value == null)
storage.removeItem(key);
else
storage.setItem(key, serializer.write(data.value));
} catch (e) {
onError(e);
}
}, {
flush,
deep,
eventFilter
});
}
return data;
}
function useMediaQuery(query, options = {}) {
const { window = defaultWindow } = options;
let mediaQuery;
const matches = vueDemi.ref(false);
const update = () => {
if (!window)
return;
if (!mediaQuery)
mediaQuery = window.matchMedia(query);
matches.value = mediaQuery.matches;
};
shared.tryOnMounted(() => {
update();
if (!mediaQuery)
return;
if ("addEventListener" in mediaQuery)
mediaQuery.addEventListener("change", update);
else
mediaQuery.addListener(update);
shared.tryOnScopeDispose(() => {
if ("removeEventListener" in update)
mediaQuery.removeEventListener("change", update);
else
mediaQuery.removeListener(update);
});
});
return matches;
}
function usePreferredDark(options) {
return useMediaQuery("(prefers-color-scheme: dark)", options);
}
var __defProp$7 = Object.defineProperty;
var __getOwnPropSymbols$7 = Object.getOwnPropertySymbols;
var __hasOwnProp$7 = Object.prototype.hasOwnProperty;
var __propIsEnum$7 = Object.prototype.propertyIsEnumerable;
var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues$7 = (a, b) => {
for (var prop in b || (b = {}))
if (__hasOwnProp$7.call(b, prop))
__defNormalProp$7(a, prop, b[prop]);
if (__getOwnPropSymbols$7)
for (var prop of __getOwnPropSymbols$7(b)) {
if (__propIsEnum$7.call(b, prop))
__defNormalProp$7(a, prop, b[prop]);
}
return a;
};
function useColorMode(options = {}) {
var _a;
const {
selector = "html",
attribute = "class",
window = defaultWindow,
storage = (_a = defaultWindow) == null ? void 0 : _a.localStorage,
storageKey = "vueuse-color-scheme",
listenToStorageChanges = true,
storageRef
} = options;
const modes = __spreadValues$7({
auto: "",
light: "light",
dark: "dark"
}, options.modes || {});
const preferredDark = usePreferredDark({ window });
const preferredMode = vueDemi.computed(() => preferredDark.value ? "dark" : "light");
const store = storageRef || (storageKey == null ? vueDemi.ref("auto") : useStorage(storageKey, "auto", storage, { window, listenToStorageChanges }));
const state = vueDemi.computed({
get() {
return store.value === "auto" ? preferredMode.value : store.value;
},
set(v) {
store.value = v;
}
});
function defaultOnChanged(value) {
const el = window == null ? void 0 : window.document.querySelector(selector);
if (!el)
return;
if (attribute === "class") {
const current = (modes[value] || "").split(/\s/g);
Object.values(modes).flatMap((i) => (i || "").split(/\s/g)).filter(Boolean).forEach((v) => {
if (current.includes(v))
el.classList.add(v);
else
el.classList.remove(v);
});
} else {
el.setAttribute(attribute, value);
}
}
function onChanged(mode) {
if (options.onChanged)
options.onChanged(mode, defaultOnChanged);
else
defaultOnChanged(mode);
}
vueDemi.watch(state, onChanged, { flush: "post" });
shared.tryOnMounted(() => onChanged(state.value));
return state;
}
const UseColorMode = vueDemi.defineComponent({
name: "UseColorMode",
props: ["selector", "attribute", "modes", "onChanged", "storageKey", "storage"],
setup(props, { slots }) {
const mode = useColorMode(props);
const data = vueDemi.reactive({
mode
});
return () => {
if (slots.default)
return slots.default(data);
};
}
});
const UseDark = vueDemi.defineComponent({

@@ -691,3 +899,3 @@ name: "UseDark",

setup(props, { slots }) {
const { time } = vueDemi.toRefs(props);
const time = vueDemi.toRef(props, "time");
const data = vueDemi.reactive(core.useTimeAgo(time, __spreadProps$1(__spreadValues$2({}, props), { controls: true })));

@@ -794,2 +1002,3 @@ return () => {

exports.UseBrowserLocation = UseBrowserLocation;
exports.UseColorMode = UseColorMode;
exports.UseDark = UseDark;

@@ -796,0 +1005,0 @@ exports.UseDeviceMotion = UseDeviceMotion;

2

index.iife.min.js

@@ -1,1 +0,1 @@

(function(s){if(!s.VueDemi){var n={},a=s.Vue;if(a)if(a.version.slice(0,2)==="2."){var l=s.VueCompositionAPI;if(l){for(var _ in l)n[_]=l[_];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 _ in a)n[_]=a[_];n.isVue2=!1,n.isVue3=!0,n.install=function(){},n.Vue=a,n.Vue2=void 0,n.version=a.version,n.set=function(f,d,g){return Array.isArray(f)?(f.length=Math.max(f.length,d),f.splice(d,1,g),g):(f[d]=g,g)},n.del=function(f,d){if(Array.isArray(f)){f.splice(d,1);return}delete f[d]}}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,l){"use strict";const _=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 d=l.isClient?window:void 0;function g(...r){let e,t,o,i;if(l.isString(r[0])?([t,o,i]=r,e=d):[e,t,o,i]=r,!e)return l.noop;let p=l.noop;const c=n.watch(()=>n.unref(e),u=>{p(),!!u&&(u.addEventListener(t,o,i),p=()=>{u.removeEventListener(t,o,i),p=l.noop})},{immediate:!0,flush:"post"}),m=()=>{c(),p()};return l.tryOnScopeDispose(m),m}function F(r,e,t={}){const{window:o=d}=t;if(!o)return;const i=n.ref(!0),c=[g(o,"click",u=>{const P=f(r);!P||P===u.target||u.composedPath().includes(P)||!i.value||e(u)},{passive:!0,capture:!0}),g(o,"pointerdown",u=>{const P=f(r);i.value=!!P&&!u.composedPath().includes(P)},{passive:!0})];return()=>c.forEach(u=>u())}const W=(r,e)=>{F(r,e.value)},z=n.defineComponent({name:"UseActiveElement",setup(r,{slots:e}){const t=n.reactive({element:a.useActiveElement()});return()=>{if(e.default)return e.default(t)}}}),R=n.defineComponent({name:"UseBattery",setup(r,{slots:e}){const t=n.reactive(a.useBattery(r));return()=>{if(e.default)return e.default(t)}}}),k=n.defineComponent({name:"UseBrowserLocation",setup(r,{slots:e}){const t=n.reactive(a.useBrowserLocation());return()=>{if(e.default)return e.default(t)}}}),G=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:l.useToggle(t)});return()=>{if(e.default)return e.default(o)}}}),H=n.defineComponent({name:"UseDeviceMotion",setup(r,{slots:e}){const t=n.reactive(a.useDeviceMotion());return()=>{if(e.default)return e.default(t)}}}),K=n.defineComponent({name:"UseDeviceOrientation",setup(r,{slots:e}){const t=n.reactive(a.useDeviceOrientation());return()=>{if(e.default)return e.default(t)}}}),q=n.defineComponent({name:"UseDevicePixelRatio",setup(r,{slots:e}){const t=n.reactive({pixelRatio:a.useDevicePixelRatio()});return()=>{if(e.default)return e.default(t)}}}),J=n.defineComponent({name:"UseDevicesList",props:["onUpdated","requestPermissions","constraints"],setup(r,{slots:e}){const t=n.reactive(a.useDevicesList(r));return()=>{if(e.default)return e.default(t)}}}),Q=n.defineComponent({name:"UseDocumentVisibility",setup(r,{slots:e}){const t=n.reactive({visibility:a.useDocumentVisibility()});return()=>{if(e.default)return e.default(t)}}});var X=Object.defineProperty,Y=Object.defineProperties,Z=Object.getOwnPropertyDescriptors,O=Object.getOwnPropertySymbols,x=Object.prototype.hasOwnProperty,D=Object.prototype.propertyIsEnumerable,v=(r,e,t)=>e in r?X(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,ee=(r,e)=>{for(var t in e||(e={}))x.call(e,t)&&v(r,t,e[t]);if(O)for(var t of O(e))D.call(e,t)&&v(r,t,e[t]);return r},te=(r,e)=>Y(r,Z(e));const re=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,te(ee({},r),{initialValue:o})));return()=>{if(e.default)return n.h(r.as||"div",{ref:t,style:`touch-action:none;${i.style}`},e.default(i))}}}),ne=n.defineComponent({name:"UseElementBounding",props:["box","as"],setup(r,{slots:e}){const t=n.ref(),o=n.reactive(a.useElementBounding(t));return()=>{if(e.default)return n.h(r.as||"div",{ref:t},e.default(o))}}}),ae=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))}}}),se=n.defineComponent({name:"UseElementVisibility",props:["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))}}}),oe=n.defineComponent({name:"UseEyeDropper",props:{sRGBHex:String},setup(r,{slots:e}){const t=n.reactive(a.useEyeDropper());return()=>{if(e.default)return e.default(t)}}}),ie=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))}}}),ue=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)}}}),fe=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)}}}),le=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)}}}),pe=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 de=Object.defineProperty,ce=Object.defineProperties,_e=Object.getOwnPropertyDescriptors,y=Object.getOwnPropertySymbols,ge=Object.prototype.hasOwnProperty,Pe=Object.prototype.propertyIsEnumerable,h=(r,e,t)=>e in r?de(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)&&h(r,t,e[t]);if(y)for(var t of y(e))Pe.call(e,t)&&h(r,t,e[t]);return r},Ue=(r,e)=>ce(r,_e(e));const Oe=n.defineComponent({name:"UseMousePressed",props:["touch","initialValue","as"],setup(r,{slots:e}){const t=n.ref(),o=n.reactive(a.useMousePressed(Ue(me({},r),{target:t})));return()=>{if(e.default)return n.h(r.as||"div",{ref:t},e.default(o))}}}),ve=n.defineComponent({name:"UseNetwork",setup(r,{slots:e}){const t=n.reactive(a.useNetwork());return()=>{if(e.default)return e.default(t)}}});var ye=Object.defineProperty,he=Object.defineProperties,we=Object.getOwnPropertyDescriptors,w=Object.getOwnPropertySymbols,be=Object.prototype.hasOwnProperty,Ve=Object.prototype.propertyIsEnumerable,b=(r,e,t)=>e in r?ye(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,Ce=(r,e)=>{for(var t in e||(e={}))be.call(e,t)&&b(r,t,e[t]);if(w)for(var t of w(e))Ve.call(e,t)&&b(r,t,e[t]);return r},$e=(r,e)=>he(r,we(e));const Ee=n.defineComponent({name:"UseNow",props:["interval"],setup(r,{slots:e}){const t=n.reactive(a.useNow($e(Ce({},r),{controls:!0})));return()=>{if(e.default)return e.default(t)}}}),Se=n.defineComponent({name:"UseOnline",setup(r,{slots:e}){const t=n.reactive({isOnline:a.useOnline()});return()=>{if(e.default)return e.default(t)}}}),Le=n.defineComponent({name:"UsePageLeave",setup(r,{slots:e}){const t=n.reactive({isLeft:a.usePageLeave()});return()=>{if(e.default)return e.default(t)}}});var je=Object.defineProperty,Ie=Object.defineProperties,Ne=Object.getOwnPropertyDescriptors,V=Object.getOwnPropertySymbols,Ae=Object.prototype.hasOwnProperty,Be=Object.prototype.propertyIsEnumerable,C=(r,e,t)=>e in r?je(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,Me=(r,e)=>{for(var t in e||(e={}))Ae.call(e,t)&&C(r,t,e[t]);if(V)for(var t of V(e))Be.call(e,t)&&C(r,t,e[t]);return r},Te=(r,e)=>Ie(r,Ne(e));const Fe=n.defineComponent({name:"UsePointer",props:["pointerTypes","initialValue","target"],setup(r,{slots:e}){const t=n.ref(null),o=n.reactive(a.usePointer(Te(Me({},r),{target:r.target==="self"?t:d})));return()=>{if(e.default)return e.default(o,{ref:t})}}}),We=n.defineComponent({name:"UsePreferredColorScheme",setup(r,{slots:e}){const t=n.reactive({colorScheme:a.usePreferredColorScheme()});return()=>{if(e.default)return e.default(t)}}}),ze=n.defineComponent({name:"UsePreferredDark",setup(r,{slots:e}){const t=n.reactive({prefersDark:a.usePreferredDark()});return()=>{if(e.default)return e.default(t)}}}),Re=n.defineComponent({name:"UsePreferredLanguages",setup(r,{slots:e}){const t=n.reactive({languages:a.usePreferredLanguages()});return()=>{if(e.default)return e.default(t)}}}),$="--vueuse-safe-area-top",E="--vueuse-safe-area-right",S="--vueuse-safe-area-bottom",L="--vueuse-safe-area-left";function ke(){const r=n.ref(""),e=n.ref(""),t=n.ref(""),o=n.ref("");if(a.isClient){const p=a.useCssVar($),c=a.useCssVar(E),m=a.useCssVar(S),u=a.useCssVar(L);p.value="env(safe-area-inset-top, 0px)",c.value="env(safe-area-inset-right, 0px)",m.value="env(safe-area-inset-bottom, 0px)",u.value="env(safe-area-inset-left, 0px)",i(),a.useEventListener("resize",a.useDebounceFn(i))}function i(){r.value=U($),e.value=U(E),t.value=U(S),o.value=U(L)}return{top:r,right:e,bottom:t,left:o,update:i}}function U(r){return getComputedStyle(document.documentElement).getPropertyValue(r)}const Ge=n.defineComponent({name:"UseScreenSafeArea",props:{top:Boolean,right:Boolean,bottom:Boolean,left:Boolean},setup(r,{slots:e}){const{top:t,right:o,bottom:i,left:p}=ke();return()=>{if(e.default)return n.h("div",{style:{paddingTop:r.top?t.value:"",paddingRight:r.right?o.value:"",paddingBottom:r.bottom?i.value:"",paddingLeft:r.left?p.value:"",boxSizing:"border-box",maxHeight:"100vh",maxWidth:"100vw",overflow:"auto"}},e.default())}}});var He=Object.defineProperty,Ke=Object.defineProperties,qe=Object.getOwnPropertyDescriptors,j=Object.getOwnPropertySymbols,Je=Object.prototype.hasOwnProperty,Qe=Object.prototype.propertyIsEnumerable,I=(r,e,t)=>e in r?He(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,Xe=(r,e)=>{for(var t in e||(e={}))Je.call(e,t)&&I(r,t,e[t]);if(j)for(var t of j(e))Qe.call(e,t)&&I(r,t,e[t]);return r},Ye=(r,e)=>Ke(r,qe(e));const Ze=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,Ye(Xe({},r),{controls:!0})));return()=>{if(e.default)return e.default(o)}}});var xe=Object.defineProperty,De=Object.defineProperties,et=Object.getOwnPropertyDescriptors,N=Object.getOwnPropertySymbols,tt=Object.prototype.hasOwnProperty,rt=Object.prototype.propertyIsEnumerable,A=(r,e,t)=>e in r?xe(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,nt=(r,e)=>{for(var t in e||(e={}))tt.call(e,t)&&A(r,t,e[t]);if(N)for(var t of N(e))rt.call(e,t)&&A(r,t,e[t]);return r},at=(r,e)=>De(r,et(e));const st=n.defineComponent({name:"UseTimestamp",props:["immediate","interval","offset"],setup(r,{slots:e}){const t=n.reactive(a.useTimestamp(at(nt({},r),{controls:!0})));return()=>{if(e.default)return e.default(t)}}});var ot=Object.defineProperty,B=Object.getOwnPropertySymbols,it=Object.prototype.hasOwnProperty,ut=Object.prototype.propertyIsEnumerable,M=(r,e,t)=>e in r?ot(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,T=(r,e)=>{for(var t in e||(e={}))it.call(e,t)&&M(r,t,e[t]);if(B)for(var t of B(e))ut.call(e,t)&&M(r,t,e[t]);return r};const ft=n.defineComponent({name:"UseVirtualList",props:["list","options","height"],setup(r,{slots:e}){const{list:t}=n.toRefs(r),{list:o,containerProps:i,wrapperProps:p}=a.useVirtualList(t,r.options);return i.style.height=r.height||"300px",()=>n.h("div",T({},i),[n.h("div",T({},p.value),o.value.map(c=>n.h("div",{style:{overFlow:"hidden",height:c.height}},e.default?e.default(c):"Please set content!")))])}}),lt=n.defineComponent({name:"UseWindowFocus",setup(r,{slots:e}){const t=n.reactive({focused:a.useWindowFocus()});return()=>{if(e.default)return e.default(t)}}}),pt=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=_,s.UseActiveElement=z,s.UseBattery=R,s.UseBrowserLocation=k,s.UseDark=G,s.UseDeviceMotion=H,s.UseDeviceOrientation=K,s.UseDevicePixelRatio=q,s.UseDevicesList=J,s.UseDocumentVisibility=Q,s.UseDraggable=re,s.UseElementBounding=ne,s.UseElementSize=ae,s.UseElementVisibility=se,s.UseEyeDropper=oe,s.UseFullscreen=ie,s.UseGeolocation=ue,s.UseIdle=fe,s.UseMouse=le,s.UseMouseInElement=pe,s.UseMousePressed=Oe,s.UseNetwork=ve,s.UseNow=Ee,s.UseOnline=Se,s.UsePageLeave=Le,s.UsePointer=Fe,s.UsePreferredColorScheme=We,s.UsePreferredDark=ze,s.UsePreferredLanguages=Re,s.UseScreenSafeArea=Ge,s.UseTimeAgo=Ze,s.UseTimestamp=st,s.UseVirtualList=ft,s.UseWindowFocus=lt,s.UseWindowSize=pt,s.VOnClickOutside=W,Object.defineProperty(s,"__esModule",{value:!0})}(this.VueUse=this.VueUse||{},VueDemi,VueUse,VueUse);
(function(o){if(!o.VueDemi){var n={},s=o.Vue;if(s)if(s.version.slice(0,2)==="2."){var f=o.VueCompositionAPI;if(f){for(var h in f)n[h]=f[h];n.isVue2=!0,n.isVue3=!1,n.install=function(){},n.Vue=s,n.Vue2=s,n.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(s.version.slice(0,2)==="3."){for(var h in s)n[h]=s[h];n.isVue2=!1,n.isVue3=!0,n.install=function(){},n.Vue=s,n.Vue2=void 0,n.version=s.version,n.set=function(p,c,y){return Array.isArray(p)?(p.length=Math.max(p.length,c),p.splice(c,1,y),y):(p[c]=y,y)},n.del=function(p,c){if(Array.isArray(p)){p.splice(c,1);return}delete p[c]}}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`.");o.VueDemi=n}})(window),function(o,n,s,f){"use strict";const h=n.defineComponent({name:"OnClickOutside",props:["as"],emits:["trigger"],setup(t,{slots:e,emit:r}){const a=n.ref();return s.onClickOutside(a,i=>{r("trigger",i)}),()=>{if(e.default)return n.h(t.as||"div",{ref:a},e.default())}}});function p(t){var e;const r=n.unref(t);return(e=r==null?void 0:r.$el)!=null?e:r}const c=f.isClient?window:void 0;function y(...t){let e,r,a,i;if(f.isString(t[0])?([r,a,i]=t,e=c):[e,r,a,i]=t,!e)return f.noop;let u=f.noop;const d=n.watch(()=>n.unref(e),l=>{u(),!!l&&(l.addEventListener(r,a,i),u=()=>{l.removeEventListener(r,a,i),u=f.noop})},{immediate:!0,flush:"post"}),v=()=>{d(),u()};return f.tryOnScopeDispose(v),v}function Y(t,e,r={}){const{window:a=c}=r;if(!a)return;const i=n.ref(!0),d=[y(a,"click",l=>{const m=p(t);!m||m===l.target||l.composedPath().includes(m)||!i.value||e(l)},{passive:!0,capture:!0}),y(a,"pointerdown",l=>{const m=p(t);i.value=!!m&&!l.composedPath().includes(m)},{passive:!0})];return()=>d.forEach(l=>l())}const Z=(t,e)=>{Y(t,e.value)},x=n.defineComponent({name:"UseActiveElement",setup(t,{slots:e}){const r=n.reactive({element:s.useActiveElement()});return()=>{if(e.default)return e.default(r)}}}),D=n.defineComponent({name:"UseBattery",setup(t,{slots:e}){const r=n.reactive(s.useBattery(t));return()=>{if(e.default)return e.default(r)}}}),ee=n.defineComponent({name:"UseBrowserLocation",setup(t,{slots:e}){const r=n.reactive(s.useBrowserLocation());return()=>{if(e.default)return e.default(r)}}});function te(t){return t==null?"any":t instanceof Set?"set":t instanceof Map?"map":typeof t=="boolean"?"boolean":typeof t=="string"?"string":typeof t=="object"||Array.isArray(t)?"object":Number.isNaN(t)?"any":"number"}const re={boolean:{read:t=>t==="true",write:t=>String(t)},object:{read:t=>JSON.parse(t),write:t=>JSON.stringify(t)},number:{read:t=>Number.parseFloat(t),write:t=>String(t)},any:{read:t=>t,write:t=>String(t)},string:{read:t=>t,write:t=>String(t)},map:{read:t=>new Map(JSON.parse(t)),write:t=>JSON.stringify(Array.from(t.entries()))},set:{read:t=>new Set(JSON.parse(t)),write:t=>JSON.stringify(Array.from(t.entries()))}};function ne(t,e,r=(i=>(i=c)==null?void 0:i.localStorage)(),a={}){var i;const{flush:u="pre",deep:d=!0,listenToStorageChanges:v=!0,writeDefaults:l=!0,shallow:m,window:S=c,eventFilter:$,onError:b=g=>{console.error(g)}}=a,U=n.unref(e),V=te(U),P=(m?n.shallowRef:n.ref)(e),_=(i=a.serializer)!=null?i:re[V];function w(g){if(!(!r||g&&g.key!==t))try{const O=g?g.newValue:r.getItem(t);O==null?(P.value=U,l&&U!==null&&r.setItem(t,_.write(U))):P.value=_.read(O)}catch(O){b(O)}}return w(),S&&v&&y(S,"storage",g=>setTimeout(()=>w(g),0)),r&&f.watchWithFilter(P,()=>{try{P.value==null?r.removeItem(t):r.setItem(t,_.write(P.value))}catch(g){b(g)}},{flush:u,deep:d,eventFilter:$}),P}function ae(t,e={}){const{window:r=c}=e;let a;const i=n.ref(!1),u=()=>{!r||(a||(a=r.matchMedia(t)),i.value=a.matches)};return f.tryOnMounted(()=>{u(),!!a&&("addEventListener"in a?a.addEventListener("change",u):a.addListener(u),f.tryOnScopeDispose(()=>{"removeEventListener"in u?a.removeEventListener("change",u):a.removeListener(u)}))}),i}function se(t){return ae("(prefers-color-scheme: dark)",t)}var oe=Object.defineProperty,E=Object.getOwnPropertySymbols,ie=Object.prototype.hasOwnProperty,ue=Object.prototype.propertyIsEnumerable,L=(t,e,r)=>e in t?oe(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,le=(t,e)=>{for(var r in e||(e={}))ie.call(e,r)&&L(t,r,e[r]);if(E)for(var r of E(e))ue.call(e,r)&&L(t,r,e[r]);return t};function fe(t={}){var e;const{selector:r="html",attribute:a="class",window:i=c,storage:u=(e=c)==null?void 0:e.localStorage,storageKey:d="vueuse-color-scheme",listenToStorageChanges:v=!0,storageRef:l}=t,m=le({auto:"",light:"light",dark:"dark"},t.modes||{}),S=se({window:i}),$=n.computed(()=>S.value?"dark":"light"),b=l||(d==null?n.ref("auto"):ne(d,"auto",u,{window:i,listenToStorageChanges:v})),U=n.computed({get(){return b.value==="auto"?$.value:b.value},set(_){b.value=_}});function V(_){const w=i==null?void 0:i.document.querySelector(r);if(!!w)if(a==="class"){const g=(m[_]||"").split(/\s/g);Object.values(m).flatMap(O=>(O||"").split(/\s/g)).filter(Boolean).forEach(O=>{g.includes(O)?w.classList.add(O):w.classList.remove(O)})}else w.setAttribute(a,_)}function P(_){t.onChanged?t.onChanged(_,V):V(_)}return n.watch(U,P,{flush:"post"}),f.tryOnMounted(()=>P(U.value)),U}const ce=n.defineComponent({name:"UseColorMode",props:["selector","attribute","modes","onChanged","storageKey","storage"],setup(t,{slots:e}){const r=fe(t),a=n.reactive({mode:r});return()=>{if(e.default)return e.default(a)}}}),de=n.defineComponent({name:"UseDark",props:["selector","attribute","valueDark","valueLight","onChanged","storageKey","storage"],setup(t,{slots:e}){const r=s.useDark(t),a=n.reactive({isDark:r,toggleDark:f.useToggle(r)});return()=>{if(e.default)return e.default(a)}}}),pe=n.defineComponent({name:"UseDeviceMotion",setup(t,{slots:e}){const r=n.reactive(s.useDeviceMotion());return()=>{if(e.default)return e.default(r)}}}),ge=n.defineComponent({name:"UseDeviceOrientation",setup(t,{slots:e}){const r=n.reactive(s.useDeviceOrientation());return()=>{if(e.default)return e.default(r)}}}),me=n.defineComponent({name:"UseDevicePixelRatio",setup(t,{slots:e}){const r=n.reactive({pixelRatio:s.useDevicePixelRatio()});return()=>{if(e.default)return e.default(r)}}}),_e=n.defineComponent({name:"UseDevicesList",props:["onUpdated","requestPermissions","constraints"],setup(t,{slots:e}){const r=n.reactive(s.useDevicesList(t));return()=>{if(e.default)return e.default(r)}}}),Oe=n.defineComponent({name:"UseDocumentVisibility",setup(t,{slots:e}){const r=n.reactive({visibility:s.useDocumentVisibility()});return()=>{if(e.default)return e.default(r)}}});var ve=Object.defineProperty,Pe=Object.defineProperties,ye=Object.getOwnPropertyDescriptors,j=Object.getOwnPropertySymbols,Ue=Object.prototype.hasOwnProperty,he=Object.prototype.propertyIsEnumerable,M=(t,e,r)=>e in t?ve(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,we=(t,e)=>{for(var r in e||(e={}))Ue.call(e,r)&&M(t,r,e[r]);if(j)for(var r of j(e))he.call(e,r)&&M(t,r,e[r]);return t},be=(t,e)=>Pe(t,ye(e));const Ce=n.defineComponent({name:"UseDraggable",props:["storageKey","initialValue","exact","preventDefault","pointerTypes","as"],setup(t,{slots:e}){const r=n.ref(),a=t.storageKey?s.useStorage(t.storageKey,n.unref(t.initialValue)||{x:0,y:0},s.isClient?t.storageType==="session"?sessionStorage:localStorage:void 0):t.initialValue||{x:0,y:0},i=n.reactive(s.useDraggable(r,be(we({},t),{initialValue:a})));return()=>{if(e.default)return n.h(t.as||"div",{ref:r,style:`touch-action:none;${i.style}`},e.default(i))}}}),Se=n.defineComponent({name:"UseElementBounding",props:["box","as"],setup(t,{slots:e}){const r=n.ref(),a=n.reactive(s.useElementBounding(r));return()=>{if(e.default)return n.h(t.as||"div",{ref:r},e.default(a))}}}),Ve=n.defineComponent({name:"UseElementSize",props:["width","height","box"],setup(t,{slots:e}){const r=n.ref(),a=n.reactive(s.useElementSize(r,{width:t.width,height:t.height},{box:t.box}));return()=>{if(e.default)return n.h(t.as||"div",{ref:r},e.default(a))}}}),$e=n.defineComponent({name:"UseElementVisibility",props:["as"],setup(t,{slots:e}){const r=n.ref(),a=n.reactive({isVisible:s.useElementVisibility(r)});return()=>{if(e.default)return n.h(t.as||"div",{ref:r},e.default(a))}}}),Ee=n.defineComponent({name:"UseEyeDropper",props:{sRGBHex:String},setup(t,{slots:e}){const r=n.reactive(s.useEyeDropper());return()=>{if(e.default)return e.default(r)}}}),Le=n.defineComponent({name:"UseFullscreen",props:["as"],setup(t,{slots:e}){const r=n.ref(),a=n.reactive(s.useFullscreen(r));return()=>{if(e.default)return n.h(t.as||"div",{ref:r},e.default(a))}}}),je=n.defineComponent({name:"UseGeolocation",props:["enableHighAccuracy","maximumAge","timeout","navigator"],setup(t,{slots:e}){const r=n.reactive(s.useGeolocation(t));return()=>{if(e.default)return e.default(r)}}}),Me=n.defineComponent({name:"UseIdle",props:["timeout","events","listenForVisibilityChange","initialState"],setup(t,{slots:e}){const r=n.reactive(s.useIdle(t.timeout,t));return()=>{if(e.default)return e.default(r)}}}),Ne=n.defineComponent({name:"UseMouse",props:["touch","resetOnTouchEnds","initialValue"],setup(t,{slots:e}){const r=n.reactive(s.useMouse(t));return()=>{if(e.default)return e.default(r)}}}),Ae=n.defineComponent({name:"UseMouseElement",props:["handleOutside","as"],setup(t,{slots:e}){const r=n.ref(),a=n.reactive(s.useMouseInElement(r,t));return()=>{if(e.default)return n.h(t.as||"div",{ref:r},e.default(a))}}});var Ie=Object.defineProperty,Be=Object.defineProperties,Te=Object.getOwnPropertyDescriptors,N=Object.getOwnPropertySymbols,Fe=Object.prototype.hasOwnProperty,ze=Object.prototype.propertyIsEnumerable,A=(t,e,r)=>e in t?Ie(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,We=(t,e)=>{for(var r in e||(e={}))Fe.call(e,r)&&A(t,r,e[r]);if(N)for(var r of N(e))ze.call(e,r)&&A(t,r,e[r]);return t},Re=(t,e)=>Be(t,Te(e));const ke=n.defineComponent({name:"UseMousePressed",props:["touch","initialValue","as"],setup(t,{slots:e}){const r=n.ref(),a=n.reactive(s.useMousePressed(Re(We({},t),{target:r})));return()=>{if(e.default)return n.h(t.as||"div",{ref:r},e.default(a))}}}),Je=n.defineComponent({name:"UseNetwork",setup(t,{slots:e}){const r=n.reactive(s.useNetwork());return()=>{if(e.default)return e.default(r)}}});var Ke=Object.defineProperty,Ge=Object.defineProperties,He=Object.getOwnPropertyDescriptors,I=Object.getOwnPropertySymbols,qe=Object.prototype.hasOwnProperty,Qe=Object.prototype.propertyIsEnumerable,B=(t,e,r)=>e in t?Ke(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,Xe=(t,e)=>{for(var r in e||(e={}))qe.call(e,r)&&B(t,r,e[r]);if(I)for(var r of I(e))Qe.call(e,r)&&B(t,r,e[r]);return t},Ye=(t,e)=>Ge(t,He(e));const Ze=n.defineComponent({name:"UseNow",props:["interval"],setup(t,{slots:e}){const r=n.reactive(s.useNow(Ye(Xe({},t),{controls:!0})));return()=>{if(e.default)return e.default(r)}}}),xe=n.defineComponent({name:"UseOnline",setup(t,{slots:e}){const r=n.reactive({isOnline:s.useOnline()});return()=>{if(e.default)return e.default(r)}}}),De=n.defineComponent({name:"UsePageLeave",setup(t,{slots:e}){const r=n.reactive({isLeft:s.usePageLeave()});return()=>{if(e.default)return e.default(r)}}});var et=Object.defineProperty,tt=Object.defineProperties,rt=Object.getOwnPropertyDescriptors,T=Object.getOwnPropertySymbols,nt=Object.prototype.hasOwnProperty,at=Object.prototype.propertyIsEnumerable,F=(t,e,r)=>e in t?et(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,st=(t,e)=>{for(var r in e||(e={}))nt.call(e,r)&&F(t,r,e[r]);if(T)for(var r of T(e))at.call(e,r)&&F(t,r,e[r]);return t},ot=(t,e)=>tt(t,rt(e));const it=n.defineComponent({name:"UsePointer",props:["pointerTypes","initialValue","target"],setup(t,{slots:e}){const r=n.ref(null),a=n.reactive(s.usePointer(ot(st({},t),{target:t.target==="self"?r:c})));return()=>{if(e.default)return e.default(a,{ref:r})}}}),ut=n.defineComponent({name:"UsePreferredColorScheme",setup(t,{slots:e}){const r=n.reactive({colorScheme:s.usePreferredColorScheme()});return()=>{if(e.default)return e.default(r)}}}),lt=n.defineComponent({name:"UsePreferredDark",setup(t,{slots:e}){const r=n.reactive({prefersDark:s.usePreferredDark()});return()=>{if(e.default)return e.default(r)}}}),ft=n.defineComponent({name:"UsePreferredLanguages",setup(t,{slots:e}){const r=n.reactive({languages:s.usePreferredLanguages()});return()=>{if(e.default)return e.default(r)}}}),z="--vueuse-safe-area-top",W="--vueuse-safe-area-right",R="--vueuse-safe-area-bottom",k="--vueuse-safe-area-left";function ct(){const t=n.ref(""),e=n.ref(""),r=n.ref(""),a=n.ref("");if(s.isClient){const u=s.useCssVar(z),d=s.useCssVar(W),v=s.useCssVar(R),l=s.useCssVar(k);u.value="env(safe-area-inset-top, 0px)",d.value="env(safe-area-inset-right, 0px)",v.value="env(safe-area-inset-bottom, 0px)",l.value="env(safe-area-inset-left, 0px)",i(),s.useEventListener("resize",s.useDebounceFn(i))}function i(){t.value=C(z),e.value=C(W),r.value=C(R),a.value=C(k)}return{top:t,right:e,bottom:r,left:a,update:i}}function C(t){return getComputedStyle(document.documentElement).getPropertyValue(t)}const dt=n.defineComponent({name:"UseScreenSafeArea",props:{top:Boolean,right:Boolean,bottom:Boolean,left:Boolean},setup(t,{slots:e}){const{top:r,right:a,bottom:i,left:u}=ct();return()=>{if(e.default)return n.h("div",{style:{paddingTop:t.top?r.value:"",paddingRight:t.right?a.value:"",paddingBottom:t.bottom?i.value:"",paddingLeft:t.left?u.value:"",boxSizing:"border-box",maxHeight:"100vh",maxWidth:"100vw",overflow:"auto"}},e.default())}}});var pt=Object.defineProperty,gt=Object.defineProperties,mt=Object.getOwnPropertyDescriptors,J=Object.getOwnPropertySymbols,_t=Object.prototype.hasOwnProperty,Ot=Object.prototype.propertyIsEnumerable,K=(t,e,r)=>e in t?pt(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,vt=(t,e)=>{for(var r in e||(e={}))_t.call(e,r)&&K(t,r,e[r]);if(J)for(var r of J(e))Ot.call(e,r)&&K(t,r,e[r]);return t},Pt=(t,e)=>gt(t,mt(e));const yt=n.defineComponent({name:"UseTimeAgo",props:["time","updateInterval","max","fullDateFormatter","messages"],setup(t,{slots:e}){const r=n.toRef(t,"time"),a=n.reactive(s.useTimeAgo(r,Pt(vt({},t),{controls:!0})));return()=>{if(e.default)return e.default(a)}}});var Ut=Object.defineProperty,ht=Object.defineProperties,wt=Object.getOwnPropertyDescriptors,G=Object.getOwnPropertySymbols,bt=Object.prototype.hasOwnProperty,Ct=Object.prototype.propertyIsEnumerable,H=(t,e,r)=>e in t?Ut(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,St=(t,e)=>{for(var r in e||(e={}))bt.call(e,r)&&H(t,r,e[r]);if(G)for(var r of G(e))Ct.call(e,r)&&H(t,r,e[r]);return t},Vt=(t,e)=>ht(t,wt(e));const $t=n.defineComponent({name:"UseTimestamp",props:["immediate","interval","offset"],setup(t,{slots:e}){const r=n.reactive(s.useTimestamp(Vt(St({},t),{controls:!0})));return()=>{if(e.default)return e.default(r)}}});var Et=Object.defineProperty,q=Object.getOwnPropertySymbols,Lt=Object.prototype.hasOwnProperty,jt=Object.prototype.propertyIsEnumerable,Q=(t,e,r)=>e in t?Et(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,X=(t,e)=>{for(var r in e||(e={}))Lt.call(e,r)&&Q(t,r,e[r]);if(q)for(var r of q(e))jt.call(e,r)&&Q(t,r,e[r]);return t};const Mt=n.defineComponent({name:"UseVirtualList",props:["list","options","height"],setup(t,{slots:e}){const{list:r}=n.toRefs(t),{list:a,containerProps:i,wrapperProps:u}=s.useVirtualList(r,t.options);return i.style.height=t.height||"300px",()=>n.h("div",X({},i),[n.h("div",X({},u.value),a.value.map(d=>n.h("div",{style:{overFlow:"hidden",height:d.height}},e.default?e.default(d):"Please set content!")))])}}),Nt=n.defineComponent({name:"UseWindowFocus",setup(t,{slots:e}){const r=n.reactive({focused:s.useWindowFocus()});return()=>{if(e.default)return e.default(r)}}}),At=n.defineComponent({name:"UseWindowSize",props:["initialWidth","initialHeight"],setup(t,{slots:e}){const r=n.reactive(s.useWindowSize(t));return()=>{if(e.default)return e.default(r)}}});o.OnClickOutside=h,o.UseActiveElement=x,o.UseBattery=D,o.UseBrowserLocation=ee,o.UseColorMode=ce,o.UseDark=de,o.UseDeviceMotion=pe,o.UseDeviceOrientation=ge,o.UseDevicePixelRatio=me,o.UseDevicesList=_e,o.UseDocumentVisibility=Oe,o.UseDraggable=Ce,o.UseElementBounding=Se,o.UseElementSize=Ve,o.UseElementVisibility=$e,o.UseEyeDropper=Ee,o.UseFullscreen=Le,o.UseGeolocation=je,o.UseIdle=Me,o.UseMouse=Ne,o.UseMouseInElement=Ae,o.UseMousePressed=ke,o.UseNetwork=Je,o.UseNow=Ze,o.UseOnline=xe,o.UsePageLeave=De,o.UsePointer=it,o.UsePreferredColorScheme=ut,o.UsePreferredDark=lt,o.UsePreferredLanguages=ft,o.UseScreenSafeArea=dt,o.UseTimeAgo=yt,o.UseTimestamp=$t,o.UseVirtualList=Mt,o.UseWindowFocus=Nt,o.UseWindowSize=At,o.VOnClickOutside=Z,Object.defineProperty(o,"__esModule",{value:!0})}(this.VueUse=this.VueUse||{},VueDemi,VueUse,VueUse);
{
"name": "@vueuse/components",
"version": "7.3.0",
"version": "7.4.0",
"description": "Renderless components for VueUse",

@@ -36,6 +36,6 @@ "keywords": [

"dependencies": {
"@vueuse/core": "7.3.0",
"@vueuse/shared": "7.3.0",
"@vueuse/core": "7.4.0",
"@vueuse/shared": "7.4.0",
"vue-demi": "*"
}
}

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc