diff --git a/package.json b/package.json index f9191d15..781ebfed 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { - "name": "rc-field-form", - "version": "2.7.0", + "name": "@rc-component/form", + "version": "1.0.0-0", "description": "React Form Component", "typings": "es/index.d.ts", "engines": { @@ -49,18 +49,17 @@ "react-dom": ">=16.9.0" }, "dependencies": { - "@babel/runtime": "^7.18.0", "@rc-component/async-validator": "^5.0.3", - "rc-util": "^5.32.2" + "@rc-component/util": "^1.1.0" }, "devDependencies": { - "@rc-component/father-plugin": "^1.0.0", + "@rc-component/father-plugin": "^2.0.1", "@testing-library/jest-dom": "^6.1.4", "@testing-library/react": "^16.0.0", "@types/jest": "^29.2.5", "@types/lodash": "^4.14.135", "@types/node": "^22.0.2", - "@types/react": "^18.0.0", + "@types/react": "^19.0.6", "@types/react-dom": "^19.0.1", "@umijs/fabric": "^4.0.1", "dumi": "^2.0.0", diff --git a/src/Field.tsx b/src/Field.tsx index afdf55d3..69e680ce 100644 --- a/src/Field.tsx +++ b/src/Field.tsx @@ -1,6 +1,6 @@ -import toChildrenArray from 'rc-util/lib/Children/toArray'; -import isEqual from 'rc-util/lib/isEqual'; -import warning from 'rc-util/lib/warning'; +import toChildrenArray from '@rc-component/util/lib/Children/toArray'; +import isEqual from '@rc-component/util/lib/isEqual'; +import warning from '@rc-component/util/lib/warning'; import * as React from 'react'; import FieldContext, { HOOK_MARK } from './FieldContext'; import type { @@ -112,11 +112,6 @@ export interface FieldState { class Field extends React.Component implements FieldEntity { public static contextType = FieldContext; - public static defaultProps = { - trigger: 'onChange', - valuePropName: 'value', - }; - public state = { resetCount: 0, }; @@ -548,9 +543,10 @@ class Field extends React.Component implements F } // Filed element only - const childList = toChildrenArray(children); + const childList = toChildrenArray(children as any); + if (childList.length !== 1 || !React.isValidElement(childList[0])) { - return { child: childList, isFunction: false }; + return { child: childList as React.ReactNode, isFunction: false }; } return { child: childList[0], isFunction: false }; @@ -566,11 +562,11 @@ class Field extends React.Component implements F public getControlled = (childProps: ChildProps = {}) => { const { name, - trigger, + trigger = 'onChange', validateTrigger, getValueFromEvent, normalize, - valuePropName, + valuePropName = 'value', getValueProps, fieldContext, } = this.props; diff --git a/src/FieldContext.ts b/src/FieldContext.ts index dbe08038..d2b6f4d5 100644 --- a/src/FieldContext.ts +++ b/src/FieldContext.ts @@ -1,4 +1,4 @@ -import warning from 'rc-util/lib/warning'; +import warning from '@rc-component/util/lib/warning'; import * as React from 'react'; import type { InternalFormInstance } from './interface'; diff --git a/src/Form.tsx b/src/Form.tsx index 24972de5..a883397c 100644 --- a/src/Form.tsx +++ b/src/Form.tsx @@ -17,7 +17,7 @@ import ListContext from './ListContext'; type BaseFormProps = Omit, 'onSubmit' | 'children'>; -type RenderProps = (values: Store, form: FormInstance) => JSX.Element | React.ReactNode; +type RenderProps = (values: Store, form: FormInstance) => React.ReactNode; export interface FormProps extends BaseFormProps { initialValues?: Store; @@ -138,7 +138,7 @@ const Form: React.ForwardRefRenderFunction = ( useSubscribe(!childrenRenderProps); // Listen if fields provided. We use ref to save prev data here to avoid additional render - const prevFieldsRef = React.useRef(); + const prevFieldsRef = React.useRef(null); React.useEffect(() => { if (!isSimilar(prevFieldsRef.current || [], fields || [])) { formInstance.setFields(fields || []); diff --git a/src/List.tsx b/src/List.tsx index 99548bfa..7bb22d01 100644 --- a/src/List.tsx +++ b/src/List.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import warning from 'rc-util/lib/warning'; +import warning from '@rc-component/util/lib/warning'; import type { InternalNamePath, NamePath, StoreValue, ValidatorRule, Meta } from './interface'; import FieldContext from './FieldContext'; import Field from './Field'; @@ -24,11 +24,7 @@ export interface ListProps { rules?: ValidatorRule[]; validateTrigger?: string | string[] | false; initialValue?: any[]; - children?: ( - fields: ListField[], - operations: ListOperations, - meta: Meta, - ) => JSX.Element | React.ReactNode; + children?: (fields: ListField[], operations: ListOperations, meta: Meta) => React.ReactNode; /** @private Passed by Form.List props. Do not use since it will break by path check. */ isListField?: boolean; diff --git a/src/useForm.ts b/src/useForm.ts index 7879cf85..fe8c8069 100644 --- a/src/useForm.ts +++ b/src/useForm.ts @@ -1,5 +1,5 @@ -import { merge } from 'rc-util/lib/utils/set'; -import warning from 'rc-util/lib/warning'; +import { merge } from '@rc-component/util/lib/utils/set'; +import warning from '@rc-component/util/lib/warning'; import * as React from 'react'; import { HOOK_MARK } from './FieldContext'; import type { @@ -1027,7 +1027,7 @@ export class FormStore { } function useForm(form?: FormInstance): [FormInstance] { - const formRef = React.useRef(); + const formRef = React.useRef(null); const [, forceUpdate] = React.useState({}); if (!formRef.current) { diff --git a/src/useWatch.ts b/src/useWatch.ts index 127c04d5..08e8c534 100644 --- a/src/useWatch.ts +++ b/src/useWatch.ts @@ -1,4 +1,4 @@ -import warning from 'rc-util/lib/warning'; +import warning from '@rc-component/util/lib/warning'; import { useContext, useEffect, useMemo, useRef, useState } from 'react'; import FieldContext, { HOOK_MARK } from './FieldContext'; import type { diff --git a/src/utils/validateUtil.ts b/src/utils/validateUtil.ts index 09106d1d..3522f4ce 100644 --- a/src/utils/validateUtil.ts +++ b/src/utils/validateUtil.ts @@ -1,6 +1,6 @@ import RawAsyncValidator from '@rc-component/async-validator'; import * as React from 'react'; -import warning from 'rc-util/lib/warning'; +import warning from '@rc-component/util/lib/warning'; import type { InternalNamePath, InternalValidateOptions, @@ -9,7 +9,7 @@ import type { RuleError, } from '../interface'; import { defaultValidateMessages } from './messages'; -import { merge } from 'rc-util/lib/utils/set'; +import { merge } from '@rc-component/util/lib/utils/set'; // Remove incorrect original ts define const AsyncValidator: any = RawAsyncValidator; diff --git a/src/utils/valueUtil.ts b/src/utils/valueUtil.ts index eb64966a..7aeb0095 100644 --- a/src/utils/valueUtil.ts +++ b/src/utils/valueUtil.ts @@ -1,5 +1,5 @@ -import getValue from 'rc-util/lib/utils/get'; -import setValue from 'rc-util/lib/utils/set'; +import getValue from '@rc-component/util/lib/utils/get'; +import setValue from '@rc-component/util/lib/utils/set'; import type { InternalNamePath, NamePath, Store, EventArgs } from '../interface'; import { toArray } from './typeUtil'; diff --git a/tests/index.test.tsx b/tests/index.test.tsx index a9a0e740..8cab35d8 100644 --- a/tests/index.test.tsx +++ b/tests/index.test.tsx @@ -1,5 +1,5 @@ import { act, fireEvent, render } from '@testing-library/react'; -import { resetWarned } from 'rc-util/lib/warning'; +import { resetWarned } from '@rc-component/util/lib/warning'; import React from 'react'; import type { FormInstance } from '../src'; import Form, { Field, useForm } from '../src'; diff --git a/tests/initialValue.test.tsx b/tests/initialValue.test.tsx index cfb736c6..bc5f0a10 100644 --- a/tests/initialValue.test.tsx +++ b/tests/initialValue.test.tsx @@ -1,5 +1,5 @@ import { act, fireEvent, render } from '@testing-library/react'; -import { resetWarned } from 'rc-util/lib/warning'; +import { resetWarned } from '@rc-component/util/lib/warning'; import React, { useState } from 'react'; import Form, { Field, List, useForm, type FormInstance } from '../src'; import { changeValue, getInput } from './common'; diff --git a/tests/list.test.tsx b/tests/list.test.tsx index 170164e1..598eb5f5 100644 --- a/tests/list.test.tsx +++ b/tests/list.test.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { fireEvent, render, act } from '@testing-library/react'; -import { resetWarned } from 'rc-util/lib/warning'; +import { resetWarned } from '@rc-component/util/lib/warning'; import Form, { Field, List } from '../src'; import type { FormProps } from '../src'; import type { ListField, ListOperations, ListProps } from '../src/List'; diff --git a/tests/useWatch.test.tsx b/tests/useWatch.test.tsx index 0c08ab19..86be6cdb 100644 --- a/tests/useWatch.test.tsx +++ b/tests/useWatch.test.tsx @@ -288,9 +288,13 @@ describe('useWatch', () => { const more = Form.useWatch(['age', 'name', 'gender'], form); const demo = Form.useWatch(['demo']); - const values2 = Form.useWatch(values => ({ newName: values.name, newAge: values.age }), form); - const values3 = Form.useWatch(values => ({ - newName: values.name, + const values2 = Form.useWatch( + _values => ({ newName: _values.name, newAge: _values.age }), + form, + ); + + const values3 = Form.useWatch(_values => ({ + newName: _values.name, })); return ( @@ -393,7 +397,7 @@ describe('useWatch', () => { it('first undefined', () => { const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {}); const Demo: React.FC = () => { - const formRef = useRef(); + const formRef = useRef(undefined); const name = Form.useWatch('name', formRef.current); const [, setUpdate] = useState({}); return (