{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "toolbar",
  "title": "Toolbar",
  "description": "A container for grouping a set of controls, such as buttons, toggle groups, or links, built on the Base UI Toolbar primitive.",
  "dependencies": [
    "@base-ui/react@^1.7.0",
    "cn@^0.5.2"
  ],
  "registryDependencies": [
    "https://sevenui.dev/r/sevenui-tokens.json"
  ],
  "files": [
    {
      "path": "registry/base/ui/toolbar.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\nimport { Toolbar as ToolbarPrimitive } from \"@base-ui/react/toolbar\";\n\nimport { cn } from \"cn\";\n\nfunction Toolbar({\n  className,\n  ...props\n}: React.ComponentProps<typeof ToolbarPrimitive.Root>) {\n  return (\n    <ToolbarPrimitive.Root\n      className={cn(\n        \"flex w-fit items-center gap-[var(--control-gap,0.5rem)] rounded-lg border bg-background p-0.5 data-[orientation=vertical]:flex-col\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ToolbarButton({\n  className,\n  ...props\n}: React.ComponentProps<typeof ToolbarPrimitive.Button>) {\n  return (\n    <ToolbarPrimitive.Button\n      className={cn(\n        \"inline-flex h-[calc(var(--control-h,2.125rem)-4px)] min-w-[calc(var(--control-h,2.125rem)-4px)] items-center justify-center gap-[var(--control-gap,0.5rem)] rounded-[max(0px,calc(--theme(--radius-lg)-2px))] px-[calc(var(--control-px,0.75rem)-0.25rem)] text-[length:var(--control-text,0.8125rem)] font-medium whitespace-nowrap outline-none hover:bg-accent hover:text-accent-foreground focus-visible:ring-2 focus-visible:ring-ring/50 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[pressed]:bg-accent data-[pressed]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ToolbarLink({\n  className,\n  ...props\n}: React.ComponentProps<typeof ToolbarPrimitive.Link>) {\n  return (\n    <ToolbarPrimitive.Link\n      className={cn(\n        \"inline-flex h-[calc(var(--control-h,2.125rem)-4px)] items-center rounded-[max(0px,calc(--theme(--radius-lg)-2px))] px-[calc(var(--control-px,0.75rem)-0.25rem)] text-[length:var(--control-text,0.8125rem)] text-muted-foreground outline-none hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring/50\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ToolbarInput({\n  className,\n  ...props\n}: React.ComponentProps<typeof ToolbarPrimitive.Input>) {\n  return (\n    <ToolbarPrimitive.Input\n      className={cn(\n        \"h-[calc(var(--control-h,2.125rem)-4px)] rounded-[max(0px,calc(--theme(--radius-lg)-2px))] border border-input bg-transparent px-[calc(var(--control-px,0.75rem)-0.25rem)] text-[length:var(--control-text,0.8125rem)] outline-none placeholder:text-muted-foreground focus-visible:ring-2 focus-visible:ring-ring/50 data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ToolbarGroup({\n  className,\n  ...props\n}: React.ComponentProps<typeof ToolbarPrimitive.Group>) {\n  return (\n    <ToolbarPrimitive.Group\n      className={cn(\"flex items-center gap-0.5\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction ToolbarSeparator({\n  className,\n  ...props\n}: React.ComponentProps<typeof ToolbarPrimitive.Separator>) {\n  return (\n    <ToolbarPrimitive.Separator\n      className={cn(\n        \"shrink-0 bg-border data-[orientation=vertical]:mx-0.5 data-[orientation=vertical]:h-4 data-[orientation=vertical]:w-px data-[orientation=horizontal]:my-0.5 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Toolbar,\n  ToolbarButton,\n  ToolbarLink,\n  ToolbarInput,\n  ToolbarGroup,\n  ToolbarSeparator,\n};\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}