{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "tailwind-commandpalette",
  "type": "registry:ui",
  "title": "CommandPalette",
  "dependencies": [
    "react-aria-components",
    "react",
    "tailwindcss-react-aria-components",
    "tw-animate-css"
  ],
  "registryDependencies": [
    "https://react-aria.adobe.com/registry/tailwind-menu.json",
    "https://react-aria.adobe.com/registry/tailwind-searchfield.json",
    "https://react-aria.adobe.com/registry/tailwind-modal.json"
  ],
  "files": [
    {
      "path": "components/ui/CommandPalette.tsx",
      "type": "registry:ui",
      "content": "'use client';\nimport {\n  Autocomplete as AriaAutocomplete,\n  type AutocompleteProps as AriaAutocompleteProps,\n  useFilter\n} from 'react-aria-components/Autocomplete';\nimport {type MenuProps as AriaMenuProps} from 'react-aria-components/Menu';\nimport {Dialog} from 'react-aria-components/Dialog';\nimport {Menu} from '@/registry/react-aria/ui/Menu';\nimport {SearchField} from '@/registry/react-aria/ui/SearchField';\nimport {Modal} from '@/registry/react-aria/ui/Modal';\nimport React, {useEffect} from 'react';\n\nexport interface CommandPaletteProps<T>\n  extends Omit<AriaAutocompleteProps, 'children'>, AriaMenuProps<T> {\n  isOpen: boolean;\n  onOpenChange: (isOpen?: boolean) => void;\n}\n\nexport function CommandPalette<T>(props: CommandPaletteProps<T>) {\n  let {isOpen, onOpenChange} = props;\n  let {contains} = useFilter({sensitivity: 'base'});\n\n  useEffect(() => {\n    let isMacUA = /mac(os|intosh)/i.test(navigator.userAgent);\n    const handleKeyDown = (e: KeyboardEvent) => {\n      if (e.key === 'j' && (isMacUA ? e.metaKey : e.ctrlKey)) {\n        e.preventDefault();\n        onOpenChange(true);\n      } else if (e.key === 'Escape') {\n        e.preventDefault();\n        onOpenChange(false);\n      }\n    };\n\n    document.addEventListener('keydown', handleKeyDown);\n    return () => document.removeEventListener('keydown', handleKeyDown);\n  }, [onOpenChange]);\n\n  return (\n    <Modal isDismissable isOpen={isOpen} onOpenChange={onOpenChange}>\n      <Dialog className=\"flex flex-col max-h-[inherit]\">\n        <AriaAutocomplete filter={contains} {...props}>\n          <SearchField\n            autoFocus\n            aria-label=\"Search commands\"\n            placeholder=\"Search commands\"\n            className=\"m-2\"\n          />\n          <Menu\n            {...props}\n            className=\"flex-1 min-h-0\"\n            renderEmptyState={() => 'No results found.'}\n          />\n        </AriaAutocomplete>\n      </Dialog>\n    </Modal>\n  );\n}\n"
    }
  ],
  "css": {
    "@plugin \"tailwindcss-react-aria-components\"": {},
    "@import \"tw-animate-css\"": {}
  }
}