separated position logic from initialiser

for increasing performance
adnan-td · Aug 29, 2023 · be0b8ed · be0b8ed
1 parent 9cc5e40
commit be0b8ed
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 10 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-mouse-follower",
-  "version": "1.1.6",
+  "version": "1.1.7",
   "description": "React mouse follower is a package based on react and framer motion. It provides components to add and customise cool mouse follower to your cursor",
   "repository": {
     "type": "git",

diff --git a/src/component/follower_init.tsx b/src/component/follower_init.tsx
@@ -5,10 +5,6 @@ import { FollowerDiv } from './follower_div.js';
 
 export function FollowerInitialiserComponent({ options }: { options: MouseSettings }) {
   const [isHovering, setIsHovering] = useState<boolean>(false);
-  const [pos, setPos] = useState<MousePosition>({
-    x: 0,
-    y: 0,
-  });
 
   useEffect(() => {
     const handleMouseLeave = () => {
@@ -29,6 +25,14 @@ export function FollowerInitialiserComponent({ options }: { options: MouseSettin
     };
   }, []);
 
+  return <PositionHandler options={options} show={isHovering && options.visible !== false} />;
+}
+
+function PositionHandler({ options, show }: { options: MouseSettings; show: boolean }) {
+  const [pos, setPos] = useState<MousePosition>({
+    x: 0,
+    y: 0,
+  });
   useEffect(() => {
     const mouseMove = (event: any) => {
       setPos({
@@ -42,9 +46,5 @@ export function FollowerInitialiserComponent({ options }: { options: MouseSettin
     };
   }, [options?.radius]);
 
-  return (
-    <AnimatePresence mode="wait">
-      {isHovering && options.visible !== false ? <FollowerDiv options={options} pos={pos} /> : null}
-    </AnimatePresence>
-  );
+  return <AnimatePresence mode="wait">{show ? <FollowerDiv options={options} pos={pos} /> : null}</AnimatePresence>;
 }