@principal-ai/subsystems-react 0.49.0 → 0.50.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/pierre/PierreFileView.d.ts +1 -1
- package/dist/pierre/PierreFileView.d.ts.map +1 -1
- package/dist/pierre/PierreFileView.js +2 -1
- package/dist/pierre/PierreFileView.js.map +1 -1
- package/dist/pierre/PierreSnippetView.d.ts +1 -1
- package/dist/pierre/PierreSnippetView.d.ts.map +1 -1
- package/dist/pierre/PierreSnippetView.js +2 -1
- package/dist/pierre/PierreSnippetView.js.map +1 -1
- package/dist/pierre/PierreTrailCodeView.d.ts +7 -1
- package/dist/pierre/PierreTrailCodeView.d.ts.map +1 -1
- package/dist/pierre/PierreTrailCodeView.js +71 -18
- package/dist/pierre/PierreTrailCodeView.js.map +1 -1
- package/dist/pierre/pierreBackground.d.ts +36 -2
- package/dist/pierre/pierreBackground.d.ts.map +1 -1
- package/dist/pierre/pierreBackground.js +40 -13
- package/dist/pierre/pierreBackground.js.map +1 -1
- package/dist/pierre/visibleStep.d.ts +48 -0
- package/dist/pierre/visibleStep.d.ts.map +1 -0
- package/dist/pierre/visibleStep.js +53 -0
- package/dist/pierre/visibleStep.js.map +1 -0
- package/dist/subsystem/FileDrawer.d.ts +10 -1
- package/dist/subsystem/FileDrawer.d.ts.map +1 -1
- package/dist/subsystem/FileDrawer.js +61 -40
- package/dist/subsystem/FileDrawer.js.map +1 -1
- package/dist/subsystem/SubsystemComponentGraph.d.ts +6 -0
- package/dist/subsystem/SubsystemComponentGraph.d.ts.map +1 -1
- package/dist/subsystem/SubsystemComponentGraph.js +21 -10
- package/dist/subsystem/SubsystemComponentGraph.js.map +1 -1
- package/package.json +1 -1
- package/src/pierre/PierreFileView.tsx +2 -1
- package/src/pierre/PierreSnippetView.tsx +2 -1
- package/src/pierre/PierreTrailCodeView.tsx +81 -22
- package/src/pierre/pierreBackground.ts +62 -12
- package/src/pierre/visibleStep.test.ts +108 -0
- package/src/pierre/visibleStep.ts +76 -0
- package/src/stories/Subsystem/ComponentGraph/Flows.stories.tsx +6 -0
- package/src/subsystem/FileDrawer.tsx +112 -63
- package/src/subsystem/SubsystemComponentGraph.tsx +29 -5
|
@@ -16,10 +16,11 @@ export const FILE_DRAWER_HEIGHT_MS = 200;
|
|
|
16
16
|
* footprint so the canvas shrinks while open (nothing covered). Stays mounted
|
|
17
17
|
* so open/close/maximize animate. The header's maximize button (or a
|
|
18
18
|
* double-click) grows it over the whole graph column for whole-file reading. */
|
|
19
|
-
export function FileDrawer({ title, onClose, fillHeight = false, suppressEscape = false, hidden = false, children, }) {
|
|
19
|
+
export function FileDrawer({ title, onClose, fillHeight = false, suppressEscape = false, hidden = false, progress = null, children, }) {
|
|
20
20
|
const { theme } = useTheme();
|
|
21
21
|
const muted = theme.colors.textMuted ?? theme.colors.textSecondary;
|
|
22
22
|
const open = title !== null && !hidden;
|
|
23
|
+
const showProgress = progress != null && progress.total > 1;
|
|
23
24
|
const [closeHover, setCloseHover] = useState(false);
|
|
24
25
|
const [maxHover, setMaxHover] = useState(false);
|
|
25
26
|
// Full-height mode: the maximize button or double-clicking the header.
|
|
@@ -67,48 +68,68 @@ export function FileDrawer({ title, onClose, fillHeight = false, suppressEscape
|
|
|
67
68
|
transition: `height ${FILE_DRAWER_HEIGHT_MS}ms ease`,
|
|
68
69
|
}, children: [_jsxs("div", { onDoubleClick: () => setMaximized((v) => !v), style: {
|
|
69
70
|
display: "flex",
|
|
70
|
-
|
|
71
|
-
gap: 8,
|
|
72
|
-
padding: "6px 10px",
|
|
73
|
-
borderBottom: `1px solid ${theme.colors.border}`,
|
|
71
|
+
flexDirection: "column",
|
|
74
72
|
flexShrink: 0,
|
|
75
73
|
cursor: "default",
|
|
76
74
|
userSelect: "none",
|
|
77
|
-
}, children: [
|
|
78
|
-
|
|
79
|
-
minWidth: 0,
|
|
80
|
-
overflow: "hidden",
|
|
81
|
-
textOverflow: "ellipsis",
|
|
82
|
-
whiteSpace: "nowrap",
|
|
83
|
-
fontFamily: theme.fonts.monospace,
|
|
84
|
-
fontSize: theme.fontSizes[0],
|
|
85
|
-
color: muted,
|
|
86
|
-
}, children: title }), _jsx("button", { type: "button", onClick: () => setMaximized((v) => !v), onMouseEnter: () => setMaxHover(true), onMouseLeave: () => setMaxHover(false), "aria-label": maximized ? "Minimize code view" : "Maximize code view", "aria-pressed": maximized, title: maximized ? "Minimize code view" : "Maximize code view", style: {
|
|
87
|
-
display: "inline-flex",
|
|
75
|
+
}, children: [_jsxs("div", { style: {
|
|
76
|
+
display: "flex",
|
|
88
77
|
alignItems: "center",
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
78
|
+
gap: 8,
|
|
79
|
+
padding: "6px 10px",
|
|
80
|
+
// With segments present they form the header's bottom edge, so
|
|
81
|
+
// only draw the hairline when there is nothing to stand in for it.
|
|
82
|
+
borderBottom: showProgress
|
|
83
|
+
? "none"
|
|
84
|
+
: `1px solid ${theme.colors.border}`,
|
|
85
|
+
}, children: [_jsx("span", { title: title ?? undefined, style: {
|
|
86
|
+
flex: 1,
|
|
87
|
+
minWidth: 0,
|
|
88
|
+
overflow: "hidden",
|
|
89
|
+
textOverflow: "ellipsis",
|
|
90
|
+
whiteSpace: "nowrap",
|
|
91
|
+
fontFamily: theme.fonts.monospace,
|
|
92
|
+
fontSize: theme.fontSizes[1],
|
|
93
|
+
fontWeight: 600,
|
|
94
|
+
color: theme.colors.text,
|
|
95
|
+
}, children: title }), _jsx("button", { type: "button", onClick: () => setMaximized((v) => !v), onMouseEnter: () => setMaxHover(true), onMouseLeave: () => setMaxHover(false), "aria-label": maximized ? "Minimize code view" : "Maximize code view", "aria-pressed": maximized, title: maximized ? "Minimize code view" : "Maximize code view", style: {
|
|
96
|
+
display: "inline-flex",
|
|
97
|
+
alignItems: "center",
|
|
98
|
+
justifyContent: "center",
|
|
99
|
+
width: 22,
|
|
100
|
+
height: 22,
|
|
101
|
+
padding: 0,
|
|
102
|
+
border: "none",
|
|
103
|
+
borderRadius: 4,
|
|
104
|
+
background: maxHover ? theme.colors.border : "transparent",
|
|
105
|
+
color: maxHover ? theme.colors.text : muted,
|
|
106
|
+
cursor: "pointer",
|
|
107
|
+
transition: "background 120ms ease, color 120ms ease",
|
|
108
|
+
}, children: maximized ? _jsx(Minimize2, { size: 14 }) : _jsx(Maximize2, { size: 14 }) }), _jsx("button", { type: "button", onClick: onClose, onMouseEnter: () => setCloseHover(true), onMouseLeave: () => setCloseHover(false), "aria-label": "Close file", style: {
|
|
109
|
+
display: "inline-flex",
|
|
110
|
+
alignItems: "center",
|
|
111
|
+
justifyContent: "center",
|
|
112
|
+
width: 22,
|
|
113
|
+
height: 22,
|
|
114
|
+
padding: 0,
|
|
115
|
+
border: "none",
|
|
116
|
+
borderRadius: 4,
|
|
117
|
+
background: closeHover ? theme.colors.border : "transparent",
|
|
118
|
+
color: closeHover ? theme.colors.text : muted,
|
|
119
|
+
cursor: "pointer",
|
|
120
|
+
transition: "background 120ms ease, color 120ms ease",
|
|
121
|
+
}, children: _jsx(X, { size: 14 }) })] }), showProgress && progress != null && (_jsx("div", { role: "img", "aria-label": `Step ${progress.index + 1} of ${progress.total}`, style: {
|
|
122
|
+
display: "flex",
|
|
123
|
+
gap: 2,
|
|
124
|
+
flexShrink: 0,
|
|
125
|
+
padding: "0 10px 6px",
|
|
126
|
+
}, children: Array.from({ length: progress.total }, (_, i) => (_jsx("span", { style: {
|
|
127
|
+
flex: 1,
|
|
128
|
+
height: 2,
|
|
129
|
+
borderRadius: 1,
|
|
130
|
+
background: i <= progress.index
|
|
131
|
+
? theme.colors.primary
|
|
132
|
+
: theme.colors.border,
|
|
133
|
+
} }, i))) }))] }), _jsx("div", { style: { flex: 1, minHeight: 0, overflow: "auto" }, children: children })] })] }));
|
|
113
134
|
}
|
|
114
135
|
//# sourceMappingURL=FileDrawer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileDrawer.js","sourceRoot":"","sources":["../../src/subsystem/FileDrawer.tsx"],"names":[],"mappings":";AAAA;;;;;GAKG;AAEH,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AAEvD;2EAC2E;AAC3E,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAAG,CAAC;AAEzC;;;;iFAIiF;AACjF,MAAM,UAAU,UAAU,CAAC,EACzB,KAAK,EACL,OAAO,EACP,UAAU,GAAG,KAAK,EAClB,cAAc,GAAG,KAAK,EACtB,MAAM,GAAG,KAAK,EACd,QAAQ,
|
|
1
|
+
{"version":3,"file":"FileDrawer.js","sourceRoot":"","sources":["../../src/subsystem/FileDrawer.tsx"],"names":[],"mappings":"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"}
|
|
@@ -45,6 +45,12 @@ export interface TrailViewerContext {
|
|
|
45
45
|
resolveSymbol?: (query: TrailSymbolQuery) => string | null;
|
|
46
46
|
/** A clicked construct token — open that construct's declaration line. */
|
|
47
47
|
onSymbolClick?: (symbol: string, query: TrailSymbolQuery) => void;
|
|
48
|
+
/**
|
|
49
|
+
* Report which step scrolling has brought to the top of the code view, so the
|
|
50
|
+
* drawer can track the viewport instead of only the selected step. Forward
|
|
51
|
+
* the code view's scroll callback here.
|
|
52
|
+
*/
|
|
53
|
+
onVisibleStepChange?: (index: number) => void;
|
|
48
54
|
}
|
|
49
55
|
export interface SubsystemComponentGraphProps {
|
|
50
56
|
components: SubsystemComponent[];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SubsystemComponentGraph.d.ts","sourceRoot":"","sources":["../../src/subsystem/SubsystemComponentGraph.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAGH,OAAO,KAAK,EAAiC,SAAS,EAAE,MAAM,OAAO,CAAC;AAkBtE,OAAO,EAUL,KAAK,sBAAsB,EAC3B,KAAK,kBAAkB,EAEvB,KAAK,iBAAiB,EACtB,KAAK,yBAAyB,EAG9B,KAAK,cAAc,EACpB,MAAM,SAAS,CAAC;AAEjB,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,kBAAkB,CAAC;AACjE,OAAO,EAEL,KAAK,yBAAyB,EAC/B,MAAM,eAAe,CAAC;AACvB,OAAO,EAEL,KAAK,sBAAsB,EAC5B,MAAM,iDAAiD,CAAC;AACzD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAEtE,OAAO,EAA6B,KAAK,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AACzF,OAAO,EAOL,KAAK,cAAc,EACnB,KAAK,sBAAsB,EAC5B,MAAM,aAAa,CAAC;AAKrB,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,wBAAwB,CAAC;AACzE,OAAO,KAAK,EAAE,oBAAoB,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAY3E,yEAAyE;AACzE,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,cAAc,CAAC;IACtB,0EAA0E;IAC1E,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,qFAAqF;IACrF,UAAU,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,wBAAwB,KAAK,IAAI,CAAC;IACpE;;;OAGG;IACH,eAAe,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACrC;;;;;OAKG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,MAAM,GAAG,IAAI,CAAC;IAC3D,0EAA0E;IAC1E,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"SubsystemComponentGraph.d.ts","sourceRoot":"","sources":["../../src/subsystem/SubsystemComponentGraph.tsx"],"names":[],"mappings":"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"}
|
|
@@ -112,7 +112,7 @@ function FileOverlayCloseButton({ onClose }) {
|
|
|
112
112
|
transition: 'background 120ms ease, color 120ms ease',
|
|
113
113
|
}, children: _jsx(X, { size: 14 }) }));
|
|
114
114
|
}
|
|
115
|
-
const TrailDrawerContent = memo(function TrailDrawerContent({ render, trail, stepIndex, onOpenFile, proposedAliases, resolveSymbol, onSymbolClick, }) {
|
|
115
|
+
const TrailDrawerContent = memo(function TrailDrawerContent({ render, trail, stepIndex, onOpenFile, proposedAliases, resolveSymbol, onSymbolClick, onVisibleStepChange, }) {
|
|
116
116
|
return (_jsx(_Fragment, { children: render({
|
|
117
117
|
trail,
|
|
118
118
|
stepIndex,
|
|
@@ -120,6 +120,7 @@ const TrailDrawerContent = memo(function TrailDrawerContent({ render, trail, ste
|
|
|
120
120
|
proposedAliases,
|
|
121
121
|
resolveSymbol,
|
|
122
122
|
onSymbolClick,
|
|
123
|
+
onVisibleStepChange,
|
|
123
124
|
}) }));
|
|
124
125
|
});
|
|
125
126
|
function Inner({ components, trails, graphifyRelations, orderByLine, initialTrailId, onReorderTrails, onSelect, onEdgeSelect, measured: _measured, maxNodeWidth, showEdgeLabels, showSingletonFrames = true, moduleNesting, edgeView, title, hideSidebar, trailStepMode = 'focus', autoPlayTrails = false, trailAutoPlayIntervalMs = TRAIL_PLAY_PAUSE_MS, zoomOnTrailFocus = true, trailFocusDurationMs = 300, graphTitle, showTrailTitle = false, description, canvasOverlay, sidebarExtra, sidebarAfterDescription, diagnostic, issues, showIssues, focusIssueCategory, onSelectIssue, onApplyIssueFix, onHoverIssue, renderFileViewer, renderTrailViewer, onFileSelect, componentVerification, onInspectSymbol, boundaryColors, hideDrawer = false, persistKey, liveEvents, agentsPanel }) {
|
|
@@ -425,17 +426,27 @@ function Inner({ components, trails, graphifyRelations, orderByLine, initialTrai
|
|
|
425
426
|
return null;
|
|
426
427
|
if (drawerTarget.kind === 'file')
|
|
427
428
|
return drawerTarget.file;
|
|
429
|
+
// Trail steps already show their own file header per file, so the drawer
|
|
430
|
+
// title is just the trail name.
|
|
428
431
|
const tl = focusedTrail;
|
|
429
432
|
if (!tl)
|
|
430
433
|
return null;
|
|
431
|
-
|
|
432
|
-
return tl.title;
|
|
433
|
-
const step = tl.steps[drawerTarget.stepIndex];
|
|
434
|
-
if (!step)
|
|
435
|
-
return tl.title;
|
|
436
|
-
const site = `${step.file.split('/').pop() ?? step.file}:${step.line}`;
|
|
437
|
-
return `${tl.title} · ${site}`;
|
|
434
|
+
return tl.title;
|
|
438
435
|
}, [drawerTarget, focusedTrail]);
|
|
436
|
+
// Segmented step readout for trail drawers — a single file has no position.
|
|
437
|
+
// Follows the viewport once the code view reports a scroll, and falls back to
|
|
438
|
+
// the selected step until it does.
|
|
439
|
+
const [visibleStepIndex, setVisibleStepIndex] = useState(null);
|
|
440
|
+
const drawerStepIndex = drawerTarget?.kind === 'trail' ? drawerTarget.stepIndex : null;
|
|
441
|
+
const drawerProgress = useMemo(() => {
|
|
442
|
+
if (drawerStepIndex == null || !focusedTrail)
|
|
443
|
+
return null;
|
|
444
|
+
return { index: visibleStepIndex ?? drawerStepIndex, total: focusedTrail.steps.length };
|
|
445
|
+
}, [drawerStepIndex, focusedTrail, visibleStepIndex]);
|
|
446
|
+
// A new trail or step invalidates whatever the last scroll reported.
|
|
447
|
+
useEffect(() => {
|
|
448
|
+
setVisibleStepIndex(null);
|
|
449
|
+
}, [focusedTrail?.id, drawerStepIndex]);
|
|
439
450
|
// Refresh selected component when the components list updates (e.g. verify
|
|
440
451
|
// writes back declarationRef).
|
|
441
452
|
useEffect(() => {
|
|
@@ -2211,9 +2222,9 @@ function Inner({ components, trails, graphifyRelations, orderByLine, initialTrai
|
|
|
2211
2222
|
drawerTarget.startLine != null &&
|
|
2212
2223
|
!!selected.file &&
|
|
2213
2224
|
selected.file === drawerTarget.file &&
|
|
2214
|
-
selected.declarationRef?.startLine === drawerTarget.startLine }) }))] }), _jsx(FileDrawer, { title: drawerTitle, onClose: closeDrawer, fillHeight: drawerFillHeight, suppressEscape: fileOverlayOpen, hidden: hideDrawer, children: drawerTarget?.kind === 'trail' &&
|
|
2225
|
+
selected.declarationRef?.startLine === drawerTarget.startLine }) }))] }), _jsx(FileDrawer, { title: drawerTitle, onClose: closeDrawer, fillHeight: drawerFillHeight, suppressEscape: fileOverlayOpen, hidden: hideDrawer, progress: drawerProgress, children: drawerTarget?.kind === 'trail' &&
|
|
2215
2226
|
focusedTrail &&
|
|
2216
|
-
renderTrailViewer ? (_jsx(TrailDrawerContent, { render: renderTrailDrawerContent, trail: focusedTrail, stepIndex: drawerTarget.stepIndex, onOpenFile: onOpenFileFromTrail, proposedAliases: proposedAliases, resolveSymbol: resolveTrailSymbol, onSymbolClick: openConstructDeclaration })) : drawerTarget?.kind === 'file' ? (_jsx(FileDrawerContent, { render: renderDrawerContent, file: drawerTarget.file, startLine: drawerTarget.startLine })) : null }), fileOverlay && (_jsxs("div", { style: {
|
|
2227
|
+
renderTrailViewer ? (_jsx(TrailDrawerContent, { render: renderTrailDrawerContent, trail: focusedTrail, stepIndex: drawerTarget.stepIndex, onOpenFile: onOpenFileFromTrail, proposedAliases: proposedAliases, resolveSymbol: resolveTrailSymbol, onSymbolClick: openConstructDeclaration, onVisibleStepChange: setVisibleStepIndex })) : drawerTarget?.kind === 'file' ? (_jsx(FileDrawerContent, { render: renderDrawerContent, file: drawerTarget.file, startLine: drawerTarget.startLine })) : null }), fileOverlay && (_jsxs("div", { style: {
|
|
2217
2228
|
position: 'absolute',
|
|
2218
2229
|
inset: 0,
|
|
2219
2230
|
zIndex: 8,
|