From 3bb628c6d03a045dc275db72f83533b337a1940d Mon Sep 17 00:00:00 2001
From: Android <Android99@outlook.com>
Date: Sun, 14 Sep 2025 01:27:09 +0800
Subject: [PATCH] fix: error related to `IconProps`

---
 src/components/themes/chengdu/Icon.tsx   | 21 ++++++++++++---------
 src/components/themes/chongqing/Icon.tsx | 21 ++++++++++++---------
 2 files changed, 24 insertions(+), 18 deletions(-)

diff --git a/src/components/themes/chengdu/Icon.tsx b/src/components/themes/chengdu/Icon.tsx
index 2298f1f..c00011b 100644
--- a/src/components/themes/chengdu/Icon.tsx
+++ b/src/components/themes/chengdu/Icon.tsx
@@ -1,3 +1,4 @@
+import type { FC } from "react";
 import { Select } from "@douyinfe/semi-ui";
 import colors from "./define/colors";
 import type { EditorConfig } from "../../../interfaces/editor";
@@ -143,16 +144,17 @@ export const regicons = [
 ];
 
 export interface IconProps {
-  rotation: "0" | "90" | "180" | "270";
-  icon: string;
-  foreground?: string;
+  icon?: string;
   background?: string;
+  foreground?: string;
+  rotation?: "0" | "90" | "180" | "270";
 }
+
 export const iconDefaultProps: IconProps = {
-  rotation: "0",
   icon: "themes.chengdu.components.Icon.props.icon.exit2",
-  foreground: colors.exitforeground,
   background: colors.exitbackground,
+  foreground: colors.exitforeground,
+  rotation: "0"
 };
 
 export const iconEditorConfig = (t: (key: string) => string): EditorConfig => ({
@@ -198,12 +200,12 @@ export const iconEditorConfig = (t: (key: string) => string): EditorConfig => ({
 });
 
 function Icon({
-  rotation = iconDefaultProps.rotation,
   icon = iconDefaultProps.icon,
-  foreground = iconDefaultProps.foreground,
   background = iconDefaultProps.background,
+  foreground = iconDefaultProps.foreground,
+  rotation = iconDefaultProps.rotation
 }: IconProps) {
-  const IconComponent = regicons.find(i => i.label === icon)?.component;
+  const IconComponent = regicons.find(i => i.label === icon)?.component as FC<IconProps>;
 
   return (
     <div
@@ -212,9 +214,10 @@ function Icon({
     >
       {IconComponent ? (
         <IconComponent
+          icon={icon}
           background={background}
           foreground={foreground}
-          rotation={Number(rotation)}
+          rotation={rotation}
         />
       ) : null}
     </div>
diff --git a/src/components/themes/chongqing/Icon.tsx b/src/components/themes/chongqing/Icon.tsx
index 0cdc8d8..a425227 100644
--- a/src/components/themes/chongqing/Icon.tsx
+++ b/src/components/themes/chongqing/Icon.tsx
@@ -1,3 +1,4 @@
+import type { FC } from "react";
 import { Select } from "@douyinfe/semi-ui";
 import colors from "./define/colors";
 import type { EditorConfig } from "../../../interfaces/editor";
@@ -158,16 +159,17 @@ export const regicons = [
 ];
 
 export interface IconProps {
-  rotation: "0" | "90" | "180" | "270";
-  icon: string;
-  foreground?: string;
+  icon?: string;
   background?: string;
+  foreground?: string;
+  rotation?: "0" | "90" | "180" | "270";
 }
+
 export const iconDefaultProps: IconProps = {
-  rotation: "0",
   icon: "themes.chongqing.components.Icon.props.icon.train",
-  foreground: colors.foreground,
   background: colors.background,
+  foreground: colors.foreground,
+  rotation: "0"
 };
 
 export const iconEditorConfig = (t: (key: string) => string): EditorConfig => ({
@@ -213,12 +215,12 @@ export const iconEditorConfig = (t: (key: string) => string): EditorConfig => ({
 });
 
 function Icon({
-  rotation = iconDefaultProps.rotation,
   icon = iconDefaultProps.icon,
-  foreground = iconDefaultProps.foreground,
   background = iconDefaultProps.background,
+  foreground = iconDefaultProps.foreground,
+  rotation = iconDefaultProps.rotation
 }: IconProps) {
-  const IconComponent = regicons.find(i => i.label === icon)?.component;
+  const IconComponent = regicons.find(i => i.label === icon)?.component as FC<IconProps>;
 
   return (
     <div
@@ -227,9 +229,10 @@ function Icon({
     >
       {IconComponent ? (
         <IconComponent
+          icon={icon}
           background={background}
           foreground={foreground}
-          rotation={Number(rotation)}
+          rotation={rotation}
         />
       ) : null}
     </div>