AI Components/PromptEditor

PromptEditor

A textarea for writing AI prompts. Auto-resizes as you type, shows a character counter, and submits on Cmd+Enter — perfect for system prompt builders and playground UIs.

import { PromptEditor } from "@animui/ui"

Basic

0 / 4000

Character limit

The counter turns amber at 80% capacity and red when you exceed the limit.

0 / 200

Loading state

0 / 4000

Click Send to simulate a 2-second request

Props

Prop	Type	Default	Description
`value`	`string`	`""`	Controlled value of the textarea.
`onChange`	`(value: string) => void`	—	Called on every keystroke with the current value.
`onSubmit`	`(value: string) => void`	—	Called with the final prompt value when Cmd+Enter / Ctrl+Enter is pressed or Send is clicked.
`placeholder`	`string`	`"Enter your prompt…"`	Placeholder text shown when editor is empty.
`maxLength`	`number`	`4000`	Character limit. Shows a live counter that turns amber near the limit and red when exceeded.
`disabled`	`boolean`	`false`	Disables the textarea and Send button.
`loading`	`boolean`	`false`	Replaces Send button label with a spinner while a request is in-flight.
`className`	`string`	—	Additional classes for the outer wrapper.