Textarea

Displays a form textarea or a component that looks like a textarea.

Installation

Copy and paste the following code into your project.

import clsx from 'clsx';
import { TextareaHTMLAttributes, forwardRef } from 'react';
import styles from './styles.module.scss';
 
export type TextareaProps = TextareaHTMLAttributes<HTMLTextAreaElement>;
 
const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(({ className, ...props }, ref) => {
    return <textarea className={clsx(styles.text__area, className)} ref={ref} {...props} />;
});
Textarea.displayName = 'Textarea';
 
export { Textarea };

Update the import paths to match your project setup.

Usage

import { Textarea } from '@/components/ui/textarea';
<Textarea />

Examples

Default

Disabled

With Label

With Text

Your message will be copied to the support team.

With Button

Form

You can @mention other users and organizations.