@contentful/experience-design-system-cli 2.14.2 → 2.15.0

package/dist/src/analyze/search-neighborhood.js

@@ -0,0 +1,56 @@
+export function computeDirectNeighborhood(matches, graph) {
+    const matchSet = new Set(matches);
+    const out = new Set(matchSet);
+    if (matchSet.size === 0)
+        return out;
+    for (const node of graph) {
+        const targets = [];
+        for (const slot of node.slots) {
+            for (const t of slot.allowedComponents ?? [])
+                targets.push(t);
+        }
+        if (matchSet.has(node.name)) {
+            for (const t of targets)
+                out.add(t);
+        }
+        for (const t of targets) {
+            if (matchSet.has(t)) {
+                out.add(node.name);
+                break;
+            }
+        }
+    }
+    return out;
+}
+export function findAllAncestors(target, graph) {
+    const out = new Set([target]);
+    const parentsOf = new Map();
+    for (const node of graph) {
+        for (const slot of node.slots) {
+            for (const child of slot.allowedComponents ?? []) {
+                const list = parentsOf.get(child);
+                if (list) {
+                    if (!list.includes(node.name))
+                        list.push(node.name);
+                }
+                else {
+                    parentsOf.set(child, [node.name]);
+                }
+            }
+        }
+    }
+    const queue = [target];
+    while (queue.length > 0) {
+        const cur = queue.shift();
+        const parents = parentsOf.get(cur);
+        if (!parents)
+            continue;
+        for (const p of parents) {
+            if (out.has(p))
+                continue;
+            out.add(p);
+            queue.push(p);
+        }
+    }
+    return out;
+}

package/dist/src/analyze/select/tui/App.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { PALETTE } from './theme.js';
 import { Box, Text, useStdout } from 'ink';
 import { readFile } from 'node:fs/promises';
 import { createReviewSessionDetail } from '../types.js';
@@ -139,7 +140,6 @@ export function App({ sessionId, artifactsRoot, reviewRoot }) {
                 clearTimeout(previewDebounceRef.current);
         };
     }, []);
-    // Sync loaded session into local state
     useEffect(() => {
         if (loadedSession && !session) {
             setSession(loadedSession);
@@ -173,7 +173,6 @@ export function App({ sessionId, artifactsRoot, reviewRoot }) {
             }
         }
     }, [session]);
-    // Lazy source code loading
     useEffect(() => {
         if (!session || !selectedId)
             return;
@@ -195,7 +194,6 @@ export function App({ sessionId, artifactsRoot, reviewRoot }) {
             // Leave as null; SourcePanel shows [No source available]
         });
     }, [selectedId]);
