Merge pull request #43 from babylonlabs-io/fix-dackdrop

fix: add className prop to backdrop
babylonlabs-io · Nov 25, 2024 · 3d49b6b · 3d49b6b
2 parents 138946e + eaa9f75
commit 3d49b6b
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/.changeset/thin-spies-thank.md b/.changeset/thin-spies-thank.md
@@ -0,0 +1,5 @@
+---
+"@babylonlabs-io/bbn-core-ui": patch
+---
+
+add className prop to backdrop
diff --git a/src/components/Dialog/Dialog.tsx b/src/components/Dialog/Dialog.tsx
@@ -9,6 +9,7 @@ export interface DialogProps extends DetailedHTMLProps<HTMLAttributes<HTMLDivEle
   open?: boolean;
   onClose?: () => void;
   hasBackdrop?: boolean;
+  backdropClassName?: string;
 }
 
 export const Dialog = ({
@@ -17,6 +18,7 @@ export const Dialog = ({
   className,
   onClose,
   hasBackdrop = true,
+  backdropClassName,
   ...restProps
 }: DialogProps) => {
   const { mounted, unmount } = useModalManager({ open });
@@ -32,7 +34,7 @@ export const Dialog = ({
         </div>
       </div>
 
-      {hasBackdrop && <Backdrop open={open} onClick={onClose} />}
+      {hasBackdrop && <Backdrop className={backdropClassName} open={open} onClick={onClose} />}
     </Portal>
   );
 };