@vueuse/components 13.1.0 → 13.2.0

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.d.mts CHANGED
@@ -404,7 +404,7 @@ interface UseElementHoverOptions extends ConfigurableWindow {
404
404
  type BindingValueFunction$7 = (state: boolean) => void;
405
405
  declare const vElementHover: ObjectDirective<HTMLElement, BindingValueFunction$7 | [handler: BindingValueFunction$7, options: UseElementHoverOptions]>;
406
406
 
407
- declare const UseElementSize: vue.DefineComponent<ElementSize$1 & UseResizeObserverOptions & RenderableComponent, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<ElementSize$1 & UseResizeObserverOptions & RenderableComponent> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
407
+ declare const UseElementSize: vue.DefineComponent<Partial<ElementSize$1> & UseResizeObserverOptions & RenderableComponent, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<Partial<ElementSize$1> & UseResizeObserverOptions & RenderableComponent> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
408
408
 
409
409
  interface ElementSize {
410
410
  width: number;
package/index.iife.js CHANGED
@@ -1,7 +1,7 @@
1
1
  (function (exports, core, vue, shared) {
2
2
  'use strict';
3
3
 
4
- const OnClickOutside = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
4
+ const OnClickOutside = /* @__PURE__ */ vue.defineComponent({
5
5
  name: "OnClickOutside",
6
6
  props: ["as", "options"],
7
7
  emits: ["trigger"],
@@ -82,8 +82,8 @@
82
82
  if (shared.isIOS && !_iOSWorkaround) {
83
83
  _iOSWorkaround = true;
84
84
  const listenerOptions = { passive: true };
85
- Array.from(window.document.body.children).forEach((el) => useEventListener(el, "click", shared.noop, listenerOptions));
86
- useEventListener(window.document.documentElement, "click", shared.noop, listenerOptions);
85
+ Array.from(window.document.body.children).forEach((el) => el.addEventListener("click", shared.noop, listenerOptions));
86
+ window.document.documentElement.addEventListener("click", shared.noop, listenerOptions);
87
87
  }
88
88
  let shouldListen = true;
89
89
  const shouldIgnore = (event) => {
@@ -330,7 +330,7 @@
330
330
  return stop;
331
331
  }
332
332
 
333
- const OnLongPress = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
333
+ const OnLongPress = /* @__PURE__ */ vue.defineComponent({
334
334
  name: "OnLongPress",
335
335
  props: ["as", "options"],
336
336
  emits: ["trigger"],
@@ -359,7 +359,7 @@
359
359
  }
360
360
  };
361
361
 
362
- const UseActiveElement = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
362
+ const UseActiveElement = /* @__PURE__ */ vue.defineComponent({
363
363
  name: "UseActiveElement",
364
364
  setup(props, { slots }) {
365
365
  const data = vue.reactive({
@@ -372,7 +372,7 @@
372
372
  }
373
373
  });
374
374
 
375
- const UseBattery = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
375
+ const UseBattery = /* @__PURE__ */ vue.defineComponent({
376
376
  name: "UseBattery",
377
377
  setup(props, { slots }) {
378
378
  const data = vue.reactive(core.useBattery(props));
@@ -383,7 +383,7 @@
383
383
  }
384
384
  });
385
385
 
386
- const UseBrowserLocation = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
386
+ const UseBrowserLocation = /* @__PURE__ */ vue.defineComponent({
387
387
  name: "UseBrowserLocation",
388
388
  setup(props, { slots }) {
389
389
  const data = vue.reactive(core.useBrowserLocation());
@@ -394,7 +394,7 @@
394
394
  }
395
395
  });
396
396
 
397
- const UseClipboard = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
397
+ const UseClipboard = /* @__PURE__ */ vue.defineComponent({
398
398
  name: "UseClipboard",
399
399
  props: [
400
400
  "source",
@@ -568,18 +568,33 @@
568
568
  { flush, deep, eventFilter }
569
569
  );
570
570
  vue.watch(keyComputed, () => update(), { flush });
571
+ let firstMounted = false;
572
+ const onStorageEvent = (ev) => {
573
+ if (initOnMounted && !firstMounted) {
574
+ return;
575
+ }
576
+ update(ev);
577
+ };
578
+ const onStorageCustomEvent = (ev) => {
579
+ if (initOnMounted && !firstMounted) {
580
+ return;
581
+ }
582
+ updateFromCustomEvent(ev);
583
+ };
571
584
  if (window && listenToStorageChanges) {
585
+ if (storage instanceof Storage)
586
+ useEventListener(window, "storage", onStorageEvent, { passive: true });
587
+ else
588
+ useEventListener(window, customStorageEventName, onStorageCustomEvent);
589
+ }
590
+ if (initOnMounted) {
572
591
  shared.tryOnMounted(() => {
573
- if (storage instanceof Storage)
574
- useEventListener(window, "storage", update, { passive: true });
575
- else
576
- useEventListener(window, customStorageEventName, updateFromCustomEvent);
577
- if (initOnMounted)
578
- update();
592
+ firstMounted = true;
593
+ update();
579
594
  });
580
- }
581
- if (!initOnMounted)
595
+ } else {
582
596
  update();
597
+ }
583
598
  function dispatchWriteEvent(oldValue, newValue) {
584
599
  if (window) {
585
600
  const payload = {
@@ -747,7 +762,7 @@
747
762
  return Object.assign(auto, { store, system, state });
748
763
  }
749
764
 
750
- const UseColorMode = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
765
+ const UseColorMode = /* @__PURE__ */ vue.defineComponent({
751
766
  name: "UseColorMode",
752
767
  props: ["selector", "attribute", "modes", "onChanged", "storageKey", "storage", "emitAuto"],
753
768
  setup(props, { slots }) {
@@ -764,7 +779,7 @@
764
779
  }
765
780
  });
766
781
 
767
- const UseDark = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
782
+ const UseDark = /* @__PURE__ */ vue.defineComponent({
768
783
  name: "UseDark",
769
784
  props: ["selector", "attribute", "valueDark", "valueLight", "onChanged", "storageKey", "storage"],
770
785
  setup(props, { slots }) {
@@ -780,7 +795,7 @@
780
795
  }
781
796
  });
782
797
 
783
- const UseDeviceMotion = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
798
+ const UseDeviceMotion = /* @__PURE__ */ vue.defineComponent({
784
799
  name: "UseDeviceMotion",
785
800
  setup(props, { slots }) {
786
801
  const data = core.useDeviceMotion();
@@ -791,7 +806,7 @@
791
806
  }
792
807
  });
793
808
 
794
- const UseDeviceOrientation = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
809
+ const UseDeviceOrientation = /* @__PURE__ */ vue.defineComponent({
795
810
  name: "UseDeviceOrientation",
796
811
  setup(props, { slots }) {
797
812
  const data = vue.reactive(core.useDeviceOrientation());
@@ -802,7 +817,7 @@
802
817
  }
803
818
  });
804
819
 
805
- const UseDevicePixelRatio = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
820
+ const UseDevicePixelRatio = /* @__PURE__ */ vue.defineComponent({
806
821
  name: "UseDevicePixelRatio",
807
822
  setup(props, { slots }) {
808
823
  const data = vue.reactive({
@@ -815,7 +830,7 @@
815
830
  }
816
831
  });
817
832
 
818
- const UseDevicesList = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
833
+ const UseDevicesList = /* @__PURE__ */ vue.defineComponent({
819
834
  name: "UseDevicesList",
820
835
  props: ["onUpdated", "requestPermissions", "constraints"],
821
836
  setup(props, { slots }) {
@@ -827,7 +842,7 @@
827
842
  }
828
843
  });
829
844
 
830
- const UseDocumentVisibility = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
845
+ const UseDocumentVisibility = /* @__PURE__ */ vue.defineComponent({
831
846
  name: "UseDocumentVisibility",
832
847
  setup(props, { slots }) {
833
848
  const data = vue.reactive({
@@ -840,7 +855,7 @@
840
855
  }
841
856
  });
842
857
 
843
- const UseDraggable = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
858
+ const UseDraggable = /* @__PURE__ */ vue.defineComponent({
844
859
  name: "UseDraggable",
845
860
  props: [
846
861
  "storageKey",
@@ -900,7 +915,7 @@
900
915
  }
901
916
  });
902
917
 
903
- const UseElementBounding = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
918
+ const UseElementBounding = /* @__PURE__ */ vue.defineComponent({
904
919
  name: "UseElementBounding",
905
920
  props: ["box", "as"],
906
921
  setup(props, { slots }) {
@@ -1171,12 +1186,13 @@
1171
1186
  }
1172
1187
  };
1173
1188
 
1174
- const UseElementSize = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
1189
+ const UseElementSize = /* @__PURE__ */ vue.defineComponent({
1175
1190
  name: "UseElementSize",
1176
1191
  props: ["width", "height", "box", "as"],
1177
1192
  setup(props, { slots }) {
1193
+ var _a, _b;
1178
1194
  const target = vue.ref();
1179
- const data = vue.reactive(core.useElementSize(target, { width: props.width, height: props.height }, { box: props.box }));
1195
+ const data = vue.reactive(core.useElementSize(target, { width: (_a = props.width) != null ? _a : 0, height: (_b = props.height) != null ? _b : 0 }, { box: props.box }));
1180
1196
  return () => {
1181
1197
  if (slots.default)
1182
1198
  return vue.h(props.as || "div", { ref: target }, slots.default(data));
@@ -1251,7 +1267,7 @@
1251
1267
  }
1252
1268
  };
1253
1269
 
1254
- const UseElementVisibility = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
1270
+ const UseElementVisibility = /* @__PURE__ */ vue.defineComponent({
1255
1271
  name: "UseElementVisibility",
1256
1272
  props: ["as"],
1257
1273
  setup(props, { slots }) {
@@ -1376,7 +1392,7 @@
1376
1392
  }
1377
1393
  };
1378
1394
 
1379
- const UseEyeDropper = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
1395
+ const UseEyeDropper = /* @__PURE__ */ vue.defineComponent({
1380
1396
  name: "UseEyeDropper",
1381
1397
  props: {
1382
1398
  sRGBHex: String
@@ -1390,7 +1406,7 @@
1390
1406
  }
1391
1407
  });
1392
1408
 
1393
- const UseFullscreen = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
1409
+ const UseFullscreen = /* @__PURE__ */ vue.defineComponent({
1394
1410
  name: "UseFullscreen",
1395
1411
  props: ["as"],
1396
1412
  setup(props, { slots }) {
@@ -1403,7 +1419,7 @@
1403
1419
  }
1404
1420
  });
1405
1421
 
1406
- const UseGeolocation = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
1422
+ const UseGeolocation = /* @__PURE__ */ vue.defineComponent({
1407
1423
  name: "UseGeolocation",
1408
1424
  props: ["enableHighAccuracy", "maximumAge", "timeout", "navigator"],
1409
1425
  setup(props, { slots }) {
@@ -1415,7 +1431,7 @@
1415
1431
  }
1416
1432
  });
1417
1433
 
1418
- const UseIdle = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
1434
+ const UseIdle = /* @__PURE__ */ vue.defineComponent({
1419
1435
  name: "UseIdle",
1420
1436
  props: ["timeout", "events", "listenForVisibilityChange", "initialState"],
1421
1437
  setup(props, { slots }) {
@@ -1538,7 +1554,7 @@
1538
1554
  return state;
1539
1555
  }
1540
1556
 
1541
- const UseImage = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
1557
+ const UseImage = /* @__PURE__ */ vue.defineComponent({
1542
1558
  name: "UseImage",
1543
1559
  props: [
1544
1560
  "src",
@@ -1817,7 +1833,7 @@
1817
1833
  }
1818
1834
  };
1819
1835
 
1820
- const UseMouse = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
1836
+ const UseMouse = /* @__PURE__ */ vue.defineComponent({
1821
1837
  name: "UseMouse",
1822
1838
  props: ["touch", "resetOnTouchEnds", "initialValue"],
1823
1839
  setup(props, { slots }) {
@@ -1829,7 +1845,7 @@
1829
1845
  }
1830
1846
  });
1831
1847
 
1832
- const UseMouseInElement = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
1848
+ const UseMouseInElement = /* @__PURE__ */ vue.defineComponent({
1833
1849
  name: "UseMouseElement",
1834
1850
  props: ["handleOutside", "as"],
1835
1851
  setup(props, { slots }) {
@@ -1995,7 +2011,7 @@
1995
2011
  }
1996
2012
  };
1997
2013
 
1998
- const UseMousePressed = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2014
+ const UseMousePressed = /* @__PURE__ */ vue.defineComponent({
1999
2015
  name: "UseMousePressed",
2000
2016
  props: ["touch", "initialValue", "as"],
2001
2017
  setup(props, { slots }) {
@@ -2008,7 +2024,7 @@
2008
2024
  }
2009
2025
  });
2010
2026
 
2011
- const UseNetwork = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2027
+ const UseNetwork = /* @__PURE__ */ vue.defineComponent({
2012
2028
  name: "UseNetwork",
2013
2029
  setup(props, { slots }) {
2014
2030
  const data = vue.reactive(core.useNetwork());
@@ -2019,7 +2035,7 @@
2019
2035
  }
2020
2036
  });
2021
2037
 
2022
- const UseNow = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2038
+ const UseNow = /* @__PURE__ */ vue.defineComponent({
2023
2039
  name: "UseNow",
2024
2040
  props: ["interval"],
2025
2041
  setup(props, { slots }) {
@@ -2031,7 +2047,7 @@
2031
2047
  }
2032
2048
  });
2033
2049
 
2034
- const UseObjectUrl = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2050
+ const UseObjectUrl = /* @__PURE__ */ vue.defineComponent({
2035
2051
  name: "UseObjectUrl",
2036
2052
  props: [
2037
2053
  "object"
@@ -2046,7 +2062,7 @@
2046
2062
  }
2047
2063
  });
2048
2064
 
2049
- const UseOffsetPagination = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2065
+ const UseOffsetPagination = /* @__PURE__ */ vue.defineComponent({
2050
2066
  name: "UseOffsetPagination",
2051
2067
  props: [
2052
2068
  "total",
@@ -2087,7 +2103,7 @@
2087
2103
  }
2088
2104
  });
2089
2105
 
2090
- const UseOnline = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2106
+ const UseOnline = /* @__PURE__ */ vue.defineComponent({
2091
2107
  name: "UseOnline",
2092
2108
  setup(props, { slots }) {
2093
2109
  const data = vue.reactive({
@@ -2100,7 +2116,7 @@
2100
2116
  }
2101
2117
  });
2102
2118
 
2103
- const UsePageLeave = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2119
+ const UsePageLeave = /* @__PURE__ */ vue.defineComponent({
2104
2120
  name: "UsePageLeave",
2105
2121
  setup(props, { slots }) {
2106
2122
  const data = vue.reactive({
@@ -2113,7 +2129,7 @@
2113
2129
  }
2114
2130
  });
2115
2131
 
2116
- const UsePointer = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2132
+ const UsePointer = /* @__PURE__ */ vue.defineComponent({
2117
2133
  name: "UsePointer",
2118
2134
  props: [
2119
2135
  "pointerTypes",
@@ -2146,7 +2162,7 @@
2146
2162
  }
2147
2163
  });
2148
2164
 
2149
- const UsePreferredColorScheme = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2165
+ const UsePreferredColorScheme = /* @__PURE__ */ vue.defineComponent({
2150
2166
  name: "UsePreferredColorScheme",
2151
2167
  setup(props, { slots }) {
2152
2168
  const data = vue.reactive({
@@ -2159,7 +2175,7 @@
2159
2175
  }
2160
2176
  });
2161
2177
 
2162
- const UsePreferredContrast = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2178
+ const UsePreferredContrast = /* @__PURE__ */ vue.defineComponent({
2163
2179
  name: "UsePreferredContrast",
2164
2180
  setup(props, { slots }) {
2165
2181
  const data = vue.reactive({
@@ -2172,7 +2188,7 @@
2172
2188
  }
2173
2189
  });
2174
2190
 
2175
- const UsePreferredDark = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2191
+ const UsePreferredDark = /* @__PURE__ */ vue.defineComponent({
2176
2192
  name: "UsePreferredDark",
2177
2193
  setup(props, { slots }) {
2178
2194
  const data = vue.reactive({
@@ -2185,7 +2201,7 @@
2185
2201
  }
2186
2202
  });
2187
2203
 
2188
- const UsePreferredLanguages = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2204
+ const UsePreferredLanguages = /* @__PURE__ */ vue.defineComponent({
2189
2205
  name: "UsePreferredLanguages",
2190
2206
  setup(props, { slots }) {
2191
2207
  const data = vue.reactive({
@@ -2198,7 +2214,7 @@
2198
2214
  }
2199
2215
  });
2200
2216
 
2201
- const UsePreferredReducedMotion = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2217
+ const UsePreferredReducedMotion = /* @__PURE__ */ vue.defineComponent({
2202
2218
  name: "UsePreferredReducedMotion",
2203
2219
  setup(props, { slots }) {
2204
2220
  const data = vue.reactive({
@@ -2211,7 +2227,7 @@
2211
2227
  }
2212
2228
  });
2213
2229
 
2214
- const UsePreferredReducedTransparency = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2230
+ const UsePreferredReducedTransparency = /* @__PURE__ */ vue.defineComponent({
2215
2231
  name: "UsePreferredReducedTransparency",
2216
2232
  setup(props, { slots }) {
2217
2233
  const data = vue.reactive({
@@ -2319,7 +2335,7 @@
2319
2335
  return getComputedStyle(document.documentElement).getPropertyValue(position);
2320
2336
  }
2321
2337
 
2322
- const UseScreenSafeArea = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2338
+ const UseScreenSafeArea = /* @__PURE__ */ vue.defineComponent({
2323
2339
  name: "UseScreenSafeArea",
2324
2340
  props: {
2325
2341
  top: Boolean,
@@ -2481,7 +2497,7 @@
2481
2497
  }
2482
2498
  const vScrollLock = onScrollLock();
2483
2499
 
2484
- const UseTimeAgo = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2500
+ const UseTimeAgo = /* @__PURE__ */ vue.defineComponent({
2485
2501
  name: "UseTimeAgo",
2486
2502
  props: ["time", "updateInterval", "max", "fullDateFormatter", "messages", "showSecond"],
2487
2503
  setup(props, { slots }) {
@@ -2493,7 +2509,7 @@
2493
2509
  }
2494
2510
  });
2495
2511
 
2496
- const UseTimestamp = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2512
+ const UseTimestamp = /* @__PURE__ */ vue.defineComponent({
2497
2513
  name: "UseTimestamp",
2498
2514
  props: ["immediate", "interval", "offset"],
2499
2515
  setup(props, { slots }) {
@@ -2505,7 +2521,7 @@
2505
2521
  }
2506
2522
  });
2507
2523
 
2508
- const UseVirtualList = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2524
+ const UseVirtualList = /* @__PURE__ */ vue.defineComponent({
2509
2525
  name: "UseVirtualList",
2510
2526
  props: [
2511
2527
  "list",
@@ -2524,7 +2540,7 @@
2524
2540
  }
2525
2541
  });
2526
2542
 
2527
- const UseWindowFocus = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2543
+ const UseWindowFocus = /* @__PURE__ */ vue.defineComponent({
2528
2544
  name: "UseWindowFocus",
2529
2545
  setup(props, { slots }) {
2530
2546
  const data = vue.reactive({
@@ -2537,7 +2553,7 @@
2537
2553
  }
2538
2554
  });
2539
2555
 
2540
- const UseWindowSize = /* @__PURE__ */ /*@__PURE__*/ vue.defineComponent({
2556
+ const UseWindowSize = /* @__PURE__ */ vue.defineComponent({
2541
2557
  name: "UseWindowSize",
2542
2558
  props: ["initialWidth", "initialHeight"],
2543
2559
  setup(props, { slots }) {
package/index.iife.min.js CHANGED
@@ -1 +1 @@
1
- (function(y,C,o,S){"use strict";const ge=o.defineComponent({name:"OnClickOutside",props:["as","options"],emits:["trigger"],setup(e,{slots:t,emit:n}){const a=o.shallowRef();return C.onClickOutside(a,l=>{n("trigger",l)},e.options),()=>{if(t.default)return o.h(e.as||"div",{ref:a},t.default())}}}),A=S.isClient?window:void 0;function T(e){var t;const n=o.toValue(e);return(t=n?.$el)!=null?t:n}function D(...e){const t=[],n=()=>{t.forEach(s=>s()),t.length=0},a=(s,c,f,u)=>(s.addEventListener(c,f,u),()=>s.removeEventListener(c,f,u)),l=o.computed(()=>{const s=S.toArray(o.toValue(e[0])).filter(c=>c!=null);return s.every(c=>typeof c!="string")?s:void 0}),r=S.watchImmediate(()=>{var s,c;return[(c=(s=l.value)==null?void 0:s.map(f=>T(f)))!=null?c:[A].filter(f=>f!=null),S.toArray(o.toValue(l.value?e[1]:e[0])),S.toArray(o.unref(l.value?e[2]:e[1])),o.toValue(l.value?e[3]:e[2])]},([s,c,f,u])=>{if(n(),!s?.length||!c?.length||!f?.length)return;const d=S.isObject(u)?{...u}:u;t.push(...s.flatMap(p=>c.flatMap(U=>f.map(g=>a(p,U,g,d)))))},{flush:"post"}),i=()=>{r(),n()};return S.tryOnScopeDispose(n),i}let Q=!1;function Z(e,t,n={}){const{window:a=A,ignore:l=[],capture:r=!0,detectIframe:i=!1,controls:s=!1}=n;if(!a)return s?{stop:S.noop,cancel:S.noop,trigger:S.noop}:S.noop;if(S.isIOS&&!Q){Q=!0;const h={passive:!0};Array.from(a.document.body.children).forEach(m=>D(m,"click",S.noop,h)),D(a.document.documentElement,"click",S.noop,h)}let c=!0;const f=h=>o.toValue(l).some(m=>{if(typeof m=="string")return Array.from(a.document.querySelectorAll(m)).some(w=>w===h.target||h.composedPath().includes(w));{const w=T(m);return w&&(h.target===w||h.composedPath().includes(w))}});function u(h){const m=o.toValue(h);return m&&m.$.subTree.shapeFlag===16}function d(h,m){const w=o.toValue(h),R=w.$.subTree&&w.$.subTree.children;return R==null||!Array.isArray(R)?!1:R.some(E=>E.el===m.target||m.composedPath().includes(E.el))}const p=h=>{const m=T(e);if(h.target!=null&&!(!(m instanceof Element)&&u(e)&&d(e,h))&&!(!m||m===h.target||h.composedPath().includes(m))){if("detail"in h&&h.detail===0&&(c=!f(h)),!c){c=!0;return}t(h)}};let U=!1;const g=[D(a,"click",h=>{U||(U=!0,setTimeout(()=>{U=!1},0),p(h))},{passive:!0,capture:r}),D(a,"pointerdown",h=>{const m=T(e);c=!f(h)&&!!(m&&!h.composedPath().includes(m))},{passive:!0}),i&&D(a,"blur",h=>{setTimeout(()=>{var m;const w=T(e);((m=a.document.activeElement)==null?void 0:m.tagName)==="IFRAME"&&!w?.contains(a.document.activeElement)&&t(h)},0)},{passive:!0})].filter(Boolean),b=()=>g.forEach(h=>h());return s?{stop:b,cancel:()=>{c=!1},trigger:h=>{c=!0,p(h),c=!1}}:b}const ee={mounted(e,t){const n=!t.modifiers.bubble;if(typeof t.value=="function")e.__onClickOutside_stop=Z(e,t.value,{capture:n});else{const[a,l]=t.value;e.__onClickOutside_stop=Z(e,a,Object.assign({capture:n},l))}},unmounted(e){e.__onClickOutside_stop()}};function ye(e){return typeof e=="function"?e:typeof e=="string"?t=>t.key===e:Array.isArray(e)?t=>e.includes(t.key):()=>!0}function te(...e){let t,n,a={};e.length===3?(t=e[0],n=e[1],a=e[2]):e.length===2?typeof e[1]=="object"?(t=!0,n=e[0],a=e[1]):(t=e[0],n=e[1]):(t=!0,n=e[0]);const{target:l=A,eventName:r="keydown",passive:i=!1,dedupe:s=!1}=a,c=ye(t);return D(l,r,u=>{u.repeat&&o.toValue(s)||c(u)&&n(u)},i)}const we={mounted(e,t){var n,a;const l=(a=(n=t.arg)==null?void 0:n.split(","))!=null?a:!0;if(typeof t.value=="function")te(l,t.value,{target:e});else{const[r,i]=t.value;te(l,r,{target:e,...i})}}},Ue=500,Se=10;function X(e,t,n){var a,l;const r=o.computed(()=>T(e));let i,s,c,f=!1;function u(){i&&(clearTimeout(i),i=void 0),s=void 0,c=void 0,f=!1}function d(m){var w,R,E;const[V,L,v]=[c,s,f];if(u(),!n?.onMouseUp||!L||!V||(w=n?.modifiers)!=null&&w.self&&m.target!==r.value)return;(R=n?.modifiers)!=null&&R.prevent&&m.preventDefault(),(E=n?.modifiers)!=null&&E.stop&&m.stopPropagation();const k=m.x-L.x,_=m.y-L.y,I=Math.sqrt(k*k+_*_);n.onMouseUp(m.timeStamp-V,I,v)}function p(m){var w,R,E,V;(w=n?.modifiers)!=null&&w.self&&m.target!==r.value||(u(),(R=n?.modifiers)!=null&&R.prevent&&m.preventDefault(),(E=n?.modifiers)!=null&&E.stop&&m.stopPropagation(),s={x:m.x,y:m.y},c=m.timeStamp,i=setTimeout(()=>{f=!0,t(m)},(V=n?.delay)!=null?V:Ue))}function U(m){var w,R,E,V;if((w=n?.modifiers)!=null&&w.self&&m.target!==r.value||!s||n?.distanceThreshold===!1)return;(R=n?.modifiers)!=null&&R.prevent&&m.preventDefault(),(E=n?.modifiers)!=null&&E.stop&&m.stopPropagation();const L=m.x-s.x,v=m.y-s.y;Math.sqrt(L*L+v*v)>=((V=n?.distanceThreshold)!=null?V:Se)&&u()}const g={capture:(a=n?.modifiers)==null?void 0:a.capture,once:(l=n?.modifiers)==null?void 0:l.once},b=[D(r,"pointerdown",p,g),D(r,"pointermove",U,g),D(r,["pointerup","pointerleave"],d,g)];return()=>b.forEach(m=>m())}const be=o.defineComponent({name:"OnLongPress",props:["as","options"],emits:["trigger"],setup(e,{slots:t,emit:n}){const a=o.shallowRef();return X(a,l=>{n("trigger",l)},e.options),()=>{if(t.default)return o.h(e.as||"div",{ref:a},t.default())}}}),ne={mounted(e,t){typeof t.value=="function"?X(e,t.value,{modifiers:t.modifiers}):X(e,...t.value)}},Ce=o.defineComponent({name:"UseActiveElement",setup(e,{slots:t}){const n=o.reactive({element:C.useActiveElement()});return()=>{if(t.default)return t.default(n)}}}),Ee=o.defineComponent({name:"UseBattery",setup(e,{slots:t}){const n=o.reactive(C.useBattery(e));return()=>{if(t.default)return t.default(n)}}}),Oe=o.defineComponent({name:"UseBrowserLocation",setup(e,{slots:t}){const n=o.reactive(C.useBrowserLocation());return()=>{if(t.default)return t.default(n)}}}),Re=o.defineComponent({name:"UseClipboard",props:["source","read","navigator","copiedDuring","legacy"],setup(e,{slots:t}){const n=o.reactive(C.useClipboard(e));return()=>{var a;return(a=t.default)==null?void 0:a.call(t,n)}}}),B=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},H="__vueuse_ssr_handlers__",Pe=Ve();function Ve(){return H in B||(B[H]=B[H]||{}),B[H]}function oe(e,t){return Pe[e]||t}const Me=Symbol("vueuse-ssr-width");function De(){const e=o.hasInjectionContext()?S.injectLocal(Me,null):null;return typeof e=="number"?e:void 0}function _e(){const e=o.shallowRef(!1),t=o.getCurrentInstance();return t&&o.onMounted(()=>{e.value=!0},t),e}function N(e){const t=_e();return o.computed(()=>(t.value,!!e()))}function Te(e,t={}){const{window:n=A,ssrWidth:a=De()}=t,l=N(()=>n&&"matchMedia"in n&&typeof n.matchMedia=="function"),r=o.shallowRef(typeof a=="number"),i=o.shallowRef(),s=o.shallowRef(!1),c=f=>{s.value=f.matches};return o.watchEffect(()=>{if(r.value){r.value=!l.value;const f=o.toValue(e).split(",");s.value=f.some(u=>{const d=u.includes("not all"),p=u.match(/\(\s*min-width:\s*(-?\d+(?:\.\d*)?[a-z]+\s*)\)/),U=u.match(/\(\s*max-width:\s*(-?\d+(?:\.\d*)?[a-z]+\s*)\)/);let g=!!(p||U);return p&&g&&(g=a>=S.pxValue(p[1])),U&&g&&(g=a<=S.pxValue(U[1])),d?!g:g});return}l.value&&(i.value=n.matchMedia(o.toValue(e)),s.value=i.value.matches)}),D(i,"change",c,{passive:!0}),o.computed(()=>s.value)}function ke(e){return Te("(prefers-color-scheme: dark)",e)}function Le(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 Ae={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()}},ae="vueuse-storage";function Ie(e,t,n,a={}){var l;const{flush:r="pre",deep:i=!0,listenToStorageChanges:s=!0,writeDefaults:c=!0,mergeDefaults:f=!1,shallow:u,window:d=A,eventFilter:p,onError:U=O=>{console.error(O)},initOnMounted:g}=a,b=(u?o.shallowRef:o.ref)(typeof t=="function"?t():t),h=o.computed(()=>o.toValue(e));if(!n)try{n=oe("getDefaultStorage",()=>{var O;return(O=A)==null?void 0:O.localStorage})()}catch(O){U(O)}if(!n)return b;const m=o.toValue(t),w=Le(m),R=(l=a.serializer)!=null?l:Ae[w],{pause:E,resume:V}=S.pausableWatch(b,()=>v(b.value),{flush:r,deep:i,eventFilter:p});o.watch(h,()=>_(),{flush:r}),d&&s&&S.tryOnMounted(()=>{n instanceof Storage?D(d,"storage",_,{passive:!0}):D(d,ae,I),g&&_()}),g||_();function L(O,M){if(d){const P={key:h.value,oldValue:O,newValue:M,storageArea:n};d.dispatchEvent(n instanceof Storage?new StorageEvent("storage",P):new CustomEvent(ae,{detail:P}))}}function v(O){try{const M=n.getItem(h.value);if(O==null)L(M,null),n.removeItem(h.value);else{const P=R.write(O);M!==P&&(n.setItem(h.value,P),L(M,P))}}catch(M){U(M)}}function k(O){const M=O?O.newValue:n.getItem(h.value);if(M==null)return c&&m!=null&&n.setItem(h.value,R.write(m)),m;if(!O&&f){const P=R.read(M);return typeof f=="function"?f(P,m):w==="object"&&!Array.isArray(P)?{...m,...P}:P}else return typeof M!="string"?M:R.read(M)}function _(O){if(!(O&&O.storageArea!==n)){if(O&&O.key==null){b.value=m;return}if(!(O&&O.key!==h.value)){E();try{O?.newValue!==R.write(b.value)&&(b.value=k(O))}catch(M){U(M)}finally{O?o.nextTick(V):V()}}}}function I(O){_(O.detail)}return b}const ze="*,*::before,*::after{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}";function We(e={}){const{selector:t="html",attribute:n="class",initialValue:a="auto",window:l=A,storage:r,storageKey:i="vueuse-color-scheme",listenToStorageChanges:s=!0,storageRef:c,emitAuto:f,disableTransition:u=!0}=e,d={auto:"",light:"light",dark:"dark",...e.modes||{}},p=ke({window:l}),U=o.computed(()=>p.value?"dark":"light"),g=c||(i==null?S.toRef(a):Ie(i,a,r,{window:l,listenToStorageChanges:s})),b=o.computed(()=>g.value==="auto"?U.value:g.value),h=oe("updateHTMLAttrs",(E,V,L)=>{const v=typeof E=="string"?l?.document.querySelector(E):T(E);if(!v)return;const k=new Set,_=new Set;let I=null;if(V==="class"){const M=L.split(/\s/g);Object.values(d).flatMap(P=>(P||"").split(/\s/g)).filter(Boolean).forEach(P=>{M.includes(P)?k.add(P):_.add(P)})}else I={key:V,value:L};if(k.size===0&&_.size===0&&I===null)return;let O;u&&(O=l.document.createElement("style"),O.appendChild(document.createTextNode(ze)),l.document.head.appendChild(O));for(const M of k)v.classList.add(M);for(const M of _)v.classList.remove(M);I&&v.setAttribute(I.key,I.value),u&&(l.getComputedStyle(O).opacity,document.head.removeChild(O))});function m(E){var V;h(t,n,(V=d[E])!=null?V:E)}function w(E){e.onChanged?e.onChanged(E,m):m(E)}o.watch(b,w,{flush:"post",immediate:!0}),S.tryOnMounted(()=>w(b.value));const R=o.computed({get(){return f?g.value:b.value},set(E){g.value=E}});return Object.assign(R,{store:g,system:U,state:b})}const Be=o.defineComponent({name:"UseColorMode",props:["selector","attribute","modes","onChanged","storageKey","storage","emitAuto"],setup(e,{slots:t}){const n=We(e),a=o.reactive({mode:n,system:n.system,store:n.store});return()=>{if(t.default)return t.default(a)}}}),He=o.defineComponent({name:"UseDark",props:["selector","attribute","valueDark","valueLight","onChanged","storageKey","storage"],setup(e,{slots:t}){const n=C.useDark(e),a=o.reactive({isDark:n,toggleDark:S.useToggle(n)});return()=>{if(t.default)return t.default(a)}}}),Ne=o.defineComponent({name:"UseDeviceMotion",setup(e,{slots:t}){const n=C.useDeviceMotion();return()=>{if(t.default)return t.default(n)}}}),Fe=o.defineComponent({name:"UseDeviceOrientation",setup(e,{slots:t}){const n=o.reactive(C.useDeviceOrientation());return()=>{if(t.default)return t.default(n)}}}),je=o.defineComponent({name:"UseDevicePixelRatio",setup(e,{slots:t}){const n=o.reactive({pixelRatio:C.useDevicePixelRatio()});return()=>{if(t.default)return t.default(n)}}}),Ye=o.defineComponent({name:"UseDevicesList",props:["onUpdated","requestPermissions","constraints"],setup(e,{slots:t}){const n=o.reactive(C.useDevicesList(e));return()=>{if(t.default)return t.default(n)}}}),xe=o.defineComponent({name:"UseDocumentVisibility",setup(e,{slots:t}){const n=o.reactive({visibility:C.useDocumentVisibility()});return()=>{if(t.default)return t.default(n)}}}),Xe=o.defineComponent({name:"UseDraggable",props:["storageKey","storageType","initialValue","exact","preventDefault","stopPropagation","pointerTypes","as","handle","axis","onStart","onMove","onEnd","disabled","buttons","containerElement"],setup(e,{slots:t}){const n=o.shallowRef(),a=o.computed(()=>{var u;return(u=e.handle)!=null?u:n.value}),l=o.computed(()=>{var u;return(u=e.containerElement)!=null?u:void 0}),r=o.computed(()=>!!e.disabled),i=e.storageKey&&C.useStorage(e.storageKey,o.toValue(e.initialValue)||{x:0,y:0},C.isClient?e.storageType==="session"?sessionStorage:localStorage:void 0),s=i||e.initialValue||{x:0,y:0},c=(u,d)=>{var p;(p=e.onEnd)==null||p.call(e,u,d),i&&(i.value.x=u.x,i.value.y=u.y)},f=o.reactive(C.useDraggable(n,{...e,handle:a,initialValue:s,onEnd:c,disabled:r,containerElement:l}));return()=>{if(t.default)return o.h(e.as||"div",{ref:n,style:`touch-action:none;${f.style}`},t.default(f))}}}),Ke=o.defineComponent({name:"UseElementBounding",props:["box","as"],setup(e,{slots:t}){const n=o.shallowRef(),a=o.reactive(C.useElementBounding(n));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(a))}}});function K(e,t,n={}){const{window:a=A,...l}=n;let r;const i=N(()=>a&&"MutationObserver"in a),s=()=>{r&&(r.disconnect(),r=void 0)},c=o.computed(()=>{const p=o.toValue(e),U=S.toArray(p).map(T).filter(S.notNullish);return new Set(U)}),f=o.watch(()=>c.value,p=>{s(),i.value&&p.size&&(r=new MutationObserver(t),p.forEach(U=>r.observe(U,l)))},{immediate:!0,flush:"post"}),u=()=>r?.takeRecords(),d=()=>{f(),s()};return S.tryOnScopeDispose(d),{isSupported:i,stop:d,takeRecords:u}}function F(e,t,n={}){const{window:a=A,...l}=n;let r;const i=N(()=>a&&"ResizeObserver"in a),s=()=>{r&&(r.disconnect(),r=void 0)},c=o.computed(()=>{const d=o.toValue(e);return Array.isArray(d)?d.map(p=>T(p)):[T(d)]}),f=o.watch(c,d=>{if(s(),i.value&&a){r=new ResizeObserver(t);for(const p of d)p&&r.observe(p,l)}},{immediate:!0,flush:"post"}),u=()=>{s(),f()};return S.tryOnScopeDispose(u),{isSupported:i,stop:u}}function Ge(e,t={}){const{reset:n=!0,windowResize:a=!0,windowScroll:l=!0,immediate:r=!0,updateTiming:i="sync"}=t,s=o.shallowRef(0),c=o.shallowRef(0),f=o.shallowRef(0),u=o.shallowRef(0),d=o.shallowRef(0),p=o.shallowRef(0),U=o.shallowRef(0),g=o.shallowRef(0);function b(){const m=T(e);if(!m){n&&(s.value=0,c.value=0,f.value=0,u.value=0,d.value=0,p.value=0,U.value=0,g.value=0);return}const w=m.getBoundingClientRect();s.value=w.height,c.value=w.bottom,f.value=w.left,u.value=w.right,d.value=w.top,p.value=w.width,U.value=w.x,g.value=w.y}function h(){i==="sync"?b():i==="next-frame"&&requestAnimationFrame(()=>b())}return F(e,h),o.watch(()=>T(e),m=>!m&&h()),K(e,h,{attributeFilter:["style","class"]}),l&&D("scroll",h,{capture:!0,passive:!0}),a&&D("resize",h,{passive:!0}),S.tryOnMounted(()=>{r&&h()}),{height:s,bottom:c,left:f,right:u,top:d,width:p,x:U,y:g,update:h}}const Je={mounted(e,t){const[n,a]=typeof t.value=="function"?[t.value,{}]:t.value,{height:l,bottom:r,left:i,right:s,top:c,width:f,x:u,y:d}=Ge(e,a);o.watch([l,r,i,s,c,f,u,d],()=>n({height:l,bottom:r,left:i,right:s,top:c,width:f,x:u,y:d}))}};function $e(e,t,n={}){const{window:a=A,document:l=a?.document,flush:r="sync"}=n;if(!a||!l)return S.noop;let i;const s=u=>{i?.(),i=u},c=o.watchEffect(()=>{const u=T(e);if(u){const{stop:d}=K(l,p=>{p.map(g=>[...g.removedNodes]).flat().some(g=>g===u||g.contains(u))&&t(p)},{window:a,childList:!0,subtree:!0});s(d)}},{flush:r}),f=()=>{c(),s()};return S.tryOnScopeDispose(f),f}function le(e,t={}){const{delayEnter:n=0,delayLeave:a=0,triggerOnRemoval:l=!1,window:r=A}=t,i=o.shallowRef(!1);let s;const c=f=>{const u=f?n:a;s&&(clearTimeout(s),s=void 0),u?s=setTimeout(()=>i.value=f,u):i.value=f};return r&&(D(e,"mouseenter",()=>c(!0),{passive:!0}),D(e,"mouseleave",()=>c(!1),{passive:!0}),l&&$e(o.computed(()=>T(e)),()=>c(!1))),i}const qe={mounted(e,t){const n=t.value;if(typeof n=="function"){const a=le(e);o.watch(a,l=>n(l))}else{const[a,l]=n,r=le(e,l);o.watch(r,i=>a(i))}}},Qe=o.defineComponent({name:"UseElementSize",props:["width","height","box","as"],setup(e,{slots:t}){const n=o.ref(),a=o.reactive(C.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(a))}}});function Ze(e,t={width:0,height:0},n={}){const{window:a=A,box:l="content-box"}=n,r=o.computed(()=>{var d,p;return(p=(d=T(e))==null?void 0:d.namespaceURI)==null?void 0:p.includes("svg")}),i=o.shallowRef(t.width),s=o.shallowRef(t.height),{stop:c}=F(e,([d])=>{const p=l==="border-box"?d.borderBoxSize:l==="content-box"?d.contentBoxSize:d.devicePixelContentBoxSize;if(a&&r.value){const U=T(e);if(U){const g=U.getBoundingClientRect();i.value=g.width,s.value=g.height}}else if(p){const U=S.toArray(p);i.value=U.reduce((g,{inlineSize:b})=>g+b,0),s.value=U.reduce((g,{blockSize:b})=>g+b,0)}else i.value=d.contentRect.width,s.value=d.contentRect.height},n);S.tryOnMounted(()=>{const d=T(e);d&&(i.value="offsetWidth"in d?d.offsetWidth:t.width,s.value="offsetHeight"in d?d.offsetHeight:t.height)});const f=o.watch(()=>T(e),d=>{i.value=d?t.width:0,s.value=d?t.height:0});function u(){c(),f()}return{width:i,height:s,stop:u}}const et={mounted(e,t){var n;const a=typeof t.value=="function"?t.value:(n=t.value)==null?void 0:n[0],l=typeof t.value=="function"?[]:t.value.slice(1),{width:r,height:i}=Ze(e,...l);o.watch([r,i],([s,c])=>a({width:s,height:c}))}},tt=o.defineComponent({name:"UseElementVisibility",props:["as"],setup(e,{slots:t}){const n=o.ref(),a=o.reactive({isVisible:C.useElementVisibility(n)});return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(a))}}});function G(e,t,n={}){const{root:a,rootMargin:l="0px",threshold:r=0,window:i=A,immediate:s=!0}=n,c=N(()=>i&&"IntersectionObserver"in i),f=o.computed(()=>{const g=o.toValue(e);return S.toArray(g).map(T).filter(S.notNullish)});let u=S.noop;const d=o.shallowRef(s),p=c.value?o.watch(()=>[f.value,T(a),d.value],([g,b])=>{if(u(),!d.value||!g.length)return;const h=new IntersectionObserver(t,{root:T(b),rootMargin:l,threshold:r});g.forEach(m=>m&&h.observe(m)),u=()=>{h.disconnect(),u=S.noop}},{immediate:s,flush:"post"}):S.noop,U=()=>{u(),p(),d.value=!1};return S.tryOnScopeDispose(U),{isSupported:c,isActive:d,pause(){u(),d.value=!1},resume(){d.value=!0},stop:U}}function J(e,t={}){const{window:n=A,scrollTarget:a,threshold:l=0,rootMargin:r,once:i=!1}=t,s=o.shallowRef(!1),{stop:c}=G(e,f=>{let u=s.value,d=0;for(const p of f)p.time>=d&&(d=p.time,u=p.isIntersecting);s.value=u,i&&S.watchOnce(s,()=>{c()})},{root:a,window:n,threshold:l,rootMargin:o.toValue(r)});return s}const nt={mounted(e,t){if(typeof t.value=="function"){const n=t.value,a=J(e);o.watch(a,l=>n(l),{immediate:!0})}else{const[n,a]=t.value,l=J(e,a);o.watch(l,r=>n(r),{immediate:!0})}}},ot=o.defineComponent({name:"UseEyeDropper",props:{sRGBHex:String},setup(e,{slots:t}){const n=o.reactive(C.useEyeDropper());return()=>{if(t.default)return t.default(n)}}}),at=o.defineComponent({name:"UseFullscreen",props:["as"],setup(e,{slots:t}){const n=o.ref(),a=o.reactive(C.useFullscreen(n));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(a))}}}),lt=o.defineComponent({name:"UseGeolocation",props:["enableHighAccuracy","maximumAge","timeout","navigator"],setup(e,{slots:t}){const n=o.reactive(C.useGeolocation(e));return()=>{if(t.default)return t.default(n)}}}),st=o.defineComponent({name:"UseIdle",props:["timeout","events","listenForVisibilityChange","initialState"],setup(e,{slots:t}){const n=o.reactive(C.useIdle(e.timeout,e));return()=>{if(t.default)return t.default(n)}}});function rt(e,t,n){const{immediate:a=!0,delay:l=0,onError:r=S.noop,onSuccess:i=S.noop,resetOnExecute:s=!0,shallow:c=!0,throwError:f}=n??{},u=c?o.shallowRef(t):o.ref(t),d=o.shallowRef(!1),p=o.shallowRef(!1),U=o.shallowRef(void 0);async function g(m=0,...w){s&&(u.value=t),U.value=void 0,d.value=!1,p.value=!0,m>0&&await S.promiseTimeout(m);const R=typeof e=="function"?e(...w):e;try{const E=await R;u.value=E,d.value=!0,i(E)}catch(E){if(U.value=E,r(E),f)throw E}finally{p.value=!1}return u.value}a&&g(l);const b={state:u,isReady:d,isLoading:p,error:U,execute:g};function h(){return new Promise((m,w)=>{S.until(p).toBe(!1).then(()=>m(b)).catch(w)})}return{...b,then(m,w){return h().then(m,w)}}}async function it(e){return new Promise((t,n)=>{const a=new Image,{src:l,srcset:r,sizes:i,class:s,loading:c,crossorigin:f,referrerPolicy:u,width:d,height:p,decoding:U,fetchPriority:g,ismap:b,usemap:h}=e;a.src=l,r!=null&&(a.srcset=r),i!=null&&(a.sizes=i),s!=null&&(a.className=s),c!=null&&(a.loading=c),f!=null&&(a.crossOrigin=f),u!=null&&(a.referrerPolicy=u),d!=null&&(a.width=d),p!=null&&(a.height=p),U!=null&&(a.decoding=U),g!=null&&(a.fetchPriority=g),b!=null&&(a.isMap=b),h!=null&&(a.useMap=h),a.onload=()=>t(a),a.onerror=n})}function ut(e,t={}){const n=rt(()=>it(o.toValue(e)),void 0,{resetOnExecute:!0,...t});return o.watch(()=>o.toValue(e),()=>n.execute(t.delay),{deep:!0}),n}const ct=o.defineComponent({name:"UseImage",props:["src","srcset","sizes","as","alt","class","loading","crossorigin","referrerPolicy","width","height","decoding","fetchPriority","ismap","usemap"],setup(e,{slots:t}){const n=o.reactive(ut(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)}});function j(e){return typeof Window<"u"&&e instanceof Window?e.document.documentElement:typeof Document<"u"&&e instanceof Document?e.documentElement:e}const se=1;function $(e,t={}){const{throttle:n=0,idle:a=200,onStop:l=S.noop,onScroll:r=S.noop,offset:i={left:0,right:0,top:0,bottom:0},eventListenerOptions:s={capture:!1,passive:!0},behavior:c="auto",window:f=A,onError:u=v=>{console.error(v)}}=t,d=o.shallowRef(0),p=o.shallowRef(0),U=o.computed({get(){return d.value},set(v){b(v,void 0)}}),g=o.computed({get(){return p.value},set(v){b(void 0,v)}});function b(v,k){var _,I,O,M;if(!f)return;const P=o.toValue(e);if(!P)return;(O=P instanceof Document?f.document.body:P)==null||O.scrollTo({top:(_=o.toValue(k))!=null?_:g.value,left:(I=o.toValue(v))!=null?I:U.value,behavior:o.toValue(c)});const z=((M=P?.document)==null?void 0:M.documentElement)||P?.documentElement||P;U!=null&&(d.value=z.scrollLeft),g!=null&&(p.value=z.scrollTop)}const h=o.shallowRef(!1),m=o.reactive({left:!0,right:!1,top:!0,bottom:!1}),w=o.reactive({left:!1,right:!1,top:!1,bottom:!1}),R=v=>{h.value&&(h.value=!1,w.left=!1,w.right=!1,w.top=!1,w.bottom=!1,l(v))},E=S.useDebounceFn(R,n+a),V=v=>{var k;if(!f)return;const _=((k=v?.document)==null?void 0:k.documentElement)||v?.documentElement||T(v),{display:I,flexDirection:O,direction:M}=getComputedStyle(_),P=M==="rtl"?-1:1,z=_.scrollLeft;w.left=z<d.value,w.right=z>d.value;const me=Math.abs(z*P)<=(i.left||0),pe=Math.abs(z*P)+_.clientWidth>=_.scrollWidth-(i.right||0)-se;I==="flex"&&O==="row-reverse"?(m.left=pe,m.right=me):(m.left=me,m.right=pe),d.value=z;let W=_.scrollTop;v===f.document&&!W&&(W=f.document.body.scrollTop),w.top=W<p.value,w.bottom=W>p.value;const he=Math.abs(W)<=(i.top||0),ve=Math.abs(W)+_.clientHeight>=_.scrollHeight-(i.bottom||0)-se;I==="flex"&&O==="column-reverse"?(m.top=ve,m.bottom=he):(m.top=he,m.bottom=ve),p.value=W},L=v=>{var k;if(!f)return;const _=(k=v.target.documentElement)!=null?k:v.target;V(_),h.value=!0,E(v),r(v)};return D(e,"scroll",n?S.useThrottleFn(L,n,!0,!1):L,s),S.tryOnMounted(()=>{try{const v=o.toValue(e);if(!v)return;V(v)}catch(v){u(v)}}),D(e,"scrollend",R,s),{x:U,y:g,isScrolling:h,arrivedState:m,directions:w,measure(){const v=o.toValue(e);f&&v&&V(v)}}}function re(e,t,n={}){var a;const{direction:l="bottom",interval:r=100,canLoadMore:i=()=>!0}=n,s=o.reactive($(e,{...n,offset:{[l]:(a=n.distance)!=null?a:0,...n.offset}})),c=o.ref(),f=o.computed(()=>!!c.value),u=o.computed(()=>j(o.toValue(e))),d=J(u);function p(){if(s.measure(),!u.value||!d.value||!i(u.value))return;const{scrollHeight:g,clientHeight:b,scrollWidth:h,clientWidth:m}=u.value,w=l==="bottom"||l==="top"?g<=b:h<=m;(s.arrivedState[l]||w)&&(c.value||(c.value=Promise.all([t(s),new Promise(R=>setTimeout(R,r))]).finally(()=>{c.value=null,o.nextTick(()=>p())})))}const U=o.watch(()=>[s.arrivedState[l],d.value],p,{immediate:!0});return S.tryOnUnmounted(U),{isLoading:f,reset(){o.nextTick(()=>p())}}}const ft={mounted(e,t){typeof t.value=="function"?re(e,t.value):re(e,...t.value)}},dt={mounted(e,t){typeof t.value=="function"?G(e,t.value):G(e,...t.value)}},mt=o.defineComponent({name:"UseMouse",props:["touch","resetOnTouchEnds","initialValue"],setup(e,{slots:t}){const n=o.reactive(C.useMouse(e));return()=>{if(t.default)return t.default(n)}}}),pt=o.defineComponent({name:"UseMouseElement",props:["handleOutside","as"],setup(e,{slots:t}){const n=o.ref(),a=o.reactive(C.useMouseInElement(n,e));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(a))}}}),ht={page:e=>[e.pageX,e.pageY],client:e=>[e.clientX,e.clientY],screen:e=>[e.screenX,e.screenY],movement:e=>e instanceof MouseEvent?[e.movementX,e.movementY]:null};function vt(e={}){const{type:t="page",touch:n=!0,resetOnTouchEnds:a=!1,initialValue:l={x:0,y:0},window:r=A,target:i=r,scroll:s=!0,eventFilter:c}=e;let f=null,u=0,d=0;const p=o.shallowRef(l.x),U=o.shallowRef(l.y),g=o.shallowRef(null),b=typeof t=="function"?t:ht[t],h=v=>{const k=b(v);f=v,k&&([p.value,U.value]=k,g.value="mouse"),r&&(u=r.scrollX,d=r.scrollY)},m=v=>{if(v.touches.length>0){const k=b(v.touches[0]);k&&([p.value,U.value]=k,g.value="touch")}},w=()=>{if(!f||!r)return;const v=b(f);f instanceof MouseEvent&&v&&(p.value=v[0]+r.scrollX-u,U.value=v[1]+r.scrollY-d)},R=()=>{p.value=l.x,U.value=l.y},E=c?v=>c(()=>h(v),{}):v=>h(v),V=c?v=>c(()=>m(v),{}):v=>m(v),L=c?()=>c(()=>w(),{}):()=>w();if(i){const v={passive:!0};D(i,["mousemove","dragover"],E,v),n&&t!=="movement"&&(D(i,["touchstart","touchmove"],V,v),a&&D(i,"touchend",R,v)),s&&t==="page"&&D(r,"scroll",L,v)}return{x:p,y:U,sourceType:g}}function gt(e,t={}){const{handleOutside:n=!0,window:a=A}=t,l=t.type||"page",{x:r,y:i,sourceType:s}=vt(t),c=o.shallowRef(e??a?.document.body),f=o.shallowRef(0),u=o.shallowRef(0),d=o.shallowRef(0),p=o.shallowRef(0),U=o.shallowRef(0),g=o.shallowRef(0),b=o.shallowRef(!0);let h=()=>{};return a&&(h=o.watch([c,r,i],()=>{const m=T(c);if(!m||!(m instanceof Element))return;const{left:w,top:R,width:E,height:V}=m.getBoundingClientRect();d.value=w+(l==="page"?a.pageXOffset:0),p.value=R+(l==="page"?a.pageYOffset:0),U.value=V,g.value=E;const L=r.value-d.value,v=i.value-p.value;b.value=E===0||V===0||L<0||v<0||L>E||v>V,(n||!b.value)&&(f.value=L,u.value=v)},{immediate:!0}),D(document,"mouseleave",()=>b.value=!0,{passive:!0})),{x:r,y:i,sourceType:s,elementX:f,elementY:u,elementPositionX:d,elementPositionY:p,elementHeight:U,elementWidth:g,isOutside:b,stop:h}}const yt={mounted(e,t){const[n,a]=typeof t.value=="function"?[t.value,{}]:t.value,l=S.reactiveOmit(o.reactive(gt(e,a)),"stop");o.watch(l,r=>n(r))}},wt=o.defineComponent({name:"UseMousePressed",props:["touch","initialValue","as"],setup(e,{slots:t}){const n=o.ref(),a=o.reactive(C.useMousePressed({...e,target:n}));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(a))}}}),Ut=o.defineComponent({name:"UseNetwork",setup(e,{slots:t}){const n=o.reactive(C.useNetwork());return()=>{if(t.default)return t.default(n)}}}),St=o.defineComponent({name:"UseNow",props:["interval"],setup(e,{slots:t}){const n=o.reactive(C.useNow({...e,controls:!0}));return()=>{if(t.default)return t.default(n)}}}),bt=o.defineComponent({name:"UseObjectUrl",props:["object"],setup(e,{slots:t}){const n=S.toRef(e,"object"),a=C.useObjectUrl(n);return()=>{if(t.default&&a.value)return t.default(a)}}}),Ct=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 a=o.reactive(C.useOffsetPagination({...e,onPageChange(...l){var r;(r=e.onPageChange)==null||r.call(e,...l),n("page-change",...l)},onPageSizeChange(...l){var r;(r=e.onPageSizeChange)==null||r.call(e,...l),n("page-size-change",...l)},onPageCountChange(...l){var r;(r=e.onPageCountChange)==null||r.call(e,...l),n("page-count-change",...l)}}));return()=>{if(t.default)return t.default(a)}}}),Et=o.defineComponent({name:"UseOnline",setup(e,{slots:t}){const n=o.reactive({isOnline:C.useOnline()});return()=>{if(t.default)return t.default(n)}}}),Ot=o.defineComponent({name:"UsePageLeave",setup(e,{slots:t}){const n=o.reactive({isLeft:C.usePageLeave()});return()=>{if(t.default)return t.default(n)}}}),Rt=o.defineComponent({name:"UsePointer",props:["pointerTypes","initialValue","target"],setup(e,{slots:t}){const n=o.shallowRef(null),a=o.reactive(C.usePointer({...e,target:e.target==="self"?n:A}));return()=>{if(t.default)return t.default(a,{ref:n})}}}),Pt=o.defineComponent({name:"UsePointerLock",props:["as"],setup(e,{slots:t}){const n=o.ref(),a=o.reactive(C.usePointerLock(n));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(a))}}}),Vt=o.defineComponent({name:"UsePreferredColorScheme",setup(e,{slots:t}){const n=o.reactive({colorScheme:C.usePreferredColorScheme()});return()=>{if(t.default)return t.default(n)}}}),Mt=o.defineComponent({name:"UsePreferredContrast",setup(e,{slots:t}){const n=o.reactive({contrast:C.usePreferredContrast()});return()=>{if(t.default)return t.default(n)}}}),Dt=o.defineComponent({name:"UsePreferredDark",setup(e,{slots:t}){const n=o.reactive({prefersDark:C.usePreferredDark()});return()=>{if(t.default)return t.default(n)}}}),_t=o.defineComponent({name:"UsePreferredLanguages",setup(e,{slots:t}){const n=o.reactive({languages:C.usePreferredLanguages()});return()=>{if(t.default)return t.default(n)}}}),Tt=o.defineComponent({name:"UsePreferredReducedMotion",setup(e,{slots:t}){const n=o.reactive({motion:C.usePreferredReducedMotion()});return()=>{if(t.default)return t.default(n)}}}),kt=o.defineComponent({name:"UsePreferredReducedTransparency",setup(e,{slots:t}){const n=o.reactive({transparency:C.usePreferredReducedTransparency()});return()=>{if(t.default)return t.default(n)}}}),Lt={mounted(e,t){typeof t.value=="function"?F(e,t.value):F(e,...t.value)}};function Y(e,t,n={}){const{window:a=A,initialValue:l,observe:r=!1}=n,i=o.shallowRef(l),s=o.computed(()=>{var f;return T(t)||((f=a?.document)==null?void 0:f.documentElement)});function c(){var f;const u=o.toValue(e),d=o.toValue(s);if(d&&a&&u){const p=(f=a.getComputedStyle(d).getPropertyValue(u))==null?void 0:f.trim();i.value=p||i.value||l}}return r&&K(s,c,{attributeFilter:["style","class"],window:a}),o.watch([s,()=>o.toValue(e)],(f,u)=>{u[0]&&u[1]&&u[0].style.removeProperty(u[1]),c()},{immediate:!0}),o.watch([i,s],([f,u])=>{const d=o.toValue(e);u?.style&&d&&(f==null?u.style.removeProperty(d):u.style.setProperty(d,f))},{immediate:!0}),i}const ie="--vueuse-safe-area-top",ue="--vueuse-safe-area-right",ce="--vueuse-safe-area-bottom",fe="--vueuse-safe-area-left";function At(){const e=o.shallowRef(""),t=o.shallowRef(""),n=o.shallowRef(""),a=o.shallowRef("");if(S.isClient){const r=Y(ie),i=Y(ue),s=Y(ce),c=Y(fe);r.value="env(safe-area-inset-top, 0px)",i.value="env(safe-area-inset-right, 0px)",s.value="env(safe-area-inset-bottom, 0px)",c.value="env(safe-area-inset-left, 0px)",l(),D("resize",S.useDebounceFn(l),{passive:!0})}function l(){e.value=x(ie),t.value=x(ue),n.value=x(ce),a.value=x(fe)}return{top:e,right:t,bottom:n,left:a,update:l}}function x(e){return getComputedStyle(document.documentElement).getPropertyValue(e)}const It=o.defineComponent({name:"UseScreenSafeArea",props:{top:Boolean,right:Boolean,bottom:Boolean,left:Boolean},setup(e,{slots:t}){const{top:n,right:a,bottom:l,left:r}=At();return()=>{if(t.default)return o.h("div",{style:{paddingTop:e.top?n.value:"",paddingRight:e.right?a.value:"",paddingBottom:e.bottom?l.value:"",paddingLeft:e.left?r.value:"",boxSizing:"border-box",maxHeight:"100vh",maxWidth:"100vw",overflow:"auto"}},t.default())}}}),zt={mounted(e,t){if(typeof t.value=="function"){const n=t.value,a=$(e,{onScroll(){n(a)},onStop(){n(a)}})}else{const[n,a]=t.value,l=$(e,{...a,onScroll(r){var i;(i=a.onScroll)==null||i.call(a,r),n(l)},onStop(r){var i;(i=a.onStop)==null||i.call(a,r),n(l)}})}}};function de(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:de(n)}}function Wt(e){const t=e||window.event,n=t.target;return de(n)?!1:t.touches.length>1?!0:(t.preventDefault&&t.preventDefault(),!1)}const q=new WeakMap;function Bt(e,t=!1){const n=o.shallowRef(t);let a=null,l="";o.watch(S.toRef(e),s=>{const c=j(o.toValue(s));if(c){const f=c;if(q.get(f)||q.set(f,f.style.overflow),f.style.overflow!=="hidden"&&(l=f.style.overflow),f.style.overflow==="hidden")return n.value=!0;if(n.value)return f.style.overflow="hidden"}},{immediate:!0});const r=()=>{const s=j(o.toValue(e));!s||n.value||(S.isIOS&&(a=D(s,"touchmove",c=>{Wt(c)},{passive:!1})),s.style.overflow="hidden",n.value=!0)},i=()=>{const s=j(o.toValue(e));!s||!n.value||(S.isIOS&&a?.(),s.style.overflow=l,q.delete(s),n.value=!1)};return S.tryOnScopeDispose(i),o.computed({get(){return n.value},set(s){s?r():i()}})}function Ht(){let e=!1;const t=o.shallowRef(!1);return(n,a)=>{if(t.value=a.value,e)return;e=!0;const l=Bt(n,a.value);o.watch(t,r=>l.value=r)}}const Nt=Ht(),Ft=o.defineComponent({name:"UseTimeAgo",props:["time","updateInterval","max","fullDateFormatter","messages","showSecond"],setup(e,{slots:t}){const n=o.reactive(C.useTimeAgo(()=>e.time,{...e,controls:!0}));return()=>{if(t.default)return t.default(n)}}}),jt=o.defineComponent({name:"UseTimestamp",props:["immediate","interval","offset"],setup(e,{slots:t}){const n=o.reactive(C.useTimestamp({...e,controls:!0}));return()=>{if(t.default)return t.default(n)}}}),Yt=o.defineComponent({name:"UseVirtualList",props:["list","options","height"],setup(e,{slots:t,expose:n}){const{list:a}=o.toRefs(e),{list:l,containerProps:r,wrapperProps:i,scrollTo:s}=C.useVirtualList(a,e.options);return n({scrollTo:s}),r.style&&typeof r.style=="object"&&!Array.isArray(r.style)&&(r.style.height=e.height||"300px"),()=>o.h("div",{...r},[o.h("div",{...i.value},l.value.map(c=>o.h("div",{style:{overflow:"hidden",height:c.height}},t.default?t.default(c):"Please set content!")))])}}),xt=o.defineComponent({name:"UseWindowFocus",setup(e,{slots:t}){const n=o.reactive({focused:C.useWindowFocus()});return()=>{if(t.default)return t.default(n)}}}),Xt=o.defineComponent({name:"UseWindowSize",props:["initialWidth","initialHeight"],setup(e,{slots:t}){const n=o.reactive(C.useWindowSize(e));return()=>{if(t.default)return t.default(n)}}});y.OnClickOutside=ge,y.OnLongPress=be,y.UseActiveElement=Ce,y.UseBattery=Ee,y.UseBrowserLocation=Oe,y.UseClipboard=Re,y.UseColorMode=Be,y.UseDark=He,y.UseDeviceMotion=Ne,y.UseDeviceOrientation=Fe,y.UseDevicePixelRatio=je,y.UseDevicesList=Ye,y.UseDocumentVisibility=xe,y.UseDraggable=Xe,y.UseElementBounding=Ke,y.UseElementSize=Qe,y.UseElementVisibility=tt,y.UseEyeDropper=ot,y.UseFullscreen=at,y.UseGeolocation=lt,y.UseIdle=st,y.UseImage=ct,y.UseMouse=mt,y.UseMouseInElement=pt,y.UseMousePressed=wt,y.UseNetwork=Ut,y.UseNow=St,y.UseObjectUrl=bt,y.UseOffsetPagination=Ct,y.UseOnline=Et,y.UsePageLeave=Ot,y.UsePointer=Rt,y.UsePointerLock=Pt,y.UsePreferredColorScheme=Vt,y.UsePreferredContrast=Mt,y.UsePreferredDark=Dt,y.UsePreferredLanguages=_t,y.UsePreferredReducedMotion=Tt,y.UsePreferredReducedTransparency=kt,y.UseScreenSafeArea=It,y.UseTimeAgo=Ft,y.UseTimestamp=jt,y.UseVirtualList=Yt,y.UseWindowFocus=xt,y.UseWindowSize=Xt,y.VOnClickOutside=ee,y.VOnLongPress=ne,y.vElementBounding=Je,y.vElementHover=qe,y.vElementSize=et,y.vElementVisibility=nt,y.vInfiniteScroll=ft,y.vIntersectionObserver=dt,y.vMouseInElement=yt,y.vOnClickOutside=ee,y.vOnKeyStroke=we,y.vOnLongPress=ne,y.vResizeObserver=Lt,y.vScroll=zt,y.vScrollLock=Nt})(this.VueUse=this.VueUse||{},VueUse,Vue,VueUse);
1
+ (function(y,C,o,S){"use strict";const ge=o.defineComponent({name:"OnClickOutside",props:["as","options"],emits:["trigger"],setup(e,{slots:t,emit:n}){const a=o.shallowRef();return C.onClickOutside(a,s=>{n("trigger",s)},e.options),()=>{if(t.default)return o.h(e.as||"div",{ref:a},t.default())}}}),L=S.isClient?window:void 0;function V(e){var t;const n=o.toValue(e);return(t=n?.$el)!=null?t:n}function M(...e){const t=[],n=()=>{t.forEach(r=>r()),t.length=0},a=(r,c,f,u)=>(r.addEventListener(c,f,u),()=>r.removeEventListener(c,f,u)),s=o.computed(()=>{const r=S.toArray(o.toValue(e[0])).filter(c=>c!=null);return r.every(c=>typeof c!="string")?r:void 0}),l=S.watchImmediate(()=>{var r,c;return[(c=(r=s.value)==null?void 0:r.map(f=>V(f)))!=null?c:[L].filter(f=>f!=null),S.toArray(o.toValue(s.value?e[1]:e[0])),S.toArray(o.unref(s.value?e[2]:e[1])),o.toValue(s.value?e[3]:e[2])]},([r,c,f,u])=>{if(n(),!r?.length||!c?.length||!f?.length)return;const d=S.isObject(u)?{...u}:u;t.push(...r.flatMap(p=>c.flatMap(U=>f.map(g=>a(p,U,g,d)))))},{flush:"post"}),i=()=>{l(),n()};return S.tryOnScopeDispose(n),i}let ee=!1;function te(e,t,n={}){const{window:a=L,ignore:s=[],capture:l=!0,detectIframe:i=!1,controls:r=!1}=n;if(!a)return r?{stop:S.noop,cancel:S.noop,trigger:S.noop}:S.noop;if(S.isIOS&&!ee){ee=!0;const h={passive:!0};Array.from(a.document.body.children).forEach(m=>m.addEventListener("click",S.noop,h)),a.document.documentElement.addEventListener("click",S.noop,h)}let c=!0;const f=h=>o.toValue(s).some(m=>{if(typeof m=="string")return Array.from(a.document.querySelectorAll(m)).some(w=>w===h.target||h.composedPath().includes(w));{const w=V(m);return w&&(h.target===w||h.composedPath().includes(w))}});function u(h){const m=o.toValue(h);return m&&m.$.subTree.shapeFlag===16}function d(h,m){const w=o.toValue(h),R=w.$.subTree&&w.$.subTree.children;return R==null||!Array.isArray(R)?!1:R.some(O=>O.el===m.target||m.composedPath().includes(O.el))}const p=h=>{const m=V(e);if(h.target!=null&&!(!(m instanceof Element)&&u(e)&&d(e,h))&&!(!m||m===h.target||h.composedPath().includes(m))){if("detail"in h&&h.detail===0&&(c=!f(h)),!c){c=!0;return}t(h)}};let U=!1;const g=[M(a,"click",h=>{U||(U=!0,setTimeout(()=>{U=!1},0),p(h))},{passive:!0,capture:l}),M(a,"pointerdown",h=>{const m=V(e);c=!f(h)&&!!(m&&!h.composedPath().includes(m))},{passive:!0}),i&&M(a,"blur",h=>{setTimeout(()=>{var m;const w=V(e);((m=a.document.activeElement)==null?void 0:m.tagName)==="IFRAME"&&!w?.contains(a.document.activeElement)&&t(h)},0)},{passive:!0})].filter(Boolean),b=()=>g.forEach(h=>h());return r?{stop:b,cancel:()=>{c=!1},trigger:h=>{c=!0,p(h),c=!1}}:b}const ne={mounted(e,t){const n=!t.modifiers.bubble;if(typeof t.value=="function")e.__onClickOutside_stop=te(e,t.value,{capture:n});else{const[a,s]=t.value;e.__onClickOutside_stop=te(e,a,Object.assign({capture:n},s))}},unmounted(e){e.__onClickOutside_stop()}};function ye(e){return typeof e=="function"?e:typeof e=="string"?t=>t.key===e:Array.isArray(e)?t=>e.includes(t.key):()=>!0}function oe(...e){let t,n,a={};e.length===3?(t=e[0],n=e[1],a=e[2]):e.length===2?typeof e[1]=="object"?(t=!0,n=e[0],a=e[1]):(t=e[0],n=e[1]):(t=!0,n=e[0]);const{target:s=L,eventName:l="keydown",passive:i=!1,dedupe:r=!1}=a,c=ye(t);return M(s,l,u=>{u.repeat&&o.toValue(r)||c(u)&&n(u)},i)}const we={mounted(e,t){var n,a;const s=(a=(n=t.arg)==null?void 0:n.split(","))!=null?a:!0;if(typeof t.value=="function")oe(s,t.value,{target:e});else{const[l,i]=t.value;oe(s,l,{target:e,...i})}}},Ue=500,Se=10;function G(e,t,n){var a,s;const l=o.computed(()=>V(e));let i,r,c,f=!1;function u(){i&&(clearTimeout(i),i=void 0),r=void 0,c=void 0,f=!1}function d(m){var w,R,O;const[P,_,v]=[c,r,f];if(u(),!n?.onMouseUp||!_||!P||(w=n?.modifiers)!=null&&w.self&&m.target!==l.value)return;(R=n?.modifiers)!=null&&R.prevent&&m.preventDefault(),(O=n?.modifiers)!=null&&O.stop&&m.stopPropagation();const D=m.x-_.x,T=m.y-_.y,z=Math.sqrt(D*D+T*T);n.onMouseUp(m.timeStamp-P,z,v)}function p(m){var w,R,O,P;(w=n?.modifiers)!=null&&w.self&&m.target!==l.value||(u(),(R=n?.modifiers)!=null&&R.prevent&&m.preventDefault(),(O=n?.modifiers)!=null&&O.stop&&m.stopPropagation(),r={x:m.x,y:m.y},c=m.timeStamp,i=setTimeout(()=>{f=!0,t(m)},(P=n?.delay)!=null?P:Ue))}function U(m){var w,R,O,P;if((w=n?.modifiers)!=null&&w.self&&m.target!==l.value||!r||n?.distanceThreshold===!1)return;(R=n?.modifiers)!=null&&R.prevent&&m.preventDefault(),(O=n?.modifiers)!=null&&O.stop&&m.stopPropagation();const _=m.x-r.x,v=m.y-r.y;Math.sqrt(_*_+v*v)>=((P=n?.distanceThreshold)!=null?P:Se)&&u()}const g={capture:(a=n?.modifiers)==null?void 0:a.capture,once:(s=n?.modifiers)==null?void 0:s.once},b=[M(l,"pointerdown",p,g),M(l,"pointermove",U,g),M(l,["pointerup","pointerleave"],d,g)];return()=>b.forEach(m=>m())}const be=o.defineComponent({name:"OnLongPress",props:["as","options"],emits:["trigger"],setup(e,{slots:t,emit:n}){const a=o.shallowRef();return G(a,s=>{n("trigger",s)},e.options),()=>{if(t.default)return o.h(e.as||"div",{ref:a},t.default())}}}),ae={mounted(e,t){typeof t.value=="function"?G(e,t.value,{modifiers:t.modifiers}):G(e,...t.value)}},Ce=o.defineComponent({name:"UseActiveElement",setup(e,{slots:t}){const n=o.reactive({element:C.useActiveElement()});return()=>{if(t.default)return t.default(n)}}}),Ee=o.defineComponent({name:"UseBattery",setup(e,{slots:t}){const n=o.reactive(C.useBattery(e));return()=>{if(t.default)return t.default(n)}}}),Oe=o.defineComponent({name:"UseBrowserLocation",setup(e,{slots:t}){const n=o.reactive(C.useBrowserLocation());return()=>{if(t.default)return t.default(n)}}}),Re=o.defineComponent({name:"UseClipboard",props:["source","read","navigator","copiedDuring","legacy"],setup(e,{slots:t}){const n=o.reactive(C.useClipboard(e));return()=>{var a;return(a=t.default)==null?void 0:a.call(t,n)}}}),N=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},F="__vueuse_ssr_handlers__",Pe=Ve();function Ve(){return F in N||(N[F]=N[F]||{}),N[F]}function se(e,t){return Pe[e]||t}const Me=Symbol("vueuse-ssr-width");function De(){const e=o.hasInjectionContext()?S.injectLocal(Me,null):null;return typeof e=="number"?e:void 0}function _e(){const e=o.shallowRef(!1),t=o.getCurrentInstance();return t&&o.onMounted(()=>{e.value=!0},t),e}function j(e){const t=_e();return o.computed(()=>(t.value,!!e()))}function Te(e,t={}){const{window:n=L,ssrWidth:a=De()}=t,s=j(()=>n&&"matchMedia"in n&&typeof n.matchMedia=="function"),l=o.shallowRef(typeof a=="number"),i=o.shallowRef(),r=o.shallowRef(!1),c=f=>{r.value=f.matches};return o.watchEffect(()=>{if(l.value){l.value=!s.value;const f=o.toValue(e).split(",");r.value=f.some(u=>{const d=u.includes("not all"),p=u.match(/\(\s*min-width:\s*(-?\d+(?:\.\d*)?[a-z]+\s*)\)/),U=u.match(/\(\s*max-width:\s*(-?\d+(?:\.\d*)?[a-z]+\s*)\)/);let g=!!(p||U);return p&&g&&(g=a>=S.pxValue(p[1])),U&&g&&(g=a<=S.pxValue(U[1])),d?!g:g});return}s.value&&(i.value=n.matchMedia(o.toValue(e)),r.value=i.value.matches)}),M(i,"change",c,{passive:!0}),o.computed(()=>r.value)}function Le(e){return Te("(prefers-color-scheme: dark)",e)}function ke(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 Ae={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()}},le="vueuse-storage";function Ie(e,t,n,a={}){var s;const{flush:l="pre",deep:i=!0,listenToStorageChanges:r=!0,writeDefaults:c=!0,mergeDefaults:f=!1,shallow:u,window:d=L,eventFilter:p,onError:U=E=>{console.error(E)},initOnMounted:g}=a,b=(u?o.shallowRef:o.ref)(typeof t=="function"?t():t),h=o.computed(()=>o.toValue(e));if(!n)try{n=se("getDefaultStorage",()=>{var E;return(E=L)==null?void 0:E.localStorage})()}catch(E){U(E)}if(!n)return b;const m=o.toValue(t),w=ke(m),R=(s=a.serializer)!=null?s:Ae[w],{pause:O,resume:P}=S.pausableWatch(b,()=>z(b.value),{flush:l,deep:i,eventFilter:p});o.watch(h,()=>I(),{flush:l});let _=!1;const v=E=>{g&&!_||I(E)},D=E=>{g&&!_||k(E)};d&&r&&(n instanceof Storage?M(d,"storage",v,{passive:!0}):M(d,le,D)),g?S.tryOnMounted(()=>{_=!0,I()}):I();function T(E,A){if(d){const W={key:h.value,oldValue:E,newValue:A,storageArea:n};d.dispatchEvent(n instanceof Storage?new StorageEvent("storage",W):new CustomEvent(le,{detail:W}))}}function z(E){try{const A=n.getItem(h.value);if(E==null)T(A,null),n.removeItem(h.value);else{const W=R.write(E);A!==W&&(n.setItem(h.value,W),T(A,W))}}catch(A){U(A)}}function B(E){const A=E?E.newValue:n.getItem(h.value);if(A==null)return c&&m!=null&&n.setItem(h.value,R.write(m)),m;if(!E&&f){const W=R.read(A);return typeof f=="function"?f(W,m):w==="object"&&!Array.isArray(W)?{...m,...W}:W}else return typeof A!="string"?A:R.read(A)}function I(E){if(!(E&&E.storageArea!==n)){if(E&&E.key==null){b.value=m;return}if(!(E&&E.key!==h.value)){O();try{E?.newValue!==R.write(b.value)&&(b.value=B(E))}catch(A){U(A)}finally{E?o.nextTick(P):P()}}}}function k(E){I(E.detail)}return b}const ze="*,*::before,*::after{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}";function We(e={}){const{selector:t="html",attribute:n="class",initialValue:a="auto",window:s=L,storage:l,storageKey:i="vueuse-color-scheme",listenToStorageChanges:r=!0,storageRef:c,emitAuto:f,disableTransition:u=!0}=e,d={auto:"",light:"light",dark:"dark",...e.modes||{}},p=Le({window:s}),U=o.computed(()=>p.value?"dark":"light"),g=c||(i==null?S.toRef(a):Ie(i,a,l,{window:s,listenToStorageChanges:r})),b=o.computed(()=>g.value==="auto"?U.value:g.value),h=se("updateHTMLAttrs",(O,P,_)=>{const v=typeof O=="string"?s?.document.querySelector(O):V(O);if(!v)return;const D=new Set,T=new Set;let z=null;if(P==="class"){const I=_.split(/\s/g);Object.values(d).flatMap(k=>(k||"").split(/\s/g)).filter(Boolean).forEach(k=>{I.includes(k)?D.add(k):T.add(k)})}else z={key:P,value:_};if(D.size===0&&T.size===0&&z===null)return;let B;u&&(B=s.document.createElement("style"),B.appendChild(document.createTextNode(ze)),s.document.head.appendChild(B));for(const I of D)v.classList.add(I);for(const I of T)v.classList.remove(I);z&&v.setAttribute(z.key,z.value),u&&(s.getComputedStyle(B).opacity,document.head.removeChild(B))});function m(O){var P;h(t,n,(P=d[O])!=null?P:O)}function w(O){e.onChanged?e.onChanged(O,m):m(O)}o.watch(b,w,{flush:"post",immediate:!0}),S.tryOnMounted(()=>w(b.value));const R=o.computed({get(){return f?g.value:b.value},set(O){g.value=O}});return Object.assign(R,{store:g,system:U,state:b})}const Be=o.defineComponent({name:"UseColorMode",props:["selector","attribute","modes","onChanged","storageKey","storage","emitAuto"],setup(e,{slots:t}){const n=We(e),a=o.reactive({mode:n,system:n.system,store:n.store});return()=>{if(t.default)return t.default(a)}}}),He=o.defineComponent({name:"UseDark",props:["selector","attribute","valueDark","valueLight","onChanged","storageKey","storage"],setup(e,{slots:t}){const n=C.useDark(e),a=o.reactive({isDark:n,toggleDark:S.useToggle(n)});return()=>{if(t.default)return t.default(a)}}}),Ne=o.defineComponent({name:"UseDeviceMotion",setup(e,{slots:t}){const n=C.useDeviceMotion();return()=>{if(t.default)return t.default(n)}}}),Fe=o.defineComponent({name:"UseDeviceOrientation",setup(e,{slots:t}){const n=o.reactive(C.useDeviceOrientation());return()=>{if(t.default)return t.default(n)}}}),je=o.defineComponent({name:"UseDevicePixelRatio",setup(e,{slots:t}){const n=o.reactive({pixelRatio:C.useDevicePixelRatio()});return()=>{if(t.default)return t.default(n)}}}),Ye=o.defineComponent({name:"UseDevicesList",props:["onUpdated","requestPermissions","constraints"],setup(e,{slots:t}){const n=o.reactive(C.useDevicesList(e));return()=>{if(t.default)return t.default(n)}}}),xe=o.defineComponent({name:"UseDocumentVisibility",setup(e,{slots:t}){const n=o.reactive({visibility:C.useDocumentVisibility()});return()=>{if(t.default)return t.default(n)}}}),Xe=o.defineComponent({name:"UseDraggable",props:["storageKey","storageType","initialValue","exact","preventDefault","stopPropagation","pointerTypes","as","handle","axis","onStart","onMove","onEnd","disabled","buttons","containerElement"],setup(e,{slots:t}){const n=o.shallowRef(),a=o.computed(()=>{var u;return(u=e.handle)!=null?u:n.value}),s=o.computed(()=>{var u;return(u=e.containerElement)!=null?u:void 0}),l=o.computed(()=>!!e.disabled),i=e.storageKey&&C.useStorage(e.storageKey,o.toValue(e.initialValue)||{x:0,y:0},C.isClient?e.storageType==="session"?sessionStorage:localStorage:void 0),r=i||e.initialValue||{x:0,y:0},c=(u,d)=>{var p;(p=e.onEnd)==null||p.call(e,u,d),i&&(i.value.x=u.x,i.value.y=u.y)},f=o.reactive(C.useDraggable(n,{...e,handle:a,initialValue:r,onEnd:c,disabled:l,containerElement:s}));return()=>{if(t.default)return o.h(e.as||"div",{ref:n,style:`touch-action:none;${f.style}`},t.default(f))}}}),Ke=o.defineComponent({name:"UseElementBounding",props:["box","as"],setup(e,{slots:t}){const n=o.shallowRef(),a=o.reactive(C.useElementBounding(n));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(a))}}});function J(e,t,n={}){const{window:a=L,...s}=n;let l;const i=j(()=>a&&"MutationObserver"in a),r=()=>{l&&(l.disconnect(),l=void 0)},c=o.computed(()=>{const p=o.toValue(e),U=S.toArray(p).map(V).filter(S.notNullish);return new Set(U)}),f=o.watch(()=>c.value,p=>{r(),i.value&&p.size&&(l=new MutationObserver(t),p.forEach(U=>l.observe(U,s)))},{immediate:!0,flush:"post"}),u=()=>l?.takeRecords(),d=()=>{f(),r()};return S.tryOnScopeDispose(d),{isSupported:i,stop:d,takeRecords:u}}function Y(e,t,n={}){const{window:a=L,...s}=n;let l;const i=j(()=>a&&"ResizeObserver"in a),r=()=>{l&&(l.disconnect(),l=void 0)},c=o.computed(()=>{const d=o.toValue(e);return Array.isArray(d)?d.map(p=>V(p)):[V(d)]}),f=o.watch(c,d=>{if(r(),i.value&&a){l=new ResizeObserver(t);for(const p of d)p&&l.observe(p,s)}},{immediate:!0,flush:"post"}),u=()=>{r(),f()};return S.tryOnScopeDispose(u),{isSupported:i,stop:u}}function Ge(e,t={}){const{reset:n=!0,windowResize:a=!0,windowScroll:s=!0,immediate:l=!0,updateTiming:i="sync"}=t,r=o.shallowRef(0),c=o.shallowRef(0),f=o.shallowRef(0),u=o.shallowRef(0),d=o.shallowRef(0),p=o.shallowRef(0),U=o.shallowRef(0),g=o.shallowRef(0);function b(){const m=V(e);if(!m){n&&(r.value=0,c.value=0,f.value=0,u.value=0,d.value=0,p.value=0,U.value=0,g.value=0);return}const w=m.getBoundingClientRect();r.value=w.height,c.value=w.bottom,f.value=w.left,u.value=w.right,d.value=w.top,p.value=w.width,U.value=w.x,g.value=w.y}function h(){i==="sync"?b():i==="next-frame"&&requestAnimationFrame(()=>b())}return Y(e,h),o.watch(()=>V(e),m=>!m&&h()),J(e,h,{attributeFilter:["style","class"]}),s&&M("scroll",h,{capture:!0,passive:!0}),a&&M("resize",h,{passive:!0}),S.tryOnMounted(()=>{l&&h()}),{height:r,bottom:c,left:f,right:u,top:d,width:p,x:U,y:g,update:h}}const Je={mounted(e,t){const[n,a]=typeof t.value=="function"?[t.value,{}]:t.value,{height:s,bottom:l,left:i,right:r,top:c,width:f,x:u,y:d}=Ge(e,a);o.watch([s,l,i,r,c,f,u,d],()=>n({height:s,bottom:l,left:i,right:r,top:c,width:f,x:u,y:d}))}};function $e(e,t,n={}){const{window:a=L,document:s=a?.document,flush:l="sync"}=n;if(!a||!s)return S.noop;let i;const r=u=>{i?.(),i=u},c=o.watchEffect(()=>{const u=V(e);if(u){const{stop:d}=J(s,p=>{p.map(g=>[...g.removedNodes]).flat().some(g=>g===u||g.contains(u))&&t(p)},{window:a,childList:!0,subtree:!0});r(d)}},{flush:l}),f=()=>{c(),r()};return S.tryOnScopeDispose(f),f}function re(e,t={}){const{delayEnter:n=0,delayLeave:a=0,triggerOnRemoval:s=!1,window:l=L}=t,i=o.shallowRef(!1);let r;const c=f=>{const u=f?n:a;r&&(clearTimeout(r),r=void 0),u?r=setTimeout(()=>i.value=f,u):i.value=f};return l&&(M(e,"mouseenter",()=>c(!0),{passive:!0}),M(e,"mouseleave",()=>c(!1),{passive:!0}),s&&$e(o.computed(()=>V(e)),()=>c(!1))),i}const qe={mounted(e,t){const n=t.value;if(typeof n=="function"){const a=re(e);o.watch(a,s=>n(s))}else{const[a,s]=n,l=re(e,s);o.watch(l,i=>a(i))}}},Qe=o.defineComponent({name:"UseElementSize",props:["width","height","box","as"],setup(e,{slots:t}){var n,a;const s=o.ref(),l=o.reactive(C.useElementSize(s,{width:(n=e.width)!=null?n:0,height:(a=e.height)!=null?a:0},{box:e.box}));return()=>{if(t.default)return o.h(e.as||"div",{ref:s},t.default(l))}}});function Ze(e,t={width:0,height:0},n={}){const{window:a=L,box:s="content-box"}=n,l=o.computed(()=>{var d,p;return(p=(d=V(e))==null?void 0:d.namespaceURI)==null?void 0:p.includes("svg")}),i=o.shallowRef(t.width),r=o.shallowRef(t.height),{stop:c}=Y(e,([d])=>{const p=s==="border-box"?d.borderBoxSize:s==="content-box"?d.contentBoxSize:d.devicePixelContentBoxSize;if(a&&l.value){const U=V(e);if(U){const g=U.getBoundingClientRect();i.value=g.width,r.value=g.height}}else if(p){const U=S.toArray(p);i.value=U.reduce((g,{inlineSize:b})=>g+b,0),r.value=U.reduce((g,{blockSize:b})=>g+b,0)}else i.value=d.contentRect.width,r.value=d.contentRect.height},n);S.tryOnMounted(()=>{const d=V(e);d&&(i.value="offsetWidth"in d?d.offsetWidth:t.width,r.value="offsetHeight"in d?d.offsetHeight:t.height)});const f=o.watch(()=>V(e),d=>{i.value=d?t.width:0,r.value=d?t.height:0});function u(){c(),f()}return{width:i,height:r,stop:u}}const et={mounted(e,t){var n;const a=typeof t.value=="function"?t.value:(n=t.value)==null?void 0:n[0],s=typeof t.value=="function"?[]:t.value.slice(1),{width:l,height:i}=Ze(e,...s);o.watch([l,i],([r,c])=>a({width:r,height:c}))}},tt=o.defineComponent({name:"UseElementVisibility",props:["as"],setup(e,{slots:t}){const n=o.ref(),a=o.reactive({isVisible:C.useElementVisibility(n)});return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(a))}}});function $(e,t,n={}){const{root:a,rootMargin:s="0px",threshold:l=0,window:i=L,immediate:r=!0}=n,c=j(()=>i&&"IntersectionObserver"in i),f=o.computed(()=>{const g=o.toValue(e);return S.toArray(g).map(V).filter(S.notNullish)});let u=S.noop;const d=o.shallowRef(r),p=c.value?o.watch(()=>[f.value,V(a),d.value],([g,b])=>{if(u(),!d.value||!g.length)return;const h=new IntersectionObserver(t,{root:V(b),rootMargin:s,threshold:l});g.forEach(m=>m&&h.observe(m)),u=()=>{h.disconnect(),u=S.noop}},{immediate:r,flush:"post"}):S.noop,U=()=>{u(),p(),d.value=!1};return S.tryOnScopeDispose(U),{isSupported:c,isActive:d,pause(){u(),d.value=!1},resume(){d.value=!0},stop:U}}function q(e,t={}){const{window:n=L,scrollTarget:a,threshold:s=0,rootMargin:l,once:i=!1}=t,r=o.shallowRef(!1),{stop:c}=$(e,f=>{let u=r.value,d=0;for(const p of f)p.time>=d&&(d=p.time,u=p.isIntersecting);r.value=u,i&&S.watchOnce(r,()=>{c()})},{root:a,window:n,threshold:s,rootMargin:o.toValue(l)});return r}const nt={mounted(e,t){if(typeof t.value=="function"){const n=t.value,a=q(e);o.watch(a,s=>n(s),{immediate:!0})}else{const[n,a]=t.value,s=q(e,a);o.watch(s,l=>n(l),{immediate:!0})}}},ot=o.defineComponent({name:"UseEyeDropper",props:{sRGBHex:String},setup(e,{slots:t}){const n=o.reactive(C.useEyeDropper());return()=>{if(t.default)return t.default(n)}}}),at=o.defineComponent({name:"UseFullscreen",props:["as"],setup(e,{slots:t}){const n=o.ref(),a=o.reactive(C.useFullscreen(n));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(a))}}}),st=o.defineComponent({name:"UseGeolocation",props:["enableHighAccuracy","maximumAge","timeout","navigator"],setup(e,{slots:t}){const n=o.reactive(C.useGeolocation(e));return()=>{if(t.default)return t.default(n)}}}),lt=o.defineComponent({name:"UseIdle",props:["timeout","events","listenForVisibilityChange","initialState"],setup(e,{slots:t}){const n=o.reactive(C.useIdle(e.timeout,e));return()=>{if(t.default)return t.default(n)}}});function rt(e,t,n){const{immediate:a=!0,delay:s=0,onError:l=S.noop,onSuccess:i=S.noop,resetOnExecute:r=!0,shallow:c=!0,throwError:f}=n??{},u=c?o.shallowRef(t):o.ref(t),d=o.shallowRef(!1),p=o.shallowRef(!1),U=o.shallowRef(void 0);async function g(m=0,...w){r&&(u.value=t),U.value=void 0,d.value=!1,p.value=!0,m>0&&await S.promiseTimeout(m);const R=typeof e=="function"?e(...w):e;try{const O=await R;u.value=O,d.value=!0,i(O)}catch(O){if(U.value=O,l(O),f)throw O}finally{p.value=!1}return u.value}a&&g(s);const b={state:u,isReady:d,isLoading:p,error:U,execute:g};function h(){return new Promise((m,w)=>{S.until(p).toBe(!1).then(()=>m(b)).catch(w)})}return{...b,then(m,w){return h().then(m,w)}}}async function it(e){return new Promise((t,n)=>{const a=new Image,{src:s,srcset:l,sizes:i,class:r,loading:c,crossorigin:f,referrerPolicy:u,width:d,height:p,decoding:U,fetchPriority:g,ismap:b,usemap:h}=e;a.src=s,l!=null&&(a.srcset=l),i!=null&&(a.sizes=i),r!=null&&(a.className=r),c!=null&&(a.loading=c),f!=null&&(a.crossOrigin=f),u!=null&&(a.referrerPolicy=u),d!=null&&(a.width=d),p!=null&&(a.height=p),U!=null&&(a.decoding=U),g!=null&&(a.fetchPriority=g),b!=null&&(a.isMap=b),h!=null&&(a.useMap=h),a.onload=()=>t(a),a.onerror=n})}function ut(e,t={}){const n=rt(()=>it(o.toValue(e)),void 0,{resetOnExecute:!0,...t});return o.watch(()=>o.toValue(e),()=>n.execute(t.delay),{deep:!0}),n}const ct=o.defineComponent({name:"UseImage",props:["src","srcset","sizes","as","alt","class","loading","crossorigin","referrerPolicy","width","height","decoding","fetchPriority","ismap","usemap"],setup(e,{slots:t}){const n=o.reactive(ut(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)}});function x(e){return typeof Window<"u"&&e instanceof Window?e.document.documentElement:typeof Document<"u"&&e instanceof Document?e.documentElement:e}const ie=1;function Q(e,t={}){const{throttle:n=0,idle:a=200,onStop:s=S.noop,onScroll:l=S.noop,offset:i={left:0,right:0,top:0,bottom:0},eventListenerOptions:r={capture:!1,passive:!0},behavior:c="auto",window:f=L,onError:u=v=>{console.error(v)}}=t,d=o.shallowRef(0),p=o.shallowRef(0),U=o.computed({get(){return d.value},set(v){b(v,void 0)}}),g=o.computed({get(){return p.value},set(v){b(void 0,v)}});function b(v,D){var T,z,B,I;if(!f)return;const k=o.toValue(e);if(!k)return;(B=k instanceof Document?f.document.body:k)==null||B.scrollTo({top:(T=o.toValue(D))!=null?T:g.value,left:(z=o.toValue(v))!=null?z:U.value,behavior:o.toValue(c)});const E=((I=k?.document)==null?void 0:I.documentElement)||k?.documentElement||k;U!=null&&(d.value=E.scrollLeft),g!=null&&(p.value=E.scrollTop)}const h=o.shallowRef(!1),m=o.reactive({left:!0,right:!1,top:!0,bottom:!1}),w=o.reactive({left:!1,right:!1,top:!1,bottom:!1}),R=v=>{h.value&&(h.value=!1,w.left=!1,w.right=!1,w.top=!1,w.bottom=!1,s(v))},O=S.useDebounceFn(R,n+a),P=v=>{var D;if(!f)return;const T=((D=v?.document)==null?void 0:D.documentElement)||v?.documentElement||V(v),{display:z,flexDirection:B,direction:I}=getComputedStyle(T),k=I==="rtl"?-1:1,E=T.scrollLeft;w.left=E<d.value,w.right=E>d.value;const A=Math.abs(E*k)<=(i.left||0),W=Math.abs(E*k)+T.clientWidth>=T.scrollWidth-(i.right||0)-ie;z==="flex"&&B==="row-reverse"?(m.left=W,m.right=A):(m.left=A,m.right=W),d.value=E;let H=T.scrollTop;v===f.document&&!H&&(H=f.document.body.scrollTop),w.top=H<p.value,w.bottom=H>p.value;const he=Math.abs(H)<=(i.top||0),ve=Math.abs(H)+T.clientHeight>=T.scrollHeight-(i.bottom||0)-ie;z==="flex"&&B==="column-reverse"?(m.top=ve,m.bottom=he):(m.top=he,m.bottom=ve),p.value=H},_=v=>{var D;if(!f)return;const T=(D=v.target.documentElement)!=null?D:v.target;P(T),h.value=!0,O(v),l(v)};return M(e,"scroll",n?S.useThrottleFn(_,n,!0,!1):_,r),S.tryOnMounted(()=>{try{const v=o.toValue(e);if(!v)return;P(v)}catch(v){u(v)}}),M(e,"scrollend",R,r),{x:U,y:g,isScrolling:h,arrivedState:m,directions:w,measure(){const v=o.toValue(e);f&&v&&P(v)}}}function ue(e,t,n={}){var a;const{direction:s="bottom",interval:l=100,canLoadMore:i=()=>!0}=n,r=o.reactive(Q(e,{...n,offset:{[s]:(a=n.distance)!=null?a:0,...n.offset}})),c=o.ref(),f=o.computed(()=>!!c.value),u=o.computed(()=>x(o.toValue(e))),d=q(u);function p(){if(r.measure(),!u.value||!d.value||!i(u.value))return;const{scrollHeight:g,clientHeight:b,scrollWidth:h,clientWidth:m}=u.value,w=s==="bottom"||s==="top"?g<=b:h<=m;(r.arrivedState[s]||w)&&(c.value||(c.value=Promise.all([t(r),new Promise(R=>setTimeout(R,l))]).finally(()=>{c.value=null,o.nextTick(()=>p())})))}const U=o.watch(()=>[r.arrivedState[s],d.value],p,{immediate:!0});return S.tryOnUnmounted(U),{isLoading:f,reset(){o.nextTick(()=>p())}}}const ft={mounted(e,t){typeof t.value=="function"?ue(e,t.value):ue(e,...t.value)}},dt={mounted(e,t){typeof t.value=="function"?$(e,t.value):$(e,...t.value)}},mt=o.defineComponent({name:"UseMouse",props:["touch","resetOnTouchEnds","initialValue"],setup(e,{slots:t}){const n=o.reactive(C.useMouse(e));return()=>{if(t.default)return t.default(n)}}}),pt=o.defineComponent({name:"UseMouseElement",props:["handleOutside","as"],setup(e,{slots:t}){const n=o.ref(),a=o.reactive(C.useMouseInElement(n,e));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(a))}}}),ht={page:e=>[e.pageX,e.pageY],client:e=>[e.clientX,e.clientY],screen:e=>[e.screenX,e.screenY],movement:e=>e instanceof MouseEvent?[e.movementX,e.movementY]:null};function vt(e={}){const{type:t="page",touch:n=!0,resetOnTouchEnds:a=!1,initialValue:s={x:0,y:0},window:l=L,target:i=l,scroll:r=!0,eventFilter:c}=e;let f=null,u=0,d=0;const p=o.shallowRef(s.x),U=o.shallowRef(s.y),g=o.shallowRef(null),b=typeof t=="function"?t:ht[t],h=v=>{const D=b(v);f=v,D&&([p.value,U.value]=D,g.value="mouse"),l&&(u=l.scrollX,d=l.scrollY)},m=v=>{if(v.touches.length>0){const D=b(v.touches[0]);D&&([p.value,U.value]=D,g.value="touch")}},w=()=>{if(!f||!l)return;const v=b(f);f instanceof MouseEvent&&v&&(p.value=v[0]+l.scrollX-u,U.value=v[1]+l.scrollY-d)},R=()=>{p.value=s.x,U.value=s.y},O=c?v=>c(()=>h(v),{}):v=>h(v),P=c?v=>c(()=>m(v),{}):v=>m(v),_=c?()=>c(()=>w(),{}):()=>w();if(i){const v={passive:!0};M(i,["mousemove","dragover"],O,v),n&&t!=="movement"&&(M(i,["touchstart","touchmove"],P,v),a&&M(i,"touchend",R,v)),r&&t==="page"&&M(l,"scroll",_,v)}return{x:p,y:U,sourceType:g}}function gt(e,t={}){const{handleOutside:n=!0,window:a=L}=t,s=t.type||"page",{x:l,y:i,sourceType:r}=vt(t),c=o.shallowRef(e??a?.document.body),f=o.shallowRef(0),u=o.shallowRef(0),d=o.shallowRef(0),p=o.shallowRef(0),U=o.shallowRef(0),g=o.shallowRef(0),b=o.shallowRef(!0);let h=()=>{};return a&&(h=o.watch([c,l,i],()=>{const m=V(c);if(!m||!(m instanceof Element))return;const{left:w,top:R,width:O,height:P}=m.getBoundingClientRect();d.value=w+(s==="page"?a.pageXOffset:0),p.value=R+(s==="page"?a.pageYOffset:0),U.value=P,g.value=O;const _=l.value-d.value,v=i.value-p.value;b.value=O===0||P===0||_<0||v<0||_>O||v>P,(n||!b.value)&&(f.value=_,u.value=v)},{immediate:!0}),M(document,"mouseleave",()=>b.value=!0,{passive:!0})),{x:l,y:i,sourceType:r,elementX:f,elementY:u,elementPositionX:d,elementPositionY:p,elementHeight:U,elementWidth:g,isOutside:b,stop:h}}const yt={mounted(e,t){const[n,a]=typeof t.value=="function"?[t.value,{}]:t.value,s=S.reactiveOmit(o.reactive(gt(e,a)),"stop");o.watch(s,l=>n(l))}},wt=o.defineComponent({name:"UseMousePressed",props:["touch","initialValue","as"],setup(e,{slots:t}){const n=o.ref(),a=o.reactive(C.useMousePressed({...e,target:n}));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(a))}}}),Ut=o.defineComponent({name:"UseNetwork",setup(e,{slots:t}){const n=o.reactive(C.useNetwork());return()=>{if(t.default)return t.default(n)}}}),St=o.defineComponent({name:"UseNow",props:["interval"],setup(e,{slots:t}){const n=o.reactive(C.useNow({...e,controls:!0}));return()=>{if(t.default)return t.default(n)}}}),bt=o.defineComponent({name:"UseObjectUrl",props:["object"],setup(e,{slots:t}){const n=S.toRef(e,"object"),a=C.useObjectUrl(n);return()=>{if(t.default&&a.value)return t.default(a)}}}),Ct=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 a=o.reactive(C.useOffsetPagination({...e,onPageChange(...s){var l;(l=e.onPageChange)==null||l.call(e,...s),n("page-change",...s)},onPageSizeChange(...s){var l;(l=e.onPageSizeChange)==null||l.call(e,...s),n("page-size-change",...s)},onPageCountChange(...s){var l;(l=e.onPageCountChange)==null||l.call(e,...s),n("page-count-change",...s)}}));return()=>{if(t.default)return t.default(a)}}}),Et=o.defineComponent({name:"UseOnline",setup(e,{slots:t}){const n=o.reactive({isOnline:C.useOnline()});return()=>{if(t.default)return t.default(n)}}}),Ot=o.defineComponent({name:"UsePageLeave",setup(e,{slots:t}){const n=o.reactive({isLeft:C.usePageLeave()});return()=>{if(t.default)return t.default(n)}}}),Rt=o.defineComponent({name:"UsePointer",props:["pointerTypes","initialValue","target"],setup(e,{slots:t}){const n=o.shallowRef(null),a=o.reactive(C.usePointer({...e,target:e.target==="self"?n:L}));return()=>{if(t.default)return t.default(a,{ref:n})}}}),Pt=o.defineComponent({name:"UsePointerLock",props:["as"],setup(e,{slots:t}){const n=o.ref(),a=o.reactive(C.usePointerLock(n));return()=>{if(t.default)return o.h(e.as||"div",{ref:n},t.default(a))}}}),Vt=o.defineComponent({name:"UsePreferredColorScheme",setup(e,{slots:t}){const n=o.reactive({colorScheme:C.usePreferredColorScheme()});return()=>{if(t.default)return t.default(n)}}}),Mt=o.defineComponent({name:"UsePreferredContrast",setup(e,{slots:t}){const n=o.reactive({contrast:C.usePreferredContrast()});return()=>{if(t.default)return t.default(n)}}}),Dt=o.defineComponent({name:"UsePreferredDark",setup(e,{slots:t}){const n=o.reactive({prefersDark:C.usePreferredDark()});return()=>{if(t.default)return t.default(n)}}}),_t=o.defineComponent({name:"UsePreferredLanguages",setup(e,{slots:t}){const n=o.reactive({languages:C.usePreferredLanguages()});return()=>{if(t.default)return t.default(n)}}}),Tt=o.defineComponent({name:"UsePreferredReducedMotion",setup(e,{slots:t}){const n=o.reactive({motion:C.usePreferredReducedMotion()});return()=>{if(t.default)return t.default(n)}}}),Lt=o.defineComponent({name:"UsePreferredReducedTransparency",setup(e,{slots:t}){const n=o.reactive({transparency:C.usePreferredReducedTransparency()});return()=>{if(t.default)return t.default(n)}}}),kt={mounted(e,t){typeof t.value=="function"?Y(e,t.value):Y(e,...t.value)}};function X(e,t,n={}){const{window:a=L,initialValue:s,observe:l=!1}=n,i=o.shallowRef(s),r=o.computed(()=>{var f;return V(t)||((f=a?.document)==null?void 0:f.documentElement)});function c(){var f;const u=o.toValue(e),d=o.toValue(r);if(d&&a&&u){const p=(f=a.getComputedStyle(d).getPropertyValue(u))==null?void 0:f.trim();i.value=p||i.value||s}}return l&&J(r,c,{attributeFilter:["style","class"],window:a}),o.watch([r,()=>o.toValue(e)],(f,u)=>{u[0]&&u[1]&&u[0].style.removeProperty(u[1]),c()},{immediate:!0}),o.watch([i,r],([f,u])=>{const d=o.toValue(e);u?.style&&d&&(f==null?u.style.removeProperty(d):u.style.setProperty(d,f))},{immediate:!0}),i}const ce="--vueuse-safe-area-top",fe="--vueuse-safe-area-right",de="--vueuse-safe-area-bottom",me="--vueuse-safe-area-left";function At(){const e=o.shallowRef(""),t=o.shallowRef(""),n=o.shallowRef(""),a=o.shallowRef("");if(S.isClient){const l=X(ce),i=X(fe),r=X(de),c=X(me);l.value="env(safe-area-inset-top, 0px)",i.value="env(safe-area-inset-right, 0px)",r.value="env(safe-area-inset-bottom, 0px)",c.value="env(safe-area-inset-left, 0px)",s(),M("resize",S.useDebounceFn(s),{passive:!0})}function s(){e.value=K(ce),t.value=K(fe),n.value=K(de),a.value=K(me)}return{top:e,right:t,bottom:n,left:a,update:s}}function K(e){return getComputedStyle(document.documentElement).getPropertyValue(e)}const It=o.defineComponent({name:"UseScreenSafeArea",props:{top:Boolean,right:Boolean,bottom:Boolean,left:Boolean},setup(e,{slots:t}){const{top:n,right:a,bottom:s,left:l}=At();return()=>{if(t.default)return o.h("div",{style:{paddingTop:e.top?n.value:"",paddingRight:e.right?a.value:"",paddingBottom:e.bottom?s.value:"",paddingLeft:e.left?l.value:"",boxSizing:"border-box",maxHeight:"100vh",maxWidth:"100vw",overflow:"auto"}},t.default())}}}),zt={mounted(e,t){if(typeof t.value=="function"){const n=t.value,a=Q(e,{onScroll(){n(a)},onStop(){n(a)}})}else{const[n,a]=t.value,s=Q(e,{...a,onScroll(l){var i;(i=a.onScroll)==null||i.call(a,l),n(s)},onStop(l){var i;(i=a.onStop)==null||i.call(a,l),n(s)}})}}};function pe(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:pe(n)}}function Wt(e){const t=e||window.event,n=t.target;return pe(n)?!1:t.touches.length>1?!0:(t.preventDefault&&t.preventDefault(),!1)}const Z=new WeakMap;function Bt(e,t=!1){const n=o.shallowRef(t);let a=null,s="";o.watch(S.toRef(e),r=>{const c=x(o.toValue(r));if(c){const f=c;if(Z.get(f)||Z.set(f,f.style.overflow),f.style.overflow!=="hidden"&&(s=f.style.overflow),f.style.overflow==="hidden")return n.value=!0;if(n.value)return f.style.overflow="hidden"}},{immediate:!0});const l=()=>{const r=x(o.toValue(e));!r||n.value||(S.isIOS&&(a=M(r,"touchmove",c=>{Wt(c)},{passive:!1})),r.style.overflow="hidden",n.value=!0)},i=()=>{const r=x(o.toValue(e));!r||!n.value||(S.isIOS&&a?.(),r.style.overflow=s,Z.delete(r),n.value=!1)};return S.tryOnScopeDispose(i),o.computed({get(){return n.value},set(r){r?l():i()}})}function Ht(){let e=!1;const t=o.shallowRef(!1);return(n,a)=>{if(t.value=a.value,e)return;e=!0;const s=Bt(n,a.value);o.watch(t,l=>s.value=l)}}const Nt=Ht(),Ft=o.defineComponent({name:"UseTimeAgo",props:["time","updateInterval","max","fullDateFormatter","messages","showSecond"],setup(e,{slots:t}){const n=o.reactive(C.useTimeAgo(()=>e.time,{...e,controls:!0}));return()=>{if(t.default)return t.default(n)}}}),jt=o.defineComponent({name:"UseTimestamp",props:["immediate","interval","offset"],setup(e,{slots:t}){const n=o.reactive(C.useTimestamp({...e,controls:!0}));return()=>{if(t.default)return t.default(n)}}}),Yt=o.defineComponent({name:"UseVirtualList",props:["list","options","height"],setup(e,{slots:t,expose:n}){const{list:a}=o.toRefs(e),{list:s,containerProps:l,wrapperProps:i,scrollTo:r}=C.useVirtualList(a,e.options);return n({scrollTo:r}),l.style&&typeof l.style=="object"&&!Array.isArray(l.style)&&(l.style.height=e.height||"300px"),()=>o.h("div",{...l},[o.h("div",{...i.value},s.value.map(c=>o.h("div",{style:{overflow:"hidden",height:c.height}},t.default?t.default(c):"Please set content!")))])}}),xt=o.defineComponent({name:"UseWindowFocus",setup(e,{slots:t}){const n=o.reactive({focused:C.useWindowFocus()});return()=>{if(t.default)return t.default(n)}}}),Xt=o.defineComponent({name:"UseWindowSize",props:["initialWidth","initialHeight"],setup(e,{slots:t}){const n=o.reactive(C.useWindowSize(e));return()=>{if(t.default)return t.default(n)}}});y.OnClickOutside=ge,y.OnLongPress=be,y.UseActiveElement=Ce,y.UseBattery=Ee,y.UseBrowserLocation=Oe,y.UseClipboard=Re,y.UseColorMode=Be,y.UseDark=He,y.UseDeviceMotion=Ne,y.UseDeviceOrientation=Fe,y.UseDevicePixelRatio=je,y.UseDevicesList=Ye,y.UseDocumentVisibility=xe,y.UseDraggable=Xe,y.UseElementBounding=Ke,y.UseElementSize=Qe,y.UseElementVisibility=tt,y.UseEyeDropper=ot,y.UseFullscreen=at,y.UseGeolocation=st,y.UseIdle=lt,y.UseImage=ct,y.UseMouse=mt,y.UseMouseInElement=pt,y.UseMousePressed=wt,y.UseNetwork=Ut,y.UseNow=St,y.UseObjectUrl=bt,y.UseOffsetPagination=Ct,y.UseOnline=Et,y.UsePageLeave=Ot,y.UsePointer=Rt,y.UsePointerLock=Pt,y.UsePreferredColorScheme=Vt,y.UsePreferredContrast=Mt,y.UsePreferredDark=Dt,y.UsePreferredLanguages=_t,y.UsePreferredReducedMotion=Tt,y.UsePreferredReducedTransparency=Lt,y.UseScreenSafeArea=It,y.UseTimeAgo=Ft,y.UseTimestamp=jt,y.UseVirtualList=Yt,y.UseWindowFocus=xt,y.UseWindowSize=Xt,y.VOnClickOutside=ne,y.VOnLongPress=ae,y.vElementBounding=Je,y.vElementHover=qe,y.vElementSize=et,y.vElementVisibility=nt,y.vInfiniteScroll=ft,y.vIntersectionObserver=dt,y.vMouseInElement=yt,y.vOnClickOutside=ne,y.vOnKeyStroke=we,y.vOnLongPress=ae,y.vResizeObserver=kt,y.vScroll=zt,y.vScrollLock=Nt})(this.VueUse=this.VueUse||{},VueUse,Vue,VueUse);
package/index.mjs CHANGED
@@ -2,7 +2,7 @@ import { onClickOutside as onClickOutside$1, useActiveElement, useBattery, useBr
2
2
  import { defineComponent, shallowRef, h, toValue, computed, unref, reactive, hasInjectionContext, getCurrentInstance, onMounted, watchEffect, ref, watch, nextTick, toRefs } from 'vue';
3
3
  import { isClient, toArray, watchImmediate, isObject, tryOnScopeDispose, noop, isIOS, injectLocal, pxValue, pausableWatch, tryOnMounted, toRef, useToggle, notNullish, watchOnce, promiseTimeout, until, useDebounceFn, useThrottleFn, tryOnUnmounted, reactiveOmit } from '@vueuse/shared';
4
4
 
5
- const OnClickOutside = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
5
+ const OnClickOutside = /* @__PURE__ */ defineComponent({
6
6
  name: "OnClickOutside",
7
7
  props: ["as", "options"],
8
8
  emits: ["trigger"],
@@ -83,8 +83,8 @@ function onClickOutside(target, handler, options = {}) {
83
83
  if (isIOS && !_iOSWorkaround) {
84
84
  _iOSWorkaround = true;
85
85
  const listenerOptions = { passive: true };
86
- Array.from(window.document.body.children).forEach((el) => useEventListener(el, "click", noop, listenerOptions));
87
- useEventListener(window.document.documentElement, "click", noop, listenerOptions);
86
+ Array.from(window.document.body.children).forEach((el) => el.addEventListener("click", noop, listenerOptions));
87
+ window.document.documentElement.addEventListener("click", noop, listenerOptions);
88
88
  }
89
89
  let shouldListen = true;
90
90
  const shouldIgnore = (event) => {
@@ -331,7 +331,7 @@ function onLongPress(target, handler, options) {
331
331
  return stop;
332
332
  }
333
333
 
334
- const OnLongPress = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
334
+ const OnLongPress = /* @__PURE__ */ defineComponent({
335
335
  name: "OnLongPress",
336
336
  props: ["as", "options"],
337
337
  emits: ["trigger"],
@@ -360,7 +360,7 @@ const vOnLongPress = {
360
360
  }
361
361
  };
362
362
 
363
- const UseActiveElement = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
363
+ const UseActiveElement = /* @__PURE__ */ defineComponent({
364
364
  name: "UseActiveElement",
365
365
  setup(props, { slots }) {
366
366
  const data = reactive({
@@ -373,7 +373,7 @@ const UseActiveElement = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
373
373
  }
374
374
  });
375
375
 
376
- const UseBattery = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
376
+ const UseBattery = /* @__PURE__ */ defineComponent({
377
377
  name: "UseBattery",
378
378
  setup(props, { slots }) {
379
379
  const data = reactive(useBattery(props));
@@ -384,7 +384,7 @@ const UseBattery = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
384
384
  }
385
385
  });
386
386
 
387
- const UseBrowserLocation = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
387
+ const UseBrowserLocation = /* @__PURE__ */ defineComponent({
388
388
  name: "UseBrowserLocation",
389
389
  setup(props, { slots }) {
390
390
  const data = reactive(useBrowserLocation());
@@ -395,7 +395,7 @@ const UseBrowserLocation = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
395
395
  }
396
396
  });
397
397
 
398
- const UseClipboard = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
398
+ const UseClipboard = /* @__PURE__ */ defineComponent({
399
399
  name: "UseClipboard",
400
400
  props: [
401
401
  "source",
@@ -569,18 +569,33 @@ function useStorage(key, defaults, storage, options = {}) {
569
569
  { flush, deep, eventFilter }
570
570
  );
571
571
  watch(keyComputed, () => update(), { flush });
572
+ let firstMounted = false;
573
+ const onStorageEvent = (ev) => {
574
+ if (initOnMounted && !firstMounted) {
575
+ return;
576
+ }
577
+ update(ev);
578
+ };
579
+ const onStorageCustomEvent = (ev) => {
580
+ if (initOnMounted && !firstMounted) {
581
+ return;
582
+ }
583
+ updateFromCustomEvent(ev);
584
+ };
572
585
  if (window && listenToStorageChanges) {
586
+ if (storage instanceof Storage)
587
+ useEventListener(window, "storage", onStorageEvent, { passive: true });
588
+ else
589
+ useEventListener(window, customStorageEventName, onStorageCustomEvent);
590
+ }
591
+ if (initOnMounted) {
573
592
  tryOnMounted(() => {
574
- if (storage instanceof Storage)
575
- useEventListener(window, "storage", update, { passive: true });
576
- else
577
- useEventListener(window, customStorageEventName, updateFromCustomEvent);
578
- if (initOnMounted)
579
- update();
593
+ firstMounted = true;
594
+ update();
580
595
  });
581
- }
582
- if (!initOnMounted)
596
+ } else {
583
597
  update();
598
+ }
584
599
  function dispatchWriteEvent(oldValue, newValue) {
585
600
  if (window) {
586
601
  const payload = {
@@ -748,7 +763,7 @@ function useColorMode(options = {}) {
748
763
  return Object.assign(auto, { store, system, state });
749
764
  }
750
765
 
751
- const UseColorMode = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
766
+ const UseColorMode = /* @__PURE__ */ defineComponent({
752
767
  name: "UseColorMode",
753
768
  props: ["selector", "attribute", "modes", "onChanged", "storageKey", "storage", "emitAuto"],
754
769
  setup(props, { slots }) {
@@ -765,7 +780,7 @@ const UseColorMode = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
765
780
  }
766
781
  });
767
782
 
768
- const UseDark = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
783
+ const UseDark = /* @__PURE__ */ defineComponent({
769
784
  name: "UseDark",
770
785
  props: ["selector", "attribute", "valueDark", "valueLight", "onChanged", "storageKey", "storage"],
771
786
  setup(props, { slots }) {
@@ -781,7 +796,7 @@ const UseDark = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
781
796
  }
782
797
  });
783
798
 
784
- const UseDeviceMotion = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
799
+ const UseDeviceMotion = /* @__PURE__ */ defineComponent({
785
800
  name: "UseDeviceMotion",
786
801
  setup(props, { slots }) {
787
802
  const data = useDeviceMotion();
@@ -792,7 +807,7 @@ const UseDeviceMotion = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
792
807
  }
793
808
  });
794
809
 
795
- const UseDeviceOrientation = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
810
+ const UseDeviceOrientation = /* @__PURE__ */ defineComponent({
796
811
  name: "UseDeviceOrientation",
797
812
  setup(props, { slots }) {
798
813
  const data = reactive(useDeviceOrientation());
@@ -803,7 +818,7 @@ const UseDeviceOrientation = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
803
818
  }
804
819
  });
805
820
 
806
- const UseDevicePixelRatio = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
821
+ const UseDevicePixelRatio = /* @__PURE__ */ defineComponent({
807
822
  name: "UseDevicePixelRatio",
808
823
  setup(props, { slots }) {
809
824
  const data = reactive({
@@ -816,7 +831,7 @@ const UseDevicePixelRatio = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
816
831
  }
817
832
  });
818
833
 
819
- const UseDevicesList = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
834
+ const UseDevicesList = /* @__PURE__ */ defineComponent({
820
835
  name: "UseDevicesList",
821
836
  props: ["onUpdated", "requestPermissions", "constraints"],
822
837
  setup(props, { slots }) {
@@ -828,7 +843,7 @@ const UseDevicesList = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
828
843
  }
829
844
  });
830
845
 
831
- const UseDocumentVisibility = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
846
+ const UseDocumentVisibility = /* @__PURE__ */ defineComponent({
832
847
  name: "UseDocumentVisibility",
833
848
  setup(props, { slots }) {
834
849
  const data = reactive({
@@ -841,7 +856,7 @@ const UseDocumentVisibility = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
841
856
  }
842
857
  });
843
858
 
844
- const UseDraggable = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
859
+ const UseDraggable = /* @__PURE__ */ defineComponent({
845
860
  name: "UseDraggable",
846
861
  props: [
847
862
  "storageKey",
@@ -901,7 +916,7 @@ const UseDraggable = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
901
916
  }
902
917
  });
903
918
 
904
- const UseElementBounding = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
919
+ const UseElementBounding = /* @__PURE__ */ defineComponent({
905
920
  name: "UseElementBounding",
906
921
  props: ["box", "as"],
907
922
  setup(props, { slots }) {
@@ -1172,12 +1187,13 @@ const vElementHover = {
1172
1187
  }
1173
1188
  };
1174
1189
 
1175
- const UseElementSize = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
1190
+ const UseElementSize = /* @__PURE__ */ defineComponent({
1176
1191
  name: "UseElementSize",
1177
1192
  props: ["width", "height", "box", "as"],
1178
1193
  setup(props, { slots }) {
1194
+ var _a, _b;
1179
1195
  const target = ref();
1180
- const data = reactive(useElementSize$1(target, { width: props.width, height: props.height }, { box: props.box }));
1196
+ const data = reactive(useElementSize$1(target, { width: (_a = props.width) != null ? _a : 0, height: (_b = props.height) != null ? _b : 0 }, { box: props.box }));
1181
1197
  return () => {
1182
1198
  if (slots.default)
1183
1199
  return h(props.as || "div", { ref: target }, slots.default(data));
@@ -1252,7 +1268,7 @@ const vElementSize = {
1252
1268
  }
1253
1269
  };
1254
1270
 
1255
- const UseElementVisibility = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
1271
+ const UseElementVisibility = /* @__PURE__ */ defineComponent({
1256
1272
  name: "UseElementVisibility",
1257
1273
  props: ["as"],
1258
1274
  setup(props, { slots }) {
@@ -1377,7 +1393,7 @@ const vElementVisibility = {
1377
1393
  }
1378
1394
  };
1379
1395
 
1380
- const UseEyeDropper = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
1396
+ const UseEyeDropper = /* @__PURE__ */ defineComponent({
1381
1397
  name: "UseEyeDropper",
1382
1398
  props: {
1383
1399
  sRGBHex: String
@@ -1391,7 +1407,7 @@ const UseEyeDropper = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
1391
1407
  }
1392
1408
  });
1393
1409
 
1394
- const UseFullscreen = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
1410
+ const UseFullscreen = /* @__PURE__ */ defineComponent({
1395
1411
  name: "UseFullscreen",
1396
1412
  props: ["as"],
1397
1413
  setup(props, { slots }) {
@@ -1404,7 +1420,7 @@ const UseFullscreen = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
1404
1420
  }
1405
1421
  });
1406
1422
 
1407
- const UseGeolocation = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
1423
+ const UseGeolocation = /* @__PURE__ */ defineComponent({
1408
1424
  name: "UseGeolocation",
1409
1425
  props: ["enableHighAccuracy", "maximumAge", "timeout", "navigator"],
1410
1426
  setup(props, { slots }) {
@@ -1416,7 +1432,7 @@ const UseGeolocation = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
1416
1432
  }
1417
1433
  });
1418
1434
 
1419
- const UseIdle = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
1435
+ const UseIdle = /* @__PURE__ */ defineComponent({
1420
1436
  name: "UseIdle",
1421
1437
  props: ["timeout", "events", "listenForVisibilityChange", "initialState"],
1422
1438
  setup(props, { slots }) {
@@ -1539,7 +1555,7 @@ function useImage(options, asyncStateOptions = {}) {
1539
1555
  return state;
1540
1556
  }
1541
1557
 
1542
- const UseImage = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
1558
+ const UseImage = /* @__PURE__ */ defineComponent({
1543
1559
  name: "UseImage",
1544
1560
  props: [
1545
1561
  "src",
@@ -1818,7 +1834,7 @@ const vIntersectionObserver = {
1818
1834
  }
1819
1835
  };
1820
1836
 
1821
- const UseMouse = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
1837
+ const UseMouse = /* @__PURE__ */ defineComponent({
1822
1838
  name: "UseMouse",
1823
1839
  props: ["touch", "resetOnTouchEnds", "initialValue"],
1824
1840
  setup(props, { slots }) {
@@ -1830,7 +1846,7 @@ const UseMouse = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
1830
1846
  }
1831
1847
  });
1832
1848
 
1833
- const UseMouseInElement = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
1849
+ const UseMouseInElement = /* @__PURE__ */ defineComponent({
1834
1850
  name: "UseMouseElement",
1835
1851
  props: ["handleOutside", "as"],
1836
1852
  setup(props, { slots }) {
@@ -1996,7 +2012,7 @@ const vMouseInElement = {
1996
2012
  }
1997
2013
  };
1998
2014
 
1999
- const UseMousePressed = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2015
+ const UseMousePressed = /* @__PURE__ */ defineComponent({
2000
2016
  name: "UseMousePressed",
2001
2017
  props: ["touch", "initialValue", "as"],
2002
2018
  setup(props, { slots }) {
@@ -2009,7 +2025,7 @@ const UseMousePressed = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2009
2025
  }
2010
2026
  });
2011
2027
 
2012
- const UseNetwork = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2028
+ const UseNetwork = /* @__PURE__ */ defineComponent({
2013
2029
  name: "UseNetwork",
2014
2030
  setup(props, { slots }) {
2015
2031
  const data = reactive(useNetwork());
@@ -2020,7 +2036,7 @@ const UseNetwork = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2020
2036
  }
2021
2037
  });
2022
2038
 
2023
- const UseNow = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2039
+ const UseNow = /* @__PURE__ */ defineComponent({
2024
2040
  name: "UseNow",
2025
2041
  props: ["interval"],
2026
2042
  setup(props, { slots }) {
@@ -2032,7 +2048,7 @@ const UseNow = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2032
2048
  }
2033
2049
  });
2034
2050
 
2035
- const UseObjectUrl = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2051
+ const UseObjectUrl = /* @__PURE__ */ defineComponent({
2036
2052
  name: "UseObjectUrl",
2037
2053
  props: [
2038
2054
  "object"
@@ -2047,7 +2063,7 @@ const UseObjectUrl = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2047
2063
  }
2048
2064
  });
2049
2065
 
2050
- const UseOffsetPagination = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2066
+ const UseOffsetPagination = /* @__PURE__ */ defineComponent({
2051
2067
  name: "UseOffsetPagination",
2052
2068
  props: [
2053
2069
  "total",
@@ -2088,7 +2104,7 @@ const UseOffsetPagination = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2088
2104
  }
2089
2105
  });
2090
2106
 
2091
- const UseOnline = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2107
+ const UseOnline = /* @__PURE__ */ defineComponent({
2092
2108
  name: "UseOnline",
2093
2109
  setup(props, { slots }) {
2094
2110
  const data = reactive({
@@ -2101,7 +2117,7 @@ const UseOnline = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2101
2117
  }
2102
2118
  });
2103
2119
 
2104
- const UsePageLeave = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2120
+ const UsePageLeave = /* @__PURE__ */ defineComponent({
2105
2121
  name: "UsePageLeave",
2106
2122
  setup(props, { slots }) {
2107
2123
  const data = reactive({
@@ -2114,7 +2130,7 @@ const UsePageLeave = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2114
2130
  }
2115
2131
  });
2116
2132
 
2117
- const UsePointer = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2133
+ const UsePointer = /* @__PURE__ */ defineComponent({
2118
2134
  name: "UsePointer",
2119
2135
  props: [
2120
2136
  "pointerTypes",
@@ -2147,7 +2163,7 @@ const UsePointerLock = /*@__PURE__*/ defineComponent({
2147
2163
  }
2148
2164
  });
2149
2165
 
2150
- const UsePreferredColorScheme = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2166
+ const UsePreferredColorScheme = /* @__PURE__ */ defineComponent({
2151
2167
  name: "UsePreferredColorScheme",
2152
2168
  setup(props, { slots }) {
2153
2169
  const data = reactive({
@@ -2160,7 +2176,7 @@ const UsePreferredColorScheme = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2160
2176
  }
2161
2177
  });
2162
2178
 
2163
- const UsePreferredContrast = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2179
+ const UsePreferredContrast = /* @__PURE__ */ defineComponent({
2164
2180
  name: "UsePreferredContrast",
2165
2181
  setup(props, { slots }) {
2166
2182
  const data = reactive({
@@ -2173,7 +2189,7 @@ const UsePreferredContrast = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2173
2189
  }
2174
2190
  });
2175
2191
 
2176
- const UsePreferredDark = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2192
+ const UsePreferredDark = /* @__PURE__ */ defineComponent({
2177
2193
  name: "UsePreferredDark",
2178
2194
  setup(props, { slots }) {
2179
2195
  const data = reactive({
@@ -2186,7 +2202,7 @@ const UsePreferredDark = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2186
2202
  }
2187
2203
  });
2188
2204
 
2189
- const UsePreferredLanguages = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2205
+ const UsePreferredLanguages = /* @__PURE__ */ defineComponent({
2190
2206
  name: "UsePreferredLanguages",
2191
2207
  setup(props, { slots }) {
2192
2208
  const data = reactive({
@@ -2199,7 +2215,7 @@ const UsePreferredLanguages = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2199
2215
  }
2200
2216
  });
2201
2217
 
2202
- const UsePreferredReducedMotion = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2218
+ const UsePreferredReducedMotion = /* @__PURE__ */ defineComponent({
2203
2219
  name: "UsePreferredReducedMotion",
2204
2220
  setup(props, { slots }) {
2205
2221
  const data = reactive({
@@ -2212,7 +2228,7 @@ const UsePreferredReducedMotion = /* @__PURE__ */ /*@__PURE__*/ defineComponent(
2212
2228
  }
2213
2229
  });
2214
2230
 
2215
- const UsePreferredReducedTransparency = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2231
+ const UsePreferredReducedTransparency = /* @__PURE__ */ defineComponent({
2216
2232
  name: "UsePreferredReducedTransparency",
2217
2233
  setup(props, { slots }) {
2218
2234
  const data = reactive({
@@ -2320,7 +2336,7 @@ function getValue(position) {
2320
2336
  return getComputedStyle(document.documentElement).getPropertyValue(position);
2321
2337
  }
2322
2338
 
2323
- const UseScreenSafeArea = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2339
+ const UseScreenSafeArea = /* @__PURE__ */ defineComponent({
2324
2340
  name: "UseScreenSafeArea",
2325
2341
  props: {
2326
2342
  top: Boolean,
@@ -2482,7 +2498,7 @@ function onScrollLock() {
2482
2498
  }
2483
2499
  const vScrollLock = onScrollLock();
2484
2500
 
2485
- const UseTimeAgo = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2501
+ const UseTimeAgo = /* @__PURE__ */ defineComponent({
2486
2502
  name: "UseTimeAgo",
2487
2503
  props: ["time", "updateInterval", "max", "fullDateFormatter", "messages", "showSecond"],
2488
2504
  setup(props, { slots }) {
@@ -2494,7 +2510,7 @@ const UseTimeAgo = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2494
2510
  }
2495
2511
  });
2496
2512
 
2497
- const UseTimestamp = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2513
+ const UseTimestamp = /* @__PURE__ */ defineComponent({
2498
2514
  name: "UseTimestamp",
2499
2515
  props: ["immediate", "interval", "offset"],
2500
2516
  setup(props, { slots }) {
@@ -2506,7 +2522,7 @@ const UseTimestamp = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2506
2522
  }
2507
2523
  });
2508
2524
 
2509
- const UseVirtualList = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2525
+ const UseVirtualList = /* @__PURE__ */ defineComponent({
2510
2526
  name: "UseVirtualList",
2511
2527
  props: [
2512
2528
  "list",
@@ -2525,7 +2541,7 @@ const UseVirtualList = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2525
2541
  }
2526
2542
  });
2527
2543
 
2528
- const UseWindowFocus = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2544
+ const UseWindowFocus = /* @__PURE__ */ defineComponent({
2529
2545
  name: "UseWindowFocus",
2530
2546
  setup(props, { slots }) {
2531
2547
  const data = reactive({
@@ -2538,7 +2554,7 @@ const UseWindowFocus = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2538
2554
  }
2539
2555
  });
2540
2556
 
2541
- const UseWindowSize = /* @__PURE__ */ /*@__PURE__*/ defineComponent({
2557
+ const UseWindowSize = /* @__PURE__ */ defineComponent({
2542
2558
  name: "UseWindowSize",
2543
2559
  props: ["initialWidth", "initialHeight"],
2544
2560
  setup(props, { slots }) {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@vueuse/components",
3
3
  "type": "module",
4
- "version": "13.1.0",
4
+ "version": "13.2.0",
5
5
  "description": "Renderless components for VueUse",
6
6
  "author": "Jacob Clevenger<https://github.com/wheatjs>",
7
7
  "license": "MIT",
@@ -38,8 +38,8 @@
38
38
  "vue": "^3.5.0"
39
39
  },
40
40
  "dependencies": {
41
- "@vueuse/shared": "13.1.0",
42
- "@vueuse/core": "13.1.0"
41
+ "@vueuse/core": "13.2.0",
42
+ "@vueuse/shared": "13.2.0"
43
43
  },
44
44
  "scripts": {
45
45
  "build": "rollup --config=rollup.config.ts --configPlugin=rollup-plugin-esbuild",