✨ feat(vscode): React 文件照源码一块一张卡片，组件卡片只留名称、说明、构造参数

- 组件体的语句不再并进组件卡片，照源码顺序是它的子块；状态、引用、数据源、派生值、副作用、事件处理函数、渲染输出各成一张卡片，回调和函数里的语句是这些卡片下面的子卡片
- 普通变量、提前返回的 if、注释照语言默认的卡片；表格格子里只写名字和位置，去掉「改它的」「来自」格子里单独打开源码的那条路
- 用词改成书面叫法（更新位置、使用位置、计算表达式、依赖项、触发时机、清理函数、绑定事件、样式取决于……），新增 toggle-right、anchor、download、sigma、layout-template 五个种类图标
- 夹具加上 luffy 的 QueuedBubble.tsx、PlanChecklist.tsx，规格的 React 一节照新样子改写

vscode/src/codeReader/contract.ts

@@ -555,12 +555,11 @@ export interface Segment { text: string, role: TokenRole, offset?: number, refer
  * 框的样式，决定框头的图标和框的颜色：
  * - iteration：写在表达式里的遍历（渲染大纲里 `.map` 的「对 … 的每一项」也是），图标、颜色同「循环」块；
  * - condition：按条件（渲染大纲里 `cond &&` 的「当 … 时」、三元的「如果 …」），图标、颜色同「条件」块；
- * - branch：条件的一支（「是」「否」「否则」），颜色同「条件」块，不带图标；
- * - skip：这个条件下不渲染（提前 `return null`），图标、颜色同「返回」块；
+ * - branch：条件的一支（三元的「是」「否」），颜色同「条件」块，不带图标；
  * - tag：小标签（名称后面的「具名导出」、属性名后面的「回调」），只有框头的字，颜色是 SegmentGroup.color；
  * - classes：收起来的一串类名（「样式 N 个类」），中性色，点开、悬停看 SegmentGroup.detail。
  */
-export type GroupStyle = 'iteration' | 'condition' | 'branch' | 'skip' | 'tag' | 'classes'
+export type GroupStyle = 'iteration' | 'condition' | 'branch' | 'tag' | 'classes'
 
 /**
  * 框起来的一组词：译文里自成一体的一段（写在表达式里的遍历、渲染大纲一行前面的条件），预览把它画成嵌在前后文字里的一个小框，
@@ -595,40 +594,11 @@ export type PreviewText = Inline[] | Markdown
  */
 export interface Defines { defines?: SourceRange }
 
-/**
- * 能单独打开编辑的一段源码：这几行整行，去掉共同缩进，着色和块的 code / codeTokens 同一套切法。
- * 网页不自己切。点铅笔之后只出现这一段，不换整张卡片。
- */
-export interface SourceSnippet {
-  /** 起止行，0 起，含头含尾。 */
-  startLine: number
-  endLine: number
-  code: string
-  /** 着色，拼起来等于 code。 */
-  codeTokens: Segment[]
-}
-
-/**
- * 属性表一个子行的某一格里，能单独打开的一段源码。
- * cell 是第几格（0 起），from / to 是这一格文字里这一处的范围（含头不含尾）。
- */
-export interface CellEdit {
-  cell: number
-  from: number
-  to: number
-  snippet: SourceSnippet
-}
-
 /** 属性表里展开的一个子行：几列对齐的格子，例如参数的名称 / 类型 / 默认值、字典一项的键 / 值。 */
 export interface PropertyItem extends Defines {
   cells: Inline[][]
   /** 展开在这个子行下面的下一层子行（字典 / 对象的值又是字典 / 对象时，它的各项）；一层层可以一直往下套。 */
   items?: PropertyItem[]
-  /**
-   * 这一行里能单独打开的几段源码（状态「改它的」的每一处、读取的数据的「来自」）。
-   * 打开后只出现那一段。没有能打开的就不写。
-   */
-  edits?: CellEdit[]
   /**
    * 排在这一行最后一格里、那格文字下面的表：实参表里一个实参的值里有跨几行写的调用时，是那个调用的实参表，
    * 表里的行又可以带 table，一层层往下套。总是展开的。
@@ -774,7 +744,7 @@ export interface ThemeColor { dark: string, light: string }
 /**
  * 种类图标：插件自己定义的一组 lucide 图标（https://lucide.dev/icons 上的 kebab-case 名字）。前 26 个给内置种类（几种共用一个：
  * 命令、管道、执行共用 square-terminal，解释器、解析指令共用 terminal，选项、设置共用 sliders-horizontal，字段、标签共用 tag），
- * 后面的给库规则的种类（React 组件的原子、副作用的闪电、事件处理的点击手势也在里面）；库规则的种类（KindBadge.icon）只能从这组里挑，要新图标就加进这组（webview 的 kindIcons.tsx 同时给它配上图标），
+ * 后面的给库规则的种类（React 的组件、状态、引用、数据源、派生值、副作用、事件处理函数、渲染输出也在里面）；库规则的种类（KindBadge.icon）只能从这组里挑，要新图标就加进这组（webview 的 kindIcons.tsx 同时给它配上图标），
  * 没有按任意名字找图标的路。
  */
 export const KIND_ICON_NAMES = [
@@ -813,6 +783,11 @@ export const KIND_ICON_NAMES = [
   'atom',
   'zap',
   'mouse-pointer-click',
+  'toggle-right',
+  'anchor',
+  'download',
+  'sigma',
+  'layout-template',
 ] as const
 
 export type KindIconName = (typeof KIND_ICON_NAMES)[number]
@@ -920,7 +895,7 @@ export interface RuleCard {
 /**
  * 卡片里的一处子块：block（原块 children 里的对象，没并进来的）不排在卡片后面，画在卡片第 row 行下面当子卡片，
  * 照常转成块（翻译、库规则、编辑、问 AI、差异都照常）。item 是这一行的子行里讲它的那一个（第几个，0 起）：
- * 这时它默认收着，点那个子行的第一格才展开、一次只展开一个（React 组件的事件处理表点名称展开处理函数）。
+ * 这时它默认收着，点那个子行的第一格才展开、一次只展开一个（Rust 实现块的方法表点方法名展开那张函数卡）。
  */
 export interface RuleSlot {
   block: CodeBlock
@@ -947,8 +922,6 @@ export interface RuleContext {
   displayLanguage?: string
   /** 用当前翻译插件把一个表达式或类型节点翻成一行译文（Translator.expression）：名字带源码下标，能跳到定义、高亮各处出现；没有翻译插件时照抄源码。 */
   translate: (node: Node) => Inline[]
-  /** 一个节点占的整行源码和着色（见 SourceSnippet），和块视图切行是同一套。规则把它挂在译文旁边。 */
-  snippet: (node: Node) => SourceSnippet
   /** 用当前翻译插件取一段说明文字（Translator.doc）；没有翻译插件、没有文字时没有。 */
   doc: (node: Node) => Markdown | undefined
   /**