{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "p-toolbar-1",
  "description": "Toolbar with toggles, buttons, and select",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "@coss/button",
    "@coss/select",
    "@coss/toggle-group",
    "@coss/toolbar",
    "@coss/tooltip"
  ],
  "files": [
    {
      "path": "registry/default/particles/p-toolbar-1.tsx",
      "content": "\"use client\";\n\nimport {\n  AlignCenterIcon,\n  AlignLeftIcon,\n  AlignRightIcon,\n  DollarSignIcon,\n  PercentIcon,\n} from \"lucide-react\";\nimport { Button } from \"@/registry/default/ui/button\";\nimport {\n  Select,\n  SelectItem,\n  SelectPopup,\n  SelectTrigger,\n  SelectValue,\n} from \"@/registry/default/ui/select\";\nimport {\n  ToggleGroup,\n  ToggleGroupItem,\n} from \"@/registry/default/ui/toggle-group\";\nimport {\n  Toolbar,\n  ToolbarButton,\n  ToolbarGroup,\n  ToolbarSeparator,\n} from \"@/registry/default/ui/toolbar\";\nimport {\n  Tooltip,\n  TooltipPopup,\n  TooltipProvider,\n  TooltipTrigger,\n} from \"@/registry/default/ui/tooltip\";\n\nconst items = [\n  { label: \"Helvetica\", value: \"helvetica\" },\n  { label: \"Arial\", value: \"arial\" },\n  { label: \"Times New Roman\", value: \"times-new-roman\" },\n];\n\nexport default function Particle() {\n  return (\n    <TooltipProvider>\n      <Toolbar>\n        <ToggleGroup className=\"border-none p-0\" defaultValue={[\"left\"]}>\n          <Tooltip>\n            <TooltipTrigger\n              render={\n                <ToolbarButton\n                  aria-label=\"Align left\"\n                  render={<ToggleGroupItem value=\"left\" />}\n                >\n                  <AlignLeftIcon />\n                </ToolbarButton>\n              }\n            />\n            <TooltipPopup sideOffset={8}>Align left</TooltipPopup>\n          </Tooltip>\n          <Tooltip>\n            <TooltipTrigger\n              render={\n                <ToolbarButton\n                  aria-label=\"Align center\"\n                  render={\n                    <ToggleGroupItem\n                      aria-label=\"Toggle center\"\n                      value=\"center\"\n                    />\n                  }\n                >\n                  <AlignCenterIcon />\n                </ToolbarButton>\n              }\n            />\n            <TooltipPopup sideOffset={8}>Align center</TooltipPopup>\n          </Tooltip>\n          <Tooltip>\n            <TooltipTrigger\n              render={\n                <ToolbarButton\n                  aria-label=\"Align right\"\n                  render={\n                    <ToggleGroupItem aria-label=\"Toggle right\" value=\"right\" />\n                  }\n                >\n                  <AlignRightIcon />\n                </ToolbarButton>\n              }\n            />\n            <TooltipPopup sideOffset={8}>Align right</TooltipPopup>\n          </Tooltip>\n        </ToggleGroup>\n        <ToolbarSeparator />\n        <ToolbarGroup>\n          <Tooltip>\n            <TooltipTrigger\n              render={\n                <ToolbarButton\n                  aria-label=\"Format as currency\"\n                  render={<Button size=\"icon\" variant=\"ghost\" />}\n                >\n                  <DollarSignIcon />\n                </ToolbarButton>\n              }\n            />\n            <TooltipPopup sideOffset={8}>Format as currency</TooltipPopup>\n          </Tooltip>\n          <Tooltip>\n            <TooltipTrigger\n              render={\n                <ToolbarButton\n                  aria-label=\"Format as percent\"\n                  render={<Button size=\"icon\" variant=\"ghost\" />}\n                >\n                  <PercentIcon />\n                </ToolbarButton>\n              }\n            />\n            <TooltipPopup sideOffset={8}>Format as percent</TooltipPopup>\n          </Tooltip>\n        </ToolbarGroup>\n        <ToolbarSeparator />\n        <ToolbarGroup>\n          <Select defaultValue=\"helvetica\" items={items}>\n            <Tooltip>\n              <TooltipTrigger\n                render={\n                  <ToolbarButton\n                    render={\n                      <SelectTrigger>\n                        <SelectValue />\n                      </SelectTrigger>\n                    }\n                  />\n                }\n              />\n              <TooltipPopup sideOffset={8}>\n                Select a different font\n              </TooltipPopup>\n            </Tooltip>\n            <SelectPopup>\n              {items.map(({ label, value }) => (\n                <SelectItem key={value} value={value}>\n                  {label}\n                </SelectItem>\n              ))}\n            </SelectPopup>\n          </Select>\n        </ToolbarGroup>\n        <ToolbarSeparator />\n        <ToolbarGroup>\n          <ToolbarButton render={<Button />}>Save</ToolbarButton>\n        </ToolbarGroup>\n      </Toolbar>\n    </TooltipProvider>\n  );\n}\n",
      "type": "registry:block"
    }
  ],
  "categories": [
    "toolbar"
  ],
  "type": "registry:block"
}