From cccc16964eba2cc2f16fd4cf6e4d352d36a266c2 Mon Sep 17 00:00:00 2001
From: rogerio <rosestolato.rogerio@gmail.com>
Date: Mon, 13 Jan 2025 15:56:06 -0300
Subject: [PATCH] feat: add className prop in drawer

---
 src/components/drawer/drawer.tsx | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/components/drawer/drawer.tsx b/src/components/drawer/drawer.tsx
index d812e49..62f2566 100644
--- a/src/components/drawer/drawer.tsx
+++ b/src/components/drawer/drawer.tsx
@@ -1,3 +1,4 @@
+import { cn } from '@/lib/utils';
 import * as Dialog from '@radix-ui/react-dialog';
 import { TimesIcon } from '@stash-ui/light-icons';
 import * as React from 'react';
@@ -8,14 +9,20 @@ interface DrawerProps extends Dialog.DialogProps {
   prefixIcon?: React.ReactNode;
   hasDivider?: boolean;
   footer?: React.ReactNode;
+  className?: string;
 }
 
-function Drawer({ children, title, description, prefixIcon, hasDivider, footer, ...props }: DrawerProps) {
+function Drawer({ children, className, title, description, prefixIcon, hasDivider, footer, ...props }: DrawerProps) {
   return (
     <Dialog.Root {...props}>
       <Dialog.Portal>
         <Dialog.Overlay className=" z-50 fixed inset-0 bg-[#00000011] w-screen h-screen backdrop-blur-[1px] animate-fade-in" />
-        <Dialog.Content className="z-50 flex flex-col bg-[#FFFFFF] shadow-drawer rounded-xl w-[400px] border border-border-card fixed right-6 top-6 h-[calc(100vh-48px)] data-[state=open]:animate-drawer-slide-in data-[state=closed]:animate-drawer-slide-out">
+        <Dialog.Content
+          className={cn(
+            'z-50 flex flex-col bg-[#FFFFFF] shadow-drawer rounded-xl w-[400px] border border-border-card fixed right-6 top-6 h-[calc(100vh-48px)] data-[state=open]:animate-drawer-slide-in data-[state=closed]:animate-drawer-slide-out',
+            className
+          )}
+        >
           <div className="flex justify-between gap-2 p-6 pb-4">
             <div className="flex gap-2">
               {prefixIcon && <div className="h-fit">{prefixIcon}</div>}