Skip to content

Commit ea2fd25

Browse files
m4theushwm4theushw
authored
[Table] Deprecate padding="default" (#25990)
1 parent 27f4f34 commit ea2fd25

File tree

11 files changed

+37
-19
lines changed

11 files changed

+37
-19
lines changed

‎docs/pages/api-docs/table-cell.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ The `MuiTableCell` name can be used for providing [default props](/customization
3333
| <span class="prop-name">children</span> | <span class="prop-type">node</span> | | The table cell contents. |
3434
| <span class="prop-name">classes</span> | <span class="prop-type">object</span> | | Override or extend the styles applied to the component. See [CSS API](#css) below for more details. |
3535
| <span class="prop-name">component</span> | <span class="prop-type">elementType</span> | | The component used for the root node. Either a string to use a HTML element or a component. |
36-
| <span class="prop-name">padding</span> | <span class="prop-type">'checkbox'<br>&#124;&nbsp;'default'<br>&#124;&nbsp;'none'</span> | | Sets the padding applied to the cell. By default, the Table parent component set the value (`default`). |
36+
| <span class="prop-name">padding</span> | <span class="prop-type">'normal'<br>&#124;&nbsp;'checkbox'<br>&#124;&nbsp;'none'<br>&#124;&nbsp;'default'</span> | | Sets the padding applied to the cell. By default, the Table parent component set the value (`normal`). `default` is deprecated, use `normal` instead. |
3737
| <span class="prop-name">scope</span> | <span class="prop-type">string</span> | | Set scope attribute. |
3838
| <span class="prop-name">size</span> | <span class="prop-type">'medium'<br>&#124;&nbsp;'small'</span> | | Specify the size of the cell. By default, the Table parent component set the value (`medium`). |
3939
| <span class="prop-name">sortDirection</span> | <span class="prop-type">'asc'<br>&#124;&nbsp;'desc'<br>&#124;&nbsp;false</span> | | Set aria-sort direction. |

‎docs/pages/api-docs/table.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ The `MuiTable` name can be used for providing [default props](/customization/glo
3131
| <span class="prop-name required">children<abbr title="required">*</abbr></span> | <span class="prop-type">node</span> | | The content of the table, normally `TableHead` and `TableBody`. |
3232
| <span class="prop-name">classes</span> | <span class="prop-type">object</span> | | Override or extend the styles applied to the component. See [CSS API](#css) below for more details. |
3333
| <span class="prop-name">component</span> | <span class="prop-type">elementType</span> | <span class="prop-default">'table'</span> | The component used for the root node. Either a string to use a HTML element or a component. |
34-
| <span class="prop-name">padding</span> | <span class="prop-type">'default'<br>&#124;&nbsp;'checkbox'<br>&#124;&nbsp;'none'</span> | <span class="prop-default">'default'</span> | Allows TableCells to inherit padding of the Table. |
34+
| <span class="prop-name">padding</span> | <span class="prop-type">'normal'<br>&#124;&nbsp;'checkbox'<br>&#124;&nbsp;'none'<br>&#124;&nbsp;'default'</span> | <span class="prop-default">'normal'</span> | Allows TableCells to inherit padding of the Table. `default` is deprecated, use `normal` instead. |
3535
| <span class="prop-name">size</span> | <span class="prop-type">'small'<br>&#124;&nbsp;'medium'</span> | <span class="prop-default">'medium'</span> | Allows TableCells to inherit size of the Table. |
3636
| <span class="prop-name">stickyHeader</span> | <span class="prop-type">bool</span> | <span class="prop-default">false</span> | Set the header sticky.<br>⚠️ It doesn't work with IE 11. |
3737

‎docs/src/pages/components/tables/EnhancedTable.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -96,7 +96,7 @@ function EnhancedTableHead(props) {
9696
<TableCell
9797
key={headCell.id}
9898
align={headCell.numeric ? 'right' : 'left'}
99-
padding={headCell.disablePadding ? 'none' : 'default'}
99+
padding={headCell.disablePadding ? 'none' : 'normal'}
100100
sortDirection={orderBy === headCell.id ? order : false}
101101
>
102102
<TableSortLabel

‎docs/src/pages/components/tables/EnhancedTable.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -131,7 +131,7 @@ function EnhancedTableHead(props: EnhancedTableProps) {
131131
<TableCell
132132
key={headCell.id}
133133
align={headCell.numeric ? 'right' : 'left'}
134-
padding={headCell.disablePadding ? 'none' : 'default'}
134+
padding={headCell.disablePadding ? 'none' : 'normal'}
135135
sortDirection={orderBy === headCell.id ? order : false}
136136
>
137137
<TableSortLabel

‎packages/material-ui/src/Table/Table.d.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import * as React from 'react';
22
import { OverridableComponent, OverrideProps } from '../OverridableComponent';
33

4-
export type Padding = 'default' | 'checkbox' | 'none';
4+
export type Padding = 'normal' | 'checkbox' | 'none' | 'default';
55

66
export type Size = 'small' | 'medium';
77

‎packages/material-ui/src/Table/Table.js‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import * as React from 'react';
22
import PropTypes from 'prop-types';
33
import clsx from 'clsx';
4+
import { chainPropTypes } from '@material-ui/utils';
45
import withStyles from '../styles/withStyles';
56
import TableContext from './TableContext';
67

@@ -32,7 +33,7 @@ const Table = React.forwardRef(function Table(props, ref) {
3233
classes,
3334
className,
3435
component: Component = defaultComponent,
35-
padding = 'default',
36+
padding = 'normal',
3637
size = 'medium',
3738
stickyHeader = false,
3839
...other
@@ -76,8 +77,17 @@ Table.propTypes = {
7677
component: PropTypes /* @typescript-to-proptypes-ignore */.elementType,
7778
/**
7879
* Allows TableCells to inherit padding of the Table.
80+
* `default` is deprecated, use `normal` instead.
7981
*/
80-
padding: PropTypes.oneOf(['default', 'checkbox', 'none']),
82+
padding: chainPropTypes(PropTypes.oneOf(['normal', 'checkbox', 'none', 'default']), (props) => {
83+
if (props.padding === 'default') {
84+
return new Error(
85+
'Material-UI: padding="default" was renamed to padding="normal" for consistency.',
86+
);
87+
}
88+
89+
return null;
90+
}),
8191
/**
8292
* Allows TableCells to inherit size of the Table.
8393
*/

‎packages/material-ui/src/Table/Table.test.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@ describe('<Table />', () => {
6969

7070
expect(context).to.deep.equal({
7171
size: 'medium',
72-
padding: 'default',
72+
padding: 'normal',
7373
stickyHeader: false,
7474
});
7575
});

‎packages/material-ui/src/TableCell/TableCell.d.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,8 @@ export interface TableCellProps
3232
component?: React.ElementType<TableCellBaseProps>;
3333
/**
3434
* Sets the padding applied to the cell.
35-
* By default, the Table parent component set the value (`default`).
35+
* By default, the Table parent component set the value (`normal`).
36+
* `default` is deprecated, use `normal` instead.
3637
*/
3738
padding?: Padding;
3839
/**

‎packages/material-ui/src/TableCell/TableCell.js‎

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import * as React from 'react';
22
import PropTypes from 'prop-types';
33
import clsx from 'clsx';
4+
import { chainPropTypes } from '@material-ui/utils';
45
import withStyles from '../styles/withStyles';
56
import capitalize from '../utils/capitalize';
67
import { darken, alpha, lighten } from '../styles/colorManipulator';
@@ -136,7 +137,7 @@ const TableCell = React.forwardRef(function TableCell(props, ref) {
136137
if (!scope && isHeadCell) {
137138
scope = 'col';
138139
}
139-
const padding = paddingProp || (table && table.padding ? table.padding : 'default');
140+
const padding = paddingProp || (table && table.padding ? table.padding : 'normal');
140141
const size = sizeProp || (table && table.size ? table.size : 'medium');
141142
const variant = variantProp || (tablelvl2 && tablelvl2.variant);
142143

@@ -154,7 +155,7 @@ const TableCell = React.forwardRef(function TableCell(props, ref) {
154155
{
155156
[classes.stickyHeader]: variant === 'head' && table && table.stickyHeader,
156157
[classes[`align${capitalize(align)}`]]: align !== 'inherit',
157-
[classes[`padding${capitalize(padding)}`]]: padding !== 'default',
158+
[classes[`padding${capitalize(padding)}`]]: padding !== 'normal',
158159
[classes[`size${capitalize(size)}`]]: size !== 'medium',
159160
},
160161
className,
@@ -168,10 +169,6 @@ const TableCell = React.forwardRef(function TableCell(props, ref) {
168169
});
169170

170171
TableCell.propTypes = {
171-
// ----------------------------- Warning --------------------------------
172-
// | These PropTypes are generated from the TypeScript type definitions |
173-
// | To update them edit the d.ts file and run "yarn proptypes" |
174-
// ----------------------------------------------------------------------
175172
/**
176173
* Set the text-align on the table cell content.
177174
*
@@ -199,9 +196,18 @@ TableCell.propTypes = {
199196
component: PropTypes /* @typescript-to-proptypes-ignore */.elementType,
200197
/**
201198
* Sets the padding applied to the cell.
202-
* By default, the Table parent component set the value (`default`).
199+
* By default, the Table parent component set the value (`normal`).
200+
* `default` is deprecated, use `normal` instead.
203201
*/
204-
padding: PropTypes.oneOf(['checkbox', 'default', 'none']),
202+
padding: chainPropTypes(PropTypes.oneOf(['normal', 'checkbox', 'none', 'default']), (props) => {
203+
if (props.padding === 'default') {
204+
return new Error(
205+
'Material-UI: padding="default" was renamed to padding="normal" for consistency.',
206+
);
207+
}
208+
209+
return null;
210+
}),
205211
/**
206212
* Set scope attribute.
207213
*/

‎packages/material-ui/src/TableCell/TableCell.test.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -45,8 +45,8 @@ describe('<TableCell />', () => {
4545

4646
describe('prop: padding', () => {
4747
it('doesn not have a class for padding by default', () => {
48-
const { container } = renderInTable(<TableCell padding="default" />);
49-
expect(container.querySelector('td')).to.not.have.class(classes.paddingDefault);
48+
const { container } = renderInTable(<TableCell padding="normal" />);
49+
expect(container.querySelector('td')).to.not.have.class(classes.paddingNormal);
5050
});
5151

5252
it('has a class when `none`', () => {

0 commit comments

Comments
 (0)