A textarea component that automatically resizes based on its content.
The component props.
The rendered textarea element.
This component integrates with useInputValidation for validation and useResize to handle dynamic resizing. It expands vertically as the user types, up to a specified maxBlockSize.
useInputValidation
useResize
maxBlockSize
import { string, maxLength } from 'valibot';import { Textarea } from './textarea';const bioSchema = string([maxLength(500)]);function BioField() { return ( <Textarea name="bio" placeholder="Tell us about yourself" validate={bioSchema} minRows={3} maxBlockSize={300} /> );} Copy
import { string, maxLength } from 'valibot';import { Textarea } from './textarea';const bioSchema = string([maxLength(500)]);function BioField() { return ( <Textarea name="bio" placeholder="Tell us about yourself" validate={bioSchema} minRows={3} maxBlockSize={300} /> );}
A textarea component that automatically resizes based on its content.