Repository: jbetancur/react-data-table-component (ts)

Issue:
Context menu invisible even when rows are selected
## Issue Check list
- [x] Agree to the [Code of Conduct](https://github.com/jbetancur/react-data-table-component/blob/master/CODE-OF-CONDUCT.md)
- [x] Read the README
- [x] You are using React 16.8.0+
- [x] You installed `styled-components`
- [x] Include relevant code or preferably a [code sandbox](https://codesandbox.io/embed/react-data-table-sandbox-ccyuu
)

## Describe the bug
After upgrading to v7 I've noticed that context menu does not show up when selecting rows. Also in storybook the menu also is invisible. I didn't find any api changes documented so I assume it's a regression.

## To Reproduce
Steps to reproduce the behavior:
1. Go to https://react-data-table-component.netlify.app/?path=/docs/getting-started-kitchen-sink--kitchen-sink
2. Select "Selectable rows"
3. Select a row
4. See that context menu is still invisible


Pull request:
fixes broken context menu
fixes #922 

Patch:
diff --git a/package.json b/package.json
index 11a09c2..b81bfa5 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-data-table-component",
-  "version": "7.3.0",
+  "version": "7.3.1",
   "description": "A simple to use declarative react based data table",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",
diff --git a/src/DataTable/styles.ts b/src/DataTable/styles.ts
index 7e0bbdf..f6fc2e9 100644
--- a/src/DataTable/styles.ts
+++ b/src/DataTable/styles.ts
@@ -86,6 +86,9 @@ export const defaultStyles = (theme: Theme): TableStyles => ({
 			transitionTimingFunction: 'cubic-bezier(0, 0, 0.2, 1)',
 			willChange: 'transform',
 		},
+		activeStyle: {
+			transform: 'translate3d(0, 0, 0)',
+		},
 	},
 	cells: {
 		style: {


Test patch:
diff --git a/src/DataTable/__tests__/__snapshots__/DataTable.test.tsx.snap b/src/DataTable/__tests__/__snapshots__/DataTable.test.tsx.snap
index 2097666..2139f2a 100644
--- a/src/DataTable/__tests__/__snapshots__/DataTable.test.tsx.snap
+++ b/src/DataTable/__tests__/__snapshots__/DataTable.test.tsx.snap
@@ -350,6 +350,9 @@ exports[`DataTable::Header should render a custom component within the context m
   -webkit-transition-timing-function: cubic-bezier(0,0,0.2,1);
   transition-timing-function: cubic-bezier(0,0,0.2,1);
   will-change: transform;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
 }
 
 .c0 {
@@ -479,6 +482,9 @@ exports[`DataTable::Header should render context menu actions when they are prov
   -webkit-transition-timing-function: cubic-bezier(0,0,0.2,1);
   transition-timing-function: cubic-bezier(0,0,0.2,1);
   will-change: transform;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
 }
 
 .c0 {
@@ -621,6 +627,9 @@ exports[`DataTable::Header should render correctly when a custom contextMessage
   -webkit-transition-timing-function: cubic-bezier(0,0,0.2,1);
   transition-timing-function: cubic-bezier(0,0,0.2,1);
   will-change: transform;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
 }
 
 .c0 {
@@ -755,6 +764,9 @@ exports[`DataTable::Header should render correctly when a custom contextMessage
   -webkit-transition-timing-function: cubic-bezier(0,0,0.2,1);
   transition-timing-function: cubic-bezier(0,0,0.2,1);
   will-change: transform;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
 }
 
 .c0 {
@@ -1054,6 +1066,9 @@ exports[`DataTable::Header should render the default context menu when using sel
   -webkit-transition-timing-function: cubic-bezier(0,0,0.2,1);
   transition-timing-function: cubic-bezier(0,0,0.2,1);
   will-change: transform;
+  -webkit-transform: translate3d(0,0,0);
+  -ms-transform: translate3d(0,0,0);
+  transform: translate3d(0,0,0);
 }
 
 .c0 {