@particle-academy/react-fancy 3.4.2 → 3.4.3

package/dist/index.js

@@ -1,4 +1,4 @@
-import { forwardRef, createContext, useId, useRef, useEffect, useState, useCallback, useMemo, Children, isValidElement, cloneElement, useLayoutEffect, useContext, Fragment as Fragment$1 } from 'react';
+import { forwardRef, createContext, useId, useRef, useEffect, useState, useCallback, useMemo, Children, isValidElement, cloneElement, useContext, Fragment as Fragment$1, useLayoutEffect } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import * as LucideIcons from 'lucide-react';
@@ -3244,21 +3244,21 @@ function useFloatingPosition(anchorRef, floatingRef, options = {}) {
     if (!anchor || !floating) return;
     const anchorRect = anchor.getBoundingClientRect();
     const floatingRect = floating.getBoundingClientRect();
-    setPosition(getPosition(anchorRect, floatingRect, placement, offset));
+    const next = getPosition(anchorRect, floatingRect, placement, offset);
+    setPosition(
+      (prev) => prev.x === next.x && prev.y === next.y && prev.placement === next.placement ? prev : next
+    );
   }, [anchorRef, floatingRef, placement, offset]);
-  useLayoutEffect(() => {
-    if (!enabled) return;
-    let raf = 0;
-    let frames = 0;
-    const measure = () => {
-      update();
-      if (!floatingRef.current && frames++ < 20) {
-        raf = requestAnimationFrame(measure);
-      }
-    };
-    measure();
-    return () => cancelAnimationFrame(raf);
-  }, [update, enabled, floatingRef]);
+  useEffect(() => {
+    if (enabled) update();
+  });
+  useEffect(() => {
+    if (!enabled) {
+      setPosition(
+        (prev) => prev.x === -9999 ? prev : { x: -9999, y: -9999, placement }
+      );
+    }
+  }, [enabled, placement]);
   useEffect(() => {
     if (!enabled) return;
     window.addEventListener("scroll", update, true);