@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,72 +1 @@
1
- import { computed, ref, watch } from "@stacksjs/stx";
2
- function cloneValue(val, shouldClone) {
3
- if (!shouldClone)
4
- return val;
5
- if (typeof structuredClone === "function")
6
- return structuredClone(val);
7
- return JSON.parse(JSON.stringify(val));
8
- }
9
- export function useRefHistory(source, options = {}) {
10
- const { capacity = 1 / 0, deep = !1, clone = !1 } = options, undoStack = ref([
11
- { snapshot: cloneValue(source.value, clone), timestamp: Date.now() }
12
- ]), redoStack = ref([]);
13
- let isUndoRedoing = !1;
14
- const canUndo = computed(() => undoStack.value.length > 1), canRedo = computed(() => redoStack.value.length > 0), last = computed(() => {
15
- return undoStack.value[undoStack.value.length - 1];
16
- });
17
- function commit() {
18
- const record = {
19
- snapshot: cloneValue(source.value, clone),
20
- timestamp: Date.now()
21
- };
22
- undoStack.value = [...undoStack.value, record];
23
- if (capacity !== 1 / 0 && undoStack.value.length > capacity)
24
- undoStack.value = undoStack.value.slice(undoStack.value.length - capacity);
25
- redoStack.value = [];
26
- }
27
- function undo() {
28
- if (undoStack.value.length <= 1)
29
- return;
30
- isUndoRedoing = !0;
31
- const current = undoStack.value[undoStack.value.length - 1], newUndoStack = undoStack.value.slice(0, -1);
32
- undoStack.value = newUndoStack;
33
- if (current)
34
- redoStack.value = [...redoStack.value, current];
35
- const previous = newUndoStack[newUndoStack.length - 1];
36
- if (previous)
37
- source.value = cloneValue(previous.snapshot, clone);
38
- isUndoRedoing = !1;
39
- }
40
- function redo() {
41
- if (redoStack.value.length === 0)
42
- return;
43
- isUndoRedoing = !0;
44
- const next = redoStack.value[redoStack.value.length - 1];
45
- redoStack.value = redoStack.value.slice(0, -1);
46
- if (next) {
47
- undoStack.value = [...undoStack.value, next];
48
- source.value = cloneValue(next.snapshot, clone);
49
- }
50
- isUndoRedoing = !1;
51
- }
52
- function clear() {
53
- undoStack.value = [
54
- { snapshot: cloneValue(source.value, clone), timestamp: Date.now() }
55
- ];
56
- redoStack.value = [];
57
- }
58
- watch(source, () => {
59
- if (!isUndoRedoing)
60
- commit();
61
- }, { deep });
62
- return {
63
- history: undoStack,
64
- commit,
65
- undo,
66
- redo,
67
- canUndo,
68
- canRedo,
69
- clear,
70
- last
71
- };
72
- }
1
+ import{computed,ref,watch}from"@stacksjs/stx";function cloneValue(val,shouldClone){if(!shouldClone)return val;if(typeof structuredClone==="function")return structuredClone(val);return JSON.parse(JSON.stringify(val))}export function useRefHistory(source,options={}){const{capacity=1/0,deep=!1,clone=!1}=options,undoStack=ref([{snapshot:cloneValue(source.value,clone),timestamp:Date.now()}]),redoStack=ref([]);let isUndoRedoing=!1;const canUndo=computed(()=>undoStack.value.length>1),canRedo=computed(()=>redoStack.value.length>0),last=computed(()=>{return undoStack.value[undoStack.value.length-1]});function commit(){const record={snapshot:cloneValue(source.value,clone),timestamp:Date.now()};undoStack.value=[...undoStack.value,record];if(capacity!==1/0&&undoStack.value.length>capacity)undoStack.value=undoStack.value.slice(undoStack.value.length-capacity);redoStack.value=[]}function undo(){if(undoStack.value.length<=1)return;isUndoRedoing=!0;const current=undoStack.value[undoStack.value.length-1],newUndoStack=undoStack.value.slice(0,-1);undoStack.value=newUndoStack;if(current)redoStack.value=[...redoStack.value,current];const previous=newUndoStack[newUndoStack.length-1];if(previous)source.value=cloneValue(previous.snapshot,clone);isUndoRedoing=!1}function redo(){if(redoStack.value.length===0)return;isUndoRedoing=!0;const next=redoStack.value[redoStack.value.length-1];redoStack.value=redoStack.value.slice(0,-1);if(next){undoStack.value=[...undoStack.value,next];source.value=cloneValue(next.snapshot,clone)}isUndoRedoing=!1}function clear(){undoStack.value=[{snapshot:cloneValue(source.value,clone),timestamp:Date.now()}];redoStack.value=[]}watch(source,()=>{if(!isUndoRedoing)commit()},{deep});return{history:undoStack,commit,undo,redo,canUndo,canRedo,clear,last}}
@@ -1,27 +1 @@
1
- import { onUnmounted, ref } from "@stacksjs/stx";
2
- import { unref, noop } from "./_shared";
3
- export function useResizeObserver(target, callback, options) {
4
- const isSupported = ref(typeof window < "u" && "ResizeObserver" in window);
5
- let cleanup = noop;
6
- (() => {
7
- cleanup();
8
- if (!isSupported.value)
9
- return;
10
- const el = unref(target);
11
- if (!el)
12
- return;
13
- const observer = new ResizeObserver(callback);
14
- observer.observe(el, options);
15
- cleanup = () => {
16
- observer.disconnect();
17
- cleanup = noop;
18
- };
19
- })();
20
- const stop = () => {
21
- cleanup();
22
- };
23
- try {
24
- onUnmounted(stop);
25
- } catch {}
26
- return { isSupported, stop };
27
- }
1
+ import{onUnmounted,ref}from"@stacksjs/stx";import{unref,noop}from"./_shared";export function useResizeObserver(target,callback,options){const isSupported=ref(typeof window<"u"&&"ResizeObserver"in window);let cleanup=noop;(()=>{cleanup();if(!isSupported.value)return;const el=unref(target);if(!el)return;const observer=new ResizeObserver(callback);observer.observe(el,options);cleanup=()=>{observer.disconnect();cleanup=noop}})();const stop=()=>{cleanup()};try{onUnmounted(stop)}catch{}return{isSupported,stop}}
@@ -1,27 +1 @@
1
- import { onUnmounted, ref } from "@stacksjs/stx";
2
- export function useScreenOrientation() {
3
- const isSupported = ref(typeof screen < "u" && "orientation" in screen), orientation = ref(void 0), angle = ref(0);
4
- if (isSupported.value) {
5
- orientation.value = screen.orientation.type;
6
- angle.value = screen.orientation.angle;
7
- const handler = () => {
8
- orientation.value = screen.orientation.type;
9
- angle.value = screen.orientation.angle;
10
- };
11
- screen.orientation.addEventListener("change", handler);
12
- try {
13
- onUnmounted(() => {
14
- screen.orientation.removeEventListener("change", handler);
15
- });
16
- } catch {}
17
- }
18
- async function lockOrientation(type) {
19
- if (isSupported.value)
20
- await screen.orientation.lock(type);
21
- }
22
- function unlockOrientation() {
23
- if (isSupported.value)
24
- screen.orientation.unlock();
25
- }
26
- return { isSupported, orientation, angle, lockOrientation, unlockOrientation };
27
- }
1
+ import{onUnmounted,ref}from"@stacksjs/stx";export function useScreenOrientation(){const isSupported=ref(typeof screen<"u"&&"orientation"in screen),orientation=ref(void 0),angle=ref(0);if(isSupported.value){orientation.value=screen.orientation.type;angle.value=screen.orientation.angle;const handler=()=>{orientation.value=screen.orientation.type;angle.value=screen.orientation.angle};screen.orientation.addEventListener("change",handler);try{onUnmounted(()=>{screen.orientation.removeEventListener("change",handler)})}catch{}}async function lockOrientation(type){if(isSupported.value)await screen.orientation.lock(type)}function unlockOrientation(){if(isSupported.value)screen.orientation.unlock()}return{isSupported,orientation,angle,lockOrientation,unlockOrientation}}
@@ -1,25 +1 @@
1
- import { ref } from "@stacksjs/stx";
2
- export function useScreenSafeArea() {
3
- const top = ref("0px"), right = ref("0px"), bottom = ref("0px"), left = ref("0px");
4
- function update() {
5
- if (typeof document > "u" || typeof getComputedStyle > "u")
6
- return;
7
- const div = document.createElement("div");
8
- div.style.position = "fixed";
9
- div.style.top = "env(safe-area-inset-top, 0px)";
10
- div.style.right = "env(safe-area-inset-right, 0px)";
11
- div.style.bottom = "env(safe-area-inset-bottom, 0px)";
12
- div.style.left = "env(safe-area-inset-left, 0px)";
13
- div.style.pointerEvents = "none";
14
- div.style.visibility = "hidden";
15
- document.body.appendChild(div);
16
- const style = getComputedStyle(div);
17
- top.value = style.top;
18
- right.value = style.right;
19
- bottom.value = style.bottom;
20
- left.value = style.left;
21
- document.body.removeChild(div);
22
- }
23
- update();
24
- return { top, right, bottom, left, update };
25
- }
1
+ import{ref}from"@stacksjs/stx";export function useScreenSafeArea(){const top=ref("0px"),right=ref("0px"),bottom=ref("0px"),left=ref("0px");function update(){if(typeof document>"u"||typeof getComputedStyle>"u")return;const div=document.createElement("div");div.style.position="fixed";div.style.top="env(safe-area-inset-top, 0px)";div.style.right="env(safe-area-inset-right, 0px)";div.style.bottom="env(safe-area-inset-bottom, 0px)";div.style.left="env(safe-area-inset-left, 0px)";div.style.pointerEvents="none";div.style.visibility="hidden";document.body.appendChild(div);const style=getComputedStyle(div);top.value=style.top;right.value=style.right;bottom.value=style.bottom;left.value=style.left;document.body.removeChild(div)}update();return{top,right,bottom,left,update}}
@@ -1,52 +1 @@
1
- import { onUnmounted, ref } from "@stacksjs/stx";
2
- export function useScriptTag(src, onLoaded, options = {}) {
3
- const {
4
- immediate = !0,
5
- type = "text/javascript",
6
- manual = !1,
7
- attrs = {}
8
- } = options, scriptTag = ref(null);
9
- function load() {
10
- return new Promise((resolve, reject) => {
11
- if (typeof document > "u") {
12
- reject(Error("Document is not available"));
13
- return;
14
- }
15
- const el = document.createElement("script");
16
- el.type = type;
17
- el.src = src;
18
- if (options.async)
19
- el.async = !0;
20
- if (options.defer)
21
- el.defer = !0;
22
- if (options.crossOrigin)
23
- el.crossOrigin = options.crossOrigin;
24
- if (options.referrerPolicy)
25
- el.referrerPolicy = options.referrerPolicy;
26
- for (const [key, value] of Object.entries(attrs))
27
- el.setAttribute(key, value);
28
- el.addEventListener("load", () => {
29
- scriptTag.value = el;
30
- onLoaded?.(el);
31
- resolve(el);
32
- });
33
- el.addEventListener("error", (event) => {
34
- reject(event);
35
- });
36
- document.head.appendChild(el);
37
- });
38
- }
39
- function unload() {
40
- if (scriptTag.value) {
41
- scriptTag.value.remove();
42
- scriptTag.value = null;
43
- }
44
- }
45
- if (immediate)
46
- load();
47
- if (!manual)
48
- try {
49
- onUnmounted(() => unload());
50
- } catch {}
51
- return { scriptTag, load, unload };
52
- }
1
+ import{onUnmounted,ref}from"@stacksjs/stx";export function useScriptTag(src,onLoaded,options={}){const{immediate=!0,type="text/javascript",manual=!1,attrs={}}=options,scriptTag=ref(null);function load(){return new Promise((resolve,reject)=>{if(typeof document>"u"){reject(Error("Document is not available"));return}const el=document.createElement("script");el.type=type;el.src=src;if(options.async)el.async=!0;if(options.defer)el.defer=!0;if(options.crossOrigin)el.crossOrigin=options.crossOrigin;if(options.referrerPolicy)el.referrerPolicy=options.referrerPolicy;for(const[key,value]of Object.entries(attrs))el.setAttribute(key,value);el.addEventListener("load",()=>{scriptTag.value=el;onLoaded?.(el);resolve(el)});el.addEventListener("error",(event)=>{reject(event)});document.head.appendChild(el)})}function unload(){if(scriptTag.value){scriptTag.value.remove();scriptTag.value=null}}if(immediate)load();if(!manual)try{onUnmounted(()=>unload())}catch{}return{scriptTag,load,unload}}
package/dist/useScroll.js CHANGED
@@ -1,116 +1 @@
1
- import { onUnmounted, ref } from "@stacksjs/stx";
2
- import { unref } from "./_shared";
3
- export function useScroll(target, options) {
4
- const { throttle = 0, offset = {} } = options ?? {}, offsetTop = offset.top ?? 0, offsetBottom = offset.bottom ?? 0, offsetLeft = offset.left ?? 0, offsetRight = offset.right ?? 0, x = ref(0), y = ref(0), isScrolling = ref(!1), arrivedTop = ref(!0), arrivedBottom = ref(!1), arrivedLeft = ref(!0), arrivedRight = ref(!1), dirTop = ref(!1), dirBottom = ref(!1), dirLeft = ref(!1), dirRight = ref(!1);
5
- let scrollingTimer, lastX = 0, lastY = 0, throttleTimer, isThrottled = !1;
6
- function getScrollPosition(el) {
7
- if (typeof window < "u" && el === window || "innerHeight" in el && "scrollX" in el) {
8
- const win = el, doc = typeof document < "u" ? document : void 0;
9
- return {
10
- scrollLeft: win.scrollX ?? win.pageXOffset ?? 0,
11
- scrollTop: win.scrollY ?? win.pageYOffset ?? 0,
12
- scrollHeight: doc?.documentElement?.scrollHeight ?? 0,
13
- scrollWidth: doc?.documentElement?.scrollWidth ?? 0,
14
- clientHeight: win.innerHeight,
15
- clientWidth: win.innerWidth
16
- };
17
- }
18
- if (typeof document < "u" && el === document || "documentElement" in el) {
19
- const docEl = el.documentElement;
20
- return {
21
- scrollLeft: docEl.scrollLeft,
22
- scrollTop: docEl.scrollTop,
23
- scrollHeight: docEl.scrollHeight,
24
- scrollWidth: docEl.scrollWidth,
25
- clientHeight: docEl.clientHeight,
26
- clientWidth: docEl.clientWidth
27
- };
28
- }
29
- const htmlEl = el;
30
- return {
31
- scrollLeft: htmlEl.scrollLeft,
32
- scrollTop: htmlEl.scrollTop,
33
- scrollHeight: htmlEl.scrollHeight,
34
- scrollWidth: htmlEl.scrollWidth,
35
- clientHeight: htmlEl.clientHeight,
36
- clientWidth: htmlEl.clientWidth
37
- };
38
- }
39
- function update() {
40
- const el = target ? unref(target) : typeof window < "u" ? window : null;
41
- if (!el)
42
- return;
43
- const pos = getScrollPosition(el);
44
- dirTop.value = pos.scrollTop < lastY;
45
- dirBottom.value = pos.scrollTop > lastY;
46
- dirLeft.value = pos.scrollLeft < lastX;
47
- dirRight.value = pos.scrollLeft > lastX;
48
- lastX = pos.scrollLeft;
49
- lastY = pos.scrollTop;
50
- x.value = pos.scrollLeft;
51
- y.value = pos.scrollTop;
52
- arrivedTop.value = pos.scrollTop <= offsetTop;
53
- arrivedLeft.value = pos.scrollLeft <= offsetLeft;
54
- arrivedBottom.value = pos.scrollTop + pos.clientHeight >= pos.scrollHeight - offsetBottom;
55
- arrivedRight.value = pos.scrollLeft + pos.clientWidth >= pos.scrollWidth - offsetRight;
56
- isScrolling.value = !0;
57
- if (scrollingTimer)
58
- clearTimeout(scrollingTimer);
59
- scrollingTimer = setTimeout(() => {
60
- isScrolling.value = !1;
61
- }, 150);
62
- }
63
- function onScroll() {
64
- if (throttle > 0) {
65
- if (!isThrottled) {
66
- update();
67
- isThrottled = !0;
68
- throttleTimer = setTimeout(() => {
69
- isThrottled = !1;
70
- }, throttle);
71
- }
72
- } else
73
- update();
74
- }
75
- if (typeof window < "u") {
76
- const el = target ? unref(target) : window;
77
- if (el) {
78
- const pos = getScrollPosition(el);
79
- x.value = pos.scrollLeft;
80
- y.value = pos.scrollTop;
81
- lastX = pos.scrollLeft;
82
- lastY = pos.scrollTop;
83
- arrivedTop.value = pos.scrollTop <= offsetTop;
84
- arrivedLeft.value = pos.scrollLeft <= offsetLeft;
85
- arrivedBottom.value = pos.scrollTop + pos.clientHeight >= pos.scrollHeight - offsetBottom;
86
- arrivedRight.value = pos.scrollLeft + pos.clientWidth >= pos.scrollWidth - offsetRight;
87
- el.addEventListener("scroll", onScroll, { passive: !0 });
88
- try {
89
- onUnmounted(() => {
90
- el.removeEventListener("scroll", onScroll);
91
- if (scrollingTimer)
92
- clearTimeout(scrollingTimer);
93
- if (throttleTimer)
94
- clearTimeout(throttleTimer);
95
- });
96
- } catch {}
97
- }
98
- }
99
- return {
100
- x,
101
- y,
102
- isScrolling,
103
- arrivedState: {
104
- top: arrivedTop,
105
- bottom: arrivedBottom,
106
- left: arrivedLeft,
107
- right: arrivedRight
108
- },
109
- directions: {
110
- top: dirTop,
111
- bottom: dirBottom,
112
- left: dirLeft,
113
- right: dirRight
114
- }
115
- };
116
- }
1
+ import{onUnmounted,ref}from"@stacksjs/stx";import{unref}from"./_shared";export function useScroll(target,options){const{throttle=0,offset={}}=options??{},offsetTop=offset.top??0,offsetBottom=offset.bottom??0,offsetLeft=offset.left??0,offsetRight=offset.right??0,x=ref(0),y=ref(0),isScrolling=ref(!1),arrivedTop=ref(!0),arrivedBottom=ref(!1),arrivedLeft=ref(!0),arrivedRight=ref(!1),dirTop=ref(!1),dirBottom=ref(!1),dirLeft=ref(!1),dirRight=ref(!1);let scrollingTimer,lastX=0,lastY=0,throttleTimer,isThrottled=!1;function getScrollPosition(el){if(typeof window<"u"&&el===window||"innerHeight"in el&&"scrollX"in el){const win=el,doc=typeof document<"u"?document:void 0;return{scrollLeft:win.scrollX??win.pageXOffset??0,scrollTop:win.scrollY??win.pageYOffset??0,scrollHeight:doc?.documentElement?.scrollHeight??0,scrollWidth:doc?.documentElement?.scrollWidth??0,clientHeight:win.innerHeight,clientWidth:win.innerWidth}}if(typeof document<"u"&&el===document||"documentElement"in el){const docEl=el.documentElement;return{scrollLeft:docEl.scrollLeft,scrollTop:docEl.scrollTop,scrollHeight:docEl.scrollHeight,scrollWidth:docEl.scrollWidth,clientHeight:docEl.clientHeight,clientWidth:docEl.clientWidth}}const htmlEl=el;return{scrollLeft:htmlEl.scrollLeft,scrollTop:htmlEl.scrollTop,scrollHeight:htmlEl.scrollHeight,scrollWidth:htmlEl.scrollWidth,clientHeight:htmlEl.clientHeight,clientWidth:htmlEl.clientWidth}}function update(){const el=target?unref(target):typeof window<"u"?window:null;if(!el)return;const pos=getScrollPosition(el);dirTop.value=pos.scrollTop<lastY;dirBottom.value=pos.scrollTop>lastY;dirLeft.value=pos.scrollLeft<lastX;dirRight.value=pos.scrollLeft>lastX;lastX=pos.scrollLeft;lastY=pos.scrollTop;x.value=pos.scrollLeft;y.value=pos.scrollTop;arrivedTop.value=pos.scrollTop<=offsetTop;arrivedLeft.value=pos.scrollLeft<=offsetLeft;arrivedBottom.value=pos.scrollTop+pos.clientHeight>=pos.scrollHeight-offsetBottom;arrivedRight.value=pos.scrollLeft+pos.clientWidth>=pos.scrollWidth-offsetRight;isScrolling.value=!0;if(scrollingTimer)clearTimeout(scrollingTimer);scrollingTimer=setTimeout(()=>{isScrolling.value=!1},150)}function onScroll(){if(throttle>0){if(!isThrottled){update();isThrottled=!0;throttleTimer=setTimeout(()=>{isThrottled=!1},throttle)}}else update()}if(typeof window<"u"){const el=target?unref(target):window;if(el){const pos=getScrollPosition(el);x.value=pos.scrollLeft;y.value=pos.scrollTop;lastX=pos.scrollLeft;lastY=pos.scrollTop;arrivedTop.value=pos.scrollTop<=offsetTop;arrivedLeft.value=pos.scrollLeft<=offsetLeft;arrivedBottom.value=pos.scrollTop+pos.clientHeight>=pos.scrollHeight-offsetBottom;arrivedRight.value=pos.scrollLeft+pos.clientWidth>=pos.scrollWidth-offsetRight;el.addEventListener("scroll",onScroll,{passive:!0});try{onUnmounted(()=>{el.removeEventListener("scroll",onScroll);if(scrollingTimer)clearTimeout(scrollingTimer);if(throttleTimer)clearTimeout(throttleTimer)})}catch{}}}return{x,y,isScrolling,arrivedState:{top:arrivedTop,bottom:arrivedBottom,left:arrivedLeft,right:arrivedRight},directions:{top:dirTop,bottom:dirBottom,left:dirLeft,right:dirRight}}}
@@ -1,39 +1 @@
1
- import { onUnmounted, ref, watch } from "@stacksjs/stx";
2
- import { unref } from "./_shared";
3
- export function useScrollLock(element) {
4
- const isLocked = ref(!1);
5
- let originalOverflow = "";
6
- function getElement() {
7
- if (element)
8
- return unref(element);
9
- if (typeof document < "u")
10
- return document.body;
11
- return null;
12
- }
13
- function lock() {
14
- const el = getElement();
15
- if (!el)
16
- return;
17
- originalOverflow = el.style.overflow;
18
- el.style.overflow = "hidden";
19
- }
20
- function unlock() {
21
- const el = getElement();
22
- if (!el)
23
- return;
24
- el.style.overflow = originalOverflow;
25
- }
26
- watch(isLocked, (val) => {
27
- if (val)
28
- lock();
29
- else
30
- unlock();
31
- });
32
- try {
33
- onUnmounted(() => {
34
- if (isLocked.value)
35
- unlock();
36
- });
37
- } catch {}
38
- return isLocked;
39
- }
1
+ import{onUnmounted,ref,watch}from"@stacksjs/stx";import{unref}from"./_shared";export function useScrollLock(element){const isLocked=ref(!1);let originalOverflow="";function getElement(){if(element)return unref(element);if(typeof document<"u")return document.body;return null}function lock(){const el=getElement();if(!el)return;originalOverflow=el.style.overflow;el.style.overflow="hidden"}function unlock(){const el=getElement();if(!el)return;el.style.overflow=originalOverflow}watch(isLocked,(val)=>{if(val)lock();else unlock()});try{onUnmounted(()=>{if(isLocked.value)unlock()})}catch{}return isLocked}
@@ -1,4 +1 @@
1
- import { useStorage } from "./useStorage";
2
- export function useSessionStorage(key, defaultValue, options) {
3
- return useStorage(key, defaultValue, typeof sessionStorage < "u" ? sessionStorage : void 0, options);
4
- }
1
+ import{useStorage}from"./useStorage";export function useSessionStorage(key,defaultValue,options){return useStorage(key,defaultValue,typeof sessionStorage<"u"?sessionStorage:void 0,options)}
package/dist/useShare.js CHANGED
@@ -1,11 +1 @@
1
- import { ref } from "@stacksjs/stx";
2
- export function useShare(options = {}) {
3
- const isSupported = ref(typeof navigator < "u" && "share" in navigator);
4
- async function share(overrideOptions) {
5
- if (!isSupported.value)
6
- return;
7
- const shareData = { ...options, ...overrideOptions };
8
- await navigator.share(shareData);
9
- }
10
- return { share, isSupported };
11
- }
1
+ import{ref}from"@stacksjs/stx";export function useShare(options={}){const isSupported=ref(typeof navigator<"u"&&"share"in navigator);async function share(overrideOptions){if(!isSupported.value)return;const shareData={...options,...overrideOptions};await navigator.share(shareData)}return{share,isSupported}}
package/dist/useSorted.js CHANGED
@@ -1,10 +1 @@
1
- import { computed } from "@stacksjs/stx";
2
- import { unref } from "./_shared";
3
- export function useSorted(source, compareFn) {
4
- return computed(() => {
5
- const arr = [...unref(source)];
6
- if (compareFn)
7
- return arr.sort(compareFn);
8
- return arr.sort();
9
- });
10
- }
1
+ import{computed}from"@stacksjs/stx";import{unref}from"./_shared";export function useSorted(source,compareFn){return computed(()=>{const arr=[...unref(source)];if(compareFn)return arr.sort(compareFn);return arr.sort()})}
@@ -1,46 +1 @@
1
- import { computed, ref } from "@stacksjs/stx";
2
- export function useStepper(steps, initialStep) {
3
- const stepsRef = ref([...steps]), initialIndex = initialStep !== void 0 ? steps.indexOf(initialStep) : 0, index = ref(initialIndex >= 0 ? initialIndex : 0), current = computed(() => stepsRef.value[index.value]), isFirst = computed(() => index.value === 0), isLast = computed(() => index.value === stepsRef.value.length - 1);
4
- function next() {
5
- if (index.value < stepsRef.value.length - 1)
6
- index.value++;
7
- }
8
- function previous() {
9
- if (index.value > 0)
10
- index.value--;
11
- }
12
- function goTo(step) {
13
- const idx = stepsRef.value.indexOf(step);
14
- if (idx >= 0)
15
- index.value = idx;
16
- }
17
- function goToIndex(idx) {
18
- if (idx >= 0 && idx < stepsRef.value.length)
19
- index.value = idx;
20
- }
21
- function isBefore(step) {
22
- const stepIndex = stepsRef.value.indexOf(step);
23
- return stepIndex >= 0 && index.value < stepIndex;
24
- }
25
- function isAfter(step) {
26
- const stepIndex = stepsRef.value.indexOf(step);
27
- return stepIndex >= 0 && index.value > stepIndex;
28
- }
29
- function isCurrent(step) {
30
- return stepsRef.value[index.value] === step;
31
- }
32
- return {
33
- steps: stepsRef,
34
- current,
35
- index,
36
- isFirst,
37
- isLast,
38
- next,
39
- previous,
40
- goTo,
41
- goToIndex,
42
- isBefore,
43
- isAfter,
44
- isCurrent
45
- };
46
- }
1
+ import{computed,ref}from"@stacksjs/stx";export function useStepper(steps,initialStep){const stepsRef=ref([...steps]),initialIndex=initialStep!==void 0?steps.indexOf(initialStep):0,index=ref(initialIndex>=0?initialIndex:0),current=computed(()=>stepsRef.value[index.value]),isFirst=computed(()=>index.value===0),isLast=computed(()=>index.value===stepsRef.value.length-1);function next(){if(index.value<stepsRef.value.length-1)index.value++}function previous(){if(index.value>0)index.value--}function goTo(step){const idx=stepsRef.value.indexOf(step);if(idx>=0)index.value=idx}function goToIndex(idx){if(idx>=0&&idx<stepsRef.value.length)index.value=idx}function isBefore(step){const stepIndex=stepsRef.value.indexOf(step);return stepIndex>=0&&index.value<stepIndex}function isAfter(step){const stepIndex=stepsRef.value.indexOf(step);return stepIndex>=0&&index.value>stepIndex}function isCurrent(step){return stepsRef.value[index.value]===step}return{steps:stepsRef,current,index,isFirst,isLast,next,previous,goTo,goToIndex,isBefore,isAfter,isCurrent}}
@@ -1,54 +1 @@
1
- import { onUnmounted, ref, watch } from "@stacksjs/stx";
2
- export function useStorage(key, defaultValue, storage, options) {
3
- const store = storage ?? (typeof localStorage < "u" ? localStorage : void 0), serializer = options?.serializer ?? {
4
- read: (raw) => {
5
- try {
6
- return JSON.parse(raw);
7
- } catch {
8
- return raw;
9
- }
10
- },
11
- write: (value) => JSON.stringify(value)
12
- };
13
- let initialValue = defaultValue;
14
- if (store)
15
- try {
16
- const raw = store.getItem(key);
17
- if (raw !== null)
18
- initialValue = serializer.read(raw);
19
- } catch {}
20
- const data = ref(initialValue);
21
- watch(data, (val) => {
22
- if (!store)
23
- return;
24
- try {
25
- if (val === null || val === void 0)
26
- store.removeItem(key);
27
- else
28
- store.setItem(key, serializer.write(val));
29
- } catch (err) {
30
- const name = err?.name ?? "", msg = err?.message ?? String(err);
31
- if (name === "QuotaExceededError" || /quota/i.test(msg))
32
- console.warn(`[useStorage] ${key}: storage quota exceeded \u2014 value not persisted.`);
33
- else
34
- console.warn(`[useStorage] ${key}: failed to persist value \u2014 ${msg}`);
35
- }
36
- });
37
- if (typeof window < "u") {
38
- const onStorageChange = (e) => {
39
- if (e.key !== key || e.storageArea !== store)
40
- return;
41
- if (e.newValue === null)
42
- data.value = defaultValue;
43
- else
44
- try {
45
- data.value = serializer.read(e.newValue);
46
- } catch {
47
- data.value = defaultValue;
48
- }
49
- };
50
- window.addEventListener("storage", onStorageChange);
51
- onUnmounted(() => window.removeEventListener("storage", onStorageChange));
52
- }
53
- return data;
54
- }
1
+ import{onUnmounted,ref,watch}from"@stacksjs/stx";export function useStorage(key,defaultValue,storage,options){const store=storage??(typeof localStorage<"u"?localStorage:void 0),serializer=options?.serializer??{read:(raw)=>{try{return JSON.parse(raw)}catch{return raw}},write:(value)=>JSON.stringify(value)};let initialValue=defaultValue;if(store)try{const raw=store.getItem(key);if(raw!==null)initialValue=serializer.read(raw)}catch{}const data=ref(initialValue);watch(data,(val)=>{if(!store)return;try{if(val===null||val===void 0)store.removeItem(key);else store.setItem(key,serializer.write(val))}catch(err){const name=err?.name??"",msg=err?.message??String(err);if(name==="QuotaExceededError"||/quota/i.test(msg))console.warn(`[useStorage] ${key}: storage quota exceeded \u2014 value not persisted.`);else console.warn(`[useStorage] ${key}: failed to persist value \u2014 ${msg}`)}});if(typeof window<"u"){const onStorageChange=(e)=>{if(e.key!==key||e.storageArea!==store)return;if(e.newValue===null)data.value=defaultValue;else try{data.value=serializer.read(e.newValue)}catch{data.value=defaultValue}};window.addEventListener("storage",onStorageChange);onUnmounted(()=>window.removeEventListener("storage",onStorageChange))}return data}
@@ -1,39 +1 @@
1
- import { onUnmounted, ref, watch } from "@stacksjs/stx";
2
- export function useStyleTag(initialCss, options = {}) {
3
- const {
4
- immediate = !0,
5
- id = `style-${Math.random().toString(36).slice(2, 9)}`,
6
- media
7
- } = options, css = ref(initialCss), isLoaded = ref(!1);
8
- let styleEl = null;
9
- function load() {
10
- if (typeof document > "u")
11
- return;
12
- if (styleEl)
13
- return;
14
- styleEl = document.createElement("style");
15
- styleEl.id = id;
16
- if (media)
17
- styleEl.media = media;
18
- styleEl.textContent = css.value;
19
- document.head.appendChild(styleEl);
20
- isLoaded.value = !0;
21
- }
22
- function unload() {
23
- if (styleEl) {
24
- styleEl.remove();
25
- styleEl = null;
26
- isLoaded.value = !1;
27
- }
28
- }
29
- watch(css, (val) => {
30
- if (styleEl)
31
- styleEl.textContent = val;
32
- });
33
- if (immediate)
34
- load();
35
- try {
36
- onUnmounted(() => unload());
37
- } catch {}
38
- return { id, css, load, unload, isLoaded };
39
- }
1
+ import{onUnmounted,ref,watch}from"@stacksjs/stx";export function useStyleTag(initialCss,options={}){const{immediate=!0,id=`style-${Math.random().toString(36).slice(2,9)}`,media}=options,css=ref(initialCss),isLoaded=ref(!1);let styleEl=null;function load(){if(typeof document>"u")return;if(styleEl)return;styleEl=document.createElement("style");styleEl.id=id;if(media)styleEl.media=media;styleEl.textContent=css.value;document.head.appendChild(styleEl);isLoaded.value=!0}function unload(){if(styleEl){styleEl.remove();styleEl=null;isLoaded.value=!1}}watch(css,(val)=>{if(styleEl)styleEl.textContent=val});if(immediate)load();try{onUnmounted(()=>unload())}catch{}return{id,css,load,unload,isLoaded}}
@@ -1,10 +1 @@
1
- import { ref } from "@stacksjs/stx";
2
- export function useSupported(callback) {
3
- const isSupported = ref(!1);
4
- try {
5
- isSupported.value = callback();
6
- } catch {
7
- isSupported.value = !1;
8
- }
9
- return isSupported;
10
- }
1
+ import{ref}from"@stacksjs/stx";export function useSupported(callback){const isSupported=ref(!1);try{isSupported.value=callback()}catch{isSupported.value=!1}return isSupported}
package/dist/useSwipe.js CHANGED
@@ -1,58 +1 @@
1
- import { onUnmounted, ref } from "@stacksjs/stx";
2
- import { unref } from "./_shared";
3
- export function useSwipe(target, options = {}) {
4
- const { threshold = 50, onSwipe, onSwipeStart, onSwipeEnd, passive = !0 } = options, isSwiping = ref(!1), direction = ref("none"), lengthX = ref(0), lengthY = ref(0);
5
- let startX = 0, startY = 0;
6
- if (typeof window > "u")
7
- return { isSwiping, direction, lengthX, lengthY };
8
- const el = unref(target) ?? window, onTouchStart = (e) => {
9
- const touch = e.touches[0];
10
- if (!touch)
11
- return;
12
- startX = touch.clientX;
13
- startY = touch.clientY;
14
- isSwiping.value = !0;
15
- direction.value = "none";
16
- lengthX.value = 0;
17
- lengthY.value = 0;
18
- onSwipeStart?.(e);
19
- }, onTouchMove = (e) => {
20
- if (!isSwiping.value)
21
- return;
22
- const touch = e.touches[0];
23
- if (!touch)
24
- return;
25
- lengthX.value = touch.clientX - startX;
26
- lengthY.value = touch.clientY - startY;
27
- const absX = Math.abs(lengthX.value), absY = Math.abs(lengthY.value);
28
- if (absX > absY)
29
- direction.value = lengthX.value > 0 ? "right" : "left";
30
- else if (absY > absX)
31
- direction.value = lengthY.value > 0 ? "down" : "up";
32
- }, onTouchEnd = (e) => {
33
- if (!isSwiping.value)
34
- return;
35
- isSwiping.value = !1;
36
- const absX = Math.abs(lengthX.value), absY = Math.abs(lengthY.value);
37
- if (Math.max(absX, absY) >= threshold) {
38
- onSwipe?.(direction.value);
39
- onSwipeEnd?.(e, direction.value);
40
- } else {
41
- direction.value = "none";
42
- onSwipeEnd?.(e, "none");
43
- }
44
- };
45
- el.addEventListener("touchstart", onTouchStart, { passive });
46
- el.addEventListener("touchmove", onTouchMove, { passive });
47
- el.addEventListener("touchend", onTouchEnd, { passive });
48
- el.addEventListener("touchcancel", onTouchEnd, { passive });
49
- try {
50
- onUnmounted(() => {
51
- el.removeEventListener("touchstart", onTouchStart);
52
- el.removeEventListener("touchmove", onTouchMove);
53
- el.removeEventListener("touchend", onTouchEnd);
54
- el.removeEventListener("touchcancel", onTouchEnd);
55
- });
56
- } catch {}
57
- return { isSwiping, direction, lengthX, lengthY };
58
- }
1
+ import{onUnmounted,ref}from"@stacksjs/stx";import{unref}from"./_shared";export function useSwipe(target,options={}){const{threshold=50,onSwipe,onSwipeStart,onSwipeEnd,passive=!0}=options,isSwiping=ref(!1),direction=ref("none"),lengthX=ref(0),lengthY=ref(0);let startX=0,startY=0;if(typeof window>"u")return{isSwiping,direction,lengthX,lengthY};const el=unref(target)??window,onTouchStart=(e)=>{const touch=e.touches[0];if(!touch)return;startX=touch.clientX;startY=touch.clientY;isSwiping.value=!0;direction.value="none";lengthX.value=0;lengthY.value=0;onSwipeStart?.(e)},onTouchMove=(e)=>{if(!isSwiping.value)return;const touch=e.touches[0];if(!touch)return;lengthX.value=touch.clientX-startX;lengthY.value=touch.clientY-startY;const absX=Math.abs(lengthX.value),absY=Math.abs(lengthY.value);if(absX>absY)direction.value=lengthX.value>0?"right":"left";else if(absY>absX)direction.value=lengthY.value>0?"down":"up"},onTouchEnd=(e)=>{if(!isSwiping.value)return;isSwiping.value=!1;const absX=Math.abs(lengthX.value),absY=Math.abs(lengthY.value);if(Math.max(absX,absY)>=threshold){onSwipe?.(direction.value);onSwipeEnd?.(e,direction.value)}else{direction.value="none";onSwipeEnd?.(e,"none")}};el.addEventListener("touchstart",onTouchStart,{passive});el.addEventListener("touchmove",onTouchMove,{passive});el.addEventListener("touchend",onTouchEnd,{passive});el.addEventListener("touchcancel",onTouchEnd,{passive});try{onUnmounted(()=>{el.removeEventListener("touchstart",onTouchStart);el.removeEventListener("touchmove",onTouchMove);el.removeEventListener("touchend",onTouchEnd);el.removeEventListener("touchcancel",onTouchEnd)})}catch{}return{isSwiping,direction,lengthX,lengthY}}
@@ -1,16 +1 @@
1
- import { ref, watch } from "@stacksjs/stx";
2
- export function useTextDirection(target, initialValue) {
3
- const el = target ?? (typeof document < "u" ? document.documentElement : null);
4
- let initial = initialValue ?? "ltr";
5
- if (el) {
6
- const dir = el.getAttribute("dir");
7
- if (dir === "rtl" || dir === "ltr" || dir === "auto")
8
- initial = dir;
9
- }
10
- const direction = ref(initial);
11
- watch(direction, (val) => {
12
- if (el)
13
- el.setAttribute("dir", val);
14
- });
15
- return direction;
16
- }
1
+ import{ref,watch}from"@stacksjs/stx";export function useTextDirection(target,initialValue){const el=target??(typeof document<"u"?document.documentElement:null);let initial=initialValue??"ltr";if(el){const dir=el.getAttribute("dir");if(dir==="rtl"||dir==="ltr"||dir==="auto")initial=dir}const direction=ref(initial);watch(direction,(val)=>{if(el)el.setAttribute("dir",val)});return direction}