You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

47 lines
2.0 KiB
Markdown

# Reusable AI Interface Prompt
Create or update an AI-assisted frontend using the existing AI Elements under
`src/shared/components/ui/shadcn-io/ai`.
## React composition contract
- Compose the smallest relevant set of `Conversation`, `Message`, `Response`,
`PromptInput`, `Actions`, `Reasoning`, `Source`, `Task`, `Tool`, or
`WebPreview` components.
- Keep provider credentials and model calls on an approved backend; never expose
secret keys through `VITE_*` variables or public browser code.
- Model pending, submitted, streaming, complete, stopped, and error states
explicitly.
- Keep component rendering separate from transport and domain orchestration.
## Styling theme: calm intelligence
- Make user input, assistant output, tool activity, and sources visually
distinguishable without turning the interface into a separate design system.
- Use semantic project tokens and existing typography.
- Streamed output must remain readable without excessive layout movement.
- Reasoning and tool details use progressive disclosure.
- Destructive or externally visible tool actions require clear confirmation.
## Request
- **User goal:** `<What the AI helps the user accomplish>`
- **Input:** `<Text, files, images, structured selection, or context>`
- **Output:** `<Text, code, visualization, task, or tool result>`
- **Transport/backend:** `<Existing approved API or "prompt handoff only">`
- **Grounding:** `<Sources and citations required>`
- **Actions:** `<Copy, retry, stop, approve, reject, or apply>`
## Acceptance criteria
1. The UI uses existing AI Elements instead of implementing competing chat
primitives.
2. No token, credential, or private source is exposed in client code or logs.
3. Keyboard, screen reader, streaming, error, retry, and stop behavior are
defined.
4. Source citations and tool status are shown when the workflow uses them.
5. Generated code or mutations are reviewed before being applied.
Run focused verification allowed by `agents.md` and finish with a simple
**TL;DR**.