From f8031caa2fe608bfb5e1a640c39aed2568c7fa52 Mon Sep 17 00:00:00 2001
From: Yangshun Tay <tay.yang.shun@gmail.com>
Date: Mon, 10 Oct 2022 15:38:38 +0800
Subject: [PATCH] [ui][slide out] add className prop

---
 packages/ui/src/SlideOut/SlideOut.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/packages/ui/src/SlideOut/SlideOut.tsx b/packages/ui/src/SlideOut/SlideOut.tsx
index 98c6d094..065c60dc 100644
--- a/packages/ui/src/SlideOut/SlideOut.tsx
+++ b/packages/ui/src/SlideOut/SlideOut.tsx
@@ -8,6 +8,7 @@ export type SlideOutEnterFrom = 'end' | 'start';
 
 type Props = Readonly<{
   children: React.ReactNode;
+  className: string;
   enterFrom?: SlideOutEnterFrom;
   isShown?: boolean;
   onClose?: () => void;
@@ -40,6 +41,7 @@ const enterFromClasses: Record<
 
 export default function SlideOut({
   children,
+  className,
   enterFrom = 'end',
   isShown = false,
   size,
@@ -50,7 +52,10 @@ export default function SlideOut({
 
   return (
     <Transition.Root as={Fragment} show={isShown}>
-      <Dialog as="div" className="relative z-40" onClose={() => onClose?.()}>
+      <Dialog
+        as="div"
+        className={clsx('relative z-40', className)}
+        onClose={() => onClose?.()}>
         <Transition.Child
           as={Fragment}
           enter="transition-opacity ease-linear duration-300"