bug: fixes double style in table (#182)

antstackio · Oct 13, 2023 · d8f281f · d8f281f
1 parent 27a076a
commit d8f281f
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 3 deletions.
diff --git a/docs/docs/components/table.mdx b/docs/docs/components/table.mdx
@@ -290,6 +290,8 @@ import {
 | horizontalSpacing           |               `string`                |      `0`      |        Yes |
 | overrideTableClass          |               `string`                |       -       |        Yes |
 | overrideTableContainerClass |               `string`                |       -       |        Yes |
+| wrapperStyle                |          `CSS Style Object`           |       -       |        Yes |
+| wrapperClassName            |               `string`                |       -       |        Yes |
 
 The table component renders a `div` that wraps the table to not allow the table to overflow the parent, this can be customized by sending a class to `overrideTableContainerClass`
 

diff --git a/packages/react/src/components/Table/Table.tsx b/packages/react/src/components/Table/Table.tsx
@@ -27,6 +27,8 @@ const Table: ForwardRefRenderFunction<HTMLTableElement, InitialTableProps> = (
     children,
     className,
     style,
+    wrapperStyle,
+    wrapperClassName,
     horizontalSpacing = "0",
     ...nativeProps
   },
@@ -50,9 +52,9 @@ const Table: ForwardRefRenderFunction<HTMLTableElement, InitialTableProps> = (
 
   return (
     <div
-      style={{ ...tableContainerInlineVars, ...(style || {}) }}
+      style={{ ...tableContainerInlineVars, ...(wrapperStyle || {}) }}
       className={`${tableContainerDefaults} ${tableContainerThemeClass} ${overrideTableContainerClass} ${
-        className || ""
+        wrapperClassName || ""
       }`}
     >
       <table

diff --git a/packages/react/src/components/Table/Table.types.ts b/packages/react/src/components/Table/Table.types.ts
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { CSSProperties } from "react";
 
 export interface InitialTableProps
   extends React.DetailedHTMLProps<
@@ -19,6 +19,8 @@ export interface InitialTableProps
   overrideTableClass?: string;
   className?: string;
   horizontalSpacing?: string;
+  wrapperStyle?: CSSProperties;
+  wrapperClassName?: string;
 }
 
 export type ITableThemeVars = [