diff --git a/docs/pages/api/alert.md b/docs/pages/api/alert.md index 9e75271b5427ae..57c99b5319b832 100644 --- a/docs/pages/api/alert.md +++ b/docs/pages/api/alert.md @@ -30,7 +30,7 @@ You can learn more about the difference by [reading this guide](/guides/minimizi | closeText | string | 'Close' | Override the default label for the *close popup* icon button.
For localization purposes, you can use the provided [translations](/guides/localization/). | | color | 'error'
| 'info'
| 'success'
| 'warning' | | The main color for the alert. Unless provided, the value is taken from the `severity` prop. | | icon | node | | Override the icon displayed before the children. Unless provided, the icon is mapped to the value of the `severity` prop. | -| iconMapping | { error?: node, info?: node, success?: node, warning?: node } | { success: <SuccessOutlinedIcon fontSize="inherit" />, warning: <ReportProblemOutlinedIcon fontSize="inherit" />, error: <ErrorOutlineIcon fontSize="inherit" />, info: <InfoOutlinedIcon fontSize="inherit" />,} | The component maps the `severity` prop to a range of different icons, for instance success to ``. If you wish to change this mapping, you can provide your own. Alternatively, you can use the `icon` prop to override the icon displayed. | +| iconMapping | { error?: node, info?: node, success?: node, warning?: node } | | The component maps the `severity` prop to a range of different icons, for instance success to ``. If you wish to change this mapping, you can provide your own. Alternatively, you can use the `icon` prop to override the icon displayed. | | onClose | func | | 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.

**Signature:**
`function(event: object) => void`
*event:* The event source of the callback. | | role | string | 'alert' | The ARIA role attribute of the element. | | severity | 'error'
| 'info'
| 'success'
| 'warning' | 'success' | The severity of the alert. This defines the color and icon used. | diff --git a/docs/pages/api/pagination-item.md b/docs/pages/api/pagination-item.md index ab6aa472a05c9d..0f76a6fe296ad4 100644 --- a/docs/pages/api/pagination-item.md +++ b/docs/pages/api/pagination-item.md @@ -31,8 +31,8 @@ You can learn more about the difference by [reading this guide](/guides/minimizi | selected | bool | false | If `true` the pagination item is selected. | | shape | 'round'
| 'rounded' | 'round' | The shape of the pagination item. | | size | 'small'
| 'medium'
| 'large' | 'medium' | The size of the pagination item. | -| type | 'page'
| 'first'
| 'last'
| 'next'
| 'previous'
| 'start-ellipsis'
| 'end-ellipsis' | 'page' | | -| variant | 'text'
| 'outlined' | | | +| type | 'page'
| 'first'
| 'last'
| 'next'
| 'previous'
| 'start-ellipsis'
| 'end-ellipsis' | 'page' | The type of pagination item. | +| variant | 'text'
| 'outlined' | 'text' | The pagination item variant. | The `ref` is forwarded to the root element. diff --git a/docs/pages/api/pagination.md b/docs/pages/api/pagination.md index f0f25c10153a4b..e917e2c0423fcc 100644 --- a/docs/pages/api/pagination.md +++ b/docs/pages/api/pagination.md @@ -24,25 +24,25 @@ You can learn more about the difference by [reading this guide](/guides/minimizi | Name | Type | Default | Description | |:-----|:-----|:--------|:------------| -| boundaryCount | number | | Number of always visible pages at the beginning and end. | +| boundaryCount | number | 1 | Number of always visible pages at the beginning and end. | | children | node | | Pagination items. | | classes | object | | Override or extend the styles applied to the component. See [CSS API](#css) below for more details. | -| color | 'default'
| 'primary'
| 'secondary' | | The active color. | -| count | number | | The total number of pages. | -| defaultPage | number | | The page selected by default when the component is uncontrolled. | -| disabled | bool | | If `true`, all the pagination component will be disabled. | +| color | 'default'
| 'primary'
| 'secondary' | 'standard' | The active color. | +| count | number | 1 | The total number of pages. | +| defaultPage | number | 1 | The page selected by default when the component is uncontrolled. | +| disabled | bool | false | If `true`, all the pagination component will be disabled. | | getItemAriaLabel | func | | Accepts a function which returns a string value that provides a user-friendly name for the current page.
For localization purposes, you can use the provided [translations](/guides/localization/).

**Signature:**
`function(type?: string, page: number, selected: bool) => string`
*type:* The link or button type to format ('page' | 'first' | 'last' | 'next' | 'previous').
*page:* The page number to format.
*selected:* If true, the current page is selected. | -| hideNextButton | bool | | If `true`, hide the next-page button. | -| hidePrevButton | bool | | If `true`, hide the previous-page button. | +| hideNextButton | bool | false | If `true`, hide the next-page button. | +| hidePrevButton | bool | false | If `true`, hide the previous-page button. | | onChange | func | | Callback fired when the page is changed.

**Signature:**
`function(event: object, page: number) => void`
*event:* The event source of the callback.
*page:* The page selected. | | page | number | | The current page. | -| renderItem | func | | Render the item.

**Signature:**
`function(params: object) => ReactNode`
*params:* null | -| shape | 'round'
| 'rounded' | | The shape of the pagination items. | -| showFirstButton | bool | | If `true`, show the first-page button. | -| showLastButton | bool | | If `true`, show the last-page button. | -| siblingRange | number | | Number of always visible pages before and after the current page. | -| size | 'small'
| 'medium'
| 'large' | | The size of the pagination component. | -| variant | 'text'
| 'outlined' | | The variant to use. | +| renderItem | func | item => <PaginationItem {...item} /> | Render the item.

**Signature:**
`function(params: object) => ReactNode`
*params:* The props to spread on a PaginationItem. | +| shape | 'round'
| 'rounded' | 'round' | The shape of the pagination items. | +| showFirstButton | bool | false | If `true`, show the first-page button. | +| showLastButton | bool | false | If `true`, show the last-page button. | +| siblingCount | number | 1 | Number of always visible pages before and after the current page. | +| size | 'small'
| 'medium'
| 'large' | 'medium' | The size of the pagination component. | +| variant | 'text'
| 'outlined' | 'text' | The variant to use. | The `ref` is forwarded to the root element. diff --git a/docs/src/modules/utils/generateMarkdown.js b/docs/src/modules/utils/generateMarkdown.js index eceda588d4048d..f504b7f2c170ce 100644 --- a/docs/src/modules/utils/generateMarkdown.js +++ b/docs/src/modules/utils/generateMarkdown.js @@ -272,6 +272,11 @@ function generateProps(reactAPI) { )}`; } + // Give up + if (defaultValue.length > 180) { + defaultValue = ''; + } + const chainedPropType = getChained(prop.type); if ( diff --git a/packages/material-ui-lab/src/Pagination/Pagination.js b/packages/material-ui-lab/src/Pagination/Pagination.js index 2dae66082442da..0d975e04be8f0d 100644 --- a/packages/material-ui-lab/src/Pagination/Pagination.js +++ b/packages/material-ui-lab/src/Pagination/Pagination.js @@ -27,19 +27,31 @@ function defaultGetAriaLabel(type, page, selected) { } const Pagination = React.forwardRef(function Pagination(props, ref) { + /* eslint-disable no-unused-vars */ const { + boundaryCount = 1, children, classes, className, color = 'standard', + count = 1, + defaultPage = 1, + disabled = false, getItemAriaLabel: getAriaLabel = defaultGetAriaLabel, - items, + hideNextButton = false, + hidePrevButton = false, renderItem = item => , shape = 'round', + showFirstButton = false, + showLastButton = false, + siblingCount = 1, size = 'medium', variant = 'text', ...other - } = usePagination({ ...props, componentName: 'Pagination' }); + } = props; + /* eslint-enable no-unused-vars */ + + const { items } = usePagination({ ...props, componentName: 'Pagination' }); return (