@principal-ai/subsystems-react 0.55.3 → 0.56.1

package/src/pierre/PierreTrailCodeView.tsx

@@ -2,8 +2,8 @@
  * PierreTrailCodeView — multi-file step snippets via `@pierre/diffs` CodeView.
  *
  * Renders one sliced window per trail step in a single virtualized
- * scroll; when `stepIndex` changes, scrolls that step's site line into view
- * and highlights it via CodeView `selectedLines` (same mechanism as
+ * scroll; when `stepIndex` changes, scrolls that step's call into view
+ * and highlights its full range via CodeView `selectedLines` (same mechanism as
  * `PierreSnippetView`).
  */
 
@@ -46,9 +46,9 @@ import { resolveVisibleStepIndex, type VisibleStepRect } from './visibleStep';
 import { fileUnavailableNotice, isFileUnavailableError } from './fileAvailability';
 import {
   remapSnippetLineNumbers,
-  sliceSnippetWindow,
   type SnippetSlice,
 } from './sliceSnippet';
+import { sliceTrailStep, trailCallSelection } from './trailSnippet';
 
 /**
  * A token the user clicked or hovered inside a step's snippet. `stepIndex` is
@@ -88,7 +88,7 @@ export interface PierreTrailCodeViewProps {
   stepIndex: number | null;
   /** Read a step site; `purl` names the seam site's repo for checkout resolution. */
   readFile: (path: string, purl?: string) => Promise<string>;
-  /** Context lines above/below each step site; defaults to 8. */
+  /** Fallback context when a step has no caller construct span; defaults to 8. */
   contextLines?: number;
   /** Override Pierre's container background. */
   background?: string;
@@ -100,11 +100,6 @@ export interface PierreTrailCodeViewProps {
    * rather than the selected step. Only fires on change, not per scroll event.
    */
   onVisibleStepChange?: (index: number) => void;
-  /**
-   * Aliases of components marked `proposed`. A step whose file can't be read
-   * but whose endpoint is proposed reads as "planned" rather than "missing".
-   */
-  proposedAliases?: ReadonlySet<string>;
   /**
    * Resolve a token to a model construct key (e.g. a component alias) for the
    * step its snippet belongs to. Return `null` when the token doesn't name a
@@ -138,10 +133,9 @@ function siteKey(step: Pick<SubsystemTrailStep, 'purl' | 'file'>): string {
 function unavailableNotice(
   step: SubsystemTrailStep,
   error: string,
-  proposed: boolean,
 ): string {
   return isFileUnavailableError(error)
-    ? fileUnavailableNotice(step.file, proposed)
+    ? fileUnavailableNotice(step.file)
     : `Couldn't load ${step.file}: ${error}`;
 }
 
@@ -206,7 +200,6 @@ export function PierreTrailCodeView({
   background: backgroundProp,
   onOpenFile,
   onVisibleStepChange,
-  proposedAliases,
   resolveSymbol,
   onSymbolClick,
 }: PierreTrailCodeViewProps) {
@@ -292,24 +285,15 @@ export function PierreTrailCodeView({
     scheduleVisibleStepReport();
   }, [scheduleVisibleStepReport]);
 
-  // A step onto a proposed component is planned work; label its missing file
-  // accordingly instead of showing a bare "not found".
-  const isProposedStep = useCallback(
-    (step: SubsystemTrailStep): boolean =>
-      proposedAliases != null &&
-      (proposedAliases.has(step.from) || proposedAliases.has(step.to)),
-    [proposedAliases],
-  );
-
   const pathsKey = useMemo(() => {
     const keys = [...new Set(trail.steps.map((s) => siteKey(s)))];
     keys.sort();
     return keys.join('\0');
   }, [trail.steps]);
 
-  // Load each site independently: one unreadable step (a proposed seam whose
-  // file isn't implemented yet) must not blank the whole trail. Failures
-  // are kept per-path and rendered as inline placeholders below.
+  // Load each site independently: one unreadable step must not blank the
+  // whole trail. Failures are kept per-path and rendered as inline
+  // placeholders below.
   useEffect(() => {
     let cancelled = false;
     setLoad({ status: 'loading' });
@@ -350,15 +334,13 @@ export function PierreTrailCodeView({
       const failure = load.unavailable.get(key);
       if (failure != null) {
         return unavailableSlice(
-          unavailableNotice(step, failure, isProposedStep(step)),
+          unavailableNotice(step, failure),
         );
       }
       const contents = load.byPath.get(key) ?? '';
-      const start = step.span?.startLine ?? 1;
-      const end = step.span?.endLine ?? start;
-      return sliceSnippetWindow(contents, start, end, contextLines, start);
+      return sliceTrailStep(contents, step, contextLines);
     });
-  }, [load, trail.steps, contextLines, isProposedStep]);
+  }, [load, trail.steps, contextLines]);
 
   const items = useMemo((): CodeViewItem<TrailStepAnnotation>[] => {
     if (load.status !== 'ready' || slices.length === 0) return [];
@@ -392,23 +374,27 @@ export function PierreTrailCodeView({
           name: step.file,
           contents: slice.contents,
           lang: pierreLangForPath(step.file),
-          cacheKey: `${trail.id}:${index}:${step.file}:${step.span?.startLine ?? ''}:${slice.sliceStart}-${slice.sliceEnd}${failure != null ? ':unavailable' : ''}`,
+          cacheKey: `${trail.id}:${index}:${step.file}:${step.span?.startLine ?? ''}:${step.site?.span?.startLine ?? ''}-${step.site?.span?.endLine ?? ''}:${slice.sliceStart}-${slice.sliceEnd}${failure != null ? ':unavailable' : ''}`,
         },
       };
     });
-  }, [load, slices, trail.id, trail.steps, isProposedStep]);
+  }, [load, slices, trail.id, trail.steps]);
 
   const selectedLines = useMemo((): CodeViewLineSelection | null => {
     if (stepIndex == null || stepIndex < 0 || stepIndex >= slices.length) {
       return null;
     }
-    const focus = slices[stepIndex]?.focusOffset;
-    if (focus == null) return null;
+    const step = trail.steps[stepIndex];
+    const slice = slices[stepIndex];
+    if (step == null || slice == null || load.status !== 'ready') return null;
+    if (load.unavailable.has(siteKey(step))) return null;
+    const range = trailCallSelection(step, slice);
+    if (range == null) return null;
     return {
       id: stepItemId(trail.id, stepIndex),
-      range: { start: focus, end: focus },
+      range,
     };
-  }, [stepIndex, slices, trail.id]);
+  }, [stepIndex, slices, trail.id, trail.steps, load]);
 
   const sliceStartByItemId = useMemo(() => {
     const map = new Map<string, number>();
@@ -468,7 +454,9 @@ export function PierreTrailCodeView({
             </span>
           ) : (
             <>
-              L{step.span?.startLine ?? '?'}
+              {step.site?.span
+                ? `${step.site.symbol} · L${step.site.span.startLine}-${step.site.span.endLine}`
+                : `L${step.span?.startLine ?? '?'}`}
               {onOpenFile && (
                 <OpenFileHeaderButton
                   file={step.file}

package/src/pierre/fileAvailability.test.ts

@@ -23,12 +23,6 @@ describe('isFileUnavailableError', () => {
 });
 
 describe('fileUnavailableNotice', () => {
-  test('names proposed work as planned, not missing', () => {
-    expect(
-      fileUnavailableNotice('src/a.ts', true),
-    ).toBe("Proposed — src/a.ts isn't in the local checkout yet.");
-  });
-
   test('falls back to a plain not-in-checkout notice', () => {
     expect(fileUnavailableNotice('src/a.ts')).toBe(
       'Not in the local checkout: src/a.ts',

package/src/pierre/fileAvailability.ts

@@ -1,8 +1,7 @@
 /**
  * Host file reads fail with a small, stable set of messages when a path can't
- * be served from any local checkout — most often a *proposed* seam whose file
- * isn't implemented yet. These helpers detect that class of failure so the
- * Pierre views can show a proposed / not-yet-available notice instead of a raw
+ * be served from any local checkout. These helpers detect that class of failure
+ * so the Pierre views can show a not-yet-available notice instead of a raw
  * host error.
  */
 
@@ -23,15 +22,8 @@ export function isFileUnavailableError(
 }
 
 /**
- * One-line notice shown in place of a snippet whose file can't be read. When
- * the step touches a proposed component the wording names that, so a proposed
- * seam reads as "planned" rather than "missing".
+ * One-line notice shown in place of a snippet whose file can't be read.
  */
-export function fileUnavailableNotice(
-  path: string,
-  proposed?: boolean,
-): string {
-  return proposed
-    ? `Proposed — ${path} isn't in the local checkout yet.`
-    : `Not in the local checkout: ${path}`;
+export function fileUnavailableNotice(path: string): string {
+  return `Not in the local checkout: ${path}`;
 }

package/src/pierre/trailSnippet.test.ts

@@ -0,0 +1,74 @@
+import { describe, expect, test } from 'bun:test';
+import type { SubsystemTrailStep } from '../subsystem/model';
+import { sliceTrailStep, trailCallSelection } from './trailSnippet';
+
+const contents = Array.from({ length: 100 }, (_, i) => `line ${i + 1}`).join('\n');
+const step: SubsystemTrailStep = {
+  from: 'caller',
+  to: 'callee',
+  mechanism: 'calls',
+  file: 'src/caller.ts',
+  purl: 'pkg:github/example/repo#src/caller.ts',
+  symbol: 'loadModel',
+  site: {
+    symbol: 'loadModel',
+    span: { startLine: 10, endLine: 70, contentHash: 'caller' },
+  },
+  span: { startLine: 35, endLine: 38, contentHash: 'call' },
+  target: {
+    file: 'src/callee.ts',
+    purl: 'pkg:github/example/repo#src/callee.ts',
+    symbol: 'readFile',
+    span: { startLine: 2, endLine: 8, contentHash: 'callee' },
+  },
+};
+
+describe('trail construct snippets', () => {
+  test('shows the full caller span without extra context, not the callee span', () => {
+    const slice = sliceTrailStep(contents, step, 8);
+    expect(slice.sliceStart).toBe(10);
+    expect(slice.sliceEnd).toBe(70);
+    expect(slice.contents).toBe(contents.split('\n').slice(9, 70).join('\n'));
+    expect(slice.focusOffset).toBe(26);
+  });
+
+  test('highlights every line of a multiline call inside the construct', () => {
+    const slice = sliceTrailStep(contents, step, 8);
+    expect(trailCallSelection(step, slice)).toEqual({ start: 26, end: 29 });
+  });
+
+  test('preserves single-line call highlighting', () => {
+    const single = { ...step, span: { ...step.span!, endLine: 35 } };
+    expect(trailCallSelection(single, sliceTrailStep(contents, single, 8)))
+      .toEqual({ start: 26, end: 26 });
+  });
+
+  test('keeps a context window for older steps without a site construct', () => {
+    const legacy = { ...step, site: undefined };
+    const slice = sliceTrailStep(contents, legacy, 8);
+    expect(slice.sliceStart).toBe(27);
+    expect(slice.sliceEnd).toBe(46);
+    expect(slice.focusOffset).toBe(9);
+    expect(trailCallSelection(legacy, slice)).toEqual({ start: 9, end: 12 });
+  });
+
+  test('does not highlight the declaration as a call when call evidence is missing', () => {
+    const unverified = { ...step, span: undefined };
+    const slice = sliceTrailStep(contents, unverified, 8);
+    expect(slice.sliceStart).toBe(10);
+    expect(slice.sliceEnd).toBe(70);
+    expect(slice.focusOffset).toBe(1);
+    expect(trailCallSelection(unverified, slice)).toBeNull();
+  });
+
+  test('clips stale call ranges to the displayed construct', () => {
+    const stale = { ...step, span: { ...step.span!, startLine: 68, endLine: 75 } };
+    expect(trailCallSelection(stale, sliceTrailStep(contents, stale, 8)))
+      .toEqual({ start: 59, end: 61 });
+  });
+
+  test('does not highlight unrelated lines when the call falls outside the construct', () => {
+    const stale = { ...step, span: { ...step.span!, startLine: 80, endLine: 82 } };
+    expect(trailCallSelection(stale, sliceTrailStep(contents, stale, 8))).toBeNull();
+  });
+});

package/src/pierre/trailSnippet.ts

@@ -0,0 +1,35 @@
+import type { SubsystemTrailStep } from '../subsystem/model';
+import { sliceSnippetWindow, type SnippetSlice } from './sliceSnippet';
+
+/** Show the caller's whole declaration, keeping focus on its call site. */
+export function sliceTrailStep(
+  contents: string,
+  step: SubsystemTrailStep,
+  contextLines: number,
+): SnippetSlice {
+  const site = step.site?.span;
+  const start = site?.startLine ?? step.span?.startLine ?? 1;
+  const end = site?.endLine ?? step.span?.endLine ?? start;
+  return sliceSnippetWindow(
+    contents,
+    start,
+    end,
+    site ? 0 : contextLines,
+    step.span?.startLine ?? start,
+  );
+}
+
+/** Convert the complete call range to snippet-local lines, never inventing evidence. */
+export function trailCallSelection(
+  step: SubsystemTrailStep,
+  slice: SnippetSlice,
+): { start: number; end: number } | null {
+  if (step.span == null) return null;
+  const start = Math.max(step.span.startLine, slice.sliceStart);
+  const end = Math.min(step.span.endLine, slice.sliceEnd);
+  if (start > end) return null;
+  return {
+    start: start - slice.sliceStart + 1,
+    end: end - slice.sliceStart + 1,
+  };
+}

package/src/stories/Canvases/Subsystem/Deprecated.stories.tsx

@@ -12,9 +12,8 @@ import type {
 import { trailFromSteps } from './fixtures';
 
 /**
- * `deprecated` is the inverse of `proposed`: the claim was real, its source is
- * gone upstream. Mirrors Proposed.stories.tsx so the two temporary states read
- * as siblings — proposed = not built yet, deprecated = built once, removed since.
+ * `deprecated` marks a claim whose source is gone upstream. The node keeps a
+ * transitional marker until a cleanup pass removes it.
  */
 const meta = {
   title: 'Canvases/Subsystem/Deprecated',
@@ -154,22 +153,9 @@ const spotlightRows: Array<{ label: string; component: SubsystemComponent }> = [
       role: 'entry',
     },
   },
-  {
-    label: 'proposed (the sibling temporary state)',
-    component: {
-      alias: 'prop-fn',
-      name: 'OpenCodeV2Lifecycle',
-      construct: 'function',
-      file: '',
-      purl: PURL,
-      symbol: 'OpenCodeV2Lifecycle',
-      purpose: 'Proposed Studio host lifecycle',
-      proposed: true,
-    },
-  },
 ];
 
-/** Spotlights: slate deprecated badge + border vs live, proposed, and entry. */
+/** Spotlights: slate deprecated badge + border vs live and entry. */
 export const Spotlights: Story = {
   render: () => (
     <div

package/src/stories/Canvases/Subsystem/NodeAnatomy.stories.tsx

@@ -142,33 +142,6 @@ const CHANNELS: Channel[] = [
       declaration: storeDetail,
     },
   },
-  {
-    label: 'proposed',
-    note: 'dashed goldenrod border + right badge; fileless.',
-    component: {
-      alias: 'prop',
-      name: 'OpenCodeV2Lifecycle',
-      construct: 'function',
-      file: '',
-      purl: PURL,
-      symbol: 'OpenCodeV2Lifecycle',
-      proposed: true,
-    },
-  },
-  {
-    label: 'proposed + role',
-    note: 'proposed wins the right badge; role stays on the model.',
-    component: {
-      alias: 'prop-role',
-      name: 'startMaintainFlow',
-      construct: 'function',
-      file: '',
-      purl: PURL,
-      symbol: 'startMaintainFlow',
-      proposed: true,
-      role: 'service',
-    },
-  },
   {
     label: 'framework stereotype',
     note: 'left badge prefers "framework · stereotype"; border stays construct.',
@@ -230,11 +203,11 @@ function ChannelCell({ channel }: { channel: Channel }) {
 
 const LEGEND: Array<[string, string]> = [
   ['border color', 'construct kind (Pierre palette) — or primary when a file is open (spotlight)'],
-  ['border style', 'solid normally; dashed goldenrod when `proposed`; dotted when the node has findings'],
+  ['border style', 'solid normally; dotted when the node has findings'],
   ['border width', '2px; 4px when selected or file-matched'],
   ['corners', '8px rounded; square for `external`'],
   ['left badge (top edge)', 'construct / framework stereotype / entityKind'],
-  ['right badge (top edge)', 'role, or `proposed` (wins); storage sits beside it'],
+  ['right badge (top edge)', 'role; storage sits beside it'],
   ['bottom strip (bottom edge)', 'filename — hover only, or while that file is open'],
   ['fill', 'backgroundSecondary; opacity 0.18 when dimmed'],
   ['OCCUPIED', 'top-left · top-right · bottom-center · border · fill'],
@@ -439,8 +412,7 @@ export const IssueOverlayProposal: Story = {
           </div>
           <ul style={{ margin: 0, paddingLeft: 18, fontSize: 12, lineHeight: 1.7, color: '#b0b0b0' }}>
             <li>
-              <b>Dotted border</b> (keeps the construct color) = the node has findings — a sibling of
-              <b> proposed</b>&apos;s dashed, kept distinct so the two don&apos;t read alike.
+              <b>Dotted border</b> (keeps the construct color) = the node has findings.
             </li>
             <li>
               <b>Corner chip</b> carries severity (<b>red</b> = error / contradicts source,{' '}

package/src/stories/Canvases/Subsystem/Trails.stories.tsx

@@ -170,7 +170,6 @@ function TrailsDemo() {
       trail,
       stepIndex,
       onOpenFile,
-      proposedAliases,
       resolveSymbol,
       onSymbolClick,
       onVisibleStepChange,
@@ -181,7 +180,6 @@ function TrailsDemo() {
         readFile={readStoryFile}
         contextLines={4}
         onOpenFile={onOpenFile}
-        proposedAliases={proposedAliases}
         resolveSymbol={resolveSymbol}
         onSymbolClick={onSymbolClick}
         onVisibleStepChange={onVisibleStepChange}
@@ -223,189 +221,6 @@ export const ThreeTrails: Story = {
   render: () => <TrailsDemo />,
 };
 
-/**
- * The proposed-seam failure mode: a trail step whose component is
- * `proposed` points at a file that isn't in the checkout yet (no story
- * fixture). The step must render an inline "Proposed — … isn't in the local
- * checkout yet." placeholder with no Open-file affordance, while the live steps
- * around it still render their snippets — one bad step must not blank the flow.
- */
-const proposedComponents: SubsystemComponent[] = [
-  ...drawingComponents,
-  {
-    alias: 'runs',
-    name: 'SubsystemModelRunStore',
-    construct: 'store',
-    file: 'src/runs/subsystemModelRuns.ts',
-    purl: 'pkg:github/principal-ai/desktop-app',
-    symbol: 'SubsystemModelRunStore',
-    purpose: 'proposed store associating maintain runs with a model',
-    proposed: true,
-    process: 'draw-host',
-  },
-];
-
-const proposedTrails: SubsystemTrail[] = [
-  {
-    id: 'tl-associate-run',
-    title: 'Associate a finished run with its model (proposed)',
-    steps: [
-      {
-        from: 'host',
-        to: 'storage',
-        mechanism: 'calls',
-        file: 'src/hooks/useDrawingsHost.ts',
-        span: { startLine: 45, endLine: 45, contentHash: 'fixture' },
-        purl: stepPurl('src/hooks/useDrawingsHost.ts'),
-        symbol: 'useDrawingsHost.openDrawing',
-        annotation: 'Live step — its snippet still renders.',
-      },
-      {
-        from: 'storage',
-        to: 'runs',
-        mechanism: 'writes',
-        file: 'src/runs/subsystemModelRuns.ts',
-        span: { startLine: 1, endLine: 1, contentHash: 'fixture' },
-        purl: stepPurl('src/runs/subsystemModelRuns.ts'),
-        symbol: 'SubsystemModelRunStore.write',
-        annotation: 'Proposed seam — the file is not in the checkout yet.',
-      },
-    ],
-  },
-  // Neighbours for the wrapped title above: a couple of one-line titles and
-  // one that wraps to two, so the header's padding reads against the rows on
-  // either side of it rather than in isolation.
-  {
-    id: 'tl-open-drawing',
-    title: 'Open drawing',
-    steps: [
-      {
-        from: 'panel',
-        to: 'host',
-        mechanism: 'produces',
-        file: 'src/panels/DrawingsLeftPanel.tsx',
-        span: { startLine: 85, endLine: 85, contentHash: 'fixture' },
-        purl: stepPurl('src/panels/DrawingsLeftPanel.tsx'),
-        symbol: 'DrawingsLeftPanel.openDrawing',
-        annotation: 'Emits the open intent up to the host.',
-      },
-      {
-        from: 'host',
-        to: 'storage',
-        mechanism: 'calls',
-        file: 'src/hooks/useDrawingsHost.ts',
-        span: { startLine: 45, endLine: 45, contentHash: 'fixture' },
-        purl: stepPurl('src/hooks/useDrawingsHost.ts'),
-        symbol: 'useDrawingsHost.openDrawing',
-      },
-    ],
-  },
-  {
-    id: 'tl-save-drawing',
-    title: 'Save the drawing and refresh the list',
-    steps: [
-      {
-        from: 'tab',
-        to: 'fs',
-        mechanism: 'calls',
-        file: 'src/components/DrawingTabContent.tsx',
-        span: { startLine: 112, endLine: 112, contentHash: 'fixture' },
-        purl: stepPurl('src/components/DrawingTabContent.tsx'),
-        symbol: 'DrawingTabContent.save',
-      },
-      {
-        from: 'host',
-        to: 'panel',
-        mechanism: 'produces',
-        file: 'src/hooks/useDrawingsHost.ts',
-        span: { startLine: 64, endLine: 64, contentHash: 'fixture' },
-        purl: stepPurl('src/hooks/useDrawingsHost.ts'),
-        symbol: 'useDrawingsHost.onSaved',
-      },
-    ],
-  },
-  {
-    id: 'tl-delete-drawing',
-    title: 'Delete drawing',
-    steps: [
-      {
-        from: 'host',
-        to: 'fs',
-        mechanism: 'calls',
-        file: 'src/hooks/useDrawingsHost.ts',
-        span: { startLine: 66, endLine: 66, contentHash: 'fixture' },
-        purl: stepPurl('src/hooks/useDrawingsHost.ts'),
-        symbol: 'useDrawingsHost.deleteDrawing',
-      },
-      {
-        from: 'panel',
-        to: 'storage',
-        mechanism: 'calls',
-        file: 'src/panels/DrawingsLeftPanel.tsx',
-        span: { startLine: 56, endLine: 56, contentHash: 'fixture' },
-        purl: stepPurl('src/panels/DrawingsLeftPanel.tsx'),
-        symbol: 'DrawingsLeftPanel.scan',
-      },
-    ],
-  },
-];
-
-function ProposedMissingStepDemo() {
-  const renderTrailViewer = useCallback(
-    ({
-      trail,
-      stepIndex,
-      onOpenFile,
-      proposedAliases,
-      resolveSymbol,
-      onSymbolClick,
-      onVisibleStepChange,
-    }: TrailViewerContext) => (
-      <PierreTrailCodeView
-        trail={trail}
-        stepIndex={stepIndex}
-        readFile={readStoryFile}
-        contextLines={4}
-        onOpenFile={onOpenFile}
-        proposedAliases={proposedAliases}
-        resolveSymbol={resolveSymbol}
-        onSymbolClick={onSymbolClick}
-        onVisibleStepChange={onVisibleStepChange}
-      />
-    ),
-    [],
-  );
-
-  return (
-    <div style={{ width: '100%', height: '100vh', display: 'flex', flexDirection: 'column' }}>
-      <SubsystemComponentGraph
-        components={proposedComponents}
-        trails={proposedTrails}
-        title="proposed seam with a missing file"
-        description="The **Trails** panel lists four flows so the long, wrapped title (*Associate a finished run with its model (proposed)*) reads against its neighbours — two one-line titles and one (*Save the drawing and refresh the list*) that also wraps. Expand **Associate a finished run with its model** and click either step: the proposed step has no file in the checkout, so its snippet shows an inline *Proposed — … isn't in the local checkout yet.* placeholder instead of failing the whole flow."
-        renderTrailViewer={renderTrailViewer}
-        renderFileViewer={(file) => (
-          <div
-            style={{
-              padding: 12,
-              fontFamily: 'monospace',
-              fontSize: 12,
-              color: '#bbb',
-              whiteSpace: 'pre',
-            }}
-          >
-            {`// ${file}\n  …`}
-          </div>
-        )}
-      />
-    </div>
-  );
-}
-
-export const ProposedMissingStep: Story = {
-  render: () => <ProposedMissingStepDemo />,
-};
-
 // --- Clickable constructs -------------------------------------------------
 //
 // A trail step's line is an edge between two constructs. When the host
@@ -554,7 +369,6 @@ function ClickableConstructsDemo() {
       trail,
       stepIndex,
       onOpenFile,
-      proposedAliases,
       resolveSymbol,
       onSymbolClick,
       onVisibleStepChange,
@@ -565,7 +379,6 @@ function ClickableConstructsDemo() {
         readFile={readClickableFile}
         contextLines={4}
         onOpenFile={onOpenFile}
-        proposedAliases={proposedAliases}
         resolveSymbol={resolveSymbol}
         onSymbolClick={onSymbolClick}
         onVisibleStepChange={onVisibleStepChange}

package/src/subsystem/C4Graph.tsx

@@ -2711,7 +2711,6 @@ function Inner({ model, onSelectNode, onSelectEdge, onTrailClick, onToggleContai
           >
             {selectedConstruct.component.alias}
             {selectedConstruct.role ? ` · ${selectedConstruct.role}` : ''}
-            {selectedConstruct.component.proposed ? ' · proposed' : ''}
           </div>
         </div>
       )}

package/src/subsystem/FileDrawer.tsx

@@ -26,6 +26,7 @@ export function FileDrawer({
   suppressEscape = false,
   hidden = false,
   progress = null,
+  subheader = null,
   children,
 }: {
   /** Drawer chrome title; `null` closes the drawer. */
@@ -43,6 +44,8 @@ export function FileDrawer({
    * content with no position (a single file).
    */
   progress?: { index: number; total: number } | null;
+  /** Optional chrome row below the title (e.g. the trail call stack). */
+  subheader?: ReactNode;
   children?: ReactNode;
 }) {
   const { theme } = useTheme();
@@ -223,6 +226,9 @@ export function FileDrawer({
             </button>
           </div>
         </div>
+        {subheader != null && open && (
+          <div style={{ flexShrink: 0, minHeight: 0 }}>{subheader}</div>
+        )}
         <div style={{ flex: 1, minHeight: 0, overflow: "auto" }}>
           {children}
         </div>