diff --git a/packages/cli/src/ui/components/SettingsDialog.tsx b/packages/cli/src/ui/components/SettingsDialog.tsx
index f41d9cd2ed..e0a85d97ba 100644
--- a/packages/cli/src/ui/components/SettingsDialog.tsx
+++ b/packages/cli/src/ui/components/SettingsDialog.tsx
@@ -628,9 +628,9 @@ export function SettingsDialog({
const DIALOG_PADDING = 2; // Top and bottom borders
const SETTINGS_TITLE_HEIGHT = 1;
const SEARCH_BOX_HEIGHT = 3;
- const SCROLL_ARROWS_HEIGHT = 2;
- const SPACING_HEIGHT = 2;
- const SCOPE_SELECTION_HEIGHT = 4;
+ const SCROLL_ARROWS_HEIGHT = 3;
+ const SPACING_HEIGHT = 5;
+ const SCOPE_SELECTION_HEIGHT = 7;
const BOTTOM_HELP_TEXT_HEIGHT = 1;
const RESTART_PROMPT_HEIGHT = showRestartPrompt ? 1 : 0;
const ITEM_HEIGHT = 3; // Label + description + spacing
diff --git a/packages/cli/src/ui/components/__snapshots__/SettingsDialog.test.tsx.snap b/packages/cli/src/ui/components/__snapshots__/SettingsDialog.test.tsx.snap
index da745e2843..24b0938382 100644
--- a/packages/cli/src/ui/components/__snapshots__/SettingsDialog.test.tsx.snap
+++ b/packages/cli/src/ui/components/__snapshots__/SettingsDialog.test.tsx.snap
@@ -10,6 +10,7 @@ exports[`SettingsDialog > Initial Rendering > should render settings list with v
│ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │
│ │
│ ▲ │
+│ │
│ ● Preview Features (e.g., models) false │
│ Enable preview features (e.g., preview models). │
│ │
@@ -38,9 +39,12 @@ exports[`SettingsDialog > Initial Rendering > should render settings list with v
│ │
│ Apply To │
│ ● User Settings │
+│ │
│ Workspace Settings │
+│ │
│ System Settings │
│ │
+│ │
│ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │
│ │
╰──────────────────────────────────────────────────────────────────────────────────────────────────╯"
@@ -56,6 +60,7 @@ exports[`SettingsDialog > Snapshot Tests > should render 'accessibility settings
│ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │
│ │
│ ▲ │
+│ │
│ ● Preview Features (e.g., models) false │
│ Enable preview features (e.g., preview models). │
│ │
@@ -84,9 +89,12 @@ exports[`SettingsDialog > Snapshot Tests > should render 'accessibility settings
│ │
│ Apply To │
│ ● User Settings │
+│ │
│ Workspace Settings │
+│ │
│ System Settings │
│ │
+│ │
│ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │
│ │
╰──────────────────────────────────────────────────────────────────────────────────────────────────╯"
@@ -102,6 +110,7 @@ exports[`SettingsDialog > Snapshot Tests > should render 'all boolean settings d
│ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │
│ │
│ ▲ │
+│ │
│ ● Preview Features (e.g., models) false │
│ Enable preview features (e.g., preview models). │
│ │
@@ -130,9 +139,12 @@ exports[`SettingsDialog > Snapshot Tests > should render 'all boolean settings d
│ │
│ Apply To │
│ ● User Settings │
+│ │
│ Workspace Settings │
+│ │
│ System Settings │
│ │
+│ │
│ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │
│ │
╰──────────────────────────────────────────────────────────────────────────────────────────────────╯"
@@ -148,6 +160,7 @@ exports[`SettingsDialog > Snapshot Tests > should render 'default state' correct
│ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │
│ │
│ ▲ │
+│ │
│ ● Preview Features (e.g., models) false │
│ Enable preview features (e.g., preview models). │
│ │
@@ -176,9 +189,12 @@ exports[`SettingsDialog > Snapshot Tests > should render 'default state' correct
│ │
│ Apply To │
│ ● User Settings │
+│ │
│ Workspace Settings │
+│ │
│ System Settings │
│ │
+│ │
│ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │
│ │
╰──────────────────────────────────────────────────────────────────────────────────────────────────╯"
@@ -194,6 +210,7 @@ exports[`SettingsDialog > Snapshot Tests > should render 'file filtering setting
│ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │
│ │
│ ▲ │
+│ │
│ ● Preview Features (e.g., models) false │
│ Enable preview features (e.g., preview models). │
│ │
@@ -222,9 +239,12 @@ exports[`SettingsDialog > Snapshot Tests > should render 'file filtering setting
│ │
│ Apply To │
│ ● User Settings │
+│ │
│ Workspace Settings │
+│ │
│ System Settings │
│ │
+│ │
│ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │
│ │
╰──────────────────────────────────────────────────────────────────────────────────────────────────╯"
@@ -240,6 +260,7 @@ exports[`SettingsDialog > Snapshot Tests > should render 'focused on scope selec
│ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │
│ │
│ ▲ │
+│ │
│ Preview Features (e.g., models) false │
│ Enable preview features (e.g., preview models). │
│ │
@@ -268,9 +289,12 @@ exports[`SettingsDialog > Snapshot Tests > should render 'focused on scope selec
│ │
│ > Apply To │
│ ● 1. User Settings │
+│ │
│ 2. Workspace Settings │
+│ │
│ 3. System Settings │
│ │
+│ │
│ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │
│ │
╰──────────────────────────────────────────────────────────────────────────────────────────────────╯"
@@ -286,6 +310,7 @@ exports[`SettingsDialog > Snapshot Tests > should render 'mixed boolean and numb
│ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │
│ │
│ ▲ │
+│ │
│ ● Preview Features (e.g., models) false │
│ Enable preview features (e.g., preview models). │
│ │
@@ -314,9 +339,12 @@ exports[`SettingsDialog > Snapshot Tests > should render 'mixed boolean and numb
│ │
│ Apply To │
│ ● User Settings │
+│ │
│ Workspace Settings │
+│ │
│ System Settings │
│ │
+│ │
│ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │
│ │
╰──────────────────────────────────────────────────────────────────────────────────────────────────╯"
@@ -332,6 +360,7 @@ exports[`SettingsDialog > Snapshot Tests > should render 'tools and security set
│ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │
│ │
│ ▲ │
+│ │
│ ● Preview Features (e.g., models) false │
│ Enable preview features (e.g., preview models). │
│ │
@@ -360,9 +389,12 @@ exports[`SettingsDialog > Snapshot Tests > should render 'tools and security set
│ │
│ Apply To │
│ ● User Settings │
+│ │
│ Workspace Settings │
+│ │
│ System Settings │
│ │
+│ │
│ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │
│ │
╰──────────────────────────────────────────────────────────────────────────────────────────────────╯"
@@ -378,6 +410,7 @@ exports[`SettingsDialog > Snapshot Tests > should render 'various boolean settin
│ ╰──────────────────────────────────────────────────────────────────────────────────────────────╯ │
│ │
│ ▲ │
+│ │
│ ● Preview Features (e.g., models) false │
│ Enable preview features (e.g., preview models). │
│ │
@@ -406,9 +439,12 @@ exports[`SettingsDialog > Snapshot Tests > should render 'various boolean settin
│ │
│ Apply To │
│ ● User Settings │
+│ │
│ Workspace Settings │
+│ │
│ System Settings │
│ │
+│ │
│ (Use Enter to select, Ctrl+L to reset, Tab to change focus, Esc to close) │
│ │
╰──────────────────────────────────────────────────────────────────────────────────────────────────╯"
diff --git a/packages/cli/src/ui/components/shared/BaseSelectionList.tsx b/packages/cli/src/ui/components/shared/BaseSelectionList.tsx
index dbe6d7b075..9a236cdbac 100644
--- a/packages/cli/src/ui/components/shared/BaseSelectionList.tsx
+++ b/packages/cli/src/ui/components/shared/BaseSelectionList.tsx
@@ -4,8 +4,7 @@
* SPDX-License-Identifier: Apache-2.0
*/
-import type React from 'react';
-import { useEffect, useState } from 'react';
+import React, { useEffect, useState } from 'react';
import { Text, Box } from 'ink';
import { theme } from '../../semantic-colors.js';
import { useSelectionList } from '../../hooks/useSelectionList.js';
@@ -134,38 +133,41 @@ export function BaseSelectionList<
)}.`;
return (
-
- {/* Radio button indicator */}
-
-
- {isSelected ? '●' : ' '}
-
-
-
- {/* Item number */}
- {showNumbers && !item.hideNumber && (
-
- {itemNumberText}
+
+
+ {/* Radio button indicator */}
+
+
+ {isSelected ? '●' : ' '}
+
- )}
- {/* Custom content via render prop */}
-
- {renderItem(item, {
- isSelected,
- titleColor,
- numberColor,
- })}
+ {/* Item number */}
+ {showNumbers && !item.hideNumber && (
+
+ {itemNumberText}
+
+ )}
+
+ {/* Custom content via render prop */}
+
+ {renderItem(item, {
+ isSelected,
+ titleColor,
+ numberColor,
+ })}
+
-
+
+
);
})}
diff --git a/packages/cli/src/ui/components/shared/BaseSettingsDialog.tsx b/packages/cli/src/ui/components/shared/BaseSettingsDialog.tsx
index 4492c56df2..066effca17 100644
--- a/packages/cli/src/ui/components/shared/BaseSettingsDialog.tsx
+++ b/packages/cli/src/ui/components/shared/BaseSettingsDialog.tsx
@@ -431,7 +431,7 @@ export function BaseSettingsDialog({
)}
-
+
{/* Items list */}
{visibleItems.length === 0 ? (
@@ -445,6 +445,7 @@ export function BaseSettingsDialog({
▲
)}
+ {showScrollUp && }
{visibleItems.map((item, idx) => {
const globalIndex = idx + scrollOffset;
const isActive =
@@ -533,7 +534,7 @@ export function BaseSettingsDialog({
-
+
);
})}
@@ -545,7 +546,7 @@ export function BaseSettingsDialog({
>
)}
-
+
{/* Scope Selection */}
{showScopeSelector && (
@@ -566,7 +567,7 @@ export function BaseSettingsDialog({
)}
-
+
{/* Help text */}