diff --git a/docs/pages/api-docs/table-cell.md b/docs/pages/api-docs/table-cell.md
index 25ee8bee267ae8..873872c1fe7203 100644
--- a/docs/pages/api-docs/table-cell.md
+++ b/docs/pages/api-docs/table-cell.md
@@ -33,7 +33,7 @@ The `MuiTableCell` name can be used for providing [default props](/customization
| children | node | | The table cell contents. |
| classes | object | | Override or extend the styles applied to the component. See [CSS API](#css) below for more details. |
| component | elementType | | The component used for the root node. Either a string to use a HTML element or a component. |
-| padding | 'checkbox'
| 'default'
| 'none' | | Sets the padding applied to the cell. By default, the Table parent component set the value (`default`). |
+| padding | 'normal'
| 'checkbox'
| 'none'
| 'default' | | Sets the padding applied to the cell. By default, the Table parent component set the value (`normal`). `default` is deprecated, use `normal` instead. |
| scope | string | | Set scope attribute. |
| size | 'medium'
| 'small' | | Specify the size of the cell. By default, the Table parent component set the value (`medium`). |
| sortDirection | 'asc'
| 'desc'
| false | | Set aria-sort direction. |
diff --git a/docs/pages/api-docs/table.md b/docs/pages/api-docs/table.md
index df11ac992ee4bf..e71742a13f2a8f 100644
--- a/docs/pages/api-docs/table.md
+++ b/docs/pages/api-docs/table.md
@@ -31,7 +31,7 @@ The `MuiTable` name can be used for providing [default props](/customization/glo
| children* | node | | The content of the table, normally `TableHead` and `TableBody`. |
| classes | object | | Override or extend the styles applied to the component. See [CSS API](#css) below for more details. |
| component | elementType | 'table' | The component used for the root node. Either a string to use a HTML element or a component. |
-| padding | 'default'
| 'checkbox'
| 'none' | 'default' | Allows TableCells to inherit padding of the Table. |
+| padding | 'normal'
| 'checkbox'
| 'none'
| 'default' | 'normal' | Allows TableCells to inherit padding of the Table. `default` is deprecated, use `normal` instead. |
| size | 'small'
| 'medium' | 'medium' | Allows TableCells to inherit size of the Table. |
| stickyHeader | bool | false | Set the header sticky.
⚠️ It doesn't work with IE 11. |
diff --git a/docs/src/pages/components/tables/EnhancedTable.js b/docs/src/pages/components/tables/EnhancedTable.js
index 56f99b48e2c145..d892156b3498c2 100644
--- a/docs/src/pages/components/tables/EnhancedTable.js
+++ b/docs/src/pages/components/tables/EnhancedTable.js
@@ -96,7 +96,7 @@ function EnhancedTableHead(props) {
{
+ if (props.padding === 'default') {
+ return new Error(
+ 'Material-UI: padding="default" was renamed to padding="normal" for consistency.',
+ );
+ }
+
+ return null;
+ }),
/**
* Allows TableCells to inherit size of the Table.
*/
diff --git a/packages/material-ui/src/Table/Table.test.js b/packages/material-ui/src/Table/Table.test.js
index bdd52356aff8c8..b4f70917a130e1 100644
--- a/packages/material-ui/src/Table/Table.test.js
+++ b/packages/material-ui/src/Table/Table.test.js
@@ -69,7 +69,7 @@ describe('', () => {
expect(context).to.deep.equal({
size: 'medium',
- padding: 'default',
+ padding: 'normal',
stickyHeader: false,
});
});
diff --git a/packages/material-ui/src/TableCell/TableCell.d.ts b/packages/material-ui/src/TableCell/TableCell.d.ts
index 51f2a1877dac33..4f4e2f553c56c9 100644
--- a/packages/material-ui/src/TableCell/TableCell.d.ts
+++ b/packages/material-ui/src/TableCell/TableCell.d.ts
@@ -32,7 +32,8 @@ export interface TableCellProps
component?: React.ElementType;
/**
* Sets the padding applied to the cell.
- * By default, the Table parent component set the value (`default`).
+ * By default, the Table parent component set the value (`normal`).
+ * `default` is deprecated, use `normal` instead.
*/
padding?: Padding;
/**
diff --git a/packages/material-ui/src/TableCell/TableCell.js b/packages/material-ui/src/TableCell/TableCell.js
index a53f0f4fca6b77..089497867d434a 100644
--- a/packages/material-ui/src/TableCell/TableCell.js
+++ b/packages/material-ui/src/TableCell/TableCell.js
@@ -1,6 +1,7 @@
import * as React from 'react';
import PropTypes from 'prop-types';
import clsx from 'clsx';
+import { chainPropTypes } from '@material-ui/utils';
import withStyles from '../styles/withStyles';
import capitalize from '../utils/capitalize';
import { darken, alpha, lighten } from '../styles/colorManipulator';
@@ -136,7 +137,7 @@ const TableCell = React.forwardRef(function TableCell(props, ref) {
if (!scope && isHeadCell) {
scope = 'col';
}
- const padding = paddingProp || (table && table.padding ? table.padding : 'default');
+ const padding = paddingProp || (table && table.padding ? table.padding : 'normal');
const size = sizeProp || (table && table.size ? table.size : 'medium');
const variant = variantProp || (tablelvl2 && tablelvl2.variant);
@@ -154,7 +155,7 @@ const TableCell = React.forwardRef(function TableCell(props, ref) {
{
[classes.stickyHeader]: variant === 'head' && table && table.stickyHeader,
[classes[`align${capitalize(align)}`]]: align !== 'inherit',
- [classes[`padding${capitalize(padding)}`]]: padding !== 'default',
+ [classes[`padding${capitalize(padding)}`]]: padding !== 'normal',
[classes[`size${capitalize(size)}`]]: size !== 'medium',
},
className,
@@ -168,10 +169,6 @@ const TableCell = React.forwardRef(function TableCell(props, ref) {
});
TableCell.propTypes = {
- // ----------------------------- Warning --------------------------------
- // | These PropTypes are generated from the TypeScript type definitions |
- // | To update them edit the d.ts file and run "yarn proptypes" |
- // ----------------------------------------------------------------------
/**
* Set the text-align on the table cell content.
*
@@ -199,9 +196,18 @@ TableCell.propTypes = {
component: PropTypes /* @typescript-to-proptypes-ignore */.elementType,
/**
* Sets the padding applied to the cell.
- * By default, the Table parent component set the value (`default`).
+ * By default, the Table parent component set the value (`normal`).
+ * `default` is deprecated, use `normal` instead.
*/
- padding: PropTypes.oneOf(['checkbox', 'default', 'none']),
+ padding: chainPropTypes(PropTypes.oneOf(['normal', 'checkbox', 'none', 'default']), (props) => {
+ if (props.padding === 'default') {
+ return new Error(
+ 'Material-UI: padding="default" was renamed to padding="normal" for consistency.',
+ );
+ }
+
+ return null;
+ }),
/**
* Set scope attribute.
*/
diff --git a/packages/material-ui/src/TableCell/TableCell.test.js b/packages/material-ui/src/TableCell/TableCell.test.js
index 3283a0e49e940d..083453053e20d2 100644
--- a/packages/material-ui/src/TableCell/TableCell.test.js
+++ b/packages/material-ui/src/TableCell/TableCell.test.js
@@ -45,8 +45,8 @@ describe('', () => {
describe('prop: padding', () => {
it('doesn not have a class for padding by default', () => {
- const { container } = renderInTable();
- expect(container.querySelector('td')).to.not.have.class(classes.paddingDefault);
+ const { container } = renderInTable();
+ expect(container.querySelector('td')).to.not.have.class(classes.paddingNormal);
});
it('has a class when `none`', () => {
diff --git a/scripts/generateProptypes.ts b/scripts/generateProptypes.ts
index 787396211e430c..9ea4d1e9e28a32 100644
--- a/scripts/generateProptypes.ts
+++ b/scripts/generateProptypes.ts
@@ -47,6 +47,7 @@ const todoComponents = [
'Tab',
'Table',
'TableBody',
+ 'TableCell',
'TableContainer',
'TableFooter',
'TableHead',