refactor(pagination): select-props prop

CHANGELOG.en-US.md

@@ -6,7 +6,7 @@
 
 - `n-badge` adds `offset` prop, closes [#4149](https://github.com/tusen-ai/naive-ui/issues/4149).
 - `n-card` adds `tag` prop
-- `n-pagination` add `consistent-menu-width` prop, closes [#4199](https://github.com/tusen-ai/naive-ui/issues/4199)
+- `n-pagination` adds `select-props` prop, closes [#4199](https://github.com/tusen-ai/naive-ui/issues/4199).
 
 ### Fixes
 

CHANGELOG.zh-CN.md

@@ -6,7 +6,7 @@
 
 - `n-badge` 新增 `offset` 属性，关闭 [#4149](https://github.com/tusen-ai/naive-ui/issues/4149)
 - `n-card` 新增 `tag` 属性
-- `n-pagination` 新增 `consistent-menu-width` 属性，关闭[#4199](https://github.com/tusen-ai/naive-ui/issues/4199)
+- `n-pagination` 新增 `select-props` 属性，关闭[#4199](https://github.com/tusen-ai/naive-ui/issues/4199)
 
 ### Fixes
 

src/pagination/demos/enUS/index.demo-entry.md

@@ -39,8 +39,8 @@ page-size-option.vue
 | page-size | `number` | `undefined` | Page size in controlled mode. |  |
 | page-slot | `number` | `9` | The number of pages displayed. |  |
 | page | `number` | `undefined` | Current page in controlled mode. |  |
-| consistent-menu-width | `boolean` | `false` | The consistent-menu-width property of the drop-down page data selector | NEXT_VERSION |
 | prefix | `(info: PaginationInfo) => VNodeChild` | `undefined` | Paging prefix. |  |
+| select-props | `SelectProps` | `undefined` | Page size select's props. | NEXT_VERSION |
 | show-quick-jumper | `boolean` | `false` | Whether to show fast jump. |  |
 | size | `'small' \| 'medium' \| 'large'` | `'medium'` | size of page item. | 2.29.0 |
 | simple | `boolean` | `false` | Whether to use simple mode. | 2.32.2 |

src/pagination/demos/zhCN/index.demo-entry.md

@@ -41,8 +41,8 @@ rtl-debug.vue
 | page-size | `number` | `undefined` | 受控模式下的分页大小 |  |
 | page-slot | `number` | `9` | 页码显示的个数 |  |
 | page | `number` | `undefined` | 受控模式下的当前页 |  |
-| consistent-menu-width | `boolean` | `false` | 下拉页数据选择器的 consistent-menu-width 属性 | NEXT_VERSION |
 | prefix | `(info: PaginationInfo) => VNodeChild` | `undefined` | 分页前缀 |  |
+| select-props | `SelectProps` | `undefined` | Page size select's props. | NEXT_VERSION |
 | show-quick-jumper | `boolean` | `false` | 是否显示快速跳转 |  |
 | size | `'small' \| 'medium' \| 'large'` | `'medium'` | 分页按钮的大小 | 2.29.0 |
 | simple | `boolean` | `false` | 是否显示为简单分页 | 2.32.2 |

src/pagination/src/Pagination.tsx

@@ -15,6 +15,7 @@ import {
 import { useMergedState } from 'vooks'
 import { NPopselect } from '../../popselect'
 import { NSelect } from '../../select'
+import type { SelectProps } from '../../select'
 import { NInput } from '../../input'
 import { NBaseIcon } from '../../_internal'
 import {
@@ -87,10 +88,7 @@ export const paginationProps = {
     type: Number,
     default: 9
   },
-  consistentMenuWidth: {
-    type: Boolean,
-    default: false
-  },
+  selectProps: Object as PropType<SelectProps>,
   prev: Function as PropType<RenderPrev>,
   next: Function as PropType<RenderNext>,
   prefix: Function as PropType<RenderPrefix>,
@@ -520,7 +518,6 @@ export default defineComponent({
       showFastBackwardMenu: showFastBackwardMenuRef,
       fastForwardActive: fastForwardActiveRef,
       fastBackwardActive: fastBackwardActiveRef,
-      consistentMenuWidth: props.consistentMenuWidth,
       handleMenuSelect,
       handleFastForwardMouseenter,
       handleFastForwardMouseleave,
@@ -866,9 +863,11 @@ export default defineComponent({
             case 'size-picker': {
               return !simple && showSizePicker ? (
                 <NSelect
-                  to={this.to}
+                  consistentMenuWidth={false}
                   placeholder=""
                   showCheckmark={false}
+                  to={this.to}
+                  {...this.selectProps}
                   size={selectSize}
                   options={pageSizeOptions}
                   value={mergedPageSize}
@@ -876,7 +875,6 @@ export default defineComponent({
                   theme={mergedTheme.peers.Select}
                   themeOverrides={mergedTheme.peerOverrides.Select}
                   onUpdateValue={handleSizePickerChange}
-                  consistentMenuWidth={this.consistentMenuWidth}
                 />
               ) : null
             }