From 046f4f720334dfa7555c370ea8b29aa0d2167bb7 Mon Sep 17 00:00:00 2001
From: Rainke <woshihepeng520@163.com>
Date: Sun, 14 Dec 2025 16:12:45 +0800
Subject: [PATCH] fix: simplify icon rendering by removing unnecessary ref and
 using innerHTML directly (#2200)

* fix: simplify icon rendering by removing unnecessary ref and using innerHTML directly

use vue-cli will get the warning: "Missing ref owner context. ref cannot be used on hoisted vnodes ...", and the icon does not render

* Update packages/components/src/__internal__/components/icon.tsx

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

---------

Co-authored-by: hep4 <hep4@chinatelecom.cn>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
---
 packages/components/src/__internal__/components/icon.tsx | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/packages/components/src/__internal__/components/icon.tsx b/packages/components/src/__internal__/components/icon.tsx
index e44142119b9..5522af3a0f5 100644
--- a/packages/components/src/__internal__/components/icon.tsx
+++ b/packages/components/src/__internal__/components/icon.tsx
@@ -15,11 +15,7 @@ export function Icon({ icon, class: className, onClick }: IconProps) {
     <span
       class={clsx('milkdown-icon', className)}
       onPointerdown={onClick}
-      ref={(el) => {
-        if (el && icon) {
-          ;(el as HTMLElement).innerHTML = DOMPurify.sanitize(icon.trim())
-        }
-      }}
+      innerHTML={icon ? DOMPurify.sanitize(icon.trim()) : undefined}
     />
   )
 }