-    // SIGINT handler
     useEffect(() => {
         const handler = () => {
             if (Object.keys(draftsByComponentId).length > 0) {
@@ -316,7 +314,6 @@ export function App({ sessionId, artifactsRoot, reviewRoot }) {
         },
         onToggleHelp: () => setShowHelp((prev) => !prev),
     });
-    // Must be before early returns — Rules of Hooks
     const sessionSummary = useMemo(() => sortComponentsForSidebar((session?.components ?? []).map((c) => {
         const counts = countValidationIssues(c.originalProposal);
         return {
@@ -334,10 +331,10 @@ export function App({ sessionId, artifactsRoot, reviewRoot }) {
         return _jsx(Text, { children: "Loading session..." });
     }
     if (sessionError) {
-        return (_jsxs(Text, { color: "red", children: [sessionError, '\nPress q to exit.'] }));
+        return (_jsxs(Text, { color: PALETTE.error, children: [sessionError, '\nPress q to exit.'] }));
     }
     if (!session || !paths) {
-        return _jsx(Text, { color: "red", children: "Session unavailable." });
+        return _jsx(Text, { color: PALETTE.error, children: "Session unavailable." });
     }
     if (finalizedResult) {
         return _jsx(FinalizedScreen, { result: finalizedResult });
@@ -363,10 +360,6 @@ export function App({ sessionId, artifactsRoot, reviewRoot }) {
     const collapsed = terminalWidth < 80;
     const visibleCount = 20;
     const longestName = session.components.reduce((max, c) => Math.max(max, c.name.length), 0);
-    // icon + badge + space + name + 2 border chars; min 14, max 22.
-    // The badge column is reserved (pilot R2) even when no annotation is set —
-    // see Sidebar.previewBadge — so the column width is stable as live-preview
-    // annotations flip in/out.
     const sidebarWidth = collapsed ? 3 : Math.min(Math.max(longestName + 5, 14), 22);
     const handleDraftSave = async (draft) => {
         if (!selectedId || !session || !paths)
@@ -397,7 +390,6 @@ export function App({ sessionId, artifactsRoot, reviewRoot }) {
                 type: 'draft_saved',
                 payload: { componentId: selectedId },
             });
-            // Sync all edited proposals to pipeline DB (keep 'generated' for preview)
             const allEdited = updatedSession.components.map((c) => c.editedProposal);
             const syncDb = openPipelineDb();
             try {
@@ -434,9 +426,6 @@ export function App({ sessionId, artifactsRoot, reviewRoot }) {
                     excluded: needsReviewCount,
                 },
             });
-            // Write all components back to DB, marking accepted as 'generated'
-            // so loadCDFComponents (push/preview) only picks up accepted ones,
-            // but loadRawComponents (editor re-entry) still finds all of them
             const acceptedNames = new Set(session.components.filter((c) => c.status === 'accepted').map((c) => c.name));
             const db = openPipelineDb();
             try {
@@ -479,7 +468,7 @@ export function App({ sessionId, artifactsRoot, reviewRoot }) {
                 }, onCancel: () => setShowQuitDialog(false) })), !showHelp && !showFinalizeDialog && !showQuitDialog && (_jsxs(Box, { flexGrow: 1, children: [_jsx(Sidebar, { components: sessionSummary, selectedId: selectedId, focused: sidebarFocused, scrollOffset: sidebarScrollOffset, visibleCount: visibleCount, onSelect: (id) => {
                             setSelectedId(id);
                             setJsonScrollOffset(0);
-                        }, onScrollChange: setSidebarScrollOffset, collapsed: collapsed, width: sidebarWidth }), _jsx(Box, { flexGrow: 1, paddingLeft: 1, children: selectedDetail ? (_jsx(ComponentDetail, { component: selectedDetail, sourceCode: selectedRecord?.sourceCode ?? null, draftValue: selectedId ? (draftsByComponentId[selectedId] ?? '') : '', editMode: editMode, sourceVisible: sourceVisible, jsonScrollOffset: jsonScrollOffset, sourceScrollX: 0, sourceScrollY: 0, terminalWidth: terminalWidth, previewAnnotation: selectedRecord ? previewAnnotations[selectedRecord.name] : undefined, onSaveDraft: (value) => void handleDraftSave(value), onDiscardDraft: handleDraftDiscard, onScrollChange: setJsonScrollOffset })) : (_jsx(Text, { dimColor: true, children: "No component selected" })) })] })), _jsx(PreviewSummaryBar, { preview: previewResponse, loading: previewLoading }), previewError && _jsx(Text, { color: "yellow", children: '⚠ Preview: ' + previewError }), saveError && _jsx(Text, { color: "red", children: '⚠ ' + saveError }), !dialogOpen && (_jsx(StatusBar, { accepted: acceptedCount, rejected: rejectedCount, reviewed: reviewedCount, needsReview: needsReviewCount, onApproveAll: () => { }, onFinalize: () => setShowFinalizeDialog(true) }))] }));
+                        }, onScrollChange: setSidebarScrollOffset, collapsed: collapsed, width: sidebarWidth }), _jsx(Box, { flexGrow: 1, paddingLeft: 1, children: selectedDetail ? (_jsx(ComponentDetail, { component: selectedDetail, sourceCode: selectedRecord?.sourceCode ?? null, draftValue: selectedId ? (draftsByComponentId[selectedId] ?? '') : '', editMode: editMode, sourceVisible: sourceVisible, jsonScrollOffset: jsonScrollOffset, sourceScrollX: 0, sourceScrollY: 0, terminalWidth: terminalWidth, previewAnnotation: selectedRecord ? previewAnnotations[selectedRecord.name] : undefined, onSaveDraft: (value) => void handleDraftSave(value), onDiscardDraft: handleDraftDiscard, onScrollChange: setJsonScrollOffset })) : (_jsx(Text, { dimColor: true, children: "No component selected" })) })] })), _jsx(PreviewSummaryBar, { preview: previewResponse, loading: previewLoading }), previewError && _jsx(Text, { color: PALETTE.warning, children: '⚠ Preview: ' + previewError }), saveError && _jsx(Text, { color: PALETTE.error, children: '⚠ ' + saveError }), !dialogOpen && (_jsx(StatusBar, { accepted: acceptedCount, rejected: rejectedCount, reviewed: reviewedCount, needsReview: needsReviewCount, onApproveAll: () => { }, onFinalize: () => setShowFinalizeDialog(true) }))] }));
 }
 function FinalizedScreen({ result, }) {
     useImmediateInput((_input, key) => {
@@ -487,5 +476,5 @@ function FinalizedScreen({ result, }) {
             process.exit(0);
         }
     });
-    return (_jsxs(Box, { flexDirection: "column", paddingX: 2, paddingY: 1, gap: 1, children: [_jsx(Text, { bold: true, color: "green", children: "\u2713 Finalized" }), _jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { gap: 1, children: [_jsx(Text, { color: "green", children: "\u2713" }), _jsxs(Text, { children: [result.accepted, " accepted"] })] }), result.rejected > 0 && (_jsxs(Box, { gap: 1, children: [_jsx(Text, { color: "red", children: "\u2717" }), _jsxs(Text, { children: [result.rejected, " rejected"] })] })), result.excluded > 0 && (_jsxs(Box, { gap: 1, children: [_jsx(Text, { dimColor: true, children: "\u00B7" }), _jsxs(Text, { dimColor: true, children: [result.excluded, " excluded (unresolved)"] })] }))] }), _jsx(Text, { dimColor: true, children: "Decisions saved. Ready for the next step." }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: "[Enter / q] Exit" }) })] }));
+    return (_jsxs(Box, { flexDirection: "column", paddingX: 2, paddingY: 1, gap: 1, children: [_jsx(Text, { bold: true, color: PALETTE.success, children: "\u2713 Finalized" }), _jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { gap: 1, children: [_jsx(Text, { color: PALETTE.success, children: "\u2713" }), _jsxs(Text, { children: [result.accepted, " accepted"] })] }), result.rejected > 0 && (_jsxs(Box, { gap: 1, children: [_jsx(Text, { color: PALETTE.error, children: "\u2717" }), _jsxs(Text, { children: [result.rejected, " rejected"] })] })), result.excluded > 0 && (_jsxs(Box, { gap: 1, children: [_jsx(Text, { dimColor: true, children: "\u00B7" }), _jsxs(Text, { dimColor: true, children: [result.excluded, " excluded (unresolved)"] })] }))] }), _jsx(Text, { dimColor: true, children: "Decisions saved. Ready for the next step." }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { dimColor: true, children: "[Enter / q] Exit" }) })] }));
 }

