From 45ead6d151f8e2f7af6a7e942899b7d03495c3f7 Mon Sep 17 00:00:00 2001
From: Vixalie <vixalie@outlook.com>
Date: Tue, 12 Aug 2025 14:28:44 +0800
Subject: [PATCH] =?UTF-8?q?refactor(components):=20=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E5=A4=8D=E9=80=89=E6=A1=86=E7=BB=84=E4=BB=B6=E5=B9=B6=E5=BC=95?=
 =?UTF-8?q?=E5=85=A5=20Dynamic=20=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Check.tsx | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/components/Check.tsx b/src/components/Check.tsx
index 47453ad..d98fb9a 100644
--- a/src/components/Check.tsx
+++ b/src/components/Check.tsx
@@ -9,6 +9,7 @@ import {
   ParentProps,
   Show,
 } from 'solid-js';
+import { Dynamic } from 'solid-js/web';
 
 interface CheckBoxProps {
   name?: string;
@@ -17,6 +18,11 @@ interface CheckBoxProps {
   onChange?: (checked?: boolean) => void;
 }
 
+const CheckIcon = [
+  () => <Icon icon="hugeicons:square" class="text-[14px] stroke-1" />,
+  () => <Icon icon="hugeicons:checkmark-square-03" class="text-[14px] stroke-1 text-primary" />,
+];
+
 const Check: ParentComponent<CheckBoxProps> = (props) => {
   const mProps = mergeProps<ParentProps<CheckBoxProps>[]>(
     {
@@ -38,19 +44,13 @@ const Check: ParentComponent<CheckBoxProps> = (props) => {
     if (mProps.disabled) {
       return;
     }
-    console.debug('[Check]before', internalChecked());
     setInternalChecked((prev) => !prev);
-    console.debug('[Check]after', internalChecked());
     mProps.onChange?.(internalChecked());
   };
 
   return (
     <div class="flex flex-row items-center gap-2 cursor-pointer" onClick={handleClick}>
-      <Icon
-        icon={internalChecked() ? 'hugeicons:checkmark-square-03' : 'hugeicons:square'}
-        class="text-[14px] stroke-1"
-        classList={{ 'text-primary': internalChecked() }}
-      />
+      <Dynamic component={CheckIcon[internalChecked() ? 1 : 0]} />
       <div>{mProps.children}</div>
       <Show when={isNotNil(mProps.name)}>
         <input type="hidden" name={mProps.name} value={internalChecked()} />