@vueuse/components 10.6.1 → 10.7.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/README.md +3 -3
- package/index.cjs +40 -7
- package/index.d.cts +15 -2
- package/index.d.mts +15 -2
- package/index.d.ts +15 -2
- package/index.iife.js +40 -7
- package/index.iife.min.js +1 -1
- package/index.mjs +40 -7
- package/package.json +3 -3
package/README.md
CHANGED
package/index.cjs
CHANGED
|
@@ -81,7 +81,7 @@ let _iOSWorkaround = false;
|
|
|
81
81
|
function onClickOutside(target, handler, options = {}) {
|
|
82
82
|
const { window = defaultWindow, ignore = [], capture = true, detectIframe = false } = options;
|
|
83
83
|
if (!window)
|
|
84
|
-
return;
|
|
84
|
+
return shared.noop;
|
|
85
85
|
if (shared.isIOS && !_iOSWorkaround) {
|
|
86
86
|
_iOSWorkaround = true;
|
|
87
87
|
Array.from(window.document.body.children).forEach((el) => el.addEventListener("click", shared.noop));
|
|
@@ -209,15 +209,18 @@ const vOnKeyStroke = {
|
|
|
209
209
|
};
|
|
210
210
|
|
|
211
211
|
const DEFAULT_DELAY = 500;
|
|
212
|
+
const DEFAULT_THRESHOLD = 10;
|
|
212
213
|
function onLongPress(target, handler, options) {
|
|
213
214
|
var _a, _b;
|
|
214
215
|
const elementRef = vueDemi.computed(() => unrefElement(target));
|
|
215
216
|
let timeout;
|
|
217
|
+
let posStart;
|
|
216
218
|
function clear() {
|
|
217
219
|
if (timeout) {
|
|
218
220
|
clearTimeout(timeout);
|
|
219
221
|
timeout = void 0;
|
|
220
222
|
}
|
|
223
|
+
posStart = void 0;
|
|
221
224
|
}
|
|
222
225
|
function onDown(ev) {
|
|
223
226
|
var _a2, _b2, _c, _d;
|
|
@@ -228,19 +231,40 @@ function onLongPress(target, handler, options) {
|
|
|
228
231
|
ev.preventDefault();
|
|
229
232
|
if ((_c = options == null ? void 0 : options.modifiers) == null ? void 0 : _c.stop)
|
|
230
233
|
ev.stopPropagation();
|
|
234
|
+
posStart = {
|
|
235
|
+
x: ev.x,
|
|
236
|
+
y: ev.y
|
|
237
|
+
};
|
|
231
238
|
timeout = setTimeout(
|
|
232
239
|
() => handler(ev),
|
|
233
240
|
(_d = options == null ? void 0 : options.delay) != null ? _d : DEFAULT_DELAY
|
|
234
241
|
);
|
|
235
242
|
}
|
|
243
|
+
function onMove(ev) {
|
|
244
|
+
var _a2, _b2, _c, _d;
|
|
245
|
+
if (((_a2 = options == null ? void 0 : options.modifiers) == null ? void 0 : _a2.self) && ev.target !== elementRef.value)
|
|
246
|
+
return;
|
|
247
|
+
if (!posStart || (options == null ? void 0 : options.distanceThreshold) === false)
|
|
248
|
+
return;
|
|
249
|
+
if ((_b2 = options == null ? void 0 : options.modifiers) == null ? void 0 : _b2.prevent)
|
|
250
|
+
ev.preventDefault();
|
|
251
|
+
if ((_c = options == null ? void 0 : options.modifiers) == null ? void 0 : _c.stop)
|
|
252
|
+
ev.stopPropagation();
|
|
253
|
+
const dx = ev.x - posStart.x;
|
|
254
|
+
const dy = ev.y - posStart.y;
|
|
255
|
+
const distance = Math.sqrt(dx * dx + dy * dy);
|
|
256
|
+
if (distance >= ((_d = options == null ? void 0 : options.distanceThreshold) != null ? _d : DEFAULT_THRESHOLD))
|
|
257
|
+
clear();
|
|
258
|
+
}
|
|
236
259
|
const listenerOptions = {
|
|
237
260
|
capture: (_a = options == null ? void 0 : options.modifiers) == null ? void 0 : _a.capture,
|
|
238
261
|
once: (_b = options == null ? void 0 : options.modifiers) == null ? void 0 : _b.once
|
|
239
262
|
};
|
|
240
263
|
const cleanup = [
|
|
241
264
|
useEventListener(elementRef, "pointerdown", onDown, listenerOptions),
|
|
265
|
+
useEventListener(elementRef, "pointermove", onMove, listenerOptions),
|
|
242
266
|
useEventListener(elementRef, ["pointerup", "pointerleave"], clear, listenerOptions)
|
|
243
|
-
]
|
|
267
|
+
];
|
|
244
268
|
const stop = () => cleanup.forEach((fn) => fn());
|
|
245
269
|
return stop;
|
|
246
270
|
}
|
|
@@ -454,7 +478,7 @@ function useStorage(key, defaults, storage, options = {}) {
|
|
|
454
478
|
function read(event) {
|
|
455
479
|
const rawValue = event ? event.newValue : storage.getItem(key);
|
|
456
480
|
if (rawValue == null) {
|
|
457
|
-
if (writeDefaults && rawInit
|
|
481
|
+
if (writeDefaults && rawInit != null)
|
|
458
482
|
storage.setItem(key, serializer.write(rawInit));
|
|
459
483
|
return rawInit;
|
|
460
484
|
} else if (!event && mergeDefaults) {
|
|
@@ -1018,7 +1042,15 @@ function useElementVisibility(element, options = {}) {
|
|
|
1018
1042
|
const elementIsVisible = vueDemi.ref(false);
|
|
1019
1043
|
useIntersectionObserver(
|
|
1020
1044
|
element,
|
|
1021
|
-
(
|
|
1045
|
+
(intersectionObserverEntries) => {
|
|
1046
|
+
let isIntersecting = elementIsVisible.value;
|
|
1047
|
+
let latestTime = 0;
|
|
1048
|
+
for (const entry of intersectionObserverEntries) {
|
|
1049
|
+
if (entry.time >= latestTime) {
|
|
1050
|
+
latestTime = entry.time;
|
|
1051
|
+
isIntersecting = entry.isIntersecting;
|
|
1052
|
+
}
|
|
1053
|
+
}
|
|
1022
1054
|
elementIsVisible.value = isIntersecting;
|
|
1023
1055
|
},
|
|
1024
1056
|
{
|
|
@@ -1384,7 +1416,8 @@ function useInfiniteScroll(element, onLoadMore, options = {}) {
|
|
|
1384
1416
|
var _a;
|
|
1385
1417
|
const {
|
|
1386
1418
|
direction = "bottom",
|
|
1387
|
-
interval = 100
|
|
1419
|
+
interval = 100,
|
|
1420
|
+
canLoadMore = () => true
|
|
1388
1421
|
} = options;
|
|
1389
1422
|
const state = vueDemi.reactive(useScroll(
|
|
1390
1423
|
element,
|
|
@@ -1404,7 +1437,7 @@ function useInfiniteScroll(element, onLoadMore, options = {}) {
|
|
|
1404
1437
|
const isElementVisible = useElementVisibility(observedElement);
|
|
1405
1438
|
function checkAndLoad() {
|
|
1406
1439
|
state.measure();
|
|
1407
|
-
if (!observedElement.value || !isElementVisible.value)
|
|
1440
|
+
if (!observedElement.value || !isElementVisible.value || !canLoadMore(observedElement.value))
|
|
1408
1441
|
return;
|
|
1409
1442
|
const { scrollHeight, clientHeight, scrollWidth, clientWidth } = observedElement.value;
|
|
1410
1443
|
const isNarrower = direction === "bottom" || direction === "top" ? scrollHeight <= clientHeight : scrollWidth <= clientWidth;
|
|
@@ -1999,7 +2032,7 @@ const UseVirtualList = /* @__PURE__ */ /* #__PURE__ */ vueDemi.defineComponent({
|
|
|
1999
2032
|
if (containerProps.style && typeof containerProps.style === "object" && !Array.isArray(containerProps.style))
|
|
2000
2033
|
containerProps.style.height = props.height || "300px";
|
|
2001
2034
|
return () => vueDemi.h("div", { ...containerProps }, [
|
|
2002
|
-
vueDemi.h("div", { ...wrapperProps.value }, list.value.map((item) => vueDemi.h("div", { style: {
|
|
2035
|
+
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!")))
|
|
2003
2036
|
]);
|
|
2004
2037
|
}
|
|
2005
2038
|
});
|
package/index.d.cts
CHANGED
|
@@ -75,6 +75,12 @@ interface OnLongPressOptions {
|
|
|
75
75
|
*/
|
|
76
76
|
delay?: number;
|
|
77
77
|
modifiers?: OnLongPressModifiers;
|
|
78
|
+
/**
|
|
79
|
+
* Allowance of moving distance in pixels,
|
|
80
|
+
* The action will get canceled When moving too far from the pointerdown position.
|
|
81
|
+
* @default 10
|
|
82
|
+
*/
|
|
83
|
+
distanceThreshold?: number | false;
|
|
78
84
|
}
|
|
79
85
|
interface OnLongPressModifiers {
|
|
80
86
|
stop?: boolean;
|
|
@@ -444,7 +450,8 @@ declare function useScroll(element: MaybeRefOrGetter<HTMLElement | SVGElement |
|
|
|
444
450
|
};
|
|
445
451
|
type UseScrollReturn = ReturnType<typeof useScroll>;
|
|
446
452
|
|
|
447
|
-
|
|
453
|
+
type InfiniteScrollElement = HTMLElement | SVGElement | Window | Document | null | undefined;
|
|
454
|
+
interface UseInfiniteScrollOptions<T extends InfiniteScrollElement = InfiniteScrollElement> extends UseScrollOptions {
|
|
448
455
|
/**
|
|
449
456
|
* The minimum distance between the bottom of the element and the bottom of the viewport
|
|
450
457
|
*
|
|
@@ -463,13 +470,19 @@ interface UseInfiniteScrollOptions extends UseScrollOptions {
|
|
|
463
470
|
* @default 100
|
|
464
471
|
*/
|
|
465
472
|
interval?: number;
|
|
473
|
+
/**
|
|
474
|
+
* A function that determines whether more content can be loaded for a specific element.
|
|
475
|
+
* Should return `true` if loading more content is allowed for the given element,
|
|
476
|
+
* and `false` otherwise.
|
|
477
|
+
*/
|
|
478
|
+
canLoadMore?: (el: T) => boolean;
|
|
466
479
|
}
|
|
467
480
|
/**
|
|
468
481
|
* Reactive infinite scroll.
|
|
469
482
|
*
|
|
470
483
|
* @see https://vueuse.org/useInfiniteScroll
|
|
471
484
|
*/
|
|
472
|
-
declare function useInfiniteScroll(element: MaybeRefOrGetter<
|
|
485
|
+
declare function useInfiniteScroll<T extends InfiniteScrollElement>(element: MaybeRefOrGetter<T>, onLoadMore: (state: UnwrapNestedRefs<ReturnType<typeof useScroll>>) => Awaitable<void>, options?: UseInfiniteScrollOptions<T>): {
|
|
473
486
|
isLoading: vue_demi.ComputedRef<boolean>;
|
|
474
487
|
};
|
|
475
488
|
|
package/index.d.mts
CHANGED
|
@@ -75,6 +75,12 @@ interface OnLongPressOptions {
|
|
|
75
75
|
*/
|
|
76
76
|
delay?: number;
|
|
77
77
|
modifiers?: OnLongPressModifiers;
|
|
78
|
+
/**
|
|
79
|
+
* Allowance of moving distance in pixels,
|
|
80
|
+
* The action will get canceled When moving too far from the pointerdown position.
|
|
81
|
+
* @default 10
|
|
82
|
+
*/
|
|
83
|
+
distanceThreshold?: number | false;
|
|
78
84
|
}
|
|
79
85
|
interface OnLongPressModifiers {
|
|
80
86
|
stop?: boolean;
|
|
@@ -444,7 +450,8 @@ declare function useScroll(element: MaybeRefOrGetter<HTMLElement | SVGElement |
|
|
|
444
450
|
};
|
|
445
451
|
type UseScrollReturn = ReturnType<typeof useScroll>;
|
|
446
452
|
|
|
447
|
-
|
|
453
|
+
type InfiniteScrollElement = HTMLElement | SVGElement | Window | Document | null | undefined;
|
|
454
|
+
interface UseInfiniteScrollOptions<T extends InfiniteScrollElement = InfiniteScrollElement> extends UseScrollOptions {
|
|
448
455
|
/**
|
|
449
456
|
* The minimum distance between the bottom of the element and the bottom of the viewport
|
|
450
457
|
*
|
|
@@ -463,13 +470,19 @@ interface UseInfiniteScrollOptions extends UseScrollOptions {
|
|
|
463
470
|
* @default 100
|
|
464
471
|
*/
|
|
465
472
|
interval?: number;
|
|
473
|
+
/**
|
|
474
|
+
* A function that determines whether more content can be loaded for a specific element.
|
|
475
|
+
* Should return `true` if loading more content is allowed for the given element,
|
|
476
|
+
* and `false` otherwise.
|
|
477
|
+
*/
|
|
478
|
+
canLoadMore?: (el: T) => boolean;
|
|
466
479
|
}
|
|
467
480
|
/**
|
|
468
481
|
* Reactive infinite scroll.
|
|
469
482
|
*
|
|
470
483
|
* @see https://vueuse.org/useInfiniteScroll
|
|
471
484
|
*/
|
|
472
|
-
declare function useInfiniteScroll(element: MaybeRefOrGetter<
|
|
485
|
+
declare function useInfiniteScroll<T extends InfiniteScrollElement>(element: MaybeRefOrGetter<T>, onLoadMore: (state: UnwrapNestedRefs<ReturnType<typeof useScroll>>) => Awaitable<void>, options?: UseInfiniteScrollOptions<T>): {
|
|
473
486
|
isLoading: vue_demi.ComputedRef<boolean>;
|
|
474
487
|
};
|
|
475
488
|
|
package/index.d.ts
CHANGED
|
@@ -75,6 +75,12 @@ interface OnLongPressOptions {
|
|
|
75
75
|
*/
|
|
76
76
|
delay?: number;
|
|
77
77
|
modifiers?: OnLongPressModifiers;
|
|
78
|
+
/**
|
|
79
|
+
* Allowance of moving distance in pixels,
|
|
80
|
+
* The action will get canceled When moving too far from the pointerdown position.
|
|
81
|
+
* @default 10
|
|
82
|
+
*/
|
|
83
|
+
distanceThreshold?: number | false;
|
|
78
84
|
}
|
|
79
85
|
interface OnLongPressModifiers {
|
|
80
86
|
stop?: boolean;
|
|
@@ -444,7 +450,8 @@ declare function useScroll(element: MaybeRefOrGetter<HTMLElement | SVGElement |
|
|
|
444
450
|
};
|
|
445
451
|
type UseScrollReturn = ReturnType<typeof useScroll>;
|
|
446
452
|
|
|
447
|
-
|
|
453
|
+
type InfiniteScrollElement = HTMLElement | SVGElement | Window | Document | null | undefined;
|
|
454
|
+
interface UseInfiniteScrollOptions<T extends InfiniteScrollElement = InfiniteScrollElement> extends UseScrollOptions {
|
|
448
455
|
/**
|
|
449
456
|
* The minimum distance between the bottom of the element and the bottom of the viewport
|
|
450
457
|
*
|
|
@@ -463,13 +470,19 @@ interface UseInfiniteScrollOptions extends UseScrollOptions {
|
|
|
463
470
|
* @default 100
|
|
464
471
|
*/
|
|
465
472
|
interval?: number;
|
|
473
|
+
/**
|
|
474
|
+
* A function that determines whether more content can be loaded for a specific element.
|
|
475
|
+
* Should return `true` if loading more content is allowed for the given element,
|
|
476
|
+
* and `false` otherwise.
|
|
477
|
+
*/
|
|
478
|
+
canLoadMore?: (el: T) => boolean;
|
|
466
479
|
}
|
|
467
480
|
/**
|
|
468
481
|
* Reactive infinite scroll.
|
|
469
482
|
*
|
|
470
483
|
* @see https://vueuse.org/useInfiniteScroll
|
|
471
484
|
*/
|
|
472
|
-
declare function useInfiniteScroll(element: MaybeRefOrGetter<
|
|
485
|
+
declare function useInfiniteScroll<T extends InfiniteScrollElement>(element: MaybeRefOrGetter<T>, onLoadMore: (state: UnwrapNestedRefs<ReturnType<typeof useScroll>>) => Awaitable<void>, options?: UseInfiniteScrollOptions<T>): {
|
|
473
486
|
isLoading: vue_demi.ComputedRef<boolean>;
|
|
474
487
|
};
|
|
475
488
|
|
package/index.iife.js
CHANGED
|
@@ -194,7 +194,7 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
194
194
|
function onClickOutside(target, handler, options = {}) {
|
|
195
195
|
const { window = defaultWindow, ignore = [], capture = true, detectIframe = false } = options;
|
|
196
196
|
if (!window)
|
|
197
|
-
return;
|
|
197
|
+
return shared.noop;
|
|
198
198
|
if (shared.isIOS && !_iOSWorkaround) {
|
|
199
199
|
_iOSWorkaround = true;
|
|
200
200
|
Array.from(window.document.body.children).forEach((el) => el.addEventListener("click", shared.noop));
|
|
@@ -322,15 +322,18 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
322
322
|
};
|
|
323
323
|
|
|
324
324
|
const DEFAULT_DELAY = 500;
|
|
325
|
+
const DEFAULT_THRESHOLD = 10;
|
|
325
326
|
function onLongPress(target, handler, options) {
|
|
326
327
|
var _a, _b;
|
|
327
328
|
const elementRef = vueDemi.computed(() => unrefElement(target));
|
|
328
329
|
let timeout;
|
|
330
|
+
let posStart;
|
|
329
331
|
function clear() {
|
|
330
332
|
if (timeout) {
|
|
331
333
|
clearTimeout(timeout);
|
|
332
334
|
timeout = void 0;
|
|
333
335
|
}
|
|
336
|
+
posStart = void 0;
|
|
334
337
|
}
|
|
335
338
|
function onDown(ev) {
|
|
336
339
|
var _a2, _b2, _c, _d;
|
|
@@ -341,19 +344,40 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
341
344
|
ev.preventDefault();
|
|
342
345
|
if ((_c = options == null ? void 0 : options.modifiers) == null ? void 0 : _c.stop)
|
|
343
346
|
ev.stopPropagation();
|
|
347
|
+
posStart = {
|
|
348
|
+
x: ev.x,
|
|
349
|
+
y: ev.y
|
|
350
|
+
};
|
|
344
351
|
timeout = setTimeout(
|
|
345
352
|
() => handler(ev),
|
|
346
353
|
(_d = options == null ? void 0 : options.delay) != null ? _d : DEFAULT_DELAY
|
|
347
354
|
);
|
|
348
355
|
}
|
|
356
|
+
function onMove(ev) {
|
|
357
|
+
var _a2, _b2, _c, _d;
|
|
358
|
+
if (((_a2 = options == null ? void 0 : options.modifiers) == null ? void 0 : _a2.self) && ev.target !== elementRef.value)
|
|
359
|
+
return;
|
|
360
|
+
if (!posStart || (options == null ? void 0 : options.distanceThreshold) === false)
|
|
361
|
+
return;
|
|
362
|
+
if ((_b2 = options == null ? void 0 : options.modifiers) == null ? void 0 : _b2.prevent)
|
|
363
|
+
ev.preventDefault();
|
|
364
|
+
if ((_c = options == null ? void 0 : options.modifiers) == null ? void 0 : _c.stop)
|
|
365
|
+
ev.stopPropagation();
|
|
366
|
+
const dx = ev.x - posStart.x;
|
|
367
|
+
const dy = ev.y - posStart.y;
|
|
368
|
+
const distance = Math.sqrt(dx * dx + dy * dy);
|
|
369
|
+
if (distance >= ((_d = options == null ? void 0 : options.distanceThreshold) != null ? _d : DEFAULT_THRESHOLD))
|
|
370
|
+
clear();
|
|
371
|
+
}
|
|
349
372
|
const listenerOptions = {
|
|
350
373
|
capture: (_a = options == null ? void 0 : options.modifiers) == null ? void 0 : _a.capture,
|
|
351
374
|
once: (_b = options == null ? void 0 : options.modifiers) == null ? void 0 : _b.once
|
|
352
375
|
};
|
|
353
376
|
const cleanup = [
|
|
354
377
|
useEventListener(elementRef, "pointerdown", onDown, listenerOptions),
|
|
378
|
+
useEventListener(elementRef, "pointermove", onMove, listenerOptions),
|
|
355
379
|
useEventListener(elementRef, ["pointerup", "pointerleave"], clear, listenerOptions)
|
|
356
|
-
]
|
|
380
|
+
];
|
|
357
381
|
const stop = () => cleanup.forEach((fn) => fn());
|
|
358
382
|
return stop;
|
|
359
383
|
}
|
|
@@ -567,7 +591,7 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
567
591
|
function read(event) {
|
|
568
592
|
const rawValue = event ? event.newValue : storage.getItem(key);
|
|
569
593
|
if (rawValue == null) {
|
|
570
|
-
if (writeDefaults && rawInit
|
|
594
|
+
if (writeDefaults && rawInit != null)
|
|
571
595
|
storage.setItem(key, serializer.write(rawInit));
|
|
572
596
|
return rawInit;
|
|
573
597
|
} else if (!event && mergeDefaults) {
|
|
@@ -1131,7 +1155,15 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
1131
1155
|
const elementIsVisible = vueDemi.ref(false);
|
|
1132
1156
|
useIntersectionObserver(
|
|
1133
1157
|
element,
|
|
1134
|
-
(
|
|
1158
|
+
(intersectionObserverEntries) => {
|
|
1159
|
+
let isIntersecting = elementIsVisible.value;
|
|
1160
|
+
let latestTime = 0;
|
|
1161
|
+
for (const entry of intersectionObserverEntries) {
|
|
1162
|
+
if (entry.time >= latestTime) {
|
|
1163
|
+
latestTime = entry.time;
|
|
1164
|
+
isIntersecting = entry.isIntersecting;
|
|
1165
|
+
}
|
|
1166
|
+
}
|
|
1135
1167
|
elementIsVisible.value = isIntersecting;
|
|
1136
1168
|
},
|
|
1137
1169
|
{
|
|
@@ -1497,7 +1529,8 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
1497
1529
|
var _a;
|
|
1498
1530
|
const {
|
|
1499
1531
|
direction = "bottom",
|
|
1500
|
-
interval = 100
|
|
1532
|
+
interval = 100,
|
|
1533
|
+
canLoadMore = () => true
|
|
1501
1534
|
} = options;
|
|
1502
1535
|
const state = vueDemi.reactive(useScroll(
|
|
1503
1536
|
element,
|
|
@@ -1517,7 +1550,7 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
1517
1550
|
const isElementVisible = useElementVisibility(observedElement);
|
|
1518
1551
|
function checkAndLoad() {
|
|
1519
1552
|
state.measure();
|
|
1520
|
-
if (!observedElement.value || !isElementVisible.value)
|
|
1553
|
+
if (!observedElement.value || !isElementVisible.value || !canLoadMore(observedElement.value))
|
|
1521
1554
|
return;
|
|
1522
1555
|
const { scrollHeight, clientHeight, scrollWidth, clientWidth } = observedElement.value;
|
|
1523
1556
|
const isNarrower = direction === "bottom" || direction === "top" ? scrollHeight <= clientHeight : scrollWidth <= clientWidth;
|
|
@@ -2112,7 +2145,7 @@ var VueDemi = (function (VueDemi, Vue, VueCompositionAPI) {
|
|
|
2112
2145
|
if (containerProps.style && typeof containerProps.style === "object" && !Array.isArray(containerProps.style))
|
|
2113
2146
|
containerProps.style.height = props.height || "300px";
|
|
2114
2147
|
return () => vueDemi.h("div", { ...containerProps }, [
|
|
2115
|
-
vueDemi.h("div", { ...wrapperProps.value }, list.value.map((item) => vueDemi.h("div", { style: {
|
|
2148
|
+
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!")))
|
|
2116
2149
|
]);
|
|
2117
2150
|
}
|
|
2118
2151
|
});
|
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(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);
|
|
1
|
+
var VueDemi=function(i,o,h){if(i.install)return i;if(!o)return console.error("[vue-demi] no Vue instance found, please be sure to import `vue` before `vue-demi`."),i;if(o.version.slice(0,4)==="2.7."){let S=function(P,A){var I,W={},B={config:o.config,use:o.use.bind(o),mixin:o.mixin.bind(o),component:o.component.bind(o),provide:function(z,H){return W[z]=H,this},directive:function(z,H){return H?(o.directive(z,H),B):o.directive(z)},mount:function(z,H){return I||(I=new o(Object.assign({propsData:A},P,{provide:Object.assign(W,P.provide)})),I.$mount(z,H),I)},unmount:function(){I&&(I.$destroy(),I=void 0)}};return B};var Z=S;for(var u in o)i[u]=o[u];i.isVue2=!0,i.isVue3=!1,i.install=function(){},i.Vue=o,i.Vue2=o,i.version=o.version,i.warn=o.util.warn,i.hasInjectionContext=()=>!!i.getCurrentInstance(),i.createApp=S}else if(o.version.slice(0,2)==="2.")if(h){for(var u in h)i[u]=h[u];i.isVue2=!0,i.isVue3=!1,i.install=function(){},i.Vue=o,i.Vue2=o,i.version=o.version,i.hasInjectionContext=()=>!!i.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)i[u]=o[u];i.isVue2=!1,i.isVue3=!0,i.install=function(){},i.Vue=o,i.Vue2=void 0,i.version=o.version,i.set=function(S,P,A){return Array.isArray(S)?(S.length=Math.max(S.length,P),S.splice(P,1,A),A):(S[P]=A,A)},i.del=function(S,P){if(Array.isArray(S)){S.splice(P,1);return}delete S[P]}}else console.error("[vue-demi] Vue version "+o.version+" is unsupported.");return i}(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(i,o,h,u){"use strict";const Z=o.defineComponent({name:"OnClickOutside",props:["as","options"],emits:["trigger"],setup(e,{slots:t,emit:n}){const r=o.ref();return h.onClickOutside(r,a=>{n("trigger",a)},e.options),()=>{if(t.default)return o.h(e.as||"div",{ref:r},t.default())}}});function S(e){var t;const n=u.toValue(e);return(t=n?.$el)!=null?t:n}const P=u.isClient?window:void 0;function A(...e){let t,n,r,a;if(typeof e[0]=="string"||Array.isArray(e[0])?([n,r,a]=e,t=P):[t,n,r,a]=e,!t)return u.noop;Array.isArray(n)||(n=[n]),Array.isArray(r)||(r=[r]);const s=[],c=()=>{s.forEach(p=>p()),s.length=0},l=(p,d,g,y)=>(p.addEventListener(d,g,y),()=>p.removeEventListener(d,g,y)),f=o.watch(()=>[S(t),u.toValue(a)],([p,d])=>{if(c(),!p)return;const g=u.isObject(d)?{...d}:d;s.push(...n.flatMap(y=>r.map(v=>l(p,y,v,g))))},{immediate:!0,flush:"post"}),m=()=>{f(),c()};return u.tryOnScopeDispose(m),m}let I=!1;function W(e,t,n={}){const{window:r=P,ignore:a=[],capture:s=!0,detectIframe:c=!1}=n;if(!r)return u.noop;u.isIOS&&!I&&(I=!0,Array.from(r.document.body.children).forEach(g=>g.addEventListener("click",u.noop)),r.document.documentElement.addEventListener("click",u.noop));let l=!0;const f=g=>a.some(y=>{if(typeof y=="string")return Array.from(r.document.querySelectorAll(y)).some(v=>v===g.target||g.composedPath().includes(v));{const v=S(y);return v&&(g.target===v||g.composedPath().includes(v))}}),p=[A(r,"click",g=>{const y=S(e);if(!(!y||y===g.target||g.composedPath().includes(y))){if(g.detail===0&&(l=!f(g)),!l){l=!0;return}t(g)}},{passive:!0,capture:s}),A(r,"pointerdown",g=>{const y=S(e);l=!f(g)&&!!(y&&!g.composedPath().includes(y))},{passive:!0}),c&&A(r,"blur",g=>{setTimeout(()=>{var y;const v=S(e);((y=r.document.activeElement)==null?void 0:y.tagName)==="IFRAME"&&!v?.contains(r.document.activeElement)&&t(g)},0)})].filter(Boolean);return()=>p.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 z(e){return typeof e=="function"?e:typeof e=="string"?t=>t.key===e:Array.isArray(e)?t=>e.includes(t.key):()=>!0}function H(...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=P,eventName:s="keydown",passive:c=!1,dedupe:l=!1}=r,f=z(t);return A(a,s,p=>{p.repeat&&u.toValue(l)||f(p)&&n(p)},c)}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")H(a,t.value,{target:e});else{const[s,c]=t.value;H(a,s,{target:e,...c})}}},ve=500,ge=10;function q(e,t,n){var r,a;const s=o.computed(()=>S(e));let c,l;function f(){c&&(clearTimeout(c),c=void 0),l=void 0}function m(v){var U,C,b,L;(U=n?.modifiers)!=null&&U.self&&v.target!==s.value||(f(),(C=n?.modifiers)!=null&&C.prevent&&v.preventDefault(),(b=n?.modifiers)!=null&&b.stop&&v.stopPropagation(),l={x:v.x,y:v.y},c=setTimeout(()=>t(v),(L=n?.delay)!=null?L:ve))}function p(v){var U,C,b,L;if((U=n?.modifiers)!=null&&U.self&&v.target!==s.value||!l||n?.distanceThreshold===!1)return;(C=n?.modifiers)!=null&&C.prevent&&v.preventDefault(),(b=n?.modifiers)!=null&&b.stop&&v.stopPropagation();const V=v.x-l.x,O=v.y-l.y;Math.sqrt(V*V+O*O)>=((L=n?.distanceThreshold)!=null?L:ge)&&f()}const d={capture:(r=n?.modifiers)==null?void 0:r.capture,once:(a=n?.modifiers)==null?void 0:a.once},g=[A(s,"pointerdown",m,d),A(s,"pointermove",p,d),A(s,["pointerup","pointerleave"],f,d)];return()=>g.forEach(v=>v())}const me=o.defineComponent({name:"OnLongPress",props:["as","options"],emits:["trigger"],setup(e,{slots:t,emit:n}){const r=o.ref();return q(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"?q(e,t.value,{modifiers:t.modifiers}):q(e,...t.value)}},he=o.defineComponent({name:"UseActiveElement",setup(e,{slots:t}){const n=o.reactive({element:h.useActiveElement()});return()=>{if(t.default)return t.default(n)}}}),ye=o.defineComponent({name:"UseBattery",setup(e,{slots:t}){const n=o.reactive(h.useBattery(e));return()=>{if(t.default)return t.default(n)}}}),we=o.defineComponent({name:"UseBrowserLocation",setup(e,{slots:t}){const n=o.reactive(h.useBrowserLocation());return()=>{if(t.default)return t.default(n)}}}),Ue=o.defineComponent({name:"UseClipboard",props:["source","read","navigator","copiedDuring","legacy"],setup(e,{slots:t}){const n=o.reactive(h.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__",be=Ce();function Ce(){return F in j||(j[F]=j[F]||{}),j[F]}function ee(e,t){return be[e]||t}function Se(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 Oe={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 Ee(e,t,n,r={}){var a;const{flush:s="pre",deep:c=!0,listenToStorageChanges:l=!0,writeDefaults:f=!0,mergeDefaults:m=!1,shallow:p,window:d=P,eventFilter:g,onError:y=w=>{console.error(w)},initOnMounted:v}=r,U=(p?o.shallowRef:o.ref)(typeof t=="function"?t():t);if(!n)try{n=ee("getDefaultStorage",()=>{var w;return(w=P)==null?void 0:w.localStorage})()}catch(w){y(w)}if(!n)return U;const C=u.toValue(t),b=Se(C),L=(a=r.serializer)!=null?a:Oe[b],{pause:V,resume:O}=u.pausableWatch(U,()=>R(U.value),{flush:s,deep:c,eventFilter:g});return d&&l&&u.tryOnMounted(()=>{A(d,"storage",k),A(d,te,T),v&&k()}),v||k(),U;function R(w){try{if(w==null)n.removeItem(e);else{const _=L.write(w),M=n.getItem(e);M!==_&&(n.setItem(e,_),d&&d.dispatchEvent(new CustomEvent(te,{detail:{key:e,oldValue:M,newValue:_,storageArea:n}})))}}catch(_){y(_)}}function E(w){const _=w?w.newValue:n.getItem(e);if(_==null)return f&&C!=null&&n.setItem(e,L.write(C)),C;if(!w&&m){const M=L.read(_);return typeof m=="function"?m(M,C):b==="object"&&!Array.isArray(M)?{...C,...M}:M}else return typeof _!="string"?_:L.read(_)}function T(w){k(w.detail)}function k(w){if(!(w&&w.storageArea!==n)){if(w&&w.key==null){U.value=C;return}if(!(w&&w.key!==e)){V();try{w?.newValue!==L.write(U.value)&&(U.value=E(w))}catch(_){y(_)}finally{w?o.nextTick(O):O()}}}}}function Pe(){const e=o.ref(!1);return o.getCurrentInstance()&&o.onMounted(()=>{e.value=!0}),e}function K(e){const t=Pe();return o.computed(()=>(t.value,!!e()))}function Le(e,t={}){const{window:n=P}=t,r=K(()=>n&&"matchMedia"in n&&typeof n.matchMedia=="function");let a;const s=o.ref(!1),c=m=>{s.value=m.matches},l=()=>{a&&("removeEventListener"in a?a.removeEventListener("change",c):a.removeListener(c))},f=o.watchEffect(()=>{r.value&&(l(),a=n.matchMedia(u.toValue(e)),"addEventListener"in a?a.addEventListener("change",c):a.addListener(c),s.value=a.matches)});return u.tryOnScopeDispose(()=>{f(),l(),a=void 0}),s}function _e(e){return Le("(prefers-color-scheme: dark)",e)}function ke(e={}){const{selector:t="html",attribute:n="class",initialValue:r="auto",window:a=P,storage:s,storageKey:c="vueuse-color-scheme",listenToStorageChanges:l=!0,storageRef:f,emitAuto:m,disableTransition:p=!0}=e,d={auto:"",light:"light",dark:"dark",...e.modes||{}},g=_e({window:a}),y=o.computed(()=>g.value?"dark":"light"),v=f||(c==null?u.toRef(r):Ee(c,r,s,{window:a,listenToStorageChanges:l})),U=o.computed(()=>v.value==="auto"?y.value:v.value),C=ee("updateHTMLAttrs",(O,R,E)=>{const T=typeof O=="string"?a?.document.querySelector(O):S(O);if(!T)return;let k;if(p){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(R==="class"){const w=E.split(/\s/g);Object.values(d).flatMap(_=>(_||"").split(/\s/g)).filter(Boolean).forEach(_=>{w.includes(_)?T.classList.add(_):T.classList.remove(_)})}else T.setAttribute(R,E);p&&(a.getComputedStyle(k).opacity,document.head.removeChild(k))});function b(O){var R;C(t,n,(R=d[O])!=null?R:O)}function L(O){e.onChanged?e.onChanged(O,b):b(O)}o.watch(U,L,{flush:"post",immediate:!0}),u.tryOnMounted(()=>L(U.value));const V=o.computed({get(){return m?v.value:U.value},set(O){v.value=O}});try{return Object.assign(V,{store:v,system:y,state:U})}catch{return V}}const Ae=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)}}}),Me=o.defineComponent({name:"UseDark",props:["selector","attribute","valueDark","valueLight","onChanged","storageKey","storage"],setup(e,{slots:t}){const n=h.useDark(e),r=o.reactive({isDark:n,toggleDark:u.useToggle(n)});return()=>{if(t.default)return t.default(r)}}}),Te=o.defineComponent({name:"UseDeviceMotion",setup(e,{slots:t}){const n=o.reactive(h.useDeviceMotion());return()=>{if(t.default)return t.default(n)}}}),Ie=o.defineComponent({name:"UseDeviceOrientation",setup(e,{slots:t}){const n=o.reactive(h.useDeviceOrientation());return()=>{if(t.default)return t.default(n)}}}),Ve=o.defineComponent({name:"UseDevicePixelRatio",setup(e,{slots:t}){const n=o.reactive({pixelRatio:h.useDevicePixelRatio()});return()=>{if(t.default)return t.default(n)}}}),Re=o.defineComponent({name:"UseDevicesList",props:["onUpdated","requestPermissions","constraints"],setup(e,{slots:t}){const n=o.reactive(h.useDevicesList(e));return()=>{if(t.default)return t.default(n)}}}),He=o.defineComponent({name:"UseDocumentVisibility",setup(e,{slots:t}){const n=o.reactive({visibility:h.useDocumentVisibility()});return()=>{if(t.default)return t.default(n)}}}),ze=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&&h.useStorage(e.storageKey,u.toValue(e.initialValue)||{x:0,y:0},h.isClient?e.storageType==="session"?sessionStorage:localStorage:void 0),s=a||e.initialValue||{x:0,y:0},c=(f,m)=>{var p;(p=e.onEnd)==null||p.call(e,f,m),a&&(a.value.x=f.x,a.value.y=f.y)},l=o.reactive(h.useDraggable(n,{...e,handle:r,initialValue:s,onEnd:c}));return()=>{if(t.default)return o.h(e.as||"div",{ref:n,style:`touch-action:none;${l.style}`},t.default(l))}}}),Ne=o.defineComponent({name:"UseElementBounding",props:["box","as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(h.useElementBounding(n));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}});function We(e,t={}){const{delayEnter:n=0,delayLeave:r=0,window:a=P}=t,s=o.ref(!1);let c;const l=f=>{const m=f?n:r;c&&(clearTimeout(c),c=void 0),m?c=setTimeout(()=>s.value=f,m):s.value=f};return a&&(A(e,"mouseenter",()=>l(!0),{passive:!0}),A(e,"mouseleave",()=>l(!1),{passive:!0})),s}const Be={[u.directiveHooks.mounted](e,t){if(typeof t.value=="function"){const n=We(e);o.watch(n,r=>t.value(r))}}},je=o.defineComponent({name:"UseElementSize",props:["width","height","box","as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(h.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 Fe(e,t,n={}){const{window:r=P,...a}=n;let s;const c=K(()=>r&&"ResizeObserver"in r),l=()=>{s&&(s.disconnect(),s=void 0)},f=o.computed(()=>Array.isArray(e)?e.map(d=>S(d)):[S(e)]),m=o.watch(f,d=>{if(l(),c.value&&r){s=new ResizeObserver(t);for(const g of d)g&&s.observe(g,a)}},{immediate:!0,flush:"post",deep:!0}),p=()=>{l(),m()};return u.tryOnScopeDispose(p),{isSupported:c,stop:p}}function Ke(e,t={width:0,height:0},n={}){const{window:r=P,box:a="content-box"}=n,s=o.computed(()=>{var d,g;return(g=(d=S(e))==null?void 0:d.namespaceURI)==null?void 0:g.includes("svg")}),c=o.ref(t.width),l=o.ref(t.height),{stop:f}=Fe(e,([d])=>{const g=a==="border-box"?d.borderBoxSize:a==="content-box"?d.contentBoxSize:d.devicePixelContentBoxSize;if(r&&s.value){const y=S(e);if(y){const v=r.getComputedStyle(y);c.value=Number.parseFloat(v.width),l.value=Number.parseFloat(v.height)}}else if(g){const y=Array.isArray(g)?g:[g];c.value=y.reduce((v,{inlineSize:U})=>v+U,0),l.value=y.reduce((v,{blockSize:U})=>v+U,0)}else c.value=d.contentRect.width,l.value=d.contentRect.height},n);u.tryOnMounted(()=>{const d=S(e);d&&(c.value="offsetWidth"in d?d.offsetWidth:t.width,l.value="offsetHeight"in d?d.offsetHeight:t.height)});const m=o.watch(()=>S(e),d=>{c.value=d?t.width:0,l.value=d?t.height:0});function p(){f(),m()}return{width:c,height:l,stop:p}}const Ge={[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:s,height:c}=Ke(e,...a);o.watch([s,c],([l,f])=>r({width:l,height:f}))}},Je=o.defineComponent({name:"UseElementVisibility",props:["as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive({isVisible:h.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:s=.1,window:c=P,immediate:l=!0}=n,f=K(()=>c&&"IntersectionObserver"in c),m=o.computed(()=>{const v=u.toValue(e);return(Array.isArray(v)?v:[v]).map(S).filter(u.notNullish)});let p=u.noop;const d=o.ref(l),g=f.value?o.watch(()=>[m.value,S(r),d.value],([v,U])=>{if(p(),!d.value||!v.length)return;const C=new IntersectionObserver(t,{root:S(U),rootMargin:a,threshold:s});v.forEach(b=>b&&C.observe(b)),p=()=>{C.disconnect(),p=u.noop}},{immediate:l,flush:"post"}):u.noop,y=()=>{p(),g(),d.value=!1};return u.tryOnScopeDispose(y),{isSupported:f,isActive:d,pause(){p(),d.value=!1},resume(){d.value=!0},stop:y}}function X(e,t={}){const{window:n=P,scrollTarget:r}=t,a=o.ref(!1);return x(e,s=>{let c=a.value,l=0;for(const f of s)f.time>=l&&(l=f.time,c=f.isIntersecting);a.value=c},{root:r,window:n,threshold:0}),a}const Ye={[u.directiveHooks.mounted](e,t){if(typeof t.value=="function"){const n=t.value,r=X(e);o.watch(r,a=>n(a),{immediate:!0})}else{const[n,r]=t.value,a=X(e,r);o.watch(a,s=>n(s),{immediate:!0})}}},$e=o.defineComponent({name:"UseEyeDropper",props:{sRGBHex:String},setup(e,{slots:t}){const n=o.reactive(h.useEyeDropper());return()=>{if(t.default)return t.default(n)}}}),qe=o.defineComponent({name:"UseFullscreen",props:["as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(h.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(h.useGeolocation(e));return()=>{if(t.default)return t.default(n)}}}),Xe=o.defineComponent({name:"UseIdle",props:["timeout","events","listenForVisibilityChange","initialState"],setup(e,{slots:t}){const n=o.reactive(h.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:s=u.noop,onSuccess:c=u.noop,resetOnExecute:l=!0,shallow:f=!0,throwError:m}=n??{},p=f?o.shallowRef(t):o.ref(t),d=o.ref(!1),g=o.ref(!1),y=o.shallowRef(void 0);async function v(b=0,...L){l&&(p.value=t),y.value=void 0,d.value=!1,g.value=!0,b>0&&await u.promiseTimeout(b);const V=typeof e=="function"?e(...L):e;try{const O=await V;p.value=O,d.value=!0,c(O)}catch(O){if(y.value=O,s(O),m)throw O}finally{g.value=!1}return p.value}r&&v(a);const U={state:p,isReady:d,isLoading:g,error:y,execute:v};function C(){return new Promise((b,L)=>{u.until(g).toBe(!1).then(()=>b(U)).catch(L)})}return{...U,then(b,L){return C().then(b,L)}}}async function Ze(e){return new Promise((t,n)=>{const r=new Image,{src:a,srcset:s,sizes:c,class:l,loading:f,crossorigin:m,referrerPolicy:p}=e;r.src=a,s&&(r.srcset=s),c&&(r.sizes=c),l&&(r.className=l),f&&(r.loading=f),m&&(r.crossOrigin=m),p&&(r.referrerPolicy=p),r.onload=()=>t(r),r.onerror=n})}function De(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 et=o.defineComponent({name:"UseImage",props:["src","srcset","sizes","as","alt","class","loading","crossorigin","referrerPolicy"],setup(e,{slots:t}){const n=o.reactive(De(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 Q(e,t={}){const{throttle:n=0,idle:r=200,onStop:a=u.noop,onScroll:s=u.noop,offset:c={left:0,right:0,top:0,bottom:0},eventListenerOptions:l={capture:!1,passive:!0},behavior:f="auto",window:m=P}=t,p=o.ref(0),d=o.ref(0),g=o.computed({get(){return p.value},set(E){v(E,void 0)}}),y=o.computed({get(){return d.value},set(E){v(void 0,E)}});function v(E,T){var k,w,_;if(!m)return;const M=u.toValue(e);M&&((_=M instanceof Document?m.document.body:M)==null||_.scrollTo({top:(k=u.toValue(T))!=null?k:y.value,left:(w=u.toValue(E))!=null?w:g.value,behavior:u.toValue(f)}))}const U=o.ref(!1),C=o.reactive({left:!0,right:!1,top:!0,bottom:!1}),b=o.reactive({left:!1,right:!1,top:!1,bottom:!1}),L=E=>{U.value&&(U.value=!1,b.left=!1,b.right=!1,b.top=!1,b.bottom=!1,a(E))},V=u.useDebounceFn(L,n+r),O=E=>{var T;if(!m)return;const k=E.document?E.document.documentElement:(T=E.documentElement)!=null?T:E,{display:w,flexDirection:_}=getComputedStyle(k),M=k.scrollLeft;b.left=M<p.value,b.right=M>p.value;const ue=Math.abs(M)<=0+(c.left||0),ce=Math.abs(M)+k.clientWidth>=k.scrollWidth-(c.right||0)-ne;w==="flex"&&_==="row-reverse"?(C.left=ce,C.right=ue):(C.left=ue,C.right=ce),p.value=M;let N=k.scrollTop;E===m.document&&!N&&(N=m.document.body.scrollTop),b.top=N<d.value,b.bottom=N>d.value;const fe=Math.abs(N)<=0+(c.top||0),de=Math.abs(N)+k.clientHeight>=k.scrollHeight-(c.bottom||0)-ne;w==="flex"&&_==="column-reverse"?(C.top=de,C.bottom=fe):(C.top=fe,C.bottom=de),d.value=N},R=E=>{var T;if(!m)return;const k=(T=E.target.documentElement)!=null?T:E.target;O(k),U.value=!0,V(E),s(E)};return A(e,"scroll",n?u.useThrottleFn(R,n,!0,!1):R,l),u.tryOnMounted(()=>{const E=u.toValue(e);E&&O(E)}),A(e,"scrollend",L,l),{x:g,y,isScrolling:U,arrivedState:C,directions:b,measure(){const E=u.toValue(e);m&&E&&O(E)}}}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:s=100,canLoadMore:c=()=>!0}=n,l=o.reactive(Q(e,{...n,offset:{[a]:(r=n.distance)!=null?r:0,...n.offset}})),f=o.ref(),m=o.computed(()=>!!f.value),p=o.computed(()=>G(u.toValue(e))),d=X(p);function g(){if(l.measure(),!p.value||!d.value||!c(p.value))return;const{scrollHeight:y,clientHeight:v,scrollWidth:U,clientWidth:C}=p.value,b=a==="bottom"||a==="top"?y<=v:U<=C;(l.arrivedState[a]||b)&&(f.value||(f.value=Promise.all([t(l),new Promise(L=>setTimeout(L,s))]).finally(()=>{f.value=null,o.nextTick(()=>g())})))}return o.watch(()=>[l.arrivedState[a],d.value],g,{immediate:!0}),{isLoading:m}}const tt={[u.directiveHooks.mounted](e,t){typeof t.value=="function"?oe(e,t.value):oe(e,...t.value)}},nt={[u.directiveHooks.mounted](e,t){typeof t.value=="function"?x(e,t.value):x(e,...t.value)}},ot=o.defineComponent({name:"UseMouse",props:["touch","resetOnTouchEnds","initialValue"],setup(e,{slots:t}){const n=o.reactive(h.useMouse(e));return()=>{if(t.default)return t.default(n)}}}),rt=o.defineComponent({name:"UseMouseElement",props:["handleOutside","as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(h.useMouseInElement(n,e));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}}),at=o.defineComponent({name:"UseMousePressed",props:["touch","initialValue","as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(h.useMousePressed({...e,target:n}));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}}),st=o.defineComponent({name:"UseNetwork",setup(e,{slots:t}){const n=o.reactive(h.useNetwork());return()=>{if(t.default)return t.default(n)}}}),it=o.defineComponent({name:"UseNow",props:["interval"],setup(e,{slots:t}){const n=o.reactive(h.useNow({...e,controls:!0}));return()=>{if(t.default)return t.default(n)}}}),lt=o.defineComponent({name:"UseObjectUrl",props:["object"],setup(e,{slots:t}){const n=u.toRef(e,"object"),r=h.useObjectUrl(n);return()=>{if(t.default&&r.value)return t.default(r)}}}),ut=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(h.useOffsetPagination({...e,onPageChange(...a){var s;(s=e.onPageChange)==null||s.call(e,...a),n("page-change",...a)},onPageSizeChange(...a){var s;(s=e.onPageSizeChange)==null||s.call(e,...a),n("page-size-change",...a)},onPageCountChange(...a){var s;(s=e.onPageCountChange)==null||s.call(e,...a),n("page-count-change",...a)}}));return()=>{if(t.default)return t.default(r)}}}),ct=o.defineComponent({name:"UseOnline",setup(e,{slots:t}){const n=o.reactive({isOnline:h.useOnline()});return()=>{if(t.default)return t.default(n)}}}),ft=o.defineComponent({name:"UsePageLeave",setup(e,{slots:t}){const n=o.reactive({isLeft:h.usePageLeave()});return()=>{if(t.default)return t.default(n)}}}),dt=o.defineComponent({name:"UsePointer",props:["pointerTypes","initialValue","target"],setup(e,{slots:t}){const n=o.ref(null),r=o.reactive(h.usePointer({...e,target:e.target==="self"?n:P}));return()=>{if(t.default)return t.default(r,{ref:n})}}}),pt=o.defineComponent({name:"UsePointerLock",props:["as"],setup(e,{slots:t}){const n=o.ref(),r=o.reactive(h.usePointerLock(n));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(r))}}}),vt=o.defineComponent({name:"UsePreferredColorScheme",setup(e,{slots:t}){const n=o.reactive({colorScheme:h.usePreferredColorScheme()});return()=>{if(t.default)return t.default(n)}}}),gt=o.defineComponent({name:"UsePreferredContrast",setup(e,{slots:t}){const n=o.reactive({contrast:h.usePreferredContrast()});return()=>{if(t.default)return t.default(n)}}}),mt=o.defineComponent({name:"UsePreferredDark",setup(e,{slots:t}){const n=o.reactive({prefersDark:h.usePreferredDark()});return()=>{if(t.default)return t.default(n)}}}),ht=o.defineComponent({name:"UsePreferredLanguages",setup(e,{slots:t}){const n=o.reactive({languages:h.usePreferredLanguages()});return()=>{if(t.default)return t.default(n)}}}),yt=o.defineComponent({name:"UsePreferredReducedMotion",setup(e,{slots:t}){const n=o.reactive({motion:h.usePreferredReducedMotion()});return()=>{if(t.default)return t.default(n)}}});function wt(e,t,n={}){const{window:r=P,...a}=n;let s;const c=K(()=>r&&"MutationObserver"in r),l=()=>{s&&(s.disconnect(),s=void 0)},f=o.watch(()=>S(e),d=>{l(),c.value&&r&&d&&(s=new MutationObserver(t),s.observe(d,a))},{immediate:!0}),m=()=>s?.takeRecords(),p=()=>{l(),f()};return u.tryOnScopeDispose(p),{isSupported:c,stop:p,takeRecords:m}}function J(e,t,n={}){const{window:r=P,initialValue:a="",observe:s=!1}=n,c=o.ref(a),l=o.computed(()=>{var m;return S(t)||((m=r?.document)==null?void 0:m.documentElement)});function f(){var m;const p=u.toValue(e),d=u.toValue(l);if(d&&r){const g=(m=r.getComputedStyle(d).getPropertyValue(p))==null?void 0:m.trim();c.value=g||a}}return s&&wt(l,f,{attributeFilter:["style","class"],window:r}),o.watch([l,()=>u.toValue(e)],f,{immediate:!0}),o.watch(c,m=>{var p;(p=l.value)!=null&&p.style&&l.value.style.setProperty(u.toValue(e),m)}),c}const re="--vueuse-safe-area-top",ae="--vueuse-safe-area-right",se="--vueuse-safe-area-bottom",ie="--vueuse-safe-area-left";function Ut(){const e=o.ref(""),t=o.ref(""),n=o.ref(""),r=o.ref("");if(u.isClient){const s=J(re),c=J(ae),l=J(se),f=J(ie);s.value="env(safe-area-inset-top, 0px)",c.value="env(safe-area-inset-right, 0px)",l.value="env(safe-area-inset-bottom, 0px)",f.value="env(safe-area-inset-left, 0px)",a(),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 bt=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:s}=Ut();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?s.value:"",boxSizing:"border-box",maxHeight:"100vh",maxWidth:"100vw",overflow:"auto"}},t.default())}}}),Ct={[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(s){var c;(c=r.onScroll)==null||c.call(r,s),n(a)},onStop(s){var c;(c=r.onStop)==null||c.call(r,s),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 St(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 Ot(e,t=!1){const n=o.ref(t);let r=null,a;o.watch(u.toRef(e),l=>{const f=G(u.toValue(l));if(f){const m=f;$.get(m)||$.set(m,a),n.value&&(m.style.overflow="hidden")}},{immediate:!0});const s=()=>{const l=G(u.toValue(e));!l||n.value||(u.isIOS&&(r=A(l,"touchmove",f=>{St(f)},{passive:!1})),l.style.overflow="hidden",n.value=!0)},c=()=>{var l;const f=G(u.toValue(e));!f||!n.value||(u.isIOS&&r?.(),f.style.overflow=(l=$.get(f))!=null?l:"",$.delete(f),n.value=!1)};return u.tryOnScopeDispose(c),o.computed({get(){return n.value},set(l){l?s():c()}})}function Et(){let e=!1;const t=o.ref(!1);return(n,r)=>{if(t.value=r.value,e)return;e=!0;const a=Ot(n,r.value);o.watch(t,s=>a.value=s)}}const Pt=Et(),Lt=o.defineComponent({name:"UseTimeAgo",props:["time","updateInterval","max","fullDateFormatter","messages","showSecond"],setup(e,{slots:t}){const n=o.reactive(h.useTimeAgo(()=>e.time,{...e,controls:!0}));return()=>{if(t.default)return t.default(n)}}}),_t=o.defineComponent({name:"UseTimestamp",props:["immediate","interval","offset"],setup(e,{slots:t}){const n=o.reactive(h.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:s,wrapperProps:c,scrollTo:l}=h.useVirtualList(r,e.options);return n({scrollTo:l}),s.style&&typeof s.style=="object"&&!Array.isArray(s.style)&&(s.style.height=e.height||"300px"),()=>o.h("div",{...s},[o.h("div",{...c.value},a.value.map(f=>o.h("div",{style:{overflow:"hidden",height:f.height}},t.default?t.default(f):"Please set content!")))])}}),At=o.defineComponent({name:"UseWindowFocus",setup(e,{slots:t}){const n=o.reactive({focused:h.useWindowFocus()});return()=>{if(t.default)return t.default(n)}}}),Mt=o.defineComponent({name:"UseWindowSize",props:["initialWidth","initialHeight"],setup(e,{slots:t}){const n=o.reactive(h.useWindowSize(e));return()=>{if(t.default)return t.default(n)}}});i.OnClickOutside=Z,i.OnLongPress=me,i.UseActiveElement=he,i.UseBattery=ye,i.UseBrowserLocation=we,i.UseClipboard=Ue,i.UseColorMode=Ae,i.UseDark=Me,i.UseDeviceMotion=Te,i.UseDeviceOrientation=Ie,i.UseDevicePixelRatio=Ve,i.UseDevicesList=Re,i.UseDocumentVisibility=He,i.UseDraggable=ze,i.UseElementBounding=Ne,i.UseElementSize=je,i.UseElementVisibility=Je,i.UseEyeDropper=$e,i.UseFullscreen=qe,i.UseGeolocation=xe,i.UseIdle=Xe,i.UseImage=et,i.UseMouse=ot,i.UseMouseInElement=rt,i.UseMousePressed=at,i.UseNetwork=st,i.UseNow=it,i.UseObjectUrl=lt,i.UseOffsetPagination=ut,i.UseOnline=ct,i.UsePageLeave=ft,i.UsePointer=dt,i.UsePointerLock=pt,i.UsePreferredColorScheme=vt,i.UsePreferredContrast=gt,i.UsePreferredDark=mt,i.UsePreferredLanguages=ht,i.UsePreferredReducedMotion=yt,i.UseScreenSafeArea=bt,i.UseTimeAgo=Lt,i.UseTimestamp=_t,i.UseVirtualList=kt,i.UseWindowFocus=At,i.UseWindowSize=Mt,i.VOnClickOutside=B,i.VOnLongPress=D,i.vElementHover=Be,i.vElementSize=Ge,i.vElementVisibility=Ye,i.vInfiniteScroll=tt,i.vIntersectionObserver=nt,i.vOnClickOutside=B,i.vOnKeyStroke=pe,i.vOnLongPress=D,i.vScroll=Ct,i.vScrollLock=Pt})(this.VueUse=this.VueUse||{},VueDemi,VueUse,VueUse);
|
package/index.mjs
CHANGED
|
@@ -79,7 +79,7 @@ let _iOSWorkaround = false;
|
|
|
79
79
|
function onClickOutside(target, handler, options = {}) {
|
|
80
80
|
const { window = defaultWindow, ignore = [], capture = true, detectIframe = false } = options;
|
|
81
81
|
if (!window)
|
|
82
|
-
return;
|
|
82
|
+
return noop;
|
|
83
83
|
if (isIOS && !_iOSWorkaround) {
|
|
84
84
|
_iOSWorkaround = true;
|
|
85
85
|
Array.from(window.document.body.children).forEach((el) => el.addEventListener("click", noop));
|
|
@@ -207,15 +207,18 @@ const vOnKeyStroke = {
|
|
|
207
207
|
};
|
|
208
208
|
|
|
209
209
|
const DEFAULT_DELAY = 500;
|
|
210
|
+
const DEFAULT_THRESHOLD = 10;
|
|
210
211
|
function onLongPress(target, handler, options) {
|
|
211
212
|
var _a, _b;
|
|
212
213
|
const elementRef = computed(() => unrefElement(target));
|
|
213
214
|
let timeout;
|
|
215
|
+
let posStart;
|
|
214
216
|
function clear() {
|
|
215
217
|
if (timeout) {
|
|
216
218
|
clearTimeout(timeout);
|
|
217
219
|
timeout = void 0;
|
|
218
220
|
}
|
|
221
|
+
posStart = void 0;
|
|
219
222
|
}
|
|
220
223
|
function onDown(ev) {
|
|
221
224
|
var _a2, _b2, _c, _d;
|
|
@@ -226,19 +229,40 @@ function onLongPress(target, handler, options) {
|
|
|
226
229
|
ev.preventDefault();
|
|
227
230
|
if ((_c = options == null ? void 0 : options.modifiers) == null ? void 0 : _c.stop)
|
|
228
231
|
ev.stopPropagation();
|
|
232
|
+
posStart = {
|
|
233
|
+
x: ev.x,
|
|
234
|
+
y: ev.y
|
|
235
|
+
};
|
|
229
236
|
timeout = setTimeout(
|
|
230
237
|
() => handler(ev),
|
|
231
238
|
(_d = options == null ? void 0 : options.delay) != null ? _d : DEFAULT_DELAY
|
|
232
239
|
);
|
|
233
240
|
}
|
|
241
|
+
function onMove(ev) {
|
|
242
|
+
var _a2, _b2, _c, _d;
|
|
243
|
+
if (((_a2 = options == null ? void 0 : options.modifiers) == null ? void 0 : _a2.self) && ev.target !== elementRef.value)
|
|
244
|
+
return;
|
|
245
|
+
if (!posStart || (options == null ? void 0 : options.distanceThreshold) === false)
|
|
246
|
+
return;
|
|
247
|
+
if ((_b2 = options == null ? void 0 : options.modifiers) == null ? void 0 : _b2.prevent)
|
|
248
|
+
ev.preventDefault();
|
|
249
|
+
if ((_c = options == null ? void 0 : options.modifiers) == null ? void 0 : _c.stop)
|
|
250
|
+
ev.stopPropagation();
|
|
251
|
+
const dx = ev.x - posStart.x;
|
|
252
|
+
const dy = ev.y - posStart.y;
|
|
253
|
+
const distance = Math.sqrt(dx * dx + dy * dy);
|
|
254
|
+
if (distance >= ((_d = options == null ? void 0 : options.distanceThreshold) != null ? _d : DEFAULT_THRESHOLD))
|
|
255
|
+
clear();
|
|
256
|
+
}
|
|
234
257
|
const listenerOptions = {
|
|
235
258
|
capture: (_a = options == null ? void 0 : options.modifiers) == null ? void 0 : _a.capture,
|
|
236
259
|
once: (_b = options == null ? void 0 : options.modifiers) == null ? void 0 : _b.once
|
|
237
260
|
};
|
|
238
261
|
const cleanup = [
|
|
239
262
|
useEventListener(elementRef, "pointerdown", onDown, listenerOptions),
|
|
263
|
+
useEventListener(elementRef, "pointermove", onMove, listenerOptions),
|
|
240
264
|
useEventListener(elementRef, ["pointerup", "pointerleave"], clear, listenerOptions)
|
|
241
|
-
]
|
|
265
|
+
];
|
|
242
266
|
const stop = () => cleanup.forEach((fn) => fn());
|
|
243
267
|
return stop;
|
|
244
268
|
}
|
|
@@ -452,7 +476,7 @@ function useStorage(key, defaults, storage, options = {}) {
|
|
|
452
476
|
function read(event) {
|
|
453
477
|
const rawValue = event ? event.newValue : storage.getItem(key);
|
|
454
478
|
if (rawValue == null) {
|
|
455
|
-
if (writeDefaults && rawInit
|
|
479
|
+
if (writeDefaults && rawInit != null)
|
|
456
480
|
storage.setItem(key, serializer.write(rawInit));
|
|
457
481
|
return rawInit;
|
|
458
482
|
} else if (!event && mergeDefaults) {
|
|
@@ -1016,7 +1040,15 @@ function useElementVisibility(element, options = {}) {
|
|
|
1016
1040
|
const elementIsVisible = ref(false);
|
|
1017
1041
|
useIntersectionObserver(
|
|
1018
1042
|
element,
|
|
1019
|
-
(
|
|
1043
|
+
(intersectionObserverEntries) => {
|
|
1044
|
+
let isIntersecting = elementIsVisible.value;
|
|
1045
|
+
let latestTime = 0;
|
|
1046
|
+
for (const entry of intersectionObserverEntries) {
|
|
1047
|
+
if (entry.time >= latestTime) {
|
|
1048
|
+
latestTime = entry.time;
|
|
1049
|
+
isIntersecting = entry.isIntersecting;
|
|
1050
|
+
}
|
|
1051
|
+
}
|
|
1020
1052
|
elementIsVisible.value = isIntersecting;
|
|
1021
1053
|
},
|
|
1022
1054
|
{
|
|
@@ -1382,7 +1414,8 @@ function useInfiniteScroll(element, onLoadMore, options = {}) {
|
|
|
1382
1414
|
var _a;
|
|
1383
1415
|
const {
|
|
1384
1416
|
direction = "bottom",
|
|
1385
|
-
interval = 100
|
|
1417
|
+
interval = 100,
|
|
1418
|
+
canLoadMore = () => true
|
|
1386
1419
|
} = options;
|
|
1387
1420
|
const state = reactive(useScroll(
|
|
1388
1421
|
element,
|
|
@@ -1402,7 +1435,7 @@ function useInfiniteScroll(element, onLoadMore, options = {}) {
|
|
|
1402
1435
|
const isElementVisible = useElementVisibility(observedElement);
|
|
1403
1436
|
function checkAndLoad() {
|
|
1404
1437
|
state.measure();
|
|
1405
|
-
if (!observedElement.value || !isElementVisible.value)
|
|
1438
|
+
if (!observedElement.value || !isElementVisible.value || !canLoadMore(observedElement.value))
|
|
1406
1439
|
return;
|
|
1407
1440
|
const { scrollHeight, clientHeight, scrollWidth, clientWidth } = observedElement.value;
|
|
1408
1441
|
const isNarrower = direction === "bottom" || direction === "top" ? scrollHeight <= clientHeight : scrollWidth <= clientWidth;
|
|
@@ -1997,7 +2030,7 @@ const UseVirtualList = /* @__PURE__ */ /* #__PURE__ */ defineComponent({
|
|
|
1997
2030
|
if (containerProps.style && typeof containerProps.style === "object" && !Array.isArray(containerProps.style))
|
|
1998
2031
|
containerProps.style.height = props.height || "300px";
|
|
1999
2032
|
return () => h("div", { ...containerProps }, [
|
|
2000
|
-
h("div", { ...wrapperProps.value }, list.value.map((item) => h("div", { style: {
|
|
2033
|
+
h("div", { ...wrapperProps.value }, list.value.map((item) => h("div", { style: { overflow: "hidden", height: item.height } }, slots.default ? slots.default(item) : "Please set content!")))
|
|
2001
2034
|
]);
|
|
2002
2035
|
}
|
|
2003
2036
|
});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vueuse/components",
|
|
3
|
-
"version": "10.
|
|
3
|
+
"version": "10.7.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.7.1",
|
|
36
|
+
"@vueuse/shared": "10.7.1",
|
|
37
37
|
"vue-demi": ">=0.14.6"
|
|
38
38
|
}
|
|
39
39
|
}
|