feat: Radio、Checkbox title

ant-design · Jun 14, 2023 · 418a4a2 · 418a4a2
1 parent 5d62e63
commit 418a4a2
Show file tree

Hide file tree

Showing 8 changed files with 16 additions and 6 deletions.
diff --git a/components/checkbox/Checkbox.tsx b/components/checkbox/Checkbox.tsx
@@ -2,11 +2,11 @@ import classNames from 'classnames';
 import type { CheckboxRef } from 'rc-checkbox';
 import RcCheckbox from 'rc-checkbox';
 import * as React from 'react';
+import warning from '../_util/warning';
 import { ConfigContext } from '../config-provider';
+import DisabledContext from '../config-provider/DisabledContext';
 import { FormItemInputContext } from '../form/context';
-import warning from '../_util/warning';
 import { GroupContext } from './Group';
-import DisabledContext from '../config-provider/DisabledContext';
 
 import useStyle from './style';
 
@@ -16,6 +16,7 @@ export interface AbstractCheckboxProps<T> {
   rootClassName?: string;
   defaultChecked?: boolean;
   checked?: boolean;
+  title?: string;
   style?: React.CSSProperties;
   disabled?: boolean;
   onChange?: (e: T) => void;
@@ -61,6 +62,7 @@ const InternalCheckbox: React.ForwardRefRenderFunction<CheckboxRef, CheckboxProp
     onMouseLeave,
     skipGroup = false,
     disabled,
+    title,
     ...restProps
   },
   ref,
@@ -134,6 +136,7 @@ const InternalCheckbox: React.ForwardRefRenderFunction<CheckboxRef, CheckboxProp
     <label
       className={classString}
       style={style}
+      title={title}
       onMouseEnter={onMouseEnter}
       onMouseLeave={onMouseLeave}
     >

diff --git a/components/checkbox/Group.tsx b/components/checkbox/Group.tsx
@@ -13,6 +13,7 @@ export interface CheckboxOptionType {
   label: React.ReactNode;
   value: CheckboxValueType;
   style?: React.CSSProperties;
+  title?: string;
   disabled?: boolean;
   onChange?: (e: CheckboxChangeEvent) => void;
 }

diff --git a/components/checkbox/index.en-US.md b/components/checkbox/index.en-US.md
@@ -32,12 +32,13 @@ Checkbox component.
 #### Checkbox
 
 | Property | Description | Type | Default | Version |
-| --- | --- | --- | --- | --- |
+| --- | --- | --- | --- | --- | --- |
 | autoFocus | If get focus when component mounted | boolean | false |  |
 | checked | Specifies whether the checkbox is selected | boolean | false |  |
 | defaultChecked | Specifies the initial state: whether or not the checkbox is selected | boolean | false |  |
 | disabled | If disable checkbox | boolean | false |  |
 | indeterminate | The indeterminate checked state of checkbox | boolean | false |  |
+| title | `title` attribute | string | - | 5.7.0 |  |
 | onChange | The callback function that is triggered when the state changes | (e: CheckboxChangeEvent) => void | - |  |
 
 #### Checkbox Group

diff --git a/components/checkbox/index.zh-CN.md b/components/checkbox/index.zh-CN.md
@@ -33,12 +33,13 @@ demo:
 #### Checkbox
 
 | 参数 | 说明 | 类型 | 默认值 | 版本 |
-| --- | --- | --- | --- | --- |
+| --- | --- | --- | --- | --- | --- |
 | autoFocus | 自动获取焦点 | boolean | false |  |
 | checked | 指定当前是否选中 | boolean | false |  |
 | defaultChecked | 初始是否选中 | boolean | false |  |
 | disabled | 失效状态 | boolean | false |  |
 | indeterminate | 设置 indeterminate 状态，只负责样式控制 | boolean | false |  |
+| title | 原生 `title` 属性 | string | - | 5.7.0 |  |
 | onChange | 变化时的回调函数 | (e: CheckboxChangeEvent) => void | - |  |
 
 #### Checkbox Group

diff --git a/components/radio/group.tsx b/components/radio/group.tsx
@@ -77,6 +77,7 @@ const RadioGroup = React.forwardRef<HTMLDivElement, RadioGroupProps>((props, ref
           value={option.value}
           checked={value === option.value}
           style={option.style}
+          title={option.title}
         >
           {option.label}
         </Radio>

diff --git a/components/radio/index.en-US.md b/components/radio/index.en-US.md
@@ -37,12 +37,13 @@ Radio.
 ### Radio/Radio.Button
 
 | Property | Description | Type | Default |
-| --- | --- | --- | --- |
+| --- | --- | --- | --- | --- | --- |
 | autoFocus | Whether get focus when component mounted | boolean | false |
 | checked | Specifies whether the radio is selected | boolean | false |
 | defaultChecked | Specifies the initial state: whether or not the radio is selected | boolean | false |
 | disabled | Disable radio | boolean | false |
 | value | According to value for comparison, to determine whether the selected | any | - |
+| title | `title` attribute | string | - | 5.7.0 |  |
 
 ### RadioGroup
 

diff --git a/components/radio/index.zh-CN.md b/components/radio/index.zh-CN.md
@@ -45,6 +45,7 @@ demo:
 | defaultChecked | 初始是否选中 | boolean | false |
 | disabled | 禁用 Radio | boolean | false |
 | value | 根据 value 进行比较，判断是否选中 | any | - |
+| title | 原生 `title` 提示 | string | - | 5.7.0 |  |
 
 ### Radio.Group
 

diff --git a/components/radio/radio.tsx b/components/radio/radio.tsx
@@ -3,10 +3,10 @@ import type { CheckboxRef } from 'rc-checkbox';
 import RcCheckbox from 'rc-checkbox';
 import { composeRef } from 'rc-util/lib/ref';
 import * as React from 'react';
+import warning from '../_util/warning';
 import { ConfigContext } from '../config-provider';
 import DisabledContext from '../config-provider/DisabledContext';
 import { FormItemInputContext } from '../form/context';
-import warning from '../_util/warning';
 import RadioGroupContext, { RadioOptionTypeContext } from './context';
 import type { RadioChangeEvent, RadioProps } from './interface';
 
@@ -78,6 +78,7 @@ const InternalRadio: React.ForwardRefRenderFunction<CheckboxRef, RadioProps> = (
       style={style}
       onMouseEnter={props.onMouseEnter}
       onMouseLeave={props.onMouseLeave}
+      title={radioProps.title}
     >
       <RcCheckbox {...radioProps} type="radio" prefixCls={prefixCls} ref={mergedRef} />
       {children !== undefined ? <span>{children}</span> : null}