"use client"
import { Avatar } from "@/components/ui/avatar"
import {
ComboBox,
ComboBoxContent,
ComboBoxInput,
ComboBoxItem,
ComboBoxLabel,
} from "@/components/ui/combo-box"
import { Label } from "@/components/ui/field"
export default function ComboBoxDisabledDemo() {
return (
<ComboBox isDisabled>
<Label>Users</Label>
<ComboBoxInput placeholder="Select a user" />
<ComboBoxContent items={users}>
{(item) => (
<ComboBoxItem key={item.id} id={item.id} textValue={item.name}>
<Avatar src={item.image_url} />
<ComboBoxLabel>{item.name}</ComboBoxLabel>
</ComboBoxItem>
)}
</ComboBoxContent>
</ComboBox>
)
}
const users = [
{
id: 1,
name: "Barbara Kirlin Sr.",
image_url: "https://i.pravatar.cc/150?img=1",
},
//...
]
npx shadcn@latest add @intentui/combo-box-disabled-demoUsage varies by registry entry. Refer to the registry docs or source files below for details.