@toptal/picasso-table 1.1.21 → 2.0.1

package/dist-package/src/Table/Table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../src/Table/Table.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAA;AAC3D,OAAO,KAA8B,MAAM,OAAO,CAAA;AAIlD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAKvD,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,mBAAmB,CAAC,gBAAgB,CAAC;IACvC,uEAAuE;IACvE,QAAQ,EAAE,SAAS,CAAA;IACnB,oBAAoB;IACpB,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAA;IAC1C,yBAAyB;IACzB,OAAO,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,SAAS,CAAA;CAC3C;AAOD,eAAO,MAAM,KAAK,gFA6BhB,CAAA;AASF,eAAe,KAAK,CAAA"}
+{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../src/Table/Table.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAA;AAC3D,OAAO,KAA8B,MAAM,OAAO,CAAA;AAClD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAKvD,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,mBAAmB,CAAC,gBAAgB,CAAC;IACvC,uEAAuE;IACvE,QAAQ,EAAE,SAAS,CAAA;IACnB,oBAAoB;IACpB,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAA;IAC1C,yBAAyB;IACzB,OAAO,CAAC,EAAE,OAAO,GAAG,UAAU,GAAG,SAAS,CAAA;CAC3C;AAGD,eAAO,MAAM,KAAK,gFA8BhB,CAAA;AASF,eAAe,KAAK,CAAA"}

package/dist-package/src/Table/Table.js

@@ -10,20 +10,14 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import React, { forwardRef, useMemo } from 'react';
-import { makeStyles } from '@material-ui/core/styles';
-import { Table as MUITable } from '@material-ui/core';
+import { twMerge } from '@toptal/picasso-tailwind-merge';
 import TableContext from './TableContext';
-import styles from './styles';
-const useStyles = makeStyles(styles, {
-    name: 'Table',
-});
 // eslint-disable-next-line react/display-name
 export const Table = forwardRef(function Table(props, ref) {
     const { className, style, children, spacing = 'regular', variant = 'bordered' } = props, rest = __rest(props, ["className", "style", "children", "spacing", "variant"]);
-    const classes = useStyles();
     const tableConfig = useMemo(() => ({ spacing, variant }), [spacing, variant]);
     return (React.createElement(TableContext.Provider, { value: tableConfig },
-        React.createElement(MUITable, Object.assign({}, rest, { ref: ref, classes: classes, className: className, style: style }), children)));
+        React.createElement("table", Object.assign({}, rest, { ref: ref, className: twMerge('w-full border-collapse border-spacing-0', className), style: style }), children)));
 });
 Table.defaultProps = {
     spacing: 'regular',

package/dist-package/src/Table/Table.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.js","sourceRoot":"","sources":["../../../src/Table/Table.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAElD,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AACrD,OAAO,EAAE,KAAK,IAAI,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAGrD,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,MAAM,MAAM,UAAU,CAAA;AAa7B,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,OAAO;CACd,CAAC,CAAA;AAEF,8CAA8C;AAC9C,MAAM,CAAC,MAAM,KAAK,GAAG,UAAU,CAA0B,SAAS,KAAK,CACrE,KAAK,EACL,GAAG;IAEH,MAAM,EACJ,SAAS,EACT,KAAK,EACL,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,OAAO,GAAG,UAAU,KAElB,KAAK,EADJ,IAAI,UACL,KAAK,EAPH,wDAOL,CAAQ,CAAA;IACT,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,MAAM,WAAW,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAA;IAE7E,OAAO,CACL,oBAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,WAAW;QACvC,oBAAC,QAAQ,oBACH,IAAI,IACR,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,KAEX,QAAQ,CACA,CACW,CACzB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,KAAK,CAAC,YAAY,GAAG;IACnB,OAAO,EAAE,SAAS;IAClB,OAAO,EAAE,UAAU;CACpB,CAAA;AAED,KAAK,CAAC,WAAW,GAAG,OAAO,CAAA;AAE3B,eAAe,KAAK,CAAA"}
+{"version":3,"file":"Table.js","sourceRoot":"","sources":["../../../src/Table/Table.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAElD,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAA;AAExD,OAAO,YAAY,MAAM,gBAAgB,CAAA;AAazC,8CAA8C;AAC9C,MAAM,CAAC,MAAM,KAAK,GAAG,UAAU,CAA0B,SAAS,KAAK,CACrE,KAAK,EACL,GAAG;IAEH,MAAM,EACJ,SAAS,EACT,KAAK,EACL,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,OAAO,GAAG,UAAU,KAElB,KAAK,EADJ,IAAI,UACL,KAAK,EAPH,wDAOL,CAAQ,CAAA;IAET,MAAM,WAAW,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAA;IAE7E,OAAO,CACL,oBAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,WAAW;QACvC,+CACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,CAChB,yCAAyC,EACzC,SAAS,CACV,EACD,KAAK,EAAE,KAAK,KAEX,QAAQ,CACH,CACc,CACzB,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,KAAK,CAAC,YAAY,GAAG;IACnB,OAAO,EAAE,SAAS;IAClB,OAAO,EAAE,UAAU;CACpB,CAAA;AAED,KAAK,CAAC,WAAW,GAAG,OAAO,CAAA;AAE3B,eAAe,KAAK,CAAA"}

package/dist-package/src/TableBody/TableBody.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableBody.d.ts","sourceRoot":"","sources":["../../../src/TableBody/TableBody.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,KAAiC,MAAM,OAAO,CAAA;AAIrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAKvD,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,cAAc,CAAC,uBAAuB,CAAC;IACzC,yDAAyD;IACzD,QAAQ,EAAE,SAAS,CAAA;CACpB;AAqBD,eAAO,MAAM,SAAS,uFAoBrB,CAAA;AAMD,eAAe,SAAS,CAAA"}
+{"version":3,"file":"TableBody.d.ts","sourceRoot":"","sources":["../../../src/TableBody/TableBody.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,KAAiC,MAAM,OAAO,CAAA;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAIvD,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,cAAc,CAAC,uBAAuB,CAAC;IACzC,yDAAyD;IACzD,QAAQ,EAAE,SAAS,CAAA;CACpB;AAmBD,eAAO,MAAM,SAAS,uFAarB,CAAA;AAMD,eAAe,SAAS,CAAA"}

package/dist-package/src/TableBody/TableBody.js

@@ -10,9 +10,6 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import React, { forwardRef, useContext } from 'react';
-import { makeStyles } from '@material-ui/core/styles';
-import { TableBody as MUITableBody } from '@material-ui/core';
-import styles from './styles';
 import { TableSectionContext, TableSection, TableContext } from '../Table';
 const stripeRows = (children) => {
     let stripeIndex = -1;
@@ -27,13 +24,11 @@ const stripeRows = (children) => {
         return child;
     });
 };
-const useStyles = makeStyles(styles, { name: 'PicassoTableBody' });
 export const TableBody = forwardRef(function TableBody(props, ref) {
     const { className, style, children } = props, rest = __rest(props, ["className", "style", "children"]);
-    const classes = useStyles();
     const { variant } = useContext(TableContext);
     return (React.createElement(TableSectionContext.Provider, { value: TableSection.BODY },
-        React.createElement(MUITableBody, Object.assign({}, rest, { ref: ref, classes: classes, className: className, style: style }), variant === 'striped' ? stripeRows(children) : children)));
+        React.createElement("tbody", Object.assign({}, rest, { ref: ref, className: className, style: style }), variant === 'striped' ? stripeRows(children) : children)));
 });
 TableBody.defaultProps = {};
 TableBody.displayName = 'TableBody';

