React Suggested Prompts
A blank chat box teaches nobody what an assistant can do. Starters turn the empty state into onboarding: a handful of concrete, domain-shaped examples that show the tool's range and return something useful on the very first click.
How can I help with the fab today?
Pick a starting point, or just describe what you need.
Installation
Props
| Prop | Type | Description |
|---|---|---|
| prompts | SuggestedPrompt[] | { id, title, subtitle?, icon?, prompt? } |
| heading | string | Centered heading |
| subheading | string | Supporting line |
| columns | 1 or 2 | Grid columns (default 2) |
| onSelect | (prompt, item) => void | Fires with the text to send |
Make them concrete, and make them yours
The difference between a starter that gets clicked and one that doesn't is specificity. "Explain this SPC excursion" and "Extract Vgs(th) and Rds(on) from a datasheet" show a fab engineer that the assistant speaks their language; "Ask me anything" shows them nothing. Each card carries an icon, a title, and a subtitle that hints at the concrete shape of the request, and onSelect hands back the full prompt text to drop straight into the composer.
Keep the set to four to six. This is a menu that says "here is what I'm good at", not a catalogue — and the moment a user sends their first real message, it gets out of the way.
New components every week
Get the week's new Kelvin UI components and templates in one short email. No spam, unsubscribe anytime.