refactor: rename verboseMode to compactMode for better UX clarity (#3075)

The "Compact Mode" label is more intuitive than "Verbose Mode" for users,
as it directly describes the default compact view experience. This change
inverts the boolean semantics (compactMode=false means show full output)
and exposes the setting in the /settings dialog (showInDialog: true).

- Rename ui.verboseMode → ui.compactMode with inverted default (false)
- Rename VerboseModeContext → CompactModeContext (file and exports)
- Rename TOGGLE_VERBOSE_MODE → TOGGLE_COMPACT_MODE in key bindings
- Update all consumer components with inverted logic
- Update i18n keys across 6 locales (verbose → compact)
- Update VS Code settings schema
- Add ui.compactMode documentation to settings.md
- Fix Ctrl+O description in keyboard-shortcuts.md

packages/cli/src/ui/components/messages/ToolGroupMessage.tsx

@@ -15,7 +15,7 @@ import { CompactToolGroupDisplay } from './CompactToolGroupDisplay.js';
 import { theme } from '../../semantic-colors.js';
 import { SHELL_COMMAND_NAME, SHELL_NAME } from '../../constants.js';
 import { useConfig } from '../../contexts/ConfigContext.js';
-import { useVerboseMode } from '../../contexts/VerboseModeContext.js';
+import { useCompactMode } from '../../contexts/CompactModeContext.js';
 import type { AgentResultDisplay } from '@qwen-code/qwen-code-core';
 
 function isAgentWithPendingConfirmation(
@@ -53,7 +53,7 @@ export const ToolGroupMessage: React.FC<ToolGroupMessageProps> = ({
   isUserInitiated,
 }) => {
   const config = useConfig();
-  const { verboseMode } = useVerboseMode();
+  const { compactMode } = useCompactMode();
 
   const hasConfirmingTool = toolCalls.some(
     (t) => t.status === ToolCallStatus.Confirming,
@@ -103,7 +103,7 @@ export const ToolGroupMessage: React.FC<ToolGroupMessageProps> = ({
   // Force-expand when: user must interact (Confirming), tool errored,
   // shell is focused, or user-initiated
   const showCompact =
-    !verboseMode &&
+    compactMode &&
     !hasConfirmingTool &&
     !hasErrorTool &&
     !isEmbeddedShellFocused &&

packages/cli/src/ui/components/messages/ToolMessage.test.tsx

@@ -12,7 +12,7 @@ import { StreamingState, ToolCallStatus } from '../../types.js';
 import { Text } from 'ink';
 import { StreamingContext } from '../../contexts/StreamingContext.js';
 import { SettingsContext } from '../../contexts/SettingsContext.js';
-import { VerboseModeProvider } from '../../contexts/VerboseModeContext.js';
+import { CompactModeProvider } from '../../contexts/CompactModeContext.js';
 import type {
   AnsiOutput,
   AnsiOutputDisplay,
@@ -102,21 +102,21 @@ const mockSettings: LoadedSettings = {
   },
 } as LoadedSettings;
 
-// Helper to render with context (verbose=true by default to show tool output)
+// Helper to render with context (compactMode=false by default to show tool output)
 const renderWithContext = (
   ui: React.ReactElement,
   streamingState: StreamingState,
-  verboseMode = true,
+  compactMode = false,
 ) => {
   const contextValue: StreamingState = streamingState;
   return render(
-    <VerboseModeProvider value={{ verboseMode, frozenSnapshot: null }}>
+    <CompactModeProvider value={{ compactMode, frozenSnapshot: null }}>
       <SettingsContext.Provider value={mockSettings}>
         <StreamingContext.Provider value={contextValue}>
           {ui}
         </StreamingContext.Provider>
       </SettingsContext.Provider>
-    </VerboseModeProvider>,
+    </CompactModeProvider>,
   );
 };
 
@@ -147,11 +147,11 @@ describe('<ToolMessage />', () => {
     expect(output).toContain('MockMarkdown:Test result');
   });
 
-  it('hides result output in compact mode (verboseMode=false)', () => {
+  it('hides result output in compact mode (compactMode=true)', () => {
     const { lastFrame } = renderWithContext(
       <ToolMessage {...baseProps} />,
       StreamingState.Idle,
-      false, // compact mode
+      true, // compact mode
     );
     const output = lastFrame();
     expect(output).toContain('✓'); // status indicator still visible

packages/cli/src/ui/components/messages/ToolMessage.tsx

@@ -28,7 +28,7 @@ import { SHELL_COMMAND_NAME, SHELL_NAME } from '../../constants.js';
 import { theme } from '../../semantic-colors.js';
 import { useSettings } from '../../contexts/SettingsContext.js';
 import type { LoadedSettings } from '../../../config/settings.js';
-import { useVerboseMode } from '../../contexts/VerboseModeContext.js';
+import { useCompactMode } from '../../contexts/CompactModeContext.js';
 
 import {
   ToolStatusIndicator,
@@ -343,9 +343,9 @@ export const ToolMessage: React.FC<ToolMessageProps> = ({
 
   // Use the custom hook to determine the display type
   const displayRenderer = useResultDisplayRenderer(resultDisplay);
-  const { verboseMode } = useVerboseMode();
+  const { compactMode } = useCompactMode();
   const effectiveDisplayRenderer =
-    verboseMode || forceShowResult
+    !compactMode || forceShowResult
       ? displayRenderer
       : { type: 'none' as const };