✨ feat(vscode): 代码阅读 React 组件卡片按钩子分区：状态 / 引用 / 读取的数据 / 派生值 / 副作用 / 事件处理；副作用、处理函数成子卡片放进卡片那一行下面（库规则新增把子块放进属性表某一行的机制，事件处理表点名称展开）

vscode/webview-ui/src/codeReader/codeReader.css

@@ -473,6 +473,28 @@ body:is(.vscode-light, .vscode-high-contrast-light) .cr-group[data-colored] { --
 .cr-table-row {
   border-top: 1px solid var(--cr-table-border);
 }
+/* 讲某个子块的行（React 组件的事件处理表）：第一格是按钮，悬停划下划线；展开时这一行淡淡垫上那一块的种类色 */
+.cr-table-row[data-open] {
+  background: color-mix(in srgb, var(--kind) 10%, transparent);
+}
+.cr-item-toggle {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  background: none;
+  font: inherit;
+  color: inherit;
+  text-align: left;
+  cursor: pointer;
+}
+.cr-item-toggle:hover {
+  text-decoration: underline;
+}
+
+/* 放进卡片属性表某一行下面的子块（副作用、展开的处理函数）：和表格一样往里缩一点 */
+.cr-slot {
+  padding-left: 5px;
+}
 .cr-table .cr-table-cell {
   padding: 2px 8px;
 }