feat: Exposes additional props for pagination component on transfer (#33954)

* Exposes additional props for pagination component on transfer

* feat: Improve transfer pagination customization

* feat: Improve transfer pagination customization

components/transfer/ListBody.tsx

@@ -24,6 +24,9 @@ function parsePagination(pagination?: PaginationType) {
 
   const defaultPagination = {
     pageSize: 10,
+    simple: true,
+    showSizeChanger: false,
+    showLessItems: false,
   };
 
   if (typeof pagination === 'object') {
@@ -116,7 +119,9 @@ class ListBody<RecordType extends KeyWiseTransferItem> extends React.Component<
     if (mergedPagination) {
       paginationNode = (
         <Pagination
-          simple
+          simple={mergedPagination.simple}
+          showSizeChanger={mergedPagination.showSizeChanger}
+          showLessItems={mergedPagination.showLessItems}
           size="small"
           disabled={globalDisabled}
           className={`${prefixCls}-pagination`}

components/transfer/index.en-US.md

@@ -30,7 +30,7 @@ One or more elements can be selected from either column, one click on the proper
 | oneWay | Display as single direction style | boolean | false | 4.3.0 |
 | operations | A set of operations that are sorted from top to bottom | string\[] | \[`>`, `<`] |  |
 | operationStyle | A custom CSS style used for rendering the operations column | object | - |  |
-| pagination | Use pagination. Not work in render props | boolean \| { pageSize: number } | false | 4.3.0 |
+| pagination | Use pagination. Not work in render props | boolean \| { pageSize: number, simple: boolean, showSizeChanger?: boolean, showLessItems?: boolean } | false | 4.3.0 |
 | render | The function to generate the item shown on a column. Based on an record (element of the dataSource array), this function should return a React element which is generated from that record. Also, it can return a plain object with `value` and `label`, `label` is a React element and `value` is for title | (record) => ReactNode | - |  |
 | selectAllLabels | A set of customized labels for select all checkboxs on the header | (ReactNode \| (info: { selectedCount: number, totalCount: number }) => ReactNode)\[] | - |  |
 | selectedKeys | A set of keys of selected items | string\[] | \[] |  |

components/transfer/index.zh-CN.md

@@ -33,7 +33,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/QAXskNI4G/Transfer.svg
 | oneWay | 展示为单向样式 | boolean | false | 4.3.0 |
 | operations | 操作文案集合，顺序从上至下 | string\[] | \[`>`, `<`] |  |
 | operationStyle | 操作栏的自定义样式 | CSSProperties | - |  |
-| pagination | 使用分页样式，自定义渲染列表下无效 | boolean \| { pageSize: number } | false | 4.3.0 |
+| pagination | 使用分页样式，自定义渲染列表下无效 | boolean \| { pageSize: number, simple: boolean, showSizeChanger?: boolean, showLessItems?: boolean } | false | 4.3.0 |
 | render | 每行数据渲染函数，该函数的入参为 `dataSource` 中的项，返回值为 ReactElement。或者返回一个普通对象，其中 `label` 字段为 ReactElement，`value` 字段为 title | (record) => ReactNode | - |  |
 | selectAllLabels | 自定义顶部多选框标题的集合 | (ReactNode \| (info: { selectedCount: number, totalCount: number }) => ReactNode)\[] | - |  |
 | selectedKeys | 设置哪些项应该被选中 | string\[] | \[] |  |

components/transfer/interface.ts

@@ -2,4 +2,7 @@ export type PaginationType =
   | boolean
   | {
       pageSize?: number;
+      simple?: boolean;
+      showSizeChanger?: boolean;
+      showLessItems?: boolean;
     };