🐛 fix(vscode): 代码阅读跳到参数、导入项、多变量声明里的一个时只闪属性表里那一行,按源码位置判断
This commit is contained in:
1 parent
5b4ca903c5
commit
3ac1c783fb
14 files changed
+367
-47
No files matched your search
@@ -3,7 +3,7 @@ import type { PropertyItem, PropertyRow } from './types'
|
||||
import { ChevronDown, ChevronRight } from 'lucide-react'
|
||||
import { Fragment } from 'react'
|
||||
import { SegmentText } from './SegmentText'
|
||||
import { propertyRowId } from './viewState'
|
||||
import { propertyItemId, propertyRowId } from './viewState'
|
||||
|
||||
/** 子行里除最后一列以外各列的宽度(参数的名称、类型),最后一列占满剩下的;编辑区窄时按比例收,不把最后一列挤没 */
|
||||
const CELL_WIDTHS = ['min(150px, 28%)', 'min(220px, 38%)']
|
||||
@@ -14,13 +14,18 @@ function columns(count: number): string {
|
||||
}
|
||||
|
||||
/** 展开在一行下面的子行:左边一条竖线,每个子行几列对齐。 */
|
||||
function PropertyItems({ items }: { items: PropertyItem[] }): ReactElement {
|
||||
function PropertyItems({ rowId, items }: { rowId: string, items: PropertyItem[] }): ReactElement {
|
||||
return (
|
||||
<div className="flex gap-2.5 pl-[5px]">
|
||||
<div className="cr-guide w-px shrink-0" />
|
||||
<div className="flex min-w-0 flex-1 flex-col gap-0.5">
|
||||
{items.map((item, index) => (
|
||||
<div key={index} className="grid gap-x-3" style={{ gridTemplateColumns: columns(item.cells.length) }}>
|
||||
<div
|
||||
key={index}
|
||||
className="cr-prop-item grid gap-x-3"
|
||||
data-id={propertyItemId(rowId, index)}
|
||||
style={{ gridTemplateColumns: columns(item.cells.length) }}
|
||||
>
|
||||
{item.cells.map((cell, i) => (
|
||||
<p key={i} className="cr-code min-w-0">
|
||||
<SegmentText segments={cell} />
|
||||
@@ -49,7 +54,7 @@ export function PropertyGrid({ blockId, rows, collapsed, onToggleFold }: {
|
||||
const Chevron = folded ? ChevronRight : ChevronDown
|
||||
return (
|
||||
<Fragment key={index}>
|
||||
<div className="flex gap-3">
|
||||
<div className="cr-prop-row flex gap-3" data-id={id}>
|
||||
{items.length > 0
|
||||
? (
|
||||
<button
|
||||
@@ -68,7 +73,7 @@ export function PropertyGrid({ blockId, rows, collapsed, onToggleFold }: {
|
||||
<SegmentText segments={row.value} />
|
||||
</p>
|
||||
</div>
|
||||
{items.length > 0 && !folded && <PropertyItems items={items} />}
|
||||
{items.length > 0 && !folded && <PropertyItems rowId={id} items={items} />}
|
||||
</Fragment>
|
||||
)
|
||||
})}
|
||||
|
||||
Reference in new issue
Block a user