Installation
Install the dependencies:
npm install @base-ui/reactCopy the source into components/ui/input.tsx. Registry items that depend on it install it automatically.
Usage
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
export function Example() {
return (
<div className="flex flex-col gap-2">
<Label htmlFor="email">Email</Label>
<Input id="email" type="email" placeholder="[email protected]" />
</div>
);
}Examples
With a button
Inputs sit on the same 32px rhythm as buttons, so rows compose without alignment fixes.
API Reference
Input
Accepts every native input prop.
InputProps
- typestring= "text"
The native input type.
- disabledboolean= false
Prevents editing and mutes the field.
- className?string
Additional CSS classes.