@vueuse/components 10.5.0 → 10.6.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.cjs +71 -16
- package/index.d.cts +13 -2
- package/index.d.mts +13 -2
- package/index.d.ts +13 -2
- package/index.iife.js +71 -16
- package/index.iife.min.js +1 -1
- package/index.mjs +73 -19
- package/package.json +3 -3
package/index.cjs
CHANGED
|
@@ -114,8 +114,7 @@ function onClickOutside(target, handler, options = {}) {
|
|
|
114
114
|
useEventListener(window, "click", listener, { passive: true, capture }),
|
|
115
115
|
useEventListener(window, "pointerdown", (e) => {
|
|
116
116
|
const el = unrefElement(target);
|
|
117
|
-
|
|
118
|
-
shouldListen = !e.composedPath().includes(el) && !shouldIgnore(e);
|
|
117
|
+
shouldListen = !shouldIgnore(e) && !!(el && !e.composedPath().includes(el));
|
|
119
118
|
}, { passive: true }),
|
|
120
119
|
detectIframe && useEventListener(window, "blur", (event) => {
|
|
121
120
|
setTimeout(() => {
|
|
@@ -238,8 +237,12 @@ function onLongPress(target, handler, options) {
|
|
|
238
237
|
capture: (_a = options == null ? void 0 : options.modifiers) == null ? void 0 : _a.capture,
|
|
239
238
|
once: (_b = options == null ? void 0 : options.modifiers) == null ? void 0 : _b.once
|
|
240
239
|
};
|
|
241
|
-
|
|
242
|
-
|
|
240
|
+
const cleanup = [
|
|
241
|
+
useEventListener(elementRef, "pointerdown", onDown, listenerOptions),
|
|
242
|
+
useEventListener(elementRef, ["pointerup", "pointerleave"], clear, listenerOptions)
|
|
243
|
+
].filter(Boolean);
|
|
244
|
+
const stop = () => cleanup.forEach((fn) => fn());
|
|
245
|
+
return stop;
|
|
243
246
|
}
|
|
244
247
|
|
|
245
248
|
const OnLongPress = /* @__PURE__ */ /* #__PURE__ */ vueDemi.defineComponent({
|
|
@@ -306,6 +309,24 @@ const UseBrowserLocation = /* @__PURE__ */ /* #__PURE__ */ vueDemi.defineCompone
|
|
|
306
309
|
}
|
|
307
310
|
});
|
|
308
311
|
|
|
312
|
+
const UseClipboard = /* @__PURE__ */ /* #__PURE__ */ vueDemi.defineComponent({
|
|
313
|
+
name: "UseClipboard",
|
|
314
|
+
props: [
|
|
315
|
+
"source",
|
|
316
|
+
"read",
|
|
317
|
+
"navigator",
|
|
318
|
+
"copiedDuring",
|
|
319
|
+
"legacy"
|
|
320
|
+
],
|
|
321
|
+
setup(props, { slots }) {
|
|
322
|
+
const data = vueDemi.reactive(core.useClipboard(props));
|
|
323
|
+
return () => {
|
|
324
|
+
var _a;
|
|
325
|
+
return (_a = slots.default) == null ? void 0 : _a.call(slots, data);
|
|
326
|
+
};
|
|
327
|
+
}
|
|
328
|
+
});
|
|
329
|
+
|
|
309
330
|
const _global = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
|
|
310
331
|
const globalKey = "__vueuse_ssr_handlers__";
|
|
311
332
|
const handlers = /* @__PURE__ */ getHandlers();
|
|
@@ -370,9 +391,10 @@ function useStorage(key, defaults, storage, options = {}) {
|
|
|
370
391
|
eventFilter,
|
|
371
392
|
onError = (e) => {
|
|
372
393
|
console.error(e);
|
|
373
|
-
}
|
|
394
|
+
},
|
|
395
|
+
initOnMounted
|
|
374
396
|
} = options;
|
|
375
|
-
const data = (shallow ? vueDemi.shallowRef : vueDemi.ref)(defaults);
|
|
397
|
+
const data = (shallow ? vueDemi.shallowRef : vueDemi.ref)(typeof defaults === "function" ? defaults() : defaults);
|
|
376
398
|
if (!storage) {
|
|
377
399
|
try {
|
|
378
400
|
storage = getSSRHandler("getDefaultStorage", () => {
|
|
@@ -394,10 +416,15 @@ function useStorage(key, defaults, storage, options = {}) {
|
|
|
394
416
|
{ flush, deep, eventFilter }
|
|
395
417
|
);
|
|
396
418
|
if (window && listenToStorageChanges) {
|
|
397
|
-
|
|
398
|
-
|
|
419
|
+
shared.tryOnMounted(() => {
|
|
420
|
+
useEventListener(window, "storage", update);
|
|
421
|
+
useEventListener(window, customStorageEventName, updateFromCustomEvent);
|
|
422
|
+
if (initOnMounted)
|
|
423
|
+
update();
|
|
424
|
+
});
|
|
399
425
|
}
|
|
400
|
-
|
|
426
|
+
if (!initOnMounted)
|
|
427
|
+
update();
|
|
401
428
|
return data;
|
|
402
429
|
function write(v) {
|
|
403
430
|
try {
|
|
@@ -853,7 +880,7 @@ function useElementSize(target, initialSize = { width: 0, height: 0 }, options =
|
|
|
853
880
|
});
|
|
854
881
|
const width = vueDemi.ref(initialSize.width);
|
|
855
882
|
const height = vueDemi.ref(initialSize.height);
|
|
856
|
-
useResizeObserver(
|
|
883
|
+
const { stop: stop1 } = useResizeObserver(
|
|
857
884
|
target,
|
|
858
885
|
([entry]) => {
|
|
859
886
|
const boxSize = box === "border-box" ? entry.borderBoxSize : box === "content-box" ? entry.contentBoxSize : entry.devicePixelContentBoxSize;
|
|
@@ -877,16 +904,28 @@ function useElementSize(target, initialSize = { width: 0, height: 0 }, options =
|
|
|
877
904
|
},
|
|
878
905
|
options
|
|
879
906
|
);
|
|
880
|
-
|
|
907
|
+
shared.tryOnMounted(() => {
|
|
908
|
+
const ele = unrefElement(target);
|
|
909
|
+
if (ele) {
|
|
910
|
+
width.value = "offsetWidth" in ele ? ele.offsetWidth : initialSize.width;
|
|
911
|
+
height.value = "offsetHeight" in ele ? ele.offsetHeight : initialSize.height;
|
|
912
|
+
}
|
|
913
|
+
});
|
|
914
|
+
const stop2 = vueDemi.watch(
|
|
881
915
|
() => unrefElement(target),
|
|
882
916
|
(ele) => {
|
|
883
917
|
width.value = ele ? initialSize.width : 0;
|
|
884
918
|
height.value = ele ? initialSize.height : 0;
|
|
885
919
|
}
|
|
886
920
|
);
|
|
921
|
+
function stop() {
|
|
922
|
+
stop1();
|
|
923
|
+
stop2();
|
|
924
|
+
}
|
|
887
925
|
return {
|
|
888
926
|
width,
|
|
889
|
-
height
|
|
927
|
+
height,
|
|
928
|
+
stop
|
|
890
929
|
};
|
|
891
930
|
}
|
|
892
931
|
|
|
@@ -1307,6 +1346,12 @@ function useScroll(element, options = {}) {
|
|
|
1307
1346
|
throttle ? shared.useThrottleFn(onScrollHandler, throttle, true, false) : onScrollHandler,
|
|
1308
1347
|
eventListenerOptions
|
|
1309
1348
|
);
|
|
1349
|
+
shared.tryOnMounted(() => {
|
|
1350
|
+
const _element = shared.toValue(element);
|
|
1351
|
+
if (!_element)
|
|
1352
|
+
return;
|
|
1353
|
+
setArrivedState(_element);
|
|
1354
|
+
});
|
|
1310
1355
|
useEventListener(
|
|
1311
1356
|
element,
|
|
1312
1357
|
"scrollend",
|
|
@@ -1665,6 +1710,9 @@ function useMutationObserver(target, callback, options = {}) {
|
|
|
1665
1710
|
},
|
|
1666
1711
|
{ immediate: true }
|
|
1667
1712
|
);
|
|
1713
|
+
const takeRecords = () => {
|
|
1714
|
+
return observer == null ? void 0 : observer.takeRecords();
|
|
1715
|
+
};
|
|
1668
1716
|
const stop = () => {
|
|
1669
1717
|
cleanup();
|
|
1670
1718
|
stopWatch();
|
|
@@ -1672,7 +1720,8 @@ function useMutationObserver(target, callback, options = {}) {
|
|
|
1672
1720
|
shared.tryOnScopeDispose(stop);
|
|
1673
1721
|
return {
|
|
1674
1722
|
isSupported,
|
|
1675
|
-
stop
|
|
1723
|
+
stop,
|
|
1724
|
+
takeRecords
|
|
1676
1725
|
};
|
|
1677
1726
|
}
|
|
1678
1727
|
|
|
@@ -1840,6 +1889,7 @@ function preventDefault(rawEvent) {
|
|
|
1840
1889
|
e.preventDefault();
|
|
1841
1890
|
return false;
|
|
1842
1891
|
}
|
|
1892
|
+
const elInitialOverflow = /* @__PURE__ */ new WeakMap();
|
|
1843
1893
|
function useScrollLock(element, initialState = false) {
|
|
1844
1894
|
const isLocked = vueDemi.ref(initialState);
|
|
1845
1895
|
let stopTouchMoveListener = null;
|
|
@@ -1848,7 +1898,8 @@ function useScrollLock(element, initialState = false) {
|
|
|
1848
1898
|
const target = resolveElement(shared.toValue(el));
|
|
1849
1899
|
if (target) {
|
|
1850
1900
|
const ele = target;
|
|
1851
|
-
|
|
1901
|
+
if (!elInitialOverflow.get(ele))
|
|
1902
|
+
elInitialOverflow.set(ele, initialOverflow);
|
|
1852
1903
|
if (isLocked.value)
|
|
1853
1904
|
ele.style.overflow = "hidden";
|
|
1854
1905
|
}
|
|
@@ -1873,11 +1924,13 @@ function useScrollLock(element, initialState = false) {
|
|
|
1873
1924
|
isLocked.value = true;
|
|
1874
1925
|
};
|
|
1875
1926
|
const unlock = () => {
|
|
1927
|
+
var _a;
|
|
1876
1928
|
const el = resolveElement(shared.toValue(element));
|
|
1877
1929
|
if (!el || !isLocked.value)
|
|
1878
1930
|
return;
|
|
1879
1931
|
shared.isIOS && (stopTouchMoveListener == null ? void 0 : stopTouchMoveListener());
|
|
1880
|
-
el.style.overflow =
|
|
1932
|
+
el.style.overflow = (_a = elInitialOverflow.get(el)) != null ? _a : "";
|
|
1933
|
+
elInitialOverflow.delete(el);
|
|
1881
1934
|
isLocked.value = false;
|
|
1882
1935
|
};
|
|
1883
1936
|
shared.tryOnScopeDispose(unlock);
|
|
@@ -1943,7 +1996,8 @@ const UseVirtualList = /* @__PURE__ */ /* #__PURE__ */ vueDemi.defineComponent({
|
|
|
1943
1996
|
const { list: listRef } = vueDemi.toRefs(props);
|
|
1944
1997
|
const { list, containerProps, wrapperProps, scrollTo } = core.useVirtualList(listRef, props.options);
|
|
1945
1998
|
expose({ scrollTo });
|
|
1946
|
-
typeof containerProps.style === "object" && !Array.isArray(containerProps.style)
|
|
1999
|
+
if (containerProps.style && typeof containerProps.style === "object" && !Array.isArray(containerProps.style))
|
|
2000
|
+
containerProps.style.height = props.height || "300px";
|
|
1947
2001
|
return () => vueDemi.h("div", { ...containerProps }, [
|
|
1948
2002
|
vueDemi.h("div", { ...wrapperProps.value }, list.value.map((item) => vueDemi.h("div", { style: { overFlow: "hidden", height: item.height } }, slots.default ? slots.default(item) : "Please set content!")))
|
|
1949
2003
|
]);
|
|
@@ -1980,6 +2034,7 @@ exports.OnLongPress = OnLongPress;
|
|
|
1980
2034
|
exports.UseActiveElement = UseActiveElement;
|
|
1981
2035
|
exports.UseBattery = UseBattery;
|
|
1982
2036
|
exports.UseBrowserLocation = UseBrowserLocation;
|
|
2037
|
+
exports.UseClipboard = UseClipboard;
|
|
1983
2038
|
exports.UseColorMode = UseColorMode;
|
|
1984
2039
|
exports.UseDark = UseDark;
|
|
1985
2040
|
exports.UseDeviceMotion = UseDeviceMotion;
|
package/index.d.cts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as vue_demi from 'vue-demi';
|
|
2
2
|
import { ComponentPublicInstance, ObjectDirective, Ref, UnwrapNestedRefs, ComputedRef, FunctionDirective } from 'vue-demi';
|
|
3
3
|
import { MaybeRef, MaybeRefOrGetter, ConfigurableEventFilter, ConfigurableFlush, Awaitable } from '@vueuse/shared';
|
|
4
|
-
import { UseDarkOptions, UseDevicesListOptions, UseDraggableOptions, ElementSize as ElementSize$1, UseGeolocationOptions, UseIdleOptions, UseMouseOptions, MouseInElementOptions, MousePressedOptions, UseNowOptions, UsePointerOptions, UseTimeAgoOptions, UseTimestampOptions, UseVirtualListOptions, UseWindowSizeOptions } from '@vueuse/core';
|
|
4
|
+
import { UseClipboardOptions, UseDarkOptions, UseDevicesListOptions, UseDraggableOptions, ElementSize as ElementSize$1, UseGeolocationOptions, UseIdleOptions, UseMouseOptions, MouseInElementOptions, MousePressedOptions, UseNowOptions, UsePointerOptions, UseTimeAgoOptions, UseTimestampOptions, UseVirtualListOptions, UseWindowSizeOptions } from '@vueuse/core';
|
|
5
5
|
|
|
6
6
|
interface ConfigurableWindow {
|
|
7
7
|
window?: Window;
|
|
@@ -108,6 +108,10 @@ declare const UseBrowserLocation: vue_demi.DefineComponent<{}, () => vue_demi.VN
|
|
|
108
108
|
[key: string]: any;
|
|
109
109
|
}>[] | undefined, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, {}, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<vue_demi.ExtractPropTypes<{}>>, {}, {}>;
|
|
110
110
|
|
|
111
|
+
interface UseClipboardProps<Source = string> extends UseClipboardOptions<Source> {
|
|
112
|
+
}
|
|
113
|
+
declare const UseClipboard: vue_demi.DefineComponent<UseClipboardProps<string>, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, {}, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<UseClipboardProps<string>>, {}, {}>;
|
|
114
|
+
|
|
111
115
|
interface StorageLike {
|
|
112
116
|
getItem(key: string): string | null;
|
|
113
117
|
setItem(key: string, value: string): void;
|
|
@@ -162,6 +166,12 @@ interface UseStorageOptions<T> extends ConfigurableEventFilter, ConfigurableWind
|
|
|
162
166
|
* @default false
|
|
163
167
|
*/
|
|
164
168
|
shallow?: boolean;
|
|
169
|
+
/**
|
|
170
|
+
* Wait for the component to be mounted before reading the storage.
|
|
171
|
+
*
|
|
172
|
+
* @default false
|
|
173
|
+
*/
|
|
174
|
+
initOnMounted?: boolean;
|
|
165
175
|
}
|
|
166
176
|
|
|
167
177
|
type BasicColorMode = 'light' | 'dark';
|
|
@@ -301,6 +311,7 @@ interface ElementSize {
|
|
|
301
311
|
declare function useElementSize(target: MaybeComputedElementRef, initialSize?: ElementSize, options?: UseResizeObserverOptions): {
|
|
302
312
|
width: vue_demi.Ref<number>;
|
|
303
313
|
height: vue_demi.Ref<number>;
|
|
314
|
+
stop: () => void;
|
|
304
315
|
};
|
|
305
316
|
|
|
306
317
|
type RemoveFirstFromTuple<T extends any[]> = T['length'] extends 0 ? undefined : (((...b: T) => void) extends (a: any, ...b: infer I) => void ? I : []);
|
|
@@ -644,4 +655,4 @@ declare const UseWindowFocus: vue_demi.DefineComponent<{}, () => vue_demi.VNode<
|
|
|
644
655
|
|
|
645
656
|
declare const UseWindowSize: vue_demi.DefineComponent<UseWindowSizeOptions, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, {}, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<UseWindowSizeOptions>, {}, {}>;
|
|
646
657
|
|
|
647
|
-
export { OnClickOutside, type OnClickOutsideProps, OnLongPress, type OnLongPressProps, UseActiveElement, UseBattery, UseBrowserLocation, UseColorMode, UseDark, UseDeviceMotion, UseDeviceOrientation, UseDevicePixelRatio, UseDevicesList, UseDocumentVisibility, UseDraggable, type UseDraggableProps, UseElementBounding, UseElementSize, UseElementVisibility, UseEyeDropper, UseFullscreen, UseGeolocation, UseIdle, UseImage, UseMouse, UseMouseInElement, UseMousePressed, UseNetwork, UseNow, UseObjectUrl, type UseObjectUrlProps, UseOffsetPagination, UseOnline, UsePageLeave, UsePointer, UsePointerLock, UsePreferredColorScheme, UsePreferredContrast, UsePreferredDark, UsePreferredLanguages, UsePreferredReducedMotion, UseScreenSafeArea, UseTimeAgo, UseTimestamp, UseVirtualList, type UseVirtualListProps, UseWindowFocus, UseWindowSize, vOnClickOutside as VOnClickOutside, vOnLongPress as VOnLongPress, vElementHover, vElementSize, vElementVisibility, vInfiniteScroll, vIntersectionObserver, vOnClickOutside, vOnKeyStroke, vOnLongPress, vScroll, vScrollLock };
|
|
658
|
+
export { OnClickOutside, type OnClickOutsideProps, OnLongPress, type OnLongPressProps, UseActiveElement, UseBattery, UseBrowserLocation, UseClipboard, UseColorMode, UseDark, UseDeviceMotion, UseDeviceOrientation, UseDevicePixelRatio, UseDevicesList, UseDocumentVisibility, UseDraggable, type UseDraggableProps, UseElementBounding, UseElementSize, UseElementVisibility, UseEyeDropper, UseFullscreen, UseGeolocation, UseIdle, UseImage, UseMouse, UseMouseInElement, UseMousePressed, UseNetwork, UseNow, UseObjectUrl, type UseObjectUrlProps, UseOffsetPagination, UseOnline, UsePageLeave, UsePointer, UsePointerLock, UsePreferredColorScheme, UsePreferredContrast, UsePreferredDark, UsePreferredLanguages, UsePreferredReducedMotion, UseScreenSafeArea, UseTimeAgo, UseTimestamp, UseVirtualList, type UseVirtualListProps, UseWindowFocus, UseWindowSize, vOnClickOutside as VOnClickOutside, vOnLongPress as VOnLongPress, vElementHover, vElementSize, vElementVisibility, vInfiniteScroll, vIntersectionObserver, vOnClickOutside, vOnKeyStroke, vOnLongPress, vScroll, vScrollLock };
|
package/index.d.mts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as vue_demi from 'vue-demi';
|
|
2
2
|
import { ComponentPublicInstance, ObjectDirective, Ref, UnwrapNestedRefs, ComputedRef, FunctionDirective } from 'vue-demi';
|
|
3
3
|
import { MaybeRef, MaybeRefOrGetter, ConfigurableEventFilter, ConfigurableFlush, Awaitable } from '@vueuse/shared';
|
|
4
|
-
import { UseDarkOptions, UseDevicesListOptions, UseDraggableOptions, ElementSize as ElementSize$1, UseGeolocationOptions, UseIdleOptions, UseMouseOptions, MouseInElementOptions, MousePressedOptions, UseNowOptions, UsePointerOptions, UseTimeAgoOptions, UseTimestampOptions, UseVirtualListOptions, UseWindowSizeOptions } from '@vueuse/core';
|
|
4
|
+
import { UseClipboardOptions, UseDarkOptions, UseDevicesListOptions, UseDraggableOptions, ElementSize as ElementSize$1, UseGeolocationOptions, UseIdleOptions, UseMouseOptions, MouseInElementOptions, MousePressedOptions, UseNowOptions, UsePointerOptions, UseTimeAgoOptions, UseTimestampOptions, UseVirtualListOptions, UseWindowSizeOptions } from '@vueuse/core';
|
|
5
5
|
|
|
6
6
|
interface ConfigurableWindow {
|
|
7
7
|
window?: Window;
|
|
@@ -108,6 +108,10 @@ declare const UseBrowserLocation: vue_demi.DefineComponent<{}, () => vue_demi.VN
|
|
|
108
108
|
[key: string]: any;
|
|
109
109
|
}>[] | undefined, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, {}, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<vue_demi.ExtractPropTypes<{}>>, {}, {}>;
|
|
110
110
|
|
|
111
|
+
interface UseClipboardProps<Source = string> extends UseClipboardOptions<Source> {
|
|
112
|
+
}
|
|
113
|
+
declare const UseClipboard: vue_demi.DefineComponent<UseClipboardProps<string>, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, {}, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<UseClipboardProps<string>>, {}, {}>;
|
|
114
|
+
|
|
111
115
|
interface StorageLike {
|
|
112
116
|
getItem(key: string): string | null;
|
|
113
117
|
setItem(key: string, value: string): void;
|
|
@@ -162,6 +166,12 @@ interface UseStorageOptions<T> extends ConfigurableEventFilter, ConfigurableWind
|
|
|
162
166
|
* @default false
|
|
163
167
|
*/
|
|
164
168
|
shallow?: boolean;
|
|
169
|
+
/**
|
|
170
|
+
* Wait for the component to be mounted before reading the storage.
|
|
171
|
+
*
|
|
172
|
+
* @default false
|
|
173
|
+
*/
|
|
174
|
+
initOnMounted?: boolean;
|
|
165
175
|
}
|
|
166
176
|
|
|
167
177
|
type BasicColorMode = 'light' | 'dark';
|
|
@@ -301,6 +311,7 @@ interface ElementSize {
|
|
|
301
311
|
declare function useElementSize(target: MaybeComputedElementRef, initialSize?: ElementSize, options?: UseResizeObserverOptions): {
|
|
302
312
|
width: vue_demi.Ref<number>;
|
|
303
313
|
height: vue_demi.Ref<number>;
|
|
314
|
+
stop: () => void;
|
|
304
315
|
};
|
|
305
316
|
|
|
306
317
|
type RemoveFirstFromTuple<T extends any[]> = T['length'] extends 0 ? undefined : (((...b: T) => void) extends (a: any, ...b: infer I) => void ? I : []);
|
|
@@ -644,4 +655,4 @@ declare const UseWindowFocus: vue_demi.DefineComponent<{}, () => vue_demi.VNode<
|
|
|
644
655
|
|
|
645
656
|
declare const UseWindowSize: vue_demi.DefineComponent<UseWindowSizeOptions, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, {}, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<UseWindowSizeOptions>, {}, {}>;
|
|
646
657
|
|
|
647
|
-
export { OnClickOutside, type OnClickOutsideProps, OnLongPress, type OnLongPressProps, UseActiveElement, UseBattery, UseBrowserLocation, UseColorMode, UseDark, UseDeviceMotion, UseDeviceOrientation, UseDevicePixelRatio, UseDevicesList, UseDocumentVisibility, UseDraggable, type UseDraggableProps, UseElementBounding, UseElementSize, UseElementVisibility, UseEyeDropper, UseFullscreen, UseGeolocation, UseIdle, UseImage, UseMouse, UseMouseInElement, UseMousePressed, UseNetwork, UseNow, UseObjectUrl, type UseObjectUrlProps, UseOffsetPagination, UseOnline, UsePageLeave, UsePointer, UsePointerLock, UsePreferredColorScheme, UsePreferredContrast, UsePreferredDark, UsePreferredLanguages, UsePreferredReducedMotion, UseScreenSafeArea, UseTimeAgo, UseTimestamp, UseVirtualList, type UseVirtualListProps, UseWindowFocus, UseWindowSize, vOnClickOutside as VOnClickOutside, vOnLongPress as VOnLongPress, vElementHover, vElementSize, vElementVisibility, vInfiniteScroll, vIntersectionObserver, vOnClickOutside, vOnKeyStroke, vOnLongPress, vScroll, vScrollLock };
|
|
658
|
+
export { OnClickOutside, type OnClickOutsideProps, OnLongPress, type OnLongPressProps, UseActiveElement, UseBattery, UseBrowserLocation, UseClipboard, UseColorMode, UseDark, UseDeviceMotion, UseDeviceOrientation, UseDevicePixelRatio, UseDevicesList, UseDocumentVisibility, UseDraggable, type UseDraggableProps, UseElementBounding, UseElementSize, UseElementVisibility, UseEyeDropper, UseFullscreen, UseGeolocation, UseIdle, UseImage, UseMouse, UseMouseInElement, UseMousePressed, UseNetwork, UseNow, UseObjectUrl, type UseObjectUrlProps, UseOffsetPagination, UseOnline, UsePageLeave, UsePointer, UsePointerLock, UsePreferredColorScheme, UsePreferredContrast, UsePreferredDark, UsePreferredLanguages, UsePreferredReducedMotion, UseScreenSafeArea, UseTimeAgo, UseTimestamp, UseVirtualList, type UseVirtualListProps, UseWindowFocus, UseWindowSize, vOnClickOutside as VOnClickOutside, vOnLongPress as VOnLongPress, vElementHover, vElementSize, vElementVisibility, vInfiniteScroll, vIntersectionObserver, vOnClickOutside, vOnKeyStroke, vOnLongPress, vScroll, vScrollLock };
|
package/index.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as vue_demi from 'vue-demi';
|
|
2
2
|
import { ComponentPublicInstance, ObjectDirective, Ref, UnwrapNestedRefs, ComputedRef, FunctionDirective } from 'vue-demi';
|
|
3
3
|
import { MaybeRef, MaybeRefOrGetter, ConfigurableEventFilter, ConfigurableFlush, Awaitable } from '@vueuse/shared';
|
|
4
|
-
import { UseDarkOptions, UseDevicesListOptions, UseDraggableOptions, ElementSize as ElementSize$1, UseGeolocationOptions, UseIdleOptions, UseMouseOptions, MouseInElementOptions, MousePressedOptions, UseNowOptions, UsePointerOptions, UseTimeAgoOptions, UseTimestampOptions, UseVirtualListOptions, UseWindowSizeOptions } from '@vueuse/core';
|
|
4
|
+
import { UseClipboardOptions, UseDarkOptions, UseDevicesListOptions, UseDraggableOptions, ElementSize as ElementSize$1, UseGeolocationOptions, UseIdleOptions, UseMouseOptions, MouseInElementOptions, MousePressedOptions, UseNowOptions, UsePointerOptions, UseTimeAgoOptions, UseTimestampOptions, UseVirtualListOptions, UseWindowSizeOptions } from '@vueuse/core';
|
|
5
5
|
|
|
6
6
|
interface ConfigurableWindow {
|
|
7
7
|
window?: Window;
|
|
@@ -108,6 +108,10 @@ declare const UseBrowserLocation: vue_demi.DefineComponent<{}, () => vue_demi.VN
|
|
|
108
108
|
[key: string]: any;
|
|
109
109
|
}>[] | undefined, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, {}, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<vue_demi.ExtractPropTypes<{}>>, {}, {}>;
|
|
110
110
|
|
|
111
|
+
interface UseClipboardProps<Source = string> extends UseClipboardOptions<Source> {
|
|
112
|
+
}
|
|
113
|
+
declare const UseClipboard: vue_demi.DefineComponent<UseClipboardProps<string>, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, {}, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<UseClipboardProps<string>>, {}, {}>;
|
|
114
|
+
|
|
111
115
|
interface StorageLike {
|
|
112
116
|
getItem(key: string): string | null;
|
|
113
117
|
setItem(key: string, value: string): void;
|
|
@@ -162,6 +166,12 @@ interface UseStorageOptions<T> extends ConfigurableEventFilter, ConfigurableWind
|
|
|
162
166
|
* @default false
|
|
163
167
|
*/
|
|
164
168
|
shallow?: boolean;
|
|
169
|
+
/**
|
|
170
|
+
* Wait for the component to be mounted before reading the storage.
|
|
171
|
+
*
|
|
172
|
+
* @default false
|
|
173
|
+
*/
|
|
174
|
+
initOnMounted?: boolean;
|
|
165
175
|
}
|
|
166
176
|
|
|
167
177
|
type BasicColorMode = 'light' | 'dark';
|
|
@@ -301,6 +311,7 @@ interface ElementSize {
|
|
|
301
311
|
declare function useElementSize(target: MaybeComputedElementRef, initialSize?: ElementSize, options?: UseResizeObserverOptions): {
|
|
302
312
|
width: vue_demi.Ref<number>;
|
|
303
313
|
height: vue_demi.Ref<number>;
|
|
314
|
+
stop: () => void;
|
|
304
315
|
};
|
|
305
316
|
|
|
306
317
|
type RemoveFirstFromTuple<T extends any[]> = T['length'] extends 0 ? undefined : (((...b: T) => void) extends (a: any, ...b: infer I) => void ? I : []);
|
|
@@ -644,4 +655,4 @@ declare const UseWindowFocus: vue_demi.DefineComponent<{}, () => vue_demi.VNode<
|
|
|
644
655
|
|
|
645
656
|
declare const UseWindowSize: vue_demi.DefineComponent<UseWindowSizeOptions, {}, {}, {}, {}, vue_demi.ComponentOptionsMixin, vue_demi.ComponentOptionsMixin, {}, string, vue_demi.VNodeProps & vue_demi.AllowedComponentProps & vue_demi.ComponentCustomProps, Readonly<UseWindowSizeOptions>, {}, {}>;
|
|
646
657
|
|
|
647
|
-
export { OnClickOutside, type OnClickOutsideProps, OnLongPress, type OnLongPressProps, UseActiveElement, UseBattery, UseBrowserLocation, UseColorMode, UseDark, UseDeviceMotion, UseDeviceOrientation, UseDevicePixelRatio, UseDevicesList, UseDocumentVisibility, UseDraggable, type UseDraggableProps, UseElementBounding, UseElementSize, UseElementVisibility, UseEyeDropper, UseFullscreen, UseGeolocation, UseIdle, UseImage, UseMouse, UseMouseInElement, UseMousePressed, UseNetwork, UseNow, UseObjectUrl, type UseObjectUrlProps, UseOffsetPagination, UseOnline, UsePageLeave, UsePointer, UsePointerLock, UsePreferredColorScheme, UsePreferredContrast, UsePreferredDark, UsePreferredLanguages, UsePreferredReducedMotion, UseScreenSafeArea, UseTimeAgo, UseTimestamp, UseVirtualList, type UseVirtualListProps, UseWindowFocus, UseWindowSize, vOnClickOutside as VOnClickOutside, vOnLongPress as VOnLongPress, vElementHover, vElementSize, vElementVisibility, vInfiniteScroll, vIntersectionObserver, vOnClickOutside, vOnKeyStroke, vOnLongPress, vScroll, vScrollLock };
|
|
658
|
+
export { OnClickOutside, type OnClickOutsideProps, OnLongPress, type OnLongPressProps, UseActiveElement, UseBattery, UseBrowserLocation, UseClipboard, UseColorMode, UseDark, UseDeviceMotion, UseDeviceOrientation, UseDevicePixelRatio, UseDevicesList, UseDocumentVisibility, UseDraggable, type UseDraggableProps, UseElementBounding, UseElementSize, UseElementVisibility, UseEyeDropper, UseFullscreen, UseGeolocation, UseIdle, UseImage, UseMouse, UseMouseInElement, UseMousePressed, UseNetwork, UseNow, UseObjectUrl, type UseObjectUrlProps, UseOffsetPagination, UseOnline, UsePageLeave, UsePointer, UsePointerLock, UsePreferredColorScheme, UsePreferredContrast, UsePreferredDark, UsePreferredLanguages, UsePreferredReducedMotion, UseScreenSafeArea, UseTimeAgo, UseTimestamp, UseVirtualList, type UseVirtualListProps, UseWindowFocus, UseWindowSize, vOnClickOutside as VOnClickOutside, vOnLongPress as VOnLongPress, vElementHover, vElementSize, vElementVisibility, vInfiniteScroll, vIntersectionObserver, vOnClickOutside, vOnKeyStroke, vOnLongPress, vScroll, vScrollLock };
|
package/index.iife.js
CHANGED
|
@@ -227,8 +227,7 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
227
227
|
useEventListener(window, "click", listener, { passive: true, capture }),
|
|
228
228
|
useEventListener(window, "pointerdown", (e) => {
|
|
229
229
|
const el = unrefElement(target);
|
|
230
|
-
|
|
231
|
-
shouldListen = !e.composedPath().includes(el) && !shouldIgnore(e);
|
|
230
|
+
shouldListen = !shouldIgnore(e) && !!(el && !e.composedPath().includes(el));
|
|
232
231
|
}, { passive: true }),
|
|
233
232
|
detectIframe && useEventListener(window, "blur", (event) => {
|
|
234
233
|
setTimeout(() => {
|
|
@@ -351,8 +350,12 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
351
350
|
capture: (_a = options == null ? void 0 : options.modifiers) == null ? void 0 : _a.capture,
|
|
352
351
|
once: (_b = options == null ? void 0 : options.modifiers) == null ? void 0 : _b.once
|
|
353
352
|
};
|
|
354
|
-
|
|
355
|
-
|
|
353
|
+
const cleanup = [
|
|
354
|
+
useEventListener(elementRef, "pointerdown", onDown, listenerOptions),
|
|
355
|
+
useEventListener(elementRef, ["pointerup", "pointerleave"], clear, listenerOptions)
|
|
356
|
+
].filter(Boolean);
|
|
357
|
+
const stop = () => cleanup.forEach((fn) => fn());
|
|
358
|
+
return stop;
|
|
356
359
|
}
|
|
357
360
|
|
|
358
361
|
const OnLongPress = /* @__PURE__ */ /* #__PURE__ */ vueDemi.defineComponent({
|
|
@@ -419,6 +422,24 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
419
422
|
}
|
|
420
423
|
});
|
|
421
424
|
|
|
425
|
+
const UseClipboard = /* @__PURE__ */ /* #__PURE__ */ vueDemi.defineComponent({
|
|
426
|
+
name: "UseClipboard",
|
|
427
|
+
props: [
|
|
428
|
+
"source",
|
|
429
|
+
"read",
|
|
430
|
+
"navigator",
|
|
431
|
+
"copiedDuring",
|
|
432
|
+
"legacy"
|
|
433
|
+
],
|
|
434
|
+
setup(props, { slots }) {
|
|
435
|
+
const data = vueDemi.reactive(core.useClipboard(props));
|
|
436
|
+
return () => {
|
|
437
|
+
var _a;
|
|
438
|
+
return (_a = slots.default) == null ? void 0 : _a.call(slots, data);
|
|
439
|
+
};
|
|
440
|
+
}
|
|
441
|
+
});
|
|
442
|
+
|
|
422
443
|
const _global = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
|
|
423
444
|
const globalKey = "__vueuse_ssr_handlers__";
|
|
424
445
|
const handlers = /* @__PURE__ */ getHandlers();
|
|
@@ -483,9 +504,10 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
483
504
|
eventFilter,
|
|
484
505
|
onError = (e) => {
|
|
485
506
|
console.error(e);
|
|
486
|
-
}
|
|
507
|
+
},
|
|
508
|
+
initOnMounted
|
|
487
509
|
} = options;
|
|
488
|
-
const data = (shallow ? vueDemi.shallowRef : vueDemi.ref)(defaults);
|
|
510
|
+
const data = (shallow ? vueDemi.shallowRef : vueDemi.ref)(typeof defaults === "function" ? defaults() : defaults);
|
|
489
511
|
if (!storage) {
|
|
490
512
|
try {
|
|
491
513
|
storage = getSSRHandler("getDefaultStorage", () => {
|
|
@@ -507,10 +529,15 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
507
529
|
{ flush, deep, eventFilter }
|
|
508
530
|
);
|
|
509
531
|
if (window && listenToStorageChanges) {
|
|
510
|
-
|
|
511
|
-
|
|
532
|
+
shared.tryOnMounted(() => {
|
|
533
|
+
useEventListener(window, "storage", update);
|
|
534
|
+
useEventListener(window, customStorageEventName, updateFromCustomEvent);
|
|
535
|
+
if (initOnMounted)
|
|
536
|
+
update();
|
|
537
|
+
});
|
|
512
538
|
}
|
|
513
|
-
|
|
539
|
+
if (!initOnMounted)
|
|
540
|
+
update();
|
|
514
541
|
return data;
|
|
515
542
|
function write(v) {
|
|
516
543
|
try {
|
|
@@ -966,7 +993,7 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
966
993
|
});
|
|
967
994
|
const width = vueDemi.ref(initialSize.width);
|
|
968
995
|
const height = vueDemi.ref(initialSize.height);
|
|
969
|
-
useResizeObserver(
|
|
996
|
+
const { stop: stop1 } = useResizeObserver(
|
|
970
997
|
target,
|
|
971
998
|
([entry]) => {
|
|
972
999
|
const boxSize = box === "border-box" ? entry.borderBoxSize : box === "content-box" ? entry.contentBoxSize : entry.devicePixelContentBoxSize;
|
|
@@ -990,16 +1017,28 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
990
1017
|
},
|
|
991
1018
|
options
|
|
992
1019
|
);
|
|
993
|
-
|
|
1020
|
+
shared.tryOnMounted(() => {
|
|
1021
|
+
const ele = unrefElement(target);
|
|
1022
|
+
if (ele) {
|
|
1023
|
+
width.value = "offsetWidth" in ele ? ele.offsetWidth : initialSize.width;
|
|
1024
|
+
height.value = "offsetHeight" in ele ? ele.offsetHeight : initialSize.height;
|
|
1025
|
+
}
|
|
1026
|
+
});
|
|
1027
|
+
const stop2 = vueDemi.watch(
|
|
994
1028
|
() => unrefElement(target),
|
|
995
1029
|
(ele) => {
|
|
996
1030
|
width.value = ele ? initialSize.width : 0;
|
|
997
1031
|
height.value = ele ? initialSize.height : 0;
|
|
998
1032
|
}
|
|
999
1033
|
);
|
|
1034
|
+
function stop() {
|
|
1035
|
+
stop1();
|
|
1036
|
+
stop2();
|
|
1037
|
+
}
|
|
1000
1038
|
return {
|
|
1001
1039
|
width,
|
|
1002
|
-
height
|
|
1040
|
+
height,
|
|
1041
|
+
stop
|
|
1003
1042
|
};
|
|
1004
1043
|
}
|
|
1005
1044
|
|
|
@@ -1420,6 +1459,12 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
1420
1459
|
throttle ? shared.useThrottleFn(onScrollHandler, throttle, true, false) : onScrollHandler,
|
|
1421
1460
|
eventListenerOptions
|
|
1422
1461
|
);
|
|
1462
|
+
shared.tryOnMounted(() => {
|
|
1463
|
+
const _element = shared.toValue(element);
|
|
1464
|
+
if (!_element)
|
|
1465
|
+
return;
|
|
1466
|
+
setArrivedState(_element);
|
|
1467
|
+
});
|
|
1423
1468
|
useEventListener(
|
|
1424
1469
|
element,
|
|
1425
1470
|
"scrollend",
|
|
@@ -1778,6 +1823,9 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
1778
1823
|
},
|
|
1779
1824
|
{ immediate: true }
|
|
1780
1825
|
);
|
|
1826
|
+
const takeRecords = () => {
|
|
1827
|
+
return observer == null ? void 0 : observer.takeRecords();
|
|
1828
|
+
};
|
|
1781
1829
|
const stop = () => {
|
|
1782
1830
|
cleanup();
|
|
1783
1831
|
stopWatch();
|
|
@@ -1785,7 +1833,8 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
1785
1833
|
shared.tryOnScopeDispose(stop);
|
|
1786
1834
|
return {
|
|
1787
1835
|
isSupported,
|
|
1788
|
-
stop
|
|
1836
|
+
stop,
|
|
1837
|
+
takeRecords
|
|
1789
1838
|
};
|
|
1790
1839
|
}
|
|
1791
1840
|
|
|
@@ -1953,6 +2002,7 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
1953
2002
|
e.preventDefault();
|
|
1954
2003
|
return false;
|
|
1955
2004
|
}
|
|
2005
|
+
const elInitialOverflow = /* @__PURE__ */ new WeakMap();
|
|
1956
2006
|
function useScrollLock(element, initialState = false) {
|
|
1957
2007
|
const isLocked = vueDemi.ref(initialState);
|
|
1958
2008
|
let stopTouchMoveListener = null;
|
|
@@ -1961,7 +2011,8 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
1961
2011
|
const target = resolveElement(shared.toValue(el));
|
|
1962
2012
|
if (target) {
|
|
1963
2013
|
const ele = target;
|
|
1964
|
-
|
|
2014
|
+
if (!elInitialOverflow.get(ele))
|
|
2015
|
+
elInitialOverflow.set(ele, initialOverflow);
|
|
1965
2016
|
if (isLocked.value)
|
|
1966
2017
|
ele.style.overflow = "hidden";
|
|
1967
2018
|
}
|
|
@@ -1986,11 +2037,13 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
1986
2037
|
isLocked.value = true;
|
|
1987
2038
|
};
|
|
1988
2039
|
const unlock = () => {
|
|
2040
|
+
var _a;
|
|
1989
2041
|
const el = resolveElement(shared.toValue(element));
|
|
1990
2042
|
if (!el || !isLocked.value)
|
|
1991
2043
|
return;
|
|
1992
2044
|
shared.isIOS && (stopTouchMoveListener == null ? void 0 : stopTouchMoveListener());
|
|
1993
|
-
el.style.overflow =
|
|
2045
|
+
el.style.overflow = (_a = elInitialOverflow.get(el)) != null ? _a : "";
|
|
2046
|
+
elInitialOverflow.delete(el);
|
|
1994
2047
|
isLocked.value = false;
|
|
1995
2048
|
};
|
|
1996
2049
|
shared.tryOnScopeDispose(unlock);
|
|
@@ -2056,7 +2109,8 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
2056
2109
|
const { list: listRef } = vueDemi.toRefs(props);
|
|
2057
2110
|
const { list, containerProps, wrapperProps, scrollTo } = core.useVirtualList(listRef, props.options);
|
|
2058
2111
|
expose({ scrollTo });
|
|
2059
|
-
typeof containerProps.style === "object" && !Array.isArray(containerProps.style)
|
|
2112
|
+
if (containerProps.style && typeof containerProps.style === "object" && !Array.isArray(containerProps.style))
|
|
2113
|
+
containerProps.style.height = props.height || "300px";
|
|
2060
2114
|
return () => vueDemi.h("div", { ...containerProps }, [
|
|
2061
2115
|
vueDemi.h("div", { ...wrapperProps.value }, list.value.map((item) => vueDemi.h("div", { style: { overFlow: "hidden", height: item.height } }, slots.default ? slots.default(item) : "Please set content!")))
|
|
2062
2116
|
]);
|
|
@@ -2093,6 +2147,7 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
2093
2147
|
exports.UseActiveElement = UseActiveElement;
|
|
2094
2148
|
exports.UseBattery = UseBattery;
|
|
2095
2149
|
exports.UseBrowserLocation = UseBrowserLocation;
|
|
2150
|
+
exports.UseClipboard = UseClipboard;
|
|
2096
2151
|
exports.UseColorMode = UseColorMode;
|
|
2097
2152
|
exports.UseDark = UseDark;
|
|
2098
2153
|
exports.UseDeviceMotion = UseDeviceMotion;
|
package/index.iife.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var VueDemi=function(s,o,m){if(s.install)return s;if(!o)return console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`."),s;if(o.version.slice(0,4)==="2.7."){let U=function(S,L){var T,W={},B={config:o.config,use:o.use.bind(o),mixin:o.mixin.bind(o),component:o.component.bind(o),provide:function(N,I){return W[N]=I,this},directive:function(N,I){return I?(o.directive(N,I),B):o.directive(N)},mount:function(N,I){return T||(T=new o(Object.assign({propsData:L},S,{provide:Object.assign(W,S.provide)})),T.$mount(N,I),T)},unmount:function(){T&&(T.$destroy(),T=void 0)}};return B};var x=U;for(var u in o)s[u]=o[u];s.isVue2=!0,s.isVue3=!1,s.install=function(){},s.Vue=o,s.Vue2=o,s.version=o.version,s.warn=o.util.warn,s.hasInjectionContext=()=>!!s.getCurrentInstance(),s.createApp=U}else if(o.version.slice(0,2)==="2.")if(m){for(var u in m)s[u]=m[u];s.isVue2=!0,s.isVue3=!1,s.install=function(){},s.Vue=o,s.Vue2=o,s.version=o.version,s.hasInjectionContext=()=>!!s.getCurrentInstance()}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.");else if(o.version.slice(0,2)==="3."){for(var u in o)s[u]=o[u];s.isVue2=!1,s.isVue3=!0,s.install=function(){},s.Vue=o,s.Vue2=void 0,s.version=o.version,s.set=function(U,S,L){return Array.isArray(U)?(U.length=Math.max(U.length,S),U.splice(S,1,L),L):(U[S]=L,L)},s.del=function(U,S){if(Array.isArray(U)){U.splice(S,1);return}delete U[S]}}else console.error("[vue-demi] Vue version "+o.version+" is unsupported.");return s}(this.VueDemi=this.VueDemi||(typeof VueDemi<"u"?VueDemi:{}),this.Vue||(typeof Vue<"u"?Vue:void 0),this.VueCompositionAPI||(typeof VueCompositionAPI<"u"?VueCompositionAPI:void 0));(function(s,o,m,u){"use strict";const x=o.defineComponent({name:"OnClickOutside",props:["as","options"],emits:["trigger"],setup(e,{slots:t,emit:n}){const r=o.ref();return m.onClickOutside(r,a=>{n("trigger",a)},e.options),()=>{if(t.default)return o.h(e.as||"div",{ref:r},t.default())}}});function U(e){var t;const n=u.toValue(e);return(t=n?.$el)!=null?t:n}const S=u.isClient?window:void 0;function L(...e){let t,n,r,a;if(typeof e[0]=="string"||Array.isArray(e[0])?([n,r,a]=e,t=S):[t,n,r,a]=e,!t)return u.noop;Array.isArray(n)||(n=[n]),Array.isArray(r)||(r=[r]);const i=[],l=()=>{i.forEach(d=>d()),i.length=0},c=(d,v,g,w)=>(d.addEventListener(v,g,w),()=>d.removeEventListener(v,g,w)),f=o.watch(()=>[U(t),u.toValue(a)],([d,v])=>{if(l(),!d)return;const g=u.isObject(v)?{...v}:v;i.push(...n.flatMap(w=>r.map(y=>c(d,w,y,g))))},{immediate:!0,flush:"post"}),p=()=>{f(),l()};return u.tryOnScopeDispose(p),p}let T=!1;function W(e,t,n={}){const{window:r=S,ignore:a=[],capture:i=!0,detectIframe:l=!1}=n;if(!r)return;u.isIOS&&!T&&(T=!0,Array.from(r.document.body.children).forEach(g=>g.addEventListener("click",u.noop)),r.document.documentElement.addEventListener("click",u.noop));let c=!0;const f=g=>a.some(w=>{if(typeof w=="string")return Array.from(r.document.querySelectorAll(w)).some(y=>y===g.target||g.composedPath().includes(y));{const y=U(w);return y&&(g.target===y||g.composedPath().includes(y))}}),d=[L(r,"click",g=>{const w=U(e);if(!(!w||w===g.target||g.composedPath().includes(w))){if(g.detail===0&&(c=!f(g)),!c){c=!0;return}t(g)}},{passive:!0,capture:i}),L(r,"pointerdown",g=>{const w=U(e);w&&(c=!g.composedPath().includes(w)&&!f(g))},{passive:!0}),l&&L(r,"blur",g=>{setTimeout(()=>{var w;const y=U(e);((w=r.document.activeElement)==null?void 0:w.tagName)==="IFRAME"&&!y?.contains(r.document.activeElement)&&t(g)},0)})].filter(Boolean);return()=>d.forEach(g=>g())}const B={[u.directiveHooks.mounted](e,t){const n=!t.modifiers.bubble;if(typeof t.value=="function")e.__onClickOutside_stop=W(e,t.value,{capture:n});else{const[r,a]=t.value;e.__onClickOutside_stop=W(e,r,Object.assign({capture:n},a))}},[u.directiveHooks.unmounted](e){e.__onClickOutside_stop()}};function N(e){return typeof e=="function"?e:typeof e=="string"?t=>t.key===e:Array.isArray(e)?t=>e.includes(t.key):()=>!0}function I(...e){let t,n,r={};e.length===3?(t=e[0],n=e[1],r=e[2]):e.length===2?typeof e[1]=="object"?(t=!0,n=e[0],r=e[1]):(t=e[0],n=e[1]):(t=!0,n=e[0]);const{target:a=S,eventName:i="keydown",passive:l=!1,dedupe:c=!1}=r,f=N(t);return L(a,i,d=>{d.repeat&&u.toValue(c)||f(d)&&n(d)},l)}const de={[u.directiveHooks.mounted](e,t){var n,r;const a=(r=(n=t.arg)==null?void 0:n.split(","))!=null?r:!0;if(typeof t.value=="function")I(a,t.value,{target:e});else{const[i,l]=t.value;I(a,i,{target:e,...l})}}},pe=500;function $(e,t,n){var r,a;const i=o.computed(()=>U(e));let l;function c(){l&&(clearTimeout(l),l=void 0)}function f(d){var v,g,w,y;(v=n?.modifiers)!=null&&v.self&&d.target!==i.value||(c(),(g=n?.modifiers)!=null&&g.prevent&&d.preventDefault(),(w=n?.modifiers)!=null&&w.stop&&d.stopPropagation(),l=setTimeout(()=>t(d),(y=n?.delay)!=null?y:pe))}const p={capture:(r=n?.modifiers)==null?void 0:r.capture,once:(a=n?.modifiers)==null?void 0:a.once};L(i,"pointerdown",f,p),L(i,["pointerup","pointerleave"],c,p)}const ve=o.defineComponent({name:"OnLongPress",props:["as","options"],emits:["trigger"],setup(e,{slots:t,emit:n}){const r=o.ref();return $(r,a=>{n("trigger",a)},e.options),()=>{if(t.default)return o.h(e.as||"div",{ref:r},t.default())}}}),Z={[u.directiveHooks.mounted](e,t){typeof t.value=="function"?$(e,t.value,{modifiers:t.modifiers}):$(e,...t.value)}},ge=o.defineComponent({name:"UseActiveElement",setup(e,{slots:t}){const n=o.reactive({element:m.useActiveElement()});return()=>{if(t.default)return t.default(n)}}}),me=o.defineComponent({name:"UseBattery",setup(e,{slots:t}){const n=o.reactive(m.useBattery(e));return()=>{if(t.default)return t.default(n)}}}),he=o.defineComponent({name:"UseBrowserLocation",setup(e,{slots:t}){const n=o.reactive(m.useBrowserLocation());return()=>{if(t.default)return t.default(n)}}}),j=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},F="__vueuse_ssr_handlers__",ye=we();function we(){return F in j||(j[F]=j[F]||{}),j[F]}function D(e,t){return ye[e]||t}function Ue(e){return e==null?"any":e instanceof Set?"set":e instanceof Map?"map":e instanceof Date?"date":typeof e=="boolean"?"boolean":typeof e=="string"?"string":typeof e=="object"?"object":Number.isNaN(e)?"any":"number"}const be={boolean:{read:e=>e==="true",write:e=>String(e)},object:{read:e=>JSON.parse(e),write:e=>JSON.stringify(e)},number:{read:e=>Number.parseFloat(e),write:e=>String(e)},any:{read:e=>e,write:e=>String(e)},string:{read:e=>e,write:e=>String(e)},map:{read:e=>new Map(JSON.parse(e)),write:e=>JSON.stringify(Array.from(e.entries()))},set:{read:e=>new Set(JSON.parse(e)),write:e=>JSON.stringify(Array.from(e))},date:{read:e=>new Date(e),write:e=>e.toISOString()}},ee="vueuse-storage";function Se(e,t,n,r={}){var a;const{flush:i="pre",deep:l=!0,listenToStorageChanges:c=!0,writeDefaults:f=!0,mergeDefaults:p=!1,shallow:d,window:v=S,eventFilter:g,onError:w=h=>{console.error(h)}}=r,y=(d?o.shallowRef:o.ref)(t);if(!n)try{n=D("getDefaultStorage",()=>{var h;return(h=S)==null?void 0:h.localStorage})()}catch(h){w(h)}if(!n)return y;const O=u.toValue(t),k=Ue(O),b=(a=r.serializer)!=null?a:be[k],{pause:M,resume:z}=u.pausableWatch(y,()=>E(y.value),{flush:i,deep:l,eventFilter:g});return v&&c&&(L(v,"storage",_),L(v,ee,C)),_(),y;function E(h){try{if(h==null)n.removeItem(e);else{const P=b.write(h),A=n.getItem(e);A!==P&&(n.setItem(e,P),v&&v.dispatchEvent(new CustomEvent(ee,{detail:{key:e,oldValue:A,newValue:P,storageArea:n}})))}}catch(P){w(P)}}function V(h){const P=h?h.newValue:n.getItem(e);if(P==null)return f&&O!==null&&n.setItem(e,b.write(O)),O;if(!h&&p){const A=b.read(P);return typeof p=="function"?p(A,O):k==="object"&&!Array.isArray(A)?{...O,...A}:A}else return typeof P!="string"?P:b.read(P)}function C(h){_(h.detail)}function _(h){if(!(h&&h.storageArea!==n)){if(h&&h.key==null){y.value=O;return}if(!(h&&h.key!==e)){M();try{h?.newValue!==b.write(y.value)&&(y.value=V(h))}catch(P){w(P)}finally{h?o.nextTick(z):z()}}}}}function Ce(){const e=o.ref(!1);return o.getCurrentInstance()&&o.onMounted(()=>{e.value=!0}),e}function K(e){const t=Ce();return o.computed(()=>(t.value,!!e()))}function Oe(e,t={}){const{window:n=S}=t,r=K(()=>n&&"matchMedia"in n&&typeof n.matchMedia=="function");let a;const i=o.ref(!1),l=p=>{i.value=p.matches},c=()=>{a&&("removeEventListener"in a?a.removeEventListener("change",l):a.removeListener(l))},f=o.watchEffect(()=>{r.value&&(c(),a=n.matchMedia(u.toValue(e)),"addEventListener"in a?a.addEventListener("change",l):a.addListener(l),i.value=a.matches)});return u.tryOnScopeDispose(()=>{f(),c(),a=void 0}),i}function Ee(e){return Oe("(prefers-color-scheme: dark)",e)}function Pe(e={}){const{selector:t="html",attribute:n="class",initialValue:r="auto",window:a=S,storage:i,storageKey:l="vueuse-color-scheme",listenToStorageChanges:c=!0,storageRef:f,emitAuto:p,disableTransition:d=!0}=e,v={auto:"",light:"light",dark:"dark",...e.modes||{}},g=Ee({window:a}),w=o.computed(()=>g.value?"dark":"light"),y=f||(l==null?u.toRef(r):Se(l,r,i,{window:a,listenToStorageChanges:c})),O=o.computed(()=>y.value==="auto"?w.value:y.value),k=D("updateHTMLAttrs",(E,V,C)=>{const _=typeof E=="string"?a?.document.querySelector(E):U(E);if(!_)return;let h;if(d){h=a.document.createElement("style");const P="*,*::before,*::after{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}";h.appendChild(document.createTextNode(P)),a.document.head.appendChild(h)}if(V==="class"){const P=C.split(/\s/g);Object.values(v).flatMap(A=>(A||"").split(/\s/g)).filter(Boolean).forEach(A=>{P.includes(A)?_.classList.add(A):_.classList.remove(A)})}else _.setAttribute(V,C);d&&(a.getComputedStyle(h).opacity,document.head.removeChild(h))});function b(E){var V;k(t,n,(V=v[E])!=null?V:E)}function M(E){e.onChanged?e.onChanged(E,b):b(E)}o.watch(O,M,{flush:"post",immediate:!0}),u.tryOnMounted(()=>M(O.value));const z=o.computed({get(){return p?y.value:O.value},set(E){y.value=E}});try{return Object.assign(z,{store:y,system:w,state:O})}catch{return z}}const Le=o.defineComponent({name:"UseColorMode",props:["selector","attribute","modes","onChanged","storageKey","storage","emitAuto"],setup(e,{slots:t}){const n=Pe(e),r=o.reactive({mode:n,system:n.system,store:n.store});return()=>{if(t.default)return t.default(r)}}}),ke=o.defineComponent({name:"UseDark",props:["selector","attribute","valueDark","valueLight","onChanged","storageKey","storage"],setup(e,{slots:t}){const n=m.useDark(e),r=o.reactive({isDark:n,toggleDark:u.useToggle(n)});return()=>{if(t.default)return t.default(r)}}}),Ae=o.defineComponent({name:"UseDeviceMotion",setup(e,{slots:t}){const n=o.reactive(m.useDeviceMotion());return()=>{if(t.default)return t.default(n)}}}),_e=o.defineComponent({name:"UseDeviceOrientation",setup(e,{slots:t}){const n=o.reactive(m.useDeviceOrientation());return()=>{if(t.default)return t.default(n)}}}),Me=o.defineComponent({name:"UseDevicePixelRatio",setup(e,{slots:t}){const n=o.reactive({pixelRatio:m.useDevicePixelRatio()});return()=>{if(t.default)return t.default(n)}}}),Te=o.defineComponent({name:"UseDevicesList",props:["onUpdated","requestPermissions","constraints"],setup(e,{slots:t}){const n=o.reactive(m.useDevicesList(e));return()=>{if(t.default)return t.default(n)}}}),Ve=o.defineComponent({name:"UseDocumentVisibility",setup(e,{slots:t}){const n=o.reactive({visibility:m.useDocumentVisibility()});return()=>{if(t.default)return t.default(n)}}}),Ie=o.defineComponent({name:"UseDraggable",props:["storageKey","storageType","initialValue","exact","preventDefault","stopPropagation","pointerTypes","as","handle","axis","onStart","onMove","onEnd"],setup(e,{slots:t}){const n=o.ref(),r=o.computed(()=>{var f;return(f=e.handle)!=null?f:n.value}),a=e.storageKey&&m.useStorage(e.storageKey,u.toValue(e.initialValue)||{x:0,y:0},m.isClient?e.storageType==="session"?sessionStorage:localStorage:void 0),i=a||e.initialValue||{x:0,y:0},l=(f,p)=>{var d;(d=e.onEnd)==null||d.call(e,f,p),a&&(a.value.x=f.x,a.value.y=f.y)},c=o.reactive(m.useDraggable(n,{...e,handle:r,initialValue:i,onEnd:l}));return()=>{if(t.default)return o.h(e.as||"div",{ref:n,style:`touch-action:none;${c.style}`},t.default(c))}}}),ze=o.defineComponent({name:"UseElementBounding",props:["box","as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(m.useElementBounding(n));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}});function Re(e,t={}){const{delayEnter:n=0,delayLeave:r=0,window:a=S}=t,i=o.ref(!1);let l;const c=f=>{const p=f?n:r;l&&(clearTimeout(l),l=void 0),p?l=setTimeout(()=>i.value=f,p):i.value=f};return a&&(L(e,"mouseenter",()=>c(!0),{passive:!0}),L(e,"mouseleave",()=>c(!1),{passive:!0})),i}const Ne={[u.directiveHooks.mounted](e,t){if(typeof t.value=="function"){const n=Re(e);o.watch(n,r=>t.value(r))}}},He=o.defineComponent({name:"UseElementSize",props:["width","height","box","as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(m.useElementSize(n,{width:e.width,height:e.height},{box:e.box}));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}});function We(e,t,n={}){const{window:r=S,...a}=n;let i;const l=K(()=>r&&"ResizeObserver"in r),c=()=>{i&&(i.disconnect(),i=void 0)},f=o.computed(()=>Array.isArray(e)?e.map(v=>U(v)):[U(e)]),p=o.watch(f,v=>{if(c(),l.value&&r){i=new ResizeObserver(t);for(const g of v)g&&i.observe(g,a)}},{immediate:!0,flush:"post",deep:!0}),d=()=>{c(),p()};return u.tryOnScopeDispose(d),{isSupported:l,stop:d}}function Be(e,t={width:0,height:0},n={}){const{window:r=S,box:a="content-box"}=n,i=o.computed(()=>{var f,p;return(p=(f=U(e))==null?void 0:f.namespaceURI)==null?void 0:p.includes("svg")}),l=o.ref(t.width),c=o.ref(t.height);return We(e,([f])=>{const p=a==="border-box"?f.borderBoxSize:a==="content-box"?f.contentBoxSize:f.devicePixelContentBoxSize;if(r&&i.value){const d=U(e);if(d){const v=r.getComputedStyle(d);l.value=Number.parseFloat(v.width),c.value=Number.parseFloat(v.height)}}else if(p){const d=Array.isArray(p)?p:[p];l.value=d.reduce((v,{inlineSize:g})=>v+g,0),c.value=d.reduce((v,{blockSize:g})=>v+g,0)}else l.value=f.contentRect.width,c.value=f.contentRect.height},n),o.watch(()=>U(e),f=>{l.value=f?t.width:0,c.value=f?t.height:0}),{width:l,height:c}}const je={[u.directiveHooks.mounted](e,t){var n;const r=typeof t.value=="function"?t.value:(n=t.value)==null?void 0:n[0],a=typeof t.value=="function"?[]:t.value.slice(1),{width:i,height:l}=Be(e,...a);o.watch([i,l],([c,f])=>r({width:c,height:f}))}},Fe=o.defineComponent({name:"UseElementVisibility",props:["as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive({isVisible:m.useElementVisibility(n)});return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}});function X(e,t,n={}){const{root:r,rootMargin:a="0px",threshold:i=.1,window:l=S,immediate:c=!0}=n,f=K(()=>l&&"IntersectionObserver"in l),p=o.computed(()=>{const y=u.toValue(e);return(Array.isArray(y)?y:[y]).map(U).filter(u.notNullish)});let d=u.noop;const v=o.ref(c),g=f.value?o.watch(()=>[p.value,U(r),v.value],([y,O])=>{if(d(),!v.value||!y.length)return;const k=new IntersectionObserver(t,{root:U(O),rootMargin:a,threshold:i});y.forEach(b=>b&&k.observe(b)),d=()=>{k.disconnect(),d=u.noop}},{immediate:c,flush:"post"}):u.noop,w=()=>{d(),g(),v.value=!1};return u.tryOnScopeDispose(w),{isSupported:f,isActive:v,pause(){d(),v.value=!1},resume(){v.value=!0},stop:w}}function q(e,t={}){const{window:n=S,scrollTarget:r}=t,a=o.ref(!1);return X(e,([{isIntersecting:i}])=>{a.value=i},{root:r,window:n,threshold:0}),a}const Ke={[u.directiveHooks.mounted](e,t){if(typeof t.value=="function"){const n=t.value,r=q(e);o.watch(r,a=>n(a),{immediate:!0})}else{const[n,r]=t.value,a=q(e,r);o.watch(a,i=>n(i),{immediate:!0})}}},Ge=o.defineComponent({name:"UseEyeDropper",props:{sRGBHex:String},setup(e,{slots:t}){const n=o.reactive(m.useEyeDropper());return()=>{if(t.default)return t.default(n)}}}),Je=o.defineComponent({name:"UseFullscreen",props:["as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(m.useFullscreen(n));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}}),Ye=o.defineComponent({name:"UseGeolocation",props:["enableHighAccuracy","maximumAge","timeout","navigator"],setup(e,{slots:t}){const n=o.reactive(m.useGeolocation(e));return()=>{if(t.default)return t.default(n)}}}),$e=o.defineComponent({name:"UseIdle",props:["timeout","events","listenForVisibilityChange","initialState"],setup(e,{slots:t}){const n=o.reactive(m.useIdle(e.timeout,e));return()=>{if(t.default)return t.default(n)}}});function Xe(e,t,n){const{immediate:r=!0,delay:a=0,onError:i=u.noop,onSuccess:l=u.noop,resetOnExecute:c=!0,shallow:f=!0,throwError:p}=n??{},d=f?o.shallowRef(t):o.ref(t),v=o.ref(!1),g=o.ref(!1),w=o.shallowRef(void 0);async function y(b=0,...M){c&&(d.value=t),w.value=void 0,v.value=!1,g.value=!0,b>0&&await u.promiseTimeout(b);const z=typeof e=="function"?e(...M):e;try{const E=await z;d.value=E,v.value=!0,l(E)}catch(E){if(w.value=E,i(E),p)throw E}finally{g.value=!1}return d.value}r&&y(a);const O={state:d,isReady:v,isLoading:g,error:w,execute:y};function k(){return new Promise((b,M)=>{u.until(g).toBe(!1).then(()=>b(O)).catch(M)})}return{...O,then(b,M){return k().then(b,M)}}}async function qe(e){return new Promise((t,n)=>{const r=new Image,{src:a,srcset:i,sizes:l,class:c,loading:f,crossorigin:p,referrerPolicy:d}=e;r.src=a,i&&(r.srcset=i),l&&(r.sizes=l),c&&(r.className=c),f&&(r.loading=f),p&&(r.crossOrigin=p),d&&(r.referrerPolicy=d),r.onload=()=>t(r),r.onerror=n})}function Qe(e,t={}){const n=Xe(()=>qe(u.toValue(e)),void 0,{resetOnExecute:!0,...t});return o.watch(()=>u.toValue(e),()=>n.execute(t.delay),{deep:!0}),n}const xe=o.defineComponent({name:"UseImage",props:["src","srcset","sizes","as","alt","class","loading","crossorigin","referrerPolicy"],setup(e,{slots:t}){const n=o.reactive(Qe(e));return()=>n.isLoading&&t.loading?t.loading(n):n.error&&t.error?t.error(n.error):t.default?t.default(n):o.h(e.as||"img",e)}}),te=1;function Q(e,t={}){const{throttle:n=0,idle:r=200,onStop:a=u.noop,onScroll:i=u.noop,offset:l={left:0,right:0,top:0,bottom:0},eventListenerOptions:c={capture:!1,passive:!0},behavior:f="auto",window:p=S}=t,d=o.ref(0),v=o.ref(0),g=o.computed({get(){return d.value},set(C){y(C,void 0)}}),w=o.computed({get(){return v.value},set(C){y(void 0,C)}});function y(C,_){var h,P,A;if(!p)return;const R=u.toValue(e);R&&((A=R instanceof Document?p.document.body:R)==null||A.scrollTo({top:(h=u.toValue(_))!=null?h:w.value,left:(P=u.toValue(C))!=null?P:g.value,behavior:u.toValue(f)}))}const O=o.ref(!1),k=o.reactive({left:!0,right:!1,top:!0,bottom:!1}),b=o.reactive({left:!1,right:!1,top:!1,bottom:!1}),M=C=>{O.value&&(O.value=!1,b.left=!1,b.right=!1,b.top=!1,b.bottom=!1,a(C))},z=u.useDebounceFn(M,n+r),E=C=>{var _;if(!p)return;const h=C.document?C.document.documentElement:(_=C.documentElement)!=null?_:C,{display:P,flexDirection:A}=getComputedStyle(h),R=h.scrollLeft;b.left=R<d.value,b.right=R>d.value;const le=Math.abs(R)<=0+(l.left||0),ue=Math.abs(R)+h.clientWidth>=h.scrollWidth-(l.right||0)-te;P==="flex"&&A==="row-reverse"?(k.left=ue,k.right=le):(k.left=le,k.right=ue),d.value=R;let H=h.scrollTop;C===p.document&&!H&&(H=p.document.body.scrollTop),b.top=H<v.value,b.bottom=H>v.value;const ce=Math.abs(H)<=0+(l.top||0),fe=Math.abs(H)+h.clientHeight>=h.scrollHeight-(l.bottom||0)-te;P==="flex"&&A==="column-reverse"?(k.top=fe,k.bottom=ce):(k.top=ce,k.bottom=fe),v.value=H},V=C=>{var _;if(!p)return;const h=(_=C.target.documentElement)!=null?_:C.target;E(h),O.value=!0,z(C),i(C)};return L(e,"scroll",n?u.useThrottleFn(V,n,!0,!1):V,c),L(e,"scrollend",M,c),{x:g,y:w,isScrolling:O,arrivedState:k,directions:b,measure(){const C=u.toValue(e);p&&C&&E(C)}}}function G(e){return typeof Window<"u"&&e instanceof Window?e.document.documentElement:typeof Document<"u"&&e instanceof Document?e.documentElement:e}function ne(e,t,n={}){var r;const{direction:a="bottom",interval:i=100}=n,l=o.reactive(Q(e,{...n,offset:{[a]:(r=n.distance)!=null?r:0,...n.offset}})),c=o.ref(),f=o.computed(()=>!!c.value),p=o.computed(()=>G(u.toValue(e))),d=q(p);function v(){if(l.measure(),!p.value||!d.value)return;const{scrollHeight:g,clientHeight:w,scrollWidth:y,clientWidth:O}=p.value,k=a==="bottom"||a==="top"?g<=w:y<=O;(l.arrivedState[a]||k)&&(c.value||(c.value=Promise.all([t(l),new Promise(b=>setTimeout(b,i))]).finally(()=>{c.value=null,o.nextTick(()=>v())})))}return o.watch(()=>[l.arrivedState[a],d.value],v,{immediate:!0}),{isLoading:f}}const Ze={[u.directiveHooks.mounted](e,t){typeof t.value=="function"?ne(e,t.value):ne(e,...t.value)}},De={[u.directiveHooks.mounted](e,t){typeof t.value=="function"?X(e,t.value):X(e,...t.value)}},et=o.defineComponent({name:"UseMouse",props:["touch","resetOnTouchEnds","initialValue"],setup(e,{slots:t}){const n=o.reactive(m.useMouse(e));return()=>{if(t.default)return t.default(n)}}}),tt=o.defineComponent({name:"UseMouseElement",props:["handleOutside","as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(m.useMouseInElement(n,e));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}}),nt=o.defineComponent({name:"UseMousePressed",props:["touch","initialValue","as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(m.useMousePressed({...e,target:n}));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}}),ot=o.defineComponent({name:"UseNetwork",setup(e,{slots:t}){const n=o.reactive(m.useNetwork());return()=>{if(t.default)return t.default(n)}}}),rt=o.defineComponent({name:"UseNow",props:["interval"],setup(e,{slots:t}){const n=o.reactive(m.useNow({...e,controls:!0}));return()=>{if(t.default)return t.default(n)}}}),at=o.defineComponent({name:"UseObjectUrl",props:["object"],setup(e,{slots:t}){const n=u.toRef(e,"object"),r=m.useObjectUrl(n);return()=>{if(t.default&&r.value)return t.default(r)}}}),st=o.defineComponent({name:"UseOffsetPagination",props:["total","page","pageSize","onPageChange","onPageSizeChange","onPageCountChange"],emits:["page-change","page-size-change","page-count-change"],setup(e,{slots:t,emit:n}){const r=o.reactive(m.useOffsetPagination({...e,onPageChange(...a){var i;(i=e.onPageChange)==null||i.call(e,...a),n("page-change",...a)},onPageSizeChange(...a){var i;(i=e.onPageSizeChange)==null||i.call(e,...a),n("page-size-change",...a)},onPageCountChange(...a){var i;(i=e.onPageCountChange)==null||i.call(e,...a),n("page-count-change",...a)}}));return()=>{if(t.default)return t.default(r)}}}),it=o.defineComponent({name:"UseOnline",setup(e,{slots:t}){const n=o.reactive({isOnline:m.useOnline()});return()=>{if(t.default)return t.default(n)}}}),lt=o.defineComponent({name:"UsePageLeave",setup(e,{slots:t}){const n=o.reactive({isLeft:m.usePageLeave()});return()=>{if(t.default)return t.default(n)}}}),ut=o.defineComponent({name:"UsePointer",props:["pointerTypes","initialValue","target"],setup(e,{slots:t}){const n=o.ref(null),r=o.reactive(m.usePointer({...e,target:e.target==="self"?n:S}));return()=>{if(t.default)return t.default(r,{ref:n})}}}),ct=o.defineComponent({name:"UsePointerLock",props:["as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(m.usePointerLock(n));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}}),ft=o.defineComponent({name:"UsePreferredColorScheme",setup(e,{slots:t}){const n=o.reactive({colorScheme:m.usePreferredColorScheme()});return()=>{if(t.default)return t.default(n)}}}),dt=o.defineComponent({name:"UsePreferredContrast",setup(e,{slots:t}){const n=o.reactive({contrast:m.usePreferredContrast()});return()=>{if(t.default)return t.default(n)}}}),pt=o.defineComponent({name:"UsePreferredDark",setup(e,{slots:t}){const n=o.reactive({prefersDark:m.usePreferredDark()});return()=>{if(t.default)return t.default(n)}}}),vt=o.defineComponent({name:"UsePreferredLanguages",setup(e,{slots:t}){const n=o.reactive({languages:m.usePreferredLanguages()});return()=>{if(t.default)return t.default(n)}}}),gt=o.defineComponent({name:"UsePreferredReducedMotion",setup(e,{slots:t}){const n=o.reactive({motion:m.usePreferredReducedMotion()});return()=>{if(t.default)return t.default(n)}}});function mt(e,t,n={}){const{window:r=S,...a}=n;let i;const l=K(()=>r&&"MutationObserver"in r),c=()=>{i&&(i.disconnect(),i=void 0)},f=o.watch(()=>U(e),d=>{c(),l.value&&r&&d&&(i=new MutationObserver(t),i.observe(d,a))},{immediate:!0}),p=()=>{c(),f()};return u.tryOnScopeDispose(p),{isSupported:l,stop:p}}function J(e,t,n={}){const{window:r=S,initialValue:a="",observe:i=!1}=n,l=o.ref(a),c=o.computed(()=>{var p;return U(t)||((p=r?.document)==null?void 0:p.documentElement)});function f(){var p;const d=u.toValue(e),v=u.toValue(c);if(v&&r){const g=(p=r.getComputedStyle(v).getPropertyValue(d))==null?void 0:p.trim();l.value=g||a}}return i&&mt(c,f,{attributeFilter:["style","class"],window:r}),o.watch([c,()=>u.toValue(e)],f,{immediate:!0}),o.watch(l,p=>{var d;(d=c.value)!=null&&d.style&&c.value.style.setProperty(u.toValue(e),p)}),l}const oe="--vueuse-safe-area-top",re="--vueuse-safe-area-right",ae="--vueuse-safe-area-bottom",se="--vueuse-safe-area-left";function ht(){const e=o.ref(""),t=o.ref(""),n=o.ref(""),r=o.ref("");if(u.isClient){const i=J(oe),l=J(re),c=J(ae),f=J(se);i.value="env(safe-area-inset-top, 0px)",l.value="env(safe-area-inset-right, 0px)",c.value="env(safe-area-inset-bottom, 0px)",f.value="env(safe-area-inset-left, 0px)",a(),L("resize",u.useDebounceFn(a))}function a(){e.value=Y(oe),t.value=Y(re),n.value=Y(ae),r.value=Y(se)}return{top:e,right:t,bottom:n,left:r,update:a}}function Y(e){return getComputedStyle(document.documentElement).getPropertyValue(e)}const yt=o.defineComponent({name:"UseScreenSafeArea",props:{top:Boolean,right:Boolean,bottom:Boolean,left:Boolean},setup(e,{slots:t}){const{top:n,right:r,bottom:a,left:i}=ht();return()=>{if(t.default)return o.h("div",{style:{paddingTop:e.top?n.value:"",paddingRight:e.right?r.value:"",paddingBottom:e.bottom?a.value:"",paddingLeft:e.left?i.value:"",boxSizing:"border-box",maxHeight:"100vh",maxWidth:"100vw",overflow:"auto"}},t.default())}}}),wt={[u.directiveHooks.mounted](e,t){if(typeof t.value=="function"){const n=t.value,r=Q(e,{onScroll(){n(r)},onStop(){n(r)}})}else{const[n,r]=t.value,a=Q(e,{...r,onScroll(i){var l;(l=r.onScroll)==null||l.call(r,i),n(a)},onStop(i){var l;(l=r.onStop)==null||l.call(r,i),n(a)}})}}};function ie(e){const t=window.getComputedStyle(e);if(t.overflowX==="scroll"||t.overflowY==="scroll"||t.overflowX==="auto"&&e.clientWidth<e.scrollWidth||t.overflowY==="auto"&&e.clientHeight<e.scrollHeight)return!0;{const n=e.parentNode;return!n||n.tagName==="BODY"?!1:ie(n)}}function Ut(e){const t=e||window.event,n=t.target;return ie(n)?!1:t.touches.length>1?!0:(t.preventDefault&&t.preventDefault(),!1)}function bt(e,t=!1){const n=o.ref(t);let r=null,a;o.watch(u.toRef(e),c=>{const f=G(u.toValue(c));if(f){const p=f;a=p.style.overflow,n.value&&(p.style.overflow="hidden")}},{immediate:!0});const i=()=>{const c=G(u.toValue(e));!c||n.value||(u.isIOS&&(r=L(c,"touchmove",f=>{Ut(f)},{passive:!1})),c.style.overflow="hidden",n.value=!0)},l=()=>{const c=G(u.toValue(e));!c||!n.value||(u.isIOS&&r?.(),c.style.overflow=a,n.value=!1)};return u.tryOnScopeDispose(l),o.computed({get(){return n.value},set(c){c?i():l()}})}function St(){let e=!1;const t=o.ref(!1);return(n,r)=>{if(t.value=r.value,e)return;e=!0;const a=bt(n,r.value);o.watch(t,i=>a.value=i)}}const Ct=St(),Ot=o.defineComponent({name:"UseTimeAgo",props:["time","updateInterval","max","fullDateFormatter","messages","showSecond"],setup(e,{slots:t}){const n=o.reactive(m.useTimeAgo(()=>e.time,{...e,controls:!0}));return()=>{if(t.default)return t.default(n)}}}),Et=o.defineComponent({name:"UseTimestamp",props:["immediate","interval","offset"],setup(e,{slots:t}){const n=o.reactive(m.useTimestamp({...e,controls:!0}));return()=>{if(t.default)return t.default(n)}}}),Pt=o.defineComponent({name:"UseVirtualList",props:["list","options","height"],setup(e,{slots:t,expose:n}){const{list:r}=o.toRefs(e),{list:a,containerProps:i,wrapperProps:l,scrollTo:c}=m.useVirtualList(r,e.options);return n({scrollTo:c}),typeof i.style=="object"&&!Array.isArray(i.style)&&(i.style.height=e.height||"300px"),()=>o.h("div",{...i},[o.h("div",{...l.value},a.value.map(f=>o.h("div",{style:{overFlow:"hidden",height:f.height}},t.default?t.default(f):"Please set content!")))])}}),Lt=o.defineComponent({name:"UseWindowFocus",setup(e,{slots:t}){const n=o.reactive({focused:m.useWindowFocus()});return()=>{if(t.default)return t.default(n)}}}),kt=o.defineComponent({name:"UseWindowSize",props:["initialWidth","initialHeight"],setup(e,{slots:t}){const n=o.reactive(m.useWindowSize(e));return()=>{if(t.default)return t.default(n)}}});s.OnClickOutside=x,s.OnLongPress=ve,s.UseActiveElement=ge,s.UseBattery=me,s.UseBrowserLocation=he,s.UseColorMode=Le,s.UseDark=ke,s.UseDeviceMotion=Ae,s.UseDeviceOrientation=_e,s.UseDevicePixelRatio=Me,s.UseDevicesList=Te,s.UseDocumentVisibility=Ve,s.UseDraggable=Ie,s.UseElementBounding=ze,s.UseElementSize=He,s.UseElementVisibility=Fe,s.UseEyeDropper=Ge,s.UseFullscreen=Je,s.UseGeolocation=Ye,s.UseIdle=$e,s.UseImage=xe,s.UseMouse=et,s.UseMouseInElement=tt,s.UseMousePressed=nt,s.UseNetwork=ot,s.UseNow=rt,s.UseObjectUrl=at,s.UseOffsetPagination=st,s.UseOnline=it,s.UsePageLeave=lt,s.UsePointer=ut,s.UsePointerLock=ct,s.UsePreferredColorScheme=ft,s.UsePreferredContrast=dt,s.UsePreferredDark=pt,s.UsePreferredLanguages=vt,s.UsePreferredReducedMotion=gt,s.UseScreenSafeArea=yt,s.UseTimeAgo=Ot,s.UseTimestamp=Et,s.UseVirtualList=Pt,s.UseWindowFocus=Lt,s.UseWindowSize=kt,s.VOnClickOutside=B,s.VOnLongPress=Z,s.vElementHover=Ne,s.vElementSize=je,s.vElementVisibility=Ke,s.vInfiniteScroll=Ze,s.vIntersectionObserver=De,s.vOnClickOutside=B,s.vOnKeyStroke=de,s.vOnLongPress=Z,s.vScroll=wt,s.vScrollLock=Ct})(this.VueUse=this.VueUse||{},VueDemi,VueUse,VueUse);
|
|
1
|
+
var VueDemi=function(s,o,m){if(s.install)return s;if(!o)return console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`."),s;if(o.version.slice(0,4)==="2.7."){let U=function(E,_){var V,W={},B={config:o.config,use:o.use.bind(o),mixin:o.mixin.bind(o),component:o.component.bind(o),provide:function(H,R){return W[H]=R,this},directive:function(H,R){return R?(o.directive(H,R),B):o.directive(H)},mount:function(H,R){return V||(V=new o(Object.assign({propsData:_},E,{provide:Object.assign(W,E.provide)})),V.$mount(H,R),V)},unmount:function(){V&&(V.$destroy(),V=void 0)}};return B};var x=U;for(var u in o)s[u]=o[u];s.isVue2=!0,s.isVue3=!1,s.install=function(){},s.Vue=o,s.Vue2=o,s.version=o.version,s.warn=o.util.warn,s.hasInjectionContext=()=>!!s.getCurrentInstance(),s.createApp=U}else if(o.version.slice(0,2)==="2.")if(m){for(var u in m)s[u]=m[u];s.isVue2=!0,s.isVue3=!1,s.install=function(){},s.Vue=o,s.Vue2=o,s.version=o.version,s.hasInjectionContext=()=>!!s.getCurrentInstance()}else console.error("[vue-demi] no VueCompositionAPI instance found, please be sure to import `@vue/composition-api` before `vue-demi`.");else if(o.version.slice(0,2)==="3."){for(var u in o)s[u]=o[u];s.isVue2=!1,s.isVue3=!0,s.install=function(){},s.Vue=o,s.Vue2=void 0,s.version=o.version,s.set=function(U,E,_){return Array.isArray(U)?(U.length=Math.max(U.length,E),U.splice(E,1,_),_):(U[E]=_,_)},s.del=function(U,E){if(Array.isArray(U)){U.splice(E,1);return}delete U[E]}}else console.error("[vue-demi] Vue version "+o.version+" is unsupported.");return s}(this.VueDemi=this.VueDemi||(typeof VueDemi<"u"?VueDemi:{}),this.Vue||(typeof Vue<"u"?Vue:void 0),this.VueCompositionAPI||(typeof VueCompositionAPI<"u"?VueCompositionAPI:void 0));(function(s,o,m,u){"use strict";const x=o.defineComponent({name:"OnClickOutside",props:["as","options"],emits:["trigger"],setup(e,{slots:t,emit:n}){const r=o.ref();return m.onClickOutside(r,a=>{n("trigger",a)},e.options),()=>{if(t.default)return o.h(e.as||"div",{ref:r},t.default())}}});function U(e){var t;const n=u.toValue(e);return(t=n?.$el)!=null?t:n}const E=u.isClient?window:void 0;function _(...e){let t,n,r,a;if(typeof e[0]=="string"||Array.isArray(e[0])?([n,r,a]=e,t=E):[t,n,r,a]=e,!t)return u.noop;Array.isArray(n)||(n=[n]),Array.isArray(r)||(r=[r]);const i=[],l=()=>{i.forEach(v=>v()),i.length=0},c=(v,f,p,h)=>(v.addEventListener(f,p,h),()=>v.removeEventListener(f,p,h)),d=o.watch(()=>[U(t),u.toValue(a)],([v,f])=>{if(l(),!v)return;const p=u.isObject(f)?{...f}:f;i.push(...n.flatMap(h=>r.map(y=>c(v,h,y,p))))},{immediate:!0,flush:"post"}),g=()=>{d(),l()};return u.tryOnScopeDispose(g),g}let V=!1;function W(e,t,n={}){const{window:r=E,ignore:a=[],capture:i=!0,detectIframe:l=!1}=n;if(!r)return;u.isIOS&&!V&&(V=!0,Array.from(r.document.body.children).forEach(p=>p.addEventListener("click",u.noop)),r.document.documentElement.addEventListener("click",u.noop));let c=!0;const d=p=>a.some(h=>{if(typeof h=="string")return Array.from(r.document.querySelectorAll(h)).some(y=>y===p.target||p.composedPath().includes(y));{const y=U(h);return y&&(p.target===y||p.composedPath().includes(y))}}),v=[_(r,"click",p=>{const h=U(e);if(!(!h||h===p.target||p.composedPath().includes(h))){if(p.detail===0&&(c=!d(p)),!c){c=!0;return}t(p)}},{passive:!0,capture:i}),_(r,"pointerdown",p=>{const h=U(e);c=!d(p)&&!!(h&&!p.composedPath().includes(h))},{passive:!0}),l&&_(r,"blur",p=>{setTimeout(()=>{var h;const y=U(e);((h=r.document.activeElement)==null?void 0:h.tagName)==="IFRAME"&&!y?.contains(r.document.activeElement)&&t(p)},0)})].filter(Boolean);return()=>v.forEach(p=>p())}const B={[u.directiveHooks.mounted](e,t){const n=!t.modifiers.bubble;if(typeof t.value=="function")e.__onClickOutside_stop=W(e,t.value,{capture:n});else{const[r,a]=t.value;e.__onClickOutside_stop=W(e,r,Object.assign({capture:n},a))}},[u.directiveHooks.unmounted](e){e.__onClickOutside_stop()}};function H(e){return typeof e=="function"?e:typeof e=="string"?t=>t.key===e:Array.isArray(e)?t=>e.includes(t.key):()=>!0}function R(...e){let t,n,r={};e.length===3?(t=e[0],n=e[1],r=e[2]):e.length===2?typeof e[1]=="object"?(t=!0,n=e[0],r=e[1]):(t=e[0],n=e[1]):(t=!0,n=e[0]);const{target:a=E,eventName:i="keydown",passive:l=!1,dedupe:c=!1}=r,d=H(t);return _(a,i,v=>{v.repeat&&u.toValue(c)||d(v)&&n(v)},l)}const pe={[u.directiveHooks.mounted](e,t){var n,r;const a=(r=(n=t.arg)==null?void 0:n.split(","))!=null?r:!0;if(typeof t.value=="function")R(a,t.value,{target:e});else{const[i,l]=t.value;R(a,i,{target:e,...l})}}},ve=500;function X(e,t,n){var r,a;const i=o.computed(()=>U(e));let l;function c(){l&&(clearTimeout(l),l=void 0)}function d(p){var h,y,b,C;(h=n?.modifiers)!=null&&h.self&&p.target!==i.value||(c(),(y=n?.modifiers)!=null&&y.prevent&&p.preventDefault(),(b=n?.modifiers)!=null&&b.stop&&p.stopPropagation(),l=setTimeout(()=>t(p),(C=n?.delay)!=null?C:ve))}const g={capture:(r=n?.modifiers)==null?void 0:r.capture,once:(a=n?.modifiers)==null?void 0:a.once},v=[_(i,"pointerdown",d,g),_(i,["pointerup","pointerleave"],c,g)].filter(Boolean);return()=>v.forEach(p=>p())}const ge=o.defineComponent({name:"OnLongPress",props:["as","options"],emits:["trigger"],setup(e,{slots:t,emit:n}){const r=o.ref();return X(r,a=>{n("trigger",a)},e.options),()=>{if(t.default)return o.h(e.as||"div",{ref:r},t.default())}}}),D={[u.directiveHooks.mounted](e,t){typeof t.value=="function"?X(e,t.value,{modifiers:t.modifiers}):X(e,...t.value)}},me=o.defineComponent({name:"UseActiveElement",setup(e,{slots:t}){const n=o.reactive({element:m.useActiveElement()});return()=>{if(t.default)return t.default(n)}}}),he=o.defineComponent({name:"UseBattery",setup(e,{slots:t}){const n=o.reactive(m.useBattery(e));return()=>{if(t.default)return t.default(n)}}}),ye=o.defineComponent({name:"UseBrowserLocation",setup(e,{slots:t}){const n=o.reactive(m.useBrowserLocation());return()=>{if(t.default)return t.default(n)}}}),we=o.defineComponent({name:"UseClipboard",props:["source","read","navigator","copiedDuring","legacy"],setup(e,{slots:t}){const n=o.reactive(m.useClipboard(e));return()=>{var r;return(r=t.default)==null?void 0:r.call(t,n)}}}),j=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},F="__vueuse_ssr_handlers__",Ue=be();function be(){return F in j||(j[F]=j[F]||{}),j[F]}function ee(e,t){return Ue[e]||t}function Ce(e){return e==null?"any":e instanceof Set?"set":e instanceof Map?"map":e instanceof Date?"date":typeof e=="boolean"?"boolean":typeof e=="string"?"string":typeof e=="object"?"object":Number.isNaN(e)?"any":"number"}const Se={boolean:{read:e=>e==="true",write:e=>String(e)},object:{read:e=>JSON.parse(e),write:e=>JSON.stringify(e)},number:{read:e=>Number.parseFloat(e),write:e=>String(e)},any:{read:e=>e,write:e=>String(e)},string:{read:e=>e,write:e=>String(e)},map:{read:e=>new Map(JSON.parse(e)),write:e=>JSON.stringify(Array.from(e.entries()))},set:{read:e=>new Set(JSON.parse(e)),write:e=>JSON.stringify(Array.from(e))},date:{read:e=>new Date(e),write:e=>e.toISOString()}},te="vueuse-storage";function Oe(e,t,n,r={}){var a;const{flush:i="pre",deep:l=!0,listenToStorageChanges:c=!0,writeDefaults:d=!0,mergeDefaults:g=!1,shallow:v,window:f=E,eventFilter:p,onError:h=w=>{console.error(w)},initOnMounted:y}=r,b=(v?o.shallowRef:o.ref)(typeof t=="function"?t():t);if(!n)try{n=ee("getDefaultStorage",()=>{var w;return(w=E)==null?void 0:w.localStorage})()}catch(w){h(w)}if(!n)return b;const C=u.toValue(t),O=Ce(C),A=(a=r.serializer)!=null?a:Se[O],{pause:z,resume:P}=u.pausableWatch(b,()=>I(b.value),{flush:i,deep:l,eventFilter:p});return f&&c&&u.tryOnMounted(()=>{_(f,"storage",k),_(f,te,T),y&&k()}),y||k(),b;function I(w){try{if(w==null)n.removeItem(e);else{const L=A.write(w),M=n.getItem(e);M!==L&&(n.setItem(e,L),f&&f.dispatchEvent(new CustomEvent(te,{detail:{key:e,oldValue:M,newValue:L,storageArea:n}})))}}catch(L){h(L)}}function S(w){const L=w?w.newValue:n.getItem(e);if(L==null)return d&&C!==null&&n.setItem(e,A.write(C)),C;if(!w&&g){const M=A.read(L);return typeof g=="function"?g(M,C):O==="object"&&!Array.isArray(M)?{...C,...M}:M}else return typeof L!="string"?L:A.read(L)}function T(w){k(w.detail)}function k(w){if(!(w&&w.storageArea!==n)){if(w&&w.key==null){b.value=C;return}if(!(w&&w.key!==e)){z();try{w?.newValue!==A.write(b.value)&&(b.value=S(w))}catch(L){h(L)}finally{w?o.nextTick(P):P()}}}}}function Ee(){const e=o.ref(!1);return o.getCurrentInstance()&&o.onMounted(()=>{e.value=!0}),e}function K(e){const t=Ee();return o.computed(()=>(t.value,!!e()))}function Pe(e,t={}){const{window:n=E}=t,r=K(()=>n&&"matchMedia"in n&&typeof n.matchMedia=="function");let a;const i=o.ref(!1),l=g=>{i.value=g.matches},c=()=>{a&&("removeEventListener"in a?a.removeEventListener("change",l):a.removeListener(l))},d=o.watchEffect(()=>{r.value&&(c(),a=n.matchMedia(u.toValue(e)),"addEventListener"in a?a.addEventListener("change",l):a.addListener(l),i.value=a.matches)});return u.tryOnScopeDispose(()=>{d(),c(),a=void 0}),i}function Le(e){return Pe("(prefers-color-scheme: dark)",e)}function ke(e={}){const{selector:t="html",attribute:n="class",initialValue:r="auto",window:a=E,storage:i,storageKey:l="vueuse-color-scheme",listenToStorageChanges:c=!0,storageRef:d,emitAuto:g,disableTransition:v=!0}=e,f={auto:"",light:"light",dark:"dark",...e.modes||{}},p=Le({window:a}),h=o.computed(()=>p.value?"dark":"light"),y=d||(l==null?u.toRef(r):Oe(l,r,i,{window:a,listenToStorageChanges:c})),b=o.computed(()=>y.value==="auto"?h.value:y.value),C=ee("updateHTMLAttrs",(P,I,S)=>{const T=typeof P=="string"?a?.document.querySelector(P):U(P);if(!T)return;let k;if(v){k=a.document.createElement("style");const w="*,*::before,*::after{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}";k.appendChild(document.createTextNode(w)),a.document.head.appendChild(k)}if(I==="class"){const w=S.split(/\s/g);Object.values(f).flatMap(L=>(L||"").split(/\s/g)).filter(Boolean).forEach(L=>{w.includes(L)?T.classList.add(L):T.classList.remove(L)})}else T.setAttribute(I,S);v&&(a.getComputedStyle(k).opacity,document.head.removeChild(k))});function O(P){var I;C(t,n,(I=f[P])!=null?I:P)}function A(P){e.onChanged?e.onChanged(P,O):O(P)}o.watch(b,A,{flush:"post",immediate:!0}),u.tryOnMounted(()=>A(b.value));const z=o.computed({get(){return g?y.value:b.value},set(P){y.value=P}});try{return Object.assign(z,{store:y,system:h,state:b})}catch{return z}}const _e=o.defineComponent({name:"UseColorMode",props:["selector","attribute","modes","onChanged","storageKey","storage","emitAuto"],setup(e,{slots:t}){const n=ke(e),r=o.reactive({mode:n,system:n.system,store:n.store});return()=>{if(t.default)return t.default(r)}}}),Ae=o.defineComponent({name:"UseDark",props:["selector","attribute","valueDark","valueLight","onChanged","storageKey","storage"],setup(e,{slots:t}){const n=m.useDark(e),r=o.reactive({isDark:n,toggleDark:u.useToggle(n)});return()=>{if(t.default)return t.default(r)}}}),Me=o.defineComponent({name:"UseDeviceMotion",setup(e,{slots:t}){const n=o.reactive(m.useDeviceMotion());return()=>{if(t.default)return t.default(n)}}}),Te=o.defineComponent({name:"UseDeviceOrientation",setup(e,{slots:t}){const n=o.reactive(m.useDeviceOrientation());return()=>{if(t.default)return t.default(n)}}}),Ve=o.defineComponent({name:"UseDevicePixelRatio",setup(e,{slots:t}){const n=o.reactive({pixelRatio:m.useDevicePixelRatio()});return()=>{if(t.default)return t.default(n)}}}),Ie=o.defineComponent({name:"UseDevicesList",props:["onUpdated","requestPermissions","constraints"],setup(e,{slots:t}){const n=o.reactive(m.useDevicesList(e));return()=>{if(t.default)return t.default(n)}}}),Re=o.defineComponent({name:"UseDocumentVisibility",setup(e,{slots:t}){const n=o.reactive({visibility:m.useDocumentVisibility()});return()=>{if(t.default)return t.default(n)}}}),He=o.defineComponent({name:"UseDraggable",props:["storageKey","storageType","initialValue","exact","preventDefault","stopPropagation","pointerTypes","as","handle","axis","onStart","onMove","onEnd"],setup(e,{slots:t}){const n=o.ref(),r=o.computed(()=>{var d;return(d=e.handle)!=null?d:n.value}),a=e.storageKey&&m.useStorage(e.storageKey,u.toValue(e.initialValue)||{x:0,y:0},m.isClient?e.storageType==="session"?sessionStorage:localStorage:void 0),i=a||e.initialValue||{x:0,y:0},l=(d,g)=>{var v;(v=e.onEnd)==null||v.call(e,d,g),a&&(a.value.x=d.x,a.value.y=d.y)},c=o.reactive(m.useDraggable(n,{...e,handle:r,initialValue:i,onEnd:l}));return()=>{if(t.default)return o.h(e.as||"div",{ref:n,style:`touch-action:none;${c.style}`},t.default(c))}}}),ze=o.defineComponent({name:"UseElementBounding",props:["box","as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(m.useElementBounding(n));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}});function Ne(e,t={}){const{delayEnter:n=0,delayLeave:r=0,window:a=E}=t,i=o.ref(!1);let l;const c=d=>{const g=d?n:r;l&&(clearTimeout(l),l=void 0),g?l=setTimeout(()=>i.value=d,g):i.value=d};return a&&(_(e,"mouseenter",()=>c(!0),{passive:!0}),_(e,"mouseleave",()=>c(!1),{passive:!0})),i}const We={[u.directiveHooks.mounted](e,t){if(typeof t.value=="function"){const n=Ne(e);o.watch(n,r=>t.value(r))}}},Be=o.defineComponent({name:"UseElementSize",props:["width","height","box","as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(m.useElementSize(n,{width:e.width,height:e.height},{box:e.box}));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}});function je(e,t,n={}){const{window:r=E,...a}=n;let i;const l=K(()=>r&&"ResizeObserver"in r),c=()=>{i&&(i.disconnect(),i=void 0)},d=o.computed(()=>Array.isArray(e)?e.map(f=>U(f)):[U(e)]),g=o.watch(d,f=>{if(c(),l.value&&r){i=new ResizeObserver(t);for(const p of f)p&&i.observe(p,a)}},{immediate:!0,flush:"post",deep:!0}),v=()=>{c(),g()};return u.tryOnScopeDispose(v),{isSupported:l,stop:v}}function Fe(e,t={width:0,height:0},n={}){const{window:r=E,box:a="content-box"}=n,i=o.computed(()=>{var f,p;return(p=(f=U(e))==null?void 0:f.namespaceURI)==null?void 0:p.includes("svg")}),l=o.ref(t.width),c=o.ref(t.height),{stop:d}=je(e,([f])=>{const p=a==="border-box"?f.borderBoxSize:a==="content-box"?f.contentBoxSize:f.devicePixelContentBoxSize;if(r&&i.value){const h=U(e);if(h){const y=r.getComputedStyle(h);l.value=Number.parseFloat(y.width),c.value=Number.parseFloat(y.height)}}else if(p){const h=Array.isArray(p)?p:[p];l.value=h.reduce((y,{inlineSize:b})=>y+b,0),c.value=h.reduce((y,{blockSize:b})=>y+b,0)}else l.value=f.contentRect.width,c.value=f.contentRect.height},n);u.tryOnMounted(()=>{const f=U(e);f&&(l.value="offsetWidth"in f?f.offsetWidth:t.width,c.value="offsetHeight"in f?f.offsetHeight:t.height)});const g=o.watch(()=>U(e),f=>{l.value=f?t.width:0,c.value=f?t.height:0});function v(){d(),g()}return{width:l,height:c,stop:v}}const Ke={[u.directiveHooks.mounted](e,t){var n;const r=typeof t.value=="function"?t.value:(n=t.value)==null?void 0:n[0],a=typeof t.value=="function"?[]:t.value.slice(1),{width:i,height:l}=Fe(e,...a);o.watch([i,l],([c,d])=>r({width:c,height:d}))}},Ge=o.defineComponent({name:"UseElementVisibility",props:["as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive({isVisible:m.useElementVisibility(n)});return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}});function q(e,t,n={}){const{root:r,rootMargin:a="0px",threshold:i=.1,window:l=E,immediate:c=!0}=n,d=K(()=>l&&"IntersectionObserver"in l),g=o.computed(()=>{const y=u.toValue(e);return(Array.isArray(y)?y:[y]).map(U).filter(u.notNullish)});let v=u.noop;const f=o.ref(c),p=d.value?o.watch(()=>[g.value,U(r),f.value],([y,b])=>{if(v(),!f.value||!y.length)return;const C=new IntersectionObserver(t,{root:U(b),rootMargin:a,threshold:i});y.forEach(O=>O&&C.observe(O)),v=()=>{C.disconnect(),v=u.noop}},{immediate:c,flush:"post"}):u.noop,h=()=>{v(),p(),f.value=!1};return u.tryOnScopeDispose(h),{isSupported:d,isActive:f,pause(){v(),f.value=!1},resume(){f.value=!0},stop:h}}function Q(e,t={}){const{window:n=E,scrollTarget:r}=t,a=o.ref(!1);return q(e,([{isIntersecting:i}])=>{a.value=i},{root:r,window:n,threshold:0}),a}const Je={[u.directiveHooks.mounted](e,t){if(typeof t.value=="function"){const n=t.value,r=Q(e);o.watch(r,a=>n(a),{immediate:!0})}else{const[n,r]=t.value,a=Q(e,r);o.watch(a,i=>n(i),{immediate:!0})}}},Ye=o.defineComponent({name:"UseEyeDropper",props:{sRGBHex:String},setup(e,{slots:t}){const n=o.reactive(m.useEyeDropper());return()=>{if(t.default)return t.default(n)}}}),$e=o.defineComponent({name:"UseFullscreen",props:["as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(m.useFullscreen(n));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}}),Xe=o.defineComponent({name:"UseGeolocation",props:["enableHighAccuracy","maximumAge","timeout","navigator"],setup(e,{slots:t}){const n=o.reactive(m.useGeolocation(e));return()=>{if(t.default)return t.default(n)}}}),qe=o.defineComponent({name:"UseIdle",props:["timeout","events","listenForVisibilityChange","initialState"],setup(e,{slots:t}){const n=o.reactive(m.useIdle(e.timeout,e));return()=>{if(t.default)return t.default(n)}}});function Qe(e,t,n){const{immediate:r=!0,delay:a=0,onError:i=u.noop,onSuccess:l=u.noop,resetOnExecute:c=!0,shallow:d=!0,throwError:g}=n??{},v=d?o.shallowRef(t):o.ref(t),f=o.ref(!1),p=o.ref(!1),h=o.shallowRef(void 0);async function y(O=0,...A){c&&(v.value=t),h.value=void 0,f.value=!1,p.value=!0,O>0&&await u.promiseTimeout(O);const z=typeof e=="function"?e(...A):e;try{const P=await z;v.value=P,f.value=!0,l(P)}catch(P){if(h.value=P,i(P),g)throw P}finally{p.value=!1}return v.value}r&&y(a);const b={state:v,isReady:f,isLoading:p,error:h,execute:y};function C(){return new Promise((O,A)=>{u.until(p).toBe(!1).then(()=>O(b)).catch(A)})}return{...b,then(O,A){return C().then(O,A)}}}async function Ze(e){return new Promise((t,n)=>{const r=new Image,{src:a,srcset:i,sizes:l,class:c,loading:d,crossorigin:g,referrerPolicy:v}=e;r.src=a,i&&(r.srcset=i),l&&(r.sizes=l),c&&(r.className=c),d&&(r.loading=d),g&&(r.crossOrigin=g),v&&(r.referrerPolicy=v),r.onload=()=>t(r),r.onerror=n})}function xe(e,t={}){const n=Qe(()=>Ze(u.toValue(e)),void 0,{resetOnExecute:!0,...t});return o.watch(()=>u.toValue(e),()=>n.execute(t.delay),{deep:!0}),n}const De=o.defineComponent({name:"UseImage",props:["src","srcset","sizes","as","alt","class","loading","crossorigin","referrerPolicy"],setup(e,{slots:t}){const n=o.reactive(xe(e));return()=>n.isLoading&&t.loading?t.loading(n):n.error&&t.error?t.error(n.error):t.default?t.default(n):o.h(e.as||"img",e)}}),ne=1;function Z(e,t={}){const{throttle:n=0,idle:r=200,onStop:a=u.noop,onScroll:i=u.noop,offset:l={left:0,right:0,top:0,bottom:0},eventListenerOptions:c={capture:!1,passive:!0},behavior:d="auto",window:g=E}=t,v=o.ref(0),f=o.ref(0),p=o.computed({get(){return v.value},set(S){y(S,void 0)}}),h=o.computed({get(){return f.value},set(S){y(void 0,S)}});function y(S,T){var k,w,L;if(!g)return;const M=u.toValue(e);M&&((L=M instanceof Document?g.document.body:M)==null||L.scrollTo({top:(k=u.toValue(T))!=null?k:h.value,left:(w=u.toValue(S))!=null?w:p.value,behavior:u.toValue(d)}))}const b=o.ref(!1),C=o.reactive({left:!0,right:!1,top:!0,bottom:!1}),O=o.reactive({left:!1,right:!1,top:!1,bottom:!1}),A=S=>{b.value&&(b.value=!1,O.left=!1,O.right=!1,O.top=!1,O.bottom=!1,a(S))},z=u.useDebounceFn(A,n+r),P=S=>{var T;if(!g)return;const k=S.document?S.document.documentElement:(T=S.documentElement)!=null?T:S,{display:w,flexDirection:L}=getComputedStyle(k),M=k.scrollLeft;O.left=M<v.value,O.right=M>v.value;const ue=Math.abs(M)<=0+(l.left||0),ce=Math.abs(M)+k.clientWidth>=k.scrollWidth-(l.right||0)-ne;w==="flex"&&L==="row-reverse"?(C.left=ce,C.right=ue):(C.left=ue,C.right=ce),v.value=M;let N=k.scrollTop;S===g.document&&!N&&(N=g.document.body.scrollTop),O.top=N<f.value,O.bottom=N>f.value;const fe=Math.abs(N)<=0+(l.top||0),de=Math.abs(N)+k.clientHeight>=k.scrollHeight-(l.bottom||0)-ne;w==="flex"&&L==="column-reverse"?(C.top=de,C.bottom=fe):(C.top=fe,C.bottom=de),f.value=N},I=S=>{var T;if(!g)return;const k=(T=S.target.documentElement)!=null?T:S.target;P(k),b.value=!0,z(S),i(S)};return _(e,"scroll",n?u.useThrottleFn(I,n,!0,!1):I,c),u.tryOnMounted(()=>{const S=u.toValue(e);S&&P(S)}),_(e,"scrollend",A,c),{x:p,y:h,isScrolling:b,arrivedState:C,directions:O,measure(){const S=u.toValue(e);g&&S&&P(S)}}}function G(e){return typeof Window<"u"&&e instanceof Window?e.document.documentElement:typeof Document<"u"&&e instanceof Document?e.documentElement:e}function oe(e,t,n={}){var r;const{direction:a="bottom",interval:i=100}=n,l=o.reactive(Z(e,{...n,offset:{[a]:(r=n.distance)!=null?r:0,...n.offset}})),c=o.ref(),d=o.computed(()=>!!c.value),g=o.computed(()=>G(u.toValue(e))),v=Q(g);function f(){if(l.measure(),!g.value||!v.value)return;const{scrollHeight:p,clientHeight:h,scrollWidth:y,clientWidth:b}=g.value,C=a==="bottom"||a==="top"?p<=h:y<=b;(l.arrivedState[a]||C)&&(c.value||(c.value=Promise.all([t(l),new Promise(O=>setTimeout(O,i))]).finally(()=>{c.value=null,o.nextTick(()=>f())})))}return o.watch(()=>[l.arrivedState[a],v.value],f,{immediate:!0}),{isLoading:d}}const et={[u.directiveHooks.mounted](e,t){typeof t.value=="function"?oe(e,t.value):oe(e,...t.value)}},tt={[u.directiveHooks.mounted](e,t){typeof t.value=="function"?q(e,t.value):q(e,...t.value)}},nt=o.defineComponent({name:"UseMouse",props:["touch","resetOnTouchEnds","initialValue"],setup(e,{slots:t}){const n=o.reactive(m.useMouse(e));return()=>{if(t.default)return t.default(n)}}}),ot=o.defineComponent({name:"UseMouseElement",props:["handleOutside","as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(m.useMouseInElement(n,e));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}}),rt=o.defineComponent({name:"UseMousePressed",props:["touch","initialValue","as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(m.useMousePressed({...e,target:n}));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}}),at=o.defineComponent({name:"UseNetwork",setup(e,{slots:t}){const n=o.reactive(m.useNetwork());return()=>{if(t.default)return t.default(n)}}}),st=o.defineComponent({name:"UseNow",props:["interval"],setup(e,{slots:t}){const n=o.reactive(m.useNow({...e,controls:!0}));return()=>{if(t.default)return t.default(n)}}}),it=o.defineComponent({name:"UseObjectUrl",props:["object"],setup(e,{slots:t}){const n=u.toRef(e,"object"),r=m.useObjectUrl(n);return()=>{if(t.default&&r.value)return t.default(r)}}}),lt=o.defineComponent({name:"UseOffsetPagination",props:["total","page","pageSize","onPageChange","onPageSizeChange","onPageCountChange"],emits:["page-change","page-size-change","page-count-change"],setup(e,{slots:t,emit:n}){const r=o.reactive(m.useOffsetPagination({...e,onPageChange(...a){var i;(i=e.onPageChange)==null||i.call(e,...a),n("page-change",...a)},onPageSizeChange(...a){var i;(i=e.onPageSizeChange)==null||i.call(e,...a),n("page-size-change",...a)},onPageCountChange(...a){var i;(i=e.onPageCountChange)==null||i.call(e,...a),n("page-count-change",...a)}}));return()=>{if(t.default)return t.default(r)}}}),ut=o.defineComponent({name:"UseOnline",setup(e,{slots:t}){const n=o.reactive({isOnline:m.useOnline()});return()=>{if(t.default)return t.default(n)}}}),ct=o.defineComponent({name:"UsePageLeave",setup(e,{slots:t}){const n=o.reactive({isLeft:m.usePageLeave()});return()=>{if(t.default)return t.default(n)}}}),ft=o.defineComponent({name:"UsePointer",props:["pointerTypes","initialValue","target"],setup(e,{slots:t}){const n=o.ref(null),r=o.reactive(m.usePointer({...e,target:e.target==="self"?n:E}));return()=>{if(t.default)return t.default(r,{ref:n})}}}),dt=o.defineComponent({name:"UsePointerLock",props:["as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(m.usePointerLock(n));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}}),pt=o.defineComponent({name:"UsePreferredColorScheme",setup(e,{slots:t}){const n=o.reactive({colorScheme:m.usePreferredColorScheme()});return()=>{if(t.default)return t.default(n)}}}),vt=o.defineComponent({name:"UsePreferredContrast",setup(e,{slots:t}){const n=o.reactive({contrast:m.usePreferredContrast()});return()=>{if(t.default)return t.default(n)}}}),gt=o.defineComponent({name:"UsePreferredDark",setup(e,{slots:t}){const n=o.reactive({prefersDark:m.usePreferredDark()});return()=>{if(t.default)return t.default(n)}}}),mt=o.defineComponent({name:"UsePreferredLanguages",setup(e,{slots:t}){const n=o.reactive({languages:m.usePreferredLanguages()});return()=>{if(t.default)return t.default(n)}}}),ht=o.defineComponent({name:"UsePreferredReducedMotion",setup(e,{slots:t}){const n=o.reactive({motion:m.usePreferredReducedMotion()});return()=>{if(t.default)return t.default(n)}}});function yt(e,t,n={}){const{window:r=E,...a}=n;let i;const l=K(()=>r&&"MutationObserver"in r),c=()=>{i&&(i.disconnect(),i=void 0)},d=o.watch(()=>U(e),f=>{c(),l.value&&r&&f&&(i=new MutationObserver(t),i.observe(f,a))},{immediate:!0}),g=()=>i?.takeRecords(),v=()=>{c(),d()};return u.tryOnScopeDispose(v),{isSupported:l,stop:v,takeRecords:g}}function J(e,t,n={}){const{window:r=E,initialValue:a="",observe:i=!1}=n,l=o.ref(a),c=o.computed(()=>{var g;return U(t)||((g=r?.document)==null?void 0:g.documentElement)});function d(){var g;const v=u.toValue(e),f=u.toValue(c);if(f&&r){const p=(g=r.getComputedStyle(f).getPropertyValue(v))==null?void 0:g.trim();l.value=p||a}}return i&&yt(c,d,{attributeFilter:["style","class"],window:r}),o.watch([c,()=>u.toValue(e)],d,{immediate:!0}),o.watch(l,g=>{var v;(v=c.value)!=null&&v.style&&c.value.style.setProperty(u.toValue(e),g)}),l}const re="--vueuse-safe-area-top",ae="--vueuse-safe-area-right",se="--vueuse-safe-area-bottom",ie="--vueuse-safe-area-left";function wt(){const e=o.ref(""),t=o.ref(""),n=o.ref(""),r=o.ref("");if(u.isClient){const i=J(re),l=J(ae),c=J(se),d=J(ie);i.value="env(safe-area-inset-top, 0px)",l.value="env(safe-area-inset-right, 0px)",c.value="env(safe-area-inset-bottom, 0px)",d.value="env(safe-area-inset-left, 0px)",a(),_("resize",u.useDebounceFn(a))}function a(){e.value=Y(re),t.value=Y(ae),n.value=Y(se),r.value=Y(ie)}return{top:e,right:t,bottom:n,left:r,update:a}}function Y(e){return getComputedStyle(document.documentElement).getPropertyValue(e)}const Ut=o.defineComponent({name:"UseScreenSafeArea",props:{top:Boolean,right:Boolean,bottom:Boolean,left:Boolean},setup(e,{slots:t}){const{top:n,right:r,bottom:a,left:i}=wt();return()=>{if(t.default)return o.h("div",{style:{paddingTop:e.top?n.value:"",paddingRight:e.right?r.value:"",paddingBottom:e.bottom?a.value:"",paddingLeft:e.left?i.value:"",boxSizing:"border-box",maxHeight:"100vh",maxWidth:"100vw",overflow:"auto"}},t.default())}}}),bt={[u.directiveHooks.mounted](e,t){if(typeof t.value=="function"){const n=t.value,r=Z(e,{onScroll(){n(r)},onStop(){n(r)}})}else{const[n,r]=t.value,a=Z(e,{...r,onScroll(i){var l;(l=r.onScroll)==null||l.call(r,i),n(a)},onStop(i){var l;(l=r.onStop)==null||l.call(r,i),n(a)}})}}};function le(e){const t=window.getComputedStyle(e);if(t.overflowX==="scroll"||t.overflowY==="scroll"||t.overflowX==="auto"&&e.clientWidth<e.scrollWidth||t.overflowY==="auto"&&e.clientHeight<e.scrollHeight)return!0;{const n=e.parentNode;return!n||n.tagName==="BODY"?!1:le(n)}}function Ct(e){const t=e||window.event,n=t.target;return le(n)?!1:t.touches.length>1?!0:(t.preventDefault&&t.preventDefault(),!1)}const $=new WeakMap;function St(e,t=!1){const n=o.ref(t);let r=null,a;o.watch(u.toRef(e),c=>{const d=G(u.toValue(c));if(d){const g=d;$.get(g)||$.set(g,a),n.value&&(g.style.overflow="hidden")}},{immediate:!0});const i=()=>{const c=G(u.toValue(e));!c||n.value||(u.isIOS&&(r=_(c,"touchmove",d=>{Ct(d)},{passive:!1})),c.style.overflow="hidden",n.value=!0)},l=()=>{var c;const d=G(u.toValue(e));!d||!n.value||(u.isIOS&&r?.(),d.style.overflow=(c=$.get(d))!=null?c:"",$.delete(d),n.value=!1)};return u.tryOnScopeDispose(l),o.computed({get(){return n.value},set(c){c?i():l()}})}function Ot(){let e=!1;const t=o.ref(!1);return(n,r)=>{if(t.value=r.value,e)return;e=!0;const a=St(n,r.value);o.watch(t,i=>a.value=i)}}const Et=Ot(),Pt=o.defineComponent({name:"UseTimeAgo",props:["time","updateInterval","max","fullDateFormatter","messages","showSecond"],setup(e,{slots:t}){const n=o.reactive(m.useTimeAgo(()=>e.time,{...e,controls:!0}));return()=>{if(t.default)return t.default(n)}}}),Lt=o.defineComponent({name:"UseTimestamp",props:["immediate","interval","offset"],setup(e,{slots:t}){const n=o.reactive(m.useTimestamp({...e,controls:!0}));return()=>{if(t.default)return t.default(n)}}}),kt=o.defineComponent({name:"UseVirtualList",props:["list","options","height"],setup(e,{slots:t,expose:n}){const{list:r}=o.toRefs(e),{list:a,containerProps:i,wrapperProps:l,scrollTo:c}=m.useVirtualList(r,e.options);return n({scrollTo:c}),i.style&&typeof i.style=="object"&&!Array.isArray(i.style)&&(i.style.height=e.height||"300px"),()=>o.h("div",{...i},[o.h("div",{...l.value},a.value.map(d=>o.h("div",{style:{overFlow:"hidden",height:d.height}},t.default?t.default(d):"Please set content!")))])}}),_t=o.defineComponent({name:"UseWindowFocus",setup(e,{slots:t}){const n=o.reactive({focused:m.useWindowFocus()});return()=>{if(t.default)return t.default(n)}}}),At=o.defineComponent({name:"UseWindowSize",props:["initialWidth","initialHeight"],setup(e,{slots:t}){const n=o.reactive(m.useWindowSize(e));return()=>{if(t.default)return t.default(n)}}});s.OnClickOutside=x,s.OnLongPress=ge,s.UseActiveElement=me,s.UseBattery=he,s.UseBrowserLocation=ye,s.UseClipboard=we,s.UseColorMode=_e,s.UseDark=Ae,s.UseDeviceMotion=Me,s.UseDeviceOrientation=Te,s.UseDevicePixelRatio=Ve,s.UseDevicesList=Ie,s.UseDocumentVisibility=Re,s.UseDraggable=He,s.UseElementBounding=ze,s.UseElementSize=Be,s.UseElementVisibility=Ge,s.UseEyeDropper=Ye,s.UseFullscreen=$e,s.UseGeolocation=Xe,s.UseIdle=qe,s.UseImage=De,s.UseMouse=nt,s.UseMouseInElement=ot,s.UseMousePressed=rt,s.UseNetwork=at,s.UseNow=st,s.UseObjectUrl=it,s.UseOffsetPagination=lt,s.UseOnline=ut,s.UsePageLeave=ct,s.UsePointer=ft,s.UsePointerLock=dt,s.UsePreferredColorScheme=pt,s.UsePreferredContrast=vt,s.UsePreferredDark=gt,s.UsePreferredLanguages=mt,s.UsePreferredReducedMotion=ht,s.UseScreenSafeArea=Ut,s.UseTimeAgo=Pt,s.UseTimestamp=Lt,s.UseVirtualList=kt,s.UseWindowFocus=_t,s.UseWindowSize=At,s.VOnClickOutside=B,s.VOnLongPress=D,s.vElementHover=We,s.vElementSize=Ke,s.vElementVisibility=Je,s.vInfiniteScroll=et,s.vIntersectionObserver=tt,s.vOnClickOutside=B,s.vOnKeyStroke=pe,s.vOnLongPress=D,s.vScroll=bt,s.vScrollLock=Et})(this.VueUse=this.VueUse||{},VueDemi,VueUse,VueUse);
|
package/index.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { defineComponent, ref, h, watch, computed, reactive, shallowRef, nextTick, getCurrentInstance, onMounted, watchEffect, toRefs } from 'vue-demi';
|
|
2
|
-
import { onClickOutside as onClickOutside$1, useActiveElement, useBattery, useBrowserLocation, useDark, useDeviceMotion, useDeviceOrientation, useDevicePixelRatio, useDevicesList, useDocumentVisibility, useStorage as useStorage$1, isClient as isClient$1, useDraggable, useElementBounding, useElementSize as useElementSize$1, useElementVisibility as useElementVisibility$1, useEyeDropper, useFullscreen, useGeolocation, useIdle, useMouse, useMouseInElement, useMousePressed, useNetwork, useNow, useObjectUrl, useOffsetPagination, useOnline, usePageLeave, usePointer, usePointerLock, usePreferredColorScheme, usePreferredContrast, usePreferredDark as usePreferredDark$1, usePreferredLanguages, usePreferredReducedMotion, useTimeAgo, useTimestamp, useVirtualList, useWindowFocus, useWindowSize } from '@vueuse/core';
|
|
3
|
-
import { toValue, isClient, noop, isObject, tryOnScopeDispose, isIOS, directiveHooks, pausableWatch,
|
|
2
|
+
import { onClickOutside as onClickOutside$1, useActiveElement, useBattery, useBrowserLocation, useClipboard, useDark, useDeviceMotion, useDeviceOrientation, useDevicePixelRatio, useDevicesList, useDocumentVisibility, useStorage as useStorage$1, isClient as isClient$1, useDraggable, useElementBounding, useElementSize as useElementSize$1, useElementVisibility as useElementVisibility$1, useEyeDropper, useFullscreen, useGeolocation, useIdle, useMouse, useMouseInElement, useMousePressed, useNetwork, useNow, useObjectUrl, useOffsetPagination, useOnline, usePageLeave, usePointer, usePointerLock, usePreferredColorScheme, usePreferredContrast, usePreferredDark as usePreferredDark$1, usePreferredLanguages, usePreferredReducedMotion, useTimeAgo, useTimestamp, useVirtualList, useWindowFocus, useWindowSize } from '@vueuse/core';
|
|
3
|
+
import { toValue, isClient, noop, isObject, tryOnScopeDispose, isIOS, directiveHooks, pausableWatch, tryOnMounted, toRef, useToggle, notNullish, promiseTimeout, until, useDebounceFn, useThrottleFn } from '@vueuse/shared';
|
|
4
4
|
|
|
5
5
|
const OnClickOutside = /* @__PURE__ */ /* #__PURE__ */ defineComponent({
|
|
6
6
|
name: "OnClickOutside",
|
|
@@ -112,8 +112,7 @@ function onClickOutside(target, handler, options = {}) {
|
|
|
112
112
|
useEventListener(window, "click", listener, { passive: true, capture }),
|
|
113
113
|
useEventListener(window, "pointerdown", (e) => {
|
|
114
114
|
const el = unrefElement(target);
|
|
115
|
-
|
|
116
|
-
shouldListen = !e.composedPath().includes(el) && !shouldIgnore(e);
|
|
115
|
+
shouldListen = !shouldIgnore(e) && !!(el && !e.composedPath().includes(el));
|
|
117
116
|
}, { passive: true }),
|
|
118
117
|
detectIframe && useEventListener(window, "blur", (event) => {
|
|
119
118
|
setTimeout(() => {
|
|
@@ -236,8 +235,12 @@ function onLongPress(target, handler, options) {
|
|
|
236
235
|
capture: (_a = options == null ? void 0 : options.modifiers) == null ? void 0 : _a.capture,
|
|
237
236
|
once: (_b = options == null ? void 0 : options.modifiers) == null ? void 0 : _b.once
|
|
238
237
|
};
|
|
239
|
-
|
|
240
|
-
|
|
238
|
+
const cleanup = [
|
|
239
|
+
useEventListener(elementRef, "pointerdown", onDown, listenerOptions),
|
|
240
|
+
useEventListener(elementRef, ["pointerup", "pointerleave"], clear, listenerOptions)
|
|
241
|
+
].filter(Boolean);
|
|
242
|
+
const stop = () => cleanup.forEach((fn) => fn());
|
|
243
|
+
return stop;
|
|
241
244
|
}
|
|
242
245
|
|
|
243
246
|
const OnLongPress = /* @__PURE__ */ /* #__PURE__ */ defineComponent({
|
|
@@ -304,6 +307,24 @@ const UseBrowserLocation = /* @__PURE__ */ /* #__PURE__ */ defineComponent({
|
|
|
304
307
|
}
|
|
305
308
|
});
|
|
306
309
|
|
|
310
|
+
const UseClipboard = /* @__PURE__ */ /* #__PURE__ */ defineComponent({
|
|
311
|
+
name: "UseClipboard",
|
|
312
|
+
props: [
|
|
313
|
+
"source",
|
|
314
|
+
"read",
|
|
315
|
+
"navigator",
|
|
316
|
+
"copiedDuring",
|
|
317
|
+
"legacy"
|
|
318
|
+
],
|
|
319
|
+
setup(props, { slots }) {
|
|
320
|
+
const data = reactive(useClipboard(props));
|
|
321
|
+
return () => {
|
|
322
|
+
var _a;
|
|
323
|
+
return (_a = slots.default) == null ? void 0 : _a.call(slots, data);
|
|
324
|
+
};
|
|
325
|
+
}
|
|
326
|
+
});
|
|
327
|
+
|
|
307
328
|
const _global = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
|
|
308
329
|
const globalKey = "__vueuse_ssr_handlers__";
|
|
309
330
|
const handlers = /* @__PURE__ */ getHandlers();
|
|
@@ -368,9 +389,10 @@ function useStorage(key, defaults, storage, options = {}) {
|
|
|
368
389
|
eventFilter,
|
|
369
390
|
onError = (e) => {
|
|
370
391
|
console.error(e);
|
|
371
|
-
}
|
|
392
|
+
},
|
|
393
|
+
initOnMounted
|
|
372
394
|
} = options;
|
|
373
|
-
const data = (shallow ? shallowRef : ref)(defaults);
|
|
395
|
+
const data = (shallow ? shallowRef : ref)(typeof defaults === "function" ? defaults() : defaults);
|
|
374
396
|
if (!storage) {
|
|
375
397
|
try {
|
|
376
398
|
storage = getSSRHandler("getDefaultStorage", () => {
|
|
@@ -392,10 +414,15 @@ function useStorage(key, defaults, storage, options = {}) {
|
|
|
392
414
|
{ flush, deep, eventFilter }
|
|
393
415
|
);
|
|
394
416
|
if (window && listenToStorageChanges) {
|
|
395
|
-
|
|
396
|
-
|
|
417
|
+
tryOnMounted(() => {
|
|
418
|
+
useEventListener(window, "storage", update);
|
|
419
|
+
useEventListener(window, customStorageEventName, updateFromCustomEvent);
|
|
420
|
+
if (initOnMounted)
|
|
421
|
+
update();
|
|
422
|
+
});
|
|
397
423
|
}
|
|
398
|
-
|
|
424
|
+
if (!initOnMounted)
|
|
425
|
+
update();
|
|
399
426
|
return data;
|
|
400
427
|
function write(v) {
|
|
401
428
|
try {
|
|
@@ -851,7 +878,7 @@ function useElementSize(target, initialSize = { width: 0, height: 0 }, options =
|
|
|
851
878
|
});
|
|
852
879
|
const width = ref(initialSize.width);
|
|
853
880
|
const height = ref(initialSize.height);
|
|
854
|
-
useResizeObserver(
|
|
881
|
+
const { stop: stop1 } = useResizeObserver(
|
|
855
882
|
target,
|
|
856
883
|
([entry]) => {
|
|
857
884
|
const boxSize = box === "border-box" ? entry.borderBoxSize : box === "content-box" ? entry.contentBoxSize : entry.devicePixelContentBoxSize;
|
|
@@ -875,16 +902,28 @@ function useElementSize(target, initialSize = { width: 0, height: 0 }, options =
|
|
|
875
902
|
},
|
|
876
903
|
options
|
|
877
904
|
);
|
|
878
|
-
|
|
905
|
+
tryOnMounted(() => {
|
|
906
|
+
const ele = unrefElement(target);
|
|
907
|
+
if (ele) {
|
|
908
|
+
width.value = "offsetWidth" in ele ? ele.offsetWidth : initialSize.width;
|
|
909
|
+
height.value = "offsetHeight" in ele ? ele.offsetHeight : initialSize.height;
|
|
910
|
+
}
|
|
911
|
+
});
|
|
912
|
+
const stop2 = watch(
|
|
879
913
|
() => unrefElement(target),
|
|
880
914
|
(ele) => {
|
|
881
915
|
width.value = ele ? initialSize.width : 0;
|
|
882
916
|
height.value = ele ? initialSize.height : 0;
|
|
883
917
|
}
|
|
884
918
|
);
|
|
919
|
+
function stop() {
|
|
920
|
+
stop1();
|
|
921
|
+
stop2();
|
|
922
|
+
}
|
|
885
923
|
return {
|
|
886
924
|
width,
|
|
887
|
-
height
|
|
925
|
+
height,
|
|
926
|
+
stop
|
|
888
927
|
};
|
|
889
928
|
}
|
|
890
929
|
|
|
@@ -1305,6 +1344,12 @@ function useScroll(element, options = {}) {
|
|
|
1305
1344
|
throttle ? useThrottleFn(onScrollHandler, throttle, true, false) : onScrollHandler,
|
|
1306
1345
|
eventListenerOptions
|
|
1307
1346
|
);
|
|
1347
|
+
tryOnMounted(() => {
|
|
1348
|
+
const _element = toValue(element);
|
|
1349
|
+
if (!_element)
|
|
1350
|
+
return;
|
|
1351
|
+
setArrivedState(_element);
|
|
1352
|
+
});
|
|
1308
1353
|
useEventListener(
|
|
1309
1354
|
element,
|
|
1310
1355
|
"scrollend",
|
|
@@ -1663,6 +1708,9 @@ function useMutationObserver(target, callback, options = {}) {
|
|
|
1663
1708
|
},
|
|
1664
1709
|
{ immediate: true }
|
|
1665
1710
|
);
|
|
1711
|
+
const takeRecords = () => {
|
|
1712
|
+
return observer == null ? void 0 : observer.takeRecords();
|
|
1713
|
+
};
|
|
1666
1714
|
const stop = () => {
|
|
1667
1715
|
cleanup();
|
|
1668
1716
|
stopWatch();
|
|
@@ -1670,7 +1718,8 @@ function useMutationObserver(target, callback, options = {}) {
|
|
|
1670
1718
|
tryOnScopeDispose(stop);
|
|
1671
1719
|
return {
|
|
1672
1720
|
isSupported,
|
|
1673
|
-
stop
|
|
1721
|
+
stop,
|
|
1722
|
+
takeRecords
|
|
1674
1723
|
};
|
|
1675
1724
|
}
|
|
1676
1725
|
|
|
@@ -1838,6 +1887,7 @@ function preventDefault(rawEvent) {
|
|
|
1838
1887
|
e.preventDefault();
|
|
1839
1888
|
return false;
|
|
1840
1889
|
}
|
|
1890
|
+
const elInitialOverflow = /* @__PURE__ */ new WeakMap();
|
|
1841
1891
|
function useScrollLock(element, initialState = false) {
|
|
1842
1892
|
const isLocked = ref(initialState);
|
|
1843
1893
|
let stopTouchMoveListener = null;
|
|
@@ -1846,7 +1896,8 @@ function useScrollLock(element, initialState = false) {
|
|
|
1846
1896
|
const target = resolveElement(toValue(el));
|
|
1847
1897
|
if (target) {
|
|
1848
1898
|
const ele = target;
|
|
1849
|
-
|
|
1899
|
+
if (!elInitialOverflow.get(ele))
|
|
1900
|
+
elInitialOverflow.set(ele, initialOverflow);
|
|
1850
1901
|
if (isLocked.value)
|
|
1851
1902
|
ele.style.overflow = "hidden";
|
|
1852
1903
|
}
|
|
@@ -1871,11 +1922,13 @@ function useScrollLock(element, initialState = false) {
|
|
|
1871
1922
|
isLocked.value = true;
|
|
1872
1923
|
};
|
|
1873
1924
|
const unlock = () => {
|
|
1925
|
+
var _a;
|
|
1874
1926
|
const el = resolveElement(toValue(element));
|
|
1875
1927
|
if (!el || !isLocked.value)
|
|
1876
1928
|
return;
|
|
1877
1929
|
isIOS && (stopTouchMoveListener == null ? void 0 : stopTouchMoveListener());
|
|
1878
|
-
el.style.overflow =
|
|
1930
|
+
el.style.overflow = (_a = elInitialOverflow.get(el)) != null ? _a : "";
|
|
1931
|
+
elInitialOverflow.delete(el);
|
|
1879
1932
|
isLocked.value = false;
|
|
1880
1933
|
};
|
|
1881
1934
|
tryOnScopeDispose(unlock);
|
|
@@ -1941,7 +1994,8 @@ const UseVirtualList = /* @__PURE__ */ /* #__PURE__ */ defineComponent({
|
|
|
1941
1994
|
const { list: listRef } = toRefs(props);
|
|
1942
1995
|
const { list, containerProps, wrapperProps, scrollTo } = useVirtualList(listRef, props.options);
|
|
1943
1996
|
expose({ scrollTo });
|
|
1944
|
-
typeof containerProps.style === "object" && !Array.isArray(containerProps.style)
|
|
1997
|
+
if (containerProps.style && typeof containerProps.style === "object" && !Array.isArray(containerProps.style))
|
|
1998
|
+
containerProps.style.height = props.height || "300px";
|
|
1945
1999
|
return () => h("div", { ...containerProps }, [
|
|
1946
2000
|
h("div", { ...wrapperProps.value }, list.value.map((item) => h("div", { style: { overFlow: "hidden", height: item.height } }, slots.default ? slots.default(item) : "Please set content!")))
|
|
1947
2001
|
]);
|
|
@@ -1973,4 +2027,4 @@ const UseWindowSize = /* @__PURE__ */ /* #__PURE__ */ defineComponent({
|
|
|
1973
2027
|
}
|
|
1974
2028
|
});
|
|
1975
2029
|
|
|
1976
|
-
export { OnClickOutside, OnLongPress, UseActiveElement, UseBattery, UseBrowserLocation, UseColorMode, UseDark, UseDeviceMotion, UseDeviceOrientation, UseDevicePixelRatio, UseDevicesList, UseDocumentVisibility, UseDraggable, UseElementBounding, UseElementSize, UseElementVisibility, UseEyeDropper, UseFullscreen, UseGeolocation, UseIdle, UseImage, UseMouse, UseMouseInElement, UseMousePressed, UseNetwork, UseNow, UseObjectUrl, UseOffsetPagination, UseOnline, UsePageLeave, UsePointer, UsePointerLock, UsePreferredColorScheme, UsePreferredContrast, UsePreferredDark, UsePreferredLanguages, UsePreferredReducedMotion, UseScreenSafeArea, UseTimeAgo, UseTimestamp, UseVirtualList, UseWindowFocus, UseWindowSize, vOnClickOutside as VOnClickOutside, vOnLongPress as VOnLongPress, vElementHover, vElementSize, vElementVisibility, vInfiniteScroll, vIntersectionObserver, vOnClickOutside, vOnKeyStroke, vOnLongPress, vScroll, vScrollLock };
|
|
2030
|
+
export { OnClickOutside, OnLongPress, UseActiveElement, UseBattery, UseBrowserLocation, UseClipboard, UseColorMode, UseDark, UseDeviceMotion, UseDeviceOrientation, UseDevicePixelRatio, UseDevicesList, UseDocumentVisibility, UseDraggable, UseElementBounding, UseElementSize, UseElementVisibility, UseEyeDropper, UseFullscreen, UseGeolocation, UseIdle, UseImage, UseMouse, UseMouseInElement, UseMousePressed, UseNetwork, UseNow, UseObjectUrl, UseOffsetPagination, UseOnline, UsePageLeave, UsePointer, UsePointerLock, UsePreferredColorScheme, UsePreferredContrast, UsePreferredDark, UsePreferredLanguages, UsePreferredReducedMotion, UseScreenSafeArea, UseTimeAgo, UseTimestamp, UseVirtualList, UseWindowFocus, UseWindowSize, vOnClickOutside as VOnClickOutside, vOnLongPress as VOnLongPress, vElementHover, vElementSize, vElementVisibility, vInfiniteScroll, vIntersectionObserver, vOnClickOutside, vOnKeyStroke, vOnLongPress, vScroll, vScrollLock };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vueuse/components",
|
|
3
|
-
"version": "10.
|
|
3
|
+
"version": "10.6.1",
|
|
4
4
|
"description": "Renderless components for VueUse",
|
|
5
5
|
"author": "Jacob Clevenger<https://github.com/wheatjs>",
|
|
6
6
|
"license": "MIT",
|
|
@@ -32,8 +32,8 @@
|
|
|
32
32
|
"jsdelivr": "./index.iife.min.js",
|
|
33
33
|
"types": "./index.d.cts",
|
|
34
34
|
"dependencies": {
|
|
35
|
-
"@vueuse/core": "10.
|
|
36
|
-
"@vueuse/shared": "10.
|
|
35
|
+
"@vueuse/core": "10.6.1",
|
|
36
|
+
"@vueuse/shared": "10.6.1",
|
|
37
37
|
"vue-demi": ">=0.14.6"
|
|
38
38
|
}
|
|
39
39
|
}
|