From 7a89b7838a3bea8f4934cee0b545c564e10a8d33 Mon Sep 17 00:00:00 2001
From: Lucas Yang <yangchenshin77@gmail.com>
Date: Thu, 29 Aug 2024 12:09:36 +0800
Subject: [PATCH] (react): Fix warn of spreading key

---
 packages/react/src/float.tsx | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/packages/react/src/float.tsx b/packages/react/src/float.tsx
index bc57a24a..cd7fdbd0 100644
--- a/packages/react/src/float.tsx
+++ b/packages/react/src/float.tsx
@@ -136,7 +136,7 @@ export interface FloatProps {
 export function renderReferenceElement(
   ReferenceNode: ReactElement,
   componentProps: FloatReferenceProps & Required<Pick<FloatReferenceProps, 'as'>>,
-  attrs: Record<string, any>,
+  { key, ...attrs }: Record<string, any>,
   context: ReferenceState
 ) {
   const { referenceRef } = context
@@ -146,6 +146,7 @@ export function renderReferenceElement(
   if (props.as === Fragment) {
     return (
       <ReferenceNode.type
+        key={key}
         {...ReferenceNode.props}
         {...attrs}
         ref={referenceRef}
@@ -155,7 +156,7 @@ export function renderReferenceElement(
 
   const Wrapper = props.as || 'div'
   return (
-    <Wrapper {...attrs} ref={referenceRef}>
+    <Wrapper key={key} {...attrs} ref={referenceRef}>
       <ReferenceNode.type {...ReferenceNode.props} />
     </Wrapper>
   )
@@ -169,7 +170,7 @@ export type RenderFloatingElementProps =
 export function renderFloatingElement(
   FloatingNode: ReactElement,
   componentProps: RenderFloatingElementProps,
-  attrs: Record<string, any>,
+  { key, ...attrs }: Record<string, any>,
   context: FloatingState
 ) {
   const { floatingRef, props: rootProps, mounted, setShow, referenceHidden, escaped, placement, floatingStyles, referenceElWidth } = context
@@ -245,6 +246,7 @@ export function renderFloatingElement(
     if (props.as === Fragment) {
       return (
         <FloatingNode.type
+          key={key}
           {...FloatingNode.props}
           {...nodeProps}
         />
@@ -253,7 +255,7 @@ export function renderFloatingElement(
 
     const Wrapper = props.as || 'div'
     return (
-      <Wrapper {...nodeProps}>
+      <Wrapper key={key} {...nodeProps}>
         <FloatingNode.type {...FloatingNode.props} />
       </Wrapper>
     )