@contentful/experience-design-system-cli 2.37.1-dev-build-c3291210.0 → 2.37.1-dev-build-bdf99669.0

package/dist/app.js

@@ -2018,7 +2018,7 @@ var init_cache_keys = __esm({
 
 // packages/experience-design-system-cli/app.tsx
 import { join as join25 } from "node:path";
-import { useEffect as useEffect28, useState as useState33 } from "react";
+import { useEffect as useEffect26, useState as useState33 } from "react";
 
 // packages/experience-design-system-cli/src/tui/home/home.tsx
 import { useEffect as useEffect2, useState as useState2 } from "react";
@@ -2240,14 +2240,9 @@ function HomeScreen({ onNavigate }) {
 }
 
 // packages/experience-design-system-cli/src/tui/import/PageContainer.tsx
-import { useEffect as useEffect3 } from "react";
-import { Box as Box2, Text as Text3, useInput as useInput2, useStdout as useStdout2 } from "ink";
+import { Box as Box2, Text as Text3, useInput as useInput2 } from "ink";
 import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
 function ImportScreen({ exitCode, onDone }) {
-  const { stdout } = useStdout2();
-  useEffect3(() => {
-    stdout.write("\x1B[H\x1B[0J");
-  }, [stdout]);
   useInput2((input, key) => {
     if (key.return || key.escape || input === "q") {
       onDone();
@@ -2455,7 +2450,7 @@ function TokenInputScreen({ onConfirm, onBack, initialPath = "" }) {
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/03-path-validation/screen.tsx
-import { useEffect as useEffect4, useMemo, useState as useState5 } from "react";
+import { useEffect as useEffect3, useMemo, useState as useState5 } from "react";
 import { Box as Box5, Text as Text6 } from "ink";
 
 // packages/experience-design-system-cli/src/tui/import/steps/03-path-validation/controls.ts
@@ -16616,7 +16611,7 @@ function PathValidationScreen({
 }) {
   const resolvedPath = useMemo(() => resolveUserPath(projectPath), [projectPath]);
   const [scan, setScan] = useState5();
-  useEffect4(() => {
+  useEffect3(() => {
     setScan(scanFiles(resolvedPath));
   }, [resolvedPath]);
   const phase = phaseOf(scan);
@@ -16984,10 +16979,10 @@ var PROGRESS_THEME = extendTheme(defaultTheme, {
 });
 
 // packages/experience-design-system-cli/src/tui/import/shared/running-step/use-elapsed.ts
-import { useEffect as useEffect5, useState as useState7 } from "react";
+import { useEffect as useEffect4, useState as useState7 } from "react";
 function useElapsed() {
   const [seconds, setSeconds] = useState7(0);
-  useEffect5(() => {
+  useEffect4(() => {
     const timer = setInterval(() => setSeconds((current) => current + 1), 1e3);
     return () => clearInterval(timer);
   }, []);
@@ -17225,7 +17220,7 @@ async function updateSettings2(patch) {
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/06-extraction/use-extraction.ts
-import { useEffect as useEffect6, useRef as useRef2, useState as useState8 } from "react";
+import { useEffect as useEffect5, useRef as useRef2, useState as useState8 } from "react";
 
 // packages/experience-design-system-cli/src/tui/import/steps/06-extraction/run.ts
 import { mkdir as mkdir7 } from "node:fs/promises";
@@ -17484,7 +17479,7 @@ async function resolveSelectionPrompt(overrides) {
 function useExtraction(input) {
   const [state, setState] = useState8();
   const current = useRef2();
-  useEffect6(() => {
+  useEffect5(() => {
     current.current = input;
     if (!input) {
       setState(void 0);
@@ -17514,7 +17509,7 @@ function useExtraction(input) {
 import { Box as Box20, Text as Text22 } from "ink";
 
 // packages/experience-design-system-cli/src/tui/import/steps/07-scope-gate/panels/added-column.tsx
-import React7 from "react";
+import React6 from "react";
 import { Box as Box11, Text as Text12 } from "ink";
 import figures from "figures";
 
@@ -17715,7 +17710,7 @@ function AddedColumn(props) {
       const aiFlagged = aiFlaggedByKey?.get(entry.name) === true;
       const showSeparator = firstNonCycleIdx > 0 && i === firstNonCycleIdx;
       const style = sideColumnLabelStyle({ isCycle: entry.isCycle, isSelected, focused });
-      return /* @__PURE__ */ jsxs11(React7.Fragment, { children: [
+      return /* @__PURE__ */ jsxs11(React6.Fragment, { children: [
         showSeparator && /* @__PURE__ */ jsx14(Text12, { dimColor: true, children: "\u2500".repeat(Math.max(0, width - 2)) }),
         /* @__PURE__ */ jsxs11(Box11, { children: [
           isCursor ? /* @__PURE__ */ jsx14(Text12, { color: PALETTE2.info, bold: true, children: figures.pointer }) : /* @__PURE__ */ jsx14(Text12, { children: " " }),
@@ -18748,7 +18743,7 @@ function GroupedSidebar(props) {
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/07-scope-gate/sidebar/components/HelpOverlay.tsx
-import React8 from "react";
+import React7 from "react";
 import { Box as Box18, Text as Text20 } from "ink";
 
 // packages/experience-design-system-cli/src/tui/import/steps/07-scope-gate/sidebar/hooks/useImmediateInput.ts
@@ -18825,8 +18820,8 @@ function useImmediateInput(handler, enabled = true) {
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/07-scope-gate/sidebar/hooks/use-terminal-size.ts
-import { useStdout as useStdout3 } from "ink";
-import { useEffect as useEffect7, useState as useState9 } from "react";
+import { useStdout as useStdout2 } from "ink";
+import { useEffect as useEffect6, useState as useState9 } from "react";
 function readTerminalSize(stdout) {
   return {
     columns: stdout?.columns ?? 80,
@@ -18834,9 +18829,9 @@ function readTerminalSize(stdout) {
   };
 }
 function useTerminalSize() {
-  const { stdout } = useStdout3();
+  const { stdout } = useStdout2();
   const [size, setSize] = useState9(() => readTerminalSize(stdout));
-  useEffect7(() => {
+  useEffect6(() => {
     const updateSize = () => setSize(readTerminalSize(stdout));
     stdout?.on("resize", updateSize);
     updateSize();
@@ -18870,7 +18865,7 @@ function HelpOverlay(props) {
         overflowY: "hidden",
         children: [
           /* @__PURE__ */ jsx22(Text20, { bold: true, children: "\u2500".repeat(titleRule) + " Help " + "\u2500".repeat(titleRule) }),
-          props.sections.map((section) => /* @__PURE__ */ jsxs19(React8.Fragment, { children: [
+          props.sections.map((section) => /* @__PURE__ */ jsxs19(React7.Fragment, { children: [
             /* @__PURE__ */ jsx22(Text20, { children: " " }),
             /* @__PURE__ */ jsx22(Text20, { bold: true, children: section.title }),
             section.entries.map((entry) => /* @__PURE__ */ jsx22(Text20, { children: entry.keys ? "  " + entry.keys.padEnd(16) + " " + entry.label : "  " + entry.label }, entry.keys + entry.label))
@@ -19019,7 +19014,7 @@ function createSidebarViewsHelpSection(includeBreaking) {
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/07-scope-gate/use-scope-gate.ts
-import { useEffect as useEffect8, useMemo as useMemo2, useRef as useRef4, useState as useState12 } from "react";
+import { useEffect as useEffect7, useMemo as useMemo2, useRef as useRef4, useState as useState12 } from "react";
 
 // packages/experience-design-system-cli/src/tui/import/steps/07-scope-gate/graph/search-neighborhood.ts
 function computeDirectNeighborhood(matches, graph) {
@@ -19703,7 +19698,7 @@ function useScopeGate({ components, onConfirm, onQuit }) {
     return seed;
   });
   const seededGroupsRef = useRef4(closures.size > 0 || cycleParticipants.size > 0);
-  useEffect8(() => {
+  useEffect7(() => {
     if (seededGroupsRef.current) return;
     if (closures.size === 0 && cycleParticipants.size === 0) return;
     seededGroupsRef.current = true;
@@ -19793,7 +19788,7 @@ function useScopeGate({ components, onConfirm, onQuit }) {
     entryCount: 0
   });
   const panelLayout = useMemo2(() => computePanelLayout(visibleCount), [visibleCount]);
-  useEffect8(() => {
+  useEffect7(() => {
     setNav((prev) => {
       const maxIdx = Math.max(0, visibleRows.length - 1);
       const nextCursor = Math.min(prev.cursor, maxIdx);
@@ -20261,7 +20256,7 @@ function ScopeGateView({ components, onConfirm, onQuit }) {
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/07-scope-gate/use-scope-gate-flow.ts
-import { useEffect as useEffect9, useMemo as useMemo3, useRef as useRef5, useState as useState13 } from "react";
+import { useEffect as useEffect8, useMemo as useMemo3, useRef as useRef5, useState as useState13 } from "react";
 
 // packages/experience-design-system-cli/src/tui/import/steps/07-scope-gate/cache-check.ts
 async function checkGenerationCache(input) {
@@ -20310,7 +20305,7 @@ function useScopeGateFlow(input, deps = realDeps2) {
   const loaded = useMemo3(() => sessionId ? deps.load(sessionId) : void 0, [sessionId]);
   const cacheCheck = useRef5(void 0);
   const [confirmed, setConfirmed] = useState13();
-  useEffect9(() => {
+  useEffect8(() => {
     if (!input || !loaded?.ok || cacheCheck.current) return;
     cacheCheck.current = deps.checkCache(input.cache);
   }, [input, loaded]);
@@ -20381,7 +20376,7 @@ function GenerationScreen({
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/08-generation/use-generation.ts
-import { useEffect as useEffect10, useRef as useRef6, useState as useState14 } from "react";
+import { useEffect as useEffect9, useRef as useRef6, useState as useState14 } from "react";
 
 // packages/experience-design-system-cli/src/tui/import/steps/08-generation/run.ts
 import { resolve as resolve23 } from "node:path";
@@ -20547,7 +20542,7 @@ function applyProgressEvent2(event, previous, total) {
 function useGeneration(input) {
   const [state, setState] = useState14();
   const current = useRef6();
-  useEffect10(() => {
+  useEffect9(() => {
     current.current = input;
     if (!input) {
       setState(void 0);
@@ -20593,7 +20588,6 @@ function buildFlowStart(input) {
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/10-flow/flow/screen.tsx
-import { useEffect as useEffect21, useRef as useRef12 } from "react";
 import { Box as Box41 } from "ink";
 
 // packages/experience-design-system-types/dist/src/cdf/validate.js
@@ -20940,7 +20934,7 @@ function PreviewValidationErrorScreen({
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/09-review/generate-review-step.tsx
-import { useCallback as useCallback5, useEffect as useEffect17, useMemo as useMemo4, useRef as useRef11, useState as useState22 } from "react";
+import { useCallback as useCallback5, useEffect as useEffect16, useMemo as useMemo4, useRef as useRef11, useState as useState22 } from "react";
 import figures7 from "figures";
 
 // packages/experience-design-system-cli/src/tui/import/steps/09-review/theme.ts
@@ -21212,7 +21206,7 @@ function enumerateCycleBreaks(cycle, components) {
 import { Box as Box27, Text as Text30 } from "ink";
 
 // packages/experience-design-system-cli/src/tui/import/steps/09-review/components/FieldEditor.tsx
-import React9, { useEffect as useEffect11, useLayoutEffect as useLayoutEffect2, useState as useState15 } from "react";
+import React8, { useEffect as useEffect10, useLayoutEffect as useLayoutEffect2, useState as useState15 } from "react";
 import figures5 from "figures";
 import { Box as Box21, measureElement, Text as Text23 } from "ink";
 
@@ -21923,9 +21917,9 @@ function FieldEditor({
   const [editorState, setEditorState] = useState15(initialState);
   const [parseErr] = useState15(parseError);
   const [listScrollStart, setListScrollStart] = useState15(0);
-  const initialFocusScrollApplied = React9.useRef(false);
+  const initialFocusScrollApplied = React8.useRef(false);
   const [rowHeights, setRowHeights] = useState15({});
-  const rowMeasureRefs = React9.useRef(/* @__PURE__ */ new Map());
+  const rowMeasureRefs = React8.useRef(/* @__PURE__ */ new Map());
   const initialFocus = (() => {
     if (initialFocusTarget?.kind === "description") {
       return {
@@ -22012,23 +22006,23 @@ function FieldEditor({
   const [showHelp, setShowHelp] = useState15(false);
   const props = editorState.props;
   const slots = editorState.slots;
-  const contentPropIndexes = React9.useMemo(
+  const contentPropIndexes = React8.useMemo(
     () => props.flatMap((prop, index) => prop.category === "content" ? [index] : []),
     [props]
   );
-  const designPropIndexes = React9.useMemo(
+  const designPropIndexes = React8.useMemo(
     () => props.flatMap((prop, index) => prop.category === "design" ? [index] : []),
     [props]
   );
-  const hiddenPropIndexes = React9.useMemo(
+  const hiddenPropIndexes = React8.useMemo(
     () => showHiddenProps ? props.flatMap((prop, index) => prop.category === "state" || prop.category === "unattached" ? [index] : []) : [],
     [props, showHiddenProps]
   );
-  const visiblePropIndexes = React9.useMemo(
+  const visiblePropIndexes = React8.useMemo(
     () => [...contentPropIndexes, ...designPropIndexes, ...hiddenPropIndexes],
     [contentPropIndexes, designPropIndexes, hiddenPropIndexes]
   );
-  const propGroups = React9.useMemo(
+  const propGroups = React8.useMemo(
     () => [
       {
         kind: "content",
@@ -22048,7 +22042,7 @@ function FieldEditor({
     ],
     [contentPropIndexes, designPropIndexes, hiddenPropIndexes]
   );
-  const selectableRows = React9.useMemo(
+  const selectableRows = React8.useMemo(
     () => [
       ...contentPropIndexes.map((idx) => ({ kind: "prop", idx })),
       ...designPropIndexes.map((idx) => ({ kind: "prop", idx })),
@@ -22058,7 +22052,7 @@ function FieldEditor({
     [contentPropIndexes, designPropIndexes, hiddenPropIndexes, slots]
   );
   const visiblePropPosition = visiblePropIndexes.indexOf(propIdx);
-  const selectedSelectableIndex = React9.useMemo(
+  const selectedSelectableIndex = React8.useMemo(
     () => selectableRows.findIndex(
       (row) => inSlots ? row.kind === "slot" && row.idx === slotIdx : row.kind === "prop" && row.idx === propIdx
     ),
@@ -22077,12 +22071,12 @@ function FieldEditor({
     }
   };
   const textEntryActive = focusLevel === "field" && editingField && activeField === "description" || focusLevel === "field" && editingField && activeField === "default" && (editorState.props[propIdx]?.type === "string" || editorState.props[propIdx]?.type === "token") || editingValue != null;
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     onTextEntryActiveChange?.(textEntryActive);
   }, [textEntryActive, onTextEntryActiveChange]);
   const currentProp = props[propIdx] ?? null;
   const currentSlot = slots[slotIdx] ?? null;
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     if (showHiddenProps || inSlots || inComponentDesc || visiblePropPosition >= 0) return;
     if (visiblePropIndexes.length > 0) {
       setPropIdx(visiblePropIndexes[0]);
@@ -22101,22 +22095,22 @@ function FieldEditor({
     setEditorState(next);
     onChange(serializeState(next, value));
   };
-  const canonicalize = React9.useCallback((json) => {
+  const canonicalize = React8.useCallback((json) => {
     try {
       return JSON.stringify(JSON.parse(json));
     } catch {
       return `__unparseable__:${json}`;
     }
   }, []);
-  const initialStateRef = React9.useRef(initialState);
+  const initialStateRef = React8.useRef(initialState);
   const baselineCanonical = canonicalize(serializeState(initialStateRef.current, value));
   const currentCanonical = canonicalize(serializeState(editorState, value));
   const isDirty = currentCanonical !== baselineCanonical;
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     onDirtyChange?.(isDirty);
   }, [isDirty, onDirtyChange]);
-  const lastDiscardTriggerRef = React9.useRef(discardTrigger);
-  React9.useEffect(() => {
+  const lastDiscardTriggerRef = React8.useRef(discardTrigger);
+  React8.useEffect(() => {
     if (discardTrigger === void 0) return;
     if (discardTrigger === lastDiscardTriggerRef.current) return;
     lastDiscardTriggerRef.current = discardTrigger;
@@ -22715,7 +22709,7 @@ function FieldEditor({
     }
     return Math.max(start + 1, end2);
   };
-  useEffect11(() => {
+  useEffect10(() => {
     if (focusLevel === "field" || selectedRowIdx < 0) return;
     setListScrollStart((previous) => {
       if (initialFocusTarget && !initialFocusScrollApplied.current) {
@@ -23773,7 +23767,7 @@ function finalizeReviewSession(extractSessionId, components) {
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/09-review/use-review-session.ts
-import { useCallback as useCallback2, useEffect as useEffect13, useRef as useRef8, useState as useState17 } from "react";
+import { useCallback as useCallback2, useEffect as useEffect12, useRef as useRef8, useState as useState17 } from "react";
 
 // packages/experience-design-system-cli/src/tui/import/steps/09-review/history.ts
 var DEFAULT_MAX_DEPTH = 50;
@@ -23829,7 +23823,7 @@ function createHistoryStack(seed, maxDepth = DEFAULT_MAX_DEPTH) {
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/09-review/use-finalize-preview.ts
-import { useEffect as useEffect12, useRef as useRef7, useState as useState16 } from "react";
+import { useEffect as useEffect11, useRef as useRef7, useState as useState16 } from "react";
 
 // packages/experience-design-system-cli/src/tui/import/steps/09-review/run-live-preview.ts
 var TimeoutError = class extends Error {
@@ -23981,7 +23975,7 @@ function useFinalizePreview(opts) {
   const [scrollOffset, setScrollOffset] = useState16(0);
   const generationRef = useRef7(0);
   const acceptedKey = [...acceptedKeys].sort().join("\0");
-  useEffect12(() => {
+  useEffect11(() => {
     if (!open) {
       setStatus("idle");
       setRemoved([]);
@@ -24044,7 +24038,7 @@ function useReviewSession({
     }));
     return { result, catalog };
   }, [loadSession, tokensPath]);
-  useEffect13(() => {
+  useEffect12(() => {
     let disposed = false;
     void (async () => {
       try {
@@ -24097,7 +24091,7 @@ function useReviewSession({
 function useReviewMetadata({ components, selectedIdx, extractSessionId }) {
   const [reviewMetadata, setReviewMetadata] = useState17(null);
   const [componentRationale, setComponentRationale] = useState17(null);
-  useEffect13(() => {
+  useEffect12(() => {
     const current = components[selectedIdx];
     if (!current) {
       setReviewMetadata(null);
@@ -24129,7 +24123,7 @@ function useReviewMetadata({ components, selectedIdx, extractSessionId }) {
 function useReviewHistory({ loading, components, createSnapshot, applySnapshot }) {
   const historyRef = useRef8(null);
   const historySeededRef = useRef8(false);
-  useEffect13(() => {
+  useEffect12(() => {
     if (loading || historySeededRef.current) return;
     historySeededRef.current = true;
     historyRef.current = createHistoryStack(createSnapshot(components));
@@ -24180,7 +24174,7 @@ function useReviewFinalize({
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/09-review/use-review-editor.ts
-import { useEffect as useEffect14, useRef as useRef9, useState as useState18 } from "react";
+import { useEffect as useEffect13, useRef as useRef9, useState as useState18 } from "react";
 
 // packages/experience-design-system-cli/src/tui/import/steps/09-review/token-suggestions.ts
 function collectTokenSuggestions(entry, availableTokens = []) {
@@ -24233,7 +24227,7 @@ function useReviewEditor({
   const [tokenReviewEditSelection, setTokenReviewEditSelection] = useState18(/* @__PURE__ */ new Set());
   const tokenReviewSuggestedRef = useRef9(/* @__PURE__ */ new Map());
   const pendingGRef = useRef9(false);
-  useEffect14(() => {
+  useEffect13(() => {
     setTokenReviewRow(0);
     setTokenReviewEditing(false);
     setTokenReviewEditCursor(0);
@@ -24637,7 +24631,7 @@ function handleJsonPanelInput(input, key, state) {
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/09-review/use-review-preview.ts
-import { useCallback as useCallback4, useEffect as useEffect16, useState as useState21 } from "react";
+import { useCallback as useCallback4, useEffect as useEffect15, useState as useState21 } from "react";
 
 // packages/experience-design-system-cli/src/tui/import/steps/09-review/preview-annotations.ts
 function applyPreviewAnnotations(preview, localNames) {
@@ -24672,7 +24666,7 @@ function applyPreviewAnnotations(preview, localNames) {
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/09-review/use-live-preview.ts
-import { useCallback as useCallback3, useEffect as useEffect15, useRef as useRef10, useState as useState20 } from "react";
+import { useCallback as useCallback3, useEffect as useEffect14, useRef as useRef10, useState as useState20 } from "react";
 var DEFAULT_DEBOUNCE_MS = 500;
 function useLivePreview(opts) {
   const debounceMs = opts.debounceMs ?? DEFAULT_DEBOUNCE_MS;
@@ -24683,14 +24677,14 @@ function useLivePreview(opts) {
   const latestRef = useRef10(0);
   const inflightRef = useRef10(0);
   const optsRef = useRef10(opts);
-  useEffect15(() => {
+  useEffect14(() => {
     optsRef.current = opts;
   });
   const disabledRef = useRef10(disabled);
-  useEffect15(() => {
+  useEffect14(() => {
     disabledRef.current = disabled;
   }, [disabled]);
-  useEffect15(() => {
+  useEffect14(() => {
     return () => {
       if (timerRef.current) {
         clearTimeout(timerRef.current);
@@ -24804,13 +24798,13 @@ function useReviewPreview({
     deleteAllComponents
   });
   const [spinnerTick, setSpinnerTick] = useState21(0);
-  useEffect16(() => {
+  useEffect15(() => {
     if (livePreviewHook.status !== "running") return;
     const id = setInterval(() => setSpinnerTick((tick) => tick + 1), 80);
     return () => clearInterval(id);
   }, [livePreviewHook.status]);
   const livePreviewSpinner = SPINNER_FRAMES[spinnerTick % SPINNER_FRAMES.length];
-  useEffect16(() => {
+  useEffect15(() => {
     if (loading) return;
     if (!livePreview) return;
     if (components.length === 0) return;
@@ -25230,7 +25224,7 @@ function GenerateReviewStepView({
     [components]
   );
   const closures = useMemo4(() => computeAllClosures(componentGraph), [componentGraph]);
-  useEffect17(() => {
+  useEffect16(() => {
     if (seededGroupsRef.current) return;
     if (closures.size === 0 && slotCycles.length === 0) return;
     seededGroupsRef.current = true;
@@ -25257,7 +25251,7 @@ function GenerateReviewStepView({
       suggestedBreak: cycle.edges.length > 0 ? suggestCycleBreakEdge2(cycle, cycleView.pushBlocking) : null
     }));
   }, [slotCycles, cycleView]);
-  useEffect17(() => {
+  useEffect16(() => {
     const decision = computeAutoRejectDecision({
       loading,
       autoRejectFired: autoRejectFiredRef.current,
@@ -25301,7 +25295,7 @@ function GenerateReviewStepView({
     applySnapshot: applyHistorySnapshot
   });
   const autoRejectPushedRef = useRef11(false);
-  useEffect17(() => {
+  useEffect16(() => {
     if (loading) return;
     if (!historySeededRef.current) return;
     if (!autoRejectFiredRef.current) return;
@@ -25385,7 +25379,7 @@ function GenerateReviewStepView({
   const panelHeight = leftPanelHeight + 2;
   const panelContentHeight = Math.max(1, panelHeight - 3);
   const cycleViewportHeight = Math.max(1, panelHeight - 4);
-  useEffect17(() => {
+  useEffect16(() => {
     if (selectableRowPositions.length === 0) return;
     const cursorInRange = selectableRowPositions.includes(cursorRowIdx);
     const maxScroll = Math.max(0, visibleRowsMemo.length - visibleCount);
@@ -26345,10 +26339,10 @@ function normalizePath(input) {
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/10-flow/support/use-blinking-cursor.ts
-import { useEffect as useEffect18, useState as useState23 } from "react";
+import { useEffect as useEffect17, useState as useState23 } from "react";
 function useBlinkingCursor() {
   const [visible, setVisible] = useState23(true);
-  useEffect18(() => {
+  useEffect17(() => {
     const interval = setInterval(() => setVisible((current) => !current), 500);
     return () => clearInterval(interval);
   }, []);
@@ -26456,12 +26450,12 @@ function StepHeader({ stepNumber, totalSteps, title }) {
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/10-flow/support/use-timed-spinner.tsx
-import { useEffect as useEffect19, useState as useState25 } from "react";
+import { useEffect as useEffect18, useState as useState25 } from "react";
 import { Spinner as Spinner2 } from "@inkjs/ui";
 import { jsx as jsx49 } from "react/jsx-runtime";
 function useTimedSpinner() {
   const [elapsedSeconds, setElapsedSeconds] = useState25(0);
-  useEffect19(() => {
+  useEffect18(() => {
     const timer = setInterval(() => setElapsedSeconds((current) => current + 1), 1e3);
     return () => {
       clearInterval(timer);
@@ -26510,7 +26504,7 @@ function PushingStep({ stepNumber, totalSteps, progress }) {
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/10-flow/screens/WizardPreviewStep.tsx
-import { useEffect as useEffect20, useState as useState26, useMemo as useMemo5 } from "react";
+import { useEffect as useEffect19, useState as useState26, useMemo as useMemo5 } from "react";
 import { Box as Box40, Text as Text43 } from "ink";
 
 // packages/experience-design-system-cli/src/tui/import/steps/10-flow/support/preview-diff.ts
@@ -26895,7 +26889,7 @@ function WizardPreviewStep({
   const activeLines = diffExpanded ? diffLines : summaryLines;
   const maxScroll = Math.max(0, activeLines.length - viewportHeight);
   const boundedScrollOffset = Math.min(scrollOffset, maxScroll);
-  useEffect20(() => {
+  useEffect19(() => {
     setScrollOffset((previous) => Math.min(previous, maxScroll));
   }, [maxScroll]);
   useImmediateInput((input, key) => {
@@ -26994,18 +26988,10 @@ function FlowScreen({
   controller,
   livePreview = true,
   generatePromptPath,
-  onExit,
-  onStepChange
+  onExit
 }) {
   const totalSteps = totalStepsFor(state);
   const quit = () => onExit(0);
-  const previousStep = useRef12(state.step);
-  useEffect21(() => {
-    if (previousStep.current !== state.step) {
-      onStepChange?.();
-      previousStep.current = state.step;
-    }
-  }, [state.step, onStepChange]);
   const content = (() => {
     switch (state.step) {
       case "final-review":
@@ -27131,7 +27117,7 @@ function FlowScreen({
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/10-flow/flow/use-flow.ts
-import { useEffect as useEffect22, useRef as useRef13, useSyncExternalStore } from "react";
+import { useEffect as useEffect20, useRef as useRef12, useSyncExternalStore } from "react";
 
 // packages/experience-design-system-cli/src/tui/import/steps/10-flow/flow/controller.ts
 import { appendFileSync, writeFileSync } from "node:fs";
@@ -27721,6 +27707,12 @@ function createFlowController(start, deps) {
       deps.log({ update: sanitizeForLog(patch) });
     } catch {
     }
+    if (patch.step !== void 0 && patch.step !== state.step) {
+      try {
+        deps.beforeStepChange?.();
+      } catch {
+      }
+    }
     state = { ...state, ...patch };
     for (const listener of listeners) listener();
   };
@@ -27858,28 +27850,32 @@ function createFlowController(start, deps) {
 }
 
 // packages/experience-design-system-cli/src/tui/import/steps/10-flow/flow/use-flow.ts
-function useFlow(start, deps = realFlowDeps) {
-  const controller = useRef13();
+function useFlow(start, options = {}) {
+  const controller = useRef12();
   if (start && !controller.current) {
     try {
       startWizardLog();
     } catch {
     }
-    controller.current = createFlowController(start, deps());
+    const flowDeps = (options.deps ?? realFlowDeps)();
+    controller.current = createFlowController(start, {
+      ...flowDeps,
+      ...options.beforeStepChange ? { beforeStepChange: options.beforeStepChange } : {}
+    });
   }
   const current = controller.current;
   const state = useSyncExternalStore(
     (listener) => current?.subscribe(listener) ?? (() => void 0),
     () => current?.getState()
   );
-  useEffect22(() => {
+  useEffect20(() => {
     if (!start) controller.current = void 0;
   }, [start]);
   return current && state ? { controller: current, state } : void 0;
 }
 
 // packages/experience-design-system-cli/src/tui/help/PageContainer.tsx
-import { useEffect as useEffect23, useState as useState27 } from "react";
+import { useEffect as useEffect21, useState as useState27 } from "react";
 import { Box as Box42, Text as Text44, useInput as useInput9 } from "ink";
 
 // packages/experience-design-system-cli/src/tui/debug-store.ts
@@ -28073,7 +28069,7 @@ function Section({ title, rows }) {
 }
 function HelpScreen({ onDone }) {
   const [info, setInfo] = useState27();
-  useEffect23(() => {
+  useEffect21(() => {
     startDebugRun({ flow: "help", step: "01-help", menuOption: "Help", inputs: {} });
     void readHelpInfo().then(setInfo);
   }, []);
@@ -28166,7 +28162,7 @@ function SettingsScreen({
 }
 
 // packages/experience-design-system-cli/src/tui/settings/contentful-configuration/ContentfulConfigScreen.tsx
-import { useEffect as useEffect24, useState as useState29 } from "react";
+import { useEffect as useEffect22, useState as useState29 } from "react";
 import { Box as Box44, Text as Text46, useInput as useInput11 } from "ink";
 import TextInput4 from "ink-text-input";
 
@@ -28234,7 +28230,7 @@ function ConfigurationScreen({ onDone }) {
   const [lastSaved, setLastSaved] = useState29(null);
   const [editing, setEditing] = useState29(false);
   const [valueBeforeEdit, setValueBeforeEdit] = useState29("");
-  useEffect24(() => {
+  useEffect22(() => {
     readCredentials().then((cfg) => {
       setConfig(cfg);
       setStage("form");
@@ -28371,7 +28367,7 @@ function ConfigurationScreen({ onDone }) {
 }
 
 // packages/experience-design-system-cli/src/tui/settings/opt-in-analytics/screen.tsx
-import { useEffect as useEffect25, useState as useState30 } from "react";
+import { useEffect as useEffect23, useState as useState30 } from "react";
 import { Box as Box45, Text as Text47, useInput as useInput12 } from "ink";
 
 // packages/experience-design-system-cli/src/tui/settings/opt-in-analytics/analytics-store.ts
@@ -28394,7 +28390,7 @@ import { Fragment as Fragment18, jsx as jsx56, jsxs as jsxs46 } from "react/jsx-
 function OptInAnalyticsScreen({ onDone }) {
   const [loading, setLoading] = useState30(true);
   const [enabled, setEnabled] = useState30(true);
-  useEffect25(() => {
+  useEffect23(() => {
     readAnalyticsSetting().then((setting) => {
       setEnabled(setting.enabled);
       setLoading(false);
@@ -28448,13 +28444,13 @@ function OptInAnalyticsScreen({ onDone }) {
 }
 
 // packages/experience-design-system-cli/src/tui/upgrade/PageContainer.tsx
-import { useEffect as useEffect26, useState as useState31 } from "react";
+import { useEffect as useEffect24, useState as useState31 } from "react";
 import { Box as Box46, Text as Text48, useInput as useInput13 } from "ink";
 import { jsx as jsx57, jsxs as jsxs47 } from "react/jsx-runtime";
 var UPGRADE_COMMANDS = ["git pull", "pnpm install", "pnpm build"];
 function UpgradeScreen({ onDone }) {
   const [upgradeCheck, setUpgradeCheck] = useState31();
-  useEffect26(() => {
+  useEffect24(() => {
     startDebugRun({
       flow: "upgrade",
       step: "01-upgrade",
@@ -28519,13 +28515,13 @@ function renderBody(upgradeCheck) {
 }
 
 // packages/experience-design-system-cli/src/tui/settings/debug-mode/screen.tsx
-import { useEffect as useEffect27, useState as useState32 } from "react";
+import { useEffect as useEffect25, useState as useState32 } from "react";
 import { Box as Box47, Text as Text49, useInput as useInput14 } from "ink";
 import { jsx as jsx58, jsxs as jsxs48 } from "react/jsx-runtime";
 function DebugModeScreen({ onDone }) {
   const [loading, setLoading] = useState32(true);
   const [enabled, setEnabled] = useState32(true);
-  useEffect27(() => {
+  useEffect25(() => {
     readDebugModeSetting().then((setting) => {
       setEnabled(setting.enabled);
       setLoading(false);
@@ -28603,9 +28599,9 @@ function App({ importOptions, inkClear }) {
   const [generationInput, setGenerationInput] = useState33();
   const generation = useGeneration(generationInput);
   const [flowStart, setFlowStart] = useState33();
-  const flow = useFlow(flowStart);
+  const flow = useFlow(flowStart, { beforeStepChange: inkClear });
   const [importDefaults, setImportDefaults] = useState33();
-  useEffect28(() => {
+  useEffect26(() => {
     if (screen !== "import") {
       setImportDefaults(void 0);
       return;
@@ -28663,12 +28659,12 @@ function App({ importOptions, inkClear }) {
       }
     });
   };
-  useEffect28(() => {
+  useEffect26(() => {
     if (!extractionRun || extraction?.status !== "done" || !extraction.result.ok) return;
     setExtractionRun(void 0);
     setScopeRun({ ...extractionRun, extraction: extraction.result.extraction });
   }, [extraction, extractionRun]);
-  useEffect28(() => {
+  useEffect26(() => {
     if (!scopeRun || scopeFlow?.status !== "confirmed" || generationInput) return;
     const { extraction: produced, input, generatePromptPath } = scopeRun;
     setGenerationInput({
@@ -28686,7 +28682,7 @@ function App({ importOptions, inkClear }) {
       ...generatePromptPath ? { generatePromptPath } : {}
     });
   }, [scopeFlow, scopeRun, generationInput]);
-  useEffect28(() => {
+  useEffect26(() => {
     if (!scopeRun || generation?.status !== "done" || !generation.result.ok) return;
     const { credentialsSkipped, tokenStrategy, extraction: produced, input, generatePromptPath } = scopeRun;
     inkClear();
@@ -28737,11 +28733,7 @@ function App({ importOptions, inkClear }) {
             state: flow.state,
             controller: flow.controller,
             generatePromptPath: flowStart.generatePromptPath,
-            onExit: (code) => {
-              inkClear();
-              setImportExitCode(code);
-            },
-            onStepChange: inkClear
+            onExit: setImportExitCode
           }
         );
       }