From 2df79686ec6b6cac6549a8baeeaecb6d59ff909b Mon Sep 17 00:00:00 2001 From: kwl01770065 Date: Wed, 11 Sep 2024 11:12:41 +0800 Subject: [PATCH 1/2] =?UTF-8?q?docs(checkbox):=20mobile-react=20checkbox?= =?UTF-8?q?=E6=96=87=E6=A1=A3=E5=AF=B9=E9=BD=90mobile-vue?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- db/TDesign.db | Bin 1003520 -> 1003520 bytes .../checkbox-group/checkbox-group.en-US.md | 18 ++++++ .../src/checkbox-group/checkbox-group.md | 18 ++++++ .../src/checkbox/checkbox.en-US.md | 44 ++++++++++++++ .../src/checkbox/checkbox.md | 44 ++++++++++++++ .../src/checkbox/defaultProps.ts | 11 ++++ .../tdesign-mobile-react/src/checkbox/type.ts | 54 ++++++++++++++++++ packages/scripts/api.json | 24 ++++---- 8 files changed, 199 insertions(+), 14 deletions(-) create mode 100644 packages/products/tdesign-mobile-react/src/checkbox-group/checkbox-group.en-US.md create mode 100644 packages/products/tdesign-mobile-react/src/checkbox-group/checkbox-group.md create mode 100644 packages/products/tdesign-mobile-react/src/checkbox/checkbox.en-US.md create mode 100644 packages/products/tdesign-mobile-react/src/checkbox/checkbox.md create mode 100644 packages/products/tdesign-mobile-react/src/checkbox/defaultProps.ts create mode 100644 packages/products/tdesign-mobile-react/src/checkbox/type.ts diff --git a/db/TDesign.db b/db/TDesign.db index 88765c979ee704ba2d180467f109bc0e8be1a830..9e5d829b2666b8c5fc463fcae073a7d53ce959ea 100644 GIT binary patch delta 155 zcmZozVB4_3c7imc=R_H2M$g8C)&$0_2~2`zoaxRPsma+%`4!XSjoGB8*Q+zJZJ$-f zB%RL4H2L5{wdo%uIeFV(-em$}W*}w(Vpbq#17da{<^W<&Am-Zs@-FwKJ&Xz4_srti zJ&#eny~2`rdxa%mmn5Ua=7S6K8K-B?VfWp>KZNfEJEO#OuO_~z?M$(J|2_c#5??_& delta 153 zcmZozVB4_3c7imc^F$eEM(4(a)&$0_2~2`zoaN3Lsma+%`4!XSjoGB8*Q+zJZJ$-f zB%RJEH2L5{wdo%uIeFV(-em$}W*}w(Vpbq#17da{<^W<&Am-Zs@-FwKJ&Xn0_srti xJ&)16y~2`rdxa%mmn0*{=7S6K8K-B?VfWp>KZNfE`*hDHzUb{tv3&nN0RW@=K}7%n diff --git a/packages/products/tdesign-mobile-react/src/checkbox-group/checkbox-group.en-US.md b/packages/products/tdesign-mobile-react/src/checkbox-group/checkbox-group.en-US.md new file mode 100644 index 00000000..68046d2b --- /dev/null +++ b/packages/products/tdesign-mobile-react/src/checkbox-group/checkbox-group.en-US.md @@ -0,0 +1,18 @@ +:: BASE_DOC :: + +## API + + +### CheckboxGroup Props + +name | type | default | description | required +-- | -- | -- | -- | -- +className | String | - | className of component | N +style | Object | - | CSS(Cascading Style Sheets)，Typescript：`React.CSSProperties` | N +disabled | Boolean | undefined | \- | N +max | Number | undefined | \- | N +name | String | - | \- | N +options | Array | - | Typescript：`Array` `type CheckboxOption = string \| number \| CheckboxOptionObj` `interface CheckboxOptionObj extends TdCheckboxProps { text?: string; }`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N +value | Array | [] | Typescript：`T` `type CheckboxGroupValue = Array`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N +defaultValue | Array | [] | uncontrolled property。Typescript：`T` `type CheckboxGroupValue = Array`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N +onChange | Function | | Typescript：`(value: T, context: CheckboxGroupChangeContext) => void`
[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts)。
`interface CheckboxGroupChangeContext { e: Event; current: string \| number; option: CheckboxOption \| TdCheckboxProps; type: 'check' \| 'uncheck' }`
| N diff --git a/packages/products/tdesign-mobile-react/src/checkbox-group/checkbox-group.md b/packages/products/tdesign-mobile-react/src/checkbox-group/checkbox-group.md new file mode 100644 index 00000000..5dc36aba --- /dev/null +++ b/packages/products/tdesign-mobile-react/src/checkbox-group/checkbox-group.md @@ -0,0 +1,18 @@ +:: BASE_DOC :: + +## API + + +### CheckboxGroup Props + +名称 | 类型 | 默认值 | 描述 | 必传 +-- | -- | -- | -- | -- +className | String | - | 类名 | N +style | Object | - | 样式，TS 类型：`React.CSSProperties` | N +disabled | Boolean | undefined | 是否禁用组件。优先级：Form.disabled < CheckboxGroup.disabled < Checkbox.disabled | N +max | Number | undefined | 支持最多选中的数量 | N +name | String | - | 统一设置内部复选框 HTML 属性 | N +options | Array | - | 以配置形式设置子元素。示例1：`['北京', '上海']` ，示例2: `[{ label: '全选', checkAll: true }, { label: '上海', value: 'shanghai' }]`。checkAll 值为 true 表示当前选项为「全选选项」。TS 类型：`Array` `type CheckboxOption = string \| number \| CheckboxOptionObj` `interface CheckboxOptionObj extends TdCheckboxProps { text?: string; }`。[详细类型定义](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N +value | Array | [] | 选中值。TS 类型：`T` `type CheckboxGroupValue = Array`。[详细类型定义](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N +defaultValue | Array | [] | 选中值。非受控属性。TS 类型：`T` `type CheckboxGroupValue = Array`。[详细类型定义](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N +onChange | Function | | TS 类型：`(value: T, context: CheckboxGroupChangeContext) => void`
值变化时触发。`context.current` 表示当前变化的数据项，如果是全选则为空；`context.type` 表示引起选中数据变化的是选中或是取消选中，`context.option` 表示当前变化的数据项。[详细类型定义](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts)。
`interface CheckboxGroupChangeContext { e: Event; current: string \| number; option: CheckboxOption \| TdCheckboxProps; type: 'check' \| 'uncheck' }`
| N diff --git a/packages/products/tdesign-mobile-react/src/checkbox/checkbox.en-US.md b/packages/products/tdesign-mobile-react/src/checkbox/checkbox.en-US.md new file mode 100644 index 00000000..e1adbb0c --- /dev/null +++ b/packages/products/tdesign-mobile-react/src/checkbox/checkbox.en-US.md @@ -0,0 +1,44 @@ +:: BASE_DOC :: + +## API + +### Checkbox Props + +name | type | default | description | required +-- | -- | -- | -- | -- +className | String | - | className of component | N +style | Object | - | CSS(Cascading Style Sheets)，Typescript：`React.CSSProperties` | N +block | Boolean | true | \- | N +borderless | Boolean | false | \- | N +checkAll | Boolean | false | \- | N +checked | Boolean | false | \- | N +defaultChecked | Boolean | false | uncontrolled property | N +children | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N +content | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N +contentDisabled | Boolean | - | \- | N +disabled | Boolean | undefined | \- | N +icon | String / Boolean / Array | 'circle' | Typescript：`'circle' \| 'line' \| 'rectangle' \| boolean \| Array`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N +indeterminate | Boolean | false | \- | N +label | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N +maxContentRow | Number | 5 | \- | N +maxLabelRow | Number | 3 | \- | N +name | String | - | \- | N +placement | String | left | options: left/right | N +readonly | Boolean | false | \- | N +value | String / Number / Boolean | - | value of checkbox。Typescript：`string \| number \| boolean` | N +onChange | Function | | Typescript：`(checked: boolean, context: { e: ChangeEvent }) => void`
| N + + +### CheckboxGroup Props + +name | type | default | description | required +-- | -- | -- | -- | -- +className | String | - | className of component | N +style | Object | - | CSS(Cascading Style Sheets)，Typescript：`React.CSSProperties` | N +disabled | Boolean | undefined | \- | N +max | Number | undefined | \- | N +name | String | - | \- | N +options | Array | - | Typescript：`Array` `type CheckboxOption = string \| number \| CheckboxOptionObj` `interface CheckboxOptionObj extends TdCheckboxProps { text?: string; }`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N +value | Array | [] | Typescript：`T` `type CheckboxGroupValue = Array`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N +defaultValue | Array | [] | uncontrolled property。Typescript：`T` `type CheckboxGroupValue = Array`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N +onChange | Function | | Typescript：`(value: T, context: CheckboxGroupChangeContext) => void`
[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts)。
`interface CheckboxGroupChangeContext { e: Event; current: string \| number; option: CheckboxOption \| TdCheckboxProps; type: 'check' \| 'uncheck' }`
| N diff --git a/packages/products/tdesign-mobile-react/src/checkbox/checkbox.md b/packages/products/tdesign-mobile-react/src/checkbox/checkbox.md new file mode 100644 index 00000000..d13e5c42 --- /dev/null +++ b/packages/products/tdesign-mobile-react/src/checkbox/checkbox.md @@ -0,0 +1,44 @@ +:: BASE_DOC :: + +## API + +### Checkbox Props + +名称 | 类型 | 默认值 | 描述 | 必传 +-- | -- | -- | -- | -- +className | String | - | 类名 | N +style | Object | - | 样式，TS 类型：`React.CSSProperties` | N +block | Boolean | true | 是否为块级元素 | N +borderless | Boolean | false | 是否开启无边框模式 | N +checkAll | Boolean | false | 用于标识是否为「全选选项」。单独使用无效，需在 CheckboxGroup 中使用 | N +checked | Boolean | false | 是否选中 | N +defaultChecked | Boolean | false | 是否选中。非受控属性 | N +children | TNode | - | 多选框内容，同 label。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N +content | TNode | - | 多选框内容。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N +contentDisabled | Boolean | - | 是否禁用组件内容（content）触发选中 | N +disabled | Boolean | undefined | 是否禁用组件。如果父组件存在 CheckboxGroup，默认值由 CheckboxGroup.disabled 控制。优先级：Checkbox.disabled > CheckboxGroup.disabled > Form.disabled | N +icon | String / Boolean / Array | 'circle' | 自定义选中图标和非选中图标。使用 Array 时表示：[选中态图标，非选中态图标]。使用 String 时，值为 circle 表示填充圆形图标、值为 line 表示描边型图标、值为 rectangle 表示填充矩形图标。。TS 类型：`'circle' \| 'line' \| 'rectangle' \| boolean \| Array`。[通用类型定义](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N +indeterminate | Boolean | false | 是否为半选 | N +label | TNode | - | 主文案。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-mobile-react/blob/develop/src/common.ts) | N +maxContentRow | Number | 5 | 内容最大行数限制 | N +maxLabelRow | Number | 3 | 主文案最大行数限制 | N +name | String | - | HTML 元素原生属性 | N +placement | String | left | 多选框和内容相对位置。可选项：left/right | N +readonly | Boolean | false | 【暂不支持】只读状态 | N +value | String / Number / Boolean | - | 多选框的值。TS 类型：`string \| number \| boolean` | N +onChange | Function | | TS 类型：`(checked: boolean, context: { e: ChangeEvent }) => void`
值变化时触发 | N + + +### CheckboxGroup Props + +名称 | 类型 | 默认值 | 描述 | 必传 +-- | -- | -- | -- | -- +className | String | - | 类名 | N +style | Object | - | 样式，TS 类型：`React.CSSProperties` | N +disabled | Boolean | undefined | 是否禁用组件。优先级：Form.disabled < CheckboxGroup.disabled < Checkbox.disabled | N +max | Number | undefined | 支持最多选中的数量 | N +name | String | - | 统一设置内部复选框 HTML 属性 | N +options | Array | - | 以配置形式设置子元素。示例1：`['北京', '上海']` ，示例2: `[{ label: '全选', checkAll: true }, { label: '上海', value: 'shanghai' }]`。checkAll 值为 true 表示当前选项为「全选选项」。TS 类型：`Array` `type CheckboxOption = string \| number \| CheckboxOptionObj` `interface CheckboxOptionObj extends TdCheckboxProps { text?: string; }`。[详细类型定义](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N +value | Array | [] | 选中值。TS 类型：`T` `type CheckboxGroupValue = Array`。[详细类型定义](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N +defaultValue | Array | [] | 选中值。非受控属性。TS 类型：`T` `type CheckboxGroupValue = Array`。[详细类型定义](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N +onChange | Function | | TS 类型：`(value: T, context: CheckboxGroupChangeContext) => void`
值变化时触发。`context.current` 表示当前变化的数据项，如果是全选则为空；`context.type` 表示引起选中数据变化的是选中或是取消选中，`context.option` 表示当前变化的数据项。[详细类型定义](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts)。
`interface CheckboxGroupChangeContext { e: Event; current: string \| number; option: CheckboxOption \| TdCheckboxProps; type: 'check' \| 'uncheck' }`
| N diff --git a/packages/products/tdesign-mobile-react/src/checkbox/defaultProps.ts b/packages/products/tdesign-mobile-react/src/checkbox/defaultProps.ts new file mode 100644 index 00000000..a646f305 --- /dev/null +++ b/packages/products/tdesign-mobile-react/src/checkbox/defaultProps.ts @@ -0,0 +1,11 @@ +/** + * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC + * */ + +import { TdCheckboxGroupProps } from './type'; + +export const checkboxGroupDefaultProps: TdCheckboxGroupProps = { + disabled: undefined, + max: undefined, + defaultValue: [], +}; diff --git a/packages/products/tdesign-mobile-react/src/checkbox/type.ts b/packages/products/tdesign-mobile-react/src/checkbox/type.ts new file mode 100644 index 00000000..b5d940c9 --- /dev/null +++ b/packages/products/tdesign-mobile-react/src/checkbox/type.ts @@ -0,0 +1,54 @@ +/* eslint-disable */ + +/** + * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC + * */ + +export interface TdCheckboxGroupProps { + /** + * 是否禁用组件。优先级：Form.disabled < CheckboxGroup.disabled < Checkbox.disabled + */ + disabled?: boolean; + /** + * 支持最多选中的数量 + */ + max?: number; + /** + * 统一设置内部复选框 HTML 属性 + * @default '' + */ + name?: string; + /** + * 以配置形式设置子元素。示例1：`['北京', '上海']` ，示例2: `[{ label: '全选', checkAll: true }, { label: '上海', value: 'shanghai' }]`。checkAll 值为 true 表示当前选项为「全选选项」 + */ + options?: Array; + /** + * 选中值 + * @default [] + */ + value?: T; + /** + * 选中值，非受控属性 + * @default [] + */ + defaultValue?: T; + /** + * 值变化时触发。`context.current` 表示当前变化的数据项，如果是全选则为空；`context.type` 表示引起选中数据变化的是选中或是取消选中，`context.option` 表示当前变化的数据项 + */ + onChange?: (value: T, context: CheckboxGroupChangeContext) => void; +} + +export type CheckboxOption = string | number | CheckboxOptionObj; + +export interface CheckboxOptionObj extends TdCheckboxProps { + text?: string; +} + +export type CheckboxGroupValue = Array; + +export interface CheckboxGroupChangeContext { + e: Event; + current: string | number; + option: CheckboxOption | TdCheckboxProps; + type: 'check' | 'uncheck'; +} diff --git a/packages/scripts/api.json b/packages/scripts/api.json index 0b234204..fef9bd17 100644 --- a/packages/scripts/api.json +++ b/packages/scripts/api.json @@ -25898,7 +25898,6 @@ "1", "2", "4", - "16", "32", "64" ], @@ -25931,7 +25930,6 @@ "Vue(PC)", "React(PC)", "Angular(PC)", - "React(Mobile)", "Angular(Mobile)", "Miniprogram" ], @@ -25942,7 +25940,8 @@ { "id": 1712578906, "platform_framework": [ - "8" + "8", + "16" ], "component": "Checkbox", "field_category": 1, @@ -25970,7 +25969,8 @@ "support_default_value": 0, "field_category_text": "Props", "platform_framework_text": [ - "Vue(Mobile)" + "Vue(Mobile)", + "React(Mobile)" ], "field_type_text": [ "Boolean" @@ -25982,7 +25982,6 @@ "1", "2", "4", - "16", "32" ], "component": "Checkbox", @@ -26014,7 +26013,6 @@ "Vue(PC)", "React(PC)", "Angular(PC)", - "React(Mobile)", "Angular(Mobile)" ], "field_type_text": [ @@ -26382,7 +26380,6 @@ { "id": 3521, "platform_framework": [ - "16", "32", "64" ], @@ -26412,7 +26409,6 @@ "support_default_value": 0, "field_category_text": "Props", "platform_framework_text": [ - "React(Mobile)", "Angular(Mobile)", "Miniprogram" ], @@ -26779,8 +26775,7 @@ { "id": 1233, "platform_framework": [ - "2", - "16" + "2" ], "component": "CheckboxGroup", "field_category": 2, @@ -26806,8 +26801,7 @@ "support_default_value": 0, "field_category_text": "Events", "platform_framework_text": [ - "React(PC)", - "React(Mobile)" + "React(PC)" ], "field_type_text": [] }, @@ -26847,7 +26841,8 @@ { "id": 1712648151, "platform_framework": [ - "8" + "8", + "16" ], "component": "CheckboxGroup", "field_category": 2, @@ -26873,7 +26868,8 @@ "support_default_value": 0, "field_category_text": "Events", "platform_framework_text": [ - "Vue(Mobile)" + "Vue(Mobile)", + "React(Mobile)" ], "field_type_text": [] }, From f4be235e663bad3ad89b0430298433671e3bc912 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=BB=8E=E4=BC=9F=E6=9D=B0?= <674416404@qq.com> Date: Wed, 11 Sep 2024 12:06:48 +0800 Subject: [PATCH 2/2] feat: update api --- db/TDesign.db | Bin 1003520 -> 1003520 bytes .../checkbox-group/checkbox-group.en-US.md | 18 ---- .../src/checkbox-group/checkbox-group.md | 18 ---- .../src/checkbox/checkbox.md | 2 +- .../src/checkbox/defaultProps.ts | 16 ++- .../tdesign-mobile-react/src/checkbox/type.ts | 94 ++++++++++++++++++ .../src/checkbox/checkbox.md | 2 +- .../tdesign-mobile-vue/src/checkbox/props.ts | 2 +- .../tdesign-mobile-vue/src/checkbox/type.ts | 2 +- packages/scripts/api.json | 51 ++-------- 10 files changed, 120 insertions(+), 85 deletions(-) delete mode 100644 packages/products/tdesign-mobile-react/src/checkbox-group/checkbox-group.en-US.md delete mode 100644 packages/products/tdesign-mobile-react/src/checkbox-group/checkbox-group.md diff --git a/db/TDesign.db b/db/TDesign.db index b626c0be3b851a255c9b3cdf5bf462064d021ebc..473b6c658645cc947ed5b0dc64002e04baf62daa 100644 GIT binary patch delta 298 zcmZozVB4_3c7ilx$V3@u#*oH@)&$0_2~3Ofd4d_ZS$;EdX>)wz=-Hc=Z1ZG~Q?S?^oMqG@Gwx`7KEnsGGW!k|oT`q~&b9!I`U&;3434CW6w@*p}N-?ot V+isG^x0sRn6a&}xTj_jiF94M6U0DDC delta 238 zcmZozVB4_3c7imc-$WT_M!&{{)&$0_2~3Ofd3G^yv;1b_(&qTa7QCIWfXS6@dVd9z zKBTmh^zIhS*M<_KUv$Iiz# zo8=KtJJbE`h6&8POxq2E_>8z1)wid_@GW3wabw!SFkLQ**K>Mc0$&N^we3d|_|7qI epOVBkkC}<{)OM3JzQv5p%q&dXZ>968y#N5)UsR0% diff --git a/packages/products/tdesign-mobile-react/src/checkbox-group/checkbox-group.en-US.md b/packages/products/tdesign-mobile-react/src/checkbox-group/checkbox-group.en-US.md deleted file mode 100644 index 68046d2b..00000000 --- a/packages/products/tdesign-mobile-react/src/checkbox-group/checkbox-group.en-US.md +++ /dev/null @@ -1,18 +0,0 @@ -:: BASE_DOC :: - -## API - - -### CheckboxGroup Props - -name | type | default | description | required --- | -- | -- | -- | -- -className | String | - | className of component | N -style | Object | - | CSS(Cascading Style Sheets)，Typescript：`React.CSSProperties` | N -disabled | Boolean | undefined | \- | N -max | Number | undefined | \- | N -name | String | - | \- | N -options | Array | - | Typescript：`Array` `type CheckboxOption = string \| number \| CheckboxOptionObj` `interface CheckboxOptionObj extends TdCheckboxProps { text?: string; }`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N -value | Array | [] | Typescript：`T` `type CheckboxGroupValue = Array`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N -defaultValue | Array | [] | uncontrolled property。Typescript：`T` `type CheckboxGroupValue = Array`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N -onChange | Function | | Typescript：`(value: T, context: CheckboxGroupChangeContext) => void`
[see more ts definition](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts)。
`interface CheckboxGroupChangeContext { e: Event; current: string \| number; option: CheckboxOption \| TdCheckboxProps; type: 'check' \| 'uncheck' }`
| N diff --git a/packages/products/tdesign-mobile-react/src/checkbox-group/checkbox-group.md b/packages/products/tdesign-mobile-react/src/checkbox-group/checkbox-group.md deleted file mode 100644 index 5dc36aba..00000000 --- a/packages/products/tdesign-mobile-react/src/checkbox-group/checkbox-group.md +++ /dev/null @@ -1,18 +0,0 @@ -:: BASE_DOC :: - -## API - - -### CheckboxGroup Props - -名称 | 类型 | 默认值 | 描述 | 必传 --- | -- | -- | -- | -- -className | String | - | 类名 | N -style | Object | - | 样式，TS 类型：`React.CSSProperties` | N -disabled | Boolean | undefined | 是否禁用组件。优先级：Form.disabled < CheckboxGroup.disabled < Checkbox.disabled | N -max | Number | undefined | 支持最多选中的数量 | N -name | String | - | 统一设置内部复选框 HTML 属性 | N -options | Array | - | 以配置形式设置子元素。示例1：`['北京', '上海']` ，示例2: `[{ label: '全选', checkAll: true }, { label: '上海', value: 'shanghai' }]`。checkAll 值为 true 表示当前选项为「全选选项」。TS 类型：`Array` `type CheckboxOption = string \| number \| CheckboxOptionObj` `interface CheckboxOptionObj extends TdCheckboxProps { text?: string; }`。[详细类型定义](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N -value | Array | [] | 选中值。TS 类型：`T` `type CheckboxGroupValue = Array`。[详细类型定义](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N -defaultValue | Array | [] | 选中值。非受控属性。TS 类型：`T` `type CheckboxGroupValue = Array`。[详细类型定义](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts) | N -onChange | Function | | TS 类型：`(value: T, context: CheckboxGroupChangeContext) => void`
值变化时触发。`context.current` 表示当前变化的数据项，如果是全选则为空；`context.type` 表示引起选中数据变化的是选中或是取消选中，`context.option` 表示当前变化的数据项。[详细类型定义](https://github.com/Tencent/tdesign-mobile-react/tree/develop/src/checkbox/type.ts)。
`interface CheckboxGroupChangeContext { e: Event; current: string \| number; option: CheckboxOption \| TdCheckboxProps; type: 'check' \| 'uncheck' }`
| N diff --git a/packages/products/tdesign-mobile-react/src/checkbox/checkbox.md b/packages/products/tdesign-mobile-react/src/checkbox/checkbox.md index d13e5c42..4d28a84b 100644 --- a/packages/products/tdesign-mobile-react/src/checkbox/checkbox.md +++ b/packages/products/tdesign-mobile-react/src/checkbox/checkbox.md @@ -24,7 +24,7 @@ maxContentRow | Number | 5 | 内容最大行数限制 | N maxLabelRow | Number | 3 | 主文案最大行数限制 | N name | String | - | HTML 元素原生属性 | N placement | String | left | 多选框和内容相对位置。可选项：left/right | N -readonly | Boolean | false | 【暂不支持】只读状态 | N +readonly | Boolean | false | 只读状态 | N value | String / Number / Boolean | - | 多选框的值。TS 类型：`string \| number \| boolean` | N onChange | Function | | TS 类型：`(checked: boolean, context: { e: ChangeEvent }) => void`
值变化时触发 | N diff --git a/packages/products/tdesign-mobile-react/src/checkbox/defaultProps.ts b/packages/products/tdesign-mobile-react/src/checkbox/defaultProps.ts index a646f305..1a810799 100644 --- a/packages/products/tdesign-mobile-react/src/checkbox/defaultProps.ts +++ b/packages/products/tdesign-mobile-react/src/checkbox/defaultProps.ts @@ -2,7 +2,21 @@ * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC * */ -import { TdCheckboxGroupProps } from './type'; +import { TdCheckboxProps, TdCheckboxGroupProps } from './type'; + +export const checkboxDefaultProps: TdCheckboxProps = { + block: true, + borderless: false, + checkAll: false, + defaultChecked: false, + disabled: undefined, + icon: 'circle', + indeterminate: false, + maxContentRow: 5, + maxLabelRow: 3, + placement: 'left', + readonly: false, +}; export const checkboxGroupDefaultProps: TdCheckboxGroupProps = { disabled: undefined, diff --git a/packages/products/tdesign-mobile-react/src/checkbox/type.ts b/packages/products/tdesign-mobile-react/src/checkbox/type.ts index b5d940c9..e4a0137c 100644 --- a/packages/products/tdesign-mobile-react/src/checkbox/type.ts +++ b/packages/products/tdesign-mobile-react/src/checkbox/type.ts @@ -4,6 +4,100 @@ * 该文件为脚本自动生成文件，请勿随意修改。如需修改请联系 PMC * */ +import { TNode } from '../common'; +import { ChangeEvent } from 'react'; + +export interface TdCheckboxProps { + /** + * 是否为块级元素 + * @default true + */ + block?: boolean; + /** + * 是否开启无边框模式 + * @default false + */ + borderless?: boolean; + /** + * 用于标识是否为「全选选项」。单独使用无效，需在 CheckboxGroup 中使用 + * @default false + */ + checkAll?: boolean; + /** + * 是否选中 + * @default false + */ + checked?: boolean; + /** + * 是否选中，非受控属性 + * @default false + */ + defaultChecked?: boolean; + /** + * 多选框内容，同 label + */ + children?: TNode; + /** + * 多选框内容 + */ + content?: TNode; + /** + * 是否禁用组件内容（content）触发选中 + */ + contentDisabled?: boolean; + /** + * 是否禁用组件。如果父组件存在 CheckboxGroup，默认值由 CheckboxGroup.disabled 控制。优先级：Checkbox.disabled > CheckboxGroup.disabled > Form.disabled + */ + disabled?: boolean; + /** + * 自定义选中图标和非选中图标。使用 Array 时表示：[选中态图标，非选中态图标]。使用 String 时，值为 circle 表示填充圆形图标、值为 line 表示描边型图标、值为 rectangle 表示填充矩形图标。 + * @default 'circle' + */ + icon?: 'circle' | 'line' | 'rectangle' | boolean | Array; + /** + * 是否为半选 + * @default false + */ + indeterminate?: boolean; + /** + * 主文案 + */ + label?: TNode; + /** + * 内容最大行数限制 + * @default 5 + */ + maxContentRow?: number; + /** + * 主文案最大行数限制 + * @default 3 + */ + maxLabelRow?: number; + /** + * HTML 元素原生属性 + * @default '' + */ + name?: string; + /** + * 多选框和内容相对位置 + * @default left + */ + placement?: 'left' | 'right'; + /** + * 只读状态 + * @default false + */ + readonly?: boolean; + /** + * 多选框的值 + */ + value?: string | number | boolean; + /** + * 值变化时触发 + */ + onChange?: (checked: boolean, context: { e: ChangeEvent }) => void; +} + export interface TdCheckboxGroupProps { /** * 是否禁用组件。优先级：Form.disabled < CheckboxGroup.disabled < Checkbox.disabled diff --git a/packages/products/tdesign-mobile-vue/src/checkbox/checkbox.md b/packages/products/tdesign-mobile-vue/src/checkbox/checkbox.md index d09821de..e4ab7cef 100644 --- a/packages/products/tdesign-mobile-vue/src/checkbox/checkbox.md +++ b/packages/products/tdesign-mobile-vue/src/checkbox/checkbox.md @@ -21,7 +21,7 @@ maxContentRow | Number | 5 | 内容最大行数限制 | N maxLabelRow | Number | 3 | 主文案最大行数限制 | N name | String | - | HTML 元素原生属性 | N placement | String | left | 多选框和内容相对位置。可选项：left/right | N -readonly | Boolean | false | 【暂不支持】只读状态 | N +readonly | Boolean | false | 只读状态 | N value | String / Number / Boolean | - | 多选框的值。TS 类型：`string \| number \| boolean` | N onChange | Function | | TS 类型：`(checked: boolean, context: { e: Event }) => void`
值变化时触发 | N diff --git a/packages/products/tdesign-mobile-vue/src/checkbox/props.ts b/packages/products/tdesign-mobile-vue/src/checkbox/props.ts index 8386954e..e074986a 100644 --- a/packages/products/tdesign-mobile-vue/src/checkbox/props.ts +++ b/packages/products/tdesign-mobile-vue/src/checkbox/props.ts @@ -76,7 +76,7 @@ export default { return ['left', 'right'].includes(val); }, }, - /** 【暂不支持】只读状态 */ + /** 只读状态 */ readonly: Boolean, /** 多选框的值 */ value: { diff --git a/packages/products/tdesign-mobile-vue/src/checkbox/type.ts b/packages/products/tdesign-mobile-vue/src/checkbox/type.ts index 383c901b..eb124167 100644 --- a/packages/products/tdesign-mobile-vue/src/checkbox/type.ts +++ b/packages/products/tdesign-mobile-vue/src/checkbox/type.ts @@ -83,7 +83,7 @@ export interface TdCheckboxProps { */ placement?: 'left' | 'right'; /** - * 【暂不支持】只读状态 + * 只读状态 * @default false */ readonly?: boolean; diff --git a/packages/scripts/api.json b/packages/scripts/api.json index e3b7fa9d..e66d77fe 100644 --- a/packages/scripts/api.json +++ b/packages/scripts/api.json @@ -25898,6 +25898,8 @@ "1", "2", "4", + "8", + "16", "32", "64" ], @@ -25922,7 +25924,7 @@ "html_attribute": 0, "trigger_elements": "", "deprecated": 0, - "version": null, + "version": "", "test_description": null, "support_default_value": 0, "field_category_text": "Props", @@ -25930,6 +25932,8 @@ "Vue(PC)", "React(PC)", "Angular(PC)", + "Vue(Mobile)", + "React(Mobile)", "Angular(Mobile)", "Miniprogram" ], @@ -25937,52 +25941,12 @@ "Boolean" ] }, - { - "id": 1712578906, - "platform_framework": [ - "8", - "16" - ], - "component": "Checkbox", - "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-04-08 12:21:46", - "update_time": "2024-04-08 12:21:46", - "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(Mobile)", - "React(Mobile)" - ], - "field_type_text": [ - "Boolean" - ] - }, { "id": 1707208468, "platform_framework": [ "1", "2", - "4", - "32" + "4" ], "component": "Checkbox", "field_category": 1, @@ -26012,8 +25976,7 @@ "platform_framework_text": [ "Vue(PC)", "React(PC)", - "Angular(PC)", - "Angular(Mobile)" + "Angular(PC)" ], "field_type_text": [ "String"