Use clsx (like Material-UI v4) instead of classnames for smaller builds

techniq · Jun 21, 2019 · 9b28005 · 9b28005
1 parent a762350
commit 9b28005
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 8 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -16,7 +16,7 @@
     "react": ">=16.8.1"
   },
   "dependencies": {
-    "classnames": "^2.2.6",
+    "clsx": "^1.0.4",
     "deepmerge": "^3.3.0",
     "prop-types": "^15.7.2"
   },

diff --git a/src/index.js b/src/index.js
@@ -1,6 +1,6 @@
-import React, { Component, useState } from 'react';
+import React, { useState } from 'react';
 import PropTypes from 'prop-types';
-import classNames from 'classnames';
+import clsx from 'clsx';
 
 import { makeStyles } from '@material-ui/core/styles';
 import Table from '@material-ui/core/Table';
@@ -109,7 +109,7 @@ function MuiTable(props) {
                         isCellSelected &&
                         isCellSelected({ column, rowData: {} });
 
-                      const className = classNames({
+                      const className = clsx({
                         [classes.cellHovered]: isHovered,
                         [classes.cellSelected]: isSelected
                       });
@@ -230,7 +230,7 @@ function MuiTable(props) {
                       const isSelected =
                         isCellSelected && isCellSelected({ column, rowData });
 
-                      const className = classNames({
+                      const className = clsx({
                         [classes.cellHovered]: isHovered,
                         [classes.cellSelected]: isSelected
                       });