@reactuses/core 6.1.8 → 6.1.10

package/README.md

@@ -52,7 +52,9 @@ Refer to [documentations](https://reactuse.com/) for more details.
 ## Who's Using This
 
 [![PDD](https://img.shields.io/badge/PDD-E_Commerce-orange?style=for-the-badge)](https://www.pinduoduo.com/)
+[![Shopee](https://img.shields.io/badge/Shopee-E_Commerce-red?style=for-the-badge)](https://shopee.com/)
 [![Ctrip](https://img.shields.io/badge/Ctrip-Travel-blue?style=for-the-badge)](https://www.ctrip.com/)
+[![Bambu Lab](https://img.shields.io/badge/Bambu_Lab-3D_Printing-green?style=for-the-badge)](https://bambulab.com/)
 
 ---
 

package/dist/index.cjs

@@ -23,7 +23,7 @@ function isString(val) {
 const isDev = process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test';
 const isBrowser = typeof window !== 'undefined';
 const isNavigator = typeof navigator !== 'undefined';
-function noop() {}
+function noop$1() {}
 const isIOS = isBrowser && ((_window = window) == null ? void 0 : (_window_navigator = _window.navigator) == null ? void 0 : _window_navigator.userAgent) && /iP(?:ad|hone|od)/.test(window.navigator.userAgent);
 
 const useIsomorphicLayoutEffect = isBrowser ? React.useLayoutEffect : React.useEffect;
@@ -113,10 +113,10 @@ const useDeepCompareEffect = (effect, deps)=>{
     useCustomCompareEffect(effect, deps, lodashEs.isEqual);
 };
 
-function useEventListener(eventName, handler, element, options = defaultOptions$1) {
+function useEventListenerImpl(eventName, handler, element, options = defaultOptions$1) {
     const savedHandler = useLatest(handler);
+    const targetElement = getTargetElement(element, defaultWindow);
     useDeepCompareEffect(()=>{
-        const targetElement = getTargetElement(element, defaultWindow);
         if (!(targetElement && targetElement.addEventListener)) {
             return;
         }
@@ -130,10 +130,12 @@ function useEventListener(eventName, handler, element, options = defaultOptions$
         };
     }, [
         eventName,
-        element,
+        targetElement,
         options
     ]);
 }
+function noop() {}
+const useEventListener = isBrowser ? useEventListenerImpl : noop;
 
 const useMount = (fn)=>{
     if (isDev) {
@@ -203,7 +205,7 @@ function _async_to_generator$7(fn) {
         });
     };
 }
-const useAsyncEffect = (effect, cleanup = noop, deps)=>{
+const useAsyncEffect = (effect, cleanup = noop$1, deps)=>{
     const mounted = useMountedState();
     React.useEffect(()=>{
         const execute = ()=>_async_to_generator$7(function*() {
@@ -1774,7 +1776,7 @@ const defaultListerOptions = {
     passive: true
 };
 const useScroll = (target, options = defaultOptions$1)=>{
-    const { throttle = 0, idle = 200, onStop = noop, onScroll = noop, offset = {
+    const { throttle = 0, idle = 200, onStop = noop$1, onScroll = noop$1, offset = {
         left: 0,
         right: 0,
         top: 0,
@@ -2112,7 +2114,7 @@ const useMediaDevices = (options = {})=>{
                         label
                     }))
             });
-        }).catch(noop);
+        }).catch(noop$1);
     }, []);
     const ensurePermissions = React.useCallback(()=>_async_to_generator$3(function*() {
             if (!isSupported) {
@@ -2214,10 +2216,19 @@ const useMediaQuery = (query, defaultState)=>{
 function useRafState(initialState) {
     const frame = React.useRef(0);
     const [state, setState] = React.useState(initialState);
+    const pendingUpdates = React.useRef([]);
     const setRafState = React.useCallback((value)=>{
+        pendingUpdates.current.push(value);
         cancelAnimationFrame(frame.current);
         frame.current = requestAnimationFrame(()=>{
-            setState(value);
+            const updates = pendingUpdates.current.splice(0);
+            setState((prevState)=>{
+                let newState = prevState;
+                for (const update of updates){
+                    newState = typeof update === 'function' ? update(newState) : update;
+                }
+                return newState;
+            });
         });
     }, []);
     useUnmount(()=>{
@@ -2506,13 +2517,13 @@ function usePageLeave() {
         const from = event.relatedTarget || event.toElement;
         setIsLeft(!from);
     };
-    useEventListener('mouseout', handler, ()=>window, {
+    useEventListener('mouseout', handler, defaultWindow, {
         passive: true
     });
-    useEventListener('mouseleave', handler, ()=>document, {
+    useEventListener('mouseleave', handler, defaultDocument, {
         passive: true
     });
-    useEventListener('mouseenter', handler, ()=>document, {
+    useEventListener('mouseenter', handler, defaultDocument, {
         passive: true
     });
     return isLeft;
@@ -2540,7 +2551,7 @@ const usePermission = (permissionDesc)=>{
             permissionStatus = status;
             on(permissionStatus, 'change', onChange);
             onChange();
-        }).catch(noop);
+        }).catch(noop$1);
         return ()=>{
             permissionStatus && off(permissionStatus, 'change', onChange);
             mounted = false;
@@ -2678,7 +2689,7 @@ const useScratch = (target, options = {})=>{
                     isScratching: true
                 });
                 refState.current = newState;
-                (optionsRef.current.onScratch || noop)(newState);
+                (optionsRef.current.onScratch || noop$1)(newState);
                 return newState;
             });
         });
@@ -2692,7 +2703,7 @@ const useScratch = (target, options = {})=>{
             isScratching: false
         });
         refState.current = endState;
-        (optionsRef.current.onScratchEnd || noop)(endState);
+        (optionsRef.current.onScratchEnd || noop$1)(endState);
         setState(endState);
     };
     const startScratching = (docX, docY)=>{
@@ -2725,7 +2736,7 @@ const useScratch = (target, options = {})=>{
             posY: elY
         };
         refState.current = newState;
-        (optionsRef.current.onScratchStart || noop)(newState);
+        (optionsRef.current.onScratchStart || noop$1)(newState);
         setState(newState);
     };
     useEventListener('mousedown', (event)=>{
@@ -2752,7 +2763,7 @@ const useScratch = (target, options = {})=>{
     return state;
 };
 
-const useScriptTag = (src, onLoaded = noop, options = defaultOptions$1)=>{
+const useScriptTag = (src, onLoaded = noop$1, options = defaultOptions$1)=>{
     const { immediate = true, manual = false, type = 'text/javascript', async = true, crossOrigin, referrerPolicy, noModule, defer, attrs = {} } = options;
     const scriptTag = React.useRef(null);
     const _promise = React.useRef(null);

package/dist/index.d.cts

@@ -888,12 +888,13 @@ interface UseEventEmitterReturn<T, U = void> {
 declare function useEventEmitter<T, U = void>(): readonly [UseEventEmitterEvent<T, U>, (arg1: T, arg2: U) => void, () => void];
 
 type Target = BasicTarget<HTMLElement | Element | Window | Document | EventTarget>;
-declare function useEventListener<K extends keyof WindowEventMap>(eventName: K, handler: (event: WindowEventMap[K]) => void, element?: Window, options?: boolean | AddEventListenerOptions): void;
-declare function useEventListener<K extends keyof DocumentEventMap>(eventName: K, handler: (event: DocumentEventMap[K]) => void, element: Document, options?: boolean | AddEventListenerOptions): void;
-declare function useEventListener<K extends keyof HTMLElementEventMap, T extends HTMLElement = HTMLDivElement>(eventName: K, handler: (event: HTMLElementEventMap[K]) => void, element: T, options?: boolean | AddEventListenerOptions): void;
-declare function useEventListener<K extends keyof ElementEventMap>(eventName: K, handler: (event: ElementEventMap[K]) => void, element: Element, options?: boolean | AddEventListenerOptions): void;
-declare function useEventListener<K = Event>(eventName: string, handler: (event: K) => void, element: EventTarget | null | undefined, options?: boolean | AddEventListenerOptions): void;
-declare function useEventListener(eventName: string, handler: (...p: any) => void, element?: Target, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl<K extends keyof WindowEventMap>(eventName: K, handler: (event: WindowEventMap[K]) => void, element?: Window, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl<K extends keyof DocumentEventMap>(eventName: K, handler: (event: DocumentEventMap[K]) => void, element: Document, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl<K extends keyof HTMLElementEventMap, T extends HTMLElement = HTMLDivElement>(eventName: K, handler: (event: HTMLElementEventMap[K]) => void, element: T, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl<K extends keyof ElementEventMap>(eventName: K, handler: (event: ElementEventMap[K]) => void, element: Element, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl<K = Event>(eventName: string, handler: (event: K) => void, element: EventTarget | null | undefined, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl(eventName: string, handler: (...p: any) => void, element?: Target, options?: boolean | AddEventListenerOptions): void;
+declare const useEventListener: typeof useEventListenerImpl;
 
 /**
  * @title useEyeDropper

package/dist/index.d.mts

@@ -888,12 +888,13 @@ interface UseEventEmitterReturn<T, U = void> {
 declare function useEventEmitter<T, U = void>(): readonly [UseEventEmitterEvent<T, U>, (arg1: T, arg2: U) => void, () => void];
 
 type Target = BasicTarget<HTMLElement | Element | Window | Document | EventTarget>;
-declare function useEventListener<K extends keyof WindowEventMap>(eventName: K, handler: (event: WindowEventMap[K]) => void, element?: Window, options?: boolean | AddEventListenerOptions): void;
-declare function useEventListener<K extends keyof DocumentEventMap>(eventName: K, handler: (event: DocumentEventMap[K]) => void, element: Document, options?: boolean | AddEventListenerOptions): void;
-declare function useEventListener<K extends keyof HTMLElementEventMap, T extends HTMLElement = HTMLDivElement>(eventName: K, handler: (event: HTMLElementEventMap[K]) => void, element: T, options?: boolean | AddEventListenerOptions): void;
-declare function useEventListener<K extends keyof ElementEventMap>(eventName: K, handler: (event: ElementEventMap[K]) => void, element: Element, options?: boolean | AddEventListenerOptions): void;
-declare function useEventListener<K = Event>(eventName: string, handler: (event: K) => void, element: EventTarget | null | undefined, options?: boolean | AddEventListenerOptions): void;
-declare function useEventListener(eventName: string, handler: (...p: any) => void, element?: Target, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl<K extends keyof WindowEventMap>(eventName: K, handler: (event: WindowEventMap[K]) => void, element?: Window, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl<K extends keyof DocumentEventMap>(eventName: K, handler: (event: DocumentEventMap[K]) => void, element: Document, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl<K extends keyof HTMLElementEventMap, T extends HTMLElement = HTMLDivElement>(eventName: K, handler: (event: HTMLElementEventMap[K]) => void, element: T, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl<K extends keyof ElementEventMap>(eventName: K, handler: (event: ElementEventMap[K]) => void, element: Element, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl<K = Event>(eventName: string, handler: (event: K) => void, element: EventTarget | null | undefined, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl(eventName: string, handler: (...p: any) => void, element?: Target, options?: boolean | AddEventListenerOptions): void;
+declare const useEventListener: typeof useEventListenerImpl;
 
 /**
  * @title useEyeDropper

package/dist/index.d.ts

@@ -888,12 +888,13 @@ interface UseEventEmitterReturn<T, U = void> {
 declare function useEventEmitter<T, U = void>(): readonly [UseEventEmitterEvent<T, U>, (arg1: T, arg2: U) => void, () => void];
 
 type Target = BasicTarget<HTMLElement | Element | Window | Document | EventTarget>;
-declare function useEventListener<K extends keyof WindowEventMap>(eventName: K, handler: (event: WindowEventMap[K]) => void, element?: Window, options?: boolean | AddEventListenerOptions): void;
-declare function useEventListener<K extends keyof DocumentEventMap>(eventName: K, handler: (event: DocumentEventMap[K]) => void, element: Document, options?: boolean | AddEventListenerOptions): void;
-declare function useEventListener<K extends keyof HTMLElementEventMap, T extends HTMLElement = HTMLDivElement>(eventName: K, handler: (event: HTMLElementEventMap[K]) => void, element: T, options?: boolean | AddEventListenerOptions): void;
-declare function useEventListener<K extends keyof ElementEventMap>(eventName: K, handler: (event: ElementEventMap[K]) => void, element: Element, options?: boolean | AddEventListenerOptions): void;
-declare function useEventListener<K = Event>(eventName: string, handler: (event: K) => void, element: EventTarget | null | undefined, options?: boolean | AddEventListenerOptions): void;
-declare function useEventListener(eventName: string, handler: (...p: any) => void, element?: Target, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl<K extends keyof WindowEventMap>(eventName: K, handler: (event: WindowEventMap[K]) => void, element?: Window, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl<K extends keyof DocumentEventMap>(eventName: K, handler: (event: DocumentEventMap[K]) => void, element: Document, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl<K extends keyof HTMLElementEventMap, T extends HTMLElement = HTMLDivElement>(eventName: K, handler: (event: HTMLElementEventMap[K]) => void, element: T, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl<K extends keyof ElementEventMap>(eventName: K, handler: (event: ElementEventMap[K]) => void, element: Element, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl<K = Event>(eventName: string, handler: (event: K) => void, element: EventTarget | null | undefined, options?: boolean | AddEventListenerOptions): void;
+declare function useEventListenerImpl(eventName: string, handler: (...p: any) => void, element?: Target, options?: boolean | AddEventListenerOptions): void;
+declare const useEventListener: typeof useEventListenerImpl;
 
 /**
  * @title useEyeDropper

package/dist/index.mjs

@@ -15,7 +15,7 @@ function isString(val) {
 const isDev = process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test';
 const isBrowser = typeof window !== 'undefined';
 const isNavigator = typeof navigator !== 'undefined';
-function noop() {}
+function noop$1() {}
 const isIOS = isBrowser && ((_window = window) == null ? void 0 : (_window_navigator = _window.navigator) == null ? void 0 : _window_navigator.userAgent) && /iP(?:ad|hone|od)/.test(window.navigator.userAgent);
 
 const useIsomorphicLayoutEffect = isBrowser ? useLayoutEffect : useEffect;
@@ -105,10 +105,10 @@ const useDeepCompareEffect = (effect, deps)=>{
     useCustomCompareEffect(effect, deps, isEqual);
 };
 
-function useEventListener(eventName, handler, element, options = defaultOptions$1) {
+function useEventListenerImpl(eventName, handler, element, options = defaultOptions$1) {
     const savedHandler = useLatest(handler);
+    const targetElement = getTargetElement(element, defaultWindow);
     useDeepCompareEffect(()=>{
-        const targetElement = getTargetElement(element, defaultWindow);
         if (!(targetElement && targetElement.addEventListener)) {
             return;
         }
@@ -122,10 +122,12 @@ function useEventListener(eventName, handler, element, options = defaultOptions$
         };
     }, [
         eventName,
-        element,
+        targetElement,
         options
     ]);
 }
+function noop() {}
+const useEventListener = isBrowser ? useEventListenerImpl : noop;
 
 const useMount = (fn)=>{
     if (isDev) {
@@ -195,7 +197,7 @@ function _async_to_generator$7(fn) {
         });
     };
 }
-const useAsyncEffect = (effect, cleanup = noop, deps)=>{
+const useAsyncEffect = (effect, cleanup = noop$1, deps)=>{
     const mounted = useMountedState();
     useEffect(()=>{
         const execute = ()=>_async_to_generator$7(function*() {
@@ -1766,7 +1768,7 @@ const defaultListerOptions = {
     passive: true
 };
 const useScroll = (target, options = defaultOptions$1)=>{
-    const { throttle = 0, idle = 200, onStop = noop, onScroll = noop, offset = {
+    const { throttle = 0, idle = 200, onStop = noop$1, onScroll = noop$1, offset = {
         left: 0,
         right: 0,
         top: 0,
@@ -2104,7 +2106,7 @@ const useMediaDevices = (options = {})=>{
                         label
                     }))
             });
-        }).catch(noop);
+        }).catch(noop$1);
     }, []);
     const ensurePermissions = useCallback(()=>_async_to_generator$3(function*() {
             if (!isSupported) {
@@ -2206,10 +2208,19 @@ const useMediaQuery = (query, defaultState)=>{
 function useRafState(initialState) {
     const frame = useRef(0);
     const [state, setState] = useState(initialState);
+    const pendingUpdates = useRef([]);
     const setRafState = useCallback((value)=>{
+        pendingUpdates.current.push(value);
         cancelAnimationFrame(frame.current);
         frame.current = requestAnimationFrame(()=>{
-            setState(value);
+            const updates = pendingUpdates.current.splice(0);
+            setState((prevState)=>{
+                let newState = prevState;
+                for (const update of updates){
+                    newState = typeof update === 'function' ? update(newState) : update;
+                }
+                return newState;
+            });
         });
     }, []);
     useUnmount(()=>{
@@ -2498,13 +2509,13 @@ function usePageLeave() {
         const from = event.relatedTarget || event.toElement;
         setIsLeft(!from);
     };
-    useEventListener('mouseout', handler, ()=>window, {
+    useEventListener('mouseout', handler, defaultWindow, {
         passive: true
     });
-    useEventListener('mouseleave', handler, ()=>document, {
+    useEventListener('mouseleave', handler, defaultDocument, {
         passive: true
     });
-    useEventListener('mouseenter', handler, ()=>document, {
+    useEventListener('mouseenter', handler, defaultDocument, {
         passive: true
     });
     return isLeft;
@@ -2532,7 +2543,7 @@ const usePermission = (permissionDesc)=>{
             permissionStatus = status;
             on(permissionStatus, 'change', onChange);
             onChange();
-        }).catch(noop);
+        }).catch(noop$1);
         return ()=>{
             permissionStatus && off(permissionStatus, 'change', onChange);
             mounted = false;
@@ -2670,7 +2681,7 @@ const useScratch = (target, options = {})=>{
                     isScratching: true
                 });
                 refState.current = newState;
-                (optionsRef.current.onScratch || noop)(newState);
+                (optionsRef.current.onScratch || noop$1)(newState);
                 return newState;
             });
         });
@@ -2684,7 +2695,7 @@ const useScratch = (target, options = {})=>{
             isScratching: false
         });
         refState.current = endState;
-        (optionsRef.current.onScratchEnd || noop)(endState);
+        (optionsRef.current.onScratchEnd || noop$1)(endState);
         setState(endState);
     };
     const startScratching = (docX, docY)=>{
@@ -2717,7 +2728,7 @@ const useScratch = (target, options = {})=>{
             posY: elY
         };
         refState.current = newState;
-        (optionsRef.current.onScratchStart || noop)(newState);
+        (optionsRef.current.onScratchStart || noop$1)(newState);
         setState(newState);
     };
     useEventListener('mousedown', (event)=>{
@@ -2744,7 +2755,7 @@ const useScratch = (target, options = {})=>{
     return state;
 };
 
-const useScriptTag = (src, onLoaded = noop, options = defaultOptions$1)=>{
+const useScriptTag = (src, onLoaded = noop$1, options = defaultOptions$1)=>{
     const { immediate = true, manual = false, type = 'text/javascript', async = true, crossOrigin, referrerPolicy, noModule, defer, attrs = {} } = options;
     const scriptTag = useRef(null);
     const _promise = useRef(null);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reactuses/core",
-  "version": "6.1.8",
+  "version": "6.1.10",
   "license": "Unlicense",
   "homepage": "https://www.reactuse.com/",
   "repository": {
@@ -75,7 +75,6 @@
   },
   "dependencies": {
     "@microsoft/fetch-event-source": "^2.0.1",
-    "@testing-library/dom": "^10.4.0",
     "js-cookie": "^3.0.5",
     "lodash-es": "^4.17.21",
     "screenfull": "^5.0.0",
@@ -84,6 +83,7 @@
   "devDependencies": {
     "@jsdevtools/version-bump-prompt": "^6.1.0",
     "@reactuses/ts-document": "workspace:*",
+    "@testing-library/dom": "^10.4.0",
     "@testing-library/react": "^16.1.0",
     "@types/jest": "^27.5.2",
     "@types/js-cookie": "^3.0.3",