{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "extends": "none",
  "name": "combo-box-controlled-example",
  "title": "Combo Box Controlled",
  "description": "combo-box-controlled-example",
  "registryDependencies": [
    "https://intentui.com/r/combo-box",
    "https://intentui.com/r/field"
  ],
  "files": [
    {
      "path": "src/components/examples/pickers/combo-box/combo-box-controlled-example.tsx",
      "content": "'use client'\n\nimport { useState } from 'react'\n\nimport { ComboBox, ComboBoxContent, ComboBoxInput, ComboBoxItem } from '@/components/ui/combo-box'\nimport { Description, Label } from '@/components/ui/field'\n\nconst sports = [\n  { id: 1, name: 'Football' },\n  { id: 2, name: 'Basketball' },\n  { id: 3, name: 'Baseball' },\n  { id: 4, name: 'Soccer' },\n  { id: 5, name: 'Tennis' },\n  { id: 6, name: 'Cricket' },\n  { id: 7, name: 'Hockey' },\n  { id: 8, name: 'Rugby' },\n  { id: 9, name: 'Golf' },\n]\n\nexport default function ComboBoxControlledDemo() {\n  const [sport, setSport] = useState('')\n  return (\n    <>\n      <ComboBox onInputChange={setSport} inputValue={sport} name=\"sports\">\n        <Label>Sports</Label>\n        <ComboBoxInput placeholder=\"Select a sports\" />\n        <ComboBoxContent items={sports}>\n          {(item) => (\n            <ComboBoxItem id={item.id} textValue={item.name}>\n              {item.name}\n            </ComboBoxItem>\n          )}\n        </ComboBoxContent>\n      </ComboBox>\n      <Description className=\"mt-2 block text-muted-fg [&>strong]:text-fg\">\n        You have selected: <strong>{sport}</strong>\n      </Description>\n    </>\n  )\n}\n",
      "type": "registry:page",
      "target": "app/combo-box-controlled-example/page.tsx"
    }
  ],
  "type": "registry:page"
}