@stacksjs/composables 0.70.258 → 0.70.259

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.
Files changed (167) hide show
  1. package/dist/_shared.js +1 -23
  2. package/dist/cloneFnJSON.js +1 -3
  3. package/dist/computedAsync.js +1 -20
  4. package/dist/computedEager.js +1 -10
  5. package/dist/createEventHook.js +1 -15
  6. package/dist/createFetch.js +1 -8
  7. package/dist/createGlobalState.js +1 -10
  8. package/dist/createSharedComposable.js +1 -9
  9. package/dist/extendRef.js +1 -6
  10. package/dist/formatTimeAgo.js +1 -33
  11. package/dist/index.js +1 -210
  12. package/dist/isDefined.js +1 -3
  13. package/dist/makeDestructurable.js +1 -16
  14. package/dist/onClickOutside.js +1 -25
  15. package/dist/onKeyStroke.js +1 -31
  16. package/dist/onLongPress.js +1 -43
  17. package/dist/onStartTyping.js +1 -23
  18. package/dist/refAutoReset.js +1 -15
  19. package/dist/refDefault.js +1 -8
  20. package/dist/resolveRef.js +1 -7
  21. package/dist/ssrHandlers.js +1 -8
  22. package/dist/syncRef.js +1 -35
  23. package/dist/tryOnMounted.js +1 -22
  24. package/dist/unrefElement.js +1 -9
  25. package/dist/until.js +1 -62
  26. package/dist/useActiveElement.js +1 -19
  27. package/dist/useAnimate.js +1 -48
  28. package/dist/useArrayUtils.js +1 -114
  29. package/dist/useAsyncQueue.js +1 -22
  30. package/dist/useAsyncState.js +1 -35
  31. package/dist/useBase64.js +1 -45
  32. package/dist/useBattery.js +1 -38
  33. package/dist/useBreakpoints.js +1 -97
  34. package/dist/useBroadcastChannel.js +1 -31
  35. package/dist/useBrowserLocation.js +1 -64
  36. package/dist/useClipboard.js +1 -32
  37. package/dist/useClipboardItems.js +1 -15
  38. package/dist/useCloned.js +1 -16
  39. package/dist/useColorMode.js +1 -60
  40. package/dist/useConfirmDialog.js +1 -34
  41. package/dist/useCounter.js +1 -28
  42. package/dist/useCssVar.js +1 -23
  43. package/dist/useCycleList.js +1 -27
  44. package/dist/useDark.js +1 -38
  45. package/dist/useDateFormat.js +1 -11
  46. package/dist/useDebounce.js +1 -16
  47. package/dist/useDebounceFn.js +1 -18
  48. package/dist/useDebouncedRef.js +1 -22
  49. package/dist/useDebouncedRefHistory.js +1 -36
  50. package/dist/useDeviceMotion.js +1 -53
  51. package/dist/useDeviceOrientation.js +1 -23
  52. package/dist/useDevicePixelRatio.js +1 -24
  53. package/dist/useDocumentVisibility.js +1 -16
  54. package/dist/useDraggable.js +1 -58
  55. package/dist/useDropZone.js +1 -52
  56. package/dist/useElementBounding.js +1 -59
  57. package/dist/useElementByPoint.js +1 -18
  58. package/dist/useElementHover.js +1 -28
  59. package/dist/useElementSize.js +1 -34
  60. package/dist/useElementVisibility.js +1 -10
  61. package/dist/useEventBus.js +1 -41
  62. package/dist/useEventListener.js +1 -29
  63. package/dist/useEventSource.js +1 -72
  64. package/dist/useEyeDropper.js +1 -17
  65. package/dist/useFavicon.js +1 -22
  66. package/dist/useFetch.js +1 -61
  67. package/dist/useFileDialog.js +1 -24
  68. package/dist/useFocus.js +1 -42
  69. package/dist/useFocusWithin.js +1 -29
  70. package/dist/useForm.js +1 -182
  71. package/dist/useFps.js +1 -22
  72. package/dist/useFullscreen.js +1 -67
  73. package/dist/useGeolocation.js +1 -55
  74. package/dist/useIdle.js +1 -46
  75. package/dist/useImage.js +1 -32
  76. package/dist/useInfiniteScroll.js +1 -50
  77. package/dist/useIntersectionObserver.js +1 -27
  78. package/dist/useInterval.js +1 -32
  79. package/dist/useIntervalFn.js +1 -24
  80. package/dist/useKeyModifier.js +1 -22
  81. package/dist/useLastChanged.js +1 -8
  82. package/dist/useLocalStorage.js +1 -4
  83. package/dist/useMagicKeys.js +1 -81
  84. package/dist/useManualRefHistory.js +1 -64
  85. package/dist/useMath.js +1 -52
  86. package/dist/useMediaQuery.js +1 -19
  87. package/dist/useMemoize.js +1 -24
  88. package/dist/useMounted.js +1 -8
  89. package/dist/useMouse.js +1 -67
  90. package/dist/useMouseInElement.js +1 -31
  91. package/dist/useMousePressed.js +1 -31
  92. package/dist/useMutationObserver.js +1 -27
  93. package/dist/useNavigatorLanguage.js +1 -17
  94. package/dist/useNetwork.js +1 -58
  95. package/dist/useNow.js +1 -10
  96. package/dist/useObjectUrl.js +1 -23
  97. package/dist/useOffsetPagination.js +1 -45
  98. package/dist/useOnline.js +1 -20
  99. package/dist/usePageLeave.js +1 -27
  100. package/dist/useParallax.js +1 -33
  101. package/dist/useParentElement.js +1 -8
  102. package/dist/usePermission.js +1 -21
  103. package/dist/usePointer.js +1 -32
  104. package/dist/usePointerLock.js +1 -33
  105. package/dist/usePointerSwipe.js +1 -52
  106. package/dist/usePreferredColorScheme.js +1 -25
  107. package/dist/usePreferredContrast.js +1 -29
  108. package/dist/usePreferredLanguages.js +1 -16
  109. package/dist/usePreferredReducedMotion.js +1 -18
  110. package/dist/usePrevious.js +1 -8
  111. package/dist/useQuery.js +1 -265
  112. package/dist/useRafFn.js +1 -37
  113. package/dist/useRefHistory.js +1 -72
  114. package/dist/useResizeObserver.js +1 -27
  115. package/dist/useScreenOrientation.js +1 -27
  116. package/dist/useScreenSafeArea.js +1 -25
  117. package/dist/useScriptTag.js +1 -52
  118. package/dist/useScroll.js +1 -116
  119. package/dist/useScrollLock.js +1 -39
  120. package/dist/useSessionStorage.js +1 -4
  121. package/dist/useShare.js +1 -11
  122. package/dist/useSorted.js +1 -10
  123. package/dist/useStepper.js +1 -46
  124. package/dist/useStorage.js +1 -54
  125. package/dist/useStyleTag.js +1 -39
  126. package/dist/useSupported.js +1 -10
  127. package/dist/useSwipe.js +1 -58
  128. package/dist/useTextDirection.js +1 -16
  129. package/dist/useTextSelection.js +1 -27
  130. package/dist/useTextareaAutosize.js +1 -20
  131. package/dist/useThrottle.js +1 -23
  132. package/dist/useThrottleFn.js +1 -36
  133. package/dist/useThrottledRef.js +1 -30
  134. package/dist/useThrottledRefHistory.js +1 -43
  135. package/dist/useTimeAgo.js +1 -58
  136. package/dist/useTimeout.js +1 -32
  137. package/dist/useTimeoutFn.js +1 -27
  138. package/dist/useTimeoutPoll.js +1 -33
  139. package/dist/useTimestamp.js +1 -43
  140. package/dist/useTitle.js +1 -12
  141. package/dist/useToNumber.js +1 -25
  142. package/dist/useToString.js +1 -10
  143. package/dist/useToggle.js +1 -12
  144. package/dist/useTransition.js +1 -89
  145. package/dist/useUrlSearchParams.js +1 -72
  146. package/dist/useVibrate.js +1 -14
  147. package/dist/useVirtualList.js +1 -49
  148. package/dist/useWakeLock.js +1 -32
  149. package/dist/useWebNotification.js +1 -39
  150. package/dist/useWebSocket.js +1 -103
  151. package/dist/useWebWorker.js +1 -56
  152. package/dist/useWindowFocus.js +1 -20
  153. package/dist/useWindowScroll.js +1 -17
  154. package/dist/useWindowSize.js +1 -28
  155. package/dist/watchArray.js +1 -9
  156. package/dist/watchAtMost.js +1 -12
  157. package/dist/watchDebounced.js +1 -20
  158. package/dist/watchDeep.js +1 -13
  159. package/dist/watchIgnorable.js +1 -19
  160. package/dist/watchImmediate.js +1 -7
  161. package/dist/watchOnce.js +1 -17
  162. package/dist/watchPausable.js +1 -23
  163. package/dist/watchThrottled.js +1 -37
  164. package/dist/watchTriggerable.js +1 -10
  165. package/dist/watchWithFilter.js +1 -6
  166. package/dist/whenever.js +1 -7
  167. package/package.json +2 -2
