ProComponents 3.0 开发

.fatherrc.base.ts

@@ -1,20 +1,24 @@
 import { defineConfig } from 'father';
 
+const siteBuild = process.env.SITE_DEPLOY === 'TRUE';
+
+console.log(siteBuild);
+
 export default defineConfig({
   // 以下为 esm 配置项启用时的默认值，有自定义需求时才需配置
   esm: {
     input: 'src', // 默认编译目录
     output: 'es',
     extraBabelPlugins: [[require.resolve('./scripts/replaceLib'), {}]],
     platform: 'browser', // 默认构建为 Browser 环境的产物
-    transformer: 'babel', // 默认使用 babel 以提供更好的兼容性
+    transformer: siteBuild ? 'babel' : 'esbuild', // 默认使用 babel 以提供更好的兼容性
   },
   // 以下为 cjs 配置项启用时的默认值，有自定义需求时才需配置
   cjs: {
     extraBabelPlugins: [[require.resolve('./scripts/replaceEs'), {}]],
     input: 'src', // 默认编译目录
     output: 'lib',
     platform: 'browser', // 默认构建为 Node.js 环境的产物
-    transformer: 'babel', // 默认使用 esbuild 以获得更快的构建速度
+    transformer: siteBuild ? 'babel' : 'esbuild', // 默认使用 esbuild 以获得更快的构建速度
   },
 });

docs/components.en-US.md

@@ -140,7 +140,7 @@ export type ProSchema<T = unknown, U = string, Extra = unknown> = {
    * @name Customize the edit schema
    * @description returns a node that will automatically wrap value and onChange
    */
-  renderFormItem?: (
+  formItemRender?: (
     item: ProSchema<T, U, Extra>,
     config: {
       index?: number;

docs/components/customization-value-type.tsx

@@ -160,7 +160,7 @@ export default () => {
       valueTypeMap={{
         link: {
           render: (text) => <a>{text}</a>,
-          renderFormItem: (text, props) => (
+          formItemRender: (text, props) => (
             <Input placeholder="请输入链接" {...props?.fieldProps} />
           ),
         },
@@ -174,7 +174,7 @@ export default () => {
               </>
             );
           },
-          renderFormItem: (text, props) => (
+          formItemRender: (text, props) => (
             <TagList {...props} {...props?.fieldProps} />
           ),
         },

docs/components/schema.en-US.md

@@ -18,8 +18,8 @@ In the `ProComponents`, we have used the same definition as tables for component
 | `fieldProps` | `(form,config)=>fieldProps`\| `fieldProps` | Props passed to the rendering component. They are also passed when customizing |
 | `formItemProps` | `(form,config)=>formItemProps` \| `formItemProps` | Configuration passed to Form.Item |
 | `renderText` | `(text: any, record: Entity, index: number, action: ProCoreActionType) => any` | The modified data is consumed by the rendering component defined by valueType |
-| `render` | `(dom,entity,index, action, schema) => React.ReactNode` | Custom DOM for read-only mode. The `render` method only manages read-only mode, while the editing mode should use `renderFormItem` |
-| `renderFormItem` | `(schema,config,form) => React.ReactNode` | Custom editing mode that returns a ReactNode, automatically wrapping value and onChange |
+| `render` | `(dom,entity,index, action, schema) => React.ReactNode` | Custom DOM for read-only mode. The `render` method only manages read-only mode, while the editing mode should use `formItemRender` |
+| `formItemRender` | `(schema,config,form) => React.ReactNode` | Custom editing mode that returns a ReactNode, automatically wrapping value and onChange |
 | `request` | `(params,props) => Promise<{label,value}[]>` | Requests network data remotely, usually used for selection-type components |
 | `params` | `Record<string, any>` | Additional parameters passed to `request`. The component does not process them, but changes will trigger a new data request in `request` |
 | `hideInForm` | `boolean` | Hidden in the form |
@@ -76,7 +76,7 @@ export type ProSchema<T = unknown, U = string, Extra = unknown> = {
    *
    * @name Custom edit mode
    */
-  renderFormItem?: (
+  formItemRender?: (
     item: ProSchema<T, U, Extra>,
     config: {
       index?: number;

docs/components/schema.md

@@ -18,8 +18,8 @@ order: 1
 | `fieldProps` | `(form,config)=>fieldProps`\| `fieldProps` | 传给渲染的组件的 props，自定义的时候也会传递 |
 | `formItemProps` | `(form,config)=>formItemProps` \| `formItemProps` | 传递给 Form.Item 的配置 |
 | `renderText` | `(text: any, record: Entity, index: number, action: ProCoreActionType) => any` | 修改的数据是会被 valueType 定义的渲染组件消费 |
-| `render` | `(dom,entity,index, action, schema) => React.ReactNode` | 自定义只读模式的 dom,`render` 方法只管理的只读模式，编辑模式需要使用 `renderFormItem` |
-| `renderFormItem` | `(schema,config,form) => React.ReactNode` | 自定义编辑模式，返回一个 ReactNode，会自动包裹 value 和 onChange |
+| `render` | `(dom,entity,index, action, schema) => React.ReactNode` | 自定义只读模式的 dom,`render` 方法只管理的只读模式，编辑模式需要使用 `formItemRender` |
+| `formItemRender` | `(schema,config,form) => React.ReactNode` | 自定义编辑模式，返回一个 ReactNode，会自动包裹 value 和 onChange |
 | `request` | `(params,props) => Promise<{label,value}[]>` | 从远程请求网络数据，一般用于选择类组件 |
 | `params` | `Record<string, any>` | 额外传递给 `request` 的参数，组件不做处理，但是变化会引起`request` 重新请求数据 |
 | `hideInForm` | `boolean` | 在 Form 中隐藏 |
@@ -76,7 +76,7 @@ export type ProSchema<T = unknown, U = string, Extra = unknown> = {
    *
    * @name 自定义编辑模式
    */
-  renderFormItem?: (
+  formItemRender?: (
     item: ProSchema<T, U, Extra>,
     config: {
       index?: number;

docs/components/valueType.tsx

@@ -6,7 +6,7 @@ const valueEnum = {
   all: { text: '全部', status: 'Default' },
   open: {
     text: '未解决',
-    status: 'Error',
+    status: 'Warning',
   },
   closed: {
     text: '已解决',

docs/playground/pro-form.en-US.md

@@ -15,4 +15,4 @@ ProForm 的主要功能是预设了很多 layout，如果需要切换只需要
 
 ## FormList
 
-<code src="../../packages/form/src/components/Group/demos/customize.tsx" title="ProForm.List" ></code>
+<code src="../../packages/form/src/components/FormItem/Group/demos/customize.tsx" title="ProForm.List" ></code>

docs/playground/pro-form.md

@@ -16,4 +16,4 @@ ProForm 的主要功能是预设了很多 layout，如果需要切换只需要
 
 ## FormList
 
-<code src="../../packages/form/src/components/Group/demos/customize.tsx" title="ProForm.List" ></code>
+<code src="../../packages/form/src/components/FormItem/Group/demos/customize.tsx" title="ProForm.List" ></code>

docs/playground/pro-layout.en-US.md

@@ -10,7 +10,3 @@ nav:
 ## Layout 自定义
 
 <code src="../../packages/layout/src/demos/dynamic-settings.tsx"  background="var(--main-bg-color)" title="属性展示"></code>
-
-## 水印自定义
-
-<code src="../../packages/layout/src/components/WaterMark/demos/custom.tsx" background="var(--main-bg-color)"></code>

docs/playground/pro-layout.md

@@ -11,7 +11,3 @@ nav:
 ## Layout 自定义
 
 <code src="../../packages/layout/src/demos/dynamic-settings.tsx"  background="var(--main-bg-color)" iframe="500" title="属性展示"></code>
-
-## 水印自定义
-
-<code src="../../packages/layout/src/components/WaterMark/demos/custom.tsx" background="var(--main-bg-color)" iframe="500"></code>

package.json

@@ -26,7 +26,7 @@
     "start": "npm run version && dumi dev",
     "sync:tnpm": "node -e 'require(\"./scripts/syncTNPM\")()'",
     "test": "npm run version && cross-env TZ=UTC vitest --run",
-    "test:coverage": "npm run version && cross-env TZ=UTC TEST_LOG=none vitest  --coverage",
+    "test:coverage": "npm run version && pnpm --filter \"@ant-design/**\" build && cross-env TZ=UTC TEST_LOG=none vitest  --coverage",
     "test:update": "npm run version && cross-env TZ=UTC  vitest -u",
     "tsc": "tsc --noEmit",
     "tsc:duplicate": "tsc -p ./tests/tsconfig.duplicate.json",
@@ -47,15 +47,15 @@
   "devDependencies": {
     "@ant-design/antd-theme-variable": "^1.0.0",
     "@ant-design/cssinjs": "^1.20.0",
-    "@ant-design/icons": "^5.3.6",
-    "@babel/core": "^7.24.4",
-    "@babel/eslint-plugin": "^7.23.5",
-    "@babel/parser": "^7.24.4",
+    "@ant-design/icons": "^5.3.7",
+    "@babel/core": "^7.24.7",
+    "@babel/eslint-plugin": "^7.24.7",
+    "@babel/parser": "^7.24.7",
     "@babel/plugin-proposal-object-rest-spread": "^7.20.7",
-    "@babel/preset-env": "^7.24.4",
-    "@babel/preset-react": "^7.24.1",
-    "@babel/preset-typescript": "^7.24.1",
-    "@babel/traverse": "^7.24.1",
+    "@babel/preset-env": "^7.24.7",
+    "@babel/preset-react": "^7.24.7",
+    "@babel/preset-typescript": "^7.24.7",
+    "@babel/traverse": "^7.24.7",
     "@emotion/babel-plugin": "^11.11.0",
     "@emotion/cache": "^11.11.0",
     "@emotion/css": "^11.11.2",
@@ -71,12 +71,12 @@
     "@types/chroma-js": "^2.4.4",
     "@types/glob": "^8.1.0",
     "@types/history": "^4.7.11",
-    "@types/lodash": "^4.17.0",
+    "@types/lodash": "^4.17.4",
     "@types/lodash.merge": "^4.6.9",
     "@types/mockjs": "^1.0.10",
     "@types/node": "^14.18.63",
-    "@types/react": "^18.2.79",
-    "@types/react-dom": "^18.2.25",
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
     "@types/react-helmet": "^6.1.11",
     "@types/react-responsive": "^8.0.8",
     "@types/shallowequal": "^1.1.5",
@@ -87,30 +87,30 @@
     "@umijs/plugin-analytics": "^0.2.4",
     "@umijs/test": "^3.5.41",
     "@umijs/test-utils": "^3.5.41",
-    "@umijs/utils": "^4.1.10",
+    "@umijs/utils": "^4.2.10",
     "@vitest/coverage-istanbul": "^0.34.6",
     "animated-scroll-to": "^2.3.0",
-    "antd": "^5.16.2",
+    "antd": "^5.18.0",
     "antd-style": "^3.6.2",
     "babel-loader": "^9.1.3",
     "babel-types": "^6.26.0",
     "chalk": "^4.1.2",
     "chroma-js": "^2.4.2",
     "copy-to-clipboard": "^3.3.3",
     "cross-env": "^7.0.3",
-    "dayjs": "^1.11.10",
-    "dumi": "^2.2.17",
+    "dayjs": "^1.11.11",
+    "dumi": "^2.3.8",
     "dumi-theme-antd-style": "0.26.2",
-    "esbuild": "^0.15.18",
+    "esbuild": "^0.21.4",
     "eslint": "^8.57.0",
     "eslint-plugin-jest": "^27.9.0",
-    "eslint-plugin-react": "^7.34.1",
-    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-react": "^7.34.2",
+    "eslint-plugin-react-hooks": "^4.6.2",
     "eslint-plugin-unicorn": "^47.0.0",
     "execa": "^5.1.1",
     "express": "^4.19.2",
     "fast-deep-equal": "^3.1.3",
-    "father": "^4.4.0",
+    "father": "^4.4.4",
     "gh-pages": "^5.0.0",
     "glob": "^8.1.0",
     "identity-obj-proxy": "^3.0.0",
@@ -137,10 +137,10 @@
     "rc-footer": "^0.6.8",
     "rc-resize-observer": "^1.4.0",
     "rc-steps": "^6.0.1",
-    "rc-table": "^7.45.4",
-    "rc-util": "^5.39.1",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
+    "rc-table": "^7.46.2",
+    "rc-util": "^5.41.0",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
     "react-draggable": "^4.4.6",
     "react-layout-kit": "^1.9.0",
     "react-lazy-load": "^4.0.1",
@@ -156,19 +156,20 @@
     "timezone-mock": "^1.3.6",
     "ts-node": "^10.9.2",
     "typescript": "^5.4.5",
-    "umi": "^4.1.10",
+    "umi": "^4.2.10",
     "umi-request": "^1.4.0",
     "unified": "^11.0.4",
     "unist-util-visit": "^5.0.0",
-    "vitest": "^0.34.6",
+    "vitest": "^1.6.0",
     "write-pkg": "^4.0.0",
     "xhr-mock": "^2.5.1",
     "yorkie": "^2.0.0",
+    "happy-dom": "^14.12.0",
     "zustand": "^4.5.2"
   },
   "gitHooks": {
     "pre-commit": "pretty-quick --staged",
     "commit-msg": "fabric verify-commit"
   },
-  "packageManager": "pnpm@8.6.0"
+  "packageManager": "pnpm@9.1.2"
 }

packages/card/package.json

@@ -47,7 +47,7 @@
     "typescript": "^5.0.4"
   },
   "peerDependencies": {
-    "antd": "^4.24.15 || ^5.11.2",
+    "antd": "^5.11.2",
     "react": ">=17.0.0"
   },
   "publishConfig": {

packages/card/src/components/StatisticCard/index.tsx

@@ -9,9 +9,6 @@ import type { StatisticProps } from '../Statistic';
 import Statistic from '../Statistic';
 import { useStyle } from './style';
 
-import 'antd/lib/divider/style';
-import 'antd/lib/statistic/style';
-
 export type StatisticCardProps = {
   /** 图表配置 */
   chart?: React.ReactNode;

packages/card/src/index.tsx

@@ -14,8 +14,6 @@ import type { ProCardProps } from './ProCard';
 import ProCard from './ProCard';
 import type { ProCardTabsProps } from './typing';
 
-import 'antd/lib/card/style';
-
 export { CheckCard, ProCard, Statistic, StatisticCard };
 export type {
   CheckCardGroupProps,

packages/components/package.json

@@ -48,7 +48,7 @@
     "@babel/runtime": "^7.16.3"
   },
   "peerDependencies": {
-    "antd": "^4.24.15 || ^5.11.2",
+    "antd": "^5.11.2",
     "react": ">=17.0.0",
     "react-dom": ">=17.0.0"
   },

packages/descriptions/package.json

@@ -47,7 +47,7 @@
     "typescript": "^5.0.4"
   },
   "peerDependencies": {
-    "antd": "^4.24.15 || ^5.11.2",
+    "antd": "^5.11.2",
     "react": ">=17.0.0"
   },
   "publishConfig": {

packages/descriptions/src/demos/customization-value-type.tsx

@@ -102,7 +102,7 @@ export default () => {
         valueTypeMap: {
           link: {
             render: (text) => <a>{text}</a>,
-            renderFormItem: (text, props) => (
+            formItemRender: (text, props) => (
               <Input placeholder="请输入链接" {...props?.fieldProps} />
             ),
           },
@@ -116,7 +116,7 @@ export default () => {
                 </>
               );
             },
-            renderFormItem: (text, props) => (
+            formItemRender: (text, props) => (
               <TagList {...props} {...props?.fieldProps} />
             ),
           },

packages/descriptions/src/demos/editable.tsx

@@ -56,7 +56,7 @@ export default () => {
           title: '状态2',
           key: 'state2',
           dataIndex: 'state2',
-          renderFormItem: () => {
+          formItemRender: () => {
             return <Input placeholder="输入 Success 切换分值" />;
           },
         },