Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: keys disabled #3202

Merged
merged 9 commits into from
Aug 15, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 7 additions & 6 deletions src/cascader/cascader.en-US.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
name | type | default | description | required
-- | -- | -- | -- | --
autofocus | Boolean | - | \- | N
borderless | Boolean | false | \- | N
checkProps | Object | - | Typescript:`CheckboxProps`,[Checkbox API Documents](./checkbox?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/cascader/type.ts) | N
checkStrictly | Boolean | false | \- | N
clearable | Boolean | false | \- | N
Expand All @@ -15,7 +16,7 @@ empty | String / Slot / Function | - | Typescript:`string \| TNode`。[see mor
filter | Function | - | Typescript:`(filterWords: string, node: TreeNodeModel) => boolean \| Promise<boolean>` | N
filterable | Boolean | false | \- | N
inputProps | Object | - | Typescript:`InputProps`,[Input API Documents](./input?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/cascader/type.ts) | N
keys | Object | - | Typescript:`CascaderKeysType` `interface CascaderKeysType { value?: string; label?: string; children?: string \| 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/cascader/type.ts) | N
keys | Object | - | Typescript:`CascaderKeysType` `interface CascaderKeysType { value?: string; label?: string; children?: string; disabled?: string }`。[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/cascader/type.ts) | 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
lazy | Boolean | true | \- | N
load | Function | - | Typescript:`(node: TreeNodeModel<CascaderOption>) => Promise<Array<CascaderOption>>` | N
Expand All @@ -34,19 +35,19 @@ readonly | Boolean | false | \- | N
reserveKeyword | Boolean | false | \- | N
selectInputProps | Object | - | Typescript:`SelectInputProps`,[SelectInput API Documents](./select-input?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/cascader/type.ts) | N
showAllLevels | Boolean | true | \- | N
size | String | medium | optionslarge/medium/small。Typescript:`SizeEnum`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
status | String | default | optionsdefault/success/warning/error | N
size | String | medium | options: large/medium/small。Typescript:`SizeEnum`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
status | String | default | options: default/success/warning/error | N
suffix | String / Slot / Function | - | Typescript:`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
suffixIcon | Slot / Function | - | Typescript:`TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
tagInputProps | Object | - | Typescript:`TagInputProps`,[TagInput API Documents](./tag-input?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/cascader/type.ts) | N
tagProps | Object | - | Typescript:`TagProps`,[Tag API Documents](./tag?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/cascader/type.ts) | N
tips | String / Slot / Function | - | tips at the bottom of cascader。Typescript:`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
trigger | String | click | optionsclick/hover | N
trigger | String | click | options: click/hover | N
value | String / Number / Array | [] | `v-model` and `v-model:value` is supported。Typescript:`CascaderValue<CascaderOption>` `type CascaderValue<T extends TreeOptionData = TreeOptionData> = string \| number \| T \| Array<CascaderValue<T>>`。[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/cascader/type.ts) | N
defaultValue | String / Number / Array | [] | uncontrolled property。Typescript:`CascaderValue<CascaderOption>` `type CascaderValue<T extends TreeOptionData = TreeOptionData> = string \| number \| T \| Array<CascaderValue<T>>`。[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/cascader/type.ts) | N
valueDisplay | String / Slot / Function | - | `MouseEvent<SVGElement>`。Typescript:`string \| TNode<{ value: CascaderValue<CascaderOption>; onClose: (index: number) => void; displayValue?: CascaderValue<CascaderOption> }>`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
valueMode | String | onlyLeaf | optionsonlyLeaf/parentFirst/all | N
valueType | String | single | optionssingle/full | N
valueMode | String | onlyLeaf | options: onlyLeaf/parentFirst/all | N
valueType | String | single | options: single/full | N
onBlur | Function | | Typescript:`(context: { value: CascaderValue<CascaderOption> } & SelectInputBlurContext ) => void`<br/> | N
onChange | Function | | Typescript:`(value: CascaderValue<CascaderOption>, context: CascaderChangeContext<CascaderOption>) => void`<br/>[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/cascader/type.ts)。<br/>`interface CascaderChangeContext<CascaderOption> { node?: TreeNodeModel<CascaderOption>; source: CascaderChangeSource }`<br/><br/>`import { TreeNodeModel } from '@Tree'`<br/><br/>`type CascaderChangeSource = 'invalid-value' \| 'check' \| 'clear' \| 'uncheck'`<br/> | N
onFocus | Function | | Typescript:`(context: { value: CascaderValue<CascaderOption>; e: FocusEvent }) => void`<br/> | N
Expand Down
3 changes: 2 additions & 1 deletion src/cascader/cascader.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
名称 | 类型 | 默认值 | 说明 | 必传
-- | -- | -- | -- | --
autofocus | Boolean | - | 自动聚焦 | N
borderless | Boolean | false | 是否为无边框模式 | N
checkProps | Object | - | 参考 checkbox 组件 API。TS 类型:`CheckboxProps`,[Checkbox API Documents](./checkbox?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/cascader/type.ts) | N
checkStrictly | Boolean | false | 父子节点选中状态不再关联,可各自选中或取消 | N
clearable | Boolean | false | 是否支持清空选项 | N
Expand All @@ -15,7 +16,7 @@ empty | String / Slot / Function | - | 无匹配选项时的内容,默认全
filter | Function | - | 自定义过滤方法,用于对现有数据进行搜索过滤,判断是否过滤某一项数据。TS 类型:`(filterWords: string, node: TreeNodeModel) => boolean \| Promise<boolean>` | N
filterable | Boolean | false | 是否可搜索 | N
inputProps | Object | - | 透传 Input 输入框组件的全部属性。TS 类型:`InputProps`,[Input API Documents](./input?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/cascader/type.ts) | N
keys | Object | - | 用来定义 value / label / children 在 `options` 中对应的字段别名。TS 类型:`CascaderKeysType` `interface CascaderKeysType { value?: string; label?: string; children?: string \| boolean }`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts)。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/cascader/type.ts) | N
keys | Object | - | 用来定义 value / label / children / disabled 在 `options` 中对应的字段别名。TS 类型:`CascaderKeysType` `interface CascaderKeysType { value?: string; label?: string; children?: string; disabled?: string }`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts)。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/cascader/type.ts) | N
label | String / Slot / Function | - | 左侧文本。TS 类型:`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
lazy | Boolean | true | 延迟加载 children 为 true 的子节点,即使 expandAll 被设置为 true,也同样延迟加载 | N
load | Function | - | 加载子树数据的方法(仅当节点 children 为 true 时生效)。TS 类型:`(node: TreeNodeModel<CascaderOption>) => Promise<Array<CascaderOption>>` | N
Expand Down
4 changes: 3 additions & 1 deletion src/cascader/props.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,8 @@ import { PropType } from 'vue';
export default {
/** 自动聚焦 */
autofocus: Boolean,
/** 是否为无边框模式 */
borderless: Boolean,
/** 参考 checkbox 组件 API */
checkProps: {
type: Object as PropType<TdCascaderProps['checkProps']>,
Expand Down Expand Up @@ -38,7 +40,7 @@ export default {
inputProps: {
type: Object as PropType<TdCascaderProps['inputProps']>,
},
/** 用来定义 value / label / children 在 `options` 中对应的字段别名 */
/** 用来定义 value / label / children / disabled 在 `options` 中对应的字段别名 */
keys: {
type: Object as PropType<TdCascaderProps['keys']>,
},
Expand Down
10 changes: 8 additions & 2 deletions src/cascader/type.ts
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,11 @@ export interface TdCascaderProps<CascaderOption extends TreeOptionData = TreeOpt
* 自动聚焦
*/
autofocus?: boolean;
/**
* 是否为无边框模式
* @default false
*/
borderless?: boolean;
/**
* 参考 checkbox 组件 API
*/
Expand Down Expand Up @@ -59,7 +64,7 @@ export interface TdCascaderProps<CascaderOption extends TreeOptionData = TreeOpt
*/
inputProps?: InputProps;
/**
* 用来定义 value / label / children 在 `options` 中对应的字段别名
* 用来定义 value / label / children / disabled 在 `options` 中对应的字段别名
*/
keys?: CascaderKeysType;
/**
Expand Down Expand Up @@ -234,7 +239,8 @@ export interface TdCascaderProps<CascaderOption extends TreeOptionData = TreeOpt
export interface CascaderKeysType {
value?: string;
label?: string;
children?: string | boolean;
children?: string;
disabled?: string;
}

export type CascaderValue<T extends TreeOptionData = TreeOptionData> = string | number | T | Array<CascaderValue<T>>;
Expand Down
1 change: 1 addition & 0 deletions src/common.ts
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,7 @@ export type CSSSelector = string;
export interface KeysType {
value?: string;
label?: string;
disabled?: string;
}
PengYYYYY marked this conversation as resolved.
Show resolved Hide resolved

export interface HTMLElementAttributes {
Expand Down
3 changes: 2 additions & 1 deletion src/select/hooks/useSelectOptions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -22,12 +22,13 @@ export const useSelectOptions = (props: TdSelectProps, keys: Ref<SelectKeysType>
const innerOptions: UniOption[] =
props.options?.map((option) => {
const getFormatOption = (option: TdOptionProps) => {
const { value, label } = keys.value;
const { value, label, disabled } = keys.value;
const res = {
...option,
index: dynamicIndex,
label: get(option, label),
value: get(option, value),
disabled: get(option, disabled),
};
dynamicIndex++;
return res;
Expand Down
2 changes: 1 addition & 1 deletion src/select/props.ts
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ export default {
defaultInputValue: {
type: [String, Number] as PropType<TdSelectProps['defaultInputValue']>,
},
/** 用来定义 value / label 在 `options` 中对应的字段别名 */
/** 用来定义 value / label / disabled 在 `options` 中对应的字段别名 */
keys: {
type: Object as PropType<TdSelectProps['keys']>,
},
Expand Down
14 changes: 7 additions & 7 deletions src/select/select.en-US.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ filterable | Boolean | false | \- | N
inputProps | Object | - | Typescript:`InputProps`,[Input API Documents](./input?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/select/type.ts) | N
inputValue | String / Number | - | input value。`v-model:inputValue` is supported。Typescript:`InputValue`,[Input API Documents](./input?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/select/type.ts) | N
defaultInputValue | String / Number | - | input value。uncontrolled property。Typescript:`InputValue`,[Input API Documents](./input?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/select/type.ts) | N
keys | Object | - | Typescript:`SelectKeysType` `interface SelectKeysType { value?: string; label?: string }`。[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/select/type.ts) | N
keys | Object | - | Typescript:`SelectKeysType` `interface SelectKeysType { value?: string; label?: string; disabled?: string }`。[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/select/type.ts) | 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
loading | Boolean | false | \- | N
loadingText | String / Slot / Function | - | Typescript:`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
Expand All @@ -38,8 +38,8 @@ reserveKeyword | Boolean | false | \- | N
scroll | Object | - | lazy load and virtual scroll。Typescript:`InfinityScroll`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
selectInputProps | Object | - | Typescript:`SelectInputProps`,[SelectInput API Documents](./select-input?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/select/type.ts) | N
showArrow | Boolean | true | \- | N
size | String | medium | optionssmall/medium/large。Typescript:`SizeEnum`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
status | String | default | optionsdefault/success/warning/error | 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
status | String | default | options: default/success/warning/error | N
suffix | String / Slot / Function | - | Typescript:`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
suffixIcon | Slot / Function | - | Typescript:`TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
tagInputProps | Object | - | Typescript:`TagInputProps`,[TagInput API Documents](./tag-input?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/select/type.ts) | N
Expand All @@ -48,9 +48,9 @@ tips | String / Slot / Function | - | Typescript:`string \| TNode`。[see more
value | String / Number / Boolean / Object / Array | - | `v-model` and `v-model:value` is supported。Typescript:`SelectValue` `type SelectValue<T extends SelectOption = SelectOption> = string \| number \| boolean \| T \| Array<SelectValue<T>>`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/select/type.ts) | N
defaultValue | String / Number / Boolean / Object / Array | - | uncontrolled property。Typescript:`SelectValue` `type SelectValue<T extends SelectOption = SelectOption> = string \| number \| boolean \| T \| Array<SelectValue<T>>`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/select/type.ts) | N
valueDisplay | String / Slot / Function | - | `MouseEvent<SVGElement>`。Typescript:`string \| TNode<{ value: SelectValue; onClose: (index: number) => void; displayValue?: SelectValue }>`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
valueType | String | value | optionsvalue/object | N
valueType | String | value | options: value/object | N
onBlur | Function | | Typescript:`(context: { value: SelectValue; e: FocusEvent \| KeyboardEvent }) => void`<br/> | N
onChange | Function | | Typescript:`(value: SelectValue, context: { option?: T, selectedOptions: T[], trigger: SelectValueChangeTrigger; e?: MouseEvent \| KeyboardEvent }) => void`<br/>[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/select/type.ts)。<br/>`type SelectValueChangeTrigger = 'clear' \| 'tag-remove' \| 'backspace' \| 'check' \| 'uncheck'`<br/> | N
onChange | Function | | Typescript:`(value: SelectValue, context: { option?: T, selectedOptions: T[], trigger: SelectValueChangeTrigger; e?: MouseEvent \| KeyboardEvent }) => void`<br/>[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/select/type.ts)。<br/>`type SelectValueChangeTrigger = 'clear' \| 'tag-remove' \| 'backspace' \| 'check' \| 'uncheck' \| 'default'`<br/> | N
onClear | Function | | Typescript:`(context: { e: MouseEvent }) => void`<br/> | N
onCreate | Function | | Typescript:`(value: string \| number) => void`<br/> | N
onEnter | Function | | Typescript:`(context: { inputValue: string; e: KeyboardEvent; value: SelectValue }) => void`<br/> | N
Expand All @@ -65,7 +65,7 @@ onSearch | Function | | Typescript:`(filterWords: string, context: { e: Keybo
name | params | description
-- | -- | --
blur | `(context: { value: SelectValue; e: FocusEvent \| KeyboardEvent })` | \-
change | `(value: SelectValue, context: { option?: T, selectedOptions: T[], trigger: SelectValueChangeTrigger; e?: MouseEvent \| KeyboardEvent })` | [see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/select/type.ts)。<br/>`type SelectValueChangeTrigger = 'clear' \| 'tag-remove' \| 'backspace' \| 'check' \| 'uncheck'`<br/>
change | `(value: SelectValue, context: { option?: T, selectedOptions: T[], trigger: SelectValueChangeTrigger; e?: MouseEvent \| KeyboardEvent })` | [see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/select/type.ts)。<br/>`type SelectValueChangeTrigger = 'clear' \| 'tag-remove' \| 'backspace' \| 'check' \| 'uncheck' \| 'default'`<br/>
clear | `(context: { e: MouseEvent })` | \-
create | `(value: string \| number)` | \-
enter | `(context: { inputValue: string; e: KeyboardEvent; value: SelectValue })` | \-
Expand Down Expand Up @@ -102,4 +102,4 @@ bufferSize | Number | 20 | \- | N
isFixedRowHeight | Boolean | false | \- | N
rowHeight | Number | - | \- | N
threshold | Number | 100 | \- | N
type | String | - | required。optionslazy/virtual | Y
type | String | - | required。options: lazy/virtual | Y
Loading
Loading