@@ -1,52 +1 @@
1
- import { onUnmounted, ref } from "@stacksjs/stx";
2
- import { unref, noop } from "./_shared";
3
- export function useDropZone(target, onDrop) {
4
- const isOverDropZone = ref(!1), files = ref(null);
5
- let cleanup = noop, dragCounter = 0;
6
- if (typeof window < "u") {
7
- const el = unref(target);
8
- if (el) {
9
- const cleanups = [], onDragEnter = (event) => {
10
- event.preventDefault();
11
- dragCounter++;
12
- isOverDropZone.value = !0;
13
- }, onDragOver = (event) => {
14
- event.preventDefault();
15
- isOverDropZone.value = !0;
16
- }, onDragLeave = (event) => {
17
- event.preventDefault();
18
- dragCounter--;
19
- if (dragCounter <= 0) {
20
- dragCounter = 0;
21
- isOverDropZone.value = !1;
22
- }
23
- }, onDropHandler = (event) => {
24
- event.preventDefault();
25
- dragCounter = 0;
26
- isOverDropZone.value = !1;
27
- const droppedFiles = event.dataTransfer?.files;
28
- if (droppedFiles && droppedFiles.length > 0)
29
- files.value = Array.from(droppedFiles);
30
- else
31
- files.value = null;
32
- if (onDrop)
33
- onDrop(files.value);
34
- };
35
- el.addEventListener("dragenter", onDragEnter);
36
- el.addEventListener("dragover", onDragOver);
37
- el.addEventListener("dragleave", onDragLeave);
38
- el.addEventListener("drop", onDropHandler);
39
- cleanups.push(() => el.removeEventListener("dragenter", onDragEnter), () => el.removeEventListener("dragover", onDragOver), () => el.removeEventListener("dragleave", onDragLeave), () => el.removeEventListener("drop", onDropHandler));
40
- cleanup = () => {
41
- for (const fn of cleanups)
42
- fn();
43
- cleanups.length = 0;
44
- cleanup = noop;
45
- };
46
- }
47
- }
48
- try {
49
- onUnmounted(() => cleanup());
50
- } catch {}
51
- return { isOverDropZone, files };
52
- }
1
+ import{onUnmounted,ref}from"@stacksjs/stx";import{unref,noop}from"./_shared";export function useDropZone(target,onDrop){const isOverDropZone=ref(!1),files=ref(null);let cleanup=noop,dragCounter=0;if(typeof window<"u"){const el=unref(target);if(el){const cleanups=[],onDragEnter=(event)=>{event.preventDefault();dragCounter++;isOverDropZone.value=!0},onDragOver=(event)=>{event.preventDefault();isOverDropZone.value=!0},onDragLeave=(event)=>{event.preventDefault();dragCounter--;if(dragCounter<=0){dragCounter=0;isOverDropZone.value=!1}},onDropHandler=(event)=>{event.preventDefault();dragCounter=0;isOverDropZone.value=!1;const droppedFiles=event.dataTransfer?.files;if(droppedFiles&&droppedFiles.length>0)files.value=Array.from(droppedFiles);else files.value=null;if(onDrop)onDrop(files.value)};el.addEventListener("dragenter",onDragEnter);el.addEventListener("dragover",onDragOver);el.addEventListener("dragleave",onDragLeave);el.addEventListener("drop",onDropHandler);cleanups.push(()=>el.removeEventListener("dragenter",onDragEnter),()=>el.removeEventListener("dragover",onDragOver),()=>el.removeEventListener("dragleave",onDragLeave),()=>el.removeEventListener("drop",onDropHandler));cleanup=()=>{for(const fn of cleanups)fn();cleanups.length=0;cleanup=noop}}}try{onUnmounted(()=>cleanup())}catch{}return{isOverDropZone,files}}
@@ -1,59 +1 @@
1
- import { onUnmounted, ref } from "@stacksjs/stx";
2
- import { unref, noop } from "./_shared";
3
- export function useElementBounding(target) {
4
- const x = ref(0), y = ref(0), top = ref(0), right = ref(0), bottom = ref(0), left = ref(0), width = ref(0), height = ref(0), cleanups = [];
5
- let cleanup = noop;
6
- const update = () => {
7
- const el = unref(target);
8
- if (!el)
9
- return;
10
- const rect = el.getBoundingClientRect();
11
- x.value = rect.x;
12
- y.value = rect.y;
13
- top.value = rect.top;
14
- right.value = rect.right;
15
- bottom.value = rect.bottom;
16
- left.value = rect.left;
17
- width.value = rect.width;
18
- height.value = rect.height;
19
- };
20
- if (typeof window < "u") {
21
- update();
22
- const onResize = () => update();
23
- window.addEventListener("resize", onResize, { passive: !0 });
24
- cleanups.push(() => window.removeEventListener("resize", onResize));
25
- const onScroll = () => update();
26
- window.addEventListener("scroll", onScroll, { passive: !0 });
27
- cleanups.push(() => window.removeEventListener("scroll", onScroll));
28
- if ("ResizeObserver" in window) {
29
- const el = unref(target);
30
- if (el) {
31
- const resizeObserver = new ResizeObserver(update);
32
- resizeObserver.observe(el);
33
- cleanups.push(() => resizeObserver.disconnect());
34
- }
35
- }
36
- if ("MutationObserver" in window) {
37
- const el = unref(target);
38
- if (el) {
39
- const mutationObserver = new MutationObserver(update);
40
- mutationObserver.observe(el, {
41
- childList: !0,
42
- subtree: !0,
43
- attributes: !0
44
- });
45
- cleanups.push(() => mutationObserver.disconnect());
46
- }
47
- }
48
- cleanup = () => {
49
- for (const fn of cleanups)
50
- fn();
51
- cleanups.length = 0;
52
- cleanup = noop;
53
- };
54
- }
55
- try {
56
- onUnmounted(() => cleanup());
57
- } catch {}
58
- return { x, y, top, right, bottom, left, width, height, update };
59
- }
1
+ import{onUnmounted,ref}from"@stacksjs/stx";import{unref,noop}from"./_shared";export function useElementBounding(target){const x=ref(0),y=ref(0),top=ref(0),right=ref(0),bottom=ref(0),left=ref(0),width=ref(0),height=ref(0),cleanups=[];let cleanup=noop;const update=()=>{const el=unref(target);if(!el)return;const rect=el.getBoundingClientRect();x.value=rect.x;y.value=rect.y;top.value=rect.top;right.value=rect.right;bottom.value=rect.bottom;left.value=rect.left;width.value=rect.width;height.value=rect.height};if(typeof window<"u"){update();const onResize=()=>update();window.addEventListener("resize",onResize,{passive:!0});cleanups.push(()=>window.removeEventListener("resize",onResize));const onScroll=()=>update();window.addEventListener("scroll",onScroll,{passive:!0});cleanups.push(()=>window.removeEventListener("scroll",onScroll));if("ResizeObserver"in window){const el=unref(target);if(el){const resizeObserver=new ResizeObserver(update);resizeObserver.observe(el);cleanups.push(()=>resizeObserver.disconnect())}}if("MutationObserver"in window){const el=unref(target);if(el){const mutationObserver=new MutationObserver(update);mutationObserver.observe(el,{childList:!0,subtree:!0,attributes:!0});cleanups.push(()=>mutationObserver.disconnect())}}cleanup=()=>{for(const fn of cleanups)fn();cleanups.length=0;cleanup=noop}}try{onUnmounted(()=>cleanup())}catch{}return{x,y,top,right,bottom,left,width,height,update}}
@@ -1,18 +1 @@
1
- import { onUnmounted, ref } from "@stacksjs/stx";
2
- export function useElementByPoint(options) {
3
- const x = options?.x ?? ref(0), y = options?.y ?? ref(0), element = ref(null);
4
- if (typeof document > "u")
5
- return { element, x, y };
6
- const handler = (e) => {
7
- x.value = e.clientX;
8
- y.value = e.clientY;
9
- element.value = document.elementFromPoint(e.clientX, e.clientY);
10
- };
11
- document.addEventListener("mousemove", handler, { passive: !0 });
12
- try {
13
- onUnmounted(() => {
14
- document.removeEventListener("mousemove", handler);
15
- });
16
- } catch {}
17
- return { element, x, y };
18
- }
1
+ import{onUnmounted,ref}from"@stacksjs/stx";export function useElementByPoint(options){const x=options?.x??ref(0),y=options?.y??ref(0),element=ref(null);if(typeof document>"u")return{element,x,y};const handler=(e)=>{x.value=e.clientX;y.value=e.clientY;element.value=document.elementFromPoint(e.clientX,e.clientY)};document.addEventListener("mousemove",handler,{passive:!0});try{onUnmounted(()=>{document.removeEventListener("mousemove",handler)})}catch{}return{element,x,y}}
@@ -1,28 +1 @@
1
- import { onUnmounted, ref } from "@stacksjs/stx";
2
- import { unref } from "./_shared";
3
- export function useElementHover(target) {
4
- const isHovered = ref(!1);
5
- let cleanup = () => {};
6
- function setup(el) {
7
- cleanup();
8
- if (!el)
9
- return;
10
- const onEnter = () => {
11
- isHovered.value = !0;
12
- }, onLeave = () => {
13
- isHovered.value = !1;
14
- };
15
- el.addEventListener("mouseenter", onEnter, { passive: !0 });
16
- el.addEventListener("mouseleave", onLeave, { passive: !0 });
17
- cleanup = () => {
18
- el.removeEventListener("mouseenter", onEnter);
19
- el.removeEventListener("mouseleave", onLeave);
20
- cleanup = () => {};
21
- };
22
- }
23
- setup(unref(target));
24
- try {
25
- onUnmounted(() => cleanup());
26
- } catch {}
27
- return isHovered;
28
- }
1
+ import{onUnmounted,ref}from"@stacksjs/stx";import{unref}from"./_shared";export function useElementHover(target){const isHovered=ref(!1);let cleanup=()=>{};function setup(el){cleanup();if(!el)return;const onEnter=()=>{isHovered.value=!0},onLeave=()=>{isHovered.value=!1};el.addEventListener("mouseenter",onEnter,{passive:!0});el.addEventListener("mouseleave",onLeave,{passive:!0});cleanup=()=>{el.removeEventListener("mouseenter",onEnter);el.removeEventListener("mouseleave",onLeave);cleanup=()=>{}}}setup(unref(target));try{onUnmounted(()=>cleanup())}catch{}return isHovered}
@@ -1,34 +1 @@
1
- import { onUnmounted, ref } from "@stacksjs/stx";
2
- import { unref, noop } from "./_shared";
3
- export function useElementSize(target, options) {
4
- const width = ref(options?.initialSize?.width ?? 0), height = ref(options?.initialSize?.height ?? 0), isSupported = typeof window < "u" && "ResizeObserver" in window;
5
- let cleanup = noop;
6
- if (isSupported) {
7
- const el = unref(target);
8
- if (el) {
9
- const observer = new ResizeObserver((entries) => {
10
- for (const entry of entries)
11
- if (entry.contentBoxSize) {
12
- const boxSize = Array.isArray(entry.contentBoxSize) ? entry.contentBoxSize[0] : entry.contentBoxSize;
13
- width.value = boxSize.inlineSize;
14
- height.value = boxSize.blockSize;
15
- } else {
16
- width.value = entry.contentRect.width;
17
- height.value = entry.contentRect.height;
18
- }
19
- });
20
- observer.observe(el);
21
- cleanup = () => {
22
- observer.disconnect();
23
- cleanup = noop;
24
- };
25
- }
26
- }
27
- const stop = () => {
28
- cleanup();
29
- };
30
- try {
31
- onUnmounted(stop);
32
- } catch {}
33
- return { width, height, stop };
34
- }
1
+ import{onUnmounted,ref}from"@stacksjs/stx";import{unref,noop}from"./_shared";export function useElementSize(target,options){const width=ref(options?.initialSize?.width??0),height=ref(options?.initialSize?.height??0),isSupported=typeof window<"u"&&"ResizeObserver"in window;let cleanup=noop;if(isSupported){const el=unref(target);if(el){const observer=new ResizeObserver((entries)=>{for(const entry of entries)if(entry.contentBoxSize){const boxSize=Array.isArray(entry.contentBoxSize)?entry.contentBoxSize[0]:entry.contentBoxSize;width.value=boxSize.inlineSize;height.value=boxSize.blockSize}else{width.value=entry.contentRect.width;height.value=entry.contentRect.height}});observer.observe(el);cleanup=()=>{observer.disconnect();cleanup=noop}}}const stop=()=>{cleanup()};try{onUnmounted(stop)}catch{}return{width,height,stop}}
@@ -1,10 +1 @@
1
- import { ref } from "@stacksjs/stx";
2
- import { useIntersectionObserver } from "./useIntersectionObserver";
3
- export function useElementVisibility(target) {
4
- const isVisible = ref(!1);
5
- useIntersectionObserver(target, (entries) => {
6
- for (const entry of entries)
7
- isVisible.value = entry.isIntersecting;
8
- }, { threshold: 0 });
9
- return isVisible;
10
- }
1
+ import{ref}from"@stacksjs/stx";import{useIntersectionObserver}from"./useIntersectionObserver";export function useElementVisibility(target){const isVisible=ref(!1);useIntersectionObserver(target,(entries)=>{for(const entry of entries)isVisible.value=entry.isIntersecting},{threshold:0});return isVisible}
@@ -1,41 +1 @@
1
- import { onUnmounted } from "@stacksjs/stx";
2
- const buses = new Map;
3
- export function useEventBus(key) {
4
- if (!buses.has(key))
5
- buses.set(key, new Set);
6
- const listeners = buses.get(key), localListeners = [];
7
- function on(listener) {
8
- listeners.add(listener);
9
- localListeners.push(listener);
10
- return () => off(listener);
11
- }
12
- function once(listener) {
13
- const wrapper = (event) => {
14
- listener(event);
15
- off(wrapper);
16
- };
17
- return on(wrapper);
18
- }
19
- function emit(event) {
20
- for (const listener of listeners)
21
- listener(event);
22
- }
23
- function off(listener) {
24
- listeners.delete(listener);
25
- const idx = localListeners.indexOf(listener);
26
- if (idx !== -1)
27
- localListeners.splice(idx, 1);
28
- }
29
- function reset() {
30
- listeners.clear();
31
- localListeners.length = 0;
32
- }
33
- try {
34
- onUnmounted(() => {
35
- for (const listener of localListeners)
36
- listeners.delete(listener);
37
- localListeners.length = 0;
38
- });
39
- } catch {}
40
- return { on, once, emit, off, reset };
41
- }
1
+ import{onUnmounted}from"@stacksjs/stx";const buses=new Map;export function useEventBus(key){if(!buses.has(key))buses.set(key,new Set);const listeners=buses.get(key),localListeners=[];function on(listener){listeners.add(listener);localListeners.push(listener);return()=>off(listener)}function once(listener){const wrapper=(event)=>{listener(event);off(wrapper)};return on(wrapper)}function emit(event){for(const listener of listeners)listener(event)}function off(listener){listeners.delete(listener);const idx=localListeners.indexOf(listener);if(idx!==-1)localListeners.splice(idx,1)}function reset(){listeners.clear();localListeners.length=0}try{onUnmounted(()=>{for(const listener of localListeners)listeners.delete(listener);localListeners.length=0})}catch{}return{on,once,emit,off,reset}}
@@ -1,29 +1 @@
1
- import { onUnmounted, watch } from "@stacksjs/stx";
2
- import { isRef, unref, noop, defaultWindow } from "./_shared";
3
- export function useEventListener(target, event, handler, options) {
4
- let cleanup = noop;
5
- const register = (el) => {
6
- if (!el)
7
- return noop;
8
- el.addEventListener(event, handler, options);
9
- return () => {
10
- el.removeEventListener(event, handler, options);
11
- };
12
- };
13
- if (isRef(target)) {
14
- watch(target, (_newTarget, _oldTarget) => {
15
- cleanup();
16
- cleanup = register(unref(target));
17
- });
18
- cleanup = register(target.value);
19
- } else
20
- cleanup = register(target);
21
- const stop = () => {
22
- cleanup();
23
- cleanup = noop;
24
- };
25
- try {
26
- onUnmounted(stop);
27
- } catch {}
28
- return stop;
29
- }
1
+ import{onUnmounted,watch}from"@stacksjs/stx";import{isRef,unref,noop,defaultWindow}from"./_shared";export function useEventListener(target,event,handler,options){let cleanup=noop;const register=(el)=>{if(!el)return noop;el.addEventListener(event,handler,options);return()=>{el.removeEventListener(event,handler,options)}};if(isRef(target)){watch(target,(_newTarget,_oldTarget)=>{cleanup();cleanup=register(unref(target))});cleanup=register(target.value)}else cleanup=register(target);const stop=()=>{cleanup();cleanup=noop};try{onUnmounted(stop)}catch{}return stop}
@@ -1,72 +1 @@
1
- import { onUnmounted, ref } from "@stacksjs/stx";
2
- import { toValue } from "./_shared";
3
- export function useEventSource(url, events = [], options = {}) {
4
- const {
5
- withCredentials = !1,
6
- immediate = !0
7
- } = options, data = ref(null), event = ref(null), status = ref("CLOSED"), error = ref(null), eventSourceRef = ref(null);
8
- let listeners = [];
9
- function close() {
10
- const es = eventSourceRef.value;
11
- if (es) {
12
- for (const { eventName, handler } of listeners)
13
- es.removeEventListener(eventName, handler);
14
- listeners = [];
15
- es.close();
16
- eventSourceRef.value = null;
17
- status.value = "CLOSED";
18
- }
19
- }
20
- function open() {
21
- if (typeof EventSource > "u")
22
- return;
23
- close();
24
- const resolvedUrl = toValue(url);
25
- status.value = "CONNECTING";
26
- const es = new EventSource(resolvedUrl, { withCredentials });
27
- eventSourceRef.value = es;
28
- es.onopen = () => {
29
- status.value = "OPEN";
30
- error.value = null;
31
- };
32
- es.onerror = (e) => {
33
- error.value = e;
34
- if (es.readyState === EventSource.CLOSED)
35
- status.value = "CLOSED";
36
- else
37
- status.value = "CONNECTING";
38
- };
39
- const messageHandler = (e) => {
40
- const messageEvent = e;
41
- data.value = messageEvent.data;
42
- event.value = "message";
43
- };
44
- es.addEventListener("message", messageHandler);
45
- listeners.push({ eventName: "message", handler: messageHandler });
46
- for (const eventName of events) {
47
- const handler = (e) => {
48
- const messageEvent = e;
49
- data.value = messageEvent.data;
50
- event.value = eventName;
51
- };
52
- es.addEventListener(eventName, handler);
53
- listeners.push({ eventName, handler });
54
- }
55
- }
56
- if (immediate)
57
- open();
58
- try {
59
- onUnmounted(() => {
60
- close();
61
- });
62
- } catch {}
63
- return {
64
- data,
65
- event,
66
- status,
67
- error,
68
- eventSource: eventSourceRef,
69
- close,
70
- open
71
- };
72
- }
1
+ import{onUnmounted,ref}from"@stacksjs/stx";import{toValue}from"./_shared";export function useEventSource(url,events=[],options={}){const{withCredentials=!1,immediate=!0}=options,data=ref(null),event=ref(null),status=ref("CLOSED"),error=ref(null),eventSourceRef=ref(null);let listeners=[];function close(){const es=eventSourceRef.value;if(es){for(const{eventName,handler}of listeners)es.removeEventListener(eventName,handler);listeners=[];es.close();eventSourceRef.value=null;status.value="CLOSED"}}function open(){if(typeof EventSource>"u")return;close();const resolvedUrl=toValue(url);status.value="CONNECTING";const es=new EventSource(resolvedUrl,{withCredentials});eventSourceRef.value=es;es.onopen=()=>{status.value="OPEN";error.value=null};es.onerror=(e)=>{error.value=e;if(es.readyState===EventSource.CLOSED)status.value="CLOSED";else status.value="CONNECTING"};const messageHandler=(e)=>{const messageEvent=e;data.value=messageEvent.data;event.value="message"};es.addEventListener("message",messageHandler);listeners.push({eventName:"message",handler:messageHandler});for(const eventName of events){const handler=(e)=>{const messageEvent=e;data.value=messageEvent.data;event.value=eventName};es.addEventListener(eventName,handler);listeners.push({eventName,handler})}}if(immediate)open();try{onUnmounted(()=>{close()})}catch{}return{data,event,status,error,eventSource:eventSourceRef,close,open}}
@@ -1,17 +1 @@
1
- import { ref } from "@stacksjs/stx";
2
- export function useEyeDropper() {
3
- const isSupported = ref(typeof window < "u" && "EyeDropper" in window), sRGBHex = ref("");
4
- async function open() {
5
- if (!isSupported.value)
6
- return;
7
- const dropper = new window.EyeDropper;
8
- try {
9
- const result = await dropper.open();
10
- sRGBHex.value = result.sRGBHex;
11
- return result;
12
- } catch {
13
- return;
14
- }
15
- }
16
- return { isSupported, sRGBHex, open };
17
- }
1
+ import{ref}from"@stacksjs/stx";export function useEyeDropper(){const isSupported=ref(typeof window<"u"&&"EyeDropper"in window),sRGBHex=ref("");async function open(){if(!isSupported.value)return;const dropper=new window.EyeDropper;try{const result=await dropper.open();sRGBHex.value=result.sRGBHex;return result}catch{return}}return{isSupported,sRGBHex,open}}
@@ -1,22 +1 @@
1
- import { ref, watch } from "@stacksjs/stx";
2
- import { toValue } from "./_shared";
3
- export function useFavicon(newIcon) {
4
- const favicon = ref(toValue(newIcon ?? null));
5
- function applyIcon(icon) {
6
- if (typeof document > "u" || !icon)
7
- return;
8
- let link = document.querySelector('link[rel*="icon"]');
9
- if (!link) {
10
- link = document.createElement("link");
11
- link.rel = "icon";
12
- link.type = "image/x-icon";
13
- document.head.appendChild(link);
14
- }
15
- link.href = icon;
16
- }
17
- watch(favicon, (val) => {
18
- applyIcon(val);
19
- });
20
- applyIcon(favicon.value);
21
- return favicon;
22
- }
1
+ import{ref,watch}from"@stacksjs/stx";import{toValue}from"./_shared";export function useFavicon(newIcon){const favicon=ref(toValue(newIcon??null));function applyIcon(icon){if(typeof document>"u"||!icon)return;let link=document.querySelector('link[rel*="icon"]');if(!link){link=document.createElement("link");link.rel="icon";link.type="image/x-icon";document.head.appendChild(link)}link.href=icon}watch(favicon,(val)=>{applyIcon(val)});applyIcon(favicon.value);return favicon}
package/dist/useFetch.js CHANGED
@@ -1,61 +1 @@
1
- import { ref } from "@stacksjs/stx";
2
- export function useFetch(url) {
3
- let method = "GET", body;
4
- const builder = {
5
- get() {
6
- method = "GET";
7
- body = void 0;
8
- return builder;
9
- },
10
- post(b) {
11
- method = "POST";
12
- body = b;
13
- return builder;
14
- },
15
- patch(b) {
16
- method = "PATCH";
17
- body = b;
18
- return builder;
19
- },
20
- put(b) {
21
- method = "PUT";
22
- body = b;
23
- return builder;
24
- },
25
- delete() {
26
- method = "DELETE";
27
- body = void 0;
28
- return builder;
29
- },
30
- json() {
31
- const data = ref(null), error = ref(null), isFetching = ref(!0), init = {
32
- method,
33
- headers: { Accept: "application/json" }
34
- };
35
- if (body && method !== "GET" && method !== "DELETE") {
36
- init.headers = { ...init.headers, "Content-Type": "application/json" };
37
- init.body = body;
38
- }
39
- const result = { data, error }, fetchPromise = fetch(url, init).then(async (response) => {
40
- const json = await response.json();
41
- if (response.ok)
42
- data.value = json;
43
- else
44
- error.value = json;
45
- }).catch((e) => {
46
- error.value = e;
47
- }).finally(() => {
48
- isFetching.value = !1;
49
- });
50
- return {
51
- data,
52
- error,
53
- isFetching,
54
- then(resolve) {
55
- return fetchPromise.then(() => resolve(result));
56
- }
57
- };
58
- }
59
- };
60
- return builder;
61
- }
1
+ import{ref}from"@stacksjs/stx";export function useFetch(url){let method="GET",body;const builder={get(){method="GET";body=void 0;return builder},post(b){method="POST";body=b;return builder},patch(b){method="PATCH";body=b;return builder},put(b){method="PUT";body=b;return builder},delete(){method="DELETE";body=void 0;return builder},json(){const data=ref(null),error=ref(null),isFetching=ref(!0),init={method,headers:{Accept:"application/json"}};if(body&&method!=="GET"&&method!=="DELETE"){init.headers={...init.headers,"Content-Type":"application/json"};init.body=body}const result={data,error},fetchPromise=fetch(url,init).then(async(response)=>{const json=await response.json();if(response.ok)data.value=json;else error.value=json}).catch((e)=>{error.value=e}).finally(()=>{isFetching.value=!1});return{data,error,isFetching,then(resolve){return fetchPromise.then(()=>resolve(result))}}}};return builder}
@@ -1,24 +1 @@
1
- import { ref } from "@stacksjs/stx";
2
- export function useFileDialog(options = {}) {
3
- const files = ref(null);
4
- function open(overrideOptions) {
5
- if (typeof document > "u")
6
- return;
7
- const opts = { ...options, ...overrideOptions }, input = document.createElement("input");
8
- input.type = "file";
9
- if (opts.accept)
10
- input.accept = opts.accept;
11
- if (opts.multiple)
12
- input.multiple = !0;
13
- if (opts.capture)
14
- input.setAttribute("capture", opts.capture);
15
- input.onchange = () => {
16
- files.value = input.files;
17
- };
18
- input.click();
19
- }
20
- function reset() {
21
- files.value = null;
22
- }
23
- return { files, open, reset };
24
- }
1
+ import{ref}from"@stacksjs/stx";export function useFileDialog(options={}){const files=ref(null);function open(overrideOptions){if(typeof document>"u")return;const opts={...options,...overrideOptions},input=document.createElement("input");input.type="file";if(opts.accept)input.accept=opts.accept;if(opts.multiple)input.multiple=!0;if(opts.capture)input.setAttribute("capture",opts.capture);input.onchange=()=>{files.value=input.files};input.click()}function reset(){files.value=null}return{files,open,reset}}
package/dist/useFocus.js CHANGED
@@ -1,42 +1 @@
1
- import { onUnmounted, ref, watch } from "@stacksjs/stx";
2
- import { unref } from "./_shared";
3
- export function useFocus(target, options = {}) {
4
- const { initialValue = !1 } = options, focused = ref(initialValue);
5
- let cleanup = () => {};
6
- function setup(el) {
7
- cleanup();
8
- if (!el)
9
- return;
10
- const onFocus = () => {
11
- focused.value = !0;
12
- }, onBlur = () => {
13
- focused.value = !1;
14
- };
15
- el.addEventListener("focus", onFocus, { passive: !0 });
16
- el.addEventListener("blur", onBlur, { passive: !0 });
17
- cleanup = () => {
18
- el.removeEventListener("focus", onFocus);
19
- el.removeEventListener("blur", onBlur);
20
- cleanup = () => {};
21
- };
22
- if (document.activeElement === el)
23
- focused.value = !0;
24
- if (initialValue)
25
- el.focus();
26
- }
27
- const el = unref(target);
28
- setup(el);
29
- watch(focused, (val) => {
30
- const element = unref(target);
31
- if (!element)
32
- return;
33
- if (val)
34
- element.focus();
35
- else
36
- element.blur();
37
- });
38
- try {
39
- onUnmounted(() => cleanup());
40
- } catch {}
41
- return { focused };
42
- }
1
+ import{onUnmounted,ref,watch}from"@stacksjs/stx";import{unref}from"./_shared";export function useFocus(target,options={}){const{initialValue=!1}=options,focused=ref(initialValue);let cleanup=()=>{};function setup(el){cleanup();if(!el)return;const onFocus=()=>{focused.value=!0},onBlur=()=>{focused.value=!1};el.addEventListener("focus",onFocus,{passive:!0});el.addEventListener("blur",onBlur,{passive:!0});cleanup=()=>{el.removeEventListener("focus",onFocus);el.removeEventListener("blur",onBlur);cleanup=()=>{}};if(document.activeElement===el)focused.value=!0;if(initialValue)el.focus()}const el=unref(target);setup(el);watch(focused,(val)=>{const element=unref(target);if(!element)return;if(val)element.focus();else element.blur()});try{onUnmounted(()=>cleanup())}catch{}return{focused}}
@@ -1,29 +1 @@
1
- import { onUnmounted, ref } from "@stacksjs/stx";
2
- import { unref } from "./_shared";
3
- export function useFocusWithin(target) {
4
- const focused = ref(!1);
5
- let cleanup = () => {};
6
- function setup(el) {
7
- cleanup();
8
- if (!el)
9
- return;
10
- const onFocusIn = () => {
11
- focused.value = !0;
12
- }, onFocusOut = (e) => {
13
- if (!el.contains(e.relatedTarget))
14
- focused.value = !1;
15
- };
16
- el.addEventListener("focusin", onFocusIn, { passive: !0 });
17
- el.addEventListener("focusout", onFocusOut);
18
- cleanup = () => {
19
- el.removeEventListener("focusin", onFocusIn);
20
- el.removeEventListener("focusout", onFocusOut);
21
- cleanup = () => {};
22
- };
23
- }
24
- setup(unref(target));
25
- try {
26
- onUnmounted(() => cleanup());
27
- } catch {}
28
- return { focused };
29
- }
1
+ import{onUnmounted,ref}from"@stacksjs/stx";import{unref}from"./_shared";export function useFocusWithin(target){const focused=ref(!1);let cleanup=()=>{};function setup(el){cleanup();if(!el)return;const onFocusIn=()=>{focused.value=!0},onFocusOut=(e)=>{if(!el.contains(e.relatedTarget))focused.value=!1};el.addEventListener("focusin",onFocusIn,{passive:!0});el.addEventListener("focusout",onFocusOut);cleanup=()=>{el.removeEventListener("focusin",onFocusIn);el.removeEventListener("focusout",onFocusOut);cleanup=()=>{}}}setup(unref(target));try{onUnmounted(()=>cleanup())}catch{}return{focused}}