From cfdb96ca4eb78d1d9a2d35122aee947299bd5961 Mon Sep 17 00:00:00 2001
From: "DESKTOP-UPBOG39\\Admin" <bdurand@ensemblegroup.net>
Date: Sat, 25 Mar 2023 16:42:38 -0500
Subject: [PATCH 1/2] Allow user to customize the hardcoded wrapper.

---
 src/MUIDataTable.js               | 8 ++++++--
 src/components/ReactiveWrapper.js | 5 +++++
 2 files changed, 11 insertions(+), 2 deletions(-)
 create mode 100644 src/components/ReactiveWrapper.js

diff --git a/src/MUIDataTable.js b/src/MUIDataTable.js
index 330bd9ef8..2cb8af908 100644
--- a/src/MUIDataTable.js
+++ b/src/MUIDataTable.js
@@ -11,6 +11,7 @@ import isUndefined from 'lodash.isundefined';
 import merge from 'lodash.merge';
 import PropTypes from 'prop-types';
 import React from 'react';
+import DefaultReactiveWrapper from './components/ReactiveWrapper';
 import DefaultTableBody from './components/TableBody';
 import DefaultTableFilter from './components/TableFilter';
 import DefaultTableFilterList from './components/TableFilterList';
@@ -262,6 +263,7 @@ class MUIDataTable extends React.Component {
     data: [],
     columns: [],
     components: {
+      ReactiveWrapper: DefaultReactiveWrapper,
       TableBody: DefaultTableBody,
       TableFilter: DefaultTableFilter,
       TableFilterList: DefaultTableFilterList,
@@ -1828,6 +1830,7 @@ class MUIDataTable extends React.Component {
       className,
       title,
       components: {
+        ReactiveWrapper,
         TableBody,
         TableFilterList,
         TableFooter,
@@ -1856,6 +1859,7 @@ class MUIDataTable extends React.Component {
       columnOrder,
     } = this.state;
 
+    const ReactiveWrapperComponent = ReactiveWrapper || DefaultReactiveWrapper;
     const TableBodyComponent = TableBody || DefaultTableBody;
     const TableFilterListComponent = TableFilterList || DefaultTableFilterList;
     const TableFooterComponent = TableFooter || DefaultTableFooter;
@@ -1987,7 +1991,7 @@ class MUIDataTable extends React.Component {
           filterUpdate={this.filterUpdate}
           columnNames={columnNames}
         />
-        <div style={{ position: 'relative', ...tableHeightVal }} className={responsiveClass}>
+        <ReactiveWrapperComponent style={{ position: 'relative', ...tableHeightVal }} className={responsiveClass}>
           {(this.options.resizableColumns === true ||
             (this.options.resizableColumns && this.options.resizableColumns.enabled)) && (
             <TableResizeComponent
@@ -2070,7 +2074,7 @@ class MUIDataTable extends React.Component {
 
             return components;
           })()}
-        </div>
+        </ReactiveWrapperComponent>
         <TableFooterComponent
           options={this.options}
           page={page}
diff --git a/src/components/ReactiveWrapper.js b/src/components/ReactiveWrapper.js
new file mode 100644
index 000000000..a94aff657
--- /dev/null
+++ b/src/components/ReactiveWrapper.js
@@ -0,0 +1,5 @@
+
+const fn = (props) => {
+    return (<div {...props} />);
+};
+export default fn;
\ No newline at end of file

From 4793caeb0656363d0ca65ec81a8b598f1903923c Mon Sep 17 00:00:00 2001
From: ensemblebd <bdurand@ensemblegroup.net>
Date: Sat, 25 Mar 2023 16:56:08 -0500
Subject: [PATCH 2/2] Update ReactiveWrapper.js

typo..
---
 src/components/ReactiveWrapper.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/ReactiveWrapper.js b/src/components/ReactiveWrapper.js
index a94aff657..69aec0816 100644
--- a/src/components/ReactiveWrapper.js
+++ b/src/components/ReactiveWrapper.js
@@ -1,5 +1,6 @@
+import React from 'react';
 
 const fn = (props) => {
     return (<div {...props} />);
 };
-export default fn;
\ No newline at end of file
+export default fn;