Input

Installation

npx shadcn@latest add @uqudo/input

Usage

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

<Input type="email" placeholder="Email" />

Set aria-invalid to switch the border and focus ring to the destructive colour. Pair it with a Field to display the error message.

<Input type="email" aria-invalid />

Examples

Disabled

With label

File

The file picker button inherits the text styles of the input.

API Reference

Input

Data attributes