@os-design/use-auto-scroll 1.0.30 → 1.0.32

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAMA,MAAM,WAAW,kBAAkB;IACjC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAyCD;;GAEG;AACH,eAAO,MAAM,qBAAqB,GAAI,GAAG,MAAM,EAAE,GAAG,MAAM,KAAG,OAAO,EAWnE,CAAC;AAeF,QAAA,MAAM,aAAa,GAAI,QAAO,kBAAuB,SAuHpD,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAMA,MAAM,WAAW,kBAAkB;IACjC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAyCD;;GAEG;AACH,eAAO,MAAM,qBAAqB,GAAI,GAAG,MAAM,EAAE,GAAG,MAAM,KAAG,OAAO,EAWnE,CAAC;AAeF,QAAA,MAAM,aAAa,GAAI,QAAO,kBAAuB,SAgIpD,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/index.js

@@ -72,8 +72,8 @@ const useAutoScroll = (props = {}) => {
   const cursorPositionRef = useRef(cursorPosition);
   const propsRef = useRef(getProps(props));
   const isScrollingRef = useRef(false);
-  const frameRef = useRef();
-  const timeoutRef = useRef();
+  const frameRef = useRef(undefined);
+  const timeoutRef = useRef(undefined);
 
   // Update the ref to the cursor position if it changes
   useEffect(() => {
@@ -121,6 +121,7 @@ const useAutoScroll = (props = {}) => {
       el.scrollTo(options);
     });
   }, []);
+  const scrollRef = useRef(null);
   const scroll = useCallback(() => {
     const {
       enabled
@@ -172,12 +173,15 @@ const useAutoScroll = (props = {}) => {
           left,
           top
         });
-        timeoutRef.current = setTimeout(scroll, FRAME_TIMEOUT);
+        timeoutRef.current = setTimeout(() => scrollRef.current?.(), FRAME_TIMEOUT);
         return;
       }
     }
     isScrollingRef.current = false;
   }, [getMaxDist, getScrollStep, scrollTo]);
+  useEffect(() => {
+    scrollRef.current = scroll;
+  }, [scroll]);
 
   // Start auto scrolling when the cursor position changes only if it is not already running
   useEffect(() => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@os-design/use-auto-scroll",
-  "version": "1.0.30",
+  "version": "1.0.32",
   "license": "UNLICENSED",
   "repository": "git@gitlab.com:os-team/libs/os-design.git",
   "type": "module",
@@ -23,16 +23,16 @@
     "build:esm": "cross-env BABEL_ENV=esm babel src --root-mode upward --extensions .ts,.tsx --out-dir dist",
     "build:types": "tsc -p tsconfig.build.json --emitDeclarationOnly --declaration --declarationDir dist",
     "build": "yarn clean && npm-run-all 'build:*'",
-    "ncu": "ncu -u '/^(?!(react|@types/react)$).*$/'"
+    "ncu": "ncu -u"
   },
   "publishConfig": {
     "access": "public"
   },
   "dependencies": {
-    "@os-design/use-cursor-position": "^1.0.28"
+    "@os-design/use-cursor-position": "^1.0.30"
   },
   "peerDependencies": {
-    "react": "18"
+    "react": "19"
   },
-  "gitHead": "60ba6c5b1658a4a302a3542e71e2ab3ce6407665"
+  "gitHead": "f333f60e39273574d2227cf0ee70b0c8897b2dde"
 }

package/src/index.mdx

@@ -1,4 +1,4 @@
-import { Meta } from '@storybook/blocks';
+import { Meta } from '@storybook/addon-docs/blocks';
 import UseEventExample from './index.example';
 
 <Meta title='Utils/useAutoScroll' />

package/src/index.ts

@@ -95,8 +95,8 @@ const useAutoScroll = (props: UseAutoScrollProps = {}) => {
   const cursorPositionRef = useRef(cursorPosition);
   const propsRef = useRef<Required<UseAutoScrollProps>>(getProps(props));
   const isScrollingRef = useRef(false);
-  const frameRef = useRef<number>();
-  const timeoutRef = useRef<NodeJS.Timeout>();
+  const frameRef = useRef<number>(undefined);
+  const timeoutRef = useRef<NodeJS.Timeout>(undefined);
 
   // Update the ref to the cursor position if it changes
   useEffect(() => {
@@ -141,6 +141,8 @@ const useAutoScroll = (props: UseAutoScrollProps = {}) => {
     });
   }, []);
 
+  const scrollRef = useRef<(() => void) | null>(null);
+
   const scroll = useCallback(() => {
     const { enabled } = propsRef.current;
     const { x, y } = cursorPositionRef.current;
@@ -197,7 +199,10 @@ const useAutoScroll = (props: UseAutoScrollProps = {}) => {
 
       if (left !== scrollLeft || top !== scrollTop) {
         scrollTo(el, { left, top });
-        timeoutRef.current = setTimeout(scroll, FRAME_TIMEOUT);
+        timeoutRef.current = setTimeout(
+          () => scrollRef.current?.(),
+          FRAME_TIMEOUT
+        );
         return;
       }
     }
@@ -205,6 +210,10 @@ const useAutoScroll = (props: UseAutoScrollProps = {}) => {
     isScrollingRef.current = false;
   }, [getMaxDist, getScrollStep, scrollTo]);
 
+  useEffect(() => {
+    scrollRef.current = scroll;
+  }, [scroll]);
+
   // Start auto scrolling when the cursor position changes only if it is not already running
   useEffect(() => {
     if (!isScrollingRef.current && props.enabled) scroll();