Textarea
@vincisys/eyeson

Textarea

Campo de texto multilinha com o mesmo padrão visual do Input.
Visualizar 
import { Textarea } from "@vincisys/eyeson";

export function TextareaBasicDemo() {
	return (
		<div className="flex max-w-md flex-col gap-4">
			<Textarea
				label="Observações"
				placeholder="Digite suas observações..."
				labelVariant="outside"
			/>
		</div>
	);
}

Instalação

import { Textarea } from '@vincisys/eyeson';

Uso

import { Textarea } from '@vincisys/eyeson';

export function Example() {
return (
  <Textarea
    label="Observações"
    placeholder="Digite suas observações..."
    labelVariant="outside"
  />
);
}

Usa o mesmo padding horizontal e labelVariant do Input (floating | outside).

Exemplos

Label fora
Visualizar 
import { Textarea } from "@vincisys/eyeson";

export function TextareaBasicDemo() {
	return (
		<div className="flex max-w-md flex-col gap-4">
			<Textarea
				label="Observações"
				placeholder="Digite suas observações..."
				labelVariant="outside"
			/>
		</div>
	);
}

Label flutuante

Descrição
Visualizar 
import { Textarea } from "@vincisys/eyeson";

export function TextareaFloatingDemo() {
	return (
		<div className="flex max-w-md flex-col gap-4">
			<Textarea label="Descrição" placeholder=" " />
		</div>
	);
}

Inválido

Campo obrigatório
Visualizar 
import { Textarea } from "@vincisys/eyeson";

export function TextareaInvalidDemo() {
	return (
		<div className="flex max-w-md flex-col gap-4">
			<Textarea
				label="Comentário"
				labelVariant="outside"
				state="invalid"
				errorMessage="Campo obrigatório"
				required
			/>
		</div>
	);
}