Skip to content

Commit dcacf77

Browse files
fix(cli): surface keyboard controls on add-on multiselect prompt (#441)
Users reported not realizing the add-on selector uses checkboxes (Space to toggle) and requires Enter to confirm. Show the keyboard shortcuts note above every multiselect (not once per session, and no longer before single-select prompts), and append an inline `(Space to toggle, Enter to confirm)` hint to the prompt message itself so the cue is inseparable from the prompt.
1 parent c37953e commit dcacf77

2 files changed

Lines changed: 26 additions & 17 deletions

File tree

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
---
2+
'@tanstack/cli': patch
3+
---
4+
5+
fix(cli): make add-on multiselect keyboard controls discoverable
6+
7+
Users encountering the add-on multiselect prompt during `tanstack create`
8+
often didn't realize the entries are checkboxes (toggle with Space) and
9+
that the selection must be confirmed with Enter. The existing keyboard
10+
shortcuts note was only shown once per session and could appear before
11+
single-select prompts where it didn't apply. Now:
12+
13+
- The "Keyboard Shortcuts" note is shown immediately above every
14+
multiselect prompt and is no longer shown before single-select prompts.
15+
- The multiselect message itself includes an inline `(Space to toggle,
16+
Enter to confirm)` hint so the cue is inseparable from the prompt.

packages/cli/src/ui-prompts.ts

Lines changed: 10 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -133,9 +133,6 @@ export async function selectTemplate(
133133
return selected
134134
}
135135

136-
// Track if we've shown the multiselect help text
137-
let hasShownMultiselectHelp = false
138-
139136
export async function selectAddOns(
140137
framework: Framework,
141138
mode: string,
@@ -150,15 +147,6 @@ export async function selectAddOns(
150147
return []
151148
}
152149

153-
// Show help text only once
154-
if (!hasShownMultiselectHelp) {
155-
note(
156-
'Use ↑/↓ to navigate • Space to select/deselect • Enter to confirm',
157-
'Keyboard Shortcuts',
158-
)
159-
hasShownMultiselectHelp = true
160-
}
161-
162150
if (allowMultiple) {
163151
const selectableAddOns = addOns.filter(
164152
(addOn) => !forcedAddOns.includes(addOn.id),
@@ -168,13 +156,18 @@ export async function selectAddOns(
168156
return []
169157
}
170158

159+
note(
160+
'Use ↑/↓ to navigate • Space to select/deselect • Enter to confirm',
161+
'Keyboard Shortcuts',
162+
)
163+
171164
const value = await multiselect({
172-
message,
165+
message: `${message} (Space to toggle, Enter to confirm)`,
173166
options: selectableAddOns.map((addOn) => ({
174-
value: addOn.id,
175-
label: addOn.name,
176-
hint: addOn.description,
177-
})),
167+
value: addOn.id,
168+
label: addOn.name,
169+
hint: addOn.description,
170+
})),
178171
maxItems: selectableAddOns.length,
179172
required: false,
180173
})

0 commit comments

Comments
 (0)