package/dist-package/src/TableBody/TableBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableBody.js","sourceRoot":"","sources":["../../../src/TableBody/TableBody.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAErD,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AACrD,OAAO,EAAE,SAAS,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAG7D,OAAO,MAAM,MAAM,UAAU,CAAA;AAC7B,OAAO,EAAE,mBAAmB,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAS1E,MAAM,UAAU,GAAG,CAAC,QAAyB,EAAE,EAAE;IAC/C,IAAI,WAAW,GAAG,CAAC,CAAC,CAAA;IAEpB,OAAO,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE;QAC1C,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE;YAChC,OAAO,KAAK,CAAA;SACb;QAED,WAAW,EAAE,CAAA;QACb,IAAI,WAAW,GAAG,CAAC,KAAK,CAAC,EAAE;YACzB,OAAO,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE,EAAE,UAAU,EAAE,IAAI,EAAQ,CAAC,CAAA;SAC7D;QAED,OAAO,KAAK,CAAA;IACd,CAAC,CAAC,CAAA;AACJ,CAAC,CAAA;AAED,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE,EAAE,IAAI,EAAE,kBAAkB,EAAE,CAAC,CAAA;AAEzE,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CACjC,SAAS,SAAS,CAAC,KAAK,EAAE,GAAG;IAC3B,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,KAAc,KAAK,EAAd,IAAI,UAAK,KAAK,EAA/C,kCAAuC,CAAQ,CAAA;IACrD,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAC3B,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,YAAY,CAAC,CAAA;IAE5C,OAAO,CACL,oBAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,CAAC,IAAI;QACpD,oBAAC,YAAY,oBACP,IAAI,IACR,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,KAEX,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,CAC3C,CACc,CAChC,CAAA;AACH,CAAC,CACF,CAAA;AAED,SAAS,CAAC,YAAY,GAAG,EAAE,CAAA;AAE3B,SAAS,CAAC,WAAW,GAAG,WAAW,CAAA;AAEnC,eAAe,SAAS,CAAA"}
+{"version":3,"file":"TableBody.js","sourceRoot":"","sources":["../../../src/TableBody/TableBody.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAGrD,OAAO,EAAE,mBAAmB,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAS1E,MAAM,UAAU,GAAG,CAAC,QAAyB,EAAE,EAAE;IAC/C,IAAI,WAAW,GAAG,CAAC,CAAC,CAAA;IAEpB,OAAO,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE;QAC1C,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE;YAChC,OAAO,KAAK,CAAA;SACb;QAED,WAAW,EAAE,CAAA;QACb,IAAI,WAAW,GAAG,CAAC,KAAK,CAAC,EAAE;YACzB,OAAO,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE,EAAE,UAAU,EAAE,IAAI,EAAQ,CAAC,CAAA;SAC7D;QAED,OAAO,KAAK,CAAA;IACd,CAAC,CAAC,CAAA;AACJ,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CACjC,SAAS,SAAS,CAAC,KAAK,EAAE,GAAG;IAC3B,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,KAAc,KAAK,EAAd,IAAI,UAAK,KAAK,EAA/C,kCAAuC,CAAQ,CAAA;IACrD,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,YAAY,CAAC,CAAA;IAE5C,OAAO,CACL,oBAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,CAAC,IAAI;QACpD,+CAAW,IAAI,IAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,KAC1D,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,CAClD,CACqB,CAChC,CAAA;AACH,CAAC,CACF,CAAA;AAED,SAAS,CAAC,YAAY,GAAG,EAAE,CAAA;AAE3B,SAAS,CAAC,WAAW,GAAG,WAAW,CAAA;AAEnC,eAAe,SAAS,CAAA"}

package/dist-package/src/TableCell/TableCell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableCell.d.ts","sourceRoot":"","sources":["../../../src/TableCell/TableCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,KAAiC,MAAM,OAAO,CAAA;AAIrD,OAAO,KAAK,EACV,SAAS,EAGT,cAAc,EACf,MAAM,wBAAwB,CAAA;AAS/B,aAAK,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAA;AAEpE,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,cAAc,EACd,cAAc,CAAC,oBAAoB,CAAC;IACtC,mDAAmD;IACnD,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,sDAAsD;IACtD,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,mDAAmD;IACnD,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,SAAS,CAAA;CACtB;AAkCD,eAAO,MAAM,SAAS,oFA0DrB,CAAA;AAQD,eAAe,SAAS,CAAA"}
+{"version":3,"file":"TableCell.d.ts","sourceRoot":"","sources":["../../../src/TableCell/TableCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,KAAiC,MAAM,OAAO,CAAA;AACrD,OAAO,KAAK,EACV,SAAS,EAGT,cAAc,EACf,MAAM,wBAAwB,CAAA;AAO/B,aAAK,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAA;AAEpE,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,cAAc,EACd,cAAc,CAAC,oBAAoB,CAAC;IACtC,mDAAmD;IACnD,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,sDAAsD;IACtD,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,mDAAmD;IACnD,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,SAAS,CAAA;CACtB;AAgCD,eAAO,MAAM,SAAS,oFA+DrB,CAAA;AAQD,eAAe,SAAS,CAAA"}

package/dist-package/src/TableCell/TableCell.js

@@ -10,15 +10,10 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import React, { forwardRef, useContext } from 'react';
-import { makeStyles } from '@material-ui/core/styles';
-import { TableCell as MUITableCell } from '@material-ui/core';
 import { useTitleCase } from '@toptal/picasso-shared';
-import cx from 'classnames';
-import { toTitleCase } from '@toptal/picasso-utils';
 import { Typography } from '@toptal/picasso-typography';
-import styles from './styles';
+import { twMerge } from '@toptal/picasso-tailwind-merge';
 import { TableContext, TableSectionContext, TableSection } from '../Table';
-const useStyles = makeStyles(styles, { name: 'PicassoTableCell' });
 const getTypographySettings = (tableSection) => {
     switch (tableSection) {
         case TableSection.HEAD:
@@ -43,17 +38,18 @@ const getTypographySettings = (tableSection) => {
 };
 export const TableCell = forwardRef(function TableCell(props, ref) {
     const { align, className, style, children, colSpan, rowSpan, titleCase: propsTitleCase, adornment } = props, rest = __rest(props, ["align", "className", "style", "children", "colSpan", "rowSpan", "titleCase", "adornment"]);
-    const _a = useStyles(), { compact: compactClass, narrow: narrowClass } = _a, muiClasses = __rest(_a, ["compact", "narrow"]);
     const { spacing } = useContext(TableContext);
     const tableSection = useContext(TableSectionContext);
     const isHead = tableSection === TableSection.HEAD;
     const titleCase = useTitleCase(propsTitleCase);
-    const renderChildren = () => isHead && titleCase ? toTitleCase(children) : children;
-    const tooltipWithChildren = (React.createElement(Typography, Object.assign({ as: 'div' }, getTypographySettings(tableSection)), renderChildren()));
-    return (React.createElement(MUITableCell, Object.assign({}, rest, { ref: ref, align: align, classes: muiClasses, className: cx(className, {
-            [compactClass]: spacing === 'compact',
-            [narrowClass]: spacing === 'narrow',
-        }), style: style, colSpan: colSpan, rowSpan: rowSpan }), adornment ? (React.createElement("div", { className: 'flex items-center' },
+    const tooltipWithChildren = (React.createElement(Typography, Object.assign({ align: align, as: 'div', titleCase: isHead && titleCase }, getTypographySettings(tableSection)), children));
+    const Component = isHead ? 'th' : 'td';
+    const spacingClasses = {
+        narrow: '',
+        regular: 'px-4',
+        compact: 'h-6 py-[1px] last:pr-3',
+    };
+    return (React.createElement(Component, Object.assign({}, rest, { ref: ref, className: twMerge('h-10 px-2 py-2 border-none last:pr-6', spacingClasses[spacing], isHead && 'text-left', className), style: style, colSpan: colSpan, rowSpan: rowSpan }), adornment ? (React.createElement("div", { className: 'flex items-center' },
         tooltipWithChildren,
         adornment)) : (tooltipWithChildren)));
 });

package/dist-package/src/TableCell/TableCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableCell.js","sourceRoot":"","sources":["../../../src/TableCell/TableCell.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"TableCell.js","sourceRoot":"","sources":["../../../src/TableCell/TableCell.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAOrD,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAA;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAA;AAExD,OAAO,EAAE,YAAY,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAsB1E,MAAM,qBAAqB,GAAG,CAC5B,YAAsC,EAClB,EAAE;IACtB,QAAQ,YAAY,EAAE;QACpB,KAAK,YAAY,CAAC,IAAI;YACpB,OAAO;gBACL,KAAK,EAAE,WAAW;gBAClB,IAAI,EAAE,QAAQ;gBACd,MAAM,EAAE,UAAU;aACnB,CAAA;QACH,KAAK,YAAY,CAAC,MAAM;YACtB,OAAO;gBACL,KAAK,EAAE,OAAO;gBACd,IAAI,EAAE,OAAO;gBACb,MAAM,EAAE,UAAU;aACnB,CAAA;QACH;YACE,OAAO;gBACL,KAAK,EAAE,WAAW;gBAClB,IAAI,EAAE,OAAO;gBACb,MAAM,EAAE,SAAS;aAClB,CAAA;KACJ;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CACjC,SAAS,SAAS,CAAC,KAAK,EAAE,GAAG;IAC3B,MAAM,EACJ,KAAK,EACL,SAAS,EACT,KAAK,EACL,QAAQ,EACR,OAAO,EACP,OAAO,EACP,SAAS,EAAE,cAAc,EACzB,SAAS,KAEP,KAAK,EADJ,IAAI,UACL,KAAK,EAVH,2FAUL,CAAQ,CAAA;IAET,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,YAAY,CAAC,CAAA;IAC5C,MAAM,YAAY,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAA;IACpD,MAAM,MAAM,GAAG,YAAY,KAAK,YAAY,CAAC,IAAI,CAAA;IACjD,MAAM,SAAS,GAAG,YAAY,CAAC,cAAc,CAAC,CAAA;IAE9C,MAAM,mBAAmB,GAAG,CAC1B,oBAAC,UAAU,kBACT,KAAK,EAAE,KAAK,EACZ,EAAE,EAAC,KAAK,EACR,SAAS,EAAE,MAAM,IAAI,SAAS,IAC1B,qBAAqB,CAAC,YAAY,CAAC,GAEtC,QAAQ,CACE,CACd,CAAA;IAED,MAAM,SAAS,GAAG,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA;IAEtC,MAAM,cAAc,GAAG;QACrB,MAAM,EAAE,EAAE;QACV,OAAO,EAAE,MAAM;QACf,OAAO,EAAE,wBAAwB;KAClC,CAAA;IAED,OAAO,CACL,oBAAC,SAAS,oBACJ,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,CAChB,sCAAsC,EACtC,cAAc,CAAC,OAAO,CAAC,EACvB,MAAM,IAAI,WAAW,EACrB,SAAS,CACV,EACD,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,KAEf,SAAS,CAAC,CAAC,CAAC,CACX,6BAAK,SAAS,EAAC,mBAAmB;QAC/B,mBAAmB;QACnB,SAAS,CACN,CACP,CAAC,CAAC,CAAC,CACF,mBAAmB,CACpB,CACS,CACb,CAAA;AACH,CAAC,CACF,CAAA;AAED,SAAS,CAAC,YAAY,GAAG;IACvB,KAAK,EAAE,SAAS;CACjB,CAAA;AAED,SAAS,CAAC,WAAW,GAAG,WAAW,CAAA;AAEnC,eAAe,SAAS,CAAA"}

package/dist-package/src/TableExpandableRow/TableExpandableRow.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode, HTMLAttributes } from 'react';
 import React from 'react';
-import type { BaseProps } from '@toptal/picasso-shared';
+import { type BaseProps } from '@toptal/picasso-shared';
 export interface Props extends BaseProps, HTMLAttributes<HTMLTableRowElement> {
     /** Should be valid `<tr>` children such as `Table.Cell`. */
     children: ReactNode;

package/dist-package/src/TableExpandableRow/TableExpandableRow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableExpandableRow.d.ts","sourceRoot":"","sources":["../../../src/TableExpandableRow/TableExpandableRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,KAAwC,MAAM,OAAO,CAAA;AAK5D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAYvD,MAAM,WAAW,KAAM,SAAQ,SAAS,EAAE,cAAc,CAAC,mBAAmB,CAAC;IAC3E,4DAA4D;IAC5D,QAAQ,EAAE,SAAS,CAAA;IACnB,kDAAkD;IAClD,OAAO,EAAE,SAAS,CAAA;IAClB,wDAAwD;IACxD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+CAA+C;IAC/C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,sFAAsF;IACtF,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B;AAED,eAAO,MAAM,kBAAkB,mFAuD9B,CAAA;AASD,eAAe,kBAAkB,CAAA"}
+{"version":3,"file":"TableExpandableRow.d.ts","sourceRoot":"","sources":["../../../src/TableExpandableRow/TableExpandableRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,KAAwC,MAAM,OAAO,CAAA;AAE5D,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAQvD,MAAM,WAAW,KAAM,SAAQ,SAAS,EAAE,cAAc,CAAC,mBAAmB,CAAC;IAC3E,4DAA4D;IAC5D,QAAQ,EAAE,SAAS,CAAA;IACnB,kDAAkD;IAClD,OAAO,EAAE,SAAS,CAAA;IAClB,wDAAwD;IACxD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+CAA+C;IAC/C,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,sFAAsF;IACtF,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B;AAED,eAAO,MAAM,kBAAkB,mFAuD9B,CAAA;AASD,eAAe,kBAAkB,CAAA"}

package/dist-package/src/TableExpandableRow/TableExpandableRow.js

@@ -10,19 +10,13 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import React, { forwardRef, useRef, useEffect } from 'react';
-import cx from 'classnames';
-import { makeStyles } from '@material-ui/core/styles';
-import { Collapse as MUICollapse } from '@material-ui/core';
+import { Collapse } from '@toptal/picasso-collapse';
+import { twJoin } from '@toptal/picasso-tailwind-merge';
 import { TableRow } from '../TableRow';
 import { TableCell } from '../TableCell';
-import styles from './styles';
 const MAX_COL_SPAN = 100;
-const useStyles = makeStyles(styles, {
-    name: 'PicassoTableExpandableRow',
-});
 export const TableExpandableRow = forwardRef(function TableExpandableRow(props, ref) {
     const { children, content, expanded, defaultExpanded, stripeEven, className, style } = props, rest = __rest(props, ["children", "content", "expanded", "defaultExpanded", "stripeEven", "className", "style"]);
-    const classes = useStyles();
     const wasExpandedOnce = useRef(false);
     const shouldTransition = !defaultExpanded || wasExpandedOnce.current;
     useEffect(() => {
@@ -33,11 +27,9 @@ export const TableExpandableRow = forwardRef(function TableExpandableRow(props,
     const row = (React.createElement(TableRow, Object.assign({}, rest, { ref: ref, className: className, style: style, stripeEven: stripeEven }), children));
     return (React.createElement(React.Fragment, null,
         row,
-        expanded && (React.createElement(TableRow, { className: cx(className, {
-                [classes.stripeEven]: stripeEven,
-            }), style: style },
-            React.createElement(TableCell, { className: classes.noPadding, colSpan: MAX_COL_SPAN },
-                React.createElement(MUICollapse, { appear: shouldTransition, in: true }, content))))));
+        expanded && (React.createElement(TableRow, { className: twJoin(className, stripeEven && 'bg-gray-200 bg-opacity-[32]'), style: style },
+            React.createElement(TableCell, { className: 'p-0 last:pr-0', colSpan: MAX_COL_SPAN },
+                React.createElement(Collapse, { appear: shouldTransition, in: true }, content))))));
 });
 TableExpandableRow.defaultProps = {
     expanded: false,

package/dist-package/src/TableExpandableRow/TableExpandableRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableExpandableRow.js","sourceRoot":"","sources":["../../../src/TableExpandableRow/TableExpandableRow.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAC5D,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AACrD,OAAO,EAAE,QAAQ,IAAI,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAG3D,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxC,OAAO,MAAM,MAAM,UAAU,CAAA;AAE7B,MAAM,YAAY,GAAG,GAAG,CAAA;AAExB,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,2BAA2B;CAClC,CAAC,CAAA;AAeF,MAAM,CAAC,MAAM,kBAAkB,GAAG,UAAU,CAC1C,SAAS,kBAAkB,CAAC,KAAK,EAAE,GAAG;IACpC,MAAM,EACJ,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,eAAe,EACf,UAAU,EACV,SAAS,EACT,KAAK,KAEH,KAAK,EADJ,IAAI,UACL,KAAK,EATH,0FASL,CAAQ,CAAA;IACT,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,MAAM,eAAe,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA;IACrC,MAAM,gBAAgB,GAAG,CAAC,eAAe,IAAI,eAAe,CAAC,OAAO,CAAA;IAEpE,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,eAAe,CAAC,OAAO,IAAI,QAAQ,EAAE;YACxC,eAAe,CAAC,OAAO,GAAG,IAAI,CAAA;SAC/B;IACH,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAA;IAEd,MAAM,GAAG,GAAG,CACV,oBAAC,QAAQ,oBACH,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,UAAU,KAErB,QAAQ,CACA,CACZ,CAAA;IAED,OAAO,CACL;QACG,GAAG;QACH,QAAQ,IAAI,CACX,oBAAC,QAAQ,IACP,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE;gBACvB,CAAC,OAAO,CAAC,UAAU,CAAC,EAAE,UAAU;aACjC,CAAC,EACF,KAAK,EAAE,KAAK;YAEZ,oBAAC,SAAS,IAAC,SAAS,EAAE,OAAO,CAAC,SAAS,EAAE,OAAO,EAAE,YAAY;gBAC5D,oBAAC,WAAW,IAAC,MAAM,EAAE,gBAAgB,EAAE,EAAE,UACtC,OAAO,CACI,CACJ,CACH,CACZ,CACA,CACJ,CAAA;AACH,CAAC,CACF,CAAA;AAED,kBAAkB,CAAC,YAAY,GAAG;IAChC,QAAQ,EAAE,KAAK;IACf,UAAU,EAAE,KAAK;CAClB,CAAA;AAED,kBAAkB,CAAC,WAAW,GAAG,oBAAoB,CAAA;AAErD,eAAe,kBAAkB,CAAA"}
+{"version":3,"file":"TableExpandableRow.js","sourceRoot":"","sources":["../../../src/TableExpandableRow/TableExpandableRow.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAA;AAEnD,OAAO,EAAE,MAAM,EAAE,MAAM,gCAAgC,CAAA;AAEvD,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAExC,MAAM,YAAY,GAAG,GAAG,CAAA;AAexB,MAAM,CAAC,MAAM,kBAAkB,GAAG,UAAU,CAC1C,SAAS,kBAAkB,CAAC,KAAK,EAAE,GAAG;IACpC,MAAM,EACJ,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,eAAe,EACf,UAAU,EACV,SAAS,EACT,KAAK,KAEH,KAAK,EADJ,IAAI,UACL,KAAK,EATH,0FASL,CAAQ,CAAA;IAET,MAAM,eAAe,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA;IACrC,MAAM,gBAAgB,GAAG,CAAC,eAAe,IAAI,eAAe,CAAC,OAAO,CAAA;IAEpE,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,eAAe,CAAC,OAAO,IAAI,QAAQ,EAAE;YACxC,eAAe,CAAC,OAAO,GAAG,IAAI,CAAA;SAC/B;IACH,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAA;IAEd,MAAM,GAAG,GAAG,CACV,oBAAC,QAAQ,oBACH,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,UAAU,KAErB,QAAQ,CACA,CACZ,CAAA;IAED,OAAO,CACL;QACG,GAAG;QACH,QAAQ,IAAI,CACX,oBAAC,QAAQ,IACP,SAAS,EAAE,MAAM,CACf,SAAS,EACT,UAAU,IAAI,6BAA6B,CAC5C,EACD,KAAK,EAAE,KAAK;YAEZ,oBAAC,SAAS,IAAC,SAAS,EAAC,eAAe,EAAC,OAAO,EAAE,YAAY;gBACxD,oBAAC,QAAQ,IAAC,MAAM,EAAE,gBAAgB,EAAE,EAAE,UACnC,OAAO,CACC,CACD,CACH,CACZ,CACA,CACJ,CAAA;AACH,CAAC,CACF,CAAA;AAED,kBAAkB,CAAC,YAAY,GAAG;IAChC,QAAQ,EAAE,KAAK;IACf,UAAU,EAAE,KAAK;CAClB,CAAA;AAED,kBAAkB,CAAC,WAAW,GAAG,oBAAoB,CAAA;AAErD,eAAe,kBAAkB,CAAA"}

package/dist-package/src/TableFooter/TableFooter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableFooter.d.ts","sourceRoot":"","sources":["../../../src/TableFooter/TableFooter.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,KAAqB,MAAM,OAAO,CAAA;AACzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAKvD,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,cAAc,CAAC,uBAAuB,CAAC;IACzC,uCAAuC;IACvC,QAAQ,EAAE,SAAS,CAAA;CACpB;AAMD,eAAO,MAAM,WAAW,uFAmBvB,CAAA;AAMD,eAAe,WAAW,CAAA"}
+{"version":3,"file":"TableFooter.d.ts","sourceRoot":"","sources":["../../../src/TableFooter/TableFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,KAAqB,MAAM,OAAO,CAAA;AACzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAKvD,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,cAAc,CAAC,uBAAuB,CAAC;IACzC,uCAAuC;IACvC,QAAQ,EAAE,SAAS,CAAA;CACpB;AAED,eAAO,MAAM,WAAW,uFAoBvB,CAAA;AAMD,eAAe,WAAW,CAAA"}

package/dist-package/src/TableFooter/TableFooter.js

@@ -9,19 +9,13 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { makeStyles } from '@material-ui/core/styles';
-import { TableFooter as MUITableFooter } from '@material-ui/core';
 import React, { forwardRef } from 'react';
-import styles from './styles';
+import { twMerge } from '@toptal/picasso-tailwind-merge';
 import { TableSection, TableSectionContext } from '../Table';
-const useStyles = makeStyles(styles, {
-    name: 'PicassoTableFooter',
-});
 export const TableFooter = forwardRef(function TableFooter(props, ref) {
     const { className, style, children } = props, rest = __rest(props, ["className", "style", "children"]);
-    const classes = useStyles();
     return (React.createElement(TableSectionContext.Provider, { value: TableSection.FOOTER },
-        React.createElement(MUITableFooter, Object.assign({}, rest, { ref: ref, classes: classes, className: className, style: style }), children)));
+        React.createElement("tfoot", Object.assign({}, rest, { ref: ref, className: twMerge('border-0 border-solid border-t border-gray-200', className), style: style }), children)));
 });
 TableFooter.defaultProps = {};
 TableFooter.displayName = 'TableFooter';

package/dist-package/src/TableFooter/TableFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableFooter.js","sourceRoot":"","sources":["../../../src/TableFooter/TableFooter.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AACrD,OAAO,EAAE,WAAW,IAAI,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAEjE,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAGzC,OAAO,MAAM,MAAM,UAAU,CAAA;AAC7B,OAAO,EAAE,YAAY,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAA;AAS5D,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,oBAAoB;CAC3B,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,UAAU,CACnC,SAAS,WAAW,CAAC,KAAK,EAAE,GAAG;IAC7B,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,KAAc,KAAK,EAAd,IAAI,UAAK,KAAK,EAA/C,kCAAuC,CAAQ,CAAA;IACrD,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,OAAO,CACL,oBAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,CAAC,MAAM;QACtD,oBAAC,cAAc,oBACT,IAAI,IACR,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,KAEX,QAAQ,CACM,CACY,CAChC,CAAA;AACH,CAAC,CACF,CAAA;AAED,WAAW,CAAC,YAAY,GAAG,EAAE,CAAA;AAE7B,WAAW,CAAC,WAAW,GAAG,aAAa,CAAA;AAEvC,eAAe,WAAW,CAAA"}
+{"version":3,"file":"TableFooter.js","sourceRoot":"","sources":["../../../src/TableFooter/TableFooter.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAA;AAExD,OAAO,EAAE,YAAY,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAA;AAS5D,MAAM,CAAC,MAAM,WAAW,GAAG,UAAU,CACnC,SAAS,WAAW,CAAC,KAAK,EAAE,GAAG;IAC7B,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,KAAc,KAAK,EAAd,IAAI,UAAK,KAAK,EAA/C,kCAAuC,CAAQ,CAAA;IAErD,OAAO,CACL,oBAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,CAAC,MAAM;QACtD,+CACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,CAChB,gDAAgD,EAChD,SAAS,CACV,EACD,KAAK,EAAE,KAAK,KAEX,QAAQ,CACH,CACqB,CAChC,CAAA;AACH,CAAC,CACF,CAAA;AAED,WAAW,CAAC,YAAY,GAAG,EAAE,CAAA;AAE7B,WAAW,CAAC,WAAW,GAAG,aAAa,CAAA;AAEvC,eAAe,WAAW,CAAA"}

package/dist-package/src/TableHead/TableHead.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableHead.d.ts","sourceRoot":"","sources":["../../../src/TableHead/TableHead.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,KAAqB,MAAM,OAAO,CAAA;AAIzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAKvD,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,cAAc,CAAC,uBAAuB,CAAC;IACzC,yDAAyD;IACzD,QAAQ,EAAE,SAAS,CAAA;CACpB;AAID,eAAO,MAAM,SAAS,uFAmBrB,CAAA;AAMD,eAAe,SAAS,CAAA"}
+{"version":3,"file":"TableHead.d.ts","sourceRoot":"","sources":["../../../src/TableHead/TableHead.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,KAAqB,MAAM,OAAO,CAAA;AACzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAKvD,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,cAAc,CAAC,uBAAuB,CAAC;IACzC,yDAAyD;IACzD,QAAQ,EAAE,SAAS,CAAA;CACpB;AAED,eAAO,MAAM,SAAS,uFAoBrB,CAAA;AAMD,eAAe,SAAS,CAAA"}

package/dist-package/src/TableHead/TableHead.js

@@ -10,16 +10,12 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import React, { forwardRef } from 'react';
-import { makeStyles } from '@material-ui/core/styles';
-import { TableHead as MUITableHead } from '@material-ui/core';
-import styles from './styles';
+import { twMerge } from '@toptal/picasso-tailwind-merge';
 import { TableSectionContext, TableSection } from '../Table';
-const useStyles = makeStyles(styles, { name: 'PicassoTableHead' });
 export const TableHead = forwardRef(function TableHead(props, ref) {
     const { className, style, children } = props, rest = __rest(props, ["className", "style", "children"]);
-    const classes = useStyles();
     return (React.createElement(TableSectionContext.Provider, { value: TableSection.HEAD },
-        React.createElement(MUITableHead, Object.assign({}, rest, { ref: ref, classes: classes, className: className, style: style }), children)));
+        React.createElement("thead", Object.assign({}, rest, { ref: ref, className: twMerge('border-0 border-solid border-b border-gray-200', className), style: style }), children)));
 });
 TableHead.defaultProps = {};
 TableHead.displayName = 'TableHead';

package/dist-package/src/TableHead/TableHead.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableHead.js","sourceRoot":"","sources":["../../../src/TableHead/TableHead.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AACrD,OAAO,EAAE,SAAS,IAAI,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAG7D,OAAO,MAAM,MAAM,UAAU,CAAA;AAC7B,OAAO,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAS5D,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE,EAAE,IAAI,EAAE,kBAAkB,EAAE,CAAC,CAAA;AAEzE,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CACjC,SAAS,SAAS,CAAC,KAAK,EAAE,GAAG;IAC3B,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,KAAc,KAAK,EAAd,IAAI,UAAK,KAAK,EAA/C,kCAAuC,CAAQ,CAAA;IACrD,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,OAAO,CACL,oBAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,CAAC,IAAI;QACpD,oBAAC,YAAY,oBACP,IAAI,IACR,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,KAEX,QAAQ,CACI,CACc,CAChC,CAAA;AACH,CAAC,CACF,CAAA;AAED,SAAS,CAAC,YAAY,GAAG,EAAE,CAAA;AAE3B,SAAS,CAAC,WAAW,GAAG,WAAW,CAAA;AAEnC,eAAe,SAAS,CAAA"}
+{"version":3,"file":"TableHead.js","sourceRoot":"","sources":["../../../src/TableHead/TableHead.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAA;AAExD,OAAO,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAS5D,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CACjC,SAAS,SAAS,CAAC,KAAK,EAAE,GAAG;IAC3B,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,KAAc,KAAK,EAAd,IAAI,UAAK,KAAK,EAA/C,kCAAuC,CAAQ,CAAA;IAErD,OAAO,CACL,oBAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,CAAC,IAAI;QACpD,+CACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,CAChB,gDAAgD,EAChD,SAAS,CACV,EACD,KAAK,EAAE,KAAK,KAEX,QAAQ,CACH,CACqB,CAChC,CAAA;AACH,CAAC,CACF,CAAA;AAED,SAAS,CAAC,YAAY,GAAG,EAAE,CAAA;AAE3B,SAAS,CAAC,WAAW,GAAG,WAAW,CAAA;AAEnC,eAAe,SAAS,CAAA"}

package/dist-package/src/TableRow/TableRow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableRow.d.ts","sourceRoot":"","sources":["../../../src/TableRow/TableRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAClE,OAAO,KAAiC,MAAM,OAAO,CAAA;AAKrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAKvD,MAAM,WAAW,KAAM,SAAQ,SAAS,EAAE,cAAc,CAAC,mBAAmB,CAAC;IAC3E,4DAA4D;IAC5D,QAAQ,EAAE,SAAS,CAAA;IACnB,iDAAiD;IACjD,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,4DAA4D;IAC5D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,qDAAqD;IACrD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,mBAAmB,CAAC,KAAK,IAAI,CAAA;IAC1D,+CAA+C;IAC/C,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB;AAID,eAAO,MAAM,QAAQ,mFAsCpB,CAAA;AAUD,eAAe,QAAQ,CAAA"}
+{"version":3,"file":"TableRow.d.ts","sourceRoot":"","sources":["../../../src/TableRow/TableRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAClE,OAAO,KAAiC,MAAM,OAAO,CAAA;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAKvD,MAAM,WAAW,KAAM,SAAQ,SAAS,EAAE,cAAc,CAAC,mBAAmB,CAAC;IAC3E,4DAA4D;IAC5D,QAAQ,EAAE,SAAS,CAAA;IACnB,iDAAiD;IACjD,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,4DAA4D;IAC5D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,qDAAqD;IACrD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,mBAAmB,CAAC,KAAK,IAAI,CAAA;IAC1D,+CAA+C;IAC/C,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB;AAED,eAAO,MAAM,QAAQ,mFAkCpB,CAAA;AAUD,eAAe,QAAQ,CAAA"}

package/dist-package/src/TableRow/TableRow.js

@@ -10,21 +10,13 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import React, { forwardRef, useContext } from 'react';
-import cx from 'classnames';
-import { makeStyles } from '@material-ui/core/styles';
-import { TableRow as MUITableRow } from '@material-ui/core';
-import styles from './styles';
+import { twMerge } from '@toptal/picasso-tailwind-merge';
 import { TableContext } from '../Table';
-const useStyles = makeStyles(styles, { name: 'PicassoTableRow' });
 export const TableRow = forwardRef(function TableRow(props, ref) {
     const { className, style, children, hover, selected, stripeEven, onClick } = props, rest = __rest(props, ["className", "style", "children", "hover", "selected", "stripeEven", "onClick"]);
-    const _a = useStyles(), { stripeEven: stripeEvenClass, bordered: borderedClass } = _a, muiClasses = __rest(_a, ["stripeEven", "bordered"]);
     const { variant } = useContext(TableContext);
     const isBordered = variant === 'bordered' || variant === 'striped';
-    return (React.createElement(MUITableRow, Object.assign({}, rest, { ref: ref, classes: muiClasses, className: cx(className, {
-            [stripeEvenClass]: stripeEven,
-            [borderedClass]: isBordered,
-        }), style: style, hover: hover, selected: selected, onClick: onClick }), children));
+    return (React.createElement("tr", Object.assign({}, rest, { ref: ref, className: twMerge(isBordered && 'border-0 border-solid border-b border-gray-200', stripeEven && 'bg-gray-100', hover && 'hover:bg-blue-100 transition-colors', selected && 'bg-blue-100', className), style: style, onClick: onClick }), children));
 });
 TableRow.defaultProps = {
     hover: false,

package/dist-package/src/TableRow/TableRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableRow.js","sourceRoot":"","sources":["../../../src/TableRow/TableRow.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACrD,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AACrD,OAAO,EAAE,QAAQ,IAAI,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAG3D,OAAO,MAAM,MAAM,UAAU,CAAA;AAC7B,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAevC,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE,EAAE,IAAI,EAAE,iBAAiB,EAAE,CAAC,CAAA;AAExE,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAChC,SAAS,QAAQ,CAAC,KAAK,EAAE,GAAG;IAC1B,MAAM,EACJ,SAAS,EACT,KAAK,EACL,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,UAAU,EACV,OAAO,KAEL,KAAK,EADJ,IAAI,UACL,KAAK,EATH,gFASL,CAAQ,CAAA;IACT,MAAM,KAIF,SAAS,EAAE,EAJT,EACJ,UAAU,EAAE,eAAe,EAC3B,QAAQ,EAAE,aAAa,OAEV,EADV,UAAU,cAHT,0BAIL,CAAc,CAAA;IACf,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,YAAY,CAAC,CAAA;IAC5C,MAAM,UAAU,GAAG,OAAO,KAAK,UAAU,IAAI,OAAO,KAAK,SAAS,CAAA;IAElE,OAAO,CACL,oBAAC,WAAW,oBACN,IAAI,IACR,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,UAAU,EACnB,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE;YACvB,CAAC,eAAe,CAAC,EAAE,UAAU;YAC7B,CAAC,aAAa,CAAC,EAAE,UAAU;SAC5B,CAAC,EACF,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,KAEf,QAAQ,CACG,CACf,CAAA;AACH,CAAC,CACF,CAAA;AAED,QAAQ,CAAC,YAAY,GAAG;IACtB,KAAK,EAAE,KAAK;IACZ,QAAQ,EAAE,KAAK;IACf,UAAU,EAAE,KAAK;CAClB,CAAA;AAED,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAA;AAEjC,eAAe,QAAQ,CAAA"}
+{"version":3,"file":"TableRow.js","sourceRoot":"","sources":["../../../src/TableRow/TableRow.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAErD,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAA;AAExD,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAevC,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAChC,SAAS,QAAQ,CAAC,KAAK,EAAE,GAAG;IAC1B,MAAM,EACJ,SAAS,EACT,KAAK,EACL,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,UAAU,EACV,OAAO,KAEL,KAAK,EADJ,IAAI,UACL,KAAK,EATH,gFASL,CAAQ,CAAA;IAET,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,YAAY,CAAC,CAAA;IAC5C,MAAM,UAAU,GAAG,OAAO,KAAK,UAAU,IAAI,OAAO,KAAK,SAAS,CAAA;IAElE,OAAO,CACL,4CACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,CAChB,UAAU,IAAI,gDAAgD,EAC9D,UAAU,IAAI,aAAa,EAC3B,KAAK,IAAI,qCAAqC,EAC9C,QAAQ,IAAI,aAAa,EACzB,SAAS,CACV,EACD,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,KAEf,QAAQ,CACN,CACN,CAAA;AACH,CAAC,CACF,CAAA;AAED,QAAQ,CAAC,YAAY,GAAG;IACtB,KAAK,EAAE,KAAK;IACZ,QAAQ,EAAE,KAAK;IACf,UAAU,EAAE,KAAK;CAClB,CAAA;AAED,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAA;AAEjC,eAAe,QAAQ,CAAA"}

package/dist-package/src/TableSectionHead/TableSectionHead.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableSectionHead.d.ts","sourceRoot":"","sources":["../../../src/TableSectionHead/TableSectionHead.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAE5E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAYvD,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,cAAc,CAAC,uBAAuB,CAAC;IACzC,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,IAAI,CAAC,EAAE,YAAY,CAAA;CACpB;AAMD,eAAO,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,KAAK,CAoBpD,CAAA;AAQF,eAAe,gBAAgB,CAAA"}
+{"version":3,"file":"TableSectionHead.d.ts","sourceRoot":"","sources":["../../../src/TableSectionHead/TableSectionHead.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAE5E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AASvD,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,cAAc,CAAC,uBAAuB,CAAC;IACzC,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,IAAI,CAAC,EAAE,YAAY,CAAA;CACpB;AAED,eAAO,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,KAAK,CAyBpD,CAAA;AAQF,eAAe,gBAAgB,CAAA"}

package/dist-package/src/TableSectionHead/TableSectionHead.js

@@ -1,22 +1,16 @@
 import React, { forwardRef } from 'react';
-import { makeStyles } from '@material-ui/core/styles';
 import { TableSection, TableSectionContext } from '../Table';
 import { TableCell } from '../TableCell';
 import { TableRow } from '../TableRow';
 import { TableBody } from '../TableBody';
-import styles from './styles';
 const MAX_COL_SPAN = 100;
-const useStyles = makeStyles(styles, {
-    name: 'PicassoTableSectionHead',
-});
 export const TableSectionHead = forwardRef(function TableSectionHead(props, ref) {
     const { colSpan, icon, children, style } = props;
-    const classes = useStyles();
     return (React.createElement(TableBody, { ref: ref },
-        React.createElement(TableRow, { className: classes.sectionHeaderRow, style: style },
+        React.createElement(TableRow, { className: 'min-h-10 border-y border-solid border-gray-200', style: style },
             React.createElement(TableSectionContext.Provider, { value: TableSection.HEAD },
                 React.createElement(TableCell, { colSpan: colSpan },
-                    icon && React.createElement("span", { className: classes.iconWrapper }, icon),
+                    icon && (React.createElement("span", { className: 'inline-block align-middle mr-3 -mt-[1px]' }, icon)),
                     children)))));
 });
 TableSectionHead.defaultProps = {

package/dist-package/src/TableSectionHead/TableSectionHead.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableSectionHead.js","sourceRoot":"","sources":["../../../src/TableSectionHead/TableSectionHead.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAGzC,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAErD,OAAO,EAAE,YAAY,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAA;AAC5D,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxC,OAAO,MAAM,MAAM,UAAU,CAAA;AAE7B,MAAM,YAAY,GAAG,GAAG,CAAA;AASxB,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,yBAAyB;CAChC,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAA6B,UAAU,CAGlE,SAAS,gBAAgB,CAAC,KAAK,EAAE,GAAG;IACpC,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,CAAA;IAEhD,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,OAAO,CACL,oBAAC,SAAS,IAAC,GAAG,EAAE,GAAG;QACjB,oBAAC,QAAQ,IAAC,SAAS,EAAE,OAAO,CAAC,gBAAgB,EAAE,KAAK,EAAE,KAAK;YACzD,oBAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,CAAC,IAAI;gBACpD,oBAAC,SAAS,IAAC,OAAO,EAAE,OAAO;oBACxB,IAAI,IAAI,8BAAM,SAAS,EAAE,OAAO,CAAC,WAAW,IAAG,IAAI,CAAQ;oBAC3D,QAAQ,CACC,CACiB,CACtB,CACD,CACb,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,gBAAgB,CAAC,YAAY,GAAG;IAC9B,OAAO,EAAE,YAAY;CACtB,CAAA;AAED,gBAAgB,CAAC,WAAW,GAAG,kBAAkB,CAAA;AAEjD,eAAe,gBAAgB,CAAA"}
+{"version":3,"file":"TableSectionHead.js","sourceRoot":"","sources":["../../../src/TableSectionHead/TableSectionHead.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAGzC,OAAO,EAAE,YAAY,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAA;AAC5D,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAExC,MAAM,YAAY,GAAG,GAAG,CAAA;AASxB,MAAM,CAAC,MAAM,gBAAgB,GAA6B,UAAU,CAGlE,SAAS,gBAAgB,CAAC,KAAK,EAAE,GAAG;IACpC,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,CAAA;IAEhD,OAAO,CACL,oBAAC,SAAS,IAAC,GAAG,EAAE,GAAG;QACjB,oBAAC,QAAQ,IACP,SAAS,EAAC,gDAAgD,EAC1D,KAAK,EAAE,KAAK;YAEZ,oBAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,CAAC,IAAI;gBACpD,oBAAC,SAAS,IAAC,OAAO,EAAE,OAAO;oBACxB,IAAI,IAAI,CACP,8BAAM,SAAS,EAAC,0CAA0C,IACvD,IAAI,CACA,CACR;oBACA,QAAQ,CACC,CACiB,CACtB,CACD,CACb,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,gBAAgB,CAAC,YAAY,GAAG;IAC9B,OAAO,EAAE,YAAY;CACtB,CAAA;AAED,gBAAgB,CAAC,WAAW,GAAG,kBAAkB,CAAA;AAEjD,eAAe,gBAAgB,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@toptal/picasso-table",
-  "version": "1.1.21",
+  "version": "2.0.1",
   "description": "Toptal UI components library - Table",
   "publishConfig": {
     "access": "public"
@@ -22,25 +22,27 @@
   },
   "homepage": "https://github.com/toptal/picasso/tree/master/packages/picasso#readme",
   "dependencies": {
+    "@toptal/picasso-collapse": "2.0.0",
     "@toptal/picasso-shared": "15.0.0",
-    "@toptal/picasso-typography": "2.0.2",
-    "@toptal/picasso-button": "2.1.1",
-    "@toptal/picasso-icons": "1.5.0",
+    "@toptal/picasso-typography": "3.0.0",
+    "@toptal/picasso-button": "3.0.1",
+    "@toptal/picasso-icons": "1.6.0",
     "@toptal/picasso-utils": "1.0.3",
-    "ap-style-title-case": "^1.1.2",
-    "classnames": "^2.5.1"
+    "ap-style-title-case": "^1.1.2"
   },
   "sideEffects": [
     "**/styles.ts",
     "**/styles.js"
   ],
   "peerDependencies": {
-    "@material-ui/core": "4.12.4",
     "@toptal/picasso-provider": "*",
-    "react": ">=16.12.0 < 19.0.0"
+    "@toptal/picasso-tailwind-merge": "^1.0.1",
+    "react": ">=16.12.0 < 19.0.0",
+    "@toptal/picasso-tailwind": ">=2.5.0"
   },
   "devDependencies": {
-    "@toptal/picasso-provider": "4.2.1",
+    "@toptal/picasso-provider": "5.0.0",
+    "@toptal/picasso-tailwind-merge": "1.2.0",
     "@toptal/picasso-test-utils": "1.1.1",
     "styled-components": "^6.1.1"
   },

package/src/Table/Table.tsx

@@ -1,12 +1,9 @@
 import type { ReactNode, TableHTMLAttributes } from 'react'
 import React, { forwardRef, useMemo } from 'react'
-import type { Theme } from '@material-ui/core/styles'
-import { makeStyles } from '@material-ui/core/styles'
-import { Table as MUITable } from '@material-ui/core'
 import type { BaseProps } from '@toptal/picasso-shared'
+import { twMerge } from '@toptal/picasso-tailwind-merge'
 
 import TableContext from './TableContext'
-import styles from './styles'
 
 export interface Props
   extends BaseProps,
@@ -19,10 +16,6 @@ export interface Props
   variant?: 'clear' | 'bordered' | 'striped'
 }
 
-const useStyles = makeStyles<Theme>(styles, {
-  name: 'Table',
-})
-
 // eslint-disable-next-line react/display-name
 export const Table = forwardRef<HTMLTableElement, Props>(function Table(
   props,
@@ -36,21 +29,22 @@ export const Table = forwardRef<HTMLTableElement, Props>(function Table(
     variant = 'bordered',
     ...rest
   } = props
-  const classes = useStyles()
 
   const tableConfig = useMemo(() => ({ spacing, variant }), [spacing, variant])
 
   return (
     <TableContext.Provider value={tableConfig}>
-      <MUITable
+      <table
         {...rest}
         ref={ref}
-        classes={classes}
-        className={className}
+        className={twMerge(
+          'w-full border-collapse border-spacing-0',
+          className
+        )}
         style={style}
       >
         {children}
-      </MUITable>
+      </table>
     </TableContext.Provider>
   )
 })

package/src/Table/__snapshots__/test.tsx.snap

@@ -6,37 +6,34 @@ exports[`Table renders 1`] = `
     class="Picasso-root"
   >
     <table
-      class="MuiTable-root"
+      class="w-full border-collapse border-spacing"
     >
       <thead
-        class="MuiTableHead-root PicassoTableHead-root"
+        class="border-0 border-solid border-b border-gray"
       >
         <tr
-          class="MuiTableRow-root PicassoTableRow-root PicassoTableRow-bordered MuiTableRow-head"
+          class="border-0 border-solid border-b border-gray"
         >
           <th
-            class="MuiTableCell-root PicassoTableCell-root MuiTableCell-head"
-            scope="col"
+            class="h-10 py-2 border-none last:pr-6 px-4 text-left"
           >
             <div
-              class="m-0 text-xxs text-graphite font-semibold"
+              class="m-0 text-xxs text-graphite font-semibold text-align"
             >
               Table test
             </div>
           </th>
         </tr>
       </thead>
-      <tbody
-        class="MuiTableBody-root"
-      >
+      <tbody>
         <tr
-          class="MuiTableRow-root PicassoTableRow-root PicassoTableRow-bordered"
+          class="border-0 border-solid border-b border-gray"
         >
           <td
-            class="MuiTableCell-root PicassoTableCell-root MuiTableCell-body"
+            class="h-10 py-2 border-none last:pr-6 px-4"
           >
             <div
-              class="m-0 text-sm text-graphite font-inherit"
+              class="m-0 text-sm text-graphite font-inherit text-align"
             >
               Table test
             </div>
@@ -44,16 +41,16 @@ exports[`Table renders 1`] = `
         </tr>
       </tbody>
       <tfoot
-        class="MuiTableFooter-root PicassoTableFooter-root"
+        class="border-0 border-solid border-t border-gray"
       >
         <tr
-          class="MuiTableRow-root PicassoTableRow-root PicassoTableRow-bordered MuiTableRow-footer"
+          class="border-0 border-solid border-b border-gray"
         >
           <td
-            class="MuiTableCell-root PicassoTableCell-root MuiTableCell-footer"
+            class="h-10 py-2 border-none last:pr-6 px-4"
           >
             <div
-              class="m-0 text-sm text-black font-semibold"
+              class="m-0 text-sm text-black font-semibold text-align"
             >
               Table test
             </div>

package/src/TableBody/TableBody.tsx

@@ -1,11 +1,7 @@
 import type { ReactNode, HTMLAttributes } from 'react'
 import React, { forwardRef, useContext } from 'react'
-import type { Theme } from '@material-ui/core/styles'
-import { makeStyles } from '@material-ui/core/styles'
-import { TableBody as MUITableBody } from '@material-ui/core'
 import type { BaseProps } from '@toptal/picasso-shared'
 
-import styles from './styles'
 import { TableSectionContext, TableSection, TableContext } from '../Table'
 
 export interface Props
@@ -32,25 +28,16 @@ const stripeRows = (children: React.ReactNode) => {
   })
 }
 
-const useStyles = makeStyles<Theme>(styles, { name: 'PicassoTableBody' })
-
 export const TableBody = forwardRef<HTMLTableSectionElement, Props>(
   function TableBody(props, ref) {
     const { className, style, children, ...rest } = props
-    const classes = useStyles()
     const { variant } = useContext(TableContext)
 
     return (
       <TableSectionContext.Provider value={TableSection.BODY}>
-        <MUITableBody
-          {...rest}
-          ref={ref}
-          classes={classes}
-          className={className}
-          style={style}
-        >
+        <tbody {...rest} ref={ref} className={className} style={style}>
           {variant === 'striped' ? stripeRows(children) : children}
-        </MUITableBody>
+        </tbody>
       </TableSectionContext.Provider>
     )
   }

package/src/TableBody/__snapshots__/test.tsx.snap

@@ -6,19 +6,17 @@ exports[`TableCell renders 1`] = `
     class="Picasso-root"
   >
     <table
-      class="MuiTable-root"
+      class="w-full border-collapse border-spacing"
     >
-      <tbody
-        class="MuiTableBody-root"
-      >
+      <tbody>
         <tr
-          class="MuiTableRow-root PicassoTableRow-root PicassoTableRow-bordered"
+          class="border-0 border-solid border-b border-gray"
         >
           <td
-            class="MuiTableCell-root PicassoTableCell-root MuiTableCell-body"
+            class="h-10 py-2 border-none last:pr-6 px-4"
           >
             <div
-              class="m-0 text-sm text-graphite font-inherit"
+              class="m-0 text-sm text-graphite font-inherit text-align"
             >
               Body test
             </div>