chore: refactor

Author: zombieJ

package.json

@@ -43,7 +43,7 @@
   "dependencies": {
     "@rc-component/motion": "^1.1.4",
     "@rc-component/portal": "^2.2.0",
-    "@rc-component/resize-observer": "^1.1.0",
+    "@rc-component/resize-observer": "^1.1.1",
     "@rc-component/util": "^1.2.1",
     "clsx": "^2.1.1"
   },

src/index.tsx

@@ -1,10 +1,10 @@
 import Portal from '@rc-component/portal';
 import { clsx } from 'clsx';
 import type { CSSMotionProps } from '@rc-component/motion';
-// TODO: Replace ResizeObserver with useResizeObserver
-import ResizeObserver, { useResizeObserver } from '@rc-component/resize-observer';
+import { useResizeObserver } from '@rc-component/resize-observer';
 import { isDOM } from '@rc-component/util/lib/Dom/findDOMNode';
 import { getShadowRoot } from '@rc-component/util/lib/Dom/shadow';
+import {  useComposeRef } from '@rc-component/util/lib/ref';
 import useEvent from '@rc-component/util/lib/hooks/useEvent';
 import useId from '@rc-component/util/lib/hooks/useId';
 import useLayoutEffect from '@rc-component/util/lib/hooks/useLayoutEffect';
@@ -783,22 +783,25 @@ export function generateTrigger(
       y: arrowY,
     };
 
+    // =================== Resize Observer ===================
+    // Use hook to observe target element resize
+    // Pass targetEle directly instead of a function so the hook will re-observe when target changes
+    useResizeObserver(mergedOpen, targetEle, onTargetResize);
+
+    // Compose refs
+    const mergedRef = useComposeRef(setTargetRef, (child as any).ref);
+
     // Child Node
     const triggerNode = React.cloneElement(child, {
+      ref: mergedRef,
       ...mergedChildrenProps,
       ...passedProps,
     });
 
     // Render
     return (
       <>
-        <ResizeObserver
-          disabled={!mergedOpen}
-          ref={setTargetRef}
-          onResize={onTargetResize}
-        >
-          {triggerNode}
-        </ResizeObserver>
+        {triggerNode}
         {rendedRef.current && (!uniqueContext || !unique) && (
           <TriggerContext.Provider value={context}>
             <Popup