chore: unify useContext usage (#39314)

* feat: replace useContext to React.useContext

* docs(checkbox): update defaultValue、value type

components/cascader/index.tsx

@@ -13,7 +13,6 @@ import type {
 import RcCascader from 'rc-cascader';
 import omit from 'rc-util/lib/omit';
 import * as React from 'react';
-import { useContext } from 'react';
 import { ConfigContext } from '../config-provider';
 import defaultRenderEmpty from '../config-provider/defaultRenderEmpty';
 import DisabledContext from '../config-provider/DisabledContext';
@@ -158,7 +157,7 @@ const Cascader = React.forwardRef((props: CascaderProps<any>, ref: React.Ref<Cas
     direction: rootDirection,
     // virtual,
     // dropdownMatchSelectWidth,
-  } = useContext(ConfigContext);
+  } = React.useContext(ConfigContext);
 
   const mergedDirection = direction || rootDirection;
   const isRtl = mergedDirection === 'rtl';
@@ -169,7 +168,7 @@ const Cascader = React.forwardRef((props: CascaderProps<any>, ref: React.Ref<Cas
     hasFeedback,
     isFormItemInput,
     feedbackIcon,
-  } = useContext(FormItemInputContext);
+  } = React.useContext(FormItemInputContext);
   const mergedStatus = getMergedStatus(contextStatus, customStatus);
 
   // =================== Warning =====================

components/checkbox/Checkbox.tsx

@@ -1,7 +1,6 @@
 import classNames from 'classnames';
 import RcCheckbox from 'rc-checkbox';
 import * as React from 'react';
-import { useContext } from 'react';
 import { ConfigContext } from '../config-provider';
 import { FormItemInputContext } from '../form/context';
 import warning from '../_util/warning';
@@ -65,8 +64,8 @@ const InternalCheckbox: React.ForwardRefRenderFunction<HTMLInputElement, Checkbo
 ) => {
   const { getPrefixCls, direction } = React.useContext(ConfigContext);
   const checkboxGroup = React.useContext(GroupContext);
-  const { isFormItemInput } = useContext(FormItemInputContext);
+  const { isFormItemInput } = React.useContext(FormItemInputContext);
-  const contextDisabled = useContext(DisabledContext);
+  const contextDisabled = React.useContext(DisabledContext);
   const mergedDisabled = (checkboxGroup?.disabled || disabled) ?? contextDisabled;
 
   const prevValue = React.useRef(restProps.value);

components/checkbox/index.en-US.md

@@ -44,11 +44,11 @@ Checkbox component.
 
 | Property | Description | Type | Default | Version |
 | --- | --- | --- | --- | --- |
-| defaultValue | Default selected value | string\[] | \[] |  |
+| defaultValue | Default selected value | (string \| number)\[] | \[] |  |
 | disabled | If disable all checkboxes | boolean | false |  |
 | name | The `name` property of all `input[type="checkbox"]` children | string | - |  |
 | options | Specifies options | string\[] \| number\[] \| Option\[] | \[] |  |
-| value | Used for setting the currently selected value | string\[] | \[] |  |
+| value | Used for setting the currently selected value | (string \| number)\[] | \[] |  |
 | onChange | The callback function that is triggered when the state changes | function(checkedValue) | - |  |
 
 ### Methods

components/checkbox/index.zh-CN.md

@@ -32,24 +32,24 @@ demo:
 
 #### Checkbox
 
-| 参数           | 说明                                    | 类型              | 默认值 | 版本 |
+| 参数 | 说明 | 类型 | 默认值 | 版本 |
-| -------------- | --------------------------------------- | ----------------- | ------ | ---- |
+| --- | --- | --- | --- | --- |
-| autoFocus      | 自动获取焦点                            | boolean           | false  |      |
+| autoFocus | 自动获取焦点 | boolean | false |  |
-| checked        | 指定当前是否选中                        | boolean           | false  |      |
+| checked | 指定当前是否选中 | boolean | false |  |
-| defaultChecked | 初始是否选中                            | boolean           | false  |      |
+| defaultChecked | 初始是否选中 | boolean | false |  |
-| disabled       | 失效状态                                | boolean           | false  |      |
+| disabled | 失效状态 | boolean | false |  |
-| indeterminate  | 设置 indeterminate 状态，只负责样式控制 | boolean           | false  |      |
+| indeterminate | 设置 indeterminate 状态，只负责样式控制 | boolean | false |  |
-| onChange       | 变化时的回调函数                        | function(e: CheckboxChangeEvent) | -      |      |
+| onChange | 变化时的回调函数 | function(e: CheckboxChangeEvent) | - |  |
 
 #### Checkbox Group
 
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
 | --- | --- | --- | --- | --- |
-| defaultValue | 默认选中的选项 | string\[] | \[] |  |
+| defaultValue | 默认选中的选项 | (string \| number)\[] | \[] |  |
 | disabled | 整组失效 | boolean | false |  |
 | name | CheckboxGroup 下所有 `input[type="checkbox"]` 的 `name` 属性 | string | - |  |
 | options | 指定可选项 | string\[] \| number\[] \| Option\[] | \[] |  |
-| value | 指定选中的选项 | string\[] | \[] |  |
+| value | 指定选中的选项 | (string \| number)\[] | \[] |  |
 | onChange | 变化时的回调函数 | function(checkedValue) | - |  |
 
 ##### Option

components/form/FormItem/index.tsx

@@ -6,7 +6,6 @@ import type { Meta, NamePath } from 'rc-field-form/lib/interface';
 import useState from 'rc-util/lib/hooks/useState';
 import { supportRef } from 'rc-util/lib/ref';
 import * as React from 'react';
-import { useContext } from 'react';
 import useFormItemStatus from '../hooks/useFormItemStatus';
 import { ConfigContext } from '../../config-provider';
 import { cloneElement, isValidElement } from '../../_util/reactNode';
@@ -107,12 +106,12 @@ function InternalFormItem<Values = any>(props: FormItemProps<Values>): React.Rea
     validateTrigger,
     hidden,
   } = props;
-  const { getPrefixCls } = useContext(ConfigContext);
+  const { getPrefixCls } = React.useContext(ConfigContext);
-  const { name: formName } = useContext(FormContext);
+  const { name: formName } = React.useContext(FormContext);
   const isRenderProps = typeof children === 'function';
-  const notifyParentMetaChange = useContext(NoStyleItemContext);
+  const notifyParentMetaChange = React.useContext(NoStyleItemContext);
 
-  const { validateTrigger: contextValidateTrigger } = useContext(FieldContext);
+  const { validateTrigger: contextValidateTrigger } = React.useContext(FieldContext);
   const mergedValidateTrigger =
     validateTrigger !== undefined ? validateTrigger : contextValidateTrigger;
 

components/image/index.tsx

@@ -2,7 +2,6 @@ import EyeOutlined from '@ant-design/icons/EyeOutlined';
 import classNames from 'classnames';
 import RcImage, { type ImageProps } from 'rc-image';
 import * as React from 'react';
-import { useContext } from 'react';
 import { ConfigContext } from '../config-provider';
 import defaultLocale from '../locale/en_US';
 import { getTransitionName } from '../_util/motion';
@@ -24,7 +23,7 @@ const Image: CompositionImage<ImageProps> = ({
     getPrefixCls,
     locale: contextLocale = defaultLocale,
     getPopupContainer: getContextPopupContainer,
-  } = useContext(ConfigContext);
+  } = React.useContext(ConfigContext);
 
   const prefixCls = getPrefixCls('image', customizePrefixCls);
   const rootPrefixCls = getPrefixCls();

components/input-number/index.tsx

@@ -5,7 +5,6 @@ import type { InputNumberProps as RcInputNumberProps } from 'rc-input-number';
 import RcInputNumber from 'rc-input-number';
 import type { ValueType } from '@rc-component/mini-decimal';
 import * as React from 'react';
-import { useContext } from 'react';
 import ConfigProvider, { ConfigContext } from '../config-provider';
 import DisabledContext from '../config-provider/DisabledContext';
 import type { SizeType } from '../config-provider/SizeContext';
@@ -83,7 +82,7 @@ const InputNumber = React.forwardRef<HTMLInputElement, InputNumberProps>((props,
     status: contextStatus,
     isFormItemInput,
     feedbackIcon,
-  } = useContext(FormItemInputContext);
+  } = React.useContext(FormItemInputContext);
   const mergedStatus = getMergedStatus(contextStatus, customStatus);
 
   const mergeSize = compactSize || customizeSize || size;

components/radio/radio.tsx

@@ -2,7 +2,6 @@ import classNames from 'classnames';
 import RcCheckbox from 'rc-checkbox';
 import { composeRef } from 'rc-util/lib/ref';
 import * as React from 'react';
-import { useContext } from 'react';
 import { ConfigContext } from '../config-provider';
 import DisabledContext from '../config-provider/DisabledContext';
 import { FormItemInputContext } from '../form/context';
@@ -19,7 +18,7 @@ const InternalRadio: React.ForwardRefRenderFunction<HTMLElement, RadioProps> = (
   const { getPrefixCls, direction } = React.useContext(ConfigContext);
   const innerRef = React.useRef<HTMLElement>();
   const mergedRef = composeRef(ref, innerRef);
-  const { isFormItemInput } = useContext(FormItemInputContext);
+  const { isFormItemInput } = React.useContext(FormItemInputContext);
 
   warning(!('optionType' in props), 'Radio', '`optionType` is only support in Radio.Group.');
 

components/select/index.tsx

@@ -7,7 +7,6 @@ import type { OptionProps } from 'rc-select/lib/Option';
 import type { BaseOptionType, DefaultOptionType } from 'rc-select/lib/Select';
 import omit from 'rc-util/lib/omit';
 import * as React from 'react';
-import { useContext } from 'react';
 import { ConfigContext } from '../config-provider';
 import defaultRenderEmpty from '../config-provider/defaultRenderEmpty';
 import DisabledContext from '../config-provider/DisabledContext';
@@ -125,7 +124,7 @@ const InternalSelect = <OptionType extends BaseOptionType | DefaultOptionType =
     hasFeedback,
     isFormItemInput,
     feedbackIcon,
-  } = useContext(FormItemInputContext);
+  } = React.useContext(FormItemInputContext);
   const mergedStatus = getMergedStatus(contextStatus, customStatus);
 
   // ===================== Empty =====================

components/tree-select/index.tsx

@@ -5,7 +5,6 @@ import RcTreeSelect, { SHOW_ALL, SHOW_CHILD, SHOW_PARENT, TreeNode } from 'rc-tr
 import type { BaseOptionType, DefaultOptionType } from 'rc-tree-select/lib/TreeSelect';
 import omit from 'rc-util/lib/omit';
 import * as React from 'react';
-import { useContext } from 'react';
 import { ConfigContext } from '../config-provider';
 import defaultRenderEmpty from '../config-provider/defaultRenderEmpty';
 import DisabledContext from '../config-provider/DisabledContext';
@@ -143,7 +142,7 @@ const InternalTreeSelect = <OptionType extends BaseOptionType | DefaultOptionTyp
     hasFeedback,
     isFormItemInput,
     feedbackIcon,
-  } = useContext(FormItemInputContext);
+  } = React.useContext(FormItemInputContext);
   const mergedStatus = getMergedStatus(contextStatus, customStatus);
 
   // ===================== Icons =====================