@reactuses/core 6.1.1 → 6.1.3

package/README.md

@@ -1,4 +1,11 @@
-# reactuse
+<p align="center">
+<a href="https://github.com/your-username/your-repo#gh-light-mode-only">
+  <img src="https://reactuse.com/img/og.png#gh-light-mode-only" alt="ReactUse - Collection of essential React Hooks" width="300">
+</a>
+<a href="https://github.com/your-username/your-repo#gh-dark-mode-only">
+  <img src="https://reactuse.com/img/og-dark.png#gh-dark-mode-only" alt="ReactUse - Collection of essential React Hooks" width="300">
+</a>
+</p>
 
 <p align="center">
   <img alt="NPM Version" src="https://img.shields.io/npm/v/@reactuses/core?style=for-the-badge&labelColor=24292e">
@@ -8,14 +15,6 @@
   <img alt="TypeScript Support" src="https://img.shields.io/badge/TypeScript-Support-blue?style=for-the-badge&labelColor=24292e">
 </p>
 
-```bash
-npm i @reactuses/core
-```
-
-**Collection of essential React Hooks Utilities.**
-
----
-
 ## MCP Support
 
 If you want to use the MCP (Model Context Protocol) integration with reactuse, you can easily set it up with the following configuration. This allows you to run the `@reactuses/mcp` utility via `npx` for enhanced command-line support and automation.

package/dist/index.cjs

@@ -1401,8 +1401,8 @@ function _async_to_generator$5(fn) {
         });
     };
 }
-function _extends$3() {
-    _extends$3 = Object.assign || function(target) {
+function _extends$4() {
+    _extends$4 = Object.assign || function(target) {
         for(var i = 1; i < arguments.length; i++){
             var source = arguments[i];
             for(var key in source){
@@ -1413,7 +1413,7 @@ function _extends$3() {
         }
         return target;
     };
-    return _extends$3.apply(this, arguments);
+    return _extends$4.apply(this, arguments);
 }
 const DEFAULT_OPTIONS = {
     multiple: true,
@@ -1442,7 +1442,7 @@ const useFileDialog = (options = defaultOptions$1)=>{
             if (!inputRef.current) {
                 return;
             }
-            const _options = _extends$3({}, DEFAULT_OPTIONS, options, localOptions);
+            const _options = _extends$4({}, DEFAULT_OPTIONS, options, localOptions);
             inputRef.current.multiple = _options.multiple;
             inputRef.current.accept = _options.accept;
             // Only set capture attribute if it's explicitly provided
@@ -1880,8 +1880,8 @@ function _async_to_generator$4(fn) {
         });
     };
 }
-function _extends$2() {
-    _extends$2 = Object.assign || function(target) {
+function _extends$3() {
+    _extends$3 = Object.assign || function(target) {
         for(var i = 1; i < arguments.length; i++){
             var source = arguments[i];
             for(var key in source){
@@ -1892,15 +1892,15 @@ function _extends$2() {
         }
         return target;
     };
-    return _extends$2.apply(this, arguments);
+    return _extends$3.apply(this, arguments);
 }
 const useInfiniteScroll = (target, onLoadMore, options = defaultOptions$1)=>{
     const savedLoadMore = useLatest(onLoadMore);
     var _options_direction;
     const direction = (_options_direction = options.direction) != null ? _options_direction : 'bottom';
     var _options_distance;
-    const state = useScroll(target, _extends$2({}, options, {
-        offset: _extends$2({
+    const state = useScroll(target, _extends$3({}, options, {
+        offset: _extends$3({
             [direction]: (_options_distance = options.distance) != null ? _options_distance : 0
         }, options.offset)
     }));
@@ -2627,6 +2627,131 @@ function getValue(position) {
     return getComputedStyle(document.documentElement).getPropertyValue(position);
 }
 
+function _extends$2() {
+    _extends$2 = Object.assign || function(target) {
+        for(var i = 1; i < arguments.length; i++){
+            var source = arguments[i];
+            for(var key in source){
+                if (Object.prototype.hasOwnProperty.call(source, key)) {
+                    target[key] = source[key];
+                }
+            }
+        }
+        return target;
+    };
+    return _extends$2.apply(this, arguments);
+}
+const initialState = {
+    isScratching: false
+};
+const useScratch = (target, options = {})=>{
+    const { disabled = false } = options;
+    const [state, setState] = useRafState(initialState);
+    const optionsRef = useLatest(options);
+    const refState = React.useRef(state);
+    const refScratching = React.useRef(false);
+    const refAnimationFrame = React.useRef(null);
+    const onMoveEvent = (docX, docY)=>{
+        if (!refScratching.current) {
+            return;
+        }
+        const el = getTargetElement(target);
+        if (!el) {
+            return;
+        }
+        if (refAnimationFrame.current !== null) {
+            cancelAnimationFrame(refAnimationFrame.current);
+        }
+        refAnimationFrame.current = requestAnimationFrame(()=>{
+            const { left, top } = el.getBoundingClientRect();
+            const elX = left + window.scrollX;
+            const elY = top + window.scrollY;
+            const x = docX - elX;
+            const y = docY - elY;
+            setState((oldState)=>{
+                const newState = _extends$2({}, oldState, {
+                    x,
+                    y,
+                    dx: x - (oldState.x || 0),
+                    dy: y - (oldState.y || 0),
+                    end: Date.now(),
+                    isScratching: true
+                });
+                refState.current = newState;
+                (optionsRef.current.onScratch || noop)(newState);
+                return newState;
+            });
+        });
+    };
+    const stopScratching = ()=>{
+        if (!refScratching.current) {
+            return;
+        }
+        refScratching.current = false;
+        const endState = _extends$2({}, refState.current, {
+            isScratching: false
+        });
+        refState.current = endState;
+        (optionsRef.current.onScratchEnd || noop)(endState);
+        setState(endState);
+    };
+    const startScratching = (docX, docY)=>{
+        const el = getTargetElement(target);
+        if (disabled || !el) {
+            return;
+        }
+        refScratching.current = true;
+        const { left, top } = el.getBoundingClientRect();
+        const elX = left + window.scrollX;
+        const elY = top + window.scrollY;
+        const x = docX - elX;
+        const y = docY - elY;
+        const time = Date.now();
+        const newState = {
+            isScratching: true,
+            start: time,
+            end: time,
+            docX,
+            docY,
+            x,
+            y,
+            dx: 0,
+            dy: 0,
+            elH: el.offsetHeight,
+            elW: el.offsetWidth,
+            elX,
+            elY,
+            posX: elX,
+            posY: elY
+        };
+        refState.current = newState;
+        (optionsRef.current.onScratchStart || noop)(newState);
+        setState(newState);
+    };
+    useEventListener('mousedown', (event)=>{
+        event.preventDefault();
+        startScratching(event.pageX || event.clientX, event.pageY || event.clientY);
+    }, target);
+    useEventListener('touchstart', (event)=>{
+        event.preventDefault();
+        startScratching(event.changedTouches[0].pageX || event.changedTouches[0].clientX, event.changedTouches[0].pageY || event.changedTouches[0].clientY);
+    }, target);
+    useEventListener('mousemove', (event)=>{
+        onMoveEvent(event.pageX || event.clientX, event.pageY || event.clientY);
+    }, defaultWindow);
+    useEventListener('touchmove', (event)=>{
+        onMoveEvent(event.changedTouches[0].pageX || event.changedTouches[0].clientX, event.changedTouches[0].pageY || event.changedTouches[0].clientY);
+    }, defaultWindow);
+    useEventListener('mouseup', stopScratching, defaultWindow);
+    useEventListener('touchend', stopScratching, defaultWindow);
+    useUnmount(()=>{
+        if (refAnimationFrame.current !== null) {
+            cancelAnimationFrame(refAnimationFrame.current);
+        }
+    });
+    return state;
+};
+
 const useScriptTag = (src, onLoaded = noop, options = defaultOptions$1)=>{
     const { immediate = true, manual = false, type = 'text/javascript', async = true, crossOrigin, referrerPolicy, noModule, defer, attrs = {} } = options;
     const scriptTag = React.useRef(null);
@@ -4397,6 +4522,7 @@ exports.useRafFn = useRafFn;
 exports.useRafState = useRafState;
 exports.useReducedMotion = useReducedMotion;
 exports.useResizeObserver = useResizeObserver;
+exports.useScratch = useScratch;
 exports.useScreenSafeArea = useScreenSafeArea;
 exports.useScriptTag = useScriptTag;
 exports.useScroll = useScroll;