package/dist/src/analyze/select/tui/components/ComponentRationalePanel.d.ts

@@ -21,10 +21,6 @@ type RenderedLine = {
 } | {
     kind: 'blank';
 };
-/**
- * Flatten the component rationale into a list of rendered lines so scrollOffset
- * slicing matches what the operator sees.
- */
 export declare function renderComponentRationaleLines(data: ComponentRationale, innerWidth: number): RenderedLine[];
 export declare function ComponentRationalePanel({ data, scrollOffset, width, height, active, }: ComponentRationalePanelProps): React.ReactElement;
 export {};

package/dist/src/analyze/select/tui/components/ComponentRationalePanel.js

@@ -1,10 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { PALETTE } from '../theme.js';
 import { Box, Text } from 'ink';
 const PLACEHOLDER = '(no rationale captured)';
-/**
- * Word-wrap a paragraph to fit `innerWidth` columns. Mirrors the helper in
- * RationalePanel.tsx so wrapping is identical across both panels.
- */
 function wrapText(text, innerWidth) {
     if (!text)
         return [''];
@@ -51,10 +48,6 @@ function wrapText(text, innerWidth) {
         lines.push(current);
     return lines.length > 0 ? lines : [''];
 }
-/**
- * Flatten the component rationale into a list of rendered lines so scrollOffset
- * slicing matches what the operator sees.
- */
 export function renderComponentRationaleLines(data, innerWidth) {
     const out = [];
     const pushSection = (heading, body) => {
@@ -65,10 +58,6 @@ export function renderComponentRationaleLines(data, innerWidth) {
         }
         out.push({ kind: 'blank' });
     };
-    // "Description" section shows the human-facing component description.
-    // The `descriptionRationale` (WHY the component was classified this way)
-    // is appended as a small "why" line so the operator can see the LLM's
-    // reasoning without leaving the panel.
     out.push({ kind: 'heading', text: 'Description' });
     const descBody = data.description && data.description.trim().length > 0 ? data.description : PLACEHOLDER;
     for (const ln of wrapText(descBody, Math.max(1, innerWidth - 2))) {
@@ -116,18 +105,17 @@ export function ComponentRationalePanel({ data, scrollOffset, width, height, act
     const innerWidth = Math.max(1, width - 2);
     const all = renderComponentRationaleLines(data, innerWidth);
     const totalLines = all.length;
-    // Reserve one line at the bottom for the legend.
     const contentHeight = Math.max(1, height - 1);
     const visible = all.slice(scrollOffset, scrollOffset + contentHeight);
     const overflowed = totalLines > contentHeight;
     const visibleStart = totalLines === 0 ? 0 : scrollOffset + 1;
     const visibleEnd = Math.min(totalLines, scrollOffset + contentHeight);
-    return (_jsxs(Box, { flexDirection: "column", width: width, height: height + 2, borderStyle: "single", borderColor: active ? 'white' : undefined, children: [_jsx(Box, { children: _jsx(Text, { bold: true, dimColor: !active, children: `Component rationale: ${data.name}` }) }), visible.map((line, i) => {
+    return (_jsxs(Box, { flexDirection: "column", width: width, height: height + 2, borderStyle: "single", borderColor: active ? PALETTE.inverse : undefined, children: [_jsx(Box, { children: _jsx(Text, { bold: true, dimColor: !active, children: `Component rationale: ${data.name}` }) }), visible.map((line, i) => {
                 if (line.kind === 'blank') {
                     return (_jsx(Box, { children: _jsx(Text, { children: " " }) }, i));
                 }
                 if (line.kind === 'heading') {
-                    return (_jsx(Box, { children: _jsx(Text, { bold: true, color: "cyan", dimColor: !active, children: line.text }) }, i));
+                    return (_jsx(Box, { children: _jsx(Text, { bold: true, color: PALETTE.info, dimColor: !active, children: line.text }) }, i));
                 }
                 if (line.kind === 'list-name') {
                     return (_jsxs(Box, { children: [_jsx(Text, { children: '  - ' }), _jsx(Text, { bold: true, dimColor: !active, children: line.text }), line.sublabel ? _jsx(Text, { dimColor: true, children: ' ' + line.sublabel }) : null] }, i));

package/dist/src/analyze/select/tui/components/FieldEditor.d.ts

@@ -1,7 +1,5 @@
 import React from 'react';
-/** Per-prop / per-component metadata captured by the extractor + generate phase.
- * Optional; when omitted, the FieldEditor renders without rationale/source
- * affordances (backwards-compatible with mounts that pre-date Feature 1). */
+import { findSlotCycles, type ComponentSlotInfo } from '../../../cycle-detection.js';
 export type PropMetadata = {
     rationale?: string | null;
     sourceStartLine?: number | null;
@@ -19,50 +17,43 @@ type FieldEditorProps = {
     value: string;
     width: number;
     height: number;
-    /**
-     * When false, the editor is mounted but does not consume keystrokes.
-     * Used by callers (e.g. GenerateReviewStep) that toggle focus between
-     * a sidebar and this editor — the editor stays visible while the sidebar
-     * has the keyboard.
-     */
     active?: boolean;
     onChange: (value: string) => void;
     onSave: () => void;
     onDiscard: () => void;
-    /**
-     * Called when the user requests to exit the panel from row-level (Esc).
-     * Distinct from onDiscard, which drops pending edits without changing focus.
-     * Callers that embed FieldEditor inside a sidebar+panel layout wire this to
-     * return focus to the sidebar (e.g. setSidebarFocused(true)). When omitted,
-     * row-level Esc falls back to onDiscard for backward compatibility.
-     */
     onExit?: () => void;
-    /** Feature 1: source code + LLM rationale metadata. Optional. */
     metadata?: FieldEditorMetadata;
-    /**
-     * When provided, the parent owns the prop-rationale panel: pressing `i`
-     * inside FieldEditor calls this callback (subject to text-entry gating)
-     * instead of toggling internal state. The panel is rendered by the parent
-     * in place of FieldEditor — FieldEditor no longer renders its own panel.
-     */
     onTogglePropRationale?: () => void;
-    /**
-     * When provided, the parent owns the component-rationale panel: pressing
-     * `I` (uppercase) calls this callback (subject to text-entry gating).
-     */
+    propRationaleKey?: string;
     onToggleComponentRationale?: () => void;
-    /**
-     * When provided, the parent owns the source-view panel: pressing `s`
-     * calls this callback (subject to text-entry gating). FieldEditor will not
-     * render its own source panel in that case.
-     */
+    componentRationaleKey?: string;
     onToggleSourceExternal?: () => void;
-    /**
-     * Reports text-entry-active state changes to the parent so the parent can
-     * gate top-level keybinds (i/I/s) against literal keystrokes inside
-     * description editors, string default editors, and value-list text entry.
-     */
     onTextEntryActiveChange?: (active: boolean) => void;
+    projectSlotGraph?: ComponentSlotInfo[];
+    currentComponentName?: string;
+    onDirtyChange?: (isDirty: boolean) => void;
+    discardTrigger?: number;
+    initialFocusTarget?: {
+        kind: 'prop' | 'slot';
+        name: string;
+    };
 };
-export declare function FieldEditor({ value, width, height, active, onChange, onSave, onDiscard, onExit, metadata, onTogglePropRationale, onToggleComponentRationale, onToggleSourceExternal, onTextEntryActiveChange, }: FieldEditorProps): React.ReactElement;
+export declare function simulateGraphWithCandidate(projectSlotGraph: ComponentSlotInfo[], selfName: string, currentSlots: {
+    name: string;
+    allowedComponents: string[];
+}[], targetSlotName: string, candidate: string): ComponentSlotInfo[];
+export declare function introducesNewCycle(before: ReturnType<typeof findSlotCycles>, next: ReturnType<typeof findSlotCycles>): boolean;
+export declare function computeAllowedComponentCandidates(projectSlotGraph: ComponentSlotInfo[], selfName: string, currentSlots: {
+    name: string;
+    allowedComponents: string[];
+}[], targetSlotName: string): string[];
+export declare function simulateGraphWithReplacement(projectSlotGraph: ComponentSlotInfo[], selfName: string, currentSlots: {
+    name: string;
+    allowedComponents: string[];
+}[], targetSlotName: string, replaceIndex: number, candidate: string): ComponentSlotInfo[];
+export declare function computeAllowedComponentReplacementCandidates(projectSlotGraph: ComponentSlotInfo[], selfName: string, currentSlots: {
+    name: string;
+    allowedComponents: string[];
+}[], targetSlotName: string, replaceIndex: number): string[];
+export declare function FieldEditor({ value, width, height, active, onChange, onSave, onDiscard, onExit, metadata, onTogglePropRationale, propRationaleKey, onToggleComponentRationale, componentRationaleKey, onToggleSourceExternal, onTextEntryActiveChange, projectSlotGraph, currentComponentName, onDirtyChange, discardTrigger, initialFocusTarget, }: FieldEditorProps): React.ReactElement;
 export {};