{"slug":"follow-up-list","category":"text","job":"start","added":"2026-09-12T12:42Z","title":"Follow-Up List","description":"A vertical list of suggested next questions shown after a response, each sendable with a tap.","url":"https://ai-patterns.app/patterns/text/follow-up-list","markdown":"https://ai-patterns.app/patterns/text/follow-up-list.md","json":"https://ai-patterns.app/api/patterns/text/follow-up-list","seenIn":[],"spec":"# Follow-Up List\n\n## Summary\nA vertical list of suggested next questions shown after an assistant response, each one a full-width row a user can tap to send as their next message. It turns \"what else could I ask?\" into a menu instead of a blank composer.\n\n## When to use\n- After a response where the model can anticipate a handful of natural next questions (a docs answer, a research summary, a completed task) and surfacing them saves the user from typing.\n- When the suggestions themselves carry information worth reading in full — multi-clause or slightly long questions that would wrap awkwardly as chips.\n- As the primary next action after a response, when there isn't already a busy row of inline actions (copy, thumbs, share) competing for the same space.\n\n## When not to use\n- When suggestions are short, single-topic phrases meant to sit alongside other inline actions (copy, regenerate) — use compact wrapping chips instead, so the row stays low-footprint.\n- Immediately after every single message in a fast back-and-forth chat — it adds visual weight the user will mostly skip past; reserve it for points where the conversation could naturally branch.\n- When there's only one sensible follow-up — a single suggestion reads better as an inline link or a one-line prompt, not a list.\n\n## Anatomy\n- A vertical stack of rows, each with a leading \"corner-down-right\" arrow icon (echoing \"this leads to a reply\") and the suggestion text.\n- No dividers between rows — spacing and the hover highlight separate them.\n- No container border or background — the list sits directly under the response it follows, reading as part of that turn rather than a separate card.\n\n## Behavior\n- Rows animate in with a slight upward fade, staggered a beat apart, so the list doesn't slam onto the screen the instant the response finishes.\n- Each row is a full-width button: on hover or keyboard focus it shows a pointer cursor, a subtle background highlight, and its text and arrow brighten to full foreground, so it reads as clickable before it is clicked.\n- Clicking a row sends that suggestion as the user's next message immediately — it is not a two-step \"fill the composer, then let the user edit\" interaction.\n- Rows appear only once the response they follow has finished streaming, never while it's still generating.\n\n## Content guidelines\n- Write suggestions as full first-person questions the user could ask verbatim (\"How do I migrate historical data if I switch from Google Analytics\"), not fragments or topic labels.\n- Keep the list short — three to five suggestions. More than that stops being a quick scan and starts being a list to read.\n- Order by how likely the user is to want it next, not alphabetically or by topic grouping.\n\n## Accessibility\n- Each row is a real `\n \n ))}\n \n );\n}\n","dependencies":["lucide-react","motion"],"localImports":["@/lib/utils"]}