cosscom__coss/apps/ui/public/r/group-demo.json

{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "group-demo",
  "type": "registry:example",
  "description": "Group example",
  "registryDependencies": ["@coss/group", "@coss/button"],
  "files": [
    {
      "path": "registry/default/examples/group-demo.tsx",
      "content": "import {\n  ArchiveIcon,\n  EditIcon,\n  EllipsisIcon,\n  FilesIcon,\n  FilmIcon,\n  ShareIcon,\n  TrashIcon,\n} from \"lucide-react\"\n\nimport { Button } from \"@/registry/default/ui/button\"\nimport { Group, GroupSeparator } from \"@/registry/default/ui/group\"\nimport {\n  Menu,\n  MenuItem,\n  MenuPopup,\n  MenuTrigger,\n} from \"@/registry/default/ui/menu\"\n\nexport default function GroupDemo() {\n  return (\n    <Group aria-label=\"File actions\">\n      <Button variant=\"outline\">\n        <FilesIcon />\n        Files\n      </Button>\n      <GroupSeparator />\n      <Button variant=\"outline\">\n        <FilmIcon />\n        Media\n      </Button>\n      <GroupSeparator />\n      <Menu>\n        <MenuTrigger\n          render={<Button variant=\"outline\" size=\"icon\" aria-label=\"Menu\" />}\n        >\n          <EllipsisIcon className=\"size-4\" />\n        </MenuTrigger>\n        <MenuPopup align=\"end\">\n          <MenuItem>\n            <EditIcon />\n            Edit\n          </MenuItem>\n          <MenuItem>\n            <ArchiveIcon />\n            Archive\n          </MenuItem>\n          <MenuItem>\n            <ShareIcon />\n            Share\n          </MenuItem>\n          <MenuItem variant=\"destructive\">\n            <TrashIcon />\n            Delete\n          </MenuItem>\n        </MenuPopup>\n      </Menu>\n    </Group>\n  )\n}\n",
      "type": "registry:example"
    }
  ],
  "categories": ["group"]
}