rocket-cursor-component 2.1.0 → 2.1.1

package/README.md

@@ -87,6 +87,9 @@ Here's a demo of the Rocket Cursor in action:
 - **Changed**: Rocket aligns by its nose to the cursor position (manual offsets removed)
 - **Changed**: Demo cleaned up to match the new API (no offset sliders)
 
+### 2.1.1
+- **Fixed**: Flame visibility now updates reliably
+
 ### 2.0.0 (React 19+ Only)
 - **BREAKING**: Now requires React 19.0.0 or higher
 - **NEW**: Added `useId()` for unique SVG gradient IDs (prevents collisions)

package/dist/rocket.Cursor.js

@@ -32,6 +32,7 @@ const RocketCursor = ({ size = 50, threshold = 10, flameHideTimeout = 300, isVis
     const lastMoveTs = useRef(Date.now());
     const rafRef = useRef(null);
     const [isMoving, setIsMoving] = useState(false);
+    const isMovingRef = useRef(false);
     const [visible, setVisible] = useState(isVisible);
     const lastSignificantPosition = useRef(Object.assign({}, target.current));
     const flameTimeoutRef = useRef(null);
@@ -70,16 +71,21 @@ const RocketCursor = ({ size = 50, threshold = 10, flameHideTimeout = 300, isVis
             };
         }
         setIsMoving(true);
+        isMovingRef.current = true;
         if (flameTimeoutRef.current) {
             window.clearTimeout(flameTimeoutRef.current);
         }
-        flameTimeoutRef.current = window.setTimeout(() => setIsMoving(false), flameHideTimeout);
+        flameTimeoutRef.current = window.setTimeout(() => {
+            setIsMoving(false);
+            isMovingRef.current = false;
+        }, flameHideTimeout);
     }, [threshold, flameHideTimeout, isVisible]);
     const handleMouseOut = useCallback((e) => {
         const rel = e.relatedTarget;
         if (!rel || rel.nodeName === "HTML") {
             setVisible(false);
             setIsMoving(false);
+            isMovingRef.current = false;
         }
     }, []);
     const handleVisibilityChange = useCallback(() => {
@@ -120,7 +126,8 @@ const RocketCursor = ({ size = 50, threshold = 10, flameHideTimeout = 300, isVis
                 }
             }
             if (flameRef.current) {
-                flameRef.current.style.opacity = showFlame && isMoving ? "1" : "0";
+                flameRef.current.style.opacity =
+                    showFlame && isMovingRef.current ? "1" : "0";
             }
             rafRef.current = requestAnimationFrame(step);
         };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rocket-cursor-component",
-  "version": "2.1.0",
+  "version": "2.1.1",
   "description": "A customizable React component that replaces the cursor with an animated rocket, featuring rotation and flame effects.",
   "main": "dist/rocket.Cursor.js",
   "types": "dist/rocket.Cursor.d.ts",