Input

registry/examples/input-demo.tsx

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

export default function InputDemo() {

Installation


pnpmnpmyarnbun
pnpm dlx shadcn@latest add https://nusa-ui.vercel.app/r/input.json

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

<Input type="text" placeholder="Enter your name" />

registry/examples/input-default.tsx

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

export default function InputDefault() {

registry/examples/input-with-label.tsx

import { Input } from "@/registry/ui/input"
import { Label } from "@/registry/ui/label"

registry/examples/input-disabled.tsx

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

export default function InputDisabled() {

registry/examples/input-with-button.tsx

import { Button } from "@/registry/ui/button"
import { Input } from "@/registry/ui/input"

Picture

registry/examples/input-file.tsx

import { Input } from "@/registry/ui/input"
import { Label } from "@/registry/ui/label"

All standard HTML input attributes are supported.

Prop	Type	Default	Description
`type`	`string`	`"text"`	The input type
`placeholder`	`string`	-	Placeholder text
`disabled`	`boolean`	`false`	Disable the input