New Changes with table Classes and Modification

src/components/Table.astro

@@ -13,6 +13,7 @@ const {
     fetchData,
     columnsRendererKey,
     classInfos = "",
+    wrapperClassNames = "",
     tableClassNames = "",
     hideHeader = false,
     rowClick = "",
@@ -37,7 +38,10 @@ const id = `table-${Math.random().toString(36).slice(2, 9)}`;
 
     <!-- 🖥️ Desktop Table -->
     <div
-        class="wr:overflow-x-auto wr:rounded-xl wr:border wr:border-gray-300 wr:dark:border-neutral-700 wr:hidden wr:md:block"
+        class={cn(
+            "wr:overflow-x-auto wr:rounded-xl wr:border wr:border-gray-300 wr:dark:border-neutral-700 wr:hidden wr:md:block",
+            wrapperClassNames,
+        )}
     >
         <table
             class={cn(

src/types/table/types.ts

@@ -32,6 +32,7 @@ export interface TableProps<T> {
     pageSize?: number
     columnsRendererKey?: string
     classInfos?: string;
+    wrapperClassNames?: string;
     tableClassNames?: string;
     hideHeader?: boolean;
     rowClick?: string;