The Textarea component from pol-ui creates an animated heading that displays a list of words one by one. It is a great way to create a dynamic and engaging heading for your website.
Importation
Import the component from pol-ui to use the Textarea element:
import { Textarea } from "pol-ui";Default Textarea
Default Textarea
import { Textarea } from "pol-ui";
export const TextareaExample = (): JSX.Element => <Textarea>Text</Textarea>;Props
The props used in the Textarea component are the same as in the input component or any prop in the textarea element.
Examples
Custom Height
Example with long text
import { Textarea } from "pol-ui";
export const TextareaExample = (): JSX.Element => (
<Textarea className="min-h-[300px]" label="That is a loooong textarea">
Text
</Textarea>
);Resizable
Example with long text
import { Textarea } from "pol-ui";
export const TextareaExample = (): JSX.Element => (
<Textarea
className="min-h-[300px]"
label="You can resize me :)"
innerClassName="resize"
>
Text
</Textarea>
);Theme
The theme used in the Textarea component is the same as in the input component.