✨ feat(vscode): 代码阅读把推导式换成按读的顺序重排的遍历小框

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

@@ -1,7 +1,8 @@
 import type { ReactElement } from 'react'
-import type { PropertyItem, PropertyRow, Segment } from './types'
+import type { Inline, PropertyItem, PropertyRow } from './types'
 import { ChevronDown, ChevronRight } from 'lucide-react'
 import { Fragment } from 'react'
+import { inlineText } from './segments'
 import { SegmentText } from './SegmentText'
 import { TextPreview } from './TextPreview'
 import { propertyItemId, propertyRowId } from './viewState'
@@ -20,15 +21,11 @@ interface Folding {
   onToggleFold: (id: string) => void
 }
 
-function segmentsText(segments: Segment[]): string {
-  return segments.map(segment => segment.text).join('')
-}
-
 /**
  * 子行的第一列（字典的键）：带下一层的子行前面是折叠箭头（图标、大小、颜色同属性行的），点箭头或这一列切换；
  * 同一层里不带下一层的子行在同样的位置留空，第一列才对得齐。
  */
-function ItemHead({ id, cell, foldable, folding }: { id: string, cell: Segment[], foldable: boolean, folding: Folding }): ReactElement {
+function ItemHead({ id, cell, foldable, folding }: { id: string, cell: Inline[], foldable: boolean, folding: Folding }): ReactElement {
   if (!foldable) {
     return (
       <div className="flex min-w-0 gap-1">
@@ -45,7 +42,7 @@ function ItemHead({ id, cell, foldable, folding }: { id: string, cell: Segment[]
     <button
       type="button"
       className="group flex min-w-0 items-start gap-1 rounded-sm text-left"
-      aria-label={`${folded ? '展开' : '折叠'}${segmentsText(cell)}`}
+      aria-label={`${folded ? '展开' : '折叠'}${inlineText(cell)}`}
       aria-expanded={!folded}
       onClick={() => folding.onToggleFold(id)}
     >