componentes / formulário
Input
Campo de texto com estados visuais de foco, erro e desativado.
525 B gzip client componentbase ui · input
input-default.tsx
import { Input } from "@/components/ui/input";
export default function InputDefault() {
return (
<div className="flex w-full max-w-xs flex-col gap-3">
<Input aria-label="Name" placeholder="your name" />
<Input aria-label="File" type="file" />
<Input aria-label="Disabled" disabled placeholder="disabled" />
</div>
);
}Instalação
$ npx shadcn@latest add https://cd-ui.vercel.app/r/input.jsonprimeira vez? configure o components.json e o tema antes: veja instalação.
Uso
import { Input } from "@/components/ui/input"
<Input placeholder="your name" />API
Input
Base UI · InputCampo de texto. Dentro de um Field, recebe id, aria-describedby e estado de erro sozinho.
| prop | tipo | padrão |
|---|---|---|
...propsTudo do | Input.Props | - |
classNameClasses extras, mescladas com | string | - |