From 768f5999f84dd42d5fe05245624bf7e6f32d3095 Mon Sep 17 00:00:00 2001
From: sea <45450994+warmthsea@users.noreply.github.com>
Date: Sun, 17 Nov 2024 14:14:25 +0800
Subject: [PATCH] improvement(components): [tooltip] dom ref types (#18923)

---
 docs/en-US/component/tooltip.md             | 18 +++++++++---------
 packages/components/tooltip/src/content.vue |  5 +++--
 packages/components/tooltip/src/tooltip.vue |  4 ++--
 3 files changed, 14 insertions(+), 13 deletions(-)

diff --git a/docs/en-US/component/tooltip.md b/docs/en-US/component/tooltip.md
index 70c588b823..4920a96c6a 100644
--- a/docs/en-US/component/tooltip.md
+++ b/docs/en-US/component/tooltip.md
@@ -180,12 +180,12 @@ tooltip/animations
 
 ### Exposes
 
-| Name                 | Description                                                       | Type                                              |
-| -------------------- | ----------------------------------------------------------------- | ------------------------------------------------- |
-| popperRef            | el-popper component instance                                      | ^[object]`Ref<PopperInstance \| null>`            |
-| contentRef           | el-tooltip-content component instance                             | ^[object]`Ref<TooltipContentInstance \| null>`    |
-| isFocusInsideContent | validate current focus event is trigger inside el-tooltip-content | ^[Function]`() => boolean \| undefined`           |
-| updatePopper         | update el-popper component instance                               | ^[Function]`() => void`                           |
-| onOpen               | expose onOpen function to mange el-tooltip open state             | ^[Function]`(event?: Event \| undefined) => void` |
-| onClose              | expose onClose function to mange el-tooltip open state            | ^[Function]`(event?: Event \| undefined) => void` |
-| hide                 | expose hide function                                              | ^[Function]`(event?: Event \| undefined) => void` |
+| Name                 | Description                                                       | Type                                                |
+| -------------------- | ----------------------------------------------------------------- | --------------------------------------------------- |
+| popperRef            | el-popper component instance                                      | ^[object]`Ref<PopperInstance \| undefined>`         |
+| contentRef           | el-tooltip-content component instance                             | ^[object]`Ref<TooltipContentInstance \| undefined>` |
+| isFocusInsideContent | validate current focus event is trigger inside el-tooltip-content | ^[Function]`() => boolean \| undefined`             |
+| updatePopper         | update el-popper component instance                               | ^[Function]`() => void`                             |
+| onOpen               | expose onOpen function to mange el-tooltip open state             | ^[Function]`(event?: Event \| undefined) => void`   |
+| onClose              | expose onClose function to mange el-tooltip open state            | ^[Function]`(event?: Event \| undefined) => void`   |
+| hide                 | expose hide function                                              | ^[Function]`(event?: Event \| undefined) => void`   |
diff --git a/packages/components/tooltip/src/content.vue b/packages/components/tooltip/src/content.vue
index 42c4c884d3..5ada454b7a 100644
--- a/packages/components/tooltip/src/content.vue
+++ b/packages/components/tooltip/src/content.vue
@@ -51,6 +51,7 @@ import { ElPopperContent } from '@element-plus/components/popper'
 import ElTeleport from '@element-plus/components/teleport'
 import { TOOLTIP_INJECTION_KEY } from './constants'
 import { useTooltipContentProps } from './content'
+import type { PopperContentInstance } from '@element-plus/components/popper'
 
 defineOptions({
   name: 'ElTooltipContent',
@@ -61,8 +62,8 @@ const props = defineProps(useTooltipContentProps)
 
 const { selector } = usePopperContainerId()
 const ns = useNamespace('tooltip')
-// TODO any is temporary, replace with `InstanceType<typeof ElPopperContent> | null` later
-const contentRef = ref<any>(null)
+
+const contentRef = ref<PopperContentInstance>()
 let stopHandle: ReturnType<typeof onClickOutside>
 const {
   controlled,
diff --git a/packages/components/tooltip/src/tooltip.vue b/packages/components/tooltip/src/tooltip.vue
index 9436596675..114bd935bf 100644
--- a/packages/components/tooltip/src/tooltip.vue
+++ b/packages/components/tooltip/src/tooltip.vue
@@ -70,6 +70,7 @@ import { TOOLTIP_INJECTION_KEY } from './constants'
 import { tooltipEmits, useTooltipModelToggle, useTooltipProps } from './tooltip'
 import ElTooltipTrigger from './trigger.vue'
 import ElTooltipContent from './content.vue'
+import type { TooltipContentInstance } from './content'
 import type { PopperInstance } from '@element-plus/components/popper'
 
 defineOptions({
@@ -83,8 +84,7 @@ usePopperContainer()
 
 const id = useId()
 const popperRef = ref<PopperInstance>()
-// TODO any is temporary, replace with `TooltipContentInstance` later
-const contentRef = ref<any>()
+const contentRef = ref<TooltipContentInstance>()
 
 const updatePopper = () => {
   const popperComponent = unref(popperRef)