Polish question carousel

[daviddossett]

Polishes the question carousel from a flat list of questions into a tabbed multi-step flow with a final review step.

CleanShot.2026-03-02.at.11.45.23.mp4

What changed

• Tab bar navigation — Each question gets its own tab. Users step through one question at a time, then land on a Review tab that summarizes all answers before submitting. Single-question carousels skip the tab bar entirely.
• Review tab — Shows a read-only summary of every answer (or "skipped"). Auto-focuses when the user advances past the last question.
• Submit hint — Footer displays ⌘⏎ to submit (macOS) / Ctrl+Enter to submit so the shortcut is discoverable.
• Tab completion indicators — Answered tabs show a checkmark icon; the indicator is cleared on dispose.
• Readable tab titles — Model-generated headers (FocusArea, snake_case_header) are normalized to sentence case (Focus area, Snake case header) for display. Original headers are preserved for answer correlation.
• Freeform priority — When a freeform input has text, it takes priority over a radio selection on single-select questions.
• Progress message — Changed from "Analyzing your answers..." to "Reviewing your answers".

Execute toolbar

• Cancel button now hides when the user types text during a question carousel or tool confirmation, matching the behavior during regular in-progress requests.
• Steer/Queue submenu now appears during question carousel and tool confirmation states when the user has typed text. Previously it only appeared during requestInProgress, which is false during these paused states.
• Cleaned up unused requestInProgressWithoutInput and pendingToolCall variables.

Accessibility

• Tab bar uses role="tablist" / role="tab" with aria-selected, aria-controls, and roving tabIndex.
• Question container uses role="tabpanel".
• Arrow-key navigation between tabs.

Theme / CSS

• 2026-dark theme: border-radius tokens applied to carousel container and input parts.
• list.activeSelectionBackground adjusted for 2026-dark.
• Minor spacing tweaks: reduced question-list padding, wider footer gap.

Tests

• Updated carousel tests for tab-bar UI (selectors, multi-question flow).
• Added unit test for formatHeaderForDisplay covering camelCase, already-spaced, and snake_case inputs.

[Copilot]

Pull request overview

This PR refines the Chat Question Carousel UI and interactions by adding ArrowUp/ArrowDown keyboard navigation between the option list and the freeform textarea, and by updating styling (badge opacity, border radius tokens, padding) to better match the chat list visual language, including theme tweaks for the 2026 theme.

Changes:

• Add ArrowUp/ArrowDown keyboard navigation between the options list and the freeform textarea (single- and multi-select).
• Update carousel styling (background token, border radius tokens, list spacing, badge styling, textarea chrome removal).
• Adjust 2026 theme styling (border radius override and list.activeSelectionBackground).

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 2 comments.

File	Description
src/vs/workbench/contrib/chat/browser/widget/chatContentParts/media/chatQuestionCarousel.css	Visual polish for carousel container/header/list/freeform input; adjusts spacing, tokens, and badge styling.
src/vs/workbench/contrib/chat/browser/widget/chatContentParts/chatQuestionCarouselPart.ts	Adds ArrowUp/ArrowDown navigation between list items and freeform textarea for single- and multi-select.
extensions/theme-2026/themes/styles.css	Applies 2026 theme border-radius styling to the question carousel container.
extensions/theme-2026/themes/2026-dark.json	Tweaks list.activeSelectionBackground color for the 2026 Dark theme.

Comments suppressed due to low confidence (2)

src/vs/workbench/contrib/chat/browser/widget/chatContentParts/chatQuestionCarouselPart.ts:844

• Calling updateSelection(-1) clears the selected styling but updateSelection never clears aria-activedescendant on the listbox, so assistive tech may still treat the previously selected option as the active descendant while focus is moved to the freeform textarea. Consider removing the aria-activedescendant attribute (or setting it to an empty string) when switching to the freeform input to keep ARIA state accurate.

				if (data.selectedIndex >= listItems.length - 1) {
					updateSelection(-1);
					freeformTextarea.focus();
					return;

src/vs/workbench/contrib/chat/browser/widget/chatContentParts/media/chatQuestionCarousel.css:287

• .chat-question-freeform-textarea:focus { outline: none; } combined with border: none removes the primary visible focus indicator for the custom answer input. Highlighting the number badge via :focus-within helps, but it doesn’t clearly indicate the actual input focus/caret target. Consider restoring a :focus-visible outline (or equivalent focus ring) on the textarea or its container to keep keyboard focus discoverable.

		.chat-question-freeform-textarea:focus {
			outline: none;
		}

[Copilot]

Pull request overview

Copilot reviewed 8 out of 8 changed files in this pull request and generated 6 comments.

[Copilot]

Pull request overview

Copilot reviewed 7 out of 7 changed files in this pull request and generated 3 comments.

Comments suppressed due to low confidence (1)

src/vs/workbench/contrib/chat/browser/widget/chatContentParts/chatQuestionCarouselPart.ts:275

• saveCurrentAnswer() only writes when answer !== undefined, but it never deletes a previously stored answer when the user clears their selection/freeform input. This can cause stale answers to be submitted (e.g. answer a question, go back, clear it, navigate away — the old value remains in _answers). Consider deleting the key when getCurrentAnswer() returns undefined so the map reflects the current UI state.

	private saveCurrentAnswer(): void {
		const currentQuestion = this.carousel.questions[this._currentIndex];
		if (!currentQuestion) {
			return; // Review tab or out of bounds
		}
		const answer = this.getCurrentAnswer();
		if (answer !== undefined) {
			this._answers.set(currentQuestion.id, answer);
		}
	}

[connor4312]

Send hidden while a request is in progress or a pending tool call / question carousel is active (previously only hidden during request progress).

What's the reasoning behind this change? This is a pretty common pattern imo. It's something I personally do a lot and I know other people folks do that from hearing feedback on steering/queuing

[daviddossett]

Checking, but the idea should be similar to the regular prompting experience where the steer button shows up as soon as you type

[daviddossett]

Ah ok, this somehow regressed:

Working on a fix

[daviddossett]

Fixed per DM chat

[connor4312]

requesting changes on ^ it's not a great experience imo and hitting "enter" is a no-op

[daviddossett]

Reverting this in #299079. Will re-raise with some a11y tweaks.