diff --git a/.dumirc.ts b/.dumirc.ts index d017cabd..a7e45134 100644 --- a/.dumirc.ts +++ b/.dumirc.ts @@ -1,5 +1,8 @@ import { defineConfig } from 'dumi'; +const basePath = process.env.GH_PAGES ? '/pagination/' : '/'; +const publicPath = basePath; + export default defineConfig({ favicons: ['https://avatars0.githubusercontent.com/u/9441414?s=200&v=4'], themeConfig: { @@ -7,4 +10,6 @@ export default defineConfig({ logo: 'https://avatars0.githubusercontent.com/u/9441414?s=200&v=4', }, outputPath: 'docs-dist', + base: basePath, + publicPath, }); diff --git a/.fatherrc.ts b/.fatherrc.ts new file mode 100644 index 00000000..96268ae1 --- /dev/null +++ b/.fatherrc.ts @@ -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 index 33b1999c..758659af 100644 --- a/.github/FUNDING.yml +++ b/.github/FUNDING.yml @@ -1,15 +1,2 @@ -# 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'] +github: ant-design +open_collective: ant-design diff --git a/.github/dependabot.yml b/.github/dependabot.yml index b4cee470..3b730ef9 100644 --- a/.github/dependabot.yml +++ b/.github/dependabot.yml @@ -1,15 +1,19 @@ 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 + - package-ecosystem: npm + directory: '/' + schedule: + interval: weekly + day: monday + time: '21:00' + timezone: Asia/Shanghai + open-pull-requests-limit: 10 + + - package-ecosystem: github-actions + directory: '/' + schedule: + interval: weekly + day: monday + time: '21:00' + timezone: Asia/Shanghai + open-pull-requests-limit: 10 diff --git a/.github/workflows/codeql.yml b/.github/workflows/codeql.yml index f9ed7d8f..8fa1ebc8 100644 --- a/.github/workflows/codeql.yml +++ b/.github/workflows/codeql.yml @@ -1,12 +1,12 @@ -name: "CodeQL" +name: 'CodeQL' on: push: - branches: [ "master" ] + branches: ['master'] pull_request: - branches: [ "master" ] + branches: ['master'] schedule: - - cron: "21 9 * * 6" + - cron: '21 9 * * 6' jobs: analyze: @@ -20,22 +20,24 @@ jobs: strategy: fail-fast: false matrix: - language: [ javascript ] + language: [javascript] steps: - name: Checkout - uses: actions/checkout@v3 + uses: actions/checkout@v7 + with: + persist-credentials: false - name: Initialize CodeQL - uses: github/codeql-action/init@v2 + uses: github/codeql-action/init@8aad20d150bbac5944a9f9d289da16a4b0d87c1e with: languages: ${{ matrix.language }} queries: +security-and-quality - name: Autobuild - uses: github/codeql-action/autobuild@v2 + uses: github/codeql-action/autobuild@8aad20d150bbac5944a9f9d289da16a4b0d87c1e - name: Perform CodeQL Analysis - uses: github/codeql-action/analyze@v2 + uses: github/codeql-action/analyze@8aad20d150bbac5944a9f9d289da16a4b0d87c1e with: - category: "/language:${{ matrix.language }}" + category: '/language:${{ matrix.language }}' diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml deleted file mode 100644 index 5735e2d2..00000000 --- a/.github/workflows/main.yml +++ /dev/null @@ -1,6 +0,0 @@ -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/.github/workflows/react-component-ci.yml b/.github/workflows/react-component-ci.yml new file mode 100644 index 00000000..36dacae4 --- /dev/null +++ b/.github/workflows/react-component-ci.yml @@ -0,0 +1,9 @@ +name: ✅ test +on: [push, pull_request] +permissions: + contents: read +jobs: + test: + uses: react-component/rc-test/.github/workflows/test-utoo.yml@main + secrets: + CODECOV_TOKEN: ${{ secrets.CODECOV_TOKEN }} diff --git a/.github/workflows/react-doctor.yml b/.github/workflows/react-doctor.yml new file mode 100644 index 00000000..32975018 --- /dev/null +++ b/.github/workflows/react-doctor.yml @@ -0,0 +1,28 @@ +name: React Doctor + +on: + pull_request: + types: [opened, synchronize, reopened, ready_for_review] + push: + branches: [master] + +permissions: + contents: read + pull-requests: write + issues: write + statuses: write + +concurrency: + group: react-doctor-${{ github.event.pull_request.number || github.ref }} + cancel-in-progress: true + +jobs: + react-doctor: + runs-on: ubuntu-latest + timeout-minutes: 15 + steps: + - uses: actions/checkout@v7 + with: + fetch-depth: 0 + persist-credentials: false + - uses: millionco/react-doctor@0b4f4f4bd248a154e64eb508a48347f71154b3f3 diff --git a/.github/workflows/surge-preview.yml b/.github/workflows/surge-preview.yml new file mode 100644 index 00000000..4c2f17ed --- /dev/null +++ b/.github/workflows/surge-preview.yml @@ -0,0 +1,54 @@ +name: Surge Preview + +on: + pull_request: + +concurrency: + group: ${{ github.workflow }}-${{ github.event.pull_request.number }} + cancel-in-progress: true + +permissions: + contents: read + pull-requests: write + checks: write + +jobs: + preview: + runs-on: ubuntu-latest + concurrency: + group: surge-preview-${{ github.event.pull_request.number }} + cancel-in-progress: true + env: + PREVIEW: true + steps: + - uses: actions/checkout@v7 + with: + persist-credentials: false + - name: Check Surge token + id: surge-token + env: + SURGE_TOKEN: ${{ secrets.SURGE_TOKEN }} + run: | + if [ -n "$SURGE_TOKEN" ]; then + echo "enabled=true" >> "$GITHUB_OUTPUT" + else + echo "enabled=false" >> "$GITHUB_OUTPUT" + fi + - name: Build preview + if: ${{ steps.surge-token.outputs.enabled == 'true' }} + run: | + npm install + npm run build + - uses: afc163/surge-preview@bf90a5a86111f6311ca42f0a5a0f80fb0fb03cec + if: ${{ steps.surge-token.outputs.enabled == 'true' }} + env: + SURGE_TOKEN: ${{ secrets.SURGE_TOKEN }} + with: + surge_token: ${{ env.SURGE_TOKEN }} + github_token: ${{ secrets.GITHUB_TOKEN }} + dist: docs-dist + failOnError: false + setCommitStatus: false + - name: Skip Surge preview + if: ${{ steps.surge-token.outputs.enabled != 'true' }} + run: echo "SURGE_TOKEN is not configured; skip Surge preview." diff --git a/.gitignore b/.gitignore index 36e64185..75a71bca 100644 --- a/.gitignore +++ b/.gitignore @@ -32,6 +32,7 @@ coverage/ .doc dist docs-dist +.vercel .vscode # umi .umi @@ -43,4 +44,4 @@ docs-dist .dumi/tmp .dumi/tmp-production -bun.lockb \ No newline at end of file +bun.lockb diff --git a/.husky/pre-commit b/.husky/pre-commit index c27d8893..2312dc58 100755 --- a/.husky/pre-commit +++ b/.husky/pre-commit @@ -1 +1 @@ -lint-staged +npx lint-staged diff --git a/.prettierignore b/.prettierignore index e1497d59..4b2b6cef 100644 --- a/.prettierignore +++ b/.prettierignore @@ -10,3 +10,13 @@ public _site .umi .doc +coverage +docs-dist +dist +.dumi/tmp +.dumi/tmp-production +.vercel +pnpm-lock.yaml +yarn.lock +bun.lockb +*.log diff --git a/LICENSE b/LICENSE new file mode 100644 index 00000000..bd0a1f72 --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2019-present react-component + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/README.md b/README.md index 56f91964..71d2b5c8 100644 --- a/README.md +++ b/README.md @@ -1,84 +1,131 @@ -# @rc-component/pagination - -React Pagination Component. - -[![NPM version][npm-image]][npm-url] -[![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-component/pagination.svg?style=flat-square -[npm-url]: http://npmjs.org/package/@rc-component/pagination -[github-actions-image]: https://github.com/react-component/pagination/actions/workflows/main.yml/badge.svg -[github-actions-url]: https://github.com/react-component/pagination/actions/workflows/main.yml -[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 -[download-image]: https://img.shields.io/npm/dm/@rc-component/pagination.svg?style=flat-square -[download-url]: https://npmjs.org/package/@rc-component/pagination -[bundlephobia-url]: https://bundlephobia.com/result?p=@rc-component/pagination -[bundlephobia-image]: https://badgen.net/bundlephobia/minzip/@rc-component/pagination -[dumi-url]: https://github.com/umijs/dumi -[dumi-image]: https://img.shields.io/badge/docs%20by-dumi-blue?style=flat-square +
+

@rc-component/pagination

+

Ant Design Part of the Ant Design ecosystem.

+

📄 React pagination primitives for page navigation, size changing, quick jumping, and locale-aware controls.

+ +

+ NPM version + npm downloads + build status + Codecov + bundle size + dumi +

+
+ +

English | 简体中文

+ +## Highlights + +- Controlled and uncontrolled pagination state. +- Page-size changer, quick jumper, simple mode, compact item count, and custom item rendering. +- Locale packages exposed from `@rc-component/pagination/locale/*`. +- Semantic `classNames` and `styles` for item-level customization. +- TypeScript definitions for props, locale, callbacks, and state. +- Used by Ant Design as the shared pagination foundation. -## Development +## Install +```bash +npm install @rc-component/pagination ``` -npm install -npm start + +## Usage + +```tsx | pure +import Pagination from '@rc-component/pagination'; +import '@rc-component/pagination/assets/index.css'; +export default () => ( + +); +``` + +```tsx | pure +import Pagination from '@rc-component/pagination'; +import enUS from '@rc-component/pagination/locale/en_US'; +export default () => ( + `${range[0]}-${range[1]} of ${total} items`} + /> +); ``` ## Examples -Online example: `https://pagination-react-component.vercel.app` -Local example: `npm run start` then `http://localhost:9001` +Run the local dumi site: -## Install +```bash +npm install +npm start +``` -[![@rc-component/pagination](https://nodei.co/npm/@rc-component/pagination.png)](https://npmjs.org/package/@rc-component/pagination) +Then open `http://localhost:8000`. -## Usage +## API -```js -import Pagination from '@rc-component/pagination'; +### Pagination + +| Property | Type | Default | Description | +| ---------------------------- | ------------------------------------------ | -------------------------------------- | ----------------------------------------------- | +| align | `'start' \| 'center' \| 'end'` | - | Align pagination items. | +| className | `string` | - | Class name for the root element. | +| classNames | `Partial>` | - | Semantic class names. | +| current | `number` | - | Controlled current page. | +| defaultCurrent | `number` | `1` | Initial current page. | +| defaultPageSize | `number` | `10` | Initial page size. | +| disabled | `boolean` | `false` | Disable pagination interactions. | +| hideOnSinglePage | `boolean` | `false` | Hide when there is only one page. | +| itemRender | `(page, type, element) => ReactNode` | - | Customize page, previous, next, and jump items. | +| jumpNextIcon | `ReactNode \| ComponentType` | - | Custom next-jump icon. | +| jumpPrevIcon | `ReactNode \| ComponentType` | - | Custom previous-jump icon. | +| locale | `PaginationLocale` | `zh_CN` | Locale text. | +| nextIcon | `ReactNode \| ComponentType` | - | Custom next icon. | +| pageSize | `number` | - | Controlled page size. | +| pageSizeOptions | `number[]` | - | Page-size options. | +| prefixCls | `string` | `rc-pagination` | Class name prefix. | +| prevIcon | `ReactNode \| ComponentType` | - | Custom previous icon. | +| role | `React.AriaRole` | - | WAI-ARIA role. | +| selectPrefixCls | `string` | `rc-select` | Prefix for the size changer select. | +| showLessItems | `boolean` | `false` | Show fewer page items. | +| showPrevNextJumpers | `boolean` | `true` | Show previous and next jumpers. | +| showQuickJumper | `boolean \| object` | `false` | Show quick page jumper. | +| showSizeChanger | `boolean` | `total > totalBoundaryShowSizeChanger` | Show page-size changer. | +| showTitle | `boolean` | `true` | Show title on page items. | +| showTotal | `(total, range) => ReactNode` | - | Render total text. | +| simple | `boolean \| { readOnly?: boolean }` | `false` | Use simple pager. | +| sizeChangerRender | `SizeChangerRender` | - | Customize the size changer. | +| style | `React.CSSProperties` | - | Root inline style. | +| styles | `Partial>` | - | Semantic styles. | +| total | `number` | `0` | Total item count. | +| totalBoundaryShowSizeChanger | `number` | `50` | Boundary for default `showSizeChanger`. | +| onChange | `(page: number, pageSize: number) => void` | - | Triggered when page or page size changes. | +| onShowSizeChange | `(current: number, size: number) => void` | - | Triggered when page size changes. | + +## Development -ReactDOM.render(, container); +```bash +npm install +npm start +npm test +npm run tsc +npm run coverage +npm run compile +npm run build ``` -## API +The dumi site runs at `http://localhost:8000` by default. + +## Release + +```bash +npm run prepublishOnly +``` -// 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 | | +The release flow is handled by `@rc-component/np` through the `rc-np` command after the package build. ## License -@rc-component/pagination is released under the MIT license. +@rc-component/pagination is released under the [MIT](./LICENSE) license. diff --git a/README.zh-CN.md b/README.zh-CN.md new file mode 100644 index 00000000..21bbfd08 --- /dev/null +++ b/README.zh-CN.md @@ -0,0 +1,131 @@ +
+

@rc-component/pagination

+

Ant Design Ant Design 生态的一部分。

+

📄 React 分页组件，支持页码、快速跳转、尺寸切换和本地化。

+ +

+ NPM version + npm downloads + build status + Codecov + bundle size + dumi +

+
+ +

English | 简体中文

+ +## 特性 + +- 受控和非受控分页状态。 +- 页面大小更改器、快速跳转、简单模式、紧凑项目计数和自定义项目渲染。 +- 从 `@rc-component/pagination/locale/*` 公开的语言环境包。 +- 用于项目级自定义的语义 `classNames` 和 `styles`。 +- 属性、本地化、回调和状态的 TypeScript 定义。 +- 被 Ant Design 用作共享的 pagination 基础能力。 + +## 安装 + +```bash +npm install @rc-component/pagination +``` + +## 使用 + +```tsx | pure +import Pagination from '@rc-component/pagination'; +import '@rc-component/pagination/assets/index.css'; +export default () => ( + +); +``` + +```tsx | pure +import Pagination from '@rc-component/pagination'; +import enUS from '@rc-component/pagination/locale/en_US'; +export default () => ( + `${range[0]}-${range[1]} of ${total} items`} + /> +); +``` + +## 示例 + +运行本地 dumi 站点： + +```bash +npm install +npm start +``` + +然后打开 `http://localhost:8000`。 + +## API + +### Pagination + +| 参数 | 类型 | 默认值 | 说明 | +| ---------------------------- | ------------------------------------------ | -------------------------------------- | -------------------------------------- | +| align | `'start' \| 'center' \| 'end'` | - | 对齐分页项目。 | +| className | `string` | - | 根元素的 className。 | +| classNames | `Partial>` | - | 语义 className。 | +| current | `number` | - | 控制当前页面。 | +| defaultCurrent | `number` | `1` | 初始当前页面。 | +| defaultPageSize | `number` | `10` | 初始页面大小。 | +| disabled | `boolean` | `false` | 禁用分页交互。 | +| hideOnSinglePage | `boolean` | `false` | 当只有一页时隐藏。 | +| itemRender | `(page, type, element) => ReactNode` | - | 自定义页面、上一个、下一个和跳转项目。 | +| jumpNextIcon | `ReactNode \| ComponentType` | - | 自定义下一跳图标。 | +| jumpPrevIcon | `ReactNode \| ComponentType` | - | 自定义上一跳转图标。 | +| locale | `PaginationLocale` | `zh_CN` | 区域设置文本。 | +| nextIcon | `ReactNode \| ComponentType` | - | 自定义下一个图标。 | +| pageSize | `number` | - | 受控的页面大小。 | +| pageSizeOptions | `number[]` | - | 页面大小选项。 | +| prefixCls | `string` | `rc-pagination` | className 前缀。 | +| prevIcon | `ReactNode \| ComponentType` | - | 自定义上一个图标。 | +| role | `React.AriaRole` | - | WAI-ARIA 角色。 | +| selectPrefixCls | `string` | `rc-select` | 尺寸变换器选择的前缀。 | +| showLessItems | `boolean` | `false` | 显示较少的页面项目。 | +| showPrevNextJumpers | `boolean` | `true` | 显示上一个和下一个跳线。 | +| showQuickJumper | `boolean \| object` | `false` | 显示快速跳页。 | +| showSizeChanger | `boolean` | `total > totalBoundaryShowSizeChanger` | 显示页面大小更改器。 | +| showTitle | `boolean` | `true` | 在页面项目上显示标题。 | +| showTotal | `(total, range) => ReactNode` | - | 渲染总文本。 | +| simple | `boolean \| { readOnly?: boolean }` | `false` | 使用简洁分页器。 | +| sizeChangerRender | `SizeChangerRender` | - | 定制尺寸变换器。 | +| style | `React.CSSProperties` | - | 根内联样式。 | +| styles | `Partial>` | - | 语义化样式。 | +| total | `number` | `0` | 项目总数。 | +| totalBoundaryShowSizeChanger | `number` | `50` | 默认的边界 `showSizeChanger`。 | +| onChange | `(page: number, pageSize: number) => void` | - | 当页面或页面大小更改时触发。 | +| onShowSizeChange | `(current: number, size: number) => void` | - | 当页面大小改变时触发。 | + +## 本地开发 + +```bash +npm install +npm start +npm test +npm run tsc +npm run coverage +npm run compile +npm run build +``` + +dumi 站点默认运行在 `http://localhost:8000`。 + +## 发布 + +```bash +npm run prepublishOnly +``` + +包构建完成后，发布流程由 `@rc-component/np` 通过 `rc-np` 命令处理。 + +## 许可证 + +@rc-component/pagination 基于 [MIT](./LICENSE) 许可证发布。 diff --git a/docs/examples/controlled.tsx b/docs/examples/controlled.tsx index 376791f2..84874e13 100644 --- a/docs/examples/controlled.tsx +++ b/docs/examples/controlled.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; import Pagination from '../../src'; import '../../assets/index.less'; -import 'rc-select/assets/index.less'; +import '@rc-component/select/assets/index.less'; const App = () => { const [current, setCurrent] = useState(1); diff --git a/docs/examples/jumper.tsx b/docs/examples/jumper.tsx index 20bd423b..9dbeef2f 100644 --- a/docs/examples/jumper.tsx +++ b/docs/examples/jumper.tsx @@ -1,7 +1,7 @@ /* eslint func-names: 0, no-console: 0 */ import React from 'react'; import '../../assets/index.less'; -import 'rc-select/assets/index.less'; +import '@rc-component/select/assets/index.less'; import PaginationWithSizeChanger from './utils/commonUtil'; function onShowSizeChange(current, pageSize) { diff --git a/docs/examples/jumperWithGoButton.tsx b/docs/examples/jumperWithGoButton.tsx index 16364fa9..f7290935 100644 --- a/docs/examples/jumperWithGoButton.tsx +++ b/docs/examples/jumperWithGoButton.tsx @@ -2,7 +2,7 @@ import React from 'react'; import Pagination from '../../src'; import '../../assets/index.less'; -import 'rc-select/assets/index.less'; +import '@rc-component/select/assets/index.less'; import PaginationWithSizeChanger from './utils/commonUtil'; class App extends React.Component { diff --git a/docs/examples/locale.tsx b/docs/examples/locale.tsx index 75b7a2a6..e294b0f7 100644 --- a/docs/examples/locale.tsx +++ b/docs/examples/locale.tsx @@ -2,7 +2,7 @@ import React from 'react'; import localeInfo from '../../src/locale/en_US'; import '../../assets/index.less'; -import 'rc-select/assets/index.less'; +import '@rc-component/select/assets/index.less'; import PaginationWithSizeChanger from './utils/commonUtil'; function onShowSizeChange(current, pageSize) { diff --git a/docs/examples/sizer.tsx b/docs/examples/sizer.tsx index 847a3127..35311a68 100644 --- a/docs/examples/sizer.tsx +++ b/docs/examples/sizer.tsx @@ -1,7 +1,7 @@ /* eslint func-names: 0, no-console: 0 */ import React from 'react'; import '../../assets/index.less'; -import 'rc-select/assets/index.less'; +import '@rc-component/select/assets/index.less'; import PaginationWithSizeChanger from './utils/commonUtil'; class App extends React.Component { diff --git a/docs/examples/utils/commonUtil.tsx b/docs/examples/utils/commonUtil.tsx index 88aa477d..4f68f64e 100644 --- a/docs/examples/utils/commonUtil.tsx +++ b/docs/examples/utils/commonUtil.tsx @@ -1,5 +1,5 @@ import Pagination, { type PaginationProps } from '../../../src'; -import Select from 'rc-select'; +import Select from '@rc-component/select'; import React from 'react'; export const getSizeChangerRender = (selectProps?: any) => { @@ -14,7 +14,7 @@ export const getSizeChangerRender = (selectProps?: any) => { - - - 20 条/页 - - + 20 条/页 +
- - - - - - 20 条/页 - - + 20 条/页 +
- - - - - - 10 条/页 - - + 10 条/页 +
@@ -1966,43 +1915,26 @@ exports[`Example jumper 1`] = ` class="rc-pagination-options" >
- - - - - - 10 条/页 - - + 10 条/页 +
@@ -2123,43 +2055,26 @@ exports[`Example jumperWithGoButton 1`] = ` class="rc-pagination-options" >
- - - - - - 20 条/页 - - + 20 条/页 +
- - - - - - 20 / page - - + 20 / page +
- - - - - - 10 条/页 - - + 10 条/页 +
@@ -3065,43 +2946,26 @@ exports[`Example showSizeChanger 1`] = ` class="rc-pagination-options" >
- - - - - - 10 条每页 - - + 10 条每页 +
@@ -3793,43 +3657,26 @@ exports[`Example simple 1`] = ` class="rc-pagination-options" >
- - - - - - 10 条/页 - - + 10 条/页 +
@@ -3887,43 +3734,26 @@ exports[`Example simple 1`] = ` class="rc-pagination-options" >
- - - - - - 10 条/页 - - + 10 条/页 +
- - - - - - 15 条/页 - - + 15 条/页 +
@@ -4199,43 +4012,26 @@ exports[`Example sizer 1`] = ` class="rc-pagination-options" >
- - - - - - 15 条/页 - - + 15 条/页 +
diff --git a/tests/__snapshots__/options.test.tsx.snap b/tests/__snapshots__/options.test.tsx.snap index c241a318..5bb32df2 100644 --- a/tests/__snapshots__/options.test.tsx.snap +++ b/tests/__snapshots__/options.test.tsx.snap @@ -5,43 +5,26 @@ exports[`Options should render correctly 1`] = ` class="rc-pagination-options" >
- - - - - - 10 条/页 - - + 10 条/页 +
triggerNode.parentNode} aria-label={ariaLabel} diff --git a/tests/setupAfterEnv.ts b/tests/setupAfterEnv.ts index 7b0828bf..233ef93a 100644 --- a/tests/setupAfterEnv.ts +++ b/tests/setupAfterEnv.ts @@ -1 +1,22 @@ import '@testing-library/jest-dom'; + +class TestMessageChannel { + port1 = { + onmessage: null as ((event: MessageEvent) => void) | null, + }; + + port2 = { + postMessage: (data: unknown) => { + queueMicrotask(() => { + this.port1.onmessage?.({ data } as MessageEvent); + }); + }, + }; +} + +if (!globalThis.MessageChannel) { + Object.defineProperty(globalThis, 'MessageChannel', { + configurable: true, + value: TestMessageChannel, + }); +} diff --git a/tests/simple.test.tsx b/tests/simple.test.tsx index 4191ab39..568858a4 100644 --- a/tests/simple.test.tsx +++ b/tests/simple.test.tsx @@ -1,6 +1,6 @@ import type { RenderResult } from '@testing-library/react'; import { render, fireEvent, createEvent } from '@testing-library/react'; -import Select from 'rc-select'; +import Select from '@rc-component/select'; import React, { useState } from 'react'; import Pagination from '../src'; import { sizeChangerRender } from './commonUtil'; diff --git a/tests/sizer.test.tsx b/tests/sizer.test.tsx index b53ef01b..ba4d1d3b 100644 --- a/tests/sizer.test.tsx +++ b/tests/sizer.test.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { render, fireEvent } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; -import Select from 'rc-select'; +import Select from '@rc-component/select'; import Pagination from '../src'; import { sizeChangerRender } from './commonUtil'; @@ -80,8 +80,8 @@ describe('Pagination with sizer', () => { pageSizeOptions={[20, 50]} />, ); - expect( - container.querySelector('.rc-select-selection-item'), - ).toHaveTextContent('20 条/页'); + expect(container.querySelector('.rc-select-content')).toHaveTextContent( + '20 条/页', + ); }); }); diff --git a/tests/two-pagination.tsx b/tests/two-pagination.tsx index ea30b656..1e472b85 100644 --- a/tests/two-pagination.tsx +++ b/tests/two-pagination.tsx @@ -1,4 +1,4 @@ -// import 'rc-select/assets/index.less'; +// import '@rc-component/select/assets/index.less'; import React from 'react'; import Pagination from '../src'; import { sizeChangerRender } from './commonUtil'; diff --git a/tsconfig.json b/tsconfig.json index 5a078dd8..3b97dca2 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -11,7 +11,9 @@ "@/*": ["src/*"], "@@/*": [".dumi/tmp/*"], "@rc-component/pagination": ["src/index.ts"] - } + }, + "ignoreDeprecations": "5.0" }, - "include": [".dumirc.ts", "**/*.ts", "**/*.tsx"] + "include": [".dumirc.ts", ".fatherrc.ts", "src", "docs", "tests"], + "exclude": ["node_modules", "lib", "es", "dist", "docs-dist", ".dumi"] } diff --git a/vercel.json b/vercel.json index cc12e405..5f9139ef 100644 --- a/vercel.json +++ b/vercel.json @@ -1,3 +1,6 @@ { - "framework": "umijs" + "framework": "umijs", + "installCommand": "npm install", + "buildCommand": "npm run build", + "outputDirectory": "docs-dist" }