Component
TextEditor
A Tiptap-backed rich text editor with a composable toolbar, bubble menu, and character counter.
Install
Run the CLI to copy the source into your project.
pnpm dlx @stalk-ui/cli add @stalk-ui/text-editorExamples
Live previews render through the docs app's PandaCSS codegen.
<TextEditorDemo />
Props
Public component props extracted from the source TypeScript types.
| Prop | Type | Required | Default | Description |
|---|---|---|---|---|
| `children` | `ReactNode` | Yes | - | - |
| `className` | `string` | No | - | - |
| `label` | `string` | No | - | Accessible name for the floating toolbar. |
| Prop | Type | Required | Default | Description |
| `target` | `'color' \ | 'highlight'` | No | - |
| `colors` | `readonly string[]` | No | - | - |
| `label` | `string` | No | - | - |
| Prop | Type | Required | Default | Description |
| `size` | `'sm' \ | 'md'` | No | - |
| Prop | Type | Required | Default | Description |
| `emoji` | `readonly string[]` | No | - | - |
| `label` | `string` | No | - | - |
| Prop | Type | Required | Default | Description |
| `mark` | `keyof typeof MARKS` | Yes | - | - |
| `label` | `string` | No | - | Localized label override (defaults to English). |
| Prop | Type | Required | Default | Description |
| `editor` | `Editor \ | null` | Yes | - |
| `size` | `'sm' \ | 'md'` | No | - |
| `invalid` | `boolean` | No | - | - |
| `disabled` | `boolean` | No | - | - |
Variants
Variant axes exposed by the underlying PandaCSS recipe or slot recipe.
| Variant | Values |
|---|---|
| `size` | `sm`, `md` |
Registry
Files this component contributes to your registry install.
- Manifest: `/r/text-editor.json`
- Recipe: `textEditor`
- Files: `src/components/ui/text-editor.tsx`