Skip to content

Commit 95d572b

Browse files
prakashks20prakashks20
committed
Code review changes
1 parent dd7c656 commit 95d572b

File tree

10 files changed

+414
-56
lines changed

10 files changed

+414
-56
lines changed

‎README.md‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -62,8 +62,7 @@ ReactDOM.render(<Pagination />, container);
6262
| defaultPageSize | default items per page | Number | 10 |
6363
| pageSize | items per page | Number | 10 |
6464
| onChange | page change callback | Function(current, pageSize) | - |
65-
| showSizeChanger | show pageSize changer | Bool | `false` when total less then `totalBoundaryShowSizeChanger`, `true` when otherwise |
66-
| pageSizeChanger | Specify `options` as sizeChanger selections. `showSearch` in the sizeChanger Select component allows searching the size, with the default value being false. `onChange` returns the size change value only through the callback function. | Object -> { options: ['10', '20', '50', '100'], showSearch: false, onChange: Function(size) } | { showSearch: false } |
65+
| showSizeChanger | show pageSize changer | Boolean or Object => { options: ['10', '20', '50', '100'], showSearch: false, onChange: Function(size) } | `false` when the total is less than `totalBoundaryShowSizeChanger`, `true` otherwise, or specify `options` as sizeChanger selections. `showSearch` in the sizeChanger Select component allows searching the size, with the default value being false. `onChange` returns the size change value only through the callback function. The object should be formatted as: `{ options: ['10', '20', '50', '100'], showSearch: false, onChange: Function(size) }`. The value can be either `true/false` or `{ showSearch: false, options:['10', '20', '50', '100'], onChange: (size: number) => void }`. |
6766
| totalBoundaryShowSizeChanger | when total larger than it, `showSizeChanger` will be true | number | 50 |
6867
| pageSizeOptions | specify the sizeChanger selections | Array<String> | ['10', '20', '50', '100'] |
6968
| onShowSizeChange | pageSize change callback | Function(current, size) | - |

‎docs/demo/pageSizeChanger.md‎

Lines changed: 0 additions & 8 deletions
This file was deleted.

‎docs/demo/showSizeChanger.md‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
---
2+
title: showSizeChanger
3+
nav:
4+
title: Demo
5+
path: /demo
6+
---
7+
8+
<code src="../examples/showSizeChanger.tsx"></code>

‎docs/examples/pageSizeChanger.tsx‎ renamed to ‎docs/examples/showSizeChanger.tsx‎

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,14 +10,25 @@ export default () => {
1010

1111
return (
1212
<>
13+
<Pagination
14+
defaultCurrent={1}
15+
total={50}
16+
selectComponentClass={Select}
17+
showSizeChanger={false}
18+
/>
1319
<Pagination
1420
defaultCurrent={1}
1521
total={50}
1622
selectComponentClass={Select}
1723
showSizeChanger
18-
pageSizeChanger={{
24+
/>
25+
<Pagination
26+
defaultCurrent={1}
27+
total={50}
28+
selectComponentClass={Select}
29+
showSizeChanger={{
1930
options: [10, 25, 50, 75, 100],
20-
showSearch: false,
31+
showSearch: true,
2132
onChange: pageSizeOnChange,
2233
}}
2334
/>

‎src/Options.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,9 @@ const Options: React.FC<OptionsProps> = (props) => {
6363

6464
const changeSizeHandle = (value: number) => {
6565
changeSize?.(Number(value));
66-
onChange?.(Number(value));
66+
if (onChange && typeof onChange === 'function') {
67+
onChange?.(Number(value));
68+
}
6769
};
6870

6971
const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {

‎src/Pagination.tsx‎

Lines changed: 3 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -16,10 +16,6 @@ const defaultItemRender: PaginationProps['itemRender'] = (
1616
element,
1717
) => element;
1818

19-
const defaultPageSizeChanger: PaginationProps['pageSizeChanger'] = {
20-
showSearch: false,
21-
};
22-
2319
function noop() {}
2420

2521
function isInteger(v: number) {
@@ -69,7 +65,6 @@ const Pagination: React.FC<PaginationProps> = (props) => {
6965
showTotal,
7066
showSizeChanger: showSizeChangerProp,
7167
pageSizeOptions,
72-
pageSizeChanger = defaultPageSizeChanger,
7368

7469
// render
7570
itemRender = defaultItemRender,
@@ -593,11 +588,11 @@ const Pagination: React.FC<PaginationProps> = (props) => {
593588
selectPrefixCls={selectPrefixCls}
594589
changeSize={showSizeChanger ? changePageSize : null}
595590
pageSize={pageSize}
596-
pageSizeOptions={pageSizeOptions || pageSizeChanger?.options}
591+
pageSizeOptions={(typeof showSizeChanger === 'object' && showSizeChanger?.options) || pageSizeOptions}
597592
quickGo={shouldDisplayQuickJumper ? handleChange : null}
598593
goButton={gotoButton}
599-
onChange={pageSizeChanger?.onChange}
600-
showSearch={pageSizeChanger?.showSearch}
594+
onChange={typeof showSizeChanger === 'object' && showSizeChanger?.onChange}
595+
showSearch={Boolean(typeof showSizeChanger === 'object' && showSizeChanger?.showSearch)}
601596
/>
602597
</ul>
603598
);

‎src/interface.ts‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ export interface PaginationLocale {
1717
page_size?: string;
1818
}
1919

20-
export interface pageSizeChangerLocale {
20+
export interface showSizeChangerLocale {
2121
options?: string[] | number[];
2222
showSearch?: boolean;
2323
onChange?: (size: number) => void;
@@ -28,7 +28,6 @@ export interface PaginationData {
2828
selectPrefixCls: string;
2929
prefixCls: string;
3030
pageSizeOptions: string[] | number[];
31-
pageSizeChanger: pageSizeChangerLocale;
3231

3332
current: number;
3433
defaultCurrent: number;
@@ -39,7 +38,7 @@ export interface PaginationData {
3938

4039
hideOnSinglePage: boolean;
4140
align: 'start' | 'center' | 'end';
42-
showSizeChanger: boolean;
41+
showSizeChanger: boolean | showSizeChangerLocale;
4342
showLessItems: boolean;
4443
showPrevNextJumpers: boolean;
4544
showQuickJumper: boolean | object;

0 commit comments

Comments
 (0)