feat: add radio readonly

TDesignOteam · Jan 8, 2024 · abc7b4e · abc7b4e
1 parent 093c9eb
commit abc7b4e
Show file tree

Hide file tree

Showing 14 changed files with 79 additions and 12 deletions.
diff --git a/db/TDesign.db b/db/TDesign.db
diff --git a/packages/products/tdesign-react/src/radio/defaultProps.ts b/packages/products/tdesign-react/src/radio/defaultProps.ts
@@ -8,6 +8,7 @@ export const radioDefaultProps: TdRadioProps = {
   allowUncheck: false,
   defaultChecked: false,
   disabled: undefined,
+  readonly: false,
   value: undefined,
 };
 

diff --git a/packages/products/tdesign-react/src/radio/radio.en-US.md b/packages/products/tdesign-react/src/radio/radio.en-US.md
@@ -14,6 +14,7 @@ children | TNode | - | Typescript：`string \| TNode`。[see more ts definition]
 disabled | Boolean | undefined | \- | N
 label | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 name | String | - | \- | N
+readonly | Boolean | false | \- | N
 value | String / Number / Boolean | undefined | Typescript：`string \| number \| boolean` | N
 onChange | Function |  | Typescript：`(checked: boolean, context: { e: ChangeEvent }) => void`<br/> | N
 onClick | Function |  | Typescript：`(context: { e: MouseEvent }) => void`<br/>trigger on click | N
@@ -27,9 +28,9 @@ style | Object | - | 样式，Typescript：`React.CSSProperties` | N
 allowUncheck | Boolean | false | \- | N
 disabled | Boolean | - | \- | N
 name | String | - | \- | N
-options | Array | - | Typescript：`Array<RadioOption>` `type RadioOption = string \| number \| RadioOptionObj` `interface RadioOptionObj { label?: string \| TNode; value?: string \| number; disabled?: boolean }`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts)。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/radio/type.ts) | N
-size | String | medium | options：small/medium/large。Typescript：`SizeEnum`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
+options | Array | - | Typescript：`Array<RadioOption>` `type RadioOption = string \| number \| RadioOptionObj` `interface RadioOptionObj { label?: string \| TNode; value?: string \| number \| boolean; disabled?: boolean }`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts)。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/radio/type.ts) | N
+size | String | medium | options: small/medium/large。Typescript：`SizeEnum`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 value | String / Number / Boolean | - | Typescript：`T` `type RadioValue = string \| number \| boolean`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/radio/type.ts) | N
 defaultValue | String / Number / Boolean | - | uncontrolled property。Typescript：`T` `type RadioValue = string \| number \| boolean`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/radio/type.ts) | N
-variant | String | outline | options：outline/primary-filled/default-filled | N
+variant | String | outline | options: outline/primary-filled/default-filled | N
 onChange | Function |  | Typescript：`(value: T, context: { e: ChangeEvent }) => void`<br/> | N
diff --git a/packages/products/tdesign-react/src/radio/radio.md b/packages/products/tdesign-react/src/radio/radio.md
@@ -14,6 +14,7 @@ children | TNode | - | 单选内容，同 label。TS 类型：`string \| TNode`
 disabled | Boolean | undefined | 是否为禁用态。如果存在父组件 RadioGroup，默认值由 RadioGroup.disabled 控制。Radio.disabled 优先级高于 RadioGroup.disabled | N
 label | TNode | - | 主文案。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 name | String | - | HTML 元素原生属性 | N
+readonly | Boolean | false | 只读状态 | N
 value | String / Number / Boolean | undefined | 单选按钮的值。TS 类型：`string \| number \| boolean` | N
 onChange | Function |  | TS 类型：`(checked: boolean, context: { e: ChangeEvent }) => void`<br/>选中状态变化时触发 | N
 onClick | Function |  | TS 类型：`(context: { e: MouseEvent }) => void`<br/>点击时出发，一般用于外层阻止冒泡场景 | N
@@ -27,7 +28,7 @@ style | Object | - | 样式，TS 类型：`React.CSSProperties` | N
 allowUncheck | Boolean | false | 是否允许取消选中 | N
 disabled | Boolean | - | 是否禁用全部子单选框。默认为 false。RadioGroup.disabled 优先级低于 Radio.disabled | N
 name | String | - | HTML 元素原生属性 | N
-options | Array | - | 单选组件按钮形式。RadioOption 数据类型为 string 或 number 时，表示 label 和 value 值相同。TS 类型：`Array<RadioOption>` `type RadioOption = string \| number \| RadioOptionObj` `interface RadioOptionObj { label?: string \| TNode; value?: string \| number; disabled?: boolean }`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/radio/type.ts) | N
+options | Array | - | 单选组件按钮形式。RadioOption 数据类型为 string 或 number 时，表示 label 和 value 值相同。TS 类型：`Array<RadioOption>` `type RadioOption = string \| number \| RadioOptionObj` `interface RadioOptionObj { label?: string \| TNode; value?: string \| number \| boolean; disabled?: boolean }`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/radio/type.ts) | N
 size | String | medium | 组件尺寸【讨论中】。可选项：small/medium/large。TS 类型：`SizeEnum`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 value | String / Number / Boolean | - | 选中的值。TS 类型：`T` `type RadioValue = string \| number \| boolean`。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/radio/type.ts) | N
 defaultValue | String / Number / Boolean | - | 选中的值。非受控属性。TS 类型：`T` `type RadioValue = string \| number \| boolean`。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/radio/type.ts) | N

diff --git a/packages/products/tdesign-react/src/radio/type.ts b/packages/products/tdesign-react/src/radio/type.ts
@@ -40,6 +40,11 @@ export interface TdRadioProps {
    * @default ''
    */
   name?: string;
+  /**
+   * 只读状态
+   * @default false
+   */
+  readonly?: boolean;
   /**
    * 单选按钮的值
    */
@@ -101,7 +106,7 @@ export type RadioOption = string | number | RadioOptionObj;
 
 export interface RadioOptionObj {
   label?: string | TNode;
-  value?: string | number;
+  value?: string | number | boolean;
   disabled?: boolean;
 }
 

diff --git a/packages/products/tdesign-vue-next/src/radio/props.ts b/packages/products/tdesign-vue-next/src/radio/props.ts
@@ -39,6 +39,8 @@ export default {
     type: String,
     default: '',
   },
+  /** 只读状态 */
+  readonly: Boolean,
   /** 单选按钮的值 */
   value: {
     type: [String, Number, Boolean] as PropType<TdRadioProps['value']>,

diff --git a/packages/products/tdesign-vue-next/src/radio/radio.en-US.md b/packages/products/tdesign-vue-next/src/radio/radio.en-US.md
@@ -12,6 +12,7 @@ default | String / Slot / Function | - | Typescript：`string \| TNode`。[see m
 disabled | Boolean | undefined | \- | N
 label | String / Slot / Function | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
 name | String | - | \- | N
+readonly | Boolean | false | \- | N
 value | String / Number / Boolean | undefined | Typescript：`string \| number \| boolean` | N
 onChange | Function |  | Typescript：`(checked: boolean, context: { e: Event }) => void`<br/> | N
 onClick | Function |  | Typescript：`(context: { e: MouseEvent }) => void`<br/>trigger on click | N
@@ -31,10 +32,10 @@ allowUncheck | Boolean | false | \- | N
 disabled | Boolean | - | \- | N
 name | String | - | \- | N
 options | Array | - | Typescript：`Array<RadioOption>` `type RadioOption = string \| number \| RadioOptionObj` `interface RadioOptionObj { label?: string \| TNode; value?: string \| number \| boolean; disabled?: boolean }`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts)。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/radio/type.ts) | N
-size | String | medium | options：small/medium/large。Typescript：`SizeEnum`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
+size | String | medium | options: small/medium/large。Typescript：`SizeEnum`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
 value | String / Number / Boolean | - | `v-model` and `v-model:value` is supported。Typescript：`T` `type RadioValue = string \| number \| boolean`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/radio/type.ts) | N
 defaultValue | String / Number / Boolean | - | uncontrolled property。Typescript：`T` `type RadioValue = string \| number \| boolean`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/radio/type.ts) | N
-variant | String | outline | options：outline/primary-filled/default-filled | N
+variant | String | outline | options: outline/primary-filled/default-filled | N
 onChange | Function |  | Typescript：`(value: T, context: { e: Event }) => void`<br/> | N
 
 ### RadioGroup Events

diff --git a/packages/products/tdesign-vue-next/src/radio/radio.md b/packages/products/tdesign-vue-next/src/radio/radio.md
@@ -12,6 +12,7 @@ default | String / Slot / Function | - | 单选按钮内容，同 label。TS 类
 disabled | Boolean | undefined | 是否为禁用态。如果存在父组件 RadioGroup，默认值由 RadioGroup.disabled 控制。Radio.disabled 优先级高于 RadioGroup.disabled | N
 label | String / Slot / Function | - | 主文案。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
 name | String | - | HTML 元素原生属性 | N
+readonly | Boolean | false | 只读状态 | N
 value | String / Number / Boolean | undefined | 单选按钮的值。TS 类型：`string \| number \| boolean` | N
 onChange | Function |  | TS 类型：`(checked: boolean, context: { e: Event }) => void`<br/>选中状态变化时触发 | N
 onClick | Function |  | TS 类型：`(context: { e: MouseEvent }) => void`<br/>点击时出发，一般用于外层阻止冒泡场景 | N

diff --git a/packages/products/tdesign-vue-next/src/radio/type.ts b/packages/products/tdesign-vue-next/src/radio/type.ts
@@ -44,6 +44,11 @@ export interface TdRadioProps {
    * @default ''
    */
   name?: string;
+  /**
+   * 只读状态
+   * @default false
+   */
+  readonly?: boolean;
   /**
    * 单选按钮的值
    */

diff --git a/packages/products/tdesign-vue/src/radio/props.ts b/packages/products/tdesign-vue/src/radio/props.ts
@@ -32,6 +32,8 @@ export default {
     type: String,
     default: '',
   },
+  /** 只读状态 */
+  readonly: Boolean,
   /** 单选按钮的值 */
   value: {
     type: [String, Number, Boolean] as PropType<TdRadioProps['value']>,

diff --git a/packages/products/tdesign-vue/src/radio/radio.en-US.md b/packages/products/tdesign-vue/src/radio/radio.en-US.md
@@ -12,6 +12,7 @@ default | String / Slot / Function | - | Typescript：`string \| TNode`。[see m
 disabled | Boolean | undefined | \- | N
 label | String / Slot / Function | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
 name | String | - | \- | N
+readonly | Boolean | false | \- | N
 value | String / Number / Boolean | undefined | Typescript：`string \| number \| boolean` | N
 onChange | Function |  | Typescript：`(checked: boolean, context: { e: Event }) => void`<br/> | N
 onClick | Function |  | Typescript：`(context: { e: MouseEvent }) => void`<br/>trigger on click | N
@@ -30,11 +31,11 @@ name | type | default | description | required
 allowUncheck | Boolean | false | \- | N
 disabled | Boolean | - | \- | N
 name | String | - | \- | N
-options | Array | - | Typescript：`Array<RadioOption>` `type RadioOption = string \| number \| RadioOptionObj` `interface RadioOptionObj { label?: string \| TNode; value?: string \| number; disabled?: boolean }`。[see more ts definition](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts)。[see more ts definition](https://github.com/Tencent/tdesign-vue/tree/develop/src/radio/type.ts) | N
-size | String | medium | options：small/medium/large。Typescript：`SizeEnum`。[see more ts definition](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
+options | Array | - | Typescript：`Array<RadioOption>` `type RadioOption = string \| number \| RadioOptionObj` `interface RadioOptionObj { label?: string \| TNode; value?: string \| number \| boolean; disabled?: boolean }`。[see more ts definition](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts)。[see more ts definition](https://github.com/Tencent/tdesign-vue/tree/develop/src/radio/type.ts) | N
+size | String | medium | options: small/medium/large。Typescript：`SizeEnum`。[see more ts definition](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
 value | String / Number / Boolean | - | `v-model` is supported。Typescript：`T` `type RadioValue = string \| number \| boolean`。[see more ts definition](https://github.com/Tencent/tdesign-vue/tree/develop/src/radio/type.ts) | N
 defaultValue | String / Number / Boolean | - | uncontrolled property。Typescript：`T` `type RadioValue = string \| number \| boolean`。[see more ts definition](https://github.com/Tencent/tdesign-vue/tree/develop/src/radio/type.ts) | N
-variant | String | outline | options：outline/primary-filled/default-filled | N
+variant | String | outline | options: outline/primary-filled/default-filled | N
 onChange | Function |  | Typescript：`(value: T, context: { e: Event }) => void`<br/> | N
 
 ### RadioGroup Events

diff --git a/packages/products/tdesign-vue/src/radio/radio.md b/packages/products/tdesign-vue/src/radio/radio.md
@@ -12,6 +12,7 @@ default | String / Slot / Function | - | 单选按钮内容，同 label。TS 类
 disabled | Boolean | undefined | 是否为禁用态。如果存在父组件 RadioGroup，默认值由 RadioGroup.disabled 控制。Radio.disabled 优先级高于 RadioGroup.disabled | N
 label | String / Slot / Function | - | 主文案。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
 name | String | - | HTML 元素原生属性 | N
+readonly | Boolean | false | 只读状态 | N
 value | String / Number / Boolean | undefined | 单选按钮的值。TS 类型：`string \| number \| boolean` | N
 onChange | Function |  | TS 类型：`(checked: boolean, context: { e: Event }) => void`<br/>选中状态变化时触发 | N
 onClick | Function |  | TS 类型：`(context: { e: MouseEvent }) => void`<br/>点击时出发，一般用于外层阻止冒泡场景 | N
@@ -30,7 +31,7 @@ click | `(context: { e: MouseEvent })` | 点击时出发，一般用于外层阻
 allowUncheck | Boolean | false | 是否允许取消选中 | N
 disabled | Boolean | - | 是否禁用全部子单选框。默认为 false。RadioGroup.disabled 优先级低于 Radio.disabled | N
 name | String | - | HTML 元素原生属性 | N
-options | Array | - | 单选组件按钮形式。RadioOption 数据类型为 string 或 number 时，表示 label 和 value 值相同。TS 类型：`Array<RadioOption>` `type RadioOption = string \| number \| RadioOptionObj` `interface RadioOptionObj { label?: string \| TNode; value?: string \| number; disabled?: boolean }`。[通用类型定义](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts)。[详细类型定义](https://github.com/Tencent/tdesign-vue/tree/develop/src/radio/type.ts) | N
+options | Array | - | 单选组件按钮形式。RadioOption 数据类型为 string 或 number 时，表示 label 和 value 值相同。TS 类型：`Array<RadioOption>` `type RadioOption = string \| number \| RadioOptionObj` `interface RadioOptionObj { label?: string \| TNode; value?: string \| number \| boolean; disabled?: boolean }`。[通用类型定义](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts)。[详细类型定义](https://github.com/Tencent/tdesign-vue/tree/develop/src/radio/type.ts) | N
 size | String | medium | 组件尺寸【讨论中】。可选项：small/medium/large。TS 类型：`SizeEnum`。[通用类型定义](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
 value | String / Number / Boolean | - | 选中的值。支持语法糖 `v-model`。TS 类型：`T` `type RadioValue = string \| number \| boolean`。[详细类型定义](https://github.com/Tencent/tdesign-vue/tree/develop/src/radio/type.ts) | N
 defaultValue | String / Number / Boolean | - | 选中的值。非受控属性。TS 类型：`T` `type RadioValue = string \| number \| boolean`。[详细类型定义](https://github.com/Tencent/tdesign-vue/tree/develop/src/radio/type.ts) | N

diff --git a/packages/products/tdesign-vue/src/radio/type.ts b/packages/products/tdesign-vue/src/radio/type.ts
@@ -39,6 +39,11 @@ export interface TdRadioProps {
    * @default ''
    */
   name?: string;
+  /**
+   * 只读状态
+   * @default false
+   */
+  readonly?: boolean;
   /**
    * 单选按钮的值
    */
@@ -100,7 +105,7 @@ export type RadioOption = string | number | RadioOptionObj;
 
 export interface RadioOptionObj {
   label?: string | TNode;
-  value?: string | number;
+  value?: string | number | boolean;
   disabled?: boolean;
 }
 

diff --git a/packages/scripts/api.json b/packages/scripts/api.json
@@ -76023,6 +76023,47 @@
         "String"
       ]
     },
+    {
+      "id": 1704697117,
+      "platform_framework": [
+        "1",
+        "2",
+        "4"
+      ],
+      "component": "Radio",
+      "field_category": 1,
+      "field_name": "readonly",
+      "field_type": [
+        "4"
+      ],
+      "field_default_value": "false",
+      "field_enum": "",
+      "field_desc_zh": "只读状态",
+      "field_desc_en": null,
+      "field_required": 0,
+      "event_input": "",
+      "create_time": "2024-01-08 06:58:37",
+      "update_time": "2024-01-08 06:58:37",
+      "event_output": null,
+      "custom_field_type": null,
+      "syntactic_sugar": null,
+      "readonly": 1,
+      "html_attribute": 0,
+      "trigger_elements": "",
+      "deprecated": 0,
+      "version": "",
+      "test_description": null,
+      "support_default_value": 0,
+      "field_category_text": "Props",
+      "platform_framework_text": [
+        "Vue(PC)",
+        "React(PC)",
+        "Angular(PC)"
+      ],
+      "field_type_text": [
+        "Boolean"
+      ]
+    },
     {
       "id": 3069,
       "platform_framework": [