{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "menu-command",
  "registryDependencies": [
    "https://taki-ui.com/r/menu.json",
    "https://taki-ui.com/r/command.json",
    "https://taki-ui.com/r/avatar.json"
  ],
  "files": [
    {
      "path": "registry/new-york/examples/menu-command.tsx",
      "content": "\"use client\"\n\nimport { SubmenuTrigger } from \"react-aria-components\"\n\nimport {\n  Avatar,\n  AvatarFallback,\n  AvatarImage,\n} from \"@/registry/new-york/ui/avatar\"\nimport { Button } from \"@/registry/new-york/ui/button\"\nimport {\n  Command,\n  CommandDialog,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n} from \"@/registry/new-york/ui/command\"\nimport {\n  Menu,\n  MenuItem,\n  MenuSeparator,\n  MenuTrigger,\n} from \"@/registry/new-york/ui/menu\"\n\nimport { Popover } from \"../ui/popover\"\n\nconst TEAM_MEMBERS = [\n  {\n    name: \"shadcn\",\n    email: \"shadcn@example.com\",\n    avatar: \"https://github.com/shadcn.png\",\n  },\n  {\n    name: \"maxleiter\",\n    email: \"max@example.com\",\n    avatar: \"https://github.com/maxleiter.png\",\n  },\n  {\n    name: \"evilrabbit\",\n    email: \"rabbit@example.com\",\n    avatar: \"https://github.com/evilrabbit.png\",\n  },\n]\n\nconst PROJECTS = [\n  { name: \"Design System\", emoji: \"🎨\" },\n  { name: \"Marketing Site\", emoji: \"📱\" },\n  { name: \"Dashboard\", emoji: \"📊\" },\n  { name: \"Documentation\", emoji: \"📚\" },\n  { name: \"API Gateway\", emoji: \"🔌\" },\n]\n\nexport default function MenuCommandDemo() {\n  return (\n    <MenuTrigger>\n      <Button variant=\"outline\">Assign Task</Button>\n      <Menu className=\"w-56\">\n        <MenuItem onAction={() => console.log(\"Assign to me\")}>\n          Assign to me\n        </MenuItem>\n        <MenuSeparator />\n        <SubmenuTrigger>\n          <MenuItem>Assign to team member</MenuItem>\n          <Popover>\n            <Command>\n              <CommandInput placeholder=\"Search team members...\" autoFocus />\n              <CommandList\n                renderEmptyState={() => (\n                  <CommandEmpty>No team member found</CommandEmpty>\n                )}\n              >\n                <CommandGroup>\n                  {TEAM_MEMBERS.map((member) => (\n                    <CommandItem\n                      key={member.email}\n                      id={member.email}\n                      onSelect={() => {\n                        console.log(\"Assigned to:\", member.name)\n                      }}\n                    >\n                      <span className=\"mr-2 inline-flex h-6 w-6 overflow-hidden rounded-full align-middle\">\n                        <img src={member.avatar} alt={member.name} />\n                      </span>\n                      <span className=\"ml-2\">{member.name}</span>\n                      <span className=\"text-muted-foreground ml-auto text-xs\">\n                        {member.email}\n                      </span>\n                    </CommandItem>\n                  ))}\n                </CommandGroup>\n              </CommandList>\n            </Command>\n          </Popover>\n        </SubmenuTrigger>\n        <SubmenuTrigger>\n          <MenuItem>Move to project</MenuItem>\n          <Popover>\n            <Command>\n              <CommandInput placeholder=\"Search projects...\" autoFocus />\n              <CommandList\n                renderEmptyState={() => (\n                  <CommandEmpty>No project found</CommandEmpty>\n                )}\n              >\n                <CommandGroup>\n                  {PROJECTS.map((project) => (\n                    <CommandItem\n                      key={project.name}\n                      id={project.name}\n                      onSelect={() => {\n                        console.log(\"Moved to:\", project.name)\n                      }}\n                    >\n                      <span className=\"mr-2\">{project.emoji}</span>\n                      {project.name}\n                    </CommandItem>\n                  ))}\n                </CommandGroup>\n              </CommandList>\n            </Command>\n          </Popover>\n        </SubmenuTrigger>\n        <MenuSeparator />\n        <MenuItem onAction={() => console.log(\"Unassign\")}>Unassign</MenuItem>\n      </Menu>\n    </MenuTrigger>\n  )\n}\n",
      "type": "registry:example"
    }
  ],
  "type": "registry:example"
}