@pellux/goodvibes-agent 1.0.38 → 1.0.40

package/CHANGELOG.md

@@ -2,6 +2,16 @@
 
 Product-facing release notes for GoodVibes Agent.
 
+## 1.0.40 - 2026-06-04
+
+- Onboarding now uses a dedicated fullscreen workspace renderer copied from the settings-style workspace, so setup can be tuned without changing Settings, MCP, or Agent workspaces.
+- First-run setup keeps the settings-style left rail, detail pane, field pane, and footer while the shell gives it the full terminal height, hiding the prompt/input area until setup is complete.
+
+## 1.0.39 - 2026-06-04
+
+- Removed the body-scoped onboarding overlay fallback so onboarding can only render through the shell fullscreen composite.
+- Added regression coverage for the fullscreen onboarding composite and nested model workspace composite.
+
 ## 1.0.38 - 2026-06-04
 
 - Onboarding now uses the shared fullscreen workspace surface so it owns the full terminal height, including the composer area.

package/dist/package/main.js

@@ -817087,7 +817087,7 @@ var createStyledCell = (char, overrides = {}) => ({
 // src/version.ts
 import { readFileSync } from "fs";
 import { join } from "path";
-var _version = "1.0.38";
+var _version = "1.0.40";
 try {
   const pkg = JSON.parse(readFileSync(join(import.meta.dir, "..", "package.json"), "utf-8"));
   _version = typeof pkg.version === "string" ? pkg.version : _version;
@@ -906062,311 +906062,13 @@ function renderAutocompleteOverlay(autocomplete, width, viewportHeight = 24) {
   return lines;
 }
 
-// src/renderer/onboarding/onboarding-wizard.ts
-function modeLabel(mode) {
-  if (mode === "edit")
-    return "Edit existing";
-  if (mode === "reopen")
-    return "Reopen review";
-  return "New setup";
-}
-function changedScreensLabel(wizard) {
-  if (wizard.dirtyStepCount === 0)
-    return "no changes";
-  if (wizard.dirtyStepCount === 1)
-    return "1 changed screen";
-  return `${wizard.dirtyStepCount} changed screens`;
-}
-function stepGlyph(wizard, step, stepIndex) {
-  if (stepIndex === wizard.stepIndex)
-    return { glyph: GLYPHS.navigation.selected, fg: FULLSCREEN_PALETTE.info };
-  const total = wizard.getStepFieldCount(stepIndex);
-  const completed = wizard.getCompletedFieldCount(stepIndex);
-  if (wizard.isStepDirty(stepIndex))
-    return { glyph: GLYPHS.status.review, fg: FULLSCREEN_PALETTE.warn };
-  if (total > 0 && completed === total)
-    return { glyph: GLYPHS.status.success, fg: FULLSCREEN_PALETTE.good };
-  return { glyph: GLYPHS.status.pending, fg: FULLSCREEN_PALETTE.muted };
-}
-function fieldRowPrefix(wizard, field, selected) {
-  if (selected)
-    return `${GLYPHS.navigation.selected} `;
-  if (wizard.isFieldDirty(field.id))
-    return `${GLYPHS.status.skipped} `;
-  if (field.kind === "checklist")
-    return wizard.getFieldValue(field) ? `${GLYPHS.status.success} ` : "\u25A1 ";
-  if (field.kind === "acknowledgement")
-    return wizard.getFieldValue(field) ? `${GLYPHS.status.success} ` : "\u25A1 ";
-  if (field.kind === "action")
-    return `${GLYPHS.navigation.next} `;
-  if (field.kind === "radio")
-    return `${GLYPHS.status.active} `;
-  return "  ";
-}
-function fieldColor(wizard, field, selected) {
-  if (selected)
-    return FULLSCREEN_PALETTE.text;
-  if (field.kind === "status" || field.kind === "modelPicker")
-    return FULLSCREEN_PALETTE.info;
-  if (field.kind === "masked")
-    return FULLSCREEN_PALETTE.warn;
-  if (field.kind === "acknowledgement")
-    return wizard.getFieldValue(field) ? FULLSCREEN_PALETTE.good : FULLSCREEN_PALETTE.warn;
-  if (field.kind === "checklist")
-    return wizard.getFieldValue(field) ? FULLSCREEN_PALETTE.good : FULLSCREEN_PALETTE.muted;
-  if (wizard.getFieldValueLabel(field) === "Missing")
-    return FULLSCREEN_PALETTE.warn;
-  return FULLSCREEN_PALETTE.text;
-}
-function formatEditingValue(value, multiline) {
-  if (!multiline)
-    return value;
-  const lines = value.split(/\r?\n/);
-  if (lines.length <= 1)
-    return value;
-  const preview4 = lines[lines.length - 1] ?? "";
-  return `${preview4} (${lines.length} lines)`;
-}
-function fieldHint(wizard, field, selected) {
-  if (selected && wizard.isEditingTextField() && wizard.editingFieldId === field.id && (field.kind === "text" || field.kind === "masked")) {
-    const rawValue = wizard.editBuffer.length > 0 ? wizard.editBuffer : field.placeholder;
-    const editingValue = field.kind === "masked" && wizard.editBuffer.length > 0 ? "\u2022".repeat(Math.min(12, Math.max(4, wizard.editBuffer.length))) : formatEditingValue(rawValue, field.kind === "text" && field.multiline === true);
-    return `Editing: ${editingValue}${GLYPHS.surface.cursor}`;
-  }
-  if (selected && field.kind === "modelPicker")
-    return `${field.hint} Press Enter to open picker.`;
-  if (selected && field.kind === "text") {
-    return field.multiline === true ? `${field.hint} Press Enter to edit; Ctrl-J inserts a new line.` : `${field.hint} Press Enter to edit inline.`;
-  }
-  if (selected && field.kind === "masked")
-    return `${field.hint} Press Enter to edit inline.`;
-  return field.hint;
-}
-function selectedFieldText(wizard) {
-  if (wizard.isEditingTextField() && wizard.editingFieldId !== null) {
-    const editingField = wizard.getFieldById(wizard.editingFieldId);
-    if (editingField) {
-      return {
-        title: `Editing: ${editingField.label}`,
-        hint: fieldHint(wizard, editingField, true)
-      };
-    }
-  }
-  const field = wizard.getSelectedField();
-  if (!field)
-    return { title: "Selected: none", hint: "No selectable row is active on this screen." };
-  return {
-    title: `Selected: ${field.label} [${wizard.getFieldValueLabel(field)}]`,
-    hint: fieldHint(wizard, field, true)
-  };
-}
-function footerText4(wizard) {
-  if (wizard.isEditingTextField()) {
-    return wizard.isEditingMultilineTextField() ? "Controls: [Enter] save \xB7 [Ctrl-J] new line \xB7 [Esc] cancel \xB7 [Backspace] delete \xB7 [Del/Ctrl+U] clear" : "Controls: [Enter] save \xB7 [Esc] cancel \xB7 [Backspace] delete \xB7 [Del/Ctrl+U] clear";
-  }
-  return "Controls: [Enter] toggle/open \xB7 [Esc] close \xB7 [Tab/Shift+Tab] screen \xB7 [Up/Down] move \xB7 [Del/Ctrl+U] clear";
-}
-function controlsText(wizard) {
-  if (wizard.isEditingTextField()) {
-    return wizard.isEditingMultilineTextField() ? "Controls: Enter saves, Ctrl-J inserts a line, Esc cancels, Backspace deletes, Del clears." : "Controls: Enter saves, Esc cancels, Backspace deletes, Del clears.";
-  }
-  return "Controls: Enter selects, Del clears, Tab moves.";
-}
-function buildFieldRows(wizard, visibleFields, capacity) {
-  wizard.ensureSelectionVisible(visibleFields);
-  const fields = wizard.currentStep.fields;
-  const rows = [];
-  if (fields.length === 0 || capacity <= 0)
-    return rows;
-  const allRows = [];
-  fields.forEach((field, absoluteIndex) => {
-    const spacerRows = Math.max(0, field.spacerBeforeRows ?? 0);
-    for (let index = 0;index < spacerRows; index += 1)
-      allRows.push({ kind: "empty" });
-    allRows.push({ kind: "field", field, absoluteIndex });
-  });
-  const selectedFieldIndex = wizard.getSelectedFieldIndex();
-  const selectedRowIndex = Math.max(0, allRows.findIndex((row) => row.kind === "field" && row.absoluteIndex === selectedFieldIndex));
-  const scrollFieldIndex = wizard.scrollOffsets[wizard.stepIndex] ?? 0;
-  const scrollRowIndex = allRows.findIndex((row) => row.kind === "field" && row.absoluteIndex === scrollFieldIndex);
-  const maxStart = Math.max(0, allRows.length - capacity);
-  let start2 = Math.max(0, Math.min(scrollRowIndex >= 0 ? scrollRowIndex : 0, maxStart));
-  if (selectedRowIndex < start2)
-    start2 = selectedRowIndex;
-  if (selectedRowIndex >= start2 + capacity)
-    start2 = selectedRowIndex - capacity + 1;
-  start2 = Math.max(0, Math.min(start2, maxStart));
-  if (capacity > 1 && start2 > 0 && selectedRowIndex === start2)
-    start2 = Math.max(0, start2 - 1);
-  if (capacity > 1 && start2 + capacity < allRows.length && selectedRowIndex === start2 + capacity - 1) {
-    start2 = Math.min(maxStart, start2 + 1);
-  }
-  rows.push(...allRows.slice(start2, start2 + capacity));
-  const firstVisibleRow = rows[0];
-  if (start2 > 0 && rows.length > 0 && !(firstVisibleRow?.kind === "field" && firstVisibleRow.absoluteIndex === selectedFieldIndex)) {
-    rows[0] = { kind: "moreAbove", text: `${GLYPHS.navigation.moreAbove} ${start2} more above` };
-  }
-  const hiddenBelow = Math.max(0, allRows.length - (start2 + capacity));
-  const lastVisibleRow = rows[rows.length - 1];
-  if (hiddenBelow > 0 && rows.length > 0 && !(lastVisibleRow?.kind === "field" && lastVisibleRow.absoluteIndex === selectedFieldIndex)) {
-    rows[rows.length - 1] = { kind: "moreBelow", text: `${GLYPHS.navigation.moreBelow} ${hiddenBelow} more below` };
-  }
-  while (rows.length < capacity)
-    rows.push({ kind: "empty" });
-  return rows.slice(0, capacity);
-}
-function pushWrapped(rows, text, width, options = {}) {
-  if (text.length === 0) {
-    rows.push({ text: "", kind: "empty" });
-    return;
-  }
-  for (const line2 of wrapText(text, Math.max(1, width))) {
-    rows.push({ text: line2, ...options });
-  }
-}
-function buildStepRows(wizard, height) {
-  const rendered = wizard.steps.map((step, stepIndex) => {
-    const selected = stepIndex === wizard.stepIndex;
-    const state4 = stepGlyph(wizard, step, stepIndex);
-    const completion = `${wizard.getCompletedFieldCount(stepIndex)}/${wizard.getStepFieldCount(stepIndex)}`;
-    return {
-      text: `${state4.glyph} ${stepIndex + 1}. ${step.shortLabel} ${completion}`,
-      selected,
-      kind: "item",
-      fg: state4.fg,
-      bold: selected
-    };
-  });
-  const visible = Math.max(1, height);
-  const window3 = stableWindow(rendered.length, wizard.stepIndex, visible);
-  const rows = rendered.slice(window3.start, window3.end);
-  if (window3.start > 0 && rows.length > 0) {
-    rows[0] = { text: `${GLYPHS.navigation.moreAbove} ${window3.start} more step(s) above`, kind: "more", fg: FULLSCREEN_PALETTE.dim, dim: true };
-  }
-  if (window3.end < rendered.length && rows.length > 0) {
-    rows[rows.length - 1] = { text: `${GLYPHS.navigation.moreBelow} ${rendered.length - window3.end} more step(s) below`, kind: "more", fg: FULLSCREEN_PALETTE.dim, dim: true };
-  }
-  while (rows.length < height)
-    rows.push({ text: "", kind: "empty" });
-  return rows.slice(0, height);
-}
-function buildContextRows2(wizard, width) {
-  const step = wizard.currentStep;
-  const selected = selectedFieldText(wizard);
-  const rows = [
-    { text: step.title, fg: FULLSCREEN_PALETTE.title, bold: true }
-  ];
-  const pushSummaryRows = () => {
-    rows.push({ text: "Summary", fg: FULLSCREEN_PALETTE.subtitle, bold: true });
-    rows.push({ text: step.summaryTitle, fg: FULLSCREEN_PALETTE.info, bold: true });
-    for (const line2 of step.summaryLines.slice(0, 4)) {
-      pushWrapped(rows, line2, width, { fg: FULLSCREEN_PALETTE.text });
-    }
-    rows.push({
-      text: `Fields ${wizard.getCompletedFieldCount(wizard.stepIndex)}/${wizard.getStepFieldCount(wizard.stepIndex)} complete \xB7 ${changedScreensLabel(wizard)}`,
-      fg: wizard.dirtyStepCount > 0 ? FULLSCREEN_PALETTE.warn : FULLSCREEN_PALETTE.muted
-    });
-  };
-  const pushSelectedRows = () => {
-    rows.push({ text: selected.title, fg: FULLSCREEN_PALETTE.info, bold: true });
-    pushWrapped(rows, selected.hint, width, { fg: FULLSCREEN_PALETTE.text });
-    pushWrapped(rows, controlsText(wizard), width, { fg: FULLSCREEN_PALETTE.info });
-  };
-  pushWrapped(rows, step.description, width, { fg: FULLSCREEN_PALETTE.text });
-  rows.push({ text: "", kind: "empty" });
-  if (wizard.isEditingTextField()) {
-    pushSelectedRows();
-    rows.push({ text: "", kind: "empty" });
-    pushSummaryRows();
-  } else {
-    pushSummaryRows();
-    rows.push({ text: "", kind: "empty" });
-    pushSelectedRows();
-  }
-  if (wizard.hydrationPending || wizard.hydrationError !== null || wizard.applyFeedback !== null) {
-    rows.push({ text: "", kind: "empty" });
-  }
-  if (wizard.hydrationPending) {
-    rows.push({ text: "Loading current settings...", fg: FULLSCREEN_PALETTE.info, bold: true });
-  }
-  if (wizard.hydrationError !== null) {
-    pushWrapped(rows, `Current settings could not load: ${wizard.hydrationError}`, width, { fg: FULLSCREEN_PALETTE.bad, bold: true });
-  }
-  if (wizard.applyFeedback !== null) {
-    const feedbackColor = wizard.applyFeedback.severity === "error" ? FULLSCREEN_PALETTE.bad : wizard.applyFeedback.severity === "warning" ? FULLSCREEN_PALETTE.warn : FULLSCREEN_PALETTE.info;
-    rows.push({ text: wizard.applyFeedback.title, fg: feedbackColor, bold: true });
-    pushWrapped(rows, wizard.applyFeedback.summary, width, { fg: FULLSCREEN_PALETTE.text });
-    for (const message of wizard.applyFeedback.messages) {
-      pushWrapped(rows, message, width, { fg: FULLSCREEN_PALETTE.muted });
-    }
-  }
-  return rows;
-}
-function formatFieldRowText(wizard, field, selected, width) {
-  const badge = `[${wizard.getFieldValueLabel(field)}]`;
-  const badgeWidth = getDisplayWidth(badge);
-  const labelWidth = Math.max(1, width - badgeWidth - 2);
-  const label = truncateDisplay(`${fieldRowPrefix(wizard, field, selected)}${field.label}`, labelWidth);
-  return `${label}${" ".repeat(Math.max(1, width - getDisplayWidth(label) - badgeWidth))}${badge}`;
-}
-function buildControlRows2(wizard, width, height) {
-  const visibleFields = Math.max(1, height);
-  const fieldRows = buildFieldRows(wizard, visibleFields, height);
-  const rows = fieldRows.map((row) => {
-    if (row.kind === "empty")
-      return { text: "", kind: "empty" };
-    if (row.kind === "moreAbove" || row.kind === "moreBelow") {
-      return { text: row.text, kind: "more", fg: FULLSCREEN_PALETTE.dim, dim: true };
-    }
-    const selected = row.absoluteIndex === wizard.getSelectedFieldIndex();
-    return {
-      text: formatFieldRowText(wizard, row.field, selected, width),
-      selected,
-      kind: "item",
-      fg: fieldColor(wizard, row.field, selected),
-      bold: selected || row.field.kind === "action"
-    };
-  });
-  while (rows.length < height)
-    rows.push({ text: "", kind: "empty" });
-  return rows.slice(0, height);
-}
-function renderOnboardingWizard(wizard, width, viewportHeight) {
-  const layoutOptions = {
-    width,
-    height: viewportHeight,
-    leftWidth: width < 90 ? undefined : 30,
-    contextRatio: 0.42,
-    minContextRows: 8
-  };
-  const metrics = getFullscreenWorkspaceMetrics(layoutOptions);
-  return renderFullscreenWorkspace({
-    width,
-    height: viewportHeight,
-    title: "GoodVibes Agent / Onboarding Wizard",
-    stateLabel: `${modeLabel(wizard.mode)} \xB7 ${wizard.stepIndex + 1}/${wizard.steps.length} \xB7 ${changedScreensLabel(wizard)}`,
-    leftHeader: "Steps",
-    mainHeader: wizard.currentStep.title,
-    leftRows: buildStepRows(wizard, metrics.bodyRows),
-    contextRows: buildContextRows2(wizard, metrics.contextWidth),
-    controlRows: buildControlRows2(wizard, metrics.contextWidth, metrics.controlRows),
-    footer: footerText4(wizard),
-    leftWidth: layoutOptions.leftWidth,
-    contextRatio: layoutOptions.contextRatio,
-    minContextRows: layoutOptions.minContextRows
-  });
-}
-
 // src/renderer/conversation-overlays.ts
 function applyConversationOverlays(viewport, context) {
   const { input, conversation, commandRegistry, keybindingsManager, conversationWidth, viewportHeight, contextWindow } = context;
   let next = viewport;
   const bottomDockInset = 1 + (input.searchManager.active || input.historySearch.active ? 1 : 0);
   if (input.onboardingWizard.active) {
-    const lines = renderOnboardingWizard(input.onboardingWizard, conversationWidth, viewportHeight);
-    next = replaceViewportWithOverlay(lines, conversationWidth, viewportHeight);
-    if (!input.modelPicker.active)
-      return next;
+    return next;
   }
   if (input.filePicker.active) {
     const lines = renderFilePickerOverlay(input.filePicker, conversationWidth, viewportHeight);
@@ -906717,6 +906419,423 @@ function handleBlockingShellInput(options) {
   return { handled: false, pendingPermission, recoveryPending };
 }
 
+// src/renderer/onboarding/onboarding-workspace.ts
+var WORKSPACE_PALETTE2 = FULLSCREEN_PALETTE;
+function drawVertical3(line2, x2, bg = "") {
+  if (x2 <= 0 || x2 >= line2.length - 1)
+    return;
+  drawVerticalRule(line2, x2, WORKSPACE_PALETTE2.border, bg);
+}
+function drawHorizontalRange2(line2, startX, endX, bg = "") {
+  drawHorizontalRule(line2, Math.max(1, startX), Math.min(line2.length - 2, endX), WORKSPACE_PALETTE2.border, bg);
+}
+function leftWidthFor2(width, explicit) {
+  if (explicit !== undefined)
+    return clamp3(explicit, 14, Math.max(14, width - 24));
+  return width < 80 ? clamp3(Math.round(width * 0.32), 14, Math.max(14, width - 24)) : clamp3(Math.round(width * 0.22), 24, 34);
+}
+function getFullscreenWorkspaceMetrics2(options) {
+  const safeWidth = Math.max(1, options.width);
+  const safeHeight = Math.max(12, options.height);
+  const leftWidth = leftWidthFor2(safeWidth, options.leftWidth);
+  const centerWidth = Math.max(20, safeWidth - leftWidth - 3);
+  const bodyTop = 3;
+  const footerY = safeHeight - 2;
+  const bodyRows = Math.max(4, footerY - bodyTop);
+  const contextWidth = Math.max(10, centerWidth - 2);
+  const maxContextRows = Math.max(3, bodyRows - 4);
+  const minContextRows = clamp3(options.minContextRows ?? 10, 3, maxContextRows);
+  const contextRows = clamp3(Math.round(bodyRows * (options.contextRatio ?? 0.4)), Math.min(minContextRows, maxContextRows), maxContextRows);
+  const controlRows = Math.max(3, bodyRows - contextRows - 1);
+  return { safeWidth, safeHeight, leftWidth, centerWidth, bodyRows, contextWidth, contextRows, controlRows };
+}
+function rowFg2(row, fallback) {
+  if (row.fg)
+    return row.fg;
+  if (row.kind === "group")
+    return WORKSPACE_PALETTE2.subtitle;
+  if (row.kind === "more")
+    return WORKSPACE_PALETTE2.dim;
+  return fallback;
+}
+function renderFullscreenWorkspace2(options) {
+  const { safeWidth, safeHeight, leftWidth, centerWidth, bodyRows, contextWidth, contextRows } = getFullscreenWorkspaceMetrics2(options);
+  const leftStart = 1;
+  const dividerX = leftWidth + 1;
+  const centerStart = dividerX + 1;
+  const centerEnd = safeWidth - 2;
+  const bodyTop = 3;
+  const separatorY = bodyTop + contextRows;
+  const lines = [];
+  const top = borderLine(safeWidth, GLYPHS.frame.topLeft, GLYPHS.frame.horizontal, GLYPHS.frame.topRight);
+  writeText2(top, 2, safeWidth - 4, ` ${options.title} `, { fg: WORKSPACE_PALETTE2.title, bold: true });
+  if (options.stateLabel) {
+    writeText2(top, Math.max(2, safeWidth - options.stateLabel.length - 4), options.stateLabel.length, options.stateLabel, {
+      fg: WORKSPACE_PALETTE2.subtitle
+    });
+  }
+  lines.push(top);
+  const header = contentLine(safeWidth, WORKSPACE_PALETTE2.footerBg);
+  drawVertical3(header, dividerX, WORKSPACE_PALETTE2.footerBg);
+  writeText2(header, leftStart + 1, leftWidth - 2, options.leftHeader, {
+    fg: WORKSPACE_PALETTE2.subtitle,
+    bold: true,
+    bg: WORKSPACE_PALETTE2.footerBg
+  });
+  writeText2(header, centerStart + 1, centerWidth - 2, options.mainHeader, {
+    fg: WORKSPACE_PALETTE2.subtitle,
+    bold: true,
+    bg: WORKSPACE_PALETTE2.footerBg
+  });
+  lines.push(header);
+  const headerSep = contentLine(safeWidth, "");
+  drawVertical3(headerSep, dividerX);
+  drawHorizontalRange2(headerSep, 1, safeWidth - 2);
+  lines.push(headerSep);
+  for (let row = 0;row < bodyRows; row += 1) {
+    const y2 = bodyTop + row;
+    const inContext = y2 < separatorY;
+    const inSeparator = y2 === separatorY;
+    const bg = inSeparator ? "" : inContext ? WORKSPACE_PALETTE2.contextBg : WORKSPACE_PALETTE2.controlsBg;
+    const line2 = contentLine(safeWidth, bg);
+    fillRange(line2, 1, dividerX - 1, WORKSPACE_PALETTE2.categoryBg);
+    drawVertical3(line2, dividerX, bg);
+    const leftRow = options.leftRows[row] ?? { text: "", kind: "empty" };
+    if (leftRow.selected)
+      fillRange(line2, leftStart, dividerX - 1, WORKSPACE_PALETTE2.selectedBg);
+    writeText2(line2, leftStart + 1, leftWidth - 3, leftRow.text, {
+      fg: leftRow.selected ? WORKSPACE_PALETTE2.text : rowFg2(leftRow, WORKSPACE_PALETTE2.muted),
+      bg: leftRow.selected ? WORKSPACE_PALETTE2.selectedBg : WORKSPACE_PALETTE2.categoryBg,
+      bold: leftRow.bold ?? (leftRow.selected || leftRow.kind === "group"),
+      dim: leftRow.dim
+    });
+    if (inSeparator) {
+      drawHorizontalRange2(line2, centerStart, centerEnd);
+    } else if (inContext) {
+      const contextRow = options.contextRows[row] ?? { text: "", kind: "empty" };
+      writeText2(line2, centerStart + 1, contextWidth, contextRow.text, {
+        fg: rowFg2(contextRow, WORKSPACE_PALETTE2.text),
+        bg,
+        bold: contextRow.bold,
+        dim: contextRow.dim ?? contextRow.text.length === 0
+      });
+    } else {
+      const controlRow = options.controlRows[row - contextRows - 1] ?? { text: "", kind: "empty" };
+      if (controlRow.selected)
+        fillRange(line2, centerStart, centerEnd, WORKSPACE_PALETTE2.selectedBg);
+      writeText2(line2, centerStart + 1, contextWidth, controlRow.text, {
+        fg: controlRow.selected ? WORKSPACE_PALETTE2.text : rowFg2(controlRow, WORKSPACE_PALETTE2.text),
+        bg: controlRow.selected ? WORKSPACE_PALETTE2.selectedBg : bg,
+        bold: controlRow.bold ?? controlRow.selected,
+        dim: controlRow.dim ?? controlRow.text.length === 0
+      });
+    }
+    lines.push(line2);
+  }
+  const footer = contentLine(safeWidth, WORKSPACE_PALETTE2.footerBg);
+  writeText2(footer, 2, safeWidth - 4, options.footer, { fg: WORKSPACE_PALETTE2.muted, bg: WORKSPACE_PALETTE2.footerBg });
+  lines.push(footer);
+  lines.push(borderLine(safeWidth, GLYPHS.frame.bottomLeft, GLYPHS.frame.horizontal, GLYPHS.frame.bottomRight));
+  while (lines.length < safeHeight)
+    lines.unshift(makeLine(safeWidth));
+  return lines.slice(-safeHeight);
+}
+
+// src/renderer/onboarding/onboarding-wizard.ts
+function modeLabel(mode) {
+  if (mode === "edit")
+    return "Edit existing";
+  if (mode === "reopen")
+    return "Reopen review";
+  return "New setup";
+}
+function changedScreensLabel(wizard) {
+  if (wizard.dirtyStepCount === 0)
+    return "no changes";
+  if (wizard.dirtyStepCount === 1)
+    return "1 changed screen";
+  return `${wizard.dirtyStepCount} changed screens`;
+}
+function stepGlyph(wizard, step, stepIndex) {
+  if (stepIndex === wizard.stepIndex)
+    return { glyph: GLYPHS.navigation.selected, fg: FULLSCREEN_PALETTE.info };
+  const total = wizard.getStepFieldCount(stepIndex);
+  const completed = wizard.getCompletedFieldCount(stepIndex);
+  if (wizard.isStepDirty(stepIndex))
+    return { glyph: GLYPHS.status.review, fg: FULLSCREEN_PALETTE.warn };
+  if (total > 0 && completed === total)
+    return { glyph: GLYPHS.status.success, fg: FULLSCREEN_PALETTE.good };
+  return { glyph: GLYPHS.status.pending, fg: FULLSCREEN_PALETTE.muted };
+}
+function fieldRowPrefix(wizard, field, selected) {
+  if (selected)
+    return `${GLYPHS.navigation.selected} `;
+  if (wizard.isFieldDirty(field.id))
+    return `${GLYPHS.status.skipped} `;
+  if (field.kind === "checklist")
+    return wizard.getFieldValue(field) ? `${GLYPHS.status.success} ` : "\u25A1 ";
+  if (field.kind === "acknowledgement")
+    return wizard.getFieldValue(field) ? `${GLYPHS.status.success} ` : "\u25A1 ";
+  if (field.kind === "action")
+    return `${GLYPHS.navigation.next} `;
+  if (field.kind === "radio")
+    return `${GLYPHS.status.active} `;
+  return "  ";
+}
+function fieldColor(wizard, field, selected) {
+  if (selected)
+    return FULLSCREEN_PALETTE.text;
+  if (field.kind === "status" || field.kind === "modelPicker")
+    return FULLSCREEN_PALETTE.info;
+  if (field.kind === "masked")
+    return FULLSCREEN_PALETTE.warn;
+  if (field.kind === "acknowledgement")
+    return wizard.getFieldValue(field) ? FULLSCREEN_PALETTE.good : FULLSCREEN_PALETTE.warn;
+  if (field.kind === "checklist")
+    return wizard.getFieldValue(field) ? FULLSCREEN_PALETTE.good : FULLSCREEN_PALETTE.muted;
+  if (wizard.getFieldValueLabel(field) === "Missing")
+    return FULLSCREEN_PALETTE.warn;
+  return FULLSCREEN_PALETTE.text;
+}
+function formatEditingValue(value, multiline) {
+  if (!multiline)
+    return value;
+  const lines = value.split(/\r?\n/);
+  if (lines.length <= 1)
+    return value;
+  const preview4 = lines[lines.length - 1] ?? "";
+  return `${preview4} (${lines.length} lines)`;
+}
+function fieldHint(wizard, field, selected) {
+  if (selected && wizard.isEditingTextField() && wizard.editingFieldId === field.id && (field.kind === "text" || field.kind === "masked")) {
+    const rawValue = wizard.editBuffer.length > 0 ? wizard.editBuffer : field.placeholder;
+    const editingValue = field.kind === "masked" && wizard.editBuffer.length > 0 ? "\u2022".repeat(Math.min(12, Math.max(4, wizard.editBuffer.length))) : formatEditingValue(rawValue, field.kind === "text" && field.multiline === true);
+    return `Editing: ${editingValue}${GLYPHS.surface.cursor}`;
+  }
+  if (selected && field.kind === "modelPicker")
+    return `${field.hint} Press Enter to open picker.`;
+  if (selected && field.kind === "text") {
+    return field.multiline === true ? `${field.hint} Press Enter to edit; Ctrl-J inserts a new line.` : `${field.hint} Press Enter to edit inline.`;
+  }
+  if (selected && field.kind === "masked")
+    return `${field.hint} Press Enter to edit inline.`;
+  return field.hint;
+}
+function selectedFieldText(wizard) {
+  if (wizard.isEditingTextField() && wizard.editingFieldId !== null) {
+    const editingField = wizard.getFieldById(wizard.editingFieldId);
+    if (editingField) {
+      return {
+        title: `Editing: ${editingField.label}`,
+        hint: fieldHint(wizard, editingField, true)
+      };
+    }
+  }
+  const field = wizard.getSelectedField();
+  if (!field)
+    return { title: "Selected: none", hint: "No selectable row is active on this screen." };
+  return {
+    title: `Selected: ${field.label} [${wizard.getFieldValueLabel(field)}]`,
+    hint: fieldHint(wizard, field, true)
+  };
+}
+function footerText4(wizard) {
+  if (wizard.isEditingTextField()) {
+    return wizard.isEditingMultilineTextField() ? "Controls: [Enter] save \xB7 [Ctrl-J] new line \xB7 [Esc] cancel \xB7 [Backspace] delete \xB7 [Del/Ctrl+U] clear" : "Controls: [Enter] save \xB7 [Esc] cancel \xB7 [Backspace] delete \xB7 [Del/Ctrl+U] clear";
+  }
+  return "Controls: [Enter] toggle/open \xB7 [Esc] close \xB7 [Tab/Shift+Tab] screen \xB7 [Up/Down] move \xB7 [Del/Ctrl+U] clear";
+}
+function controlsText(wizard) {
+  if (wizard.isEditingTextField()) {
+    return wizard.isEditingMultilineTextField() ? "Controls: Enter saves, Ctrl-J inserts a line, Esc cancels, Backspace deletes, Del clears." : "Controls: Enter saves, Esc cancels, Backspace deletes, Del clears.";
+  }
+  return "Controls: Enter selects, Del clears, Tab moves.";
+}
+function buildFieldRows(wizard, visibleFields, capacity) {
+  wizard.ensureSelectionVisible(visibleFields);
+  const fields = wizard.currentStep.fields;
+  const rows = [];
+  if (fields.length === 0 || capacity <= 0)
+    return rows;
+  const allRows = [];
+  fields.forEach((field, absoluteIndex) => {
+    const spacerRows = Math.max(0, field.spacerBeforeRows ?? 0);
+    for (let index = 0;index < spacerRows; index += 1)
+      allRows.push({ kind: "empty" });
+    allRows.push({ kind: "field", field, absoluteIndex });
+  });
+  const selectedFieldIndex = wizard.getSelectedFieldIndex();
+  const selectedRowIndex = Math.max(0, allRows.findIndex((row) => row.kind === "field" && row.absoluteIndex === selectedFieldIndex));
+  const scrollFieldIndex = wizard.scrollOffsets[wizard.stepIndex] ?? 0;
+  const scrollRowIndex = allRows.findIndex((row) => row.kind === "field" && row.absoluteIndex === scrollFieldIndex);
+  const maxStart = Math.max(0, allRows.length - capacity);
+  let start2 = Math.max(0, Math.min(scrollRowIndex >= 0 ? scrollRowIndex : 0, maxStart));
+  if (selectedRowIndex < start2)
+    start2 = selectedRowIndex;
+  if (selectedRowIndex >= start2 + capacity)
+    start2 = selectedRowIndex - capacity + 1;
+  start2 = Math.max(0, Math.min(start2, maxStart));
+  if (capacity > 1 && start2 > 0 && selectedRowIndex === start2)
+    start2 = Math.max(0, start2 - 1);
+  if (capacity > 1 && start2 + capacity < allRows.length && selectedRowIndex === start2 + capacity - 1) {
+    start2 = Math.min(maxStart, start2 + 1);
+  }
+  rows.push(...allRows.slice(start2, start2 + capacity));
+  const firstVisibleRow = rows[0];
+  if (start2 > 0 && rows.length > 0 && !(firstVisibleRow?.kind === "field" && firstVisibleRow.absoluteIndex === selectedFieldIndex)) {
+    rows[0] = { kind: "moreAbove", text: `${GLYPHS.navigation.moreAbove} ${start2} more above` };
+  }
+  const hiddenBelow = Math.max(0, allRows.length - (start2 + capacity));
+  const lastVisibleRow = rows[rows.length - 1];
+  if (hiddenBelow > 0 && rows.length > 0 && !(lastVisibleRow?.kind === "field" && lastVisibleRow.absoluteIndex === selectedFieldIndex)) {
+    rows[rows.length - 1] = { kind: "moreBelow", text: `${GLYPHS.navigation.moreBelow} ${hiddenBelow} more below` };
+  }
+  while (rows.length < capacity)
+    rows.push({ kind: "empty" });
+  return rows.slice(0, capacity);
+}
+function pushWrapped(rows, text, width, options = {}) {
+  if (text.length === 0) {
+    rows.push({ text: "", kind: "empty" });
+    return;
+  }
+  for (const line2 of wrapText(text, Math.max(1, width))) {
+    rows.push({ text: line2, ...options });
+  }
+}
+function buildStepRows(wizard, height) {
+  const rendered = wizard.steps.map((step, stepIndex) => {
+    const selected = stepIndex === wizard.stepIndex;
+    const state4 = stepGlyph(wizard, step, stepIndex);
+    const completion = `${wizard.getCompletedFieldCount(stepIndex)}/${wizard.getStepFieldCount(stepIndex)}`;
+    return {
+      text: `${state4.glyph} ${stepIndex + 1}. ${step.shortLabel} ${completion}`,
+      selected,
+      kind: "item",
+      fg: state4.fg,
+      bold: selected
+    };
+  });
+  const visible = Math.max(1, height);
+  const window3 = stableWindow(rendered.length, wizard.stepIndex, visible);
+  const rows = rendered.slice(window3.start, window3.end);
+  if (window3.start > 0 && rows.length > 0) {
+    rows[0] = { text: `${GLYPHS.navigation.moreAbove} ${window3.start} more step(s) above`, kind: "more", fg: FULLSCREEN_PALETTE.dim, dim: true };
+  }
+  if (window3.end < rendered.length && rows.length > 0) {
+    rows[rows.length - 1] = { text: `${GLYPHS.navigation.moreBelow} ${rendered.length - window3.end} more step(s) below`, kind: "more", fg: FULLSCREEN_PALETTE.dim, dim: true };
+  }
+  while (rows.length < height)
+    rows.push({ text: "", kind: "empty" });
+  return rows.slice(0, height);
+}
+function buildContextRows2(wizard, width) {
+  const step = wizard.currentStep;
+  const selected = selectedFieldText(wizard);
+  const rows = [
+    { text: step.title, fg: FULLSCREEN_PALETTE.title, bold: true }
+  ];
+  const pushSummaryRows = () => {
+    rows.push({ text: "Summary", fg: FULLSCREEN_PALETTE.subtitle, bold: true });
+    rows.push({ text: step.summaryTitle, fg: FULLSCREEN_PALETTE.info, bold: true });
+    for (const line2 of step.summaryLines.slice(0, 4)) {
+      pushWrapped(rows, line2, width, { fg: FULLSCREEN_PALETTE.text });
+    }
+    rows.push({
+      text: `Fields ${wizard.getCompletedFieldCount(wizard.stepIndex)}/${wizard.getStepFieldCount(wizard.stepIndex)} complete \xB7 ${changedScreensLabel(wizard)}`,
+      fg: wizard.dirtyStepCount > 0 ? FULLSCREEN_PALETTE.warn : FULLSCREEN_PALETTE.muted
+    });
+  };
+  const pushSelectedRows = () => {
+    rows.push({ text: selected.title, fg: FULLSCREEN_PALETTE.info, bold: true });
+    pushWrapped(rows, selected.hint, width, { fg: FULLSCREEN_PALETTE.text });
+    pushWrapped(rows, controlsText(wizard), width, { fg: FULLSCREEN_PALETTE.info });
+  };
+  pushWrapped(rows, step.description, width, { fg: FULLSCREEN_PALETTE.text });
+  rows.push({ text: "", kind: "empty" });
+  if (wizard.isEditingTextField()) {
+    pushSelectedRows();
+    rows.push({ text: "", kind: "empty" });
+    pushSummaryRows();
+  } else {
+    pushSummaryRows();
+    rows.push({ text: "", kind: "empty" });
+    pushSelectedRows();
+  }
+  if (wizard.hydrationPending || wizard.hydrationError !== null || wizard.applyFeedback !== null) {
+    rows.push({ text: "", kind: "empty" });
+  }
+  if (wizard.hydrationPending) {
+    rows.push({ text: "Loading current settings...", fg: FULLSCREEN_PALETTE.info, bold: true });
+  }
+  if (wizard.hydrationError !== null) {
+    pushWrapped(rows, `Current settings could not load: ${wizard.hydrationError}`, width, { fg: FULLSCREEN_PALETTE.bad, bold: true });
+  }
+  if (wizard.applyFeedback !== null) {
+    const feedbackColor = wizard.applyFeedback.severity === "error" ? FULLSCREEN_PALETTE.bad : wizard.applyFeedback.severity === "warning" ? FULLSCREEN_PALETTE.warn : FULLSCREEN_PALETTE.info;
+    rows.push({ text: wizard.applyFeedback.title, fg: feedbackColor, bold: true });
+    pushWrapped(rows, wizard.applyFeedback.summary, width, { fg: FULLSCREEN_PALETTE.text });
+    for (const message of wizard.applyFeedback.messages) {
+      pushWrapped(rows, message, width, { fg: FULLSCREEN_PALETTE.muted });
+    }
+  }
+  return rows;
+}
+function formatFieldRowText(wizard, field, selected, width) {
+  const badge = `[${wizard.getFieldValueLabel(field)}]`;
+  const badgeWidth = getDisplayWidth(badge);
+  const labelWidth = Math.max(1, width - badgeWidth - 2);
+  const label = truncateDisplay(`${fieldRowPrefix(wizard, field, selected)}${field.label}`, labelWidth);
+  return `${label}${" ".repeat(Math.max(1, width - getDisplayWidth(label) - badgeWidth))}${badge}`;
+}
+function buildControlRows2(wizard, width, height) {
+  const visibleFields = Math.max(1, height);
+  const fieldRows = buildFieldRows(wizard, visibleFields, height);
+  const rows = fieldRows.map((row) => {
+    if (row.kind === "empty")
+      return { text: "", kind: "empty" };
+    if (row.kind === "moreAbove" || row.kind === "moreBelow") {
+      return { text: row.text, kind: "more", fg: FULLSCREEN_PALETTE.dim, dim: true };
+    }
+    const selected = row.absoluteIndex === wizard.getSelectedFieldIndex();
+    return {
+      text: formatFieldRowText(wizard, row.field, selected, width),
+      selected,
+      kind: "item",
+      fg: fieldColor(wizard, row.field, selected),
+      bold: selected || row.field.kind === "action"
+    };
+  });
+  while (rows.length < height)
+    rows.push({ text: "", kind: "empty" });
+  return rows.slice(0, height);
+}
+function renderOnboardingWizard(wizard, width, viewportHeight) {
+  const layoutOptions = {
+    width,
+    height: viewportHeight,
+    leftWidth: width < 90 ? undefined : 30,
+    contextRatio: 0.42,
+    minContextRows: 8
+  };
+  const metrics = getFullscreenWorkspaceMetrics2(layoutOptions);
+  return renderFullscreenWorkspace2({
+    width,
+    height: viewportHeight,
+    title: "GoodVibes Agent / Onboarding Wizard",
+    stateLabel: `${modeLabel(wizard.mode)} \xB7 ${wizard.stepIndex + 1}/${wizard.steps.length} \xB7 ${changedScreensLabel(wizard)}`,
+    leftHeader: "Steps",
+    mainHeader: wizard.currentStep.title,
+    leftRows: buildStepRows(wizard, metrics.bodyRows),
+    contextRows: buildContextRows2(wizard, metrics.contextWidth),
+    controlRows: buildControlRows2(wizard, metrics.contextWidth, metrics.controlRows),
+    footer: footerText4(wizard),
+    leftWidth: layoutOptions.leftWidth,
+    contextRatio: layoutOptions.contextRatio,
+    minContextRows: layoutOptions.minContextRows
+  });
+}
+
 // src/shell/onboarding-fullscreen.ts
 function normalizeFullscreenViewport(lines, width, height) {
   const viewport = lines.slice(0, height).map((line2) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pellux/goodvibes-agent",
-  "version": "1.0.38",
+  "version": "1.0.40",
   "private": false,
   "description": "GoodVibes personal operator assistant TUI with a proactive Agent product brain, isolated Agent Knowledge, local profiles, routines, skills, personas, and explicit build delegation.",
   "type": "module",

package/src/renderer/conversation-overlays.ts

@@ -19,7 +19,6 @@ import { renderProfilePickerModal } from './profile-picker-modal.ts';
 import { renderBookmarkModal } from './bookmark-modal.ts';
 import { renderHelpOverlay, renderShortcutsOverlay } from './help-overlay.ts';
 import { renderAutocompleteOverlay } from './autocomplete-overlay.ts';
-import { renderOnboardingWizard } from './onboarding/onboarding-wizard.ts';
 import { overlayViewportBottom, replaceViewportWithOverlay } from './conversation-layout.ts';
 
 export interface ConversationOverlayContext {
@@ -41,9 +40,7 @@ export function applyConversationOverlays(
   const bottomDockInset = 1 + (input.searchManager.active || input.historySearch.active ? 1 : 0);
 
   if (input.onboardingWizard.active) {
-    const lines = renderOnboardingWizard(input.onboardingWizard, conversationWidth, viewportHeight);
-    next = replaceViewportWithOverlay(lines, conversationWidth, viewportHeight);
-    if (!input.modelPicker.active) return next;
+    return next;
   }
 
   if (input.filePicker.active) {

package/src/renderer/onboarding/onboarding-wizard.ts

@@ -6,7 +6,7 @@ import {
   stableWindow,
   WORKSPACE_PALETTE as PALETTE,
   type WorkspaceRow,
-} from '../fullscreen-workspace.ts';
+} from './onboarding-workspace.ts';
 import { GLYPHS } from '../ui-primitives.ts';
 import {
   type OnboardingWizardController,

package/src/renderer/onboarding/onboarding-workspace.ts

@@ -0,0 +1,199 @@
+import type { Line } from '../../types/grid.ts';
+import { GLYPHS } from '../ui-primitives.ts';
+import {
+  borderLine,
+  clamp,
+  contentLine,
+  drawHorizontalRule,
+  drawVerticalRule,
+  fillRange,
+  FULLSCREEN_PALETTE,
+  makeLine,
+  writeText,
+} from '../fullscreen-primitives.ts';
+
+export {
+  borderLine,
+  clamp,
+  contentLine,
+  fillRange,
+  makeLine,
+  padDisplay,
+  stableWindow,
+  writeText,
+} from '../fullscreen-primitives.ts';
+export { FULLSCREEN_PALETTE as WORKSPACE_PALETTE } from '../fullscreen-primitives.ts';
+
+const WORKSPACE_PALETTE = FULLSCREEN_PALETTE;
+
+export interface WorkspaceRow {
+  readonly text: string;
+  readonly selected?: boolean;
+  readonly bold?: boolean;
+  readonly dim?: boolean;
+  readonly fg?: string;
+  readonly bg?: string;
+  readonly kind?: 'group' | 'item' | 'more' | 'empty';
+}
+
+export interface FullscreenWorkspaceRenderOptions {
+  readonly width: number;
+  readonly height: number;
+  readonly title: string;
+  readonly stateLabel?: string;
+  readonly leftHeader: string;
+  readonly mainHeader: string;
+  readonly leftRows: readonly WorkspaceRow[];
+  readonly contextRows: readonly WorkspaceRow[];
+  readonly controlRows: readonly WorkspaceRow[];
+  readonly footer: string;
+  readonly leftWidth?: number;
+  readonly contextRatio?: number;
+  readonly minContextRows?: number;
+}
+
+export interface FullscreenWorkspaceMetrics {
+  readonly safeWidth: number;
+  readonly safeHeight: number;
+  readonly leftWidth: number;
+  readonly centerWidth: number;
+  readonly bodyRows: number;
+  readonly contextWidth: number;
+  readonly contextRows: number;
+  readonly controlRows: number;
+}
+
+export function drawVertical(line: Line, x: number, bg = ''): void {
+  if (x <= 0 || x >= line.length - 1) return;
+  drawVerticalRule(line, x, WORKSPACE_PALETTE.border, bg);
+}
+
+export function drawHorizontalRange(line: Line, startX: number, endX: number, bg = ''): void {
+  drawHorizontalRule(line, Math.max(1, startX), Math.min(line.length - 2, endX), WORKSPACE_PALETTE.border, bg);
+}
+
+function leftWidthFor(width: number, explicit?: number): number {
+  if (explicit !== undefined) return clamp(explicit, 14, Math.max(14, width - 24));
+  return width < 80
+    ? clamp(Math.round(width * 0.32), 14, Math.max(14, width - 24))
+    : clamp(Math.round(width * 0.22), 24, 34);
+}
+
+export function getFullscreenWorkspaceMetrics(options: Pick<
+  FullscreenWorkspaceRenderOptions,
+  'width' | 'height' | 'leftWidth' | 'contextRatio' | 'minContextRows'
+>): FullscreenWorkspaceMetrics {
+  const safeWidth = Math.max(1, options.width);
+  const safeHeight = Math.max(12, options.height);
+  const leftWidth = leftWidthFor(safeWidth, options.leftWidth);
+  const centerWidth = Math.max(20, safeWidth - leftWidth - 3);
+  const bodyTop = 3;
+  const footerY = safeHeight - 2;
+  const bodyRows = Math.max(4, footerY - bodyTop);
+  const contextWidth = Math.max(10, centerWidth - 2);
+  const maxContextRows = Math.max(3, bodyRows - 4);
+  const minContextRows = clamp(options.minContextRows ?? 10, 3, maxContextRows);
+  const contextRows = clamp(
+    Math.round(bodyRows * (options.contextRatio ?? 0.4)),
+    Math.min(minContextRows, maxContextRows),
+    maxContextRows,
+  );
+  const controlRows = Math.max(3, bodyRows - contextRows - 1);
+  return { safeWidth, safeHeight, leftWidth, centerWidth, bodyRows, contextWidth, contextRows, controlRows };
+}
+
+function rowFg(row: WorkspaceRow, fallback: string): string {
+  if (row.fg) return row.fg;
+  if (row.kind === 'group') return WORKSPACE_PALETTE.subtitle;
+  if (row.kind === 'more') return WORKSPACE_PALETTE.dim;
+  return fallback;
+}
+
+export function renderFullscreenWorkspace(options: FullscreenWorkspaceRenderOptions): Line[] {
+  const { safeWidth, safeHeight, leftWidth, centerWidth, bodyRows, contextWidth, contextRows } = getFullscreenWorkspaceMetrics(options);
+  const leftStart = 1;
+  const dividerX = leftWidth + 1;
+  const centerStart = dividerX + 1;
+  const centerEnd = safeWidth - 2;
+  const bodyTop = 3;
+  const separatorY = bodyTop + contextRows;
+  const lines: Line[] = [];
+
+  const top = borderLine(safeWidth, GLYPHS.frame.topLeft, GLYPHS.frame.horizontal, GLYPHS.frame.topRight);
+  writeText(top, 2, safeWidth - 4, ` ${options.title} `, { fg: WORKSPACE_PALETTE.title, bold: true });
+  if (options.stateLabel) {
+    writeText(top, Math.max(2, safeWidth - options.stateLabel.length - 4), options.stateLabel.length, options.stateLabel, {
+      fg: WORKSPACE_PALETTE.subtitle,
+    });
+  }
+  lines.push(top);
+
+  const header = contentLine(safeWidth, WORKSPACE_PALETTE.footerBg);
+  drawVertical(header, dividerX, WORKSPACE_PALETTE.footerBg);
+  writeText(header, leftStart + 1, leftWidth - 2, options.leftHeader, {
+    fg: WORKSPACE_PALETTE.subtitle,
+    bold: true,
+    bg: WORKSPACE_PALETTE.footerBg,
+  });
+  writeText(header, centerStart + 1, centerWidth - 2, options.mainHeader, {
+    fg: WORKSPACE_PALETTE.subtitle,
+    bold: true,
+    bg: WORKSPACE_PALETTE.footerBg,
+  });
+  lines.push(header);
+
+  const headerSep = contentLine(safeWidth, '');
+  drawVertical(headerSep, dividerX);
+  drawHorizontalRange(headerSep, 1, safeWidth - 2);
+  lines.push(headerSep);
+
+  for (let row = 0; row < bodyRows; row += 1) {
+    const y = bodyTop + row;
+    const inContext = y < separatorY;
+    const inSeparator = y === separatorY;
+    const bg = inSeparator ? '' : inContext ? WORKSPACE_PALETTE.contextBg : WORKSPACE_PALETTE.controlsBg;
+    const line = contentLine(safeWidth, bg);
+    fillRange(line, 1, dividerX - 1, WORKSPACE_PALETTE.categoryBg);
+    drawVertical(line, dividerX, bg);
+
+    const leftRow = options.leftRows[row] ?? { text: '', kind: 'empty' as const };
+    if (leftRow.selected) fillRange(line, leftStart, dividerX - 1, WORKSPACE_PALETTE.selectedBg);
+    writeText(line, leftStart + 1, leftWidth - 3, leftRow.text, {
+      fg: leftRow.selected ? WORKSPACE_PALETTE.text : rowFg(leftRow, WORKSPACE_PALETTE.muted),
+      bg: leftRow.selected ? WORKSPACE_PALETTE.selectedBg : WORKSPACE_PALETTE.categoryBg,
+      bold: leftRow.bold ?? (leftRow.selected || leftRow.kind === 'group'),
+      dim: leftRow.dim,
+    });
+
+    if (inSeparator) {
+      drawHorizontalRange(line, centerStart, centerEnd);
+    } else if (inContext) {
+      const contextRow = options.contextRows[row] ?? { text: '', kind: 'empty' as const };
+      writeText(line, centerStart + 1, contextWidth, contextRow.text, {
+        fg: rowFg(contextRow, WORKSPACE_PALETTE.text),
+        bg,
+        bold: contextRow.bold,
+        dim: contextRow.dim ?? contextRow.text.length === 0,
+      });
+    } else {
+      const controlRow = options.controlRows[row - contextRows - 1] ?? { text: '', kind: 'empty' as const };
+      if (controlRow.selected) fillRange(line, centerStart, centerEnd, WORKSPACE_PALETTE.selectedBg);
+      writeText(line, centerStart + 1, contextWidth, controlRow.text, {
+        fg: controlRow.selected ? WORKSPACE_PALETTE.text : rowFg(controlRow, WORKSPACE_PALETTE.text),
+        bg: controlRow.selected ? WORKSPACE_PALETTE.selectedBg : bg,
+        bold: controlRow.bold ?? controlRow.selected,
+        dim: controlRow.dim ?? controlRow.text.length === 0,
+      });
+    }
+
+    lines.push(line);
+  }
+
+  const footer = contentLine(safeWidth, WORKSPACE_PALETTE.footerBg);
+  writeText(footer, 2, safeWidth - 4, options.footer, { fg: WORKSPACE_PALETTE.muted, bg: WORKSPACE_PALETTE.footerBg });
+  lines.push(footer);
+  lines.push(borderLine(safeWidth, GLYPHS.frame.bottomLeft, GLYPHS.frame.horizontal, GLYPHS.frame.bottomRight));
+
+  while (lines.length < safeHeight) lines.unshift(makeLine(safeWidth));
+  return lines.slice(-safeHeight);
+}

package/src/version.ts

@@ -6,7 +6,7 @@ import { join } from 'node:path';
 // The prebuild script updates the fallback value before compilation.
 // Uses import.meta.dir (Bun) to locate package.json relative to this file,
 // which is correct regardless of the process working directory.
-let _version = '1.0.38';
+let _version = '1.0.40';
 try {
   const pkg = JSON.parse(readFileSync(join(import.meta.dir, '..', 'package.json'), 'utf-8')) as {
     readonly version?: unknown;