diff --git a/.dumirc.ts b/.dumirc.ts new file mode 100644 index 00000000..d017cabd --- /dev/null +++ b/.dumirc.ts @@ -0,0 +1,10 @@ +import { defineConfig } from 'dumi'; + +export default defineConfig({ + favicons: ['https://avatars0.githubusercontent.com/u/9441414?s=200&v=4'], + themeConfig: { + name: 'Pagination', + logo: 'https://avatars0.githubusercontent.com/u/9441414?s=200&v=4', + }, + outputPath: 'docs-dist', +}); diff --git a/.editorconfig b/.editorconfig deleted file mode 100644 index 604c94ef..00000000 --- a/.editorconfig +++ /dev/null @@ -1,9 +0,0 @@ -# top-most EditorConfig file -root = true - -# Unix-style newlines with a newline ending every file -[*.{js,css}] -end_of_line = lf -insert_final_newline = true -indent_style = space -indent_size = 2 diff --git a/.eslintignore b/.eslintignore deleted file mode 100644 index 3c3629e6..00000000 --- a/.eslintignore +++ /dev/null @@ -1 +0,0 @@ -node_modules diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 00000000..53bb6cbc --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,12 @@ +module.exports = { + extends: [require.resolve('@umijs/fabric/dist/eslint')], + rules: { + 'no-template-curly-in-string': 0, + 'prefer-promise-reject-errors': 0, + 'react/no-array-index-key': 0, + 'react/sort-comp': 0, + '@typescript-eslint/no-explicit-any': 0, + 'jsx-a11y/role-supports-aria-props': 0, + 'jsx-a11y/no-noninteractive-tabindex': 0, + }, +}; diff --git a/.fatherrc.js b/.fatherrc.js new file mode 100644 index 00000000..96268ae1 --- /dev/null +++ b/.fatherrc.js @@ -0,0 +1,5 @@ +import { defineConfig } from 'father'; + +export default defineConfig({ + plugins: ['@rc-component/father-plugin'], +}); diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml new file mode 100644 index 00000000..33b1999c --- /dev/null +++ b/.github/FUNDING.yml @@ -0,0 +1,15 @@ +# These are supported funding model platforms + +github: ant-design # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, user2] +patreon: # Replace with a single Patreon username +open_collective: ant-design # Replace with a single Open Collective username +ko_fi: # Replace with a single Ko-fi username +tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel +community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry +liberapay: # Replace with a single Liberapay username +issuehunt: # Replace with a single IssueHunt username +lfx_crowdfunding: # Replace with a single LFX Crowdfunding project-name e.g., cloud-foundry +polar: # Replace with a single Polar username +buy_me_a_coffee: # Replace with a single Buy Me a Coffee username +thanks_dev: # Replace with a single thanks.dev username +custom: # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2'] diff --git a/.github/dependabot.yml b/.github/dependabot.yml new file mode 100644 index 00000000..b4cee470 --- /dev/null +++ b/.github/dependabot.yml @@ -0,0 +1,15 @@ +version: 2 +updates: +- package-ecosystem: npm + directory: "/" + schedule: + interval: daily + time: "21:00" + open-pull-requests-limit: 10 + ignore: + - dependency-name: react-dom + versions: + - 17.0.1 + - dependency-name: less + versions: + - 4.1.0 diff --git a/.github/workflows/codeql.yml b/.github/workflows/codeql.yml new file mode 100644 index 00000000..f9ed7d8f --- /dev/null +++ b/.github/workflows/codeql.yml @@ -0,0 +1,41 @@ +name: "CodeQL" + +on: + push: + branches: [ "master" ] + pull_request: + branches: [ "master" ] + schedule: + - cron: "21 9 * * 6" + +jobs: + analyze: + name: Analyze + runs-on: ubuntu-latest + permissions: + actions: read + contents: read + security-events: write + + strategy: + fail-fast: false + matrix: + language: [ javascript ] + + steps: + - name: Checkout + uses: actions/checkout@v3 + + - name: Initialize CodeQL + uses: github/codeql-action/init@v2 + with: + languages: ${{ matrix.language }} + queries: +security-and-quality + + - name: Autobuild + uses: github/codeql-action/autobuild@v2 + + - name: Perform CodeQL Analysis + uses: github/codeql-action/analyze@v2 + with: + category: "/language:${{ matrix.language }}" diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml new file mode 100644 index 00000000..5735e2d2 --- /dev/null +++ b/.github/workflows/main.yml @@ -0,0 +1,6 @@ +name: ✅ test +on: [push, pull_request] +jobs: + test: + uses: react-component/rc-test/.github/workflows/test.yml@main + secrets: inherit \ No newline at end of file diff --git a/.gitignore b/.gitignore index 6ba367c1..36e64185 100644 --- a/.gitignore +++ b/.gitignore @@ -1,6 +1,6 @@ +.storybook *.iml *.log -*.log.* .idea/ .ipr .iws @@ -21,11 +21,26 @@ Thumbs.db .build node_modules .cache -dist assets/**/*.css build lib es -.vscode -coverage/ yarn.lock +package-lock.json +pnpm-lock.yaml +coverage/ +.doc +dist +docs-dist +.vscode +# umi +.umi +.umi-production +.umi-test +.env.local + +# dumi +.dumi/tmp +.dumi/tmp-production + +bun.lockb \ No newline at end of file diff --git a/.husky/pre-commit b/.husky/pre-commit new file mode 100755 index 00000000..c27d8893 --- /dev/null +++ b/.husky/pre-commit @@ -0,0 +1 @@ +lint-staged diff --git a/.npmignore b/.npmignore new file mode 100644 index 00000000..8db6ebd6 --- /dev/null +++ b/.npmignore @@ -0,0 +1,29 @@ +build/ +*.cfg +nohup.out +*.iml +.idea/ +.ipr +.iws +*~ +~* +*.diff +*.log +*.patch +*.bak +.DS_Store +Thumbs.db +.project +.*proj +.svn/ +*.swp +out/ +.build +node_modules +.cache +examples +tests +src +/index.js +.* +assets/**/*.less \ No newline at end of file diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 00000000..e1497d59 --- /dev/null +++ b/.prettierignore @@ -0,0 +1,12 @@ +.storybook +node_modules +lib +es +.cache +package.json +package-lock.json +public +.site +_site +.umi +.doc diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 00000000..27dd8afb --- /dev/null +++ b/.prettierrc @@ -0,0 +1,7 @@ +{ + "endOfLine": "lf", + "semi": true, + "singleQuote": true, + "tabWidth": 2, + "trailingComma": "all" +} diff --git a/.travis.yml b/.travis.yml deleted file mode 100644 index fbc62f81..00000000 --- a/.travis.yml +++ /dev/null @@ -1,19 +0,0 @@ -language: node_js - -sudo: false - -node_js: -- 11 - -script: -- | - if [ "$TEST_TYPE" = test ]; then - npm test - else - npm run $TEST_TYPE - fi -env: - matrix: - - TEST_TYPE=lint - - TEST_TYPE=test - - TEST_TYPE=coverage diff --git a/CHANGELOG.md b/CHANGELOG.md new file mode 100644 index 00000000..e4c9aa75 --- /dev/null +++ b/CHANGELOG.md @@ -0,0 +1,114 @@ +# 2.2.0 + +- Add prop `totalBoundaryShowSizeChanger`. +- Fix items count not being consistent. [#18201](https://github.com/ant-design/ant-design/issues/18201) +- Update default page size options from `10,25,50,100` to `10,20,50,100`. + +# 2.1.0 + +- When `total` is greater then 100, will show size changer defaultly. +- Update default page size options from `10,20,30,40` to `10,25,50,100`. + +# 2.0.0 + +- Remove `prop-types` and `react-lifecycles-compat` + + # 1.20.0 + +- Add locale `ms_MY` + + # 1.19.0 + +- Support Latvian localization + + # 1.18.0 + +- Support `disabled` + + # 1.17.0 + +- Add `prevIcon`, `nextIcon`, `jumpPrevIcon`, `jumpNextIcon`. + + # 1.16.1 + +- Add locale `sl_SI`. #130 + + # 1.16.0 + +- Add locale `id_ID` +- Add prop `showPrevNextJumpers` + + # 1.15.2 + +- Add locale `tr_TR`. + + # 1.12.0 + +- `itemRender(current, type)` => `itemRender(current, type, element): element`. + + # 1.11.0 + +- Add `goButton`. + + # 1.10.0 + +- Add `itemRender`. + + # 1.9.0 + +- Add keyboard support +- Add es folder. + + # 1.8.0 + +- Add locale `zh_TW`. +- Add `showTitle`. + + # 1.7.5 + +- Add locale `sk_SK(Slovak)`. + + # 1.7.4 + +- Add locale `et_EE(Estonian)`. + + # 1.7.3 + +- Add locale `Czech`. + + # 1.7.2 + +- Add locale `ko_KR(Korean)`. + + # 1.7.1 + +- Add locale `ca_ES (Catalan)`. + + # 1.7.0 + +- support `showLessItems`. #55 +- Add `pageSize` as onChange's second argument. + + # 1.6.0 + +- Add `range` as showTotal's second argument. + + # 1.5.5 / 2016-09-01 + +- Fix #34 + + # 1.5.4 / 2016-07-31 + +- Add space before per page #33 + + # 1.5.0 / 2016-03-02 + +- Add `defaultPageSize` and fix `pageSize` to a controlled prop + + # 1.3.0 / 2015-11-25 + +- Add `defaultCurrent` prop + + # 1.2.0 + +- Allow specifying the page size for **sizeChanger** diff --git a/HISTORY.md b/HISTORY.md deleted file mode 100644 index 61ce1280..00000000 --- a/HISTORY.md +++ /dev/null @@ -1,123 +0,0 @@ -1.20.0 -================== - -* Add locale `ms_MY` - -1.19.0 -================== - -* Support Latvian localization - -1.18.0 -================== - -* Support `disabled` - -1.17.0 -================== - -* Add `prevIcon`, `nextIcon`, `jumpPrevIcon`, `jumpNextIcon`. - -1.16.1 -================== - -* Add locale `sl_SI`. #130 - -1.16.0 -================== - -* Add locale `id_ID` -* Add prop `showPrevNextJumpers` - -1.15.2 -================== - -* Add locale `tr_TR`. - -1.12.0 -================== - -* `itemRender(current, type)` => `itemRender(current, type, element): element`. - -1.11.0 -================== - -* Add `goButton`. - -1.10.0 -================== - -* Add `itemRender`. - -1.9.0 -================== - -* Add keyboard support -* Add es folder. - -1.8.0 -================== - -* Add locale `zh_TW`. -* Add `showTitle`. - -1.7.5 -================== - -* Add locale `sk_SK(Slovak)`. - -1.7.4 -================== - -* Add locale `et_EE(Estonian)`. - -1.7.3 -================== - -* Add locale `Czech`. - -1.7.2 -================== - -* Add locale `ko_KR(Korean)`. - -1.7.1 -================== - -* Add locale `ca_ES (Catalan)`. - -1.7.0 -================== - -* support `showLessItems`. #55 -* Add `pageSize` as onChange's second argument. - -1.6.0 -================== - -* Add `range` as showTotal's second argument. - -1.5.5 / 2016-09-01 -================== - -* Fix #34 - -1.5.4 / 2016-07-31 -================== - -* Add space before per page #33 - -1.5.0 / 2016-03-02 -================== - -* Add `defaultPageSize` and fix `pageSize` to a controlled prop - -1.3.0 / 2015-11-25 -================== - -* Add `defaultCurrent` prop - -1.2.0 -================== - -* Allow specifying the page size for **sizeChanger** diff --git a/README.md b/README.md index 33765858..43e3062a 100644 --- a/README.md +++ b/README.md @@ -1,23 +1,30 @@ # rc-pagination ---- React Pagination Component. [![NPM version][npm-image]][npm-url] -[![build status][travis-image]][travis-url] -[![Test coverage][coveralls-image]][coveralls-url] -[![Dependencies](https://img.shields.io/david/react-component/pagination.svg?style=flat-square)](https://david-dm.org/react-component/pagination) -[![DevDependencies](https://img.shields.io/david/dev/react-component/pagination.svg?style=flat-square)](https://david-dm.org/react-component/pagination?type=dev) [![npm download][download-image]][download-url] +[![build status][github-actions-image]][github-actions-url] +[![Codecov][codecov-image]][codecov-url] +[![bundle size][bundlephobia-image]][bundlephobia-url] +[![dumi][dumi-image]][dumi-url] [npm-image]: http://img.shields.io/npm/v/rc-pagination.svg?style=flat-square [npm-url]: http://npmjs.org/package/rc-pagination -[travis-image]: https://img.shields.io/travis/react-component/pagination.svg?style=flat-square -[travis-url]: https://travis-ci.org/react-component/pagination -[coveralls-image]: https://img.shields.io/coveralls/react-component/pagination.svg?style=flat-square -[coveralls-url]: https://coveralls.io/r/react-component/pagination?branch=master +[github-actions-image]: https://github.com/react-component/pagination/workflows/CI/badge.svg +[github-actions-url]: https://github.com/react-component/pagination/actions +[codecov-image]: https://img.shields.io/codecov/c/github/react-component/pagination/master.svg?style=flat-square +[codecov-url]: https://codecov.io/gh/react-component/pagination/branch/master +[david-url]: https://david-dm.org/react-component/pagination +[david-image]: https://david-dm.org/react-component/pagination/status.svg?style=flat-square +[david-dev-url]: https://david-dm.org/react-component/pagination?type=dev +[david-dev-image]: https://david-dm.org/react-component/pagination/dev-status.svg?style=flat-square [download-image]: https://img.shields.io/npm/dm/rc-pagination.svg?style=flat-square [download-url]: https://npmjs.org/package/rc-pagination +[bundlephobia-url]: https://bundlephobia.com/result?p=rc-pagination +[bundlephobia-image]: https://badgen.net/bundlephobia/minzip/rc-pagination +[dumi-url]: https://github.com/umijs/dumi +[dumi-image]: https://img.shields.io/badge/docs%20by-dumi-blue?style=flat-square ## Development @@ -26,15 +33,10 @@ npm install npm start ``` -## Example +## Examples -http://localhost:3000/examples/ - -online example: http://react-component.github.io/pagination/examples/ - -## Feature - -* support ie9,ie9+,chrome,firefox,safari +Online example: `https://pagination-react-component.vercel.app` +Local example: `npm run start` then `http://localhost:9001` ## Install @@ -43,41 +45,43 @@ online example: http://react-component.github.io/pagination/examples/ ## Usage ```js -var Pagination = require('rc-pagination'); -var React = require('react'); -React.render(, container); +import Pagination from 'rc-pagination'; + +ReactDOM.render(, container); ``` ## API -| Parameter | Description | Type | Default | -|------------------|------------------------------------|---------------|--------------------------| -| disabled | disable pagination | Bool | - | -| defaultCurrent | uncontrolled current page | Number | 1 | -| current | current page | Number | undefined | -| total | items total count | Number | 0 | -| defaultPageSize | default items per page | Number | 10 | -| pageSize | items per page | Number | 10 | -| onChange | page change callback | Function(current, pageSize) | - | -| showSizeChanger | show pageSize changer | Bool | false | -| pageSizeOptions | specify the sizeChanger selections | Array | ['10', '20', '30', '40'] | -| onShowSizeChange | pageSize change callback | Function(current, size) | - | -| hideOnSinglePage | hide on single page | Bool | false | -| showPrevNextJumpers | show jump-prev, jump-next | Bool | true | -| showQuickJumper | show quick goto jumper | Bool / Object | false / {goButton: true} | -| showTotal | show total records and range | Function(total, [from, to]) | - | -| className | className of pagination | String | - | -| simple | when set, show simple pager | Object | null | -| locale | to set l10n config | Object | [zh_CN](https://github.com/react-component/pagination/blob/master/src/locale/zh_CN.js) | -| style | the style of pagination | Object | {} | -| showLessItems | show less page items | Bool | false | -| showTitle | show page items title | Bool | true | -| itemRender | custom page item renderer | Function(current, type: 'page' | 'prev' | 'next' | 'jump-prev' | 'jump-next', element): React.ReactNode| `(current, type, element) => element` | -| prevIcon | specifict the default previous icon | ReactNode \| (props: PaginationProps) => ReactNode | | -| nextIcon | specifict the default previous icon | ReactNode \| (props: PaginationProps) => ReactNode | | -| jumpPrevIcon | specifict the default previous icon | ReactNode \| (props: PaginationProps) => ReactNode | | -| jumpNextIcon | specifict the default previous icon | ReactNode \| (props: PaginationProps) => ReactNode | | - +// prettier-ignore +| Parameter | Description | Type | Default | +| --- | --- | --- | --- | +| disabled | disable pagination | Bool | - | +| align | align of pagination | start \| center \| end | undefined | +| defaultCurrent | uncontrolled current page | Number | 1 | +| current | current page | Number | undefined | +| total | items total count | Number | 0 | +| defaultPageSize | default items per page | Number | 10 | +| pageSize | items per page | Number | 10 | +| onChange | page change callback | Function(current, pageSize) | - | +| showSizeChanger | show pageSize changer | boolean \| [SelectProps](https://github.com/react-component/select/blob/561f8b7d69fd5dd2cd7d917c88976cca4e539a9d/src/Select.tsx#L112) | `false` when total less than `totalBoundaryShowSizeChanger`, `true` when otherwise | +| totalBoundaryShowSizeChanger | when total larger than it, `showSizeChanger` will be true | number | 50 | +| pageSizeOptions | specify the sizeChanger selections | Array | ['10', '20', '50', '100'] | +| onShowSizeChange | pageSize change callback | Function(current, size) | - | +| hideOnSinglePage | hide on single page | Bool | false | +| showPrevNextJumpers | show jump-prev, jump-next | Bool | true | +| showQuickJumper | show quick goto jumper | Bool / Object | false / {goButton: true} | +| showTotal | show total records and range | Function(total, [from, to]) | - | +| className | className of pagination | String | - | +| simple | when set, show simple pager | Bool / { readOnly?: boolean; } | - | +| locale | to set l10n config | Object | [zh_CN](https://github.com/react-component/pagination/blob/master/src/locale/zh_CN.js) | +| style | the style of pagination | Object | {} | +| showLessItems | show less page items | Bool | false | +| showTitle | show page items title | Bool | true | +| itemRender | custom page item renderer | Function(current, type: 'page' \| 'prev' \| 'next' \| 'jump-prev' \| 'jump-next', element): React.ReactNode \| `(current, type, element) => element` | | +| prevIcon | specify the default previous icon | ReactNode \| (props: PaginationProps) => ReactNode | | +| nextIcon | specify the default next icon | ReactNode \| (props: PaginationProps) => ReactNode | | +| jumpPrevIcon | specify the default previous icon | ReactNode \| (props: PaginationProps) => ReactNode | | +| jumpNextIcon | specify the default next icon | ReactNode \| (props: PaginationProps) => ReactNode | | ## License diff --git a/assets/index.less b/assets/index.less index 5f10c6b5..64ceac6d 100644 --- a/assets/index.less +++ b/assets/index.less @@ -1,358 +1,342 @@ -@prefixClass: rc-pagination; - -.disabled-item() { - cursor: not-allowed; +@pagination-prefix-cls: rc-pagination; + +@primary-color: #1890ff; +@pagination-item-bg: #fff; +@pagination-item-size: 28px; +@pagination-item-size-sm: 24px; +@pagination-font-family: Arial; +@pagination-font-weight-active: 500; +@pagination-item-bg-active: #fff; +@pagination-item-link-bg: #fff; +@pagination-item-disabled-color-active: #fff; +@pagination-item-disabled-bg-active: darken(hsv(0, 0, 96%), 10%); +@pagination-item-input-bg: #fff; + +.@{pagination-prefix-cls} { + display: flex; + margin: 0; + padding: 0; + font-size: 14px; - &:hover { - border-color: #d9d9d9; - a { - color: #d9d9d9; - } + ul, + ol { + margin: 0; + padding: 0; + list-style: none; } -} -.@{prefixClass} { - font-size: 12px; - font-family: 'Arial'; - user-select: none; - padding: 0; + &-start { + justify-content: start; + } - > li { - list-style: none; + &-center { + justify-content: center; } - &-total-text { - float: left; - height: 30px; - line-height: 30px; - list-style: none; - padding: 0; - margin: 0 8px 0 0; + &-end { + justify-content: end; } - &:after { - content: " "; + &::after { display: block; - height: 0; clear: both; + height: 0; overflow: hidden; visibility: hidden; + content: ' '; + } + + &-total-text { + display: inline-block; + height: @pagination-item-size; + margin-right: 8px; + line-height: @pagination-item-size - 2px; + vertical-align: middle; } &-item { - cursor: pointer; - border-radius: 6px; - min-width: 28px; - height: 28px; - line-height: 28px; + display: inline-block; + min-width: @pagination-item-size; + height: @pagination-item-size; + margin-right: 8px; + font-family: @pagination-font-family; + line-height: @pagination-item-size - 2px; text-align: center; + vertical-align: middle; list-style: none; - float: left; + background-color: @pagination-item-bg; border: 1px solid #d9d9d9; - background-color: #fff; - margin-right: 8px; + border-radius: 2px; + outline: 0; + cursor: pointer; + user-select: none; a { - text-decoration: none; - color: #666; + display: block; + padding: 0 6px; + color: rgba(0, 0, 0, 0.85); + transition: none; + + &:hover { + text-decoration: none; + } } + &:focus, &:hover { - border-color: #2db7f5; + border-color: @primary-color; + transition: all 0.3s; a { - color: #2db7f5; + color: @primary-color; } } - &-disabled { - .disabled-item(); - } - &-active { - background-color: #2db7f5; - border-color: #2db7f5; + font-weight: @pagination-font-weight-active; + background: @pagination-item-bg-active; + border-color: @primary-color; a { - color: #fff; + color: @primary-color; } + &:focus, &:hover { - a { - color: #fff; - } + border-color: #40a9ff; + } + + &:focus a, + &:hover a { + color: #40a9ff; } } } - &-jump-prev, &-jump-next { - &:after { - content: "•••"; - display: block; - letter-spacing: 2px; - color: #ccc; - font-size: 12px; - margin-top: 1px; + &-jump-prev, + &-jump-next { + outline: 0; + + button { + background: transparent; + border: none; + cursor: pointer; + color: #666; } - &:hover { - &:after { - color: #2db7f5; - } + button:after { + display: block; + content: '•••'; } + } + &-prev, + &-jump-prev, + &-jump-next { + margin-right: 8px; + } + &-prev, + &-next, + &-jump-prev, + &-jump-next { + display: inline-block; + min-width: @pagination-item-size; + height: @pagination-item-size; + color: rgba(0, 0, 0, 0.85); + font-family: @pagination-font-family; + line-height: @pagination-item-size; + text-align: center; + vertical-align: middle; + list-style: none; + border-radius: 2px; + cursor: pointer; + transition: all 0.3s; } - &-jump-prev { - &:hover { - &:after { - content: "«"; - } + &-prev, + &-next { + outline: 0; + + button { + color: rgba(0, 0, 0, 0.85); + cursor: pointer; + user-select: none; } - } - &-jump-next { - &:hover { - &:after { - content: "»"; - } + &:hover button { + border-color: #40a9ff; } - } - - &-jump-prev-custom-icon, - &-jump-next-custom-icon { - position: relative; - - &:after { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - margin: auto; - transition: all .2s; - - content: "•••"; - opacity: 1; + + .@{pagination-prefix-cls}-item-link { display: block; - letter-spacing: 2px; - color: #ccc; + width: 100%; + height: 100%; font-size: 12px; - margin-top: 1px; + text-align: center; + background-color: @pagination-item-link-bg; + border: 1px solid #d9d9d9; + border-radius: 2px; + outline: none; + transition: all 0.3s; } - .custom-icon-jump-prev, - .custom-icon-jump-next { - opacity: 0; - transition: all .2s; - } - - &:hover { - &:after { - opacity: 0; - color: #ccc; - } - - .custom-icon-jump-prev, - .custom-icon-jump-next { - opacity: 1; - color: #2db7f5; - } + &:focus .@{pagination-prefix-cls}-item-link, + &:hover .@{pagination-prefix-cls}-item-link { + color: @primary-color; + border-color: @primary-color; } } - &-prev, &-jump-prev, &-jump-next { - margin-right: 8px; - } - &-prev, &-next, &-jump-prev, &-jump-next { - cursor: pointer; - color: #666; - font-size: 10px; - border-radius: 6px; - list-style: none; - min-width: 28px; - height: 28px; - line-height: 28px; - float: left; - text-align: center; + &-prev button:after { + content: '‹'; + display: block; } - &-prev { - a { - &:after { - content: "‹"; - display: block; - } - } + &-next button:after { + content: '›'; + display: block; } - &-next { - a { - &:after { - content: "›"; - display: block; + &-disabled { + &, + &:hover, + &:focus { + cursor: not-allowed; + .@{pagination-prefix-cls}-item-link { + color: fade(#000, 25%); + border-color: #d9d9d9; + cursor: not-allowed; } } } - &-prev, &-next { - border: 1px solid #d9d9d9; - font-size: 18px; - a { - color: #666; - &:after { - margin-top: -1px; - } - } + &-slash { + margin: 0 10px 0 12px; } - &-disabled { - cursor: not-allowed; - a { - color: #ccc; - } - - .@{prefixClass}-item, - .@{prefixClass}-prev, - .@{prefixClass}-next { - .disabled-item(); - } - - .@{prefixClass}-jump-prev, - .@{prefixClass}-jump-next { - pointer-events: none; + &-options { + display: inline-block; + margin-left: 16px; + vertical-align: middle; + + // IE11 css hack. `*::-ms-backdrop,` is a must have + @media all and (-ms-high-contrast: none) { + *::-ms-backdrop, + & { + vertical-align: top; + } } - } - &-options { - float: left; - margin-left: 15px; - &-size-changer { - float: left; - width: 80px; + &-size-changer.rc-select { + display: inline-block; + width: auto; + margin-right: 8px; } &-quick-jumper { - float: left; - margin-left: 16px; + display: inline-block; height: 28px; line-height: 28px; + vertical-align: top; input { - margin: 0 8px; - box-sizing: border-box; - background-color: #fff; - border-radius: 6px; - border: 1px solid #d9d9d9; - outline: none; - padding: 3px 12px; width: 50px; - height: 28px; + margin: 0 8px; + } + } + } - &:hover { - border-color: #2db7f5; - } + &-simple &-prev, + &-simple &-next { + height: @pagination-item-size-sm; + line-height: @pagination-item-size-sm; + vertical-align: top; + .@{pagination-prefix-cls}-item-link { + height: @pagination-item-size-sm; + background-color: transparent; + border: 0; + &::after { + height: @pagination-item-size-sm; + line-height: @pagination-item-size-sm; } + } + } - button { - display: inline-block; - margin: 0 8px; - font-weight: 500; - text-align: center; - touch-action: manipulation; - cursor: pointer; - background-image: none; - border: 1px solid transparent; - white-space: nowrap; - padding: 0 15px; - font-size: 12px; - border-radius: 6px; - height: 28px; - user-select: none; - transition: all .3s cubic-bezier(.645,.045,.355,1); - position: relative; - color: rgba(0,0,0,.65); - background-color: #fff; - border-color: #d9d9d9; + &-simple &-simple-pager { + display: flex; + align-items: center; + height: @pagination-item-size-sm; + margin-right: 8px; - &:hover, &:active, &:focus { - color: #2db7f5; - background-color: #fff; - border-color: #2db7f5; - } + input { + box-sizing: border-box; + height: 100%; + padding: 0 6px; + text-align: center; + background-color: @pagination-item-input-bg; + border: 1px solid #d9d9d9; + border-radius: 2px; + outline: none; + transition: border-color 0.3s; + + &:hover { + border-color: @primary-color; } } } - &-simple { - .@{prefixClass}-prev, .@{prefixClass}-next { - border: none; - height: 24px; - line-height: 24px; - margin: 0; - font-size: 18px; - } + // ============================ Disabled ============================ + &&-disabled { + cursor: not-allowed; - .@{prefixClass}-simple-pager { - float: left; - margin-right: 8px; - list-style: none; + .@{pagination-prefix-cls}-item { + background: hsv(0, 0, 96%); + border-color: #d9d9d9; + cursor: not-allowed; - .@{prefixClass}-slash { - margin: 0 10px; + a { + color: fade(#000, 25%); + background: transparent; + border: none; + cursor: not-allowed; } - input { - margin: 0 8px; - box-sizing: border-box; - background-color: #fff; - border-radius: 6px; - border: 1px solid #d9d9d9; - outline: none; - padding: 5px 8px; - min-height: 20px; - - &:hover { - border-color: #2db7f5; + &-active { + background: @pagination-item-disabled-bg-active; + border-color: transparent; + a { + color: @pagination-item-disabled-color-active; } } + } - button { - display: inline-block; - margin: 0 8px; - font-weight: 500; - text-align: center; - touch-action: manipulation; - cursor: pointer; - background-image: none; - border: 1px solid transparent; - white-space: nowrap; - padding: 0 8px; - font-size: 12px; - border-radius: 6px; - height: 26px; - user-select: none; - transition: all .3s cubic-bezier(.645,.045,.355,1); - position: relative; - color: rgba(0,0,0,.65); - background-color: #fff; - border-color: #d9d9d9; + .@{pagination-prefix-cls}-item-link { + color: fade(#000, 25%); + background: hsv(0, 0, 96%); + border-color: #d9d9d9; + cursor: not-allowed; + } - &:hover, &:active, &:focus { - color: #2db7f5; - background-color: #fff; - border-color: #2db7f5; - } - } + .@{pagination-prefix-cls}-item-link-icon { + opacity: 0; + } + .@{pagination-prefix-cls}-item-ellipsis { + opacity: 1; } } } -@media only screen and (max-width: 1024px) { - .@{prefixClass}-item { +@media only screen and (max-width: 992px) { + .@{pagination-prefix-cls}-item { &-after-jump-prev, &-before-jump-next { display: none; } } -} \ No newline at end of file +} + +@media only screen and (max-width: 576px) { + .@{pagination-prefix-cls}-options { + display: none; + } +} diff --git a/bunfig.toml b/bunfig.toml new file mode 100644 index 00000000..80d57b63 --- /dev/null +++ b/bunfig.toml @@ -0,0 +1,2 @@ +[install] +peer = false \ No newline at end of file diff --git a/docs/demo/align.md b/docs/demo/align.md new file mode 100644 index 00000000..5d8a6660 --- /dev/null +++ b/docs/demo/align.md @@ -0,0 +1,8 @@ +--- +title: align +nav: + title: align + path: /align +--- + + diff --git a/docs/demo/basic.md b/docs/demo/basic.md new file mode 100644 index 00000000..0f224404 --- /dev/null +++ b/docs/demo/basic.md @@ -0,0 +1,8 @@ +--- +title: basic +nav: + title: Demo + path: /demo +--- + + diff --git a/docs/demo/controlled.md b/docs/demo/controlled.md new file mode 100644 index 00000000..93806bdc --- /dev/null +++ b/docs/demo/controlled.md @@ -0,0 +1,8 @@ +--- +title: controlled +nav: + title: Demo + path: /demo +--- + + diff --git a/docs/demo/itemRender.md b/docs/demo/itemRender.md new file mode 100644 index 00000000..2c922c8f --- /dev/null +++ b/docs/demo/itemRender.md @@ -0,0 +1,8 @@ +--- +title: itemRender +nav: + title: Demo + path: /demo +--- + + diff --git a/docs/demo/jumper.md b/docs/demo/jumper.md new file mode 100644 index 00000000..108626a6 --- /dev/null +++ b/docs/demo/jumper.md @@ -0,0 +1,8 @@ +--- +title: jumper +nav: + title: Demo + path: /demo +--- + + diff --git a/docs/demo/jumperWithGoButton.md b/docs/demo/jumperWithGoButton.md new file mode 100644 index 00000000..3c45fa51 --- /dev/null +++ b/docs/demo/jumperWithGoButton.md @@ -0,0 +1,8 @@ +--- +title: jumperWithGoButton +nav: + title: Demo + path: /demo +--- + + diff --git a/docs/demo/lessPages.md b/docs/demo/lessPages.md new file mode 100644 index 00000000..39c0d6bb --- /dev/null +++ b/docs/demo/lessPages.md @@ -0,0 +1,8 @@ +--- +title: lessPages +nav: + title: Demo + path: /demo +--- + + diff --git a/docs/demo/locale.md b/docs/demo/locale.md new file mode 100644 index 00000000..076460e5 --- /dev/null +++ b/docs/demo/locale.md @@ -0,0 +1,8 @@ +--- +title: locale +nav: + title: Demo + path: /demo +--- + + diff --git a/docs/demo/more.md b/docs/demo/more.md new file mode 100644 index 00000000..801c5953 --- /dev/null +++ b/docs/demo/more.md @@ -0,0 +1,8 @@ +--- +title: more +nav: + title: Demo + path: /demo +--- + + diff --git a/docs/demo/showSizeChanger.md b/docs/demo/showSizeChanger.md new file mode 100644 index 00000000..bda79137 --- /dev/null +++ b/docs/demo/showSizeChanger.md @@ -0,0 +1,8 @@ +--- +title: showSizeChanger +nav: + title: Demo + path: /demo +--- + + diff --git a/docs/demo/showTitle.md b/docs/demo/showTitle.md new file mode 100644 index 00000000..9a1e831d --- /dev/null +++ b/docs/demo/showTitle.md @@ -0,0 +1,8 @@ +--- +title: showTitle +nav: + title: Demo + path: /demo +--- + + diff --git a/docs/demo/showTotal.md b/docs/demo/showTotal.md new file mode 100644 index 00000000..a221cd28 --- /dev/null +++ b/docs/demo/showTotal.md @@ -0,0 +1,8 @@ +--- +title: showTotal +nav: + title: Demo + path: /demo +--- + + diff --git a/docs/demo/simple.md b/docs/demo/simple.md new file mode 100644 index 00000000..64848ae0 --- /dev/null +++ b/docs/demo/simple.md @@ -0,0 +1,8 @@ +--- +title: simple +nav: + title: Demo + path: /demo +--- + + diff --git a/docs/demo/sizer.md b/docs/demo/sizer.md new file mode 100644 index 00000000..e094aeac --- /dev/null +++ b/docs/demo/sizer.md @@ -0,0 +1,8 @@ +--- +title: sizer +nav: + title: Demo + path: /demo +--- + + diff --git a/docs/demo/styles.md b/docs/demo/styles.md new file mode 100644 index 00000000..0d7ad2e1 --- /dev/null +++ b/docs/demo/styles.md @@ -0,0 +1,8 @@ +--- +title: styles +nav: + title: Demo + path: /demo +--- + + diff --git a/docs/examples/align.tsx b/docs/examples/align.tsx new file mode 100644 index 00000000..609e725c --- /dev/null +++ b/docs/examples/align.tsx @@ -0,0 +1,13 @@ +import '../../assets/index.less'; +import React from 'react'; +import Pagination from '../../src'; + +const App = () => ( + <> + + + + +); + +export default App; diff --git a/docs/examples/basic.tsx b/docs/examples/basic.tsx new file mode 100644 index 00000000..8eaffc05 --- /dev/null +++ b/docs/examples/basic.tsx @@ -0,0 +1,19 @@ +import '../../assets/index.less'; +import React from 'react'; +import Pagination from '../../src'; + +const App = () => ( + <> + + + + + + + + + + +); + +export default App; diff --git a/docs/examples/controlled.tsx b/docs/examples/controlled.tsx new file mode 100644 index 00000000..376791f2 --- /dev/null +++ b/docs/examples/controlled.tsx @@ -0,0 +1,14 @@ +import React, { useState } from 'react'; +import Pagination from '../../src'; +import '../../assets/index.less'; +import 'rc-select/assets/index.less'; + +const App = () => { + const [current, setCurrent] = useState(1); + const onChange = (page) => { + setCurrent(page); + }; + return ; +}; + +export default App; diff --git a/docs/examples/itemRender.tsx b/docs/examples/itemRender.tsx new file mode 100644 index 00000000..035c9c2f --- /dev/null +++ b/docs/examples/itemRender.tsx @@ -0,0 +1,51 @@ +import '../../assets/index.less'; +import React from 'react'; +import Pagination from '../../src'; + +const itemRender = (current, type, element) => { + if (type === 'page') { + return {current}; + } + return element; +}; + +const textItemRender = (current, type, element) => { + if (type === 'prev') { + return 'Prev'; + } + if (type === 'next') { + return 'Next'; + } + return element; +}; + +const buttonItemRender = (current, type, element) => { + if (type === 'prev') { + return ; + } + if (type === 'next') { + return ; + } + return element; +}; + +const divItemRender = (current, type, element) => { + if (type === 'prev') { + return
Prev
; + } + if (type === 'next') { + return
Next
; + } + return element; +}; + +const App = () => ( + <> + + + + + +); + +export default App; diff --git a/docs/examples/jumper.tsx b/docs/examples/jumper.tsx new file mode 100644 index 00000000..20bd423b --- /dev/null +++ b/docs/examples/jumper.tsx @@ -0,0 +1,60 @@ +/* eslint func-names: 0, no-console: 0 */ +import React from 'react'; +import '../../assets/index.less'; +import 'rc-select/assets/index.less'; +import PaginationWithSizeChanger from './utils/commonUtil'; + +function onShowSizeChange(current, pageSize) { + console.log(current); + console.log(pageSize); +} + +function onChange(current, pageSize) { + console.log('onChange:current=', current); + console.log('onChange:pageSize=', pageSize); +} + +const App = () => ( + <> +

默认

+ +

禁用

+ +

单页默认隐藏

+ +
+ + +); + +export default App; diff --git a/examples/jumperWithGoButton.js b/docs/examples/jumperWithGoButton.tsx similarity index 57% rename from examples/jumperWithGoButton.js rename to docs/examples/jumperWithGoButton.tsx index 6ba5d685..16364fa9 100644 --- a/examples/jumperWithGoButton.js +++ b/docs/examples/jumperWithGoButton.tsx @@ -1,31 +1,28 @@ /* eslint func-names: 0, no-console: 0 */ import React from 'react'; -import ReactDOM from 'react-dom'; -import Select from 'rc-select'; -import Pagination from 'rc-pagination'; -import 'rc-pagination/assets/index.less'; -import 'rc-select/assets/index.css'; +import Pagination from '../../src'; +import '../../assets/index.less'; +import 'rc-select/assets/index.less'; +import PaginationWithSizeChanger from './utils/commonUtil'; class App extends React.Component { - onShowSizeChange = (current, pageSize) => { console.log(current); console.log(pageSize); - } + }; onChange = (current, pageSize) => { console.log('onChange:current=', current); console.log('onChange:pageSize=', pageSize); - } + }; render() { return ( -
+ <>

customize node

- 确定 }} + showQuickJumper={{ goButton: }} defaultPageSize={20} defaultCurrent={5} onShowSizeChange={this.onShowSizeChange} @@ -33,10 +30,15 @@ class App extends React.Component { total={450} />

default node

- -
+ + ); } } -ReactDOM.render(, document.getElementById('__react-content')); +export default App; diff --git a/examples/lessPages.js b/docs/examples/lessPages.tsx similarity index 57% rename from examples/lessPages.js rename to docs/examples/lessPages.tsx index d69d3816..63831387 100644 --- a/examples/lessPages.js +++ b/docs/examples/lessPages.tsx @@ -1,37 +1,36 @@ /* eslint func-names: 0, no-console: 0 */ import React from 'react'; -import ReactDOM from 'react-dom'; -import Pagination from 'rc-pagination'; -import 'rc-pagination/assets/index.less'; +import Pagination from '../../src'; +import '../../assets/index.less'; -const arrowPath = 'M869 487.8L491.2 159.9c-2.9-2.5-6.6-3.9-10.5-3.9h' + +const arrowPath = + 'M869 487.8L491.2 159.9c-2.9-2.5-6.6-3.9-10.5-3.9h' + '-88.5c-7.4 0-10.8 9.2-5.2 14l350.2 304H152c-4.4 0-8 3.6-8 8v' + '60c0 4.4 3.6 8 8 8h585.1L386.9 854c-5.6 4.9-2.2 14 5.2 14h91' + '.5c1.9 0 3.8-0.7 5.2-2L869 536.2c14.7-12.8 14.7-35.6 0-48.4z'; const doublePath = [ 'M533.2 492.3L277.9 166.1c-3-3.9-7.7-6.1-12.6-6.1H188c-6' + - '.7 0-10.4 7.7-6.3 12.9L447.1 512 181.7 851.1c-4.1 5.2-0' + - '.4 12.9 6.3 12.9h77.3c4.9 0 9.6-2.3 12.6-6.1l255.3-326.' + - '1c9.1-11.7 9.1-27.9 0-39.5z', + '.7 0-10.4 7.7-6.3 12.9L447.1 512 181.7 851.1c-4.1 5.2-0' + + '.4 12.9 6.3 12.9h77.3c4.9 0 9.6-2.3 12.6-6.1l255.3-326.' + + '1c9.1-11.7 9.1-27.9 0-39.5z', 'M837.2 492.3L581.9 166.1c-3-3.9-7.7-6.1-12.6-6.1H492c-6' + - '.7 0-10.4 7.7-6.3 12.9L751.1 512 485.7 851.1c-4.1 5.2-0' + - '.4 12.9 6.3 12.9h77.3c4.9 0 9.6-2.3 12.6-6.1l255.3-326.' + - '1c9.1-11.7 9.1-27.9 0-39.5z', + '.7 0-10.4 7.7-6.3 12.9L751.1 512 485.7 851.1c-4.1 5.2-0' + + '.4 12.9 6.3 12.9h77.3c4.9 0 9.6-2.3 12.6-6.1l255.3-326.' + + '1c9.1-11.7 9.1-27.9 0-39.5z', ]; -const getSvgIcon = (path, reverse, type) => { +const getSvgIcon = ( + path: string | string[], + reverse: boolean, + type: string, +) => { const paths = Array.isArray(path) ? path : [path]; - const renderPaths = paths.map((p, i) => { - return ( - - ); - }); + const renderPaths = paths.map((p, i) => ( + + )); return ( - + { fill="currentColor" style={{ verticalAlign: '-.125em', - transform: `rotate(${reverse && 180 || 0}deg)`, + transform: `rotate(${(reverse && 180) || 0}deg)`, }} > {renderPaths} @@ -58,24 +57,24 @@ class App extends React.Component { current: 3, useIcon: true, }; - onChange = (page) => { + onChange = (page: number) => { console.log(page); - this.setState({ - current: page, - }); - } + this.setState({ current: page }); + }; toggleCustomIcon = () => { this.setState({ useIcon: !this.state.useIcon, }); - } + }; render() { - const iconsProps = this.state.useIcon && { - prevIcon, - nextIcon, - jumpPrevIcon, - jumpNextIcon, - } || {}; + const iconsProps = + (this.state.useIcon && { + prevIcon, + nextIcon, + jumpPrevIcon, + jumpNextIcon, + }) || + {}; return (
- + - Is using icon: {this.state.useIcon && 'true' || 'false'} + Is using icon: {(this.state.useIcon && 'true') || 'false'}
@@ -105,4 +102,4 @@ class App extends React.Component { } } -ReactDOM.render(, document.getElementById('__react-content')); +export default App; diff --git a/examples/locale.js b/docs/examples/locale.tsx similarity index 58% rename from examples/locale.js rename to docs/examples/locale.tsx index 1c5e3776..75b7a2a6 100644 --- a/examples/locale.js +++ b/docs/examples/locale.tsx @@ -1,11 +1,9 @@ /* eslint func-names: 0, no-console: 0 */ import React from 'react'; -import ReactDOM from 'react-dom'; -import Select from 'rc-select'; -import Pagination from 'rc-pagination'; -import localeInfo from 'rc-pagination/lib/locale/en_US'; -import 'rc-pagination/assets/index.less'; -import 'rc-select/assets/index.css'; +import localeInfo from '../../src/locale/en_US'; +import '../../assets/index.less'; +import 'rc-select/assets/index.less'; +import PaginationWithSizeChanger from './utils/commonUtil'; function onShowSizeChange(current, pageSize) { console.log(current); @@ -17,9 +15,8 @@ function onChange(current, pageSize) { console.log('onChange:pageSize=', pageSize); } -ReactDOM.render( - ( + -, document.getElementById('__react-content')); +); + +export default App; diff --git a/docs/examples/more.tsx b/docs/examples/more.tsx new file mode 100644 index 00000000..2c0937ea --- /dev/null +++ b/docs/examples/more.tsx @@ -0,0 +1,9 @@ +import '../../assets/index.less'; +import React from 'react'; +import Pagination from '../../src'; + +const App = () => ( + +); + +export default App; diff --git a/docs/examples/showSizeChanger.tsx b/docs/examples/showSizeChanger.tsx new file mode 100644 index 00000000..8b592476 --- /dev/null +++ b/docs/examples/showSizeChanger.tsx @@ -0,0 +1,38 @@ +import React from 'react'; +import '../../assets/index.less'; +import PaginationWithSizeChanger from './utils/commonUtil'; + +export default () => { + const onPageSizeOnChange = (value) => { + console.log(value); + }; + + return ( + <> + + + + + ); +}; diff --git a/examples/showTitle.js b/docs/examples/showTitle.tsx similarity index 63% rename from examples/showTitle.js rename to docs/examples/showTitle.tsx index 8265d97a..d76c713e 100644 --- a/examples/showTitle.js +++ b/docs/examples/showTitle.tsx @@ -1,19 +1,20 @@ /* eslint func-names: 0, no-console: 0 */ import React from 'react'; -import ReactDOM from 'react-dom'; -import Pagination from 'rc-pagination'; -import 'rc-pagination/assets/index.less'; +import Pagination from '../../src'; +import '../../assets/index.less'; class App extends React.Component { state = { current: 3, }; + onChange = (page) => { console.log(page); this.setState({ current: page, }); - } + }; + render() { return (
@@ -24,10 +25,15 @@ class App extends React.Component { showLessItems showTitle={false} /> - +
); } } -ReactDOM.render(, document.getElementById('__react-content')); +export default App; diff --git a/docs/examples/showTotal.tsx b/docs/examples/showTotal.tsx new file mode 100644 index 00000000..b7a7c042 --- /dev/null +++ b/docs/examples/showTotal.tsx @@ -0,0 +1,25 @@ +import React from 'react'; +import Pagination from '../../src'; +import '../../assets/index.less'; + +const App = () => ( + <> + `Total ${total} items`} total={455} /> +
+ + `${range[0]} - ${range[1]} of ${total} items` + } + total={455} + /> +
+ + `${range[0]} - ${range[1]} of ${total} items` + } + total={0} + /> + +); + +export default App; diff --git a/docs/examples/simple.tsx b/docs/examples/simple.tsx new file mode 100644 index 00000000..359cc0f8 --- /dev/null +++ b/docs/examples/simple.tsx @@ -0,0 +1,54 @@ +import React, { useState } from 'react'; +import Pagination from '../../src'; +import '../../assets/index.less'; +import PaginationWithSizeChanger from './utils/commonUtil'; + +export default () => { + const [pageIndex, setPageIndex] = useState(1); + + return ( + <> + + +
+ +
+ +
+ `Total ${total} items`} + /> +
+ +
+ + Antd #46671 + + + + ); +}; diff --git a/docs/examples/sizer.tsx b/docs/examples/sizer.tsx new file mode 100644 index 00000000..847a3127 --- /dev/null +++ b/docs/examples/sizer.tsx @@ -0,0 +1,52 @@ +/* eslint func-names: 0, no-console: 0 */ +import React from 'react'; +import '../../assets/index.less'; +import 'rc-select/assets/index.less'; +import PaginationWithSizeChanger from './utils/commonUtil'; + +class App extends React.Component { + state = { + pageSize: 15, + }; + + onShowSizeChange = (current, pageSize) => { + console.log(current); + this.setState({ pageSize }); + }; + + render() { + const { pageSize } = this.state; + return ( +
+ + + + +
+ ); + } +} + +export default App; diff --git a/docs/examples/styles.tsx b/docs/examples/styles.tsx new file mode 100644 index 00000000..fa85c714 --- /dev/null +++ b/docs/examples/styles.tsx @@ -0,0 +1,7 @@ +import '../../assets/index.less'; +import React from 'react'; +import Pagination from '../../src'; + +export default () => ( + +); diff --git a/docs/examples/utils/commonUtil.tsx b/docs/examples/utils/commonUtil.tsx new file mode 100644 index 00000000..b0de150a --- /dev/null +++ b/docs/examples/utils/commonUtil.tsx @@ -0,0 +1,45 @@ +import type { PaginationProps } from 'rc-pagination'; +import Pagination from '../../../src'; +import Select from 'rc-select'; +import React from 'react'; + +export const getSizeChangerRender = (selectProps?: any) => { + const render: PaginationProps['sizeChangerRender'] = ({ + disabled, + size: pageSize, + onSizeChange, + 'aria-label': ariaLabel, + className, + options, + }) => ( + triggerNode.parentNode} - > - {options} - - ); - } - - if (quickGo) { - if (goButton) { - gotoButton = typeof goButton === 'boolean' ? ( - - ) : ( - - {goButton} - - ); - } - goInput = ( -
- {locale.jump_to} - - {locale.page} - {gotoButton} -
- ); - } - - return ( -
  • - {changeSelect} - {goInput} -
    • - ); - } -} - -export default Options; diff --git a/src/Options.tsx b/src/Options.tsx new file mode 100644 index 00000000..9608697c --- /dev/null +++ b/src/Options.tsx @@ -0,0 +1,186 @@ +import KEYCODE from '@rc-component/util/lib/KeyCode'; +import React from 'react'; +import type { PaginationLocale } from './interface'; + +export type SizeChangerRender = (info: { + disabled: boolean; + size: number; + onSizeChange: (value: string | number) => void; + 'aria-label': string; + className: string; + options: { + label: string; + value: string | number; + }[]; +}) => React.ReactNode; + +interface OptionsProps { + disabled?: boolean; + locale: PaginationLocale; + rootPrefixCls: string; + selectPrefixCls?: string; + pageSize: number; + pageSizeOptions?: number[]; + goButton?: boolean | string; + changeSize?: (size: number) => void; + quickGo?: (value: number) => void; + buildOptionText?: (value: number | string) => string; + showSizeChanger: boolean; + sizeChangerRender?: SizeChangerRender; +} + +const defaultPageSizeOptions = [10, 20, 50, 100]; + +const Options: React.FC = (props) => { + const { + pageSizeOptions = defaultPageSizeOptions, + locale, + changeSize, + pageSize, + goButton, + quickGo, + rootPrefixCls, + disabled, + buildOptionText, + showSizeChanger, + sizeChangerRender, + } = props; + + const [goInputText, setGoInputText] = React.useState(''); + + const getValidValue = React.useMemo(() => { + return !goInputText || Number.isNaN(goInputText) + ? undefined + : Number(goInputText); + }, [goInputText]); + + const mergeBuildOptionText = + typeof buildOptionText === 'function' + ? buildOptionText + : (value: string | number) => `${value} ${locale.items_per_page}`; + + const handleChange = (e: React.ChangeEvent) => { + setGoInputText(e.target.value); + }; + + const handleBlur = (e: React.FocusEvent) => { + if (goButton || goInputText === '') { + return; + } + setGoInputText(''); + if ( + e.relatedTarget && + (e.relatedTarget.className.includes(`${rootPrefixCls}-item-link`) || + e.relatedTarget.className.includes(`${rootPrefixCls}-item`)) + ) { + return; + } + quickGo?.(getValidValue); + }; + + const go = (e: any) => { + if (goInputText === '') { + return; + } + if (e.keyCode === KEYCODE.ENTER || e.type === 'click') { + setGoInputText(''); + quickGo?.(getValidValue); + } + }; + + const getPageSizeOptions = () => { + if ( + pageSizeOptions.some( + (option) => option.toString() === pageSize.toString(), + ) + ) { + return pageSizeOptions; + } + return pageSizeOptions.concat([pageSize]).sort((a, b) => { + const numberA = Number.isNaN(Number(a)) ? 0 : Number(a); + const numberB = Number.isNaN(Number(b)) ? 0 : Number(b); + return numberA - numberB; + }); + }; + // ============== cls ============== + const prefixCls = `${rootPrefixCls}-options`; + + // ============== render ============== + + if (!showSizeChanger && !quickGo) { + return null; + } + + let changeSelect: React.ReactNode = null; + let goInput: React.ReactNode = null; + let gotoButton: React.ReactNode = null; + + // >>>>> Size Changer + if (showSizeChanger && sizeChangerRender) { + changeSelect = sizeChangerRender({ + disabled, + size: pageSize, + onSizeChange: (nextValue) => { + changeSize?.(Number(nextValue)); + }, + 'aria-label': locale.page_size, + className: `${prefixCls}-size-changer`, + options: getPageSizeOptions().map((opt) => ({ + label: mergeBuildOptionText(opt), + value: opt, + })), + }); + } + + // >>>>> Quick Go + if (quickGo) { + if (goButton) { + gotoButton = + typeof goButton === 'boolean' ? ( + + ) : ( + + {goButton} + + ); + } + + goInput = ( +
    + {locale.jump_to} + + {locale.page} + {gotoButton} +
    + ); + } + + return ( +
  • + {changeSelect} + {goInput} +
    • + ); +}; + +if (process.env.NODE_ENV !== 'production') { + Options.displayName = 'Options'; +} + +export default Options; diff --git a/src/Pager.jsx b/src/Pager.jsx deleted file mode 100644 index 39d333c2..00000000 --- a/src/Pager.jsx +++ /dev/null @@ -1,47 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import classNames from 'classnames'; - -const Pager = (props) => { - const prefixCls = `${props.rootPrefixCls}-item`; - const cls = classNames(prefixCls, `${prefixCls}-${props.page}`, { - [`${prefixCls}-active`]: props.active, - [props.className]: !!props.className, - [`${prefixCls}-disabled`]: !props.page, - }); - - const handleClick = () => { - props.onClick(props.page); - }; - - const handleKeyPress = e => { - props.onKeyPress(e, props.onClick, props.page); - }; - - return ( -
  • - {props.itemRender(props.page, 'page', {props.page})} -
    • - ); -}; - -Pager.propTypes = { - page: PropTypes.number, - active: PropTypes.bool, - last: PropTypes.bool, - locale: PropTypes.object, - className: PropTypes.string, - showTitle: PropTypes.bool, - rootPrefixCls: PropTypes.string, - onClick: PropTypes.func, - onKeyPress: PropTypes.func, - itemRender: PropTypes.func, -}; - -export default Pager; diff --git a/src/Pager.tsx b/src/Pager.tsx new file mode 100644 index 00000000..0d1dcc4f --- /dev/null +++ b/src/Pager.tsx @@ -0,0 +1,73 @@ +/* eslint react/prop-types: 0 */ +import { clsx } from 'clsx'; +import React from 'react'; +import type { PaginationProps } from './interface'; + +export interface PagerProps extends Pick { + rootPrefixCls: string; + page: number; + active?: boolean; + className?: string; + style?: React.CSSProperties; + showTitle: boolean; + onClick?: (page: number) => void; + onKeyPress?: ( + e: React.KeyboardEvent, + onClick: PagerProps['onClick'], + page: PagerProps['page'], + ) => void; +} + +const Pager: React.FC = (props) => { + const { + rootPrefixCls, + page, + active, + className, + style, + showTitle, + onClick, + onKeyPress, + itemRender, + } = props; + const prefixCls = `${rootPrefixCls}-item`; + + const cls = clsx( + prefixCls, + `${prefixCls}-${page}`, + { + [`${prefixCls}-active`]: active, + [`${prefixCls}-disabled`]: !page, + }, + className, + ); + + const handleClick = () => { + onClick(page); + }; + + const handleKeyPress = (e: React.KeyboardEvent) => { + onKeyPress(e, onClick, page); + }; + + const pager = itemRender(page, 'page', {page}); + + return pager ? ( +
  • + {pager} +
    • + ) : null; +}; + +if (process.env.NODE_ENV !== 'production') { + Pager.displayName = 'Pager'; +} + +export default Pager; diff --git a/src/Pagination.jsx b/src/Pagination.jsx deleted file mode 100644 index bde0e561..00000000 --- a/src/Pagination.jsx +++ /dev/null @@ -1,676 +0,0 @@ -import React from 'react'; -import classNames from 'classnames'; -import PropTypes from 'prop-types'; -import Pager from './Pager'; -import Options from './Options'; -import KEYCODE from './KeyCode'; -import LOCALE from './locale/zh_CN'; -import { polyfill } from 'react-lifecycles-compat'; - -function noop() { -} - -function isInteger(value) { - return typeof value === 'number' && - isFinite(value) && - Math.floor(value) === value; -} - -function defaultItemRender(page, type, element) { - return element; -} - -function calculatePage(p, state, props) { - let pageSize = p; - if (typeof pageSize === 'undefined') { - pageSize = state.pageSize; - } - return Math.floor((props.total - 1) / pageSize) + 1; -} - -class Pagination extends React.Component { - static propTypes = { - disabled: PropTypes.bool, - prefixCls: PropTypes.string, - className: PropTypes.string, - current: PropTypes.number, - defaultCurrent: PropTypes.number, - total: PropTypes.number, - pageSize: PropTypes.number, - defaultPageSize: PropTypes.number, - onChange: PropTypes.func, - hideOnSinglePage: PropTypes.bool, - showSizeChanger: PropTypes.bool, - showLessItems: PropTypes.bool, - onShowSizeChange: PropTypes.func, - selectComponentClass: PropTypes.func, - showPrevNextJumpers: PropTypes.bool, - showQuickJumper: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]), - showTitle: PropTypes.bool, - pageSizeOptions: PropTypes.arrayOf(PropTypes.string), - showTotal: PropTypes.func, - locale: PropTypes.object, - style: PropTypes.object, - itemRender: PropTypes.func, - prevIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.node]), - nextIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.node]), - jumpPrevIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.node]), - jumpNextIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.node]), - }; - - static defaultProps = { - defaultCurrent: 1, - total: 0, - defaultPageSize: 10, - onChange: noop, - className: '', - selectPrefixCls: 'rc-select', - prefixCls: 'rc-pagination', - selectComponentClass: null, - hideOnSinglePage: false, - showPrevNextJumpers: true, - showQuickJumper: false, - showSizeChanger: false, - showLessItems: false, - showTitle: true, - onShowSizeChange: noop, - locale: LOCALE, - style: {}, - itemRender: defaultItemRender, - }; - - constructor(props) { - super(props); - - const hasOnChange = props.onChange !== noop; - const hasCurrent = ('current' in props); - if (hasCurrent && !hasOnChange) { - console.warn('Warning: You provided a `current` prop to a Pagination component without an `onChange` handler. This will render a read-only component.'); // eslint-disable-line - } - - let current = props.defaultCurrent; - if ('current' in props) { - current = props.current; - } - - let pageSize = props.defaultPageSize; - if ('pageSize' in props) { - pageSize = props.pageSize; - } - - this.state = { - current, - currentInputValue: current, - pageSize, - }; - } - - componentDidUpdate(prevProps, prevState) { - // When current page change, fix focused style of prev item - // A hacky solution of https://github.com/ant-design/ant-design/issues/8948 - const { prefixCls } = this.props; - if (prevState.current !== this.state.current && this.paginationNode) { - const lastCurrentNode = this.paginationNode.querySelector( - `.${prefixCls}-item-${prevState.current}` - ); - if (lastCurrentNode && document.activeElement === lastCurrentNode) { - lastCurrentNode.blur(); - } - } - } - - static getDerivedStateFromProps(props, prevState) { - const newState = {}; - - if ('current' in props) { - newState.current = props.current; - - if (props.current !== prevState.current) { - newState.currentInputValue = newState.current; - } - } - - if ('pageSize' in props && props.pageSize !== prevState.pageSize) { - let current = prevState.current; - const newCurrent = calculatePage(props.pageSize, prevState, props); - current = current > newCurrent ? newCurrent : current; - - if (!('current' in props)) { - newState.current = current; - newState.currentInputValue = current; - } - newState.pageSize = props.pageSize; - } - - return newState; - } - - getJumpPrevPage = () => { - return Math.max(1, this.state.current - (this.props.showLessItems ? 3 : 5)); - } - - getJumpNextPage = () => { - return Math.min( - calculatePage(undefined, this.state, this.props), - this.state.current + (this.props.showLessItems ? 3 : 5) - ); - } - - /** - * computed icon node that need to be rendered. - * @param {React.ReactNode | React.ComponentType} icon received icon. - * @returns {React.ReactNode} - */ - getItemIcon = (icon) => { - const { prefixCls } = this.props; - let iconNode = icon - || ; - if (typeof icon === 'function') { - iconNode = React.createElement(icon, { ...this.props }); - } - return iconNode; - } - - getValidValue(e) { - const inputValue = e.target.value; - const { currentInputValue } = this.state; - let value; - if (inputValue === '') { - value = inputValue; - } else if (isNaN(Number(inputValue))) { - value = currentInputValue; - } else { - value = Number(inputValue); - } - return value; - } - - savePaginationNode = (node) => { - this.paginationNode = node; - } - - isValid = (page) => { - return isInteger(page) && page !== this.state.current; - } - - shouldDisplayQuickJumper = () => { - const { showQuickJumper, pageSize, total } = this.props; - if (total <= pageSize) { - return false; - } - return showQuickJumper; - } - - handleKeyDown = (e) => { - if (e.keyCode === KEYCODE.ARROW_UP || e.keyCode === KEYCODE.ARROW_DOWN) { - e.preventDefault(); - } - } - - handleKeyUp = (e) => { - const value = this.getValidValue(e); - const { currentInputValue } = this.state; - if (value !== currentInputValue) { - this.setState({ - currentInputValue: value, - }); - } - if (e.keyCode === KEYCODE.ENTER) { - this.handleChange(value); - } else if (e.keyCode === KEYCODE.ARROW_UP) { - this.handleChange(value - 1); - } else if (e.keyCode === KEYCODE.ARROW_DOWN) { - this.handleChange(value + 1); - } - } - - changePageSize = (size) => { - let current = this.state.current; - const newCurrent = calculatePage(size, this.state, this.props); - current = current > newCurrent ? newCurrent : current; - // fix the issue: - // Once 'total' is 0, 'current' in 'onShowSizeChange' is 0, which is not correct. - if (newCurrent === 0) { - current = this.state.current; - } - - if (typeof size === 'number') { - if (!('pageSize' in this.props)) { - this.setState({ - pageSize: size, - }); - } - if (!('current' in this.props)) { - this.setState({ - current, - currentInputValue: current, - }); - } - } - this.props.onShowSizeChange(current, size); - } - - handleChange = (p) => { - const { disabled } = this.props; - - let page = p; - if (this.isValid(page) && !disabled) { - const currentPage = calculatePage(undefined, this.state, this.props); - if (page > currentPage) { - page = currentPage; - } else if (page < 1) { - page = 1; - } - - if (!('current' in this.props)) { - this.setState({ - current: page, - currentInputValue: page, - }); - } - - const pageSize = this.state.pageSize; - this.props.onChange(page, pageSize); - - return page; - } - - return this.state.current; - } - - prev = () => { - if (this.hasPrev()) { - this.handleChange(this.state.current - 1); - } - } - - next = () => { - if (this.hasNext()) { - this.handleChange(this.state.current + 1); - } - } - - jumpPrev = () => { - this.handleChange(this.getJumpPrevPage()); - } - - jumpNext = () => { - this.handleChange(this.getJumpNextPage()); - } - - hasPrev = () => { - return this.state.current > 1; - } - - hasNext = () => { - return this.state.current < calculatePage(undefined, this.state, this.props); - } - - runIfEnter = (event, callback, ...restParams) => { - if (event.key === 'Enter' || event.charCode === 13) { - callback(...restParams); - } - } - - runIfEnterPrev = e => { - this.runIfEnter(e, this.prev); - } - - runIfEnterNext = e => { - this.runIfEnter(e, this.next); - } - - runIfEnterJumpPrev = e => { - this.runIfEnter(e, this.jumpPrev); - } - - runIfEnterJumpNext = e => { - this.runIfEnter(e, this.jumpNext); - } - - handleGoTO = e => { - if (e.keyCode === KEYCODE.ENTER || e.type === 'click') { - this.handleChange(this.state.currentInputValue); - } - } - - render() { - const { prefixCls, className, disabled } = this.props; - - // When hideOnSinglePage is true and there is only 1 page, hide the pager - if (this.props.hideOnSinglePage === true && this.props.total <= this.state.pageSize) { - return null; - } - - const props = this.props; - const locale = props.locale; - - const allPages = calculatePage(undefined, this.state, this.props); - const pagerList = []; - let jumpPrev = null; - let jumpNext = null; - let firstPager = null; - let lastPager = null; - let gotoButton = null; - - const goButton = (props.showQuickJumper && props.showQuickJumper.goButton); - const pageBufferSize = props.showLessItems ? 1 : 2; - const { current, pageSize } = this.state; - - const prevPage = current - 1 > 0 ? current - 1 : 0; - const nextPage = current + 1 < allPages ? current + 1 : allPages; - - const dataOrAriaAttributeProps = Object.keys(props).reduce((prev, key) => { - if ((key.substr(0, 5) === 'data-' || key.substr(0, 5) === 'aria-' || key === 'role')) { - prev[key] = props[key]; - } - return prev; - }, {}); - - if (props.simple) { - if (goButton) { - if (typeof goButton === 'boolean') { - gotoButton = ( - - ); - } else { - gotoButton = ( - {goButton} - ); - } - gotoButton = ( -
  • - {gotoButton} -
    • - ); - } - - return ( -
      -
    • - {props.itemRender(prevPage, 'prev', this.getItemIcon(props.prevIcon))} -
      • -
    • - - / - {allPages} -
      • -
    • - {props.itemRender(nextPage, 'next', this.getItemIcon(props.nextIcon))} -
      • - {gotoButton} -
    - ); - } - - if (allPages <= 5 + pageBufferSize * 2) { - const pagerProps = { - locale, - rootPrefixCls: prefixCls, - onClick: this.handleChange, - onKeyPress: this.runIfEnter, - showTitle: props.showTitle, - itemRender: props.itemRender, - }; - if (!allPages) { - pagerList.push( - - ); - } - for (let i = 1; i <= allPages; i++) { - const active = this.state.current === i; - pagerList.push( - - ); - } - } else { - const prevItemTitle = props.showLessItems ? locale.prev_3 : locale.prev_5; - const nextItemTitle = props.showLessItems ? locale.next_3 : locale.next_5; - if (props.showPrevNextJumpers) { - let jumpPrevClassString = `${prefixCls}-jump-prev`; - if (props.jumpPrevIcon) { - jumpPrevClassString += ` ${prefixCls}-jump-prev-custom-icon`; - } - jumpPrev = ( -
  • - {props.itemRender( - this.getJumpPrevPage(), - 'jump-prev', - this.getItemIcon(props.jumpPrevIcon) - )} -
    • - ); - let jumpNextClassString = `${prefixCls}-jump-next`; - if (props.jumpNextIcon) { - jumpNextClassString += ` ${prefixCls}-jump-next-custom-icon`; - } - jumpNext = ( -
  • - {props.itemRender( - this.getJumpNextPage(), - 'jump-next', - this.getItemIcon(props.jumpNextIcon) - )} -
    • - ); - } - lastPager = ( - - ); - firstPager = ( - - ); - - let left = Math.max(1, current - pageBufferSize); - let right = Math.min(current + pageBufferSize, allPages); - - if (current - 1 <= pageBufferSize) { - right = 1 + pageBufferSize * 2; - } - - if (allPages - current <= pageBufferSize) { - left = allPages - pageBufferSize * 2; - } - - for (let i = left; i <= right; i++) { - const active = current === i; - pagerList.push( - - ); - } - - if (current - 1 >= pageBufferSize * 2 && current !== 1 + 2) { - pagerList[0] = React.cloneElement(pagerList[0], { - className: `${prefixCls}-item-after-jump-prev`, - }); - pagerList.unshift(jumpPrev); - } - if (allPages - current >= pageBufferSize * 2 && current !== allPages - 2) { - pagerList[pagerList.length - 1] = React.cloneElement(pagerList[pagerList.length - 1], { - className: `${prefixCls}-item-before-jump-next`, - }); - pagerList.push(jumpNext); - } - - if (left !== 1) { - pagerList.unshift(firstPager); - } - if (right !== allPages) { - pagerList.push(lastPager); - } - } - - let totalText = null; - - if (props.showTotal) { - totalText = ( -
  • - {props.showTotal( - props.total, - [ - props.total === 0 ? 0 : (current - 1) * pageSize + 1, - current * pageSize > props.total ? props.total : current * pageSize, - ] - )} -
    • - ); - } - const prevDisabled = !this.hasPrev() || !allPages; - const nextDisabled = !this.hasNext() || !allPages; - return ( -
      - {totalText} -
    • - {props.itemRender( - prevPage, - 'prev', - this.getItemIcon(props.prevIcon) - )} -
      • - {pagerList} -
    • - {props.itemRender( - nextPage, - 'next', - this.getItemIcon(props.nextIcon) - )} -
      • - -
    - ); - } -} - -polyfill(Pagination); - -export default Pagination; diff --git a/src/Pagination.tsx b/src/Pagination.tsx new file mode 100644 index 00000000..dbc977d4 --- /dev/null +++ b/src/Pagination.tsx @@ -0,0 +1,609 @@ +import { clsx } from 'clsx'; +import useControlledState from '@rc-component/util/lib/hooks/useControlledState'; +import KeyCode from '@rc-component/util/lib/KeyCode'; +import pickAttrs from '@rc-component/util/lib/pickAttrs'; +import warning from '@rc-component/util/lib/warning'; +import React, { useEffect } from 'react'; +import type { PaginationProps } from './interface'; +import zhCN from './locale/zh_CN'; +import Options from './Options'; +import type { PagerProps } from './Pager'; +import Pager from './Pager'; + +const defaultItemRender: PaginationProps['itemRender'] = (_, __, element) => + element; + +function noop() {} + +function isInteger(v: number) { + const value = Number(v); + return ( + typeof value === 'number' && + !Number.isNaN(value) && + isFinite(value) && + Math.floor(value) === value + ); +} + +function calculatePage(p: number | undefined, pageSize: number, total: number) { + const _pageSize = typeof p === 'undefined' ? pageSize : p; + return Math.floor((total - 1) / _pageSize) + 1; +} + +const Pagination: React.FC = (props) => { + const { + // cls + prefixCls = 'rc-pagination', + selectPrefixCls = 'rc-select', + className, + classNames: paginationClassNames, + styles, + + // control + current: currentProp, + defaultCurrent = 1, + total = 0, + pageSize: pageSizeProp, + defaultPageSize = 10, + onChange = noop, + + // config + hideOnSinglePage, + align, + showPrevNextJumpers = true, + showQuickJumper, + showLessItems, + showTitle = true, + onShowSizeChange = noop, + locale = zhCN, + style, + totalBoundaryShowSizeChanger = 50, + disabled, + simple, + showTotal, + showSizeChanger = total > totalBoundaryShowSizeChanger, + sizeChangerRender, + pageSizeOptions, + + // render + itemRender = defaultItemRender, + jumpPrevIcon, + jumpNextIcon, + prevIcon, + nextIcon, + } = props; + + const paginationRef = React.useRef(null); + + const [pageSize, setPageSize] = useControlledState( + defaultPageSize, + pageSizeProp, + ); + + const [internalCurrent, setCurrent] = useControlledState( + defaultCurrent, + currentProp, + ); + + const current = Math.max( + 1, + Math.min(internalCurrent, calculatePage(undefined, pageSize, total)), + ); + + const [internalInputVal, setInternalInputVal] = React.useState(current); + + useEffect(() => { + setInternalInputVal(current); + }, [current]); + + const hasOnChange = onChange !== noop; + const hasCurrent = 'current' in props; + + if (process.env.NODE_ENV !== 'production') { + warning( + hasCurrent ? hasOnChange : true, + 'You provided a `current` prop to a Pagination component without an `onChange` handler. This will render a read-only component.', + ); + } + + const jumpPrevPage = Math.max(1, current - (showLessItems ? 3 : 5)); + const jumpNextPage = Math.min( + calculatePage(undefined, pageSize, total), + current + (showLessItems ? 3 : 5), + ); + + function getItemIcon( + icon: React.ReactNode | React.ComponentType, + label: string, + ) { + let iconNode = icon || ( + + ); + } else { + gotoButton = ( + + {goButton} + + ); + } + + gotoButton = ( +
  • + {gotoButton} +
    • + ); + } + + simplePager = ( +
  • + {isReadOnly ? ( + internalInputVal + ) : ( + + )} + / + {allPages} +
    • + ); + } + + // ====================== Normal ====================== + const pageBufferSize = showLessItems ? 1 : 2; + if (allPages <= 3 + pageBufferSize * 2) { + if (!allPages) { + pagerList.push( + , + ); + } + + for (let i = 1; i <= allPages; i += 1) { + pagerList.push( + , + ); + } + } else { + const prevItemTitle = showLessItems ? locale.prev_3 : locale.prev_5; + const nextItemTitle = showLessItems ? locale.next_3 : locale.next_5; + + const jumpPrevContent = itemRender( + jumpPrevPage, + 'jump-prev', + getItemIcon(jumpPrevIcon, 'prev page'), + ); + const jumpNextContent = itemRender( + jumpNextPage, + 'jump-next', + getItemIcon(jumpNextIcon, 'next page'), + ); + + if (showPrevNextJumpers) { + jumpPrev = jumpPrevContent ? ( +
  • + {jumpPrevContent} +
    • + ) : null; + + jumpNext = jumpNextContent ? ( +
  • + {jumpNextContent} +
    • + ) : null; + } + + let left = Math.max(1, current - pageBufferSize); + let right = Math.min(current + pageBufferSize, allPages); + + if (current - 1 <= pageBufferSize) { + right = 1 + pageBufferSize * 2; + } + if (allPages - current <= pageBufferSize) { + left = allPages - pageBufferSize * 2; + } + + for (let i = left; i <= right; i += 1) { + pagerList.push( + , + ); + } + + if (current - 1 >= pageBufferSize * 2 && current !== 1 + 2) { + pagerList[0] = React.cloneElement(pagerList[0], { + className: clsx( + `${prefixCls}-item-after-jump-prev`, + pagerList[0].props.className, + ), + }); + + pagerList.unshift(jumpPrev); + } + + if (allPages - current >= pageBufferSize * 2 && current !== allPages - 2) { + const lastOne = pagerList[pagerList.length - 1]; + pagerList[pagerList.length - 1] = React.cloneElement(lastOne, { + className: clsx( + `${prefixCls}-item-before-jump-next`, + lastOne.props.className, + ), + }); + + pagerList.push(jumpNext); + } + + if (left !== 1) { + pagerList.unshift(); + } + if (right !== allPages) { + pagerList.push(); + } + } + + let prev = renderPrev(prevPage); + if (prev) { + const prevDisabled = !hasPrev || !allPages; + prev = ( +
  • + {prev} +
    • + ); + } + + let next = renderNext(nextPage); + if (next) { + let nextDisabled: boolean, nextTabIndex: number | null; + + if (simple) { + nextDisabled = !hasNext; + nextTabIndex = hasPrev ? 0 : null; + } else { + nextDisabled = !hasNext || !allPages; + nextTabIndex = nextDisabled ? null : 0; + } + + next = ( +
  • + {next} +
    • + ); + } + + const cls = clsx(prefixCls, className, { + [`${prefixCls}-start`]: align === 'start', + [`${prefixCls}-center`]: align === 'center', + [`${prefixCls}-end`]: align === 'end', + [`${prefixCls}-simple`]: simple, + [`${prefixCls}-disabled`]: disabled, + }); + + return ( +
      + {totalText} + {prev} + {simple ? simplePager : pagerList} + {next} + +
    + ); +}; + +if (process.env.NODE_ENV !== 'production') { + Pagination.displayName = 'Pagination'; +} + +export default Pagination; diff --git a/src/index.js b/src/index.js deleted file mode 100644 index eaef04eb..00000000 --- a/src/index.js +++ /dev/null @@ -1 +0,0 @@ -export { default } from './Pagination'; diff --git a/src/index.ts b/src/index.ts new file mode 100644 index 00000000..ac30e303 --- /dev/null +++ b/src/index.ts @@ -0,0 +1,2 @@ +export { default } from './Pagination'; +export type { PaginationLocale, PaginationProps } from './interface'; diff --git a/src/interface.ts b/src/interface.ts new file mode 100644 index 00000000..b37a0788 --- /dev/null +++ b/src/interface.ts @@ -0,0 +1,78 @@ +import type React from 'react'; +import type { SizeChangerRender } from './Options'; + +export interface PaginationLocale { + // Options + items_per_page?: string; + jump_to?: string; + jump_to_confirm?: string; + page?: string; + + // Pagination + prev_page?: string; + next_page?: string; + prev_5?: string; + next_5?: string; + prev_3?: string; + next_3?: string; + page_size?: string; +} + +type SemanticName = 'item'; + +export interface PaginationData { + styles?: Partial>; + classNames?: Partial>; + className: string; + selectPrefixCls: string; + prefixCls: string; + pageSizeOptions: number[]; + + current: number; + defaultCurrent: number; + total: number; + totalBoundaryShowSizeChanger?: number; + pageSize: number; + defaultPageSize: number; + + hideOnSinglePage: boolean; + align: 'start' | 'center' | 'end'; + showSizeChanger: boolean; + sizeChangerRender?: SizeChangerRender; + showLessItems: boolean; + showPrevNextJumpers: boolean; + showQuickJumper: boolean | object; + showTitle: boolean; + simple: boolean | { readOnly?: boolean }; + disabled: boolean; + + locale: PaginationLocale; + + style: React.CSSProperties; + + prevIcon: React.ComponentType | React.ReactNode; + nextIcon: React.ComponentType | React.ReactNode; + jumpPrevIcon: React.ComponentType | React.ReactNode; + jumpNextIcon: React.ComponentType | React.ReactNode; +} + +export interface PaginationProps + extends Partial, + React.AriaAttributes { + onChange?: (page: number, pageSize: number) => void; + onShowSizeChange?: (current: number, size: number) => void; + itemRender?: ( + page: number, + type: 'page' | 'prev' | 'next' | 'jump-prev' | 'jump-next', + element: React.ReactNode, + ) => React.ReactNode; + showTotal?: (total: number, range: [number, number]) => React.ReactNode; + // WAI-ARIA + role?: React.AriaRole | undefined; +} + +export interface PaginationState { + current: number; + currentInputValue: number; + pageSize: number; +} diff --git a/src/locale/am.ts b/src/locale/am.ts new file mode 100644 index 00000000..fedb6a92 --- /dev/null +++ b/src/locale/am.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ ግፅ', + jump_to: 'ሂድ ወደ', + jump_to_confirm: 'አረጋግጥ', + page: 'ገፅ', + + // Pagination + prev_page: 'ያለፈው ገፅ', + next_page: 'ቀጣይ ገፅ', + prev_5: 'ያለፈው 5 ገፅ', + next_5: 'ቀጣይ 5 ገፅ', + prev_3: 'ያለፈው 3 ገፅ', + next_3: 'ቀጣይ 3 ገፅ', + page_size: 'የገፅ መጠን', +}; + +export default locale; diff --git a/src/locale/ar_EG.js b/src/locale/ar_EG.ts similarity index 64% rename from src/locale/ar_EG.js rename to src/locale/ar_EG.ts index 3d0e9565..45453008 100644 --- a/src/locale/ar_EG.js +++ b/src/locale/ar_EG.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ الصفحة', jump_to: 'الذهاب إلى', jump_to_confirm: 'تأكيد', - page: '', + page: 'الصفحة', - // Pagination.jsx + // Pagination prev_page: 'الصفحة السابقة', next_page: 'الصفحة التالية', prev_5: 'خمس صفحات سابقة', next_5: 'خمس صفحات تالية', prev_3: 'ثلاث صفحات سابقة', next_3: 'ثلاث صفحات تالية', + page_size: 'مقاس الصفحه', }; + +export default locale; diff --git a/src/locale/az_AZ.ts b/src/locale/az_AZ.ts new file mode 100644 index 00000000..921d6784 --- /dev/null +++ b/src/locale/az_AZ.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ səhifə', + jump_to: 'Get', + jump_to_confirm: 'təsdiqlə', + page: '', + + // Pagination + prev_page: 'Əvvəlki Səhifə', + next_page: 'Növbəti Səhifə', + prev_5: 'Əvvəlki 5 Səhifə', + next_5: 'Növbəti 5 Səhifə', + prev_3: 'Əvvəlki 3 Səhifə', + next_3: 'Növbəti 3 Səhifə', + page_size: 'Page Size', +}; + +export default locale; diff --git a/src/locale/bg_BG.js b/src/locale/bg_BG.ts similarity index 71% rename from src/locale/bg_BG.js rename to src/locale/bg_BG.ts index 866229fb..b35f3db1 100644 --- a/src/locale/bg_BG.js +++ b/src/locale/bg_BG.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ страница', jump_to: 'Към', jump_to_confirm: 'потвърждавам', page: '', - // Pagination.jsx + // Pagination prev_page: 'Предишна страница', next_page: 'Следваща страница', prev_5: 'Предишни 5 страници', next_5: 'Следващи 5 страници', prev_3: 'Предишни 3 страници', next_3: 'Следващи 3 страници', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/bn_BD.ts b/src/locale/bn_BD.ts new file mode 100644 index 00000000..039d9c3b --- /dev/null +++ b/src/locale/bn_BD.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ পৃষ্ঠা', + jump_to: 'যাও', + jump_to_confirm: 'নিশ্চিত', + page: 'পৃষ্ঠা', + + // Pagination + prev_page: 'আগের পৃষ্ঠা', + next_page: 'পরের পৃষ্ঠা', + prev_5: 'পূর্ববর্তী ৫ পৃষ্ঠা', + next_5: 'পরবর্তী ৫ পৃষ্ঠা', + prev_3: 'পূর্ববর্তী ৩ পৃষ্ঠা', + next_3: 'পরবর্তী ৩ পৃষ্ঠা', + page_size: 'পাতার আকার', +}; + +export default locale; diff --git a/src/locale/by_BY.ts b/src/locale/by_BY.ts new file mode 100644 index 00000000..5284b579 --- /dev/null +++ b/src/locale/by_BY.ts @@ -0,0 +1,19 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/старонка', + jump_to: 'Перайсці', + jump_to_confirm: 'Пацвердзіць', + page: '', + // Pagination + prev_page: 'Назад', + next_page: 'Наперад', + prev_5: 'Папярэднія 5', + next_5: 'Наступныя 5', + prev_3: 'Папярэднія 3', + next_3: 'Наступныя 3', + page_size: 'памер старонкі', +}; + +export default locale; diff --git a/src/locale/ca_ES.js b/src/locale/ca_ES.ts similarity index 62% rename from src/locale/ca_ES.js rename to src/locale/ca_ES.ts index 49e06f74..22a16c58 100644 --- a/src/locale/ca_ES.js +++ b/src/locale/ca_ES.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ pàgina', jump_to: 'Anar a', jump_to_confirm: 'Confirma', page: '', - // Pagination.jsx + // Pagination prev_page: 'Pàgina prèvia', next_page: 'Pàgina següent', prev_5: '5 pàgines prèvies', next_5: '5 pàgines següents', prev_3: '3 pàgines prèvies', next_3: '3 pàgines següents', + page_size: 'mida de la pàgina', }; + +export default locale; diff --git a/src/locale/cs_CZ.js b/src/locale/cs_CZ.ts similarity index 64% rename from src/locale/cs_CZ.js rename to src/locale/cs_CZ.ts index 9a45a146..cdba815e 100644 --- a/src/locale/cs_CZ.js +++ b/src/locale/cs_CZ.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ strana', jump_to: 'Přejít', jump_to_confirm: 'potvrdit', page: '', - // Pagination.jsx + // Pagination prev_page: 'Předchozí strana', next_page: 'Následující strana', prev_5: 'Předchozích 5 stran', next_5: 'Následujících 5 stran', prev_3: 'Předchozí 3 strany', next_3: 'Následující 3 strany', + page_size: 'velikost stránky', }; + +export default locale; diff --git a/src/locale/da_DK.js b/src/locale/da_DK.ts similarity index 57% rename from src/locale/da_DK.js rename to src/locale/da_DK.ts index 277e1efd..24dbbd11 100644 --- a/src/locale/da_DK.js +++ b/src/locale/da_DK.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ side', jump_to: 'Gå til', jump_to_confirm: 'bekræft', - page: '', + page: 'Side', - // Pagination.jsx + // Pagination prev_page: 'Forrige Side', next_page: 'Næste Side', prev_5: 'Forrige 5 Sider', next_5: 'Næste 5 Sider', prev_3: 'Forrige 3 Sider', next_3: 'Næste 3 Sider', + page_size: 'sidestørrelse', }; + +export default locale; diff --git a/src/locale/de_DE.js b/src/locale/de_DE.ts similarity index 58% rename from src/locale/de_DE.js rename to src/locale/de_DE.ts index e6dd0215..aa595cef 100644 --- a/src/locale/de_DE.js +++ b/src/locale/de_DE.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ Seite', jump_to: 'Gehe zu', jump_to_confirm: 'bestätigen', - page: '', + page: 'Seite', - // Pagination.jsx + // Pagination prev_page: 'Vorherige Seite', next_page: 'Nächste Seite', prev_5: '5 Seiten zurück', next_5: '5 Seiten vor', prev_3: '3 Seiten zurück', next_3: '3 Seiten vor', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/el_GR.js b/src/locale/el_GR.ts similarity index 69% rename from src/locale/el_GR.js rename to src/locale/el_GR.ts index af0d6ea2..41ef95dd 100644 --- a/src/locale/el_GR.js +++ b/src/locale/el_GR.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ σελίδα', jump_to: 'Μετάβαση', jump_to_confirm: 'επιβεβαιώνω', page: '', - // Pagination.jsx + // Pagination prev_page: 'Προηγούμενη Σελίδα', next_page: 'Επόμενη Σελίδα', prev_5: 'Προηγούμενες 5 Σελίδες', next_5: 'Επόμενες 5 σελίδες', prev_3: 'Προηγούμενες 3 Σελίδες', next_3: 'Επόμενες 3 Σελίδες', + page_size: 'Μέγεθος σελίδας', }; + +export default locale; diff --git a/src/locale/en_GB.js b/src/locale/en_GB.ts similarity index 57% rename from src/locale/en_GB.js rename to src/locale/en_GB.ts index 0938b1d8..481ff0ef 100644 --- a/src/locale/en_GB.js +++ b/src/locale/en_GB.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ page', jump_to: 'Go to', jump_to_confirm: 'confirm', - page: '', + page: 'Page', - // Pagination.jsx + // Pagination prev_page: 'Previous Page', next_page: 'Next Page', prev_5: 'Previous 5 Pages', next_5: 'Next 5 Pages', prev_3: 'Previous 3 Pages', next_3: 'Next 3 Pages', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/en_US.js b/src/locale/en_US.ts similarity index 57% rename from src/locale/en_US.js rename to src/locale/en_US.ts index 0938b1d8..481ff0ef 100644 --- a/src/locale/en_US.js +++ b/src/locale/en_US.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ page', jump_to: 'Go to', jump_to_confirm: 'confirm', - page: '', + page: 'Page', - // Pagination.jsx + // Pagination prev_page: 'Previous Page', next_page: 'Next Page', prev_5: 'Previous 5 Pages', next_5: 'Next 5 Pages', prev_3: 'Previous 3 Pages', next_3: 'Next 3 Pages', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/es_ES.js b/src/locale/es_ES.ts similarity index 59% rename from src/locale/es_ES.js rename to src/locale/es_ES.ts index 595f2197..7139b67c 100644 --- a/src/locale/es_ES.js +++ b/src/locale/es_ES.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ página', jump_to: 'Ir a', jump_to_confirm: 'confirmar', - page: '', + page: 'Página', - // Pagination.jsx + // Pagination prev_page: 'Página anterior', next_page: 'Página siguiente', prev_5: '5 páginas previas', next_5: '5 páginas siguientes', prev_3: '3 páginas previas', next_3: '3 páginas siguientes', + page_size: 'tamaño de página', }; + +export default locale; diff --git a/src/locale/et_EE.js b/src/locale/et_EE.ts similarity index 64% rename from src/locale/et_EE.js rename to src/locale/et_EE.ts index f6574041..5978de8e 100644 --- a/src/locale/et_EE.js +++ b/src/locale/et_EE.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ leheküljel', jump_to: 'Hüppa', jump_to_confirm: 'Kinnitage', page: '', - // Pagination.jsx + // Pagination prev_page: 'Eelmine leht', next_page: 'Järgmine leht', prev_5: 'Eelmised 5 lehekülge', next_5: 'Järgmised 5 lehekülge', prev_3: 'Eelmised 3 lehekülge', next_3: 'Järgmised 3 lehekülge', + page_size: 'lehe suurus', }; + +export default locale; diff --git a/src/locale/eu_ES.ts b/src/locale/eu_ES.ts new file mode 100644 index 00000000..cf283b4f --- /dev/null +++ b/src/locale/eu_ES.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ orrialde', + jump_to: '-ra joan', + jump_to_confirm: 'baieztatu', + page: 'Orrialde', + + // Pagination + prev_page: 'Aurreko orrialdea', + next_page: 'Hurrengo orrialdea', + prev_5: 'aurreko 5 orrialde', + next_5: 'hurrengo 5 orrialde', + prev_3: 'aurreko 3 orrialde', + next_3: 'hurrengo 3 orrialde', + page_size: 'orrien tamaina', +}; + +export default locale; diff --git a/src/locale/fa_IR.js b/src/locale/fa_IR.ts similarity index 63% rename from src/locale/fa_IR.js rename to src/locale/fa_IR.ts index 65409601..240ae182 100644 --- a/src/locale/fa_IR.js +++ b/src/locale/fa_IR.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ صفحه', jump_to: 'برو به', jump_to_confirm: 'تایید', page: '', - // Pagination.jsx + // Pagination prev_page: 'صفحه قبلی', next_page: 'صفحه بعدی', prev_5: '۵ صفحه قبلی', next_5: '۵ صفحه بعدی', prev_3: '۳ صفحه قبلی', next_3: '۳ صفحه بعدی', + page_size: 'اندازه صفحه', }; + +export default locale; diff --git a/src/locale/fi_FI.js b/src/locale/fi_FI.ts similarity index 59% rename from src/locale/fi_FI.js rename to src/locale/fi_FI.ts index 40305d08..41e8ebde 100644 --- a/src/locale/fi_FI.js +++ b/src/locale/fi_FI.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ sivu', jump_to: 'Mene', jump_to_confirm: 'Potvrdite', - page: '', + page: 'Sivu', - // Pagination.jsx + // Pagination prev_page: 'Edellinen sivu', next_page: 'Seuraava sivu', prev_5: 'Edelliset 5 sivua', next_5: 'Seuraavat 5 sivua', prev_3: 'Edelliset 3 sivua', next_3: 'Seuraavat 3 sivua', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/fr_BE.js b/src/locale/fr_BE.ts similarity index 63% rename from src/locale/fr_BE.js rename to src/locale/fr_BE.ts index e7107062..08be8534 100644 --- a/src/locale/fr_BE.js +++ b/src/locale/fr_BE.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ page', jump_to: 'Aller à', jump_to_confirm: 'confirmer', page: '', - // Pagination.jsx + // Pagination prev_page: 'Page précédente', next_page: 'Page suivante', prev_5: '5 Pages précédentes', next_5: '5 Pages suivantes', prev_3: '3 Pages précédentes', next_3: '3 Pages suivantes', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/fr_FR.js b/src/locale/fr_CA.ts similarity index 59% rename from src/locale/fr_FR.js rename to src/locale/fr_CA.ts index e7107062..08179c48 100644 --- a/src/locale/fr_FR.js +++ b/src/locale/fr_CA.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ page', jump_to: 'Aller à', jump_to_confirm: 'confirmer', - page: '', + page: 'Page', - // Pagination.jsx + // Pagination prev_page: 'Page précédente', next_page: 'Page suivante', prev_5: '5 Pages précédentes', next_5: '5 Pages suivantes', prev_3: '3 Pages précédentes', next_3: '3 Pages suivantes', + page_size: 'taille de la page', }; + +export default locale; diff --git a/src/locale/fr_FR.ts b/src/locale/fr_FR.ts new file mode 100644 index 00000000..08179c48 --- /dev/null +++ b/src/locale/fr_FR.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ page', + jump_to: 'Aller à', + jump_to_confirm: 'confirmer', + page: 'Page', + + // Pagination + prev_page: 'Page précédente', + next_page: 'Page suivante', + prev_5: '5 Pages précédentes', + next_5: '5 Pages suivantes', + prev_3: '3 Pages précédentes', + next_3: '3 Pages suivantes', + page_size: 'taille de la page', +}; + +export default locale; diff --git a/src/locale/ga_IE.ts b/src/locale/ga_IE.ts new file mode 100644 index 00000000..44df59ff --- /dev/null +++ b/src/locale/ga_IE.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ leathanach', + jump_to: 'Téigh', + jump_to_confirm: 'dheimhnigh', + page: '', + + // Pagination + prev_page: 'Leathanach Roimhe Seo', + next_page: 'An chéad leathanach eile', + prev_5: '5 leathanach roimhe seo', + next_5: 'Ar Aghaidh 5 Leathanaigh', + prev_3: '3 leathanach roimhe seo', + next_3: 'Ar Aghaidh 3 Leathanaigh', + page_size: 'Page Size', +}; + +export default locale; diff --git a/src/locale/gl_ES.ts b/src/locale/gl_ES.ts new file mode 100644 index 00000000..1885bfb3 --- /dev/null +++ b/src/locale/gl_ES.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ páxina', + jump_to: 'Ir a', + jump_to_confirm: 'confirmar', + page: '', + + // Pagination + prev_page: 'Páxina anterior', + next_page: 'Páxina seguinte', + prev_5: '5 páxinas previas', + next_5: '5 páxinas seguintes', + prev_3: '3 páxinas previas', + next_3: '3 páxinas seguintes', + page_size: 'Page Size', +}; + +export default locale; diff --git a/src/locale/he_IL.js b/src/locale/he_IL.ts similarity index 66% rename from src/locale/he_IL.js rename to src/locale/he_IL.ts index 587dd809..f1825528 100644 --- a/src/locale/he_IL.js +++ b/src/locale/he_IL.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ עמוד', jump_to: 'עבור אל', jump_to_confirm: 'אישור', page: '', - // Pagination.jsx + // Pagination prev_page: 'העמוד הקודם', next_page: 'העמוד הבא', prev_5: '5 עמודים קודמים', next_5: '5 עמודים הבאים', prev_3: '3 עמודים קודמים', next_3: '3 עמודים הבאים', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/hi_IN.js b/src/locale/hi_IN.ts similarity index 71% rename from src/locale/hi_IN.js rename to src/locale/hi_IN.ts index ccebaec8..c204a323 100644 --- a/src/locale/hi_IN.js +++ b/src/locale/hi_IN.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ पृष्ठ', jump_to: 'इस पर चलें', jump_to_confirm: 'पुष्टि करें', page: '', - // Pagination.jsx + // Pagination prev_page: 'पिछला पृष्ठ', next_page: 'अगला पृष्ठ', prev_5: 'पिछले 5 पृष्ठ', next_5: 'अगले 5 पृष्ठ', prev_3: 'पिछले 3 पृष्ठ', next_3: 'अगले 3 पेज', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/hr_HR.js b/src/locale/hr_HR.ts similarity index 64% rename from src/locale/hr_HR.js rename to src/locale/hr_HR.ts index 12a93495..1d8ddd5c 100644 --- a/src/locale/hr_HR.js +++ b/src/locale/hr_HR.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ str', jump_to: 'Idi na', jump_to_confirm: 'potvrdi', page: '', - // Pagination.jsx + // Pagination prev_page: 'Prijašnja stranica', next_page: 'Sljedeća stranica', prev_5: 'Prijašnjih 5 stranica', next_5: 'Sljedećih 5 stranica', prev_3: 'Prijašnje 3 stranice', next_3: 'Sljedeće 3 stranice', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/hu_HU.js b/src/locale/hu_HU.ts similarity index 72% rename from src/locale/hu_HU.js rename to src/locale/hu_HU.ts index f8a3477e..5355c67c 100644 --- a/src/locale/hu_HU.js +++ b/src/locale/hu_HU.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ oldal', // '/ page', jump_to: 'Ugrás', // 'Goto', jump_to_confirm: 'megerősít', // 'confirm', page: '', - // Pagination.jsx + // Pagination prev_page: 'Előző oldal', // 'Previous Page', next_page: 'Következő oldal', // 'Next Page', prev_5: 'Előző 5 oldal', // 'Previous 5 Pages', next_5: 'Következő 5 oldal', // 'Next 5 Pages', prev_3: 'Előző 3 oldal', // 'Previous 3 Pages', next_3: 'Következő 3 oldal', // 'Next 3 Pages', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/id_ID.js b/src/locale/id_ID.ts similarity index 60% rename from src/locale/id_ID.js rename to src/locale/id_ID.ts index 3f1a7a8b..0a96afab 100644 --- a/src/locale/id_ID.js +++ b/src/locale/id_ID.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ halaman', jump_to: 'Menuju', jump_to_confirm: 'konfirmasi', - page: '', + page: 'Halaman', - // Pagination.jsx + // Pagination prev_page: 'Halaman Sebelumnya', next_page: 'Halaman Berikutnya', prev_5: '5 Halaman Sebelumnya', next_5: '5 Halaman Berikutnya', prev_3: '3 Halaman Sebelumnya', next_3: '3 Halaman Berikutnya', + page_size: 'ukuran halaman', }; + +export default locale; diff --git a/src/locale/is_IS.js b/src/locale/is_IS.ts similarity index 62% rename from src/locale/is_IS.js rename to src/locale/is_IS.ts index 962c35a9..ef035104 100644 --- a/src/locale/is_IS.js +++ b/src/locale/is_IS.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ síðu', jump_to: 'Síða', jump_to_confirm: 'staðfest', page: '', - // Pagination.jsx + // Pagination prev_page: 'Fyrri síða', next_page: 'Næsta síða', prev_5: 'Til baka 5 síður', next_5: 'Áfram 5 síður', prev_3: 'Til baka 3 síður', next_3: 'Áfram 3 síður', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/it_IT.js b/src/locale/it_IT.ts similarity index 58% rename from src/locale/it_IT.js rename to src/locale/it_IT.ts index 11fa6212..ae3c8967 100644 --- a/src/locale/it_IT.js +++ b/src/locale/it_IT.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ pagina', jump_to: 'vai a', jump_to_confirm: 'Conferma', - page: '', + page: 'Pagina', - // Pagination.jsx + // Pagination prev_page: 'Pagina precedente', next_page: 'Pagina successiva', prev_5: 'Precedente 5 pagine', next_5: 'Prossime 5 pagine', prev_3: 'Precedente 3 pagine', next_3: 'Prossime 3 pagine', + page_size: 'dimensioni della pagina', }; + +export default locale; diff --git a/src/locale/ja_JP.js b/src/locale/ja_JP.ts similarity index 54% rename from src/locale/ja_JP.js rename to src/locale/ja_JP.ts index f0ebaa9f..a954e093 100644 --- a/src/locale/ja_JP.js +++ b/src/locale/ja_JP.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx - items_per_page: '/ ページ', +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '件 / ページ', jump_to: '移動', jump_to_confirm: '確認する', page: 'ページ', - // Pagination.jsx + // Pagination prev_page: '前のページ', next_page: '次のページ', prev_5: '前 5ページ', next_5: '次 5ページ', prev_3: '前 3ページ', next_3: '次 3ページ', + page_size: 'ページサイズ', }; + +export default locale; diff --git a/src/locale/ka_GE.ts b/src/locale/ka_GE.ts new file mode 100644 index 00000000..db930520 --- /dev/null +++ b/src/locale/ka_GE.ts @@ -0,0 +1,19 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ გვერდი.', + jump_to: 'გადასვლა', + jump_to_confirm: 'დადასტურება', + page: '', + // Pagination + prev_page: 'წინა გვერდი', + next_page: 'შემდეგი გვერდი', + prev_5: 'წინა 5 გვერდი', + next_5: 'შემდეგი 5 გვერდი', + prev_3: 'წინა 3 გვერდი', + next_3: 'შემდეგი 3 გვერდი', + page_size: 'Page Size', +}; + +export default locale; diff --git a/src/locale/kk_KZ.ts b/src/locale/kk_KZ.ts new file mode 100644 index 00000000..3b4e9300 --- /dev/null +++ b/src/locale/kk_KZ.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ бет', + jump_to: 'Секіру', + jump_to_confirm: 'Растау', + page: '', + + // Pagination + prev_page: 'Артқа', + next_page: 'Алға', + prev_5: 'Алдыңғы 5', + next_5: 'Келесі 5', + prev_3: 'Алдыңғы 3', + next_3: 'Келесі 3', + page_size: 'Page Size', +}; + +export default locale; diff --git a/src/locale/km_KH.ts b/src/locale/km_KH.ts new file mode 100644 index 00000000..d7be29f5 --- /dev/null +++ b/src/locale/km_KH.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ ទំព័រ', + jump_to: 'លោត​ទៅ', + jump_to_confirm: 'បញ្ជាក់', + page: 'ទំព័រ', + + // Pagination + prev_page: 'ទំព័រ​មុន', + next_page: 'ទំព័រ​​បន្ទាប់', + prev_5: '៥ ទំព័រថយក្រោយ', + next_5: '៥ ទំព័រទៅមុខ', + prev_3: '៣ ទំព័រថយក្រោយ', + next_3: '៣ ទំព័រទៅមុខ', + page_size: 'Page Size', +}; + +export default locale; diff --git a/src/locale/ku_IQ.js b/src/locale/kmr_IQ.ts similarity index 62% rename from src/locale/ku_IQ.js rename to src/locale/kmr_IQ.ts index 7ce767c1..5995cf26 100644 --- a/src/locale/ku_IQ.js +++ b/src/locale/kmr_IQ.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ rûpel', jump_to: 'Biçe', jump_to_confirm: 'piştrast bike', page: '', - // Pagination.jsx + // Pagination prev_page: 'Rûpelê Pêş', next_page: 'Rûpelê Paş', prev_5: '5 Rûpelên Pêş', next_5: '5 Rûpelên Paş', prev_3: '3 Rûpelên Pêş', next_3: '3 Rûpelên Paş', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/kn_IN.js b/src/locale/kn_IN.ts similarity index 73% rename from src/locale/kn_IN.js rename to src/locale/kn_IN.ts index c2e0c991..085c7b76 100644 --- a/src/locale/kn_IN.js +++ b/src/locale/kn_IN.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ ಪುಟ', jump_to: 'ಜಿಗಿತವನ್ನು', jump_to_confirm: 'ಖಚಿತಪಡಿಸಲು ಜಿಗಿತವನ್ನು', page: '', - // Pagination.jsx + // Pagination prev_page: 'ಹಿಂದಿನ ಪುಟ', next_page: 'ಮುಂದಿನ ಪುಟ', prev_5: 'ಹಿಂದಿನ 5 ಪುಟಗಳು', next_5: 'ಮುಂದಿನ 5 ಪುಟಗಳು', prev_3: 'ಹಿಂದಿನ 3 ಪುಟಗಳು', next_3: 'ಮುಂದಿನ 3 ಪುಟಗಳು', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/ko_KR.js b/src/locale/ko_KR.ts similarity index 53% rename from src/locale/ko_KR.js rename to src/locale/ko_KR.ts index 3bdadcb6..fa8acf1c 100644 --- a/src/locale/ko_KR.js +++ b/src/locale/ko_KR.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx - items_per_page: '/ 쪽', +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ 페이지', jump_to: '이동하기', jump_to_confirm: '확인하다', - page: '', + page: '페이지', - // Pagination.jsx + // Pagination prev_page: '이전 페이지', next_page: '다음 페이지', prev_5: '이전 5 페이지', next_5: '다음 5 페이지', prev_3: '이전 3 페이지', next_3: '다음 3 페이지', + page_size: '페이지 크기', }; + +export default locale; diff --git a/src/locale/lt_LT.ts b/src/locale/lt_LT.ts new file mode 100644 index 00000000..e1066224 --- /dev/null +++ b/src/locale/lt_LT.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ psl.', + jump_to: 'Pereiti į', + jump_to_confirm: 'patvirtinti', + page: 'psl.', + + // Pagination + prev_page: 'Atgal', + next_page: 'Pirmyn', + prev_5: 'Grįžti 5 psl.', + next_5: 'Peršokti 5 psl.', + prev_3: 'Grįžti 3 psl.', + next_3: 'Peršokti 3 psl.', + page_size: 'Puslapio dydis', +}; + +export default locale; diff --git a/src/locale/lv_LV.js b/src/locale/lv_LV.ts similarity index 64% rename from src/locale/lv_LV.js rename to src/locale/lv_LV.ts index 0202c936..320368b8 100644 --- a/src/locale/lv_LV.js +++ b/src/locale/lv_LV.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ lappuse', jump_to: 'iet uz', jump_to_confirm: 'apstiprināt', page: '', - // Pagination.jsx + // Pagination prev_page: 'Iepriekšējā lapa', next_page: 'Nākamā lapaspuse', prev_5: 'Iepriekšējās 5 lapas', next_5: 'Nākamās 5 lapas', prev_3: 'Iepriekšējās 3 lapas', next_3: 'Nākamās 3 lapas', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/mk_MK.js b/src/locale/mk_MK.ts similarity index 70% rename from src/locale/mk_MK.js rename to src/locale/mk_MK.ts index 3dd23846..e1c494ec 100644 --- a/src/locale/mk_MK.js +++ b/src/locale/mk_MK.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ стр', jump_to: 'Оди на', jump_to_confirm: 'потврди', page: '', - // Pagination.jsx + // Pagination prev_page: 'Претходна страница', next_page: 'Наредна страница', prev_5: 'Претходни 5 страници', next_5: 'Наредни 5 страници', prev_3: 'Претходни 3 страници', next_3: 'Наредни 3 страници', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/ml_IN.ts b/src/locale/ml_IN.ts new file mode 100644 index 00000000..d761ce46 --- /dev/null +++ b/src/locale/ml_IN.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ പേജ്', + jump_to: 'അടുത്തത്', + jump_to_confirm: 'ഉറപ്പാക്കുക', + page: '', + + // Pagination + prev_page: 'മുൻപുള്ള പേജ്', + next_page: 'അടുത്ത പേജ്', + prev_5: 'മുൻപുള്ള 5 പേജുകൾ', + next_5: 'അടുത്ത 5 പേജുകൾ', + prev_3: 'മുൻപുള്ള 3 പേജുകൾ', + next_3: 'അടുത്ത 3 പേജുകൾ', + page_size: 'Page Size', +}; + +export default locale; diff --git a/src/locale/mn_MN.js b/src/locale/mn_MN.ts similarity index 69% rename from src/locale/mn_MN.js rename to src/locale/mn_MN.ts index fab8f938..18199be9 100644 --- a/src/locale/mn_MN.js +++ b/src/locale/mn_MN.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ хуудас', jump_to: 'Шилжих', jump_to_confirm: 'сонгох', page: '', - // Pagination.jsx + // Pagination prev_page: 'Өмнөх хуудас', next_page: 'Дараагийн хуудас', prev_5: 'Дараагийн 5 хуудас', next_5: 'Дараагийн 5 хуудас', prev_3: 'Дараагийн 3 хуудас', next_3: 'Дараагийн 3 хуудас', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/mr_IN.ts b/src/locale/mr_IN.ts new file mode 100644 index 00000000..eec6ec25 --- /dev/null +++ b/src/locale/mr_IN.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ पृष्ठ', + jump_to: 'यावर जा ', + jump_to_confirm: 'पुष्टी करा', + page: 'पृष्ठ', + + // Pagination + prev_page: 'मागील पृष्ठ', + next_page: 'पुढील पृष्ठ', + prev_5: 'मागील ५ पृष्ठे', + next_5: 'पुढील ५ पृष्ठे', + prev_3: 'मागील ३ पृष्ठे', + next_3: 'पुढील ३ पृष्ठे', + page_size: 'पृष्ठ आकार', +}; + +export default locale; diff --git a/src/locale/ms_MY.js b/src/locale/ms_MY.ts similarity index 64% rename from src/locale/ms_MY.js rename to src/locale/ms_MY.ts index faa080dc..2e3366d1 100644 --- a/src/locale/ms_MY.js +++ b/src/locale/ms_MY.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ halaman', jump_to: 'Lompat ke', jump_to_confirm: 'Sahkan', page: '', - // Pagination.jsx + // Pagination prev_page: 'Halaman sebelumnya', next_page: 'Halam seterusnya', prev_5: '5 halaman sebelum', next_5: '5 halaman seterusnya', prev_3: '3 halaman sebelumnya', next_3: '3 halaman seterusnya', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/mm_MM.js b/src/locale/my_MM.ts similarity index 74% rename from src/locale/mm_MM.js rename to src/locale/my_MM.ts index 30dca892..ad84ab40 100644 --- a/src/locale/mm_MM.js +++ b/src/locale/my_MM.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ စာမျက်နှာ', jump_to: 'သွားရန်', jump_to_confirm: 'သေချာပြီ', page: '', - // Pagination.jsx + // Pagination prev_page: 'ယခင်စာမျက်နှာ', next_page: 'နောက်စာမျက်နှာ', prev_5: 'ယခင် ၅ခုမြောက်', next_5: 'နောက် ၅ခုမြောက်', prev_3: 'ယခင် ၃ခုမြောက်', next_3: 'နောက် ၃ခုမြောက်', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/nb_NO.js b/src/locale/nb_NO.ts similarity index 51% rename from src/locale/nb_NO.js rename to src/locale/nb_NO.ts index fb70c452..3b357934 100644 --- a/src/locale/nb_NO.js +++ b/src/locale/nb_NO.ts @@ -1,14 +1,19 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ side', jump_to: 'Gå til side', - page: '', + page: 'Side', - // Pagination.jsx + // Pagination prev_page: 'Forrige side', next_page: 'Neste side', prev_5: '5 forrige', next_5: '5 neste', prev_3: '3 forrige', next_3: '3 neste', + page_size: 'sidestørrelse', }; + +export default locale; diff --git a/src/locale/ne_NP.js b/src/locale/ne_NP.js new file mode 100644 index 00000000..fbf48957 --- /dev/null +++ b/src/locale/ne_NP.js @@ -0,0 +1,16 @@ +export default { + // Options.jsx + items_per_page: '/ पृष्ठ', + jump_to: 'जाऊ त्यहाँ', + jump_to_confirm: 'पुष्टि गर्नुहोस्', + page: 'पृष्ठ', + + // Pagination.jsx + prev_page: 'अघिल्लो पृष्ठ', + next_page: 'अर्को पृष्ठ', + prev_5: 'अघिल्लो 5 पृष्ठहरू', + next_5: 'अर्को 5 पृष्ठहरू', + prev_3: 'अघिल्लो 3 पृष्ठहरू', + next_3: 'अर्को 3 पृष्ठहरू', + page_size: 'पृष्ठ आकार', +}; diff --git a/src/locale/nl_BE.js b/src/locale/nl_BE.js deleted file mode 100644 index 26a327b3..00000000 --- a/src/locale/nl_BE.js +++ /dev/null @@ -1,15 +0,0 @@ -export default { - // Options.jsx - items_per_page: '/ pagina', - jump_to: 'Ga naar', - jump_to_confirm: 'bevestigen', - page: '', - - // Pagination.jsx - prev_page: 'Vorige pagina', - next_page: 'Volgende pagina', - prev_5: 'Vorige 5 pagina\'s', - next_5: 'Volgende 5 pagina\'s', - prev_3: 'Vorige 3 pagina\'s', - next_3: 'Volgende 3 pagina\'s', -}; diff --git a/src/locale/nl_BE.ts b/src/locale/nl_BE.ts new file mode 100644 index 00000000..f3264b4e --- /dev/null +++ b/src/locale/nl_BE.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ pagina', + jump_to: 'Ga naar', + jump_to_confirm: 'bevestigen', + page: '', + + // Pagination + prev_page: 'Vorige pagina', + next_page: 'Volgende pagina', + prev_5: "Vorige 5 pagina's", + next_5: "Volgende 5 pagina's", + prev_3: "Vorige 3 pagina's", + next_3: "Volgende 3 pagina's", + page_size: 'Page Size', +}; + +export default locale; diff --git a/src/locale/nl_NL.js b/src/locale/nl_NL.js deleted file mode 100644 index 26a327b3..00000000 --- a/src/locale/nl_NL.js +++ /dev/null @@ -1,15 +0,0 @@ -export default { - // Options.jsx - items_per_page: '/ pagina', - jump_to: 'Ga naar', - jump_to_confirm: 'bevestigen', - page: '', - - // Pagination.jsx - prev_page: 'Vorige pagina', - next_page: 'Volgende pagina', - prev_5: 'Vorige 5 pagina\'s', - next_5: 'Volgende 5 pagina\'s', - prev_3: 'Vorige 3 pagina\'s', - next_3: 'Volgende 3 pagina\'s', -}; diff --git a/src/locale/nl_NL.ts b/src/locale/nl_NL.ts new file mode 100644 index 00000000..1a5375c1 --- /dev/null +++ b/src/locale/nl_NL.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ pagina', + jump_to: 'Ga naar', + jump_to_confirm: 'bevestigen', + page: 'Pagina', + + // Pagination + prev_page: 'Vorige pagina', + next_page: 'Volgende pagina', + prev_5: "Vorige 5 pagina's", + next_5: "Volgende 5 pagina's", + prev_3: "Vorige 3 pagina's", + next_3: "Volgende 3 pagina's", + page_size: 'pagina grootte', +}; + +export default locale; diff --git a/src/locale/pa_IN.js b/src/locale/pa_IN.ts similarity index 69% rename from src/locale/pa_IN.js rename to src/locale/pa_IN.ts index ff527d95..1df09fb0 100644 --- a/src/locale/pa_IN.js +++ b/src/locale/pa_IN.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ ਪੰਨਾ', jump_to: 'Goto', jump_to_confirm: 'ਪੁਸ਼ਟੀ ਕਰੋ', page: 'ਪੰਨਾ', - // Pagination.jsx + // Pagination prev_page: 'ਪਿਛਲਾ ਪੰਨਾ', next_page: 'ਅਗਲਾ ਪੰਨਾ', prev_5: 'ਪਿਛਲੇ 5 ਪੰਨੇ', next_5: 'ਅਗਲੇ 5 ਪੰਨੇ', prev_3: 'ਪਿਛਲੇ 3 ਪੰਨੇ', next_3: 'ਅਗਲੇ 3 ਪੰਨੇ', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/pb_IN.js b/src/locale/pb_IN.ts similarity index 69% rename from src/locale/pb_IN.js rename to src/locale/pb_IN.ts index ff527d95..1df09fb0 100644 --- a/src/locale/pb_IN.js +++ b/src/locale/pb_IN.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ ਪੰਨਾ', jump_to: 'Goto', jump_to_confirm: 'ਪੁਸ਼ਟੀ ਕਰੋ', page: 'ਪੰਨਾ', - // Pagination.jsx + // Pagination prev_page: 'ਪਿਛਲਾ ਪੰਨਾ', next_page: 'ਅਗਲਾ ਪੰਨਾ', prev_5: 'ਪਿਛਲੇ 5 ਪੰਨੇ', next_5: 'ਅਗਲੇ 5 ਪੰਨੇ', prev_3: 'ਪਿਛਲੇ 3 ਪੰਨੇ', next_3: 'ਅਗਲੇ 3 ਪੰਨੇ', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/pl_PL.js b/src/locale/pl_PL.js deleted file mode 100644 index 7c16a730..00000000 --- a/src/locale/pl_PL.js +++ /dev/null @@ -1,15 +0,0 @@ -export default { - // Options.jsx - items_per_page: '/ stronę', - jump_to: 'Idź do', - jump_to_confirm: 'potwierdzać', - page: '', - - // Pagination.jsx - prev_page: 'Poprzednia strona', - next_page: 'Następna strona', - prev_5: 'Poprzednie 5 stron', - next_5: 'Następne 5 stron', - prev_3: 'Poprzednie 3 strony', - next_3: 'Następne 3 strony', -}; diff --git a/src/locale/pl_PL.ts b/src/locale/pl_PL.ts new file mode 100644 index 00000000..94f2af73 --- /dev/null +++ b/src/locale/pl_PL.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: 'na stronę', + jump_to: 'Idź do', + jump_to_confirm: 'potwierdź', + page: '', + + // Pagination + prev_page: 'Poprzednia strona', + next_page: 'Następna strona', + prev_5: 'Poprzednie 5 stron', + next_5: 'Następne 5 stron', + prev_3: 'Poprzednie 3 strony', + next_3: 'Następne 3 strony', + page_size: 'rozmiar strony', +}; + +export default locale; diff --git a/src/locale/pt_BR.js b/src/locale/pt_BR.ts similarity index 59% rename from src/locale/pt_BR.js rename to src/locale/pt_BR.ts index 44f97775..68713507 100644 --- a/src/locale/pt_BR.js +++ b/src/locale/pt_BR.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ página', jump_to: 'Vá até', jump_to_confirm: 'confirme', - page: '', + page: 'Página', - // Pagination.jsx + // Pagination prev_page: 'Página anterior', next_page: 'Próxima página', prev_5: '5 páginas anteriores', next_5: '5 próximas páginas', prev_3: '3 páginas anteriores', next_3: '3 próximas páginas', + page_size: 'tamanho da página', }; + +export default locale; diff --git a/src/locale/pt_PT.js b/src/locale/pt_PT.ts similarity index 59% rename from src/locale/pt_PT.js rename to src/locale/pt_PT.ts index 2f817a70..d82c1903 100644 --- a/src/locale/pt_PT.js +++ b/src/locale/pt_PT.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ página', jump_to: 'Saltar', jump_to_confirm: 'confirmar', - page: '', + page: 'Página', - // Pagination.jsx + // Pagination prev_page: 'Página Anterior', next_page: 'Página Seguinte', prev_5: 'Recuar 5 Páginas', next_5: 'Avançar 5 Páginas', prev_3: 'Recuar 3 Páginas', next_3: 'Avançar 3 Páginas', + page_size: 'mărimea paginii', }; + +export default locale; diff --git a/src/locale/ro_RO.js b/src/locale/ro_RO.ts similarity index 64% rename from src/locale/ro_RO.js rename to src/locale/ro_RO.ts index a78310fc..fe40e368 100644 --- a/src/locale/ro_RO.js +++ b/src/locale/ro_RO.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ pagină', jump_to: 'Mergi la', jump_to_confirm: 'confirm', page: '', - // Pagination.jsx + // Pagination prev_page: 'Pagina Anterioară', next_page: 'Pagina Următoare', prev_5: '5 Pagini Anterioare', next_5: '5 Pagini Următoare', prev_3: '3 Pagini Anterioare', next_3: '3 Pagini Următoare', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/ru_RU.js b/src/locale/ru_RU.ts similarity index 58% rename from src/locale/ru_RU.js rename to src/locale/ru_RU.ts index 835e094d..7aa3fd1a 100644 --- a/src/locale/ru_RU.js +++ b/src/locale/ru_RU.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ стр.', jump_to: 'Перейти', jump_to_confirm: 'подтвердить', - page: '', + page: 'Страница', - // Pagination.jsx + // Pagination prev_page: 'Назад', next_page: 'Вперед', prev_5: 'Предыдущие 5', next_5: 'Следующие 5', prev_3: 'Предыдущие 3', next_3: 'Следующие 3', + page_size: 'размер страницы', }; + +export default locale; diff --git a/src/locale/si_LK.ts b/src/locale/si_LK.ts new file mode 100644 index 00000000..cb83031b --- /dev/null +++ b/src/locale/si_LK.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ පිටුව', + jump_to: 'වෙත යන්න', + jump_to_confirm: 'තහවුරු', + page: 'පිටුව', + + // Pagination + prev_page: 'කලින් පිටුව', + next_page: 'ඊළඟ පිටුව', + prev_5: 'කලින් පිටු 5', + next_5: 'ඊළඟ පිටු 5', + prev_3: 'කලින් පිටු 3', + next_3: 'ඊළඟ පිටු 3', + page_size: 'පිටුවේ ප්‍රමාණය', +}; + +export default locale; diff --git a/src/locale/sk_SK.js b/src/locale/sk_SK.ts similarity index 65% rename from src/locale/sk_SK.js rename to src/locale/sk_SK.ts index 0cf02302..a994cb5f 100644 --- a/src/locale/sk_SK.js +++ b/src/locale/sk_SK.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ strana', jump_to: 'Choď na', jump_to_confirm: 'potvrdit', page: '', - // Pagination.jsx + // Pagination prev_page: 'Predchádzajúca strana', next_page: 'Nasledujúca strana', prev_5: 'Predchádzajúcich 5 strán', next_5: 'Nasledujúcich 5 strán', prev_3: 'Predchádzajúce 3 strany', next_3: 'Nasledujúce 3 strany', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/sl_SI.js b/src/locale/sl_SI.ts similarity index 63% rename from src/locale/sl_SI.js rename to src/locale/sl_SI.ts index 5b4ffd78..e09728d7 100644 --- a/src/locale/sl_SI.js +++ b/src/locale/sl_SI.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ strani', jump_to: 'Pojdi na', jump_to_confirm: 'potrdi', page: '', - // Pagination.jsx + // Pagination prev_page: 'Prejšnja stran', next_page: 'Naslednja stran', prev_5: 'Prejšnjih 5 strani', next_5: 'Naslednjih 5 strani', prev_3: 'Prejšnje 3 strani', next_3: 'Naslednje 3 strani', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/sr_Cyrl_RS.js b/src/locale/sr_Cyrl_RS.js new file mode 100644 index 00000000..6a998ea2 --- /dev/null +++ b/src/locale/sr_Cyrl_RS.js @@ -0,0 +1,15 @@ +export default { + // Options.jsx + items_per_page: '/ страни', + jump_to: 'Иди на', + page: '', + + // Pagination.jsx + prev_page: 'Претходна страна', + next_page: 'Следећа страна', + prev_5: 'Претходних 5 Страна', + next_5: 'Следећих 5 Страна', + prev_3: 'Претходних 3 Стране', + next_3: 'Следећих 3 Стране', + page_size: 'Page Size', +}; diff --git a/src/locale/sr_RS.js b/src/locale/sr_RS.ts similarity index 60% rename from src/locale/sr_RS.js rename to src/locale/sr_RS.ts index a8c526b1..eee0cc12 100644 --- a/src/locale/sr_RS.js +++ b/src/locale/sr_RS.ts @@ -1,14 +1,19 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ strani', jump_to: 'Idi na', page: '', - // Pagination.jsx + // Pagination prev_page: 'Prethodna strana', next_page: 'Sledeća strana', prev_5: 'Prethodnih 5 Strana', next_5: 'Sledećih 5 Strana', prev_3: 'Prethodnih 3 Strane', next_3: 'Sledećih 3 Strane', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/sv_SE.js b/src/locale/sv_SE.ts similarity index 57% rename from src/locale/sv_SE.js rename to src/locale/sv_SE.ts index 0c2f48c0..e5ec562f 100644 --- a/src/locale/sv_SE.js +++ b/src/locale/sv_SE.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ sida', jump_to: 'Gå till', jump_to_confirm: 'bekräfta', - page: '', + page: 'Sida', - // Pagination.jsx + // Pagination prev_page: 'Föreg sida', next_page: 'Nästa sida', prev_5: 'Föreg 5 sidor', next_5: 'Nästa 5 sidor', prev_3: 'Föreg 3 sidor', next_3: 'Nästa 3 sidor', + page_size: 'sidstorlek', }; + +export default locale; diff --git a/src/locale/ta_IN.js b/src/locale/ta_IN.ts similarity index 75% rename from src/locale/ta_IN.js rename to src/locale/ta_IN.ts index 7c1adcdd..03fd8c16 100644 --- a/src/locale/ta_IN.js +++ b/src/locale/ta_IN.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ பக்கம்', jump_to: 'அடுத்த', jump_to_confirm: 'உறுதிப்படுத்தவும்', page: '', - // Pagination.jsx + // Pagination prev_page: 'முந்தைய பக்கம்', next_page: 'அடுத்த பக்கம்', prev_5: 'முந்தைய 5 பக்கங்கள்', next_5: 'அடுத்த 5 பக்கங்கள்', prev_3: 'முந்தைய 3 பக்கங்கள்', next_3: 'அடுத்த 3 பக்கங்கள்', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/te_IN.ts b/src/locale/te_IN.ts new file mode 100644 index 00000000..ea162c3c --- /dev/null +++ b/src/locale/te_IN.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + //options + items_per_page: '/ పేజీ', + jump_to: 'వెళ్ళండి', + jump_to_confirm: 'నిర్ధారించండి', + page: 'పేజీ', + + //pagination + prev_page: 'మునుపటి పేజీ', + next_page: 'తదుపరి పేజీ', + prev_5: 'మునుపటి 5 పేజీలు', + next_5: 'తదుపరి 5 పేజీలు', + prev_3: 'మునుపటి 3 పేజీలు', + next_3: 'తదుపరి 3 పేజీలు', + page_size: 'పేజీ పరిమాణం', +}; + +export default locale; diff --git a/src/locale/th_TH.js b/src/locale/th_TH.ts similarity index 65% rename from src/locale/th_TH.js rename to src/locale/th_TH.ts index 9cfa90a7..18a41cd5 100644 --- a/src/locale/th_TH.js +++ b/src/locale/th_TH.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ หน้า', jump_to: 'ไปยัง', jump_to_confirm: 'ยืนยัน', - page: '', + page: 'หน้า', - // Pagination.jsx + // Pagination prev_page: 'หน้าก่อนหน้า', next_page: 'หน้าถัดไป', prev_5: 'ย้อนกลับ 5 หน้า', next_5: 'ถัดไป 5 หน้า', prev_3: 'ย้อนกลับ 3 หน้า', next_3: 'ถัดไป 3 หน้า', + page_size: 'ขนาดหน้า', }; + +export default locale; diff --git a/src/locale/tk_TK.ts b/src/locale/tk_TK.ts new file mode 100644 index 00000000..685c5ece --- /dev/null +++ b/src/locale/tk_TK.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ sahypa', + jump_to: 'Git', + jump_to_confirm: 'tassykla', + page: 'Sahypa', + + // Pagination + prev_page: 'Öňki sahypa', + next_page: 'Soňky sahypa', + prev_5: 'Öňki 5 sahypa', + next_5: 'Soňky 5 sahypa', + prev_3: 'Öňki 3 sahypa', + next_3: 'Soňky 3 sahypa', + page_size: 'Sahypa sany', +}; + +export default locale; diff --git a/src/locale/tr_TR.js b/src/locale/tr_TR.ts similarity index 57% rename from src/locale/tr_TR.js rename to src/locale/tr_TR.ts index 9a462731..5e3b61b6 100644 --- a/src/locale/tr_TR.js +++ b/src/locale/tr_TR.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ sayfa', jump_to: 'Git', jump_to_confirm: 'onayla', - page: '', + page: 'Sayfa', - // Pagination.jsx + // Pagination prev_page: 'Önceki Sayfa', next_page: 'Sonraki Sayfa', prev_5: 'Önceki 5 Sayfa', next_5: 'Sonraki 5 Sayfa', prev_3: 'Önceki 3 Sayfa', next_3: 'Sonraki 3 Sayfa', + page_size: 'sayfa boyutu', }; + +export default locale; diff --git a/src/locale/ug_CN.js b/src/locale/ug_CN.ts similarity index 68% rename from src/locale/ug_CN.js rename to src/locale/ug_CN.ts index 298a089f..5ee905ac 100644 --- a/src/locale/ug_CN.js +++ b/src/locale/ug_CN.ts @@ -1,14 +1,19 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: 'تال/ھەر بەت', jump_to: 'بەتكە سەكرەش', jump_to_confirm: 'مۇقىملاشتۇرۇش', page: 'بەت', - // Pagination.jsx + // Pagination prev_page: 'ئالدىنقى', next_page: 'كېيىنكى', prev_5: 'ئالدىغا 5 بەت', next_5: 'كەينىگە 5 بەت', prev_3: 'ئالدىغا 3 بەت', next_3: 'كەينىگە 3 بەت', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/uk_UA.js b/src/locale/uk_UA.ts similarity index 71% rename from src/locale/uk_UA.js rename to src/locale/uk_UA.ts index bab3544c..9e2b4dc1 100644 --- a/src/locale/uk_UA.js +++ b/src/locale/uk_UA.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ сторінці', jump_to: 'Перейти', jump_to_confirm: 'підтвердити', page: '', - // Pagination.jsx + // Pagination prev_page: 'Попередня сторінка', next_page: 'Наступна сторінка', prev_5: 'Попередні 5 сторінок', next_5: 'Наступні 5 сторінок', prev_3: 'Попередні 3 сторінки', next_3: 'Наступні 3 сторінки', + page_size: 'Page Size', }; + +export default locale; diff --git a/src/locale/ur_PK.ts b/src/locale/ur_PK.ts new file mode 100644 index 00000000..6fc2b210 --- /dev/null +++ b/src/locale/ur_PK.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ صفحہ', + jump_to: 'پاس جاؤ', + jump_to_confirm: 'تصدیق کریں', + page: '', + + // Pagination + prev_page: 'پچھلا صفحہ', + next_page: 'اگلا صفحہ', + prev_5: 'پچھلے 5 صفحات', + next_5: 'اگلے 5 صفحات', + prev_3: 'پچھلے 3 صفحات', + next_3: 'اگلے 3 صفحات', + page_size: 'Page Size', +}; + +export default locale; diff --git a/src/locale/uz_UZ.ts b/src/locale/uz_UZ.ts new file mode 100644 index 00000000..5aef80d4 --- /dev/null +++ b/src/locale/uz_UZ.ts @@ -0,0 +1,20 @@ +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options + items_per_page: '/ sah.', + jump_to: "O'tish", + jump_to_confirm: 'tasdiqlash', + page: 'Sahifa', + + // Pagination + prev_page: 'Orqaga', + next_page: 'Oldinga', + prev_5: 'Oldingi 5', + next_5: 'Keyingi 5', + prev_3: 'Oldingi 3', + next_3: 'Keyingi 3', + page_size: 'sahifa hajmi', +}; + +export default locale; diff --git a/src/locale/vi_VN.js b/src/locale/vi_VN.ts similarity index 58% rename from src/locale/vi_VN.js rename to src/locale/vi_VN.ts index 7ffbf7de..99b50aab 100644 --- a/src/locale/vi_VN.js +++ b/src/locale/vi_VN.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '/ trang', jump_to: 'Đến', jump_to_confirm: 'xác nhận', - page: '', + page: 'Trang', - // Pagination.jsx + // Pagination prev_page: 'Trang Trước', next_page: 'Trang Kế', prev_5: 'Về 5 Trang Trước', next_5: 'Đến 5 Trang Kế', prev_3: 'Về 3 Trang Trước', next_3: 'Đến 3 Trang Kế', + page_size: 'kích thước trang', }; + +export default locale; diff --git a/src/locale/zh_CN.js b/src/locale/zh_CN.ts similarity index 60% rename from src/locale/zh_CN.js rename to src/locale/zh_CN.ts index 0db7d226..51ed359a 100644 --- a/src/locale/zh_CN.js +++ b/src/locale/zh_CN.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '条/页', jump_to: '跳至', jump_to_confirm: '确定', page: '页', - // Pagination.jsx + // Pagination prev_page: '上一页', next_page: '下一页', prev_5: '向前 5 页', next_5: '向后 5 页', prev_3: '向前 3 页', next_3: '向后 3 页', + page_size: '页码', }; + +export default locale; diff --git a/src/locale/zh_TW.js b/src/locale/zh_TW.ts similarity index 60% rename from src/locale/zh_TW.js rename to src/locale/zh_TW.ts index 2654d3bb..57da9587 100644 --- a/src/locale/zh_TW.js +++ b/src/locale/zh_TW.ts @@ -1,15 +1,20 @@ -export default { - // Options.jsx +import type { PaginationLocale } from '../interface'; + +const locale: PaginationLocale = { + // Options items_per_page: '條/頁', jump_to: '跳至', jump_to_confirm: '確定', page: '頁', - // Pagination.jsx + // Pagination prev_page: '上一頁', next_page: '下一頁', prev_5: '向前 5 頁', next_5: '向後 5 頁', prev_3: '向前 3 頁', next_3: '向後 3 頁', + page_size: '頁碼', }; + +export default locale; diff --git a/tests/Pagination.spec.js b/tests/Pagination.spec.js deleted file mode 100644 index 65281b47..00000000 --- a/tests/Pagination.spec.js +++ /dev/null @@ -1,1011 +0,0 @@ -/* eslint func-names: 0, no-console: 0 */ -import expect from 'expect.js'; -import Pagination from '../src'; -import Select from 'rc-select'; -import React from 'react'; -import TestUtils from 'react-dom/test-utils'; -import ReactDOM from 'react-dom'; -import TwoPagination from './helper/two-pagination'; - -const Simulate = TestUtils.Simulate; - -describe('Uncontrolled Pagination', () => { - let pagination = null; - const container = document.createElement('div'); - document.body.appendChild(container); - - let current = 1; - let pageSize; - function onChange(page, pSize) { - current = page; - pageSize = pSize; - } - - function shouldHighlightRight() { - const pagers = TestUtils.scryRenderedDOMComponentsWithTag(pagination, 'li') - .filter(pager => pager.className.indexOf('rc-pagination-total-text') === -1); - const current2 = pagination.state.current; - pagers.forEach((pager, index) => { - // page starts from 1 - if (index === current2) { - expect(pager.className).to.contain('rc-pagination-item-active'); - } else { - expect(pager.className).to.not.contain('rc-pagination-item-active'); - } - }); - } - - beforeEach((done) => { - ReactDOM.render( - `${range[0]} - ${range[1]} of ${total} items`} - />, - container, - function () { - pagination = this; - done(); - }, - ); - }); - - afterEach(() => { - ReactDOM.unmountComponentAtNode(container); - current = 1; - }); - - it('default current page is 1', () => { - const current2 = pagination.state.current; - expect(current2).to.be(1); - }); - - it('prev-button should be disabled', () => { - const prevButton = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-prev' - ); - expect(TestUtils.isDOMComponent(prevButton)).to.be(true); - expect(prevButton.className).to.contain('rc-pagination-disabled'); - expect(prevButton.getAttribute('aria-disabled')).to.equal('true'); - }); - - it('should hightlight current page and not highlight other page', shouldHighlightRight); - - it('should calc page right', () => { - const pagers = TestUtils.scryRenderedDOMComponentsWithTag(pagination, 'li') - .filter(pager => pager.className.indexOf('rc-pagination-total-text') === -1) - .filter(pager => pager.className.indexOf('rc-pagination-options') === -1); - const knownPageCount = 3; - const buttonLength = 2; - expect(pagers.length).to.be(knownPageCount + buttonLength); - }); - - it('next button should not be disabled', () => { - const nextButton = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-next' - ); - - expect(TestUtils.isDOMComponent(nextButton)).to.be(true); - expect(nextButton.className).to.not.contain('rc-pagination-disabled'); - expect(nextButton.getAttribute('aria-disabled')).to.equal('false'); - }); - - it('should response mouse click right', (done) => { - const pagers = TestUtils.scryRenderedDOMComponentsWithClass(pagination, 'rc-pagination-item'); - expect(pagers.length).to.be(3); - const page2 = pagers[1]; - expect(TestUtils.isDOMComponent(page2)).to.be(true); - expect(page2.className).to.contain('rc-pagination-item-2'); - - Simulate.click(page2); - setTimeout(() => { - expect(pagination.state.current).to.be(2); - expect(current).to.be(2); - expect(pageSize).to.be(10); - shouldHighlightRight(); - done(); - }, 10); - }); - - it('should response next page', (done) => { - const nextButton = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-next' - ); - expect(TestUtils.isDOMComponent(nextButton)).to.be(true); - Simulate.click(nextButton); - setTimeout(() => { - expect(pagination.state.current).to.be(2); - expect(current).to.be(2); - expect(pageSize).to.be(10); - done(); - }, 10); - }); - - it('should quick jump to expect page', (done) => { - const quickJumper = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-options-quick-jumper' - ); - const input = quickJumper.querySelector('input'); - const goButton = quickJumper.querySelector('button'); - expect(TestUtils.isDOMComponent(quickJumper)).to.be(true); - expect(TestUtils.isDOMComponent(input)).to.be(true); - expect(TestUtils.isDOMComponent(goButton)).to.be(true); - Simulate.change(input, { target: { value: '2' } }); - setTimeout(() => { - Simulate.click(goButton); - setTimeout(() => { - expect(pagination.state.current).to.be(2); - expect(current).to.be(2); - expect(pageSize).to.be(10); - done(); - }, 10); - }, 10); - }); - - // https://github.com/ant-design/ant-design/issues/17763 - it('should not jump when blur input when there is goButton', (done) => { - const quickJumper = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-options-quick-jumper' - ); - const input = quickJumper.querySelector('input'); - Simulate.change(input, { target: { value: '2' } }); - setTimeout(() => { - Simulate.blur(input); - setTimeout(() => { - expect(pagination.state.current).to.be(1); - expect(current).to.be(1); - done(); - }, 10); - }, 10); - }); - - // https://github.com/ant-design/ant-design/issues/17763 - it('should not jump when blur input when there is not goButton', (done) => { - ReactDOM.render( - , - container, - function () { - const quickJumper = TestUtils.findRenderedDOMComponentWithClass( - this, 'rc-pagination-options-quick-jumper', - ); - const input = quickJumper.querySelector('input'); - Simulate.change(input, { target: { value: '2' } }); - setTimeout(() => { - Simulate.blur(input); - setTimeout(() => { - expect(this.state.current).to.be(2); - done(); - }, 10); - }, 10); - }, - ); - }); - - // https://github.com/ant-design/ant-design/issues/15539 - it('should hide quick jumper when only one page', (done) => { - ReactDOM.render( - , - container, - function () { - expect(() => { - TestUtils.findRenderedDOMComponentWithClass(this, 'rc-pagination-options-quick-jumper'); - }).to.throwException(/Did not find exactly one match/); - done(); - }, - ); - }); - - it('should display total items', (done) => { - const totalText = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-total-text' - ); - expect(TestUtils.isDOMComponent(totalText)).to.be(true); - expect(totalText.innerHTML).to.be('1 - 10 of 25 items'); - const nextButton = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-next' - ); - Simulate.click(nextButton); - setTimeout(() => { - expect(totalText.innerHTML).to.be('11 - 20 of 25 items'); - Simulate.click(nextButton); - setTimeout(() => { - expect(totalText.innerHTML).to.be('21 - 25 of 25 items'); - done(); - }, 10); - }, 10); - }); -}); - -describe('Controlled Pagination', () => { - let pagination = null; - const container = document.createElement('div'); - document.body.appendChild(container); - - let current = 2; - let pageSize; - function onChange(page, pSize) { - current = page; - pageSize = pSize; - } - - beforeEach((done) => { - ReactDOM.render( - , - container, - function () { - pagination = this; - done(); - } - ); - }); - - afterEach(() => { - ReactDOM.unmountComponentAtNode(container); - }); - - it('not replace currentInputValue if current not change', (done) => { - pagination.state.current = 1; - pagination.state.currentInputValue = 1; - pagination.forceUpdate(); - expect(pagination.state.current).to.be(1); - expect(pagination.state.currentInputValue).to.be(1); - - setTimeout(() => { - pagination.state.currentInputValue = 1; - pagination.forceUpdate(); - expect(pagination.state.current).to.be(2); - expect(pagination.state.currentInputValue).to.be(1); - - done(); - }, 10); - }); - - it('current should equal defaultCurrent', () => { - expect(pagination.state.current).to.be(2); - }); - - it('should not response mouse click', (done) => { - const nextButton = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-next' - ); - expect(TestUtils.isDOMComponent(nextButton)).to.be(true); - Simulate.click(nextButton); - setTimeout(() => { - expect(pagination.state.current).to.be(2); - expect(current).to.be(3); - expect(pageSize).to.be(10); - done(); - }, 10); - }); -}); - -describe('Two Pagination', () => { - let entry = null; - const container = document.createElement('div'); - document.body.appendChild(container); - - beforeEach((done) => { - ReactDOM.render(, container, function () { - entry = this; - done(); - }); - }); - - afterEach(() => { - ReactDOM.unmountComponentAtNode(container); - }); - - it('should has initial pageSize 20', () => { - const p1 = TestUtils.scryRenderedComponentsWithType(entry, Pagination)[0]; - const p2 = TestUtils.scryRenderedComponentsWithType(entry, Pagination)[1]; - expect(p1.state.pageSize).to.be(20); - expect(p2.state.pageSize).to.be(20); - }); - - it('should sync pageSize via state', (done) => { - const p1 = TestUtils.scryRenderedComponentsWithType(entry, Pagination)[0]; - const p2 = TestUtils.scryRenderedComponentsWithType(entry, Pagination)[1]; - const hook = TestUtils.scryRenderedDOMComponentsWithClass(entry, 'hook')[0]; - Simulate.click(hook); - setTimeout(() => { - expect(p1.state.pageSize).to.be(50); - expect(p2.state.pageSize).to.be(50); - done(); - }, 100); - }); -}); - -describe('Other props', () => { - let pagination; - const currentPage = 12; - const container = document.createElement('div'); - document.body.appendChild(container); - - const itemRender = (current) => { - return     {current}; - }; - - beforeEach((done) => { - ReactDOM.render( - , - container, - function () { - pagination = this; - done(); - } - ); - }); - - afterEach(() => { - ReactDOM.unmountComponentAtNode(container); - }); - - it('should support custom itemRender', () => { - const prev = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-prev' - ); - const next = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-next' - ); - const jumpPrev = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-jump-prev' - ); - const jumpNext = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-jump-next' - ); - const active = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-item-active' - ); - expect(prev.innerHTML).to.be(`${currentPage - 1}`); - expect(next.innerHTML).to.be(`${currentPage + 1}`); - expect(jumpPrev.innerHTML).to.be(`${currentPage - 5}`); - expect(jumpNext.innerHTML).to.be(`${currentPage + 5}`); - expect(active.innerHTML).to.be(`${currentPage}`); - }); -}); - -describe('Other props', () => { - let pagination; - const currentPage = 12; - const container = document.createElement('div'); - document.body.appendChild(container); - const nextIcon = () => nextIcon; - const prevIcon = () => prevIcon; - const jumpNextIcon = () => jumpNextIcon; - const jumpPrevIcon = () => jumpPrevIcon; - const iconsProps = { - prevIcon, - nextIcon, - jumpPrevIcon, - jumpNextIcon, - }; - beforeEach((done) => { - ReactDOM.render( - , - container, - function () { - pagination = this; - done(); - } - ); - }); - - afterEach(() => { - ReactDOM.unmountComponentAtNode(container); - }); - - it('should support custom default icon', () => { - const nextIconElement = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-next' - ); - const prevIconElement = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-prev' - ); - const jumpNextIconElement = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-jump-next' - ); - const jumpPrevIconElement = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-jump-prev' - ); - expect(nextIconElement.innerText).to.be('nextIcon'); - expect(prevIconElement.innerText).to.be('prevIcon'); - expect(jumpNextIconElement.innerText).to.be('jumpNextIcon'); - expect(jumpPrevIconElement.innerText).to.be('jumpPrevIcon'); - }); -}); - -describe('hideOnSinglePage props', () => { - const container = document.createElement('div'); - document.body.appendChild(container); - - const itemRender = (current) => { - return {current}; - }; - - afterEach(() => { - ReactDOM.unmountComponentAtNode(container); - }); - - it('should hide pager if hideOnSinglePage equals true', (done) => { - ReactDOM.render( - , - container, - function () { - expect(() => { - TestUtils.findRenderedDOMComponentWithClass(this, 'rc-pagination'); - }).to.throwException(/Did not find exactly one match/); - done(); - } - ); - }); - - it('should show pager if hideOnSinglePage equals false', (done) => { - ReactDOM.render( - , - container, - function () { - expect(() => { - TestUtils.findRenderedDOMComponentWithClass(this, 'rc-pagination'); - }).to.not.throwException(); - done(); - } - ); - }); - - it('should show pager if hideOnSinglePage equals true but more than 1 page', (done) => { - ReactDOM.render( - , - container, - function () { - expect(() => { - TestUtils.findRenderedDOMComponentWithClass(this, 'rc-pagination'); - }).to.not.throwException(); - done(); - } - ); - }); -}); - -describe('showPrevNextJumpers props', () => { - const container = document.createElement('div'); - const currentPage = 12; - document.body.appendChild(container); - - afterEach(() => { - ReactDOM.unmountComponentAtNode(container); - }); - - it('should hide jump-prev, jump-next if showPrevNextJumpers equals false', (done) => { - ReactDOM.render( - , - container, - function () { - expect(() => { - TestUtils.findRenderedDOMComponentWithClass(this, 'rc-pagination-jump-prev'); - }).to.throwException(/Did not find exactly one match/); - expect(() => { - TestUtils.findRenderedDOMComponentWithClass(this, 'rc-pagination-jump-next'); - }).to.throwException(/Did not find exactly one match/); - done(); - } - ); - }); - - it('should show jump-prev, jump-next if showPrevNextJumpers equals true', (done) => { - ReactDOM.render( - , - container, - function () { - const jumpPrev = TestUtils.findRenderedDOMComponentWithClass( - this, - 'rc-pagination-jump-prev' - ); - const jumpNext = TestUtils.findRenderedDOMComponentWithClass( - this, - 'rc-pagination-jump-next' - ); - expect(TestUtils.isDOMComponent(jumpPrev)).to.be(true); - expect(TestUtils.isDOMComponent(jumpNext)).to.be(true); - done(); - } - ); - }); -}); - -describe('custom showQuickJumper button Pagination', () => { - let pagination = null; - const container = document.createElement('div'); - document.body.appendChild(container); - - let current = 1; - let pageSize; - function onChange(page, pSize) { - current = page; - pageSize = pSize; - } - - beforeEach((done) => { - ReactDOM.render( - go }} - showTotal={(total, range) => `${range[0]} - ${range[1]} of ${total} items`} - />, - container, - function () { - pagination = this; - done(); - }, - ); - }); - - afterEach(() => { - ReactDOM.unmountComponentAtNode(container); - }); - - it('should quick jump to expect page', (done) => { - const quickJumper = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-options-quick-jumper' - ); - const input = quickJumper.querySelector('input'); - const goButton = quickJumper.querySelector('button'); - expect(TestUtils.isDOMComponent(quickJumper)).to.be(true); - expect(TestUtils.isDOMComponent(input)).to.be(true); - expect(TestUtils.isDOMComponent(goButton)).to.be(true); - input.value = '2'; - Simulate.change(input); - setTimeout(() => { - Simulate.click(goButton); - setTimeout(() => { - expect(pagination.state.current).to.be(2); - expect(current).to.be(2); - expect(pageSize).to.be(10); - done(); - }, 10); - }, 10); - }); - - // https://github.com/ant-design/ant-design/issues/10080 - it('should not quick jump to previous page when input invalid char', (done) => { - const pager = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination' - ); - const nextButton = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-next' - ); - Simulate.click(nextButton); - const input = pager.querySelector('input'); - input.value = '&'; - Simulate.change(input); - setTimeout(() => { - Simulate.keyUp(input, { key: 'Enter', keyCode: 13, which: 13 }); - setTimeout(() => { - expect(pagination.state.current).to.be(2); - done(); - }, 10); - }, 10); - }); -}); - - -describe('simple Pagination', () => { - let pagination = null; - const container = document.createElement('div'); - document.body.appendChild(container); - - beforeEach((done) => { - ReactDOM.render( - `${range[0]} - ${range[1]} of ${total} items`} - />, - container, - function () { - pagination = this; - done(); - }, - ); - }); - - afterEach(() => { - ReactDOM.unmountComponentAtNode(container); - }); - - it('default current page is 1', () => { - const current3 = pagination.state.current; - expect(current3).to.be(1); - }); - - it('prev-button should be disabled', () => { - const prevButton = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-prev' - ); - expect(TestUtils.isDOMComponent(prevButton)).to.be(true); - expect(prevButton.className).to.contain('rc-pagination-disabled'); - expect(prevButton.getAttribute('aria-disabled')).to.equal('true'); - }); - - it('no quick jump', () => { - const simplePagers = TestUtils.scryRenderedDOMComponentsWithClass( - pagination, - 'rc-pagination-simple-pager' - ); - expect(simplePagers.length).to.be(1); - }); -}); - - -describe('simple Pagination with quick jump', () => { - let pagination = null; - const container = document.createElement('div'); - document.body.appendChild(container); - - let current = 1; - let pageSize; - function onChange(page, pSize) { - current = page; - pageSize = pSize; - } - - beforeEach((done) => { - ReactDOM.render( - go }} - showTotal={(total, range) => `${range[0]} - ${range[1]} of ${total} items`} - />, - container, - function () { - pagination = this; - done(); - }, - ); - }); - - afterEach(() => { - ReactDOM.unmountComponentAtNode(container); - }); - - it('should quick jump to expect page', (done) => { - const quickJumper = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-simple' - ); - const input = quickJumper.querySelector('input'); - const goButton = quickJumper.querySelector('button'); - expect(TestUtils.isDOMComponent(quickJumper)).to.be(true); - expect(TestUtils.isDOMComponent(input)).to.be(true); - expect(TestUtils.isDOMComponent(goButton)).to.be(true); - input.value = '2'; - Simulate.change(input); - setTimeout(() => { - Simulate.click(goButton); - setTimeout(() => { - expect(pagination.state.current).to.be(2); - expect(current).to.be(2); - expect(pageSize).to.be(10); - done(); - }, 10); - }, 10); - }); -}); - -// https://github.com/ant-design/ant-design/issues/10524 -describe('current value on onShowSizeChange when total is 0', () => { - let pagination = null; - let changeCurrent = 0; - const container = document.createElement('div'); - document.body.appendChild(container); - - const onShowSizeChange = (current) => { - changeCurrent = current; - }; - - beforeEach((done) => { - ReactDOM.render( - `${range[0]} - ${range[1]} of ${total} items`} - />, - container, - function () { - pagination = this; - done(); - }, - ); - }); - - afterEach(() => { - ReactDOM.unmountComponentAtNode(container); - }); - - it('current should equal to the current in onShowSizeChange', (done) => { - const sizeChanger = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-options-size-changer' - ); - Simulate.click(sizeChanger); - setTimeout(() => { - const menu = sizeChanger.querySelector('.rc-select-selection'); - // Simulate to choose item of the drop down menu - Simulate.keyDown(menu, { key: 'Down', keyCode: 40, which: 40 }); - setTimeout(() => { - Simulate.keyDown(menu, { key: 'Enter', keyCode: 13, which: 13 }); - expect(pagination.state.current).to.be(changeCurrent); - done(); - }, 10); - }, 10); - }); - - it('when total is 0, pager should show and disabled', () => { - const itemButton = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-item' - ); - expect(TestUtils.isDOMComponent(itemButton)).to.be(true); - expect(itemButton.className).to.contain('rc-pagination-item-disabled'); - }); - - it('when total is 0, `from` and `to` should be 0', () => { - const totalText = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-total-text' - ); - expect(TestUtils.isDOMComponent(totalText)).to.be(true); - expect(totalText.innerHTML).to.be('0 - 0 of 0 items'); - }); -}); - -describe('data and aria props', () => { - let pagination = null; - const container = document.createElement('div'); - document.body.appendChild(container); - - describe('with simple prop', () => { - beforeEach((done) => { - ReactDOM.render( - , - container, - function () { - pagination = this; - done(); - }, - ); - }); - - afterEach(() => { - ReactDOM.unmountComponentAtNode(container); - }); - - it('renders data attributes', () => { - expect(pagination.paginationNode.getAttribute('data-test')).to.be('test-id'); - expect(pagination.paginationNode.getAttribute('data-id')).to.be('12345'); - }); - - it('renders aria attributes', () => { - expect(pagination.paginationNode.getAttribute('aria-labelledby')).to.be('labelledby-id'); - expect(pagination.paginationNode.getAttribute('aria-label')).to.be('label-id'); - }); - - it('renders role attribute', () => { - expect(pagination.paginationNode.getAttribute('role')).to.be('navigation'); - }); - }); - - describe('without simple prop', () => { - beforeEach((done) => { - ReactDOM.render( - , - container, - function () { - pagination = this; - done(); - }, - ); - }); - - afterEach(() => { - ReactDOM.unmountComponentAtNode(container); - }); - - it('renders data attributes', () => { - expect(pagination.paginationNode.getAttribute('data-test')).to.be('test-id'); - expect(pagination.paginationNode.getAttribute('data-id')).to.be('12345'); - }); - - it('renders aria attributes', () => { - expect(pagination.paginationNode.getAttribute('aria-labelledby')).to.be('labelledby-id'); - expect(pagination.paginationNode.getAttribute('aria-label')).to.be('label-id'); - }); - - it('renders role attribute', () => { - expect(pagination.paginationNode.getAttribute('role')).to.be('navigation'); - }); - }); -}); - -describe('disabled', () => { - const container = document.createElement('div'); - document.body.appendChild(container); - - afterEach(() => { - ReactDOM.unmountComponentAtNode(container); - }); - - it('full pagination', (done) => { - ReactDOM.render( - , - container, - function () { - const pagination = this; - - // Root - expect( - TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-disabled' - ) - ).to.be.ok(); - - expect( - TestUtils.findRenderedDOMComponentWithTag( - pagination, - 'input' - ) - ).to.be.ok(); - - expect( - TestUtils.findRenderedComponentWithType( - pagination, - Select, - ).props.disabled - ).to.be.ok(); - - expect( - TestUtils.findRenderedDOMComponentWithTag( - pagination, - 'input' - ).disabled - ).to.be.ok(); - - expect( - TestUtils.findRenderedDOMComponentWithTag( - pagination, - 'button' - ).disabled - ).to.be.ok(); - - done(); - }, - ); - }); -}); - -describe('Pagination with jumper', () => { - let pagination = null; - const container = document.createElement('div'); - document.body.appendChild(container); - - let current = 10; - function onChange(page) { - current = page; - } - - beforeEach((done) => { - ReactDOM.render( - , - container, - function () { - pagination = this; - done(); - }, - ); - }); - - afterEach(() => { - ReactDOM.unmountComponentAtNode(container); - current = 10; - }); - - it('when input less than 1', (done) => { - const quickJumper = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-options-quick-jumper' - ); - const input = quickJumper.querySelector('input'); - expect(TestUtils.isDOMComponent(input)).to.be(true); - input.value = '-1'; - Simulate.change(input); - setTimeout(() => { - Simulate.keyUp(input, { key: 'Enter', keyCode: 13, which: 13 }); - setTimeout(() => { - expect(pagination.state.current).to.be(1); - expect(current).to.be(1); - done(); - }, 10); - }, 10); - }); - - it('when input onBlur', (done) => { - const quickJumper = TestUtils.findRenderedDOMComponentWithClass( - pagination, - 'rc-pagination-options-quick-jumper' - ); - const input = quickJumper.querySelector('input'); - expect(TestUtils.isDOMComponent(input)).to.be(true); - Simulate.blur(input); - setTimeout(() => { - expect(pagination.state.current).to.be(10); - expect(current).to.be(10); - done(); - }, 10); - }); -}); diff --git a/tests/__snapshots__/demo.test.tsx.snap b/tests/__snapshots__/demo.test.tsx.snap new file mode 100644 index 00000000..19d64736 --- /dev/null +++ b/tests/__snapshots__/demo.test.tsx.snap @@ -0,0 +1,4472 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Example align 1`] = ` +
    + + + +
    +`; + +exports[`Example basic 1`] = ` +
    + + + + + + + + + +
    +`; + +exports[`Example controlled 1`] = ` +
    + +
    +`; + +exports[`Example itemRender 1`] = ` +
    + + + + +
    +`; + +exports[`Example jumper 1`] = ` +
    +

    + 默认 +

    + +

    + 禁用 +

    + +

    + 单页默认隐藏 +

    +
      +
    • +
      • +
    • + + 1 + +
      • +
    • +
      • +
    • +
      +
      + + + + + + 10 条/页 + + +
      +
      +
      • +
    +
    +
      +
    • +
      • +
    • + + 1 + +
      • +
    • +
      • +
    • +
      +
      + + + + + + 10 条/页 + + +
      +
      +
      • +
    +
    +`; + +exports[`Example jumperWithGoButton 1`] = ` +
    +

    + customize node +

    + +

    + default node +

    +
      +
    • +
      • +
    • + + + / + + 5 +
      • +
    • +
      • +
    • +
      + 跳至 + + 页 + +
    • + +
      • + +
    + + + +`; + +exports[`Example lessPages 1`] = ` +
    +
    + + +
    + + + Is using icon: + true + +
    +
    +
    +`; + +exports[`Example locale 1`] = ` +
    + +
    +`; + +exports[`Example more 1`] = ` +
    + +
    +`; + +exports[`Example showSizeChanger 1`] = ` +
    + + +
      +
    • +
      • +
    • + + 1 + +
      • +
    • +
      • +
    • +
      +
      + + + + + + 10 条每页 + + +
      +
      +
      • +
    +
    +`; + +exports[`Example showTitle 1`] = ` +
    +
    + + +
    +
    +`; + +exports[`Example showTotal 1`] = ` +
    + +
    + +
    +
      +
    • + 0 - 0 of 0 items +
      • +
    • +
      • +
    • + + 1 + +
      • +
    • +
      • +
    +
    +`; + +exports[`Example simple 1`] = ` +
    + +
      +
    • +
      • +
    • + + + / + + 5 +
      • +
    • +
      • +
    +
    +
      +
    • +
      • +
    • + 1 + + / + + 5 +
      • +
    • +
      • +
    +
    +
      +
    • +
      • +
    • + + + / + + 5 +
      • +
    • +
      • +
    +
    +
      +
    • + Total 50 items +
      • +
    • +
      • +
    • + + + / + + 5 +
      • +
    • +
      • +
    +
    +
      +
    • +
      • +
    • + + + / + + 5 +
      • +
    • +
      • +
    • +
      +
      + + + + + + 10 条/页 + + +
      +
      +
      • +
    +
    + + Antd #46671 + +
      +
    • +
      • +
    • + + + / + + 5 +
      • +
    • +
      • +
    • +
      +
      + + + + + + 10 条/页 + + +
      +
      +
      + 跳至 + + 页 +
      +
      • +
    +
    +`; + +exports[`Example sizer 1`] = ` +
    +
    + + + + +
    +
    +`; + +exports[`Example styles 1`] = ` +
    + +
    +`; diff --git a/tests/__snapshots__/index.test.tsx.snap b/tests/__snapshots__/index.test.tsx.snap new file mode 100644 index 00000000..d53ac7bf --- /dev/null +++ b/tests/__snapshots__/index.test.tsx.snap @@ -0,0 +1,1723 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[` 1`] = ` +[ + "prev disabled", + "item item-1 item-active", + "item item-2", + "item item-3", + "next", +] +`; + +exports[` 2`] = ` +[ + "prev disabled", + "item item-1 item-active", + "item item-2", + "item item-3", + "item item-4", + "item item-5", + "next", +] +`; + +exports[` 3`] = ` +[ + "prev disabled", + "item item-1 item-active", + "item item-2", + "item item-3", + "item item-4", + "item item-5", + "item item-6", + "next", + "options", +] +`; + +exports[` 4`] = ` +[ + "prev disabled", + "item item-1 item-active", + "item item-2", + "item item-3", + "item item-4", + "item item-5", + "item item-6", + "item item-7", + "next", + "options", +] +`; + +exports[` 5`] = ` +[ + "prev disabled", + "item item-1 item-active", + "item item-2", + "item item-3", + "item item-4", + "item item-5 item-before-jump-next", + "jump-next", + "item item-8", + "next", + "options", +] +`; + +exports[` 6`] = ` +[ + "prev disabled", + "item item-1 item-active", + "item item-2", + "item item-3", + "item item-4", + "item item-5 item-before-jump-next", + "jump-next", + "item item-9", + "next", + "options", +] +`; + +exports[` 7`] = ` +[ + "prev disabled", + "item item-1 item-active", + "item item-2", + "item item-3", + "item item-4", + "item item-5 item-before-jump-next", + "jump-next", + "item item-10", + "next", + "options", +] +`; + +exports[` 8`] = ` +[ + "prev disabled", + "item item-1 item-active", + "item item-2", + "item item-3", + "item item-4", + "item item-5 item-before-jump-next", + "jump-next", + "item item-12", + "next", + "options", +] +`; + +exports[` 9`] = ` +[ + "prev disabled", + "item item-1 item-active", + "item item-2", + "item item-3", + "item item-4", + "item item-5 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 25 pages should select page 2 1`] = ` +[ + "prev", + "item item-1", + "item item-2 item-active", + "item item-3", + "next", +] +`; + +exports[`select in sequence should sequence select 25 pages should select page 3 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3 item-active", + "next disabled", +] +`; + +exports[`select in sequence should sequence select 50 pages should select page 2 1`] = ` +[ + "prev", + "item item-1", + "item item-2 item-active", + "item item-3", + "item item-4", + "item item-5", + "next", +] +`; + +exports[`select in sequence should sequence select 50 pages should select page 3 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3 item-active", + "item item-4", + "item item-5", + "next", +] +`; + +exports[`select in sequence should sequence select 50 pages should select page 4 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3", + "item item-4 item-active", + "item item-5", + "next", +] +`; + +exports[`select in sequence should sequence select 50 pages should select page 5 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3", + "item item-4", + "item item-5 item-active", + "next disabled", +] +`; + +exports[`select in sequence should sequence select 60 pages should select page 2 1`] = ` +[ + "prev", + "item item-1", + "item item-2 item-active", + "item item-3", + "item item-4", + "item item-5", + "item item-6", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 60 pages should select page 3 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3 item-active", + "item item-4", + "item item-5", + "item item-6", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 60 pages should select page 4 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3", + "item item-4 item-active", + "item item-5", + "item item-6", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 60 pages should select page 5 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3", + "item item-4", + "item item-5 item-active", + "item item-6", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 60 pages should select page 6 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3", + "item item-4", + "item item-5", + "item item-6 item-active", + "next disabled", + "options", +] +`; + +exports[`select in sequence should sequence select 70 pages should select page 2 1`] = ` +[ + "prev", + "item item-1", + "item item-2 item-active", + "item item-3", + "item item-4", + "item item-5", + "item item-6", + "item item-7", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 70 pages should select page 3 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3 item-active", + "item item-4", + "item item-5", + "item item-6", + "item item-7", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 70 pages should select page 4 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3", + "item item-4 item-active", + "item item-5", + "item item-6", + "item item-7", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 70 pages should select page 5 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3", + "item item-4", + "item item-5 item-active", + "item item-6", + "item item-7", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 70 pages should select page 6 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3", + "item item-4", + "item item-5", + "item item-6 item-active", + "item item-7", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 70 pages should select page 7 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3", + "item item-4", + "item item-5", + "item item-6", + "item item-7 item-active", + "next disabled", + "options", +] +`; + +exports[`select in sequence should sequence select 80 pages should select page 2 1`] = ` +[ + "prev", + "item item-1", + "item item-2 item-active", + "item item-3", + "item item-4", + "item item-5 item-before-jump-next", + "jump-next", + "item item-8", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 80 pages should select page 3 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3 item-active", + "item item-4", + "item item-5 item-before-jump-next", + "jump-next", + "item item-8", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 80 pages should select page 4 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3", + "item item-4 item-active", + "item item-5", + "item item-6 item-before-jump-next", + "jump-next", + "item item-8", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 80 pages should select page 5 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-3 item-after-jump-prev", + "item item-4", + "item item-5 item-active", + "item item-6", + "item item-7", + "item item-8", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 80 pages should select page 6 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-4 item-after-jump-prev", + "item item-5", + "item item-6 item-active", + "item item-7", + "item item-8", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 80 pages should select page 7 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-4 item-after-jump-prev", + "item item-5", + "item item-6", + "item item-7 item-active", + "item item-8", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 80 pages should select page 8 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-4 item-after-jump-prev", + "item item-5", + "item item-6", + "item item-7", + "item item-8 item-active", + "next disabled", + "options", +] +`; + +exports[`select in sequence should sequence select 90 pages should select page 2 1`] = ` +[ + "prev", + "item item-1", + "item item-2 item-active", + "item item-3", + "item item-4", + "item item-5 item-before-jump-next", + "jump-next", + "item item-9", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 90 pages should select page 3 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3 item-active", + "item item-4", + "item item-5 item-before-jump-next", + "jump-next", + "item item-9", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 90 pages should select page 4 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3", + "item item-4 item-active", + "item item-5", + "item item-6 item-before-jump-next", + "jump-next", + "item item-9", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 90 pages should select page 5 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-3 item-after-jump-prev", + "item item-4", + "item item-5 item-active", + "item item-6", + "item item-7 item-before-jump-next", + "jump-next", + "item item-9", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 90 pages should select page 6 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-4 item-after-jump-prev", + "item item-5", + "item item-6 item-active", + "item item-7", + "item item-8", + "item item-9", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 90 pages should select page 7 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-5 item-after-jump-prev", + "item item-6", + "item item-7 item-active", + "item item-8", + "item item-9", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 90 pages should select page 8 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-5 item-after-jump-prev", + "item item-6", + "item item-7", + "item item-8 item-active", + "item item-9", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 90 pages should select page 9 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-5 item-after-jump-prev", + "item item-6", + "item item-7", + "item item-8", + "item item-9 item-active", + "next disabled", + "options", +] +`; + +exports[`select in sequence should sequence select 100 pages should select page 2 1`] = ` +[ + "prev", + "item item-1", + "item item-2 item-active", + "item item-3", + "item item-4", + "item item-5 item-before-jump-next", + "jump-next", + "item item-10", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 100 pages should select page 3 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3 item-active", + "item item-4", + "item item-5 item-before-jump-next", + "jump-next", + "item item-10", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 100 pages should select page 4 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3", + "item item-4 item-active", + "item item-5", + "item item-6 item-before-jump-next", + "jump-next", + "item item-10", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 100 pages should select page 5 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-3 item-after-jump-prev", + "item item-4", + "item item-5 item-active", + "item item-6", + "item item-7 item-before-jump-next", + "jump-next", + "item item-10", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 100 pages should select page 6 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-4 item-after-jump-prev", + "item item-5", + "item item-6 item-active", + "item item-7", + "item item-8 item-before-jump-next", + "jump-next", + "item item-10", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 100 pages should select page 7 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-5 item-after-jump-prev", + "item item-6", + "item item-7 item-active", + "item item-8", + "item item-9", + "item item-10", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 100 pages should select page 8 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-6 item-after-jump-prev", + "item item-7", + "item item-8 item-active", + "item item-9", + "item item-10", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 100 pages should select page 9 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-6 item-after-jump-prev", + "item item-7", + "item item-8", + "item item-9 item-active", + "item item-10", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 100 pages should select page 10 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-6 item-after-jump-prev", + "item item-7", + "item item-8", + "item item-9", + "item item-10 item-active", + "next disabled", + "options", +] +`; + +exports[`select in sequence should sequence select 120 pages should select page 2 1`] = ` +[ + "prev", + "item item-1", + "item item-2 item-active", + "item item-3", + "item item-4", + "item item-5 item-before-jump-next", + "jump-next", + "item item-12", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 120 pages should select page 3 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3 item-active", + "item item-4", + "item item-5 item-before-jump-next", + "jump-next", + "item item-12", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 120 pages should select page 4 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3", + "item item-4 item-active", + "item item-5", + "item item-6 item-before-jump-next", + "jump-next", + "item item-12", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 120 pages should select page 5 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-3 item-after-jump-prev", + "item item-4", + "item item-5 item-active", + "item item-6", + "item item-7 item-before-jump-next", + "jump-next", + "item item-12", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 120 pages should select page 6 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-4 item-after-jump-prev", + "item item-5", + "item item-6 item-active", + "item item-7", + "item item-8 item-before-jump-next", + "jump-next", + "item item-12", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 120 pages should select page 7 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-5 item-after-jump-prev", + "item item-6", + "item item-7 item-active", + "item item-8", + "item item-9 item-before-jump-next", + "jump-next", + "item item-12", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 120 pages should select page 8 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-6 item-after-jump-prev", + "item item-7", + "item item-8 item-active", + "item item-9", + "item item-10 item-before-jump-next", + "jump-next", + "item item-12", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 120 pages should select page 9 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-7 item-after-jump-prev", + "item item-8", + "item item-9 item-active", + "item item-10", + "item item-11", + "item item-12", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 120 pages should select page 10 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-8 item-after-jump-prev", + "item item-9", + "item item-10 item-active", + "item item-11", + "item item-12", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 120 pages should select page 11 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-8 item-after-jump-prev", + "item item-9", + "item item-10", + "item item-11 item-active", + "item item-12", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 120 pages should select page 12 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-8 item-after-jump-prev", + "item item-9", + "item item-10", + "item item-11", + "item item-12 item-active", + "next disabled", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 2 1`] = ` +[ + "prev", + "item item-1", + "item item-2 item-active", + "item item-3", + "item item-4", + "item item-5 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 3 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3 item-active", + "item item-4", + "item item-5 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 4 1`] = ` +[ + "prev", + "item item-1", + "item item-2", + "item item-3", + "item item-4 item-active", + "item item-5", + "item item-6 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 5 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-3 item-after-jump-prev", + "item item-4", + "item item-5 item-active", + "item item-6", + "item item-7 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 6 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-4 item-after-jump-prev", + "item item-5", + "item item-6 item-active", + "item item-7", + "item item-8 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 7 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-5 item-after-jump-prev", + "item item-6", + "item item-7 item-active", + "item item-8", + "item item-9 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 8 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-6 item-after-jump-prev", + "item item-7", + "item item-8 item-active", + "item item-9", + "item item-10 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 9 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-7 item-after-jump-prev", + "item item-8", + "item item-9 item-active", + "item item-10", + "item item-11 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 10 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-8 item-after-jump-prev", + "item item-9", + "item item-10 item-active", + "item item-11", + "item item-12 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 11 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-9 item-after-jump-prev", + "item item-10", + "item item-11 item-active", + "item item-12", + "item item-13 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 12 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-10 item-after-jump-prev", + "item item-11", + "item item-12 item-active", + "item item-13", + "item item-14 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 13 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-11 item-after-jump-prev", + "item item-12", + "item item-13 item-active", + "item item-14", + "item item-15 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 14 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-12 item-after-jump-prev", + "item item-13", + "item item-14 item-active", + "item item-15", + "item item-16 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 15 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-13 item-after-jump-prev", + "item item-14", + "item item-15 item-active", + "item item-16", + "item item-17 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 16 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-14 item-after-jump-prev", + "item item-15", + "item item-16 item-active", + "item item-17", + "item item-18 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 17 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-15 item-after-jump-prev", + "item item-16", + "item item-17 item-active", + "item item-18", + "item item-19 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 18 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-16 item-after-jump-prev", + "item item-17", + "item item-18 item-active", + "item item-19", + "item item-20 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 19 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-17 item-after-jump-prev", + "item item-18", + "item item-19 item-active", + "item item-20", + "item item-21 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 20 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-18 item-after-jump-prev", + "item item-19", + "item item-20 item-active", + "item item-21", + "item item-22 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 21 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-19 item-after-jump-prev", + "item item-20", + "item item-21 item-active", + "item item-22", + "item item-23 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 22 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-20 item-after-jump-prev", + "item item-21", + "item item-22 item-active", + "item item-23", + "item item-24 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 23 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-21 item-after-jump-prev", + "item item-22", + "item item-23 item-active", + "item item-24", + "item item-25 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 24 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-22 item-after-jump-prev", + "item item-23", + "item item-24 item-active", + "item item-25", + "item item-26 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 25 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-23 item-after-jump-prev", + "item item-24", + "item item-25 item-active", + "item item-26", + "item item-27 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 26 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-24 item-after-jump-prev", + "item item-25", + "item item-26 item-active", + "item item-27", + "item item-28 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 27 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-25 item-after-jump-prev", + "item item-26", + "item item-27 item-active", + "item item-28", + "item item-29 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 28 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-26 item-after-jump-prev", + "item item-27", + "item item-28 item-active", + "item item-29", + "item item-30 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 29 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-27 item-after-jump-prev", + "item item-28", + "item item-29 item-active", + "item item-30", + "item item-31 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 30 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-28 item-after-jump-prev", + "item item-29", + "item item-30 item-active", + "item item-31", + "item item-32 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 31 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-29 item-after-jump-prev", + "item item-30", + "item item-31 item-active", + "item item-32", + "item item-33 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 32 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-30 item-after-jump-prev", + "item item-31", + "item item-32 item-active", + "item item-33", + "item item-34 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 33 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-31 item-after-jump-prev", + "item item-32", + "item item-33 item-active", + "item item-34", + "item item-35 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 34 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-32 item-after-jump-prev", + "item item-33", + "item item-34 item-active", + "item item-35", + "item item-36 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 35 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-33 item-after-jump-prev", + "item item-34", + "item item-35 item-active", + "item item-36", + "item item-37 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 36 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-34 item-after-jump-prev", + "item item-35", + "item item-36 item-active", + "item item-37", + "item item-38 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 37 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-35 item-after-jump-prev", + "item item-36", + "item item-37 item-active", + "item item-38", + "item item-39 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 38 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-36 item-after-jump-prev", + "item item-37", + "item item-38 item-active", + "item item-39", + "item item-40 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 39 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-37 item-after-jump-prev", + "item item-38", + "item item-39 item-active", + "item item-40", + "item item-41 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 40 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-38 item-after-jump-prev", + "item item-39", + "item item-40 item-active", + "item item-41", + "item item-42 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 41 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-39 item-after-jump-prev", + "item item-40", + "item item-41 item-active", + "item item-42", + "item item-43 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 42 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-40 item-after-jump-prev", + "item item-41", + "item item-42 item-active", + "item item-43", + "item item-44 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 43 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-41 item-after-jump-prev", + "item item-42", + "item item-43 item-active", + "item item-44", + "item item-45 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 44 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-42 item-after-jump-prev", + "item item-43", + "item item-44 item-active", + "item item-45", + "item item-46 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 45 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-43 item-after-jump-prev", + "item item-44", + "item item-45 item-active", + "item item-46", + "item item-47 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 46 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-44 item-after-jump-prev", + "item item-45", + "item item-46 item-active", + "item item-47", + "item item-48 item-before-jump-next", + "jump-next", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 47 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-45 item-after-jump-prev", + "item item-46", + "item item-47 item-active", + "item item-48", + "item item-49", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 48 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-46 item-after-jump-prev", + "item item-47", + "item item-48 item-active", + "item item-49", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 49 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-46 item-after-jump-prev", + "item item-47", + "item item-48", + "item item-49 item-active", + "item item-50", + "next", + "options", +] +`; + +exports[`select in sequence should sequence select 500 pages should select page 50 1`] = ` +[ + "prev", + "item item-1", + "jump-prev", + "item item-46 item-after-jump-prev", + "item item-47", + "item item-48", + "item item-49", + "item item-50 item-active", + "next disabled", + "options", +] +`; diff --git a/tests/__snapshots__/options.test.tsx.snap b/tests/__snapshots__/options.test.tsx.snap new file mode 100644 index 00000000..c241a318 --- /dev/null +++ b/tests/__snapshots__/options.test.tsx.snap @@ -0,0 +1,59 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Options should render correctly 1`] = ` +
  • +
    +
    + + + + + + 10 条/页 + + +
    +
    +
    + 跳至 + + 页 +
    +
    • +`; diff --git a/tests/__snapshots__/simple.test.tsx.snap b/tests/__snapshots__/simple.test.tsx.snap new file mode 100644 index 00000000..f2bcb51a --- /dev/null +++ b/tests/__snapshots__/simple.test.tsx.snap @@ -0,0 +1,114 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`simple Pagination props: showQuickJumper should render normally quick-jumper 1`] = ` +
    + 跳至 + + 页 +
    +`; + +exports[`simple Pagination props: showQuickJumper should render normally quick-jumper with custom goButton 1`] = ` +
    + 跳至 + + 页 + +
  • + + + +
    • +     +
    +`; + +exports[`simple Pagination props: showQuickJumper should render normally quick-jumper with goButton 1`] = ` +
    + 跳至 + + 页 + +
  • + +
    • +     +
    +`; + +exports[`simple Pagination should support simple is readOnly value 1`] = ` +
    +
      +
    • +
      • +
    • + 1 + + / + + 0 +
      • +
    • +
      • +
    +
    +`; diff --git a/tests/commonUtil.tsx b/tests/commonUtil.tsx new file mode 100644 index 00000000..7ab44a23 --- /dev/null +++ b/tests/commonUtil.tsx @@ -0,0 +1,27 @@ +import Select from 'rc-select'; +import type { PaginationProps } from '../src/interface'; +import React from 'react'; + +export const sizeChangerRender: PaginationProps['sizeChangerRender'] = ({ + disabled, + size: pageSize, + onSizeChange, + 'aria-label': ariaLabel, + className, + options, +}) => { + return ( +