{
	"$schema": "https://ui.shadcn.com/schema/registry-item.json",
	"name": "drawer",
	"type": "registry:ui",
	"title": "Drawer",
	"description": "A drawer component.",
	"dependencies": ["vaul"],
	"files": [
		{
			"path": "registry/niv/ui/drawer.tsx",
			"content": "'use client';\n\nimport { Drawer as DrawerPrimitive } from 'vaul';\nimport { cn } from '@/lib/classnames';\nimport type { ComponentProps } from 'react';\n\nfunction DrawerRoot({ ...props }: ComponentProps<typeof DrawerPrimitive.Root>) {\n  return <DrawerPrimitive.Root data-slot='drawer' {...props} />;\n}\n\nfunction DrawerTrigger({\n  ...props\n}: ComponentProps<typeof DrawerPrimitive.Trigger>) {\n  return <DrawerPrimitive.Trigger data-slot='drawer-trigger' {...props} />;\n}\n\nfunction DrawerPortal({\n  ...props\n}: ComponentProps<typeof DrawerPrimitive.Portal>) {\n  return <DrawerPrimitive.Portal data-slot='drawer-portal' {...props} />;\n}\n\nfunction DrawerClose({\n  ...props\n}: ComponentProps<typeof DrawerPrimitive.Close>) {\n  return <DrawerPrimitive.Close data-slot='drawer-close' {...props} />;\n}\n\nfunction DrawerOverlay({\n  className,\n  ...props\n}: ComponentProps<typeof DrawerPrimitive.Overlay>) {\n  return (\n    <DrawerPrimitive.Overlay\n      className={cn(\n        'data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=open]:animate-in',\n        className,\n      )}\n      data-slot='drawer-overlay'\n      {...props}\n    />\n  );\n}\n\nfunction DrawerContent({\n  className,\n  children,\n  ...props\n}: ComponentProps<typeof DrawerPrimitive.Content>) {\n  return (\n    <DrawerPortal data-slot='drawer-portal'>\n      <DrawerOverlay />\n      <DrawerPrimitive.Content\n        className={cn(\n          'group/drawer-content fixed z-50 flex h-auto flex-col bg-background',\n          'data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b',\n          'data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t',\n          'data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm',\n          'data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm',\n          className,\n        )}\n        data-slot='drawer-content'\n        {...props}\n      >\n        <div className='mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full bg-muted group-data-[vaul-drawer-direction=bottom]/drawer-content:block' />\n        {children}\n      </DrawerPrimitive.Content>\n    </DrawerPortal>\n  );\n}\n\nfunction DrawerHeader({ className, ...props }: ComponentProps<'div'>) {\n  return (\n    <div\n      className={cn(\n        'flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-1.5 md:text-left',\n        className,\n      )}\n      data-slot='drawer-header'\n      {...props}\n    />\n  );\n}\n\nfunction DrawerFooter({ className, ...props }: ComponentProps<'div'>) {\n  return (\n    <div\n      className={cn('mt-auto flex flex-col gap-2 p-4', className)}\n      data-slot='drawer-footer'\n      {...props}\n    />\n  );\n}\n\nfunction DrawerTitle({\n  className,\n  ...props\n}: ComponentProps<typeof DrawerPrimitive.Title>) {\n  return (\n    <DrawerPrimitive.Title\n      className={cn('font-semibold text-foreground', className)}\n      data-slot='drawer-title'\n      {...props}\n    />\n  );\n}\n\nfunction DrawerDescription({\n  className,\n  ...props\n}: ComponentProps<typeof DrawerPrimitive.Description>) {\n  return (\n    <DrawerPrimitive.Description\n      className={cn('text-muted-foreground text-sm', className)}\n      data-slot='drawer-description'\n      {...props}\n    />\n  );\n}\n\nconst Drawer = Object.assign(DrawerRoot, {\n  Portal: DrawerPortal,\n  Overlay: DrawerOverlay,\n  Trigger: DrawerTrigger,\n  Close: DrawerClose,\n  Content: DrawerContent,\n  Header: DrawerHeader,\n  Footer: DrawerFooter,\n  Title: DrawerTitle,\n  Description: DrawerDescription,\n});\n\nexport { Drawer };\n",
			"type": "registry:ui"
		}
	]
}