Components
Textarea
A hand-drawn textarea with optional auto-grow and resize support.
Installation
package manager
npx shadcn add https://bydefaulthuman.fun/r/textarea.jsonProps
PropTypeDefaultDescription
autoGrowbooleanfalseControls the `autoGrow` behavior.
errorstring—
Error message shown below the component.
labelstring—
Optional label text shown with the component.
themeCrumbleTheme—
Overrides the global Crumble theme for this instance.
valuestring—
Controlled textarea value.
defaultValuestring—
Initial uncontrolled value.
placeholderstring—
Placeholder text.
rowsnumber—
Visible row count when auto-grow is off.
disabledboolean—
Disables the textarea.
onChange(event) => void—
Change handler.
Auto-grow
The textarea expands as you type. The SVG border tracks the height via ResizeObserver.
Error state
Message is required
Disabled
Accessibility
Textarea renders a native textarea element and keeps the label in the DOM for assistive technologies. When using autoGrow, the resizing is visual only and does not change keyboard behavior.
Examples
import { Textarea } from "@/components/crumble/ui/textarea";
<Textarea label="Message" placeholder="Write something..." />;