{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "sidebar",
  "dependencies": ["@radix-ui/react-slot"],
  "registryDependencies": ["utils"],
  "files": [
    {
      "path": "registry/ui/sidebar.tsx",
      "content": "'use client';\n\nimport * as React from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { cn } from '@/registry/lib/utils';\n\n/* ---------- Context ---------- */\n\ninterface SidebarContextValue {\n  collapsed: boolean;\n  setCollapsed: (collapsed: boolean) => void;\n}\n\nconst SidebarContext = React.createContext<SidebarContextValue | null>(null);\n\nfunction useSidebar() {\n  const context = React.useContext(SidebarContext);\n  if (!context) {\n    throw new Error('useSidebar must be used within a SidebarProvider');\n  }\n  return context;\n}\n\n/* ---------- Provider ---------- */\n\ninterface SidebarProviderProps {\n  children: React.ReactNode;\n  defaultCollapsed?: boolean;\n}\n\nfunction SidebarProvider({ children, defaultCollapsed = false }: SidebarProviderProps) {\n  const [collapsed, setCollapsed] = React.useState(defaultCollapsed);\n\n  return (\n    <SidebarContext.Provider value={{ collapsed, setCollapsed }}>\n      {children}\n    </SidebarContext.Provider>\n  );\n}\n\n/* ---------- Sidebar ---------- */\n\ninterface SidebarProps extends React.HTMLAttributes<HTMLElement> {\n  children: React.ReactNode;\n}\n\nfunction Sidebar({ className, children, ...props }: SidebarProps) {\n  const { collapsed } = useSidebar();\n\n  return (\n    <aside\n      data-slot=\"sidebar\"\n      data-collapsed={collapsed}\n      className={cn(\n        'flex h-full w-64 shrink-0 flex-col border-r border-line-subtle bg-background',\n        collapsed && 'w-0 overflow-hidden',\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </aside>\n  );\n}\n\n/* ---------- SidebarHeader ---------- */\n\nfunction SidebarHeader({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div\n      data-slot=\"sidebar-header\"\n      className={cn('flex shrink-0 flex-col gap-2 px-3 py-4', className)}\n      {...props}\n    />\n  );\n}\n\n/* ---------- SidebarContent ---------- */\n\nfunction SidebarContent({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div\n      data-slot=\"sidebar-content\"\n      className={cn('flex flex-1 flex-col gap-1 overflow-y-auto px-7 py-5', className)}\n      {...props}\n    />\n  );\n}\n\n/* ---------- SidebarFooter ---------- */\n\nfunction SidebarFooter({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div\n      data-slot=\"sidebar-footer\"\n      className={cn(\n        'flex shrink-0 flex-col gap-2 border-t border-line-subtle px-3 py-4',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\n/* ---------- SidebarGroup ---------- */\n\ninterface SidebarGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: React.ReactNode;\n}\n\nfunction SidebarGroup({ children, className, ...props }: SidebarGroupProps) {\n  return (\n    <div data-slot=\"sidebar-group\" className={cn('flex flex-col', className)} {...props}>\n      {children}\n    </div>\n  );\n}\n\n/* ---------- SidebarGroupLabel ---------- */\n\nfunction SidebarGroupLabel({\n  className,\n  children,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div\n      data-slot=\"sidebar-group-label\"\n      className={cn('py-1.5 text-sm  text-muted', className)}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\n/* ---------- SidebarGroupContent ---------- */\n\nfunction SidebarGroupContent({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div\n      data-slot=\"sidebar-group-content\"\n      className={cn('flex flex-col gap-0.5 py-1', className)}\n      {...props}\n    />\n  );\n}\n\n/* ---------- SidebarItem ---------- */\n\ninterface SidebarItemProps extends React.ComponentPropsWithoutRef<'a'> {\n  asChild?: boolean;\n  active?: boolean;\n}\n\nfunction SidebarItem({ className, asChild = false, active, ...props }: SidebarItemProps) {\n  const Comp = asChild ? Slot : 'a';\n\n  return (\n    <Comp\n      data-slot=\"sidebar-item\"\n      data-active={active}\n      className={cn(\n        'flex items-center gap-2 rounded-md px-2 py-1.5 pl-4 text-sm text-primary not-data-active:hover:bg-hover/60',\n        active && 'bg-active/60',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nexport {\n  SidebarProvider,\n  Sidebar,\n  SidebarHeader,\n  SidebarContent,\n  SidebarFooter,\n  SidebarGroup,\n  SidebarGroupLabel,\n  SidebarGroupContent,\n  SidebarItem,\n  useSidebar,\n};\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}