From 2ee3224e8c49f14f7f0088937dfcceabab68af22 Mon Sep 17 00:00:00 2001
From: Irshad Ahmad <irshad@wpsocio.com>
Date: Fri, 18 Oct 2024 15:04:06 +0530
Subject: [PATCH] Allow classname prop for WpAdminContainer (#182)

---
 .../shared-ui/components/wp-admin-container.tsx  | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/packages/js/shared-ui/components/wp-admin-container.tsx b/packages/js/shared-ui/components/wp-admin-container.tsx
index c03abca5..17854d3b 100644
--- a/packages/js/shared-ui/components/wp-admin-container.tsx
+++ b/packages/js/shared-ui/components/wp-admin-container.tsx
@@ -1,9 +1,16 @@
+import { cn } from '@wpsocio/ui-components';
+
 export type WpAdminContainerProps = {
 	children?: React.ReactNode;
 	sidebar: React.ReactNode;
+	wrapperClassName?: string;
 };
 
-export function WpAdminContainer({ children, sidebar }: WpAdminContainerProps) {
+export function WpAdminContainer({
+	children,
+	sidebar,
+	wrapperClassName,
+}: WpAdminContainerProps) {
 	return (
 		<>
 			<style>
@@ -11,7 +18,12 @@ export function WpAdminContainer({ children, sidebar }: WpAdminContainerProps) {
 					'#wpcontent { padding-left: 0 !important; padding-right: 0 !important; }'
 				}
 			</style>
-			<div className="flex flex-col md:flex-row gap-4 p-3 sm:p-6">
+			<div
+				className={cn(
+					'flex flex-col md:flex-row gap-4 p-3 sm:p-6',
+					wrapperClassName,
+				)}
+			>
 				<div className="md:basis-2/3 xl:basis-3/4 shrink-0">{children}</div>
 				<div className="md:basis-1/3 xl:basis-1/4">{sidebar}</div>
 			</div>