♻️ refactor(vscode): 代码阅读的种类图标改成插件自己定义的一组（契约里的封闭名字集合），webview 只带这些图标，不再打包 lucide 全套

vscode/webview-ui/src/codeReader/kindIcons.tsx

@@ -1,13 +1,64 @@
 import type { LucideIcon } from 'lucide-react'
 import type { ReactElement } from 'react'
-import type { BlockKind, BlockView } from './types'
-import { icons, SquareDashed } from 'lucide-react'
+import type { BlockKind, BlockView, KindIconName } from './types'
+import {
+  Box,
+  Braces,
+  CalendarClock,
+  Code,
+  CornerDownLeft,
+  CornerDownRight,
+  Database,
+  Globe,
+  Import,
+  ListOrdered,
+  Lock,
+  MessageSquareText,
+  Package,
+  Repeat,
+  ServerCog,
+  Shield,
+  ShieldAlert,
+  ShieldCheck,
+  Split,
+  SquareFunction,
+  Tag,
+  TriangleAlert,
+  Variable,
+} from 'lucide-react'
+
+/** 插件定义的这组种类图标，每个名字一个 lucide 图标（逐个 import，打包只带这些）。 */
+export const KIND_ICON_COMPONENTS: Record<KindIconName, LucideIcon> = {
+  'import': Import,
+  'square-function': SquareFunction,
+  'box': Box,
+  'braces': Braces,
+  'list-ordered': ListOrdered,
+  'triangle-alert': TriangleAlert,
+  'tag': Tag,
+  'lock': Lock,
+  'variable': Variable,
+  'split': Split,
+  'corner-down-right': CornerDownRight,
+  'repeat': Repeat,
+  'shield': Shield,
+  'shield-alert': ShieldAlert,
+  'shield-check': ShieldCheck,
+  'corner-down-left': CornerDownLeft,
+  'code': Code,
+  'message-square-text': MessageSquareText,
+  'database': Database,
+  'package': Package,
+  'server-cog': ServerCog,
+  'calendar-clock': CalendarClock,
+  'globe': Globe,
+}
 
 /**
- * 内置种类的图标（lucide 图标名，和库规则给的 badge.icon 同一种写法）：块左边只画图标，名字是悬停提示。
+ * 内置种类的图标：块左边只画图标，名字是悬停提示。
  * 同一类语义共用一个颜色（codeReader.css 的 --cr-kind-*：常量 / 变量 / 字段都是数据，尝试 / 捕获都是异常处理），图标区分具体是哪种。
  */
-export const KIND_ICONS: Record<BlockKind, string> = {
+export const KIND_ICONS: Record<BlockKind, KindIconName> = {
   import: 'import',
   function: 'square-function',
   class: 'box',
@@ -28,21 +79,13 @@ export const KIND_ICONS: Record<BlockKind, string> = {
   comment: 'message-square-text',
 }
 
-const LUCIDE: Record<string, LucideIcon | undefined> = icons
-
-/** lucide 图标名（kebab-case，`square-function`）→ 图标组件；认不出的名字（规则写错了）画虚线方块。 */
-export function lucideIcon(name: string): LucideIcon {
-  return LUCIDE[name.replace(/(?:^|-)([a-z0-9])/g, (_, first: string) => first.toUpperCase())] ?? SquareDashed
-}
-
-const BUILT_IN: Partial<Record<string, string>> = KIND_ICONS
-
 /**
  * 块左边的种类：只画图标，和一行字等高（20px 的框、16px 的图形），颜色是种类色（--kind）。图标是库规则给的（badge.icon），
- * 没有就按内置种类查 KIND_ICONS；名字（翻译插件给种类起的，库规则的种类是规则给的）写在悬停提示（title）和读屏念的 aria-label 里。
+ * 没有就是内置种类的（KIND_ICONS，没带 badge 的块 kind 是 BlockKind）；名字（翻译插件给种类起的，库规则的种类是规则给的）
+ * 写在悬停提示（title）和读屏念的 aria-label 里。
  */
 export function KindIcon({ block, name }: { block: Pick<BlockView, 'kind' | 'badge'>, name: string }): ReactElement {
-  const Icon = lucideIcon(block.badge?.icon ?? BUILT_IN[block.kind] ?? '')
+  const Icon = KIND_ICON_COMPONENTS[block.badge?.icon ?? KIND_ICONS[block.kind as BlockKind]]
   return (
     <span className="cr-kind flex size-5 shrink-0 items-center justify-center" role="img" title={name} aria-label={name}>
       <Icon size={16} strokeWidth={2.2} aria-hidden />