├── .dumirc.ts ├── .editorconfig ├── .eslintrc.js ├── .fatherrc.js ├── .github ├── dependabot.yml └── workflows │ ├── codeql.yml │ └── main.yml ├── .gitignore ├── .prettierrc ├── LICENSE ├── README.md ├── docs ├── demos │ └── antd-react.md ├── examples │ └── antd-react.tsx └── index.md ├── jest.config.js ├── package.json ├── src └── index.tsx ├── tests ├── setup.js └── shadow.test.tsx └── tsconfig.json /.dumirc.ts: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'dumi'; 2 | import path from 'path'; 3 | 4 | export default defineConfig({ 5 | alias: { 6 | '@ant-design/v5-patch-for-react-19$': path.resolve('src'), 7 | '@ant-design/v5-patch-for-react-19/es': path.resolve('src'), 8 | }, 9 | mfsu: false, 10 | favicons: ['https://avatars0.githubusercontent.com/u/9441414?s=200&v=4'], 11 | themeConfig: { 12 | name: 'Patch for React 19', 13 | logo: 'https://avatars0.githubusercontent.com/u/9441414?s=200&v=4', 14 | }, 15 | styles: [ 16 | ` 17 | .dumi-default-previewer-demo { 18 | position: relative; 19 | min-height: 300px; 20 | } 21 | `, 22 | ] 23 | }); 24 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # top-most EditorConfig file 2 | root = true 3 | 4 | # Unix-style newlines with a newline ending every file 5 | [*.{js,css}] 6 | end_of_line = lf 7 | insert_final_newline = true 8 | indent_style = space 9 | indent_size = 2 10 | -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: [require.resolve('@umijs/fabric/dist/eslint')], 3 | rules: { 4 | 'default-case': 0, 5 | 'import/no-extraneous-dependencies': 0, 6 | 'react-hooks/exhaustive-deps': 0, 7 | 'react/no-find-dom-node': 0, 8 | 'react/no-did-update-set-state': 0, 9 | 'react/no-unused-state': 1, 10 | 'react/sort-comp': 0, 11 | 'jsx-a11y/label-has-for': 0, 12 | 'jsx-a11y/label-has-associated-control': 0, 13 | }, 14 | }; -------------------------------------------------------------------------------- /.fatherrc.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'father'; 2 | 3 | export default defineConfig({ 4 | plugins: ['@rc-component/father-plugin'], 5 | }); 6 | -------------------------------------------------------------------------------- /.github/dependabot.yml: -------------------------------------------------------------------------------- 1 | version: 2 2 | updates: 3 | - package-ecosystem: npm 4 | directory: "/" 5 | schedule: 6 | interval: daily 7 | time: "21:00" 8 | open-pull-requests-limit: 10 9 | ignore: 10 | - dependency-name: np 11 | versions: 12 | - 7.2.0 13 | - 7.3.0 14 | - 7.4.0 15 | - dependency-name: "@types/react-dom" 16 | versions: 17 | - 17.0.0 18 | - 17.0.1 19 | - 17.0.2 20 | - dependency-name: "@types/react" 21 | versions: 22 | - 17.0.0 23 | - 17.0.1 24 | - 17.0.2 25 | - 17.0.3 26 | - dependency-name: typescript 27 | versions: 28 | - 4.1.3 29 | - 4.1.4 30 | - 4.1.5 31 | -------------------------------------------------------------------------------- /.github/workflows/codeql.yml: -------------------------------------------------------------------------------- 1 | name: "CodeQL" 2 | 3 | on: 4 | push: 5 | branches: [ "master" ] 6 | pull_request: 7 | branches: [ "master" ] 8 | schedule: 9 | - cron: "40 12 * * 0" 10 | 11 | jobs: 12 | analyze: 13 | name: Analyze 14 | runs-on: ubuntu-latest 15 | permissions: 16 | actions: read 17 | contents: read 18 | security-events: write 19 | 20 | strategy: 21 | fail-fast: false 22 | matrix: 23 | language: [ javascript ] 24 | 25 | steps: 26 | - name: Checkout 27 | uses: actions/checkout@v3 28 | 29 | - name: Initialize CodeQL 30 | uses: github/codeql-action/init@v2 31 | with: 32 | languages: ${{ matrix.language }} 33 | queries: +security-and-quality 34 | 35 | - name: Autobuild 36 | uses: github/codeql-action/autobuild@v2 37 | 38 | - name: Perform CodeQL Analysis 39 | uses: github/codeql-action/analyze@v2 40 | with: 41 | category: "/language:${{ matrix.language }}" 42 | -------------------------------------------------------------------------------- /.github/workflows/main.yml: -------------------------------------------------------------------------------- 1 | name: CI 2 | 3 | on: 4 | push: 5 | branches: [ master ] 6 | pull_request: 7 | branches: [ master ] 8 | 9 | jobs: 10 | setup: 11 | runs-on: ubuntu-latest 12 | steps: 13 | - name: checkout 14 | uses: actions/checkout@master 15 | 16 | - uses: actions/setup-node@v1 17 | with: 18 | node-version: '16' 19 | 20 | - name: cache package-lock.json 21 | uses: actions/cache@v2 22 | with: 23 | path: package-temp-dir 24 | key: lock-${{ github.sha }} 25 | 26 | - name: create package-lock.json 27 | run: npm i --package-lock-only 28 | 29 | - name: hack for singe file 30 | run: | 31 | if [ ! -d "package-temp-dir" ]; then 32 | mkdir package-temp-dir 33 | fi 34 | cp package-lock.json package-temp-dir 35 | 36 | - name: cache node_modules 37 | id: node_modules_cache_id 38 | uses: actions/cache@v2 39 | with: 40 | path: node_modules 41 | key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }} 42 | 43 | - name: install 44 | if: steps.node_modules_cache_id.outputs.cache-hit != 'true' 45 | run: npm i 46 | 47 | lint: 48 | runs-on: ubuntu-latest 49 | steps: 50 | - name: checkout 51 | uses: actions/checkout@master 52 | 53 | - name: restore cache from package-lock.json 54 | uses: actions/cache@v2 55 | with: 56 | path: package-temp-dir 57 | key: lock-${{ github.sha }} 58 | 59 | - name: restore cache from node_modules 60 | uses: actions/cache@v2 61 | with: 62 | path: node_modules 63 | key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }} 64 | 65 | - name: lint 66 | run: npm run lint 67 | 68 | needs: setup 69 | 70 | compile: 71 | runs-on: ubuntu-latest 72 | steps: 73 | - name: checkout 74 | uses: actions/checkout@master 75 | 76 | - name: restore cache from package-lock.json 77 | uses: actions/cache@v2 78 | with: 79 | path: package-temp-dir 80 | key: lock-${{ github.sha }} 81 | 82 | - name: restore cache from node_modules 83 | uses: actions/cache@v2 84 | with: 85 | path: node_modules 86 | key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }} 87 | 88 | - name: compile 89 | run: npm run compile 90 | 91 | needs: setup 92 | 93 | coverage: 94 | runs-on: ubuntu-latest 95 | steps: 96 | - name: checkout 97 | uses: actions/checkout@master 98 | 99 | - name: restore cache from package-lock.json 100 | uses: actions/cache@v2 101 | with: 102 | path: package-temp-dir 103 | key: lock-${{ github.sha }} 104 | 105 | - name: restore cache from node_modules 106 | uses: actions/cache@v2 107 | with: 108 | path: node_modules 109 | key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }} 110 | 111 | - name: coverage 112 | run: npm run coverage && bash <(curl -s https://codecov.io/bash) 113 | 114 | needs: setup -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .storybook 2 | *.iml 3 | *.log 4 | .idea 5 | .ipr 6 | .iws 7 | *~ 8 | ~* 9 | *.diff 10 | *.patch 11 | *.bak 12 | .DS_Store 13 | Thumbs.db 14 | .project 15 | .*proj 16 | .svn 17 | *.swp 18 | *.swo 19 | *.pyc 20 | *.pyo 21 | node_modules 22 | .cache 23 | *.css 24 | build 25 | lib 26 | es 27 | coverage 28 | yarn.lock 29 | package-lock.json 30 | 31 | # dumi 32 | .umi 33 | .umi-production 34 | .umi-test 35 | .docs 36 | 37 | 38 | # dumi 39 | .dumi/tmp 40 | .dumi/tmp-production -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "endOfLine": "lf", 3 | "semi": true, 4 | "singleQuote": true, 5 | "tabWidth": 2, 6 | "trailingComma": "all" 7 | } 8 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | Copyright (c) 2015-present Alipay.com, https://www.alipay.com/ 3 | 4 | Permission is hereby granted, free of charge, to any person obtaining a copy 5 | of this software and associated documentation files (the "Software"), to deal 6 | in the Software without restriction, including without limitation the rights 7 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 8 | copies of the Software, and to permit persons to whom the Software is 9 | furnished to do so, subject to the following conditions: 10 | 11 | The above copyright notice and this permission notice shall be included in 12 | all copies or substantial portions of the Software. 13 | 14 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS 15 | OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF 16 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. 17 | IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY 18 | CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, 19 | TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE 20 | SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 21 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # @ant-design/v5-patch-for-react-19 2 | 3 | React Trigger Component 4 | 5 | [![NPM version][npm-image]][npm-url] 6 | [![npm download][download-image]][download-url] 7 | [![build status][github-actions-image]][github-actions-url] 8 | [![Test coverage][codecov-image]][codecov-url] 9 | [![bundle size][bundlephobia-image]][bundlephobia-url] 10 | [![dumi][dumi-image]][dumi-url] 11 | 12 | [npm-image]: http://img.shields.io/npm/v/@ant-design/v5-patch-for-react-19.svg?style=flat-square 13 | [npm-url]: http://npmjs.org/package/@ant-design/v5-patch-for-react-19 14 | [github-actions-image]: https://github.com/ant-design/v5-patch-for-react-19/workflows/CI/badge.svg 15 | [github-actions-url]: https://github.com/ant-design/v5-patch-for-react-19/actions 16 | [circleci-image]: https://img.shields.io/circleci/ant-design/v5-patch-for-react-19/master?style=flat-square 17 | [circleci-url]: https://circleci.com/gh/ant-design/v5-patch-for-react-19 18 | [codecov-image]: https://img.shields.io/codecov/c/github/ant-design/v5-patch-for-react-19/master.svg?style=flat-square 19 | [codecov-url]: https://app.codecov.io/gh/ant-design/v5-patch-for-react-19 20 | [david-url]: https://david-dm.org/ant-design/v5-patch-for-react-19 21 | [david-image]: https://david-dm.org/ant-design/v5-patch-for-react-19/status.svg?style=flat-square 22 | [david-dev-url]: https://david-dm.org/ant-design/v5-patch-for-react-19?type=dev 23 | [david-dev-image]: https://david-dm.org/ant-design/v5-patch-for-react-19/dev-status.svg?style=flat-square 24 | [download-image]: https://img.shields.io/npm/dm/@ant-design/v5-patch-for-react-19.svg?style=flat-square 25 | [download-url]: https://npmjs.org/package/@ant-design/v5-patch-for-react-19 26 | [bundlephobia-url]: https://bundlephobia.com/result?p=@ant-design/v5-patch-for-react-19 27 | [bundlephobia-image]: https://badgen.net/bundlephobia/minzip/@ant-design/v5-patch-for-react-19 28 | [dumi-image]: https://img.shields.io/badge/docs%20by-dumi-blue?style=flat-square 29 | [dumi-url]: https://github.com/umijs/dumi 30 | 31 | ## Install 32 | 33 | [![@ant-design/v5-patch-for-react-19](https://nodei.co/npm/@ant-design/v5-patch-for-react-19.png)](https://npmjs.org/package/@ant-design/v5-patch-for-react-19) 34 | 35 | ## Usage 36 | 37 | Import directly and will auto fill the patch on React 19: 38 | 39 | ```js 40 | import '@ant-design/v5-patch-for-react-19'; 41 | ``` 42 | 43 | ## Compatibility 44 | 45 | | [IE / Edge](http://godban.github.io/browsers-support-badges/)
IE / Edge | [Firefox](http://godban.github.io/browsers-support-badges/)
Firefox | [Chrome](http://godban.github.io/browsers-support-badges/)
Chrome | [Safari](http://godban.github.io/browsers-support-badges/)
Safari | [Electron](http://godban.github.io/browsers-support-badges/)
Electron | 46 | | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | 47 | | IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions | 48 | 49 | ## Example 50 | 51 | http://localhost:8000/ 52 | 53 | online example: http://ant-design.github.io/v5-patch-for-react-19/ 54 | 55 | ## Development 56 | 57 | ``` 58 | npm install 59 | npm start 60 | ``` 61 | 62 | ## Test Case 63 | 64 | ``` 65 | npm test 66 | ``` 67 | 68 | ## Coverage 69 | 70 | ``` 71 | npm run coverage 72 | ``` 73 | 74 | open coverage/ dir 75 | 76 | ## License 77 | 78 | Released under the MIT license. 79 | -------------------------------------------------------------------------------- /docs/demos/antd-react.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Simple 3 | nav: 4 | title: Demo 5 | path: /demo 6 | --- 7 | 8 | -------------------------------------------------------------------------------- /docs/examples/antd-react.tsx: -------------------------------------------------------------------------------- 1 | import '@ant-design/v5-patch-for-react-19'; 2 | import { Button, Flex, Modal, version } from 'antd'; 3 | import * as React from 'react'; 4 | 5 | const App = () => { 6 | const onBtnClick = () => { 7 | Modal.info({ 8 | title: 'Info', 9 | content: 'This is a message', 10 | }); 11 | }; 12 | 13 | return ( 14 | 15 | 18 |
{`antd: ${version}`}
19 |
{`react: ${React.version}`}
20 | 21 | ); 22 | }; 23 | 24 | export default App; 25 | -------------------------------------------------------------------------------- /docs/index.md: -------------------------------------------------------------------------------- 1 | --- 2 | hero: 3 | title: v5-patch-for-react-19 4 | description: antd v5 patch to work with React 19 5 | --- 6 | 7 | 8 | -------------------------------------------------------------------------------- /jest.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | setupFiles: ['./tests/setup.js'], 3 | }; 4 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@ant-design/v5-patch-for-react-19", 3 | "version": "1.0.3", 4 | "description": "Patch for antd v5 to support React 19", 5 | "keywords": [ 6 | "antd", 7 | "react" 8 | ], 9 | "homepage": "https://github.com/ant-design/v5-patch-for-react-19", 10 | "bugs": { 11 | "url": "https://github.com/ant-design/v5-patch-for-react-19/issues" 12 | }, 13 | "repository": { 14 | "type": "git", 15 | "url": "https://github.com/ant-design/v5-patch-for-react-19.git" 16 | }, 17 | "license": "MIT", 18 | "author": "", 19 | "main": "./lib/index", 20 | "module": "./es/index", 21 | "files": [ 22 | "es", 23 | "lib" 24 | ], 25 | "scripts": { 26 | "build": "dumi build", 27 | "compile": "father build", 28 | "coverage": "rc-test --coverage", 29 | "lint": "eslint src/ docs/examples/ --ext .tsx,.ts,.jsx,.js", 30 | "prepublishOnly": "npm run compile && np --yolo --no-publish", 31 | "start": "dumi dev", 32 | "test": "rc-test" 33 | }, 34 | "dependencies": {}, 35 | "devDependencies": { 36 | "@rc-component/father-plugin": "^1.0.0", 37 | "@testing-library/jest-dom": "^5.16.4", 38 | "@testing-library/react": "^16.1.0", 39 | "@types/classnames": "^2.2.10", 40 | "@types/jest": "^26.0.15", 41 | "@types/react": "^19.0.0", 42 | "@types/react-dom": "^19.0.0", 43 | "antd": "^5.22.6", 44 | "cross-env": "^7.0.1", 45 | "dumi": "^2.1.0", 46 | "eslint": "^8.51.0", 47 | "father": "^4.0.0", 48 | "np": "^6.2.0", 49 | "rc-test": "^7.0.13", 50 | "react": "^19.0.0", 51 | "react-dom": "^19.0.0", 52 | "regenerator-runtime": "^0.13.7", 53 | "typescript": "^4.0.0" 54 | }, 55 | "peerDependencies": { 56 | "antd": ">=5.22.6", 57 | "react": ">=19.0.0", 58 | "react-dom": ">=19.0.0" 59 | }, 60 | "engines": { 61 | "node": ">=12.x" 62 | } 63 | } 64 | -------------------------------------------------------------------------------- /src/index.tsx: -------------------------------------------------------------------------------- 1 | 'use client'; 2 | 3 | import { unstableSetRender } from 'antd'; 4 | import { createRoot } from 'react-dom/client'; 5 | 6 | type RenderType = Parameters[0]; 7 | type ContainerType = Parameters[1] & { 8 | _reactRoot?: ReturnType; 9 | }; 10 | 11 | unstableSetRender((node, container: ContainerType) => { 12 | container._reactRoot ||= createRoot(container); 13 | const root: ReturnType = container._reactRoot; 14 | root.render(node); 15 | 16 | return () => 17 | new Promise((resolve) => { 18 | setTimeout(() => { 19 | root.unmount(); 20 | resolve(); 21 | }, 0); 22 | }); 23 | }); 24 | -------------------------------------------------------------------------------- /tests/setup.js: -------------------------------------------------------------------------------- 1 | // jsdom add motion events to test CSSMotion 2 | window.AnimationEvent = window.AnimationEvent || (() => {}); 3 | window.TransitionEvent = window.TransitionEvent || (() => {}); 4 | -------------------------------------------------------------------------------- /tests/shadow.test.tsx: -------------------------------------------------------------------------------- 1 | import { act } from '@testing-library/react'; 2 | import { Modal } from 'antd'; 3 | import { version } from 'react'; 4 | import '../src'; 5 | 6 | describe('Trigger.Shadow', () => { 7 | beforeEach(() => { 8 | jest.useFakeTimers(); 9 | }); 10 | 11 | afterEach(() => { 12 | jest.useRealTimers(); 13 | }); 14 | 15 | it('should work', async () => { 16 | Modal.info({ 17 | title: 'Info', 18 | content: 'This is a message', 19 | }); 20 | 21 | act(() => { 22 | jest.runAllTimers(); 23 | }); 24 | 25 | expect(version.startsWith('19')).toBeTruthy(); 26 | expect(document.querySelector('.ant-modal-root')).toBeTruthy(); 27 | }); 28 | }); 29 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "esnext", 4 | "moduleResolution": "node", 5 | "baseUrl": "./", 6 | "jsx": "preserve", 7 | "declaration": true, 8 | "skipLibCheck": true, 9 | "esModuleInterop": true, 10 | "allowSyntheticDefaultImports": true, 11 | "paths": { 12 | "@/*": ["src/*"], 13 | "@@/*": [".dumi/tmp/*"], 14 | "@ant-design/v5-patch-for-react-19": ["src/index.tsx"] 15 | } 16 | } 17 | } 18 | --------------------------------------------------------------------------------