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.

Author: tannerlinsley

.changeset/multiselect-keyboard-hint.md

@@ -0,0 +1,16 @@
+---
+'@tanstack/cli': patch
+---
+
+fix(cli): make add-on multiselect keyboard controls discoverable
+
+Users encountering the add-on multiselect prompt during `tanstack create`
+often didn't realize the entries are checkboxes (toggle with Space) and
+that the selection must be confirmed with Enter. The existing keyboard
+shortcuts note was only shown once per session and could appear before
+single-select prompts where it didn't apply. Now:
+
+- The "Keyboard Shortcuts" note is shown immediately above every
+  multiselect prompt and is no longer shown before single-select prompts.
+- The multiselect message itself includes an inline `(Space to toggle,
+  Enter to confirm)` hint so the cue is inseparable from the prompt.

packages/cli/src/ui-prompts.ts

@@ -133,9 +133,6 @@ export async function selectTemplate(
   return selected
 }
 
-// Track if we've shown the multiselect help text
-let hasShownMultiselectHelp = false
-
 export async function selectAddOns(
   framework: Framework,
   mode: string,
@@ -150,15 +147,6 @@ export async function selectAddOns(
     return []
   }
 
-  // Show help text only once
-  if (!hasShownMultiselectHelp) {
-    note(
-      'Use ↑/↓ to navigate • Space to select/deselect • Enter to confirm',
-      'Keyboard Shortcuts',
-    )
-    hasShownMultiselectHelp = true
-  }
-
   if (allowMultiple) {
     const selectableAddOns = addOns.filter(
       (addOn) => !forcedAddOns.includes(addOn.id),
@@ -168,13 +156,18 @@ export async function selectAddOns(
       return []
     }
 
+    note(
+      'Use ↑/↓ to navigate • Space to select/deselect • Enter to confirm',
+      'Keyboard Shortcuts',
+    )
+
     const value = await multiselect({
-      message,
+      message: `${message} (Space to toggle, Enter to confirm)`,
       options: selectableAddOns.map((addOn) => ({
-          value: addOn.id,
-          label: addOn.name,
-          hint: addOn.description,
-        })),
+        value: addOn.id,
+        label: addOn.name,
+        hint: addOn.description,
+      })),
       maxItems: selectableAddOns.length,
       required: false,
     })