feat: add table components (TableBody, TableCell, TableContainer, TableHead, TableRow)

Signed-off-by: amitamrutiya <amitamrutiya2210@gmail.com>

Author: amitamrutiya

src/base/TableBody/TableBody.tsx

@@ -0,0 +1,8 @@
+import { TableBody as MuiTableBody, TableBodyProps as MuiTableBodyProps } from '@mui/material';
+import React from 'react';
+
+export const TableBody = React.forwardRef<HTMLTableSectionElement, MuiTableBodyProps>(
+  (props, ref) => <MuiTableBody {...props} ref={ref} />
+);
+
+export default TableBody;

src/base/TableBody/index.tsx

@@ -0,0 +1 @@
+export { TableBody } from './TableBody';

src/base/TableCell/TableCell.tsx

@@ -0,0 +1,8 @@
+import { TableCell as MuiTableCell, TableCellProps as MuiTableCellProps } from '@mui/material';
+import React from 'react';
+
+export const TableCell = React.forwardRef<HTMLTableCellElement, MuiTableCellProps>((props, ref) => {
+  return <MuiTableCell {...props} ref={ref} />;
+});
+
+export default TableCell;

src/base/TableCell/index.ts

@@ -0,0 +1 @@
+export { TableCell } from './TableCell';

src/base/TableContainer/TableContainer.tsx

@@ -0,0 +1,13 @@
+import {
+  TableContainer as MuiTableContainer,
+  TableContainerProps as MuiTableContainerProps
+} from '@mui/material';
+import React from 'react';
+
+export const TableContainer = React.forwardRef<HTMLDivElement, MuiTableContainerProps>(
+  (props, ref) => {
+    return <MuiTableContainer {...props} ref={ref} />;
+  }
+);
+
+export default TableContainer;

src/base/TableContainer/index.ts

@@ -0,0 +1 @@
+export { TableContainer } from './TableContainer';

src/base/TableHead/TableHead.tsx

@@ -0,0 +1,10 @@
+import { TableHead as MuiTableHead, TableHeadProps as MuiTableHeadProps } from '@mui/material';
+import React from 'react';
+
+export const TableHead = React.forwardRef<HTMLTableSectionElement, MuiTableHeadProps>(
+  function TableHead(props: MuiTableHeadProps, ref) {
+    return <MuiTableHead ref={ref} {...props} />;
+  }
+);
+
+export default TableHead;

src/base/TableHead/index.ts

@@ -0,0 +1 @@
+export { TableHead } from './TableHead';

src/base/TableRow/TableRow.tsx

@@ -0,0 +1,8 @@
+import { TableRow as MuiTableRow, TableRowProps as MuiTableRowProps } from '@mui/material';
+import React from 'react';
+
+export const TableRow = React.forwardRef<HTMLTableRowElement, MuiTableRowProps>((props, ref) => {
+  return <MuiTableRow ref={ref} {...props} />;
+});
+
+export default TableRow;

src/base/TableRow/index.tsx

@@ -0,0 +1 @@
+export { TableRow } from './TableRow';