Prompt Suggestion

An empty-assistant screen using Prompt Suggestions to offer high-value starting prompts before the user types anything.

Loading demo: prompt-suggestion-real-world

Installation

npx sdaia-ui@latest add prompt-suggestion

Usage

import { PromptSuggestion } from "sdaia-ui"

1<PromptSuggestion
2  variant="brand"
3  title="Analyze Revenue Anomalies"
4  description="Parse your uploaded transaction database for trailing outliers."
5  category="Data Analysis"
6  meta="~2.1k tokens"
7/>

Examples

Brand

A raised surface — the default style.

Loading demo: prompt-suggestion-brand

Neutral

A subtle surface.

Loading demo: prompt-suggestion-neutral

Outline

A transparent surface with a default border.

Loading demo: prompt-suggestion-outline

Without icon

Hide the leading icon disc with showIcon={false}.

Loading demo: prompt-suggestion-without-icon

API Reference

Prop	Type	Default	Required
variant	'brand' \| 'neutral' \| 'outline'	'brand'	optional
title	ReactNode	—	required
description	ReactNode	—	optional
category	ReactNode	—	optional
meta	ReactNode	—	optional
icon	string	sparklesStroke	optional
showIcon	boolean	true	optional
dir	'ltr' \| 'rtl'	—	optional