"use client"; import { forwardRef } from "react"; import { Drawer as DrawerPrimitive } from "vaul"; import { cn } from "@/lib/utils"; export const Drawer = DrawerPrimitive.Root; export const DrawerTrigger = DrawerPrimitive.Trigger; export const DrawerPortal = DrawerPrimitive.Portal; export const DrawerClose = DrawerPrimitive.Close; export const DrawerHandle = DrawerPrimitive.Handle; export const DrawerOverlay = forwardRef< HTMLDivElement, React.ComponentPropsWithoutRef >(({ className, ...props }, ref) => ( )); DrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName; export const DrawerContent = forwardRef< HTMLDivElement, React.ComponentPropsWithoutRef >(({ className, children, ...props }, ref) => ( {children} )); DrawerContent.displayName = "DrawerContent"; export const DrawerHeader = ({ className, ...props }: React.HTMLAttributes) => (

); DrawerHeader.displayName = "DrawerHeader"; export const DrawerFooter = ({ className, ...props }: React.HTMLAttributes) => (

); DrawerFooter.displayName = "DrawerFooter"; export const DrawerTitle = forwardRef< HTMLHeadingElement, React.ComponentPropsWithoutRef >(({ className, ...props }, ref) => ( )); DrawerTitle.displayName = DrawerPrimitive.Title.displayName; export const DrawerDescription = forwardRef< HTMLParagraphElement, React.ComponentPropsWithoutRef >(({ className, ...props }, ref) => ( )); DrawerDescription.displayName = DrawerPrimitive.Description.displayName;

Drawer

Installation

Usage

API Reference