{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "p-drawer-13",
  "description": "Responsive actions menu: menu on desktop, drawer on mobile",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "@coss/button",
    "@coss/drawer",
    "@coss/menu",
    "@coss/use-media-query"
  ],
  "files": [
    {
      "path": "registry/default/particles/p-drawer-13.tsx",
      "content": "\"use client\";\n\nimport {\n  CopyIcon,\n  EllipsisIcon,\n  PencilIcon,\n  ShareIcon,\n  TrashIcon,\n} from \"lucide-react\";\nimport { useMediaQuery } from \"@/registry/default/hooks/use-media-query\";\nimport { Button } from \"@/registry/default/ui/button\";\nimport {\n  Drawer,\n  DrawerClose,\n  DrawerMenu,\n  DrawerMenuCheckboxItem,\n  DrawerMenuGroup,\n  DrawerMenuGroupLabel,\n  DrawerMenuItem,\n  DrawerMenuRadioGroup,\n  DrawerMenuRadioItem,\n  DrawerMenuSeparator,\n  DrawerMenuTrigger,\n  DrawerPanel,\n  DrawerPopup,\n  DrawerTrigger,\n} from \"@/registry/default/ui/drawer\";\nimport {\n  Menu,\n  MenuCheckboxItem,\n  MenuGroup,\n  MenuGroupLabel,\n  MenuItem,\n  MenuPopup,\n  MenuRadioGroup,\n  MenuRadioItem,\n  MenuSeparator,\n  MenuSub,\n  MenuSubPopup,\n  MenuSubTrigger,\n  MenuTrigger,\n} from \"@/registry/default/ui/menu\";\n\nconst TRIGGER_ARIA_LABEL = \"Open menu\";\n\nexport default function Particle() {\n  const isMobile = useMediaQuery(\"max-md\");\n\n  if (isMobile) {\n    return (\n      <Drawer>\n        <DrawerTrigger\n          render={\n            <Button\n              aria-label={TRIGGER_ARIA_LABEL}\n              size=\"icon\"\n              variant=\"outline\"\n            />\n          }\n        >\n          <EllipsisIcon aria-hidden />\n        </DrawerTrigger>\n        <DrawerPopup showBar>\n          <DrawerPanel>\n            <DrawerMenu>\n              <DrawerMenuGroup>\n                <DrawerMenuGroupLabel>Actions</DrawerMenuGroupLabel>\n                <DrawerClose render={<DrawerMenuItem />}>\n                  <PencilIcon aria-hidden />\n                  Edit\n                </DrawerClose>\n                <DrawerClose render={<DrawerMenuItem />}>\n                  <CopyIcon aria-hidden />\n                  Duplicate\n                </DrawerClose>\n                <DrawerClose render={<DrawerMenuItem />}>\n                  <ShareIcon aria-hidden />\n                  Share\n                </DrawerClose>\n              </DrawerMenuGroup>\n              <DrawerMenuSeparator />\n              <DrawerMenuCheckboxItem>Shuffle</DrawerMenuCheckboxItem>\n              <DrawerMenuCheckboxItem>Repeat</DrawerMenuCheckboxItem>\n              <DrawerMenuCheckboxItem disabled>\n                Enhanced Audio\n              </DrawerMenuCheckboxItem>\n              <DrawerMenuSeparator />\n              <DrawerMenuGroup>\n                <DrawerMenuGroupLabel>Sort by</DrawerMenuGroupLabel>\n                <DrawerMenuRadioGroup defaultValue=\"artist\">\n                  <DrawerMenuRadioItem value=\"artist\">\n                    Artist\n                  </DrawerMenuRadioItem>\n                  <DrawerMenuRadioItem value=\"album\">Album</DrawerMenuRadioItem>\n                  <DrawerMenuRadioItem value=\"title\">Title</DrawerMenuRadioItem>\n                </DrawerMenuRadioGroup>\n              </DrawerMenuGroup>\n              <DrawerMenuSeparator />\n              <DrawerMenuCheckboxItem variant=\"switch\">\n                Auto save\n              </DrawerMenuCheckboxItem>\n              <DrawerMenuSeparator />\n              <Drawer>\n                <DrawerMenuTrigger>Add to Playlist</DrawerMenuTrigger>\n                <DrawerPopup showBar>\n                  <DrawerPanel>\n                    <DrawerMenu>\n                      <DrawerMenuGroup>\n                        <DrawerMenuGroupLabel>\n                          Add to Playlist\n                        </DrawerMenuGroupLabel>\n                      </DrawerMenuGroup>\n                      <DrawerClose render={<DrawerMenuItem />}>\n                        Jazz\n                      </DrawerClose>\n                      <Drawer>\n                        <DrawerMenuTrigger>Rock</DrawerMenuTrigger>\n                        <DrawerPopup showBar>\n                          <DrawerPanel>\n                            <DrawerMenu>\n                              <DrawerMenuGroup>\n                                <DrawerMenuGroupLabel>\n                                  Rock\n                                </DrawerMenuGroupLabel>\n                              </DrawerMenuGroup>\n                              <DrawerClose render={<DrawerMenuItem />}>\n                                Hard Rock\n                              </DrawerClose>\n                              <DrawerClose render={<DrawerMenuItem />}>\n                                Soft Rock\n                              </DrawerClose>\n                              <DrawerClose render={<DrawerMenuItem />}>\n                                Classic Rock\n                              </DrawerClose>\n                              <DrawerMenuSeparator />\n                              <DrawerClose render={<DrawerMenuItem />}>\n                                Metal\n                              </DrawerClose>\n                              <DrawerClose render={<DrawerMenuItem />}>\n                                Punk\n                              </DrawerClose>\n                              <DrawerClose render={<DrawerMenuItem />}>\n                                Grunge\n                              </DrawerClose>\n                              <DrawerClose render={<DrawerMenuItem />}>\n                                Alternative\n                              </DrawerClose>\n                              <DrawerClose render={<DrawerMenuItem />}>\n                                Indie\n                              </DrawerClose>\n                              <DrawerClose render={<DrawerMenuItem />}>\n                                Electronic\n                              </DrawerClose>\n                            </DrawerMenu>\n                          </DrawerPanel>\n                        </DrawerPopup>\n                      </Drawer>\n                      <DrawerClose render={<DrawerMenuItem />}>Pop</DrawerClose>\n                    </DrawerMenu>\n                  </DrawerPanel>\n                </DrawerPopup>\n              </Drawer>\n              <DrawerMenuSeparator />\n              <DrawerMenuGroup>\n                <DrawerMenuGroupLabel>Danger zone</DrawerMenuGroupLabel>\n                <DrawerClose render={<DrawerMenuItem variant=\"destructive\" />}>\n                  <TrashIcon aria-hidden />\n                  Delete\n                </DrawerClose>\n              </DrawerMenuGroup>\n            </DrawerMenu>\n          </DrawerPanel>\n        </DrawerPopup>\n      </Drawer>\n    );\n  }\n\n  return (\n    <Menu>\n      <MenuTrigger\n        render={\n          <Button\n            aria-label={TRIGGER_ARIA_LABEL}\n            size=\"icon\"\n            variant=\"outline\"\n          />\n        }\n      >\n        <EllipsisIcon aria-hidden />\n      </MenuTrigger>\n      <MenuPopup>\n        <MenuGroup>\n          <MenuGroupLabel>Actions</MenuGroupLabel>\n          <MenuItem>\n            <PencilIcon aria-hidden />\n            Edit\n          </MenuItem>\n          <MenuItem>\n            <CopyIcon aria-hidden />\n            Duplicate\n          </MenuItem>\n          <MenuItem>\n            <ShareIcon aria-hidden />\n            Share\n          </MenuItem>\n        </MenuGroup>\n        <MenuSeparator />\n        <MenuCheckboxItem>Shuffle</MenuCheckboxItem>\n        <MenuCheckboxItem>Repeat</MenuCheckboxItem>\n        <MenuCheckboxItem disabled>Enhanced Audio</MenuCheckboxItem>\n        <MenuSeparator />\n        <MenuGroup>\n          <MenuGroupLabel>Sort by</MenuGroupLabel>\n          <MenuRadioGroup defaultValue=\"artist\">\n            <MenuRadioItem value=\"artist\">Artist</MenuRadioItem>\n            <MenuRadioItem value=\"album\">Album</MenuRadioItem>\n            <MenuRadioItem value=\"title\">Title</MenuRadioItem>\n          </MenuRadioGroup>\n        </MenuGroup>\n        <MenuSeparator />\n        <MenuCheckboxItem variant=\"switch\">Auto save</MenuCheckboxItem>\n        <MenuSeparator />\n        <MenuSub>\n          <MenuSubTrigger>Add to Playlist</MenuSubTrigger>\n          <MenuSubPopup>\n            <MenuItem>Jazz</MenuItem>\n            <MenuSub>\n              <MenuSubTrigger>Rock</MenuSubTrigger>\n              <MenuSubPopup>\n                <MenuItem>Hard Rock</MenuItem>\n                <MenuItem>Soft Rock</MenuItem>\n                <MenuItem>Classic Rock</MenuItem>\n                <MenuSeparator />\n                <MenuItem>Metal</MenuItem>\n                <MenuItem>Punk</MenuItem>\n                <MenuItem>Grunge</MenuItem>\n                <MenuItem>Alternative</MenuItem>\n                <MenuItem>Indie</MenuItem>\n                <MenuItem>Electronic</MenuItem>\n              </MenuSubPopup>\n            </MenuSub>\n            <MenuItem>Pop</MenuItem>\n          </MenuSubPopup>\n        </MenuSub>\n        <MenuSeparator />\n        <MenuGroup>\n          <MenuGroupLabel>Danger zone</MenuGroupLabel>\n          <MenuItem variant=\"destructive\">\n            <TrashIcon aria-hidden />\n            Delete\n          </MenuItem>\n        </MenuGroup>\n      </MenuPopup>\n    </Menu>\n  );\n}\n",
      "type": "registry:block"
    }
  ],
  "categories": [
    "drawer",
    "menu"
  ],
  "type": "registry:block"
}