EstávelFormuláriodesde v0.1.0

Input

Campo de texto de uma linha.

Quando usar

Texto curto: nome, e-mail, busca simples.

Playground

Ajuste props ou edite o código em tempo real (componentes compatíveis).

Controles interativos disponíveis em breve para este componente. Use os exemplos abaixo como referência.

import { Input } from "./input"

export default function App() {
  return <Input placeholder="Digite aqui" style={{ width: 280 }} />
}

Exemplos

Variações comuns de uso.

Uso básico

import { Input } from "@/components/ui/input"

export function InputDemo() {
  return <Input />
}

API

Props principais documentadas para o time.

PropTipoPadrãoDescrição
typestringtextTipo HTML do input.
disabledbooleanfalseDesativa o campo.
aria-invalidbooleanEstado de erro para acessibilidade.
placeholderstringTexto de apoio quando vazio.

Instalação

pnpm dlx shadcn@latest add http://localhost:3000/r/input.json
pnpm dlx shadcn@latest add @youxgroup/input

Dependências

npm: cn

Relacionados