Morphing Input Chat
Morphing chat input with dynamic icon transitions. Features attachment buttons that morph into send button when text is entered, with smooth animations.
✦Login free · unlock code · 200+ premium components with Pro
Refresh preview
Share Component
Copy CLI command
Props
| Property | Type | Default | Description |
|---|---|---|---|
| placeholder | string | "Ask AI anything..." | Placeholder text for the input field. |
| onSend | (message: string) => void | undefined | Callback function called when message is sent. |
| showLeftIcon | boolean | true | Whether to display the left icon button. |
| showAttachments | boolean | true | Whether to show attachment buttons when input is empty. |
| className | string | undefined | Additional CSS classes for custom styling. |
| value | string | undefined | Controlled input value. |
| onChange | (value: string) => void | undefined | Callback function called when input value changes. |
Related Components
Enjoying Uilora? Unlock the full library.
56+ premium components, unlimited CLI, unlimited MCP, v0 + Claude prompts — one payment, forever.
✓ Instant access✓ Lifetime updates✓ Commercial license
Built something cool?
Share your work with 10k+ devs — or tell us how we can improve.