Skip to content

Commit c81c837

Browse files
sebastian review
1 parent 6724589 commit c81c837

File tree

18 files changed

+94
-77
lines changed

18 files changed

+94
-77
lines changed

docs/pages/api/alert.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ You can learn more about the difference by [reading this guide](/guides/minimizi
3030
| <span class="prop-name">closeText</span> | <span class="prop-type">string</span> | <span class="prop-default">'Close'</span> | Override the default label for the *close popup* icon button.<br>For localization purposes, you can use the provided [translations](/guides/localization/). |
3131
| <span class="prop-name">color</span> | <span class="prop-type">'error'<br>&#124;&nbsp;'info'<br>&#124;&nbsp;'success'<br>&#124;&nbsp;'warning'</span> | | The main color for the alert. Unless provided, the value is taken from the `severity` prop. |
3232
| <span class="prop-name">icon</span> | <span class="prop-type">node</span> | | Override the icon displayed before the children. Unless provided, the icon is mapped to the value of the `severity` prop. |
33-
| <span class="prop-name">iconMapping</span> | <span class="prop-type">{ error?: node, info?: node, success?: node, warning?: node }</span> | <span class="prop-default">{ success: &lt;SuccessOutlinedIcon fontSize="inherit" />, warning: &lt;ReportProblemOutlinedIcon fontSize="inherit" />, error: &lt;ErrorOutlineIcon fontSize="inherit" />, info: &lt;InfoOutlinedIcon fontSize="inherit" />,}</span> | The component maps the `severity` prop to a range of different icons, for instance success to `<SuccessOutlined>`. If you wish to change this mapping, you can provide your own. Alternatively, you can use the `icon` prop to override the icon displayed. |
33+
| <span class="prop-name">iconMapping</span> | <span class="prop-type">{ error?: node, info?: node, success?: node, warning?: node }</span> | | The component maps the `severity` prop to a range of different icons, for instance success to `<SuccessOutlined>`. If you wish to change this mapping, you can provide your own. Alternatively, you can use the `icon` prop to override the icon displayed. |
3434
| <span class="prop-name">onClose</span> | <span class="prop-type">func</span> | | Callback fired when the component requests to be closed. When provided and no `action` prop is set, a close icon button is displayed that triggers the callback when clicked.<br><br>**Signature:**<br>`function(event: object) => void`<br>*event:* The event source of the callback. |
3535
| <span class="prop-name">role</span> | <span class="prop-type">string</span> | <span class="prop-default">'alert'</span> | The ARIA role attribute of the element. |
3636
| <span class="prop-name">severity</span> | <span class="prop-type">'error'<br>&#124;&nbsp;'info'<br>&#124;&nbsp;'success'<br>&#124;&nbsp;'warning'</span> | <span class="prop-default">'success'</span> | The severity of the alert. This defines the color and icon used. |

docs/pages/api/pagination-item.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -31,8 +31,8 @@ You can learn more about the difference by [reading this guide](/guides/minimizi
3131
| <span class="prop-name">selected</span> | <span class="prop-type">bool</span> | <span class="prop-default">false</span> | If `true` the pagination item is selected. |
3232
| <span class="prop-name">shape</span> | <span class="prop-type">'round'<br>&#124;&nbsp;'rounded'</span> | <span class="prop-default">'round'</span> | The shape of the pagination item. |
3333
| <span class="prop-name">size</span> | <span class="prop-type">'small'<br>&#124;&nbsp;'medium'<br>&#124;&nbsp;'large'</span> | <span class="prop-default">'medium'</span> | The size of the pagination item. |
34-
| <span class="prop-name">type</span> | <span class="prop-type">'page'<br>&#124;&nbsp;'first'<br>&#124;&nbsp;'last'<br>&#124;&nbsp;'next'<br>&#124;&nbsp;'previous'<br>&#124;&nbsp;'start-ellipsis'<br>&#124;&nbsp;'end-ellipsis'</span> | <span class="prop-default">'page'</span> | |
35-
| <span class="prop-name">variant</span> | <span class="prop-type">'text'<br>&#124;&nbsp;'outlined'</span> | | |
34+
| <span class="prop-name">type</span> | <span class="prop-type">'page'<br>&#124;&nbsp;'first'<br>&#124;&nbsp;'last'<br>&#124;&nbsp;'next'<br>&#124;&nbsp;'previous'<br>&#124;&nbsp;'start-ellipsis'<br>&#124;&nbsp;'end-ellipsis'</span> | <span class="prop-default">'page'</span> | The type of pagination item. |
35+
| <span class="prop-name">variant</span> | <span class="prop-type">'text'<br>&#124;&nbsp;'outlined'</span> | <span class="prop-default">'text'</span> | The pagination item variant. |
3636

3737
The `ref` is forwarded to the root element.
3838

docs/pages/api/pagination.md

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -24,25 +24,25 @@ You can learn more about the difference by [reading this guide](/guides/minimizi
2424

2525
| Name | Type | Default | Description |
2626
|:-----|:-----|:--------|:------------|
27-
| <span class="prop-name">boundaryCount</span> | <span class="prop-type">number</span> | | Number of always visible pages at the beginning and end. |
27+
| <span class="prop-name">boundaryCount</span> | <span class="prop-type">number</span> | <span class="prop-default">1</span> | Number of always visible pages at the beginning and end. |
2828
| <span class="prop-name">children</span> | <span class="prop-type">node</span> | | Pagination items. |
2929
| <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. |
30-
| <span class="prop-name">color</span> | <span class="prop-type">'default'<br>&#124;&nbsp;'primary'<br>&#124;&nbsp;'secondary'</span> | | The active color. |
31-
| <span class="prop-name">count</span> | <span class="prop-type">number</span> | | The total number of pages. |
32-
| <span class="prop-name">defaultPage</span> | <span class="prop-type">number</span> | | The page selected by default when the component is uncontrolled. |
33-
| <span class="prop-name">disabled</span> | <span class="prop-type">bool</span> | | If `true`, all the pagination component will be disabled. |
30+
| <span class="prop-name">color</span> | <span class="prop-type">'default'<br>&#124;&nbsp;'primary'<br>&#124;&nbsp;'secondary'</span> | <span class="prop-default">'standard'</span> | The active color. |
31+
| <span class="prop-name">count</span> | <span class="prop-type">number</span> | <span class="prop-default">1</span> | The total number of pages. |
32+
| <span class="prop-name">defaultPage</span> | <span class="prop-type">number</span> | <span class="prop-default">1</span> | The page selected by default when the component is uncontrolled. |
33+
| <span class="prop-name">disabled</span> | <span class="prop-type">bool</span> | <span class="prop-default">false</span> | If `true`, all the pagination component will be disabled. |
3434
| <span class="prop-name">getItemAriaLabel</span> | <span class="prop-type">func</span> | | Accepts a function which returns a string value that provides a user-friendly name for the current page.<br>For localization purposes, you can use the provided [translations](/guides/localization/).<br><br>**Signature:**<br>`function(type?: string, page: number, selected: bool) => string`<br>*type:* The link or button type to format ('page' | 'first' | 'last' | 'next' | 'previous').<br>*page:* The page number to format.<br>*selected:* If true, the current page is selected. |
35-
| <span class="prop-name">hideNextButton</span> | <span class="prop-type">bool</span> | | If `true`, hide the next-page button. |
36-
| <span class="prop-name">hidePrevButton</span> | <span class="prop-type">bool</span> | | If `true`, hide the previous-page button. |
35+
| <span class="prop-name">hideNextButton</span> | <span class="prop-type">bool</span> | <span class="prop-default">false</span> | If `true`, hide the next-page button. |
36+
| <span class="prop-name">hidePrevButton</span> | <span class="prop-type">bool</span> | <span class="prop-default">false</span> | If `true`, hide the previous-page button. |
3737
| <span class="prop-name">onChange</span> | <span class="prop-type">func</span> | | Callback fired when the page is changed.<br><br>**Signature:**<br>`function(event: object, page: number) => void`<br>*event:* The event source of the callback.<br>*page:* The page selected. |
3838
| <span class="prop-name">page</span> | <span class="prop-type">number</span> | | The current page. |
39-
| <span class="prop-name">renderItem</span> | <span class="prop-type">func</span> | | Render the item.<br><br>**Signature:**<br>`function(params: object) => ReactNode`<br>*params:* null |
40-
| <span class="prop-name">shape</span> | <span class="prop-type">'round'<br>&#124;&nbsp;'rounded'</span> | | The shape of the pagination items. |
41-
| <span class="prop-name">showFirstButton</span> | <span class="prop-type">bool</span> | | If `true`, show the first-page button. |
42-
| <span class="prop-name">showLastButton</span> | <span class="prop-type">bool</span> | | If `true`, show the last-page button. |
43-
| <span class="prop-name">siblingRange</span> | <span class="prop-type">number</span> | | Number of always visible pages before and after the current page. |
44-
| <span class="prop-name">size</span> | <span class="prop-type">'small'<br>&#124;&nbsp;'medium'<br>&#124;&nbsp;'large'</span> | | The size of the pagination component. |
45-
| <span class="prop-name">variant</span> | <span class="prop-type">'text'<br>&#124;&nbsp;'outlined'</span> | | The variant to use. |
39+
| <span class="prop-name">renderItem</span> | <span class="prop-type">func</span> | <span class="prop-default">item => &lt;PaginationItem {...item} /></span> | Render the item.<br><br>**Signature:**<br>`function(params: object) => ReactNode`<br>*params:* The props to spread on a PaginationItem. |
40+
| <span class="prop-name">shape</span> | <span class="prop-type">'round'<br>&#124;&nbsp;'rounded'</span> | <span class="prop-default">'round'</span> | The shape of the pagination items. |
41+
| <span class="prop-name">showFirstButton</span> | <span class="prop-type">bool</span> | <span class="prop-default">false</span> | If `true`, show the first-page button. |
42+
| <span class="prop-name">showLastButton</span> | <span class="prop-type">bool</span> | <span class="prop-default">false</span> | If `true`, show the last-page button. |
43+
| <span class="prop-name">siblingCount</span> | <span class="prop-type">number</span> | <span class="prop-default">1</span> | Number of always visible pages before and after the current page. |
44+
| <span class="prop-name">size</span> | <span class="prop-type">'small'<br>&#124;&nbsp;'medium'<br>&#124;&nbsp;'large'</span> | <span class="prop-default">'medium'</span> | The size of the pagination component. |
45+
| <span class="prop-name">variant</span> | <span class="prop-type">'text'<br>&#124;&nbsp;'outlined'</span> | <span class="prop-default">'text'</span> | The variant to use. |
4646

4747
The `ref` is forwarded to the root element.
4848

docs/src/modules/utils/generateMarkdown.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -272,6 +272,11 @@ function generateProps(reactAPI) {
272272
)}</span>`;
273273
}
274274

275+
// Give up
276+
if (defaultValue.length > 180) {
277+
defaultValue = '';
278+
}
279+
275280
const chainedPropType = getChained(prop.type);
276281

277282
if (

packages/material-ui-lab/src/Pagination/Pagination.js

Lines changed: 16 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -27,19 +27,31 @@ function defaultGetAriaLabel(type, page, selected) {
2727
}
2828

2929
const Pagination = React.forwardRef(function Pagination(props, ref) {
30+
/* eslint-disable no-unused-vars */
3031
const {
32+
boundaryCount = 1,
3133
children,
3234
classes,
3335
className,
3436
color = 'standard',
37+
count = 1,
38+
defaultPage = 1,
39+
disabled = false,
3540
getItemAriaLabel: getAriaLabel = defaultGetAriaLabel,
36-
items,
41+
hideNextButton = false,
42+
hidePrevButton = false,
3743
renderItem = item => <PaginationItem {...item} />,
3844
shape = 'round',
45+
showFirstButton = false,
46+
showLastButton = false,
47+
siblingCount = 1,
3948
size = 'medium',
4049
variant = 'text',
4150
...other
42-
} = usePagination({ ...props, componentName: 'Pagination' });
51+
} = props;
52+
/* eslint-enable no-unused-vars */
53+
54+
const { items } = usePagination({ ...props, componentName: 'Pagination' });
4355

4456
return (
4557
<nav
@@ -134,7 +146,7 @@ Pagination.propTypes = {
134146
/**
135147
* Render the item.
136148
*
137-
* @param {object} params
149+
* @param {object} params The props to spread on a PaginationItem.
138150
* @returns {ReactNode}
139151
*/
140152
renderItem: PropTypes.func,
@@ -153,7 +165,7 @@ Pagination.propTypes = {
153165
/**
154166
* Number of always visible pages before and after the current page.
155167
*/
156-
siblingRange: PropTypes.number,
168+
siblingCount: PropTypes.number,
157169
/**
158170
* The size of the pagination component.
159171
*/

packages/material-ui-lab/src/Pagination/Pagination.test.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,10 @@ import Pagination from './Pagination';
88
describe('<Pagination />', () => {
99
let classes;
1010
let mount;
11-
const render = createClientRender({ strict: false });
11+
const render = createClientRender();
1212

1313
before(() => {
14-
mount = createMount();
14+
mount = createMount({ strict: true });
1515
classes = getClasses(<Pagination />);
1616
});
1717

packages/material-ui-lab/src/PaginationItem/PaginationItem.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -204,7 +204,7 @@ const PaginationItem = React.forwardRef(function PaginationItem(props, ref) {
204204
shape = 'round',
205205
size = 'medium',
206206
type = 'page',
207-
variant,
207+
variant = 'text',
208208
...other
209209
} = props;
210210

@@ -286,7 +286,7 @@ PaginationItem.propTypes = {
286286
* The size of the pagination item.
287287
*/
288288
size: PropTypes.oneOf(['small', 'medium', 'large']),
289-
/*
289+
/**
290290
* The type of pagination item.
291291
*/
292292
type: PropTypes.oneOf([
@@ -298,7 +298,7 @@ PaginationItem.propTypes = {
298298
'start-ellipsis',
299299
'end-ellipsis',
300300
]),
301-
/*
301+
/**
302302
* The pagination item variant.
303303
*/
304304
variant: PropTypes.oneOf(['text', 'outlined']),

packages/material-ui-lab/src/PaginationItem/PaginationItem.test.js

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,10 @@ import PaginationItem from './PaginationItem';
88
describe('<PaginationItem />', () => {
99
let classes;
1010
let mount;
11-
const render = createClientRender({ strict: false });
11+
const render = createClientRender();
1212

1313
before(() => {
14-
mount = createMount();
14+
mount = createMount({ strict: true });
1515
classes = getClasses(<PaginationItem />);
1616
});
1717

@@ -55,10 +55,10 @@ describe('<PaginationItem />', () => {
5555
</PaginationItem>,
5656
);
5757

58-
const rootNode = getByTestId('root');
59-
expect(rootNode).to.have.class(classes.root);
60-
expect(rootNode).to.have.class(classes.sizeSmall);
61-
expect(rootNode).not.to.have.class(classes.sizeLarge);
58+
const root = getByTestId('root');
59+
expect(root).to.have.class(classes.root);
60+
expect(root).to.have.class(classes.sizeSmall);
61+
expect(root).not.to.have.class(classes.sizeLarge);
6262
});
6363

6464
it('should render a large button', () => {
@@ -68,9 +68,9 @@ describe('<PaginationItem />', () => {
6868
</PaginationItem>,
6969
);
7070

71-
const rootNode = getByTestId('root');
72-
expect(rootNode).to.have.class(classes.root);
73-
expect(rootNode).not.to.have.class(classes.sizeSmall);
74-
expect(rootNode).to.have.class(classes.sizeLarge);
71+
const root = getByTestId('root');
72+
expect(root).to.have.class(classes.root);
73+
expect(root).not.to.have.class(classes.sizeSmall);
74+
expect(root).to.have.class(classes.sizeLarge);
7575
});
7676
});

packages/material-ui-lab/src/Rating/Rating.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ export const styles = theme => ({
4040
cursor: 'pointer',
4141
WebkitTapHighlightColor: 'transparent',
4242
'&$disabled': {
43-
opacity: theme.palette.action.disabledOpacity,
43+
opacity: 0.5,
4444
pointerEvents: 'none',
4545
},
4646
'&$focusVisible $iconActive': {

packages/material-ui-lab/src/ToggleButton/ToggleButton.test.js

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -54,10 +54,10 @@ describe('<ToggleButton />', () => {
5454
</ToggleButton>,
5555
);
5656

57-
const rootNode = getByTestId('root');
58-
expect(rootNode).to.have.class(classes.root);
59-
expect(rootNode).to.have.class(classes.sizeSmall);
60-
expect(rootNode).not.to.have.class(classes.sizeLarge);
57+
const root = getByTestId('root');
58+
expect(root).to.have.class(classes.root);
59+
expect(root).to.have.class(classes.sizeSmall);
60+
expect(root).not.to.have.class(classes.sizeLarge);
6161
});
6262

6363
it('should render a large button', () => {
@@ -67,10 +67,10 @@ describe('<ToggleButton />', () => {
6767
</ToggleButton>,
6868
);
6969

70-
const rootNode = getByTestId('root');
71-
expect(rootNode).to.have.class(classes.root);
72-
expect(rootNode).not.to.have.class(classes.sizeSmall);
73-
expect(rootNode).to.have.class(classes.sizeLarge);
70+
const root = getByTestId('root');
71+
expect(root).to.have.class(classes.root);
72+
expect(root).not.to.have.class(classes.sizeSmall);
73+
expect(root).to.have.class(classes.sizeLarge);
7474
});
7575

7676
describe('prop: onChange', () => {

0 commit comments

Comments
 (0)