From b6928951c3cd9b1c836cda2a90c7f06b147d8c37 Mon Sep 17 00:00:00 2001 From: pengYYY Date: Wed, 16 Aug 2023 15:59:20 +0800 Subject: [PATCH] fix: select KeysType lint --- src/select/base/Option.tsx | 6 +++--- src/select/util/helper.ts | 19 ++++++++----------- src/transfer/transfer.en-US.md | 9 ++++----- src/transfer/transfer.md | 4 ++-- src/transfer/type.ts | 5 ++--- src/tree-select/tree-select.md | 2 +- src/tree-select/type.ts | 6 +++--- 7 files changed, 23 insertions(+), 28 deletions(-) diff --git a/src/select/base/Option.tsx b/src/select/base/Option.tsx index f0eb0f036f..3656418422 100644 --- a/src/select/base/Option.tsx +++ b/src/select/base/Option.tsx @@ -7,8 +7,8 @@ import get from 'lodash/get'; import useConfig from '../../hooks/useConfig'; import useDomRefCallback from '../../hooks/useDomRefCallback'; import useRipple from '../../_util/useRipple'; -import { StyledProps } from '../../common'; -import { SelectValue, TdOptionProps, TdSelectProps, SelectKeysType, SelectOption } from '../type'; +import { StyledProps, KeysType } from '../../common'; +import { SelectValue, TdOptionProps, TdSelectProps, SelectOption } from '../type'; /** * Option 组件属性 @@ -30,7 +30,7 @@ export interface SelectOptionProps ) => void; onCheckAllChange?: (checkAll: boolean, e: React.MouseEvent) => void; restData?: Record; - keys?: SelectKeysType; + keys?: KeysType; optionLength?: number; isVirtual?: boolean; onRowMounted?: (rowData: { ref: HTMLElement; data: SelectOption }) => void; diff --git a/src/select/util/helper.ts b/src/select/util/helper.ts index 0beb1940e7..a13f9ef069 100644 --- a/src/select/util/helper.ts +++ b/src/select/util/helper.ts @@ -4,7 +4,8 @@ import get from 'lodash/get'; import OptionGroup from '../base/OptionGroup'; import Option from '../base/Option'; -import { SelectValue, TdOptionProps, SelectKeysType, TdSelectProps } from '../type'; +import { SelectValue, TdOptionProps, TdSelectProps } from '../type'; +import { KeysType } from '../../common'; type SelectLabeledValue = Required>; @@ -12,7 +13,7 @@ type ValueToOption = { [value: string | number]: TdOptionProps; }; -function setValueToOptionFormOptionDom(dom: ReactElement, valueToOption: ValueToOption, keys: SelectKeysType) { +function setValueToOptionFormOptionDom(dom: ReactElement, valueToOption: ValueToOption, keys: KeysType) { const { value, label, children } = dom.props; // eslint-disable-next-line no-param-reassign valueToOption[value] = { @@ -22,11 +23,7 @@ function setValueToOptionFormOptionDom(dom: ReactElement, valueToOption: ValueTo } // 获取 value => option，用于快速基于 value 找到对应的 option -export const getValueToOption = ( - children: ReactElement, - options: TdOptionProps[], - keys: SelectKeysType, -): ValueToOption => { +export const getValueToOption = (children: ReactElement, options: TdOptionProps[], keys: KeysType): ValueToOption => { const valueToOption = {}; // options 优先级高于 children @@ -80,7 +77,7 @@ export const getLabel = ( children: ReactElement, value: SelectValue, options: TdOptionProps[], - keys: SelectKeysType, + keys: KeysType, ) => { let selectedLabel = ''; // 处理带 options 属性的情况 @@ -144,7 +141,7 @@ export const getLabel = ( return selectedLabel; }; -export const getMultipleTags = (values: SelectValue[], keys: SelectKeysType) => { +export const getMultipleTags = (values: SelectValue[], keys: KeysType) => { const tags = values.map((item) => ({ label: get(item, keys?.label || 'label') || item.toString(), value: get(item, keys?.value || 'value') || item, @@ -157,7 +154,7 @@ export const getSelectValueArr = ( activeValue: SelectValue, selected?: boolean, valueType?: TdSelectProps['valueType'], - keys?: SelectKeysType, + keys?: KeysType, objVal?: SelectValue, ) => { // eslint-disable-next-line no-param-reassign @@ -190,7 +187,7 @@ export const getSelectedOptions = ( value: SelectValue, multiple: TdSelectProps['multiple'], valueType: TdSelectProps['valueType'], - keys: SelectKeysType, + keys: KeysType, tmpPropOptions: Array, ) => { const isObjectType = valueType === 'object'; diff --git a/src/transfer/transfer.en-US.md b/src/transfer/transfer.en-US.md index 0f036b06ad..18195f2c45 100644 --- a/src/transfer/transfer.en-US.md +++ b/src/transfer/transfer.en-US.md @@ -1,7 +1,6 @@ :: BASE_DOC :: ## API - ### Transfer Props name | type | default | description | required @@ -12,16 +11,16 @@ checkboxProps | Object | - | Typescript：`CheckboxProps`，[Checkbox API Docume checked | Array | [] | Typescript：`Array` | N defaultChecked | Array | [] | uncontrolled property。Typescript：`Array` | N data | Array | [] | Typescript：`Array` | N -direction | String | both | options：left/right/both | N -disabled | Boolean / Array | false | Typescript：`boolean \| Array` | N +direction | String | both | options: left/right/both | N +disabled | Boolean / Array | - | Typescript：`boolean \| Array` | N empty | TNode | '' | Typescript：`EmptyType \| Array \| TNode` `type EmptyType = string \| TNode `。[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/transfer/type.ts) | N footer | TNode | - | Typescript：`Array \| TNode<{ type: TransferListType }>`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N -keys | Object | - | Typescript：`KeysType`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N +keys | Object | - | alias field name in data。Typescript：`KeysType`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N operation | TNode | - | Typescript：`Array \| TNode<{ direction: 'left' \| 'right' }>`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N pagination | Object / Array | - | Typescript：`PaginationProps \| Array`，[Pagination API Documents](./pagination?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/transfer/type.ts) | N search | Boolean / Object / Array | false | Typescript：`SearchOption \| Array` `type SearchOption = boolean \| InputProps`，[Input API Documents](./input?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/transfer/type.ts) | N showCheckAll | Boolean / Array | true | Typescript：`boolean \| Array` | N -targetSort | String | original | options：original/push/unshift | N +targetSort | String | original | options: original/push/unshift | N title | TNode | [] | Typescript：`Array \| TNode<{ type: TransferListType }>` `type TitleType = string \| TNode` `type TransferListType = 'source' \| 'target'`。[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/transfer/type.ts) | N transferItem | TElement | - | Typescript：`TNode>` `interface TransferItem { data: T; index: number; type: TransferListType}`。[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/transfer/type.ts) | N tree | TElement | 传入 Tree 组件定义树形结构 | Typescript：`(tree: TreeProps) => TNode`，[Tree API Documents](./tree?tab=api)。[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/transfer/type.ts) | N diff --git a/src/transfer/transfer.md b/src/transfer/transfer.md index 7ac2744abf..125c5e6722 100644 --- a/src/transfer/transfer.md +++ b/src/transfer/transfer.md @@ -12,10 +12,10 @@ checked | Array | [] | 数据列表选中项。TS 类型：`Array defaultChecked | Array | [] | 数据列表选中项。非受控属性。TS 类型：`Array` | N data | Array | [] | 全量数据。TS 类型：`Array` | N direction | String | both | 穿梭框可操作方向。可选项：left/right/both | N -disabled | Boolean / Array | false | 禁用全部操作：搜索、选中、移动、分页等。[源列表, 目标列表]，示例：[true, false] 或者 true。TS 类型：`boolean \| Array` | N +disabled | Boolean / Array | - | 禁用全部操作：搜索、选中、移动、分页等。[源列表, 目标列表]，示例：[true, false] 或者 true。TS 类型：`boolean \| Array` | N empty | TNode | '' | 列表为空时呈现的内容。值类型为数组，则表示分别控制源列表和目标列表数据为空的呈现内容。TS 类型：`EmptyType \| Array \| TNode` `type EmptyType = string \| TNode `。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/transfer/type.ts) | N footer | TNode | - | 穿梭框底部内容。TS 类型：`Array \| TNode<{ type: TransferListType }>`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N -keys | Object | - | 用来定义选项文本和选项值字段，示例：`{ label: 'text', value: 'id' }`，表示选项文本取 `text` 字段，选项值取 `id` 字段。TS 类型：`KeysType`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N +keys | Object | - | 用来定义 value / label / disabled 在 `data` 中对应的字段别名，示例：`{ label: 'text', value: 'id' }`，表示选项文本取 `text` 字段，选项值取 `id` 字段。TS 类型：`KeysType`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N operation | TNode | - | 方向操作按钮。默认显示组件内置操作图标。自定义操作图标示例：['向左', '向右'] 或者 `[() => , () => ]` 或者 `(h, direction) => direction === 'left' ? '《' : '》'`。TS 类型：`Array \| TNode<{ direction: 'left' \| 'right' }>`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N pagination | Object / Array | - | 分页配置，值为空则不显示。具体 API 参考分页组件。值类型为数组，表示可分别控制源列表和目标列表分页组件。TS 类型：`PaginationProps \| Array`，[Pagination API Documents](./pagination?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/transfer/type.ts) | N search | Boolean / Object / Array | false | 搜索框配置，值为 false 表示不显示搜索框；值为 true 表示显示默认搜索框；值类型为对象，用于透传 Props 到 Input 组件；值类型为数组，则分别表示控制两侧搜索框。TS 类型：`SearchOption \| Array` `type SearchOption = boolean \| InputProps`，[Input API Documents](./input?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/transfer/type.ts) | N diff --git a/src/transfer/type.ts b/src/transfer/type.ts index f1d23affdf..3cca353354 100644 --- a/src/transfer/type.ts +++ b/src/transfer/type.ts @@ -38,7 +38,6 @@ export interface TdTransferProps { direction?: 'left' | 'right' | 'both'; /** * 禁用全部操作：搜索、选中、移动、分页等。[源列表, 目标列表]，示例：[true, false] 或者 true - * @default false */ disabled?: boolean | Array; /** @@ -51,7 +50,7 @@ export interface TdTransferProps { */ footer?: Array | TNode<{ type: TransferListType }>; /** - * 用来定义选项文本和选项值字段，示例：`{ label: 'text', value: 'id' }`，表示选项文本取 `text` 字段，选项值取 `id` 字段 + * 用来定义 value / label / disabled 在 `data` 中对应的字段别名，示例：`{ label: 'text', value: 'id' }`，表示选项文本取 `text` 字段，选项值取 `id` 字段 */ keys?: KeysType; /** @@ -153,7 +152,7 @@ export interface SearchContext { query: string; type: TransferListType; trigger: 'input' | 'enter'; - e: FormEvent | KeyboardEvent; + e: FormEvent | KeyboardEvent; } export type DataOption = { label?: string; value?: TransferValue; disabled?: boolean } & Record; diff --git a/src/tree-select/tree-select.md b/src/tree-select/tree-select.md index 3c7c92bb55..06017430e1 100644 --- a/src/tree-select/tree-select.md +++ b/src/tree-select/tree-select.md @@ -20,7 +20,7 @@ filterable | Boolean | false | 是否可搜索 | N inputProps | Object | - | 透传给 输入框 Input 组件的全部属性。TS 类型：`InputProps`，[Input API Documents](./input?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/tree-select/type.ts) | N inputValue | String / Number | - | 输入框的值。TS 类型：`InputValue`，[Input API Documents](./input?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/tree-select/type.ts) | N defaultInputValue | String / Number | - | 输入框的值。非受控属性。TS 类型：`InputValue`，[Input API Documents](./input?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/tree-select/type.ts) | N -keys | Object | - | 用来定义 `value / label / disabled / children` 在 `data` 数据中对应的字段别名，示例：`{ value: 'key', label: 'name', children: 'list' }`。TS 类型：`TreeKeysType`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N +keys | Object | - | 用来定义 `value / label / disabled / children` 在 `data` 数据中对应的字段别名，示例：`{ value: 'key', label 'name', children: 'list' }`。TS 类型：`TreeKeysType`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N label | TNode | - | 左侧文本。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N loading | Boolean | false | 是否正在加载数据 | N loadingText | TNode | - | 远程加载时显示的文字，支持自定义。如加上超链接。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N diff --git a/src/tree-select/type.ts b/src/tree-select/type.ts index 2cb9268c2e..058c4ceb49 100644 --- a/src/tree-select/type.ts +++ b/src/tree-select/type.ts @@ -9,9 +9,9 @@ import { InputValue } from '../input'; import { PopupProps } from '../popup'; import { SelectInputProps, SelectInputBlurContext, SelectInputValueChangeContext } from '../select-input'; import { TagProps } from '../tag'; -import { TreeProps, TreeNodeModel, TreeKeysType } from '../tree'; +import { TreeProps, TreeNodeModel } from '../tree'; import { PopupTriggerEvent, PopupTriggerSource } from '../popup'; -import { TNode, TElement, TreeOptionData } from '../common'; +import { TNode, TElement, TreeOptionData, TreeKeysType } from '../common'; import { MouseEvent, KeyboardEvent, FocusEvent } from 'react'; export interface TdTreeSelectProps< @@ -77,7 +77,7 @@ export interface TdTreeSelectProps< */ defaultInputValue?: InputValue; /** - * 用来定义 `value / label / disabled / children` 在 `data` 数据中对应的字段别名，示例：`{ value: 'key', label: 'name', children: 'list' }` + * 用来定义 `value / label / disabled / children` 在 `data` 数据中对应的字段别名，示例：`{ value: 'key', label 'name', children: 'list' }` */ keys?: TreeKeysType; /**