✨ feat(vscode): 代码阅读卡片横排多个概念图标

vscode/src/codeReader/blockView.ts

@@ -1,7 +1,8 @@
 import type { Tree } from '@vscode/tree-sitter-wasm'
-import type { BlockAttributes, BlockKind, CodeBlock, DisplayName, EmbeddedCode, EmbeddedReading, Inline, KindBadge, LanguageAdapter, LibraryRule, LocalSymbol, Markdown, Node, PreviewTable, PreviewText, PropertyRow, RuleContext, Segment, SourceDocument, SourceRange, SourceSpan, StepBlocks, TextBlock, TokenRole, Translator } from './contract'
+import type { BlockAttributes, BlockConcept, BlockKind, CodeBlock, DisplayName, EmbeddedCode, EmbeddedReading, Inline, KindBadge, LanguageAdapter, LibraryRule, LocalSymbol, Markdown, Node, PreviewTable, PreviewText, PropertyRow, RuleCard, RuleContext, Segment, SourceDocument, SourceRange, SourceSpan, StepBlocks, TextBlock, TokenRole, Translator } from './contract'
 import type { TreeSitterRuntime } from './runtime'
 import { blockAttributes } from './attributes'
+import { KIND_ICONS } from './contract'
 import { commonIndent, splitLines } from './editText'
 import { activeRules, claimBlock, importsIn } from './libraryRules'
 import { BlockAnchors } from './qa/anchor'
@@ -29,7 +30,12 @@ interface BlockViewBase {
   defines?: SourceRange
   /** 筛选属性（含 kind），见 blockAttributes；库规则认领的块叠上规则给的，kind 是规则的种类 id。 */
   attributes: BlockAttributes
-  /** 库规则的卡片才有：种类的名字、颜色和图标（RuleCard.badge）。预览同类块一样默认收起它的子块。 */
+  /**
+   * 这块认出来的概念，从左到右：语言的种类（再加语言插件另认的），库规则的卡片再加规则的种类和规则另认的。
+   * 同一个 id 只留第一个。webview 按这个画图标，不自己用种类查。
+   */
+  concepts: BlockConcept[]
+  /** 库规则的卡片才有：筛选栏里这个种类的名字，卡片边框的颜色（RuleCard.badge）。图标在 concepts 里。预览同类块一样默认收起它的子块。 */
   badge?: KindBadge
   /** 库规则放进父卡片里的子块才有（见 RuleSlot）：画在父卡片属性表第 row 行下面，不排在父卡片的子块里。 */
   slot?: BlockSlot
@@ -297,6 +303,33 @@ export function toBlockViews(
       const [only] = steps
       return layer(steps, part.document, part.translator, NO_RULES)(steps.length === 1 && only ? only.children : steps, `${id}.`, scope, from)
     }
+    /**
+     * 这块的概念，从左到右，同一个 id 只留第一个：语言的种类（图标、名字用内置种类和翻译插件起的种类名），
+     * 语言插件另认的，库规则的卡片再加规则的种类和规则另认的。card 不填就是没有规则卡片（认成现成块的也算）。
+     */
+    function blockConcepts(block: CodeBlock, card?: RuleCard): BlockConcept[] {
+      const seen = new Set<string>()
+      const concepts: BlockConcept[] = []
+      const add = (concept: BlockConcept): void => {
+        if (seen.has(concept.id))
+          return
+        seen.add(concept.id)
+        concepts.push(concept)
+      }
+      add({
+        id: block.kind,
+        label: layerTranslator?.attributeNames?.values.kind?.[block.kind] ?? block.kind,
+        icon: KIND_ICONS[block.kind],
+      })
+      for (const concept of layerDocument.language.concepts?.(block) ?? [])
+        add(concept)
+      if (card) {
+        add({ id: card.kind, label: card.badge.label, icon: card.badge.icon, color: card.badge.color })
+        for (const concept of card.concepts ?? [])
+          add(concept)
+      }
+      return concepts
+    }
     /** 块照它自己的样子（语言插件报的，或库规则认成的属性表块）：编辑范围是 span，头部是块自己那部分，子块照常交给各规则看。scope 见 BlockAnchors.place */
     function plain(block: CodeBlock, span: SourceSpan, id: string, scope: string): BlockView {
       const name = ownName(block)
@@ -309,6 +342,7 @@ export function toBlockViews(
         headerEndLine: block.header.endRow,
         ...(name && { defines: { startIndex: name.startIndex, endIndex: name.endIndex } }),
         attributes: blockAttributes(block),
+        concepts: blockConcepts(block),
         children: [
           ...list(block.children, `${id}.`, inner),
           ...embeddedChildren(block, id, inner, block.children.length),
@@ -343,6 +377,7 @@ export function toBlockViews(
         headerEndLine: span.endRow,
         ...(defines && { defines: { startIndex: defines.startIndex, endIndex: defines.endIndex } }),
         attributes: { ...blockAttributes(block), ...attributes, kind },
+        concepts: blockConcepts(block, replacement),
         badge,
         children: list(kept, `${id}.`, inner, 0, slots),
         properties: rows,