From c8d83d1485b4d5dbd7f29eab037f45ae281f285b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E7=88=B1=E5=90=83=E7=99=BD=E8=90=9D?=
 =?UTF-8?q?=E5=8D=9C?= <smith3816@gmail.com>
Date: Thu, 26 Oct 2023 17:53:42 +0800
Subject: [PATCH] feat: Tooltip ref support nativeElement (#463)

---
 package.json         |  2 +-
 src/Tooltip.tsx      |  3 ++-
 tests/index.test.tsx | 16 ++++++++++++++--
 3 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index d5c48a6..6b6c22e 100644
--- a/package.json
+++ b/package.json
@@ -41,7 +41,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.11.2",
-    "@rc-component/trigger": "^1.17.0",
+    "@rc-component/trigger": "^1.18.0",
     "classnames": "^2.3.1"
   },
   "devDependencies": {
diff --git a/src/Tooltip.tsx b/src/Tooltip.tsx
index 1cfc415..944f711 100644
--- a/src/Tooltip.tsx
+++ b/src/Tooltip.tsx
@@ -43,6 +43,7 @@ export interface TooltipProps
 }
 
 export interface TooltipRef {
+  nativeElement: HTMLElement;
   forceAlign: VoidFunction;
 }
 
@@ -74,7 +75,7 @@ const Tooltip = (props: TooltipProps, ref: React.Ref<TooltipRef>) => {
   } = props;
 
   const triggerRef = useRef<TriggerRef>(null);
-  useImperativeHandle(ref, () => triggerRef.current as TriggerRef);
+  useImperativeHandle(ref, () => triggerRef.current);
 
   const extraProps: Partial<TooltipProps & TriggerProps> = { ...restProps };
   if ('visible' in props) {
diff --git a/tests/index.test.tsx b/tests/index.test.tsx
index e852993..d167d0c 100644
--- a/tests/index.test.tsx
+++ b/tests/index.test.tsx
@@ -1,6 +1,6 @@
 import { act, fireEvent, render } from '@testing-library/react';
 import React from 'react';
-import Tooltip from '../src';
+import Tooltip, { TooltipRef } from '../src';
 
 const verifyContent = (wrapper: HTMLElement, content: string) => {
   expect(wrapper.querySelector('.x-content').textContent).toBe(content);
@@ -188,7 +188,7 @@ describe('rc-tooltip', () => {
           placement="left"
           overlay={<strong className="x-content">Tooltip content</strong>}
           showArrow={{
-            className: 'abc'
+            className: 'abc',
           }}
         >
           <div className="target">Click this</div>
@@ -239,4 +239,16 @@ describe('rc-tooltip', () => {
     fireEvent.click(container.querySelector('.target'));
     expect(container.querySelector('.x-content')).toBeTruthy();
   });
+
+  it('ref support nativeElement', () => {
+    const nodeRef = React.createRef<TooltipRef>();
+
+    const { container } = render(
+      <Tooltip ref={nodeRef} overlay={<div />}>
+        <button />
+      </Tooltip>,
+    );
+
+    expect(nodeRef.current.nativeElement).toBe(container.querySelector('button'));
+  });
 });