# antuikit / Prompts

> Prompts, a set of suggested questions to start or continue a chat. Adds nothing beyond `className` merging through `cn()`.

Docs: https://antuikit.com/docs/components/prompts

## Install

npx antuikit@latest init
npx antuikit@latest add prompts

## Import

import { Prompts } from "@/components/ui/prompts";

## Demos

- [Basic](https://ui.antuikit.com/embed/prompts/basic.md): Pass `items` with an `icon`, `label` and `description` each, a `title` above them, and `disabled` on a prompt to lock it.
- [Item click](https://ui.antuikit.com/embed/prompts/item-click.md): Pass `onItemClick` to act on the prompt a reader picks, with the clicked item in `info.data`, like sending its question.
- [Fade in](https://ui.antuikit.com/embed/prompts/fade-in.md): Set `fadeIn` to fade the prompts in when they render, or `fadeInLeft` to reveal them from left to right.
- [Vertical](https://ui.antuikit.com/embed/prompts/vertical.md): Set `vertical` to stack the prompts in a column, which suits longer questions.
- [Wrap](https://ui.antuikit.com/embed/prompts/wrap.md): Set `wrap` to let short prompts flow onto more lines when the row runs out of room.
- [Fixed width](https://ui.antuikit.com/embed/prompts/fixed-width.md): Combine `wrap` with a width on the `item` slot of `classNames` to lay the prompts out in two even columns.
- [Nested](https://ui.antuikit.com/embed/prompts/nested.md): Give a prompt `children` to group follow-up questions under it, each clickable on its own.
- [New chat starters](https://ui.antuikit.com/embed/prompts/new-chat-starters.md): A new chat screen with a heading, four starter cards in two columns that fill the input when picked, and the input below.
- [Follow-up questions](https://ui.antuikit.com/embed/prompts/follow-ups.md): An assistant answer with suggested follow-up questions under it, each sent as the next message and answered after a short wait.
- [Template gallery](https://ui.antuikit.com/embed/prompts/template-gallery.md): A gallery of chat templates in three columns, switched by category from the card header, that start a chat when picked.

## Rules

- antuikit components are COPIED into a project from a registry. There is no
  `antuikit` package to import components from at runtime.
- Import from `@/components/ui/prompts`, never from `antd`. antd stays for
  `theme`, `App`, the `message` / `notification` statics and type-only imports.
- Do not nest a bare `<ConfigProvider theme>` to re-theme a region. Use
  `<ThemeScope theme={...}>`, which also carries the cssVar key class that
  non-antd descendants inherit their tokens from.
- Colors, radii and spacing come from the token contract, not from hardcoded
  values: write `rounded-lg`, `px-xxs`, `bg-warning`, not the raw `var(--ant-*)`.
- `Prompts` takes every Ant Design v6 prop of the same component. The
  wrapper never narrows that surface, so anything antd documents also works here.