Skip to content

Commit

Permalink
feat: API update (#479)
Browse files Browse the repository at this point in the history
  • Loading branch information
@uyarn
uyarn authored Nov 27, 2024
1 parent d109873 commit 6497234
Show file tree
Hide file tree
Showing 11 changed files with 80 additions and 65 deletions.
Binary file modified db/TDesign.db
View file
Binary file not shown.
10 changes: 5 additions & 5 deletions packages/products/tdesign-react/src/date-picker/date-picker.en-US.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,14 +34,14 @@ status | String | default | options: default/success/warning/error | N
suffixIcon | TElement | - | Typescript：`TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
timePickerProps | Object | - | Typescript：`TimePickerProps`，[TimePicker API Documents](./time-picker?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/date-picker/type.ts) | N
tips | TNode | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
value | String / Number / Array / Date | '' | Typescript：`DateValue` `type DateValue = string \| number \| Date \| Array<string \| number \| Date>`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/date-picker/type.ts) | N
defaultValue | String / Number / Array / Date | '' | uncontrolled property。Typescript：`DateValue` `type DateValue = string \| number \| Date \| Array<string \| number \| Date>`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/date-picker/type.ts) | N
value | String / Number / Array / Date | '' | Typescript：`DateValue \| DateMultipleValue` ` type DateValue = string \| number \| Date ` ` type DateMultipleValue = Array<DateValue> `。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/date-picker/type.ts) | N
defaultValue | String / Number / Array / Date | '' | uncontrolled property。Typescript：`DateValue \| DateMultipleValue` ` type DateValue = string \| number \| Date ` ` type DateMultipleValue = Array<DateValue> `。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/date-picker/type.ts) | N
valueDisplay | TNode | - | `MouseEvent<SVGElement>`。Typescript：`string \| TNode<{ value: DateValue; displayValue?: DateValue }>`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
valueType | String | - | Typescript：`DatePickerValueType` `type DatePickerValueType = 'time-stamp' \| 'Date' \| 'YYYY' \| 'YYYY-MM' \| 'YYYY-MM-DD' \| 'YYYY-MM-DD HH' \| 'YYYY-MM-DD HH:mm' \| 'YYYY-MM-DD HH:mm:ss' \| 'YYYY-MM-DD HH:mm:ss:SSS'` `type ValueTypeEnum = DatePickerValueType`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/date-picker/type.ts) | N
onBlur | Function | | Typescript：`(context: { value: DateValue; e: FocusEvent }) => void`<br/> | N
onChange | Function | | Typescript：`(value: DateValue, context: { dayjsValue?: Dayjs, trigger?: DatePickerTriggerSource }) => void`<br/>[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/date-picker/type.ts)。<br/>`import { Dayjs } from 'dayjs'`<br/><br/>`type DatePickerTriggerSource = 'confirm' \| 'pick' \| 'enter' \| 'preset' \| 'clear'`<br/> | N
onBlur | Function | | Typescript：`(context: { value: DateValue \| DateMultipleValue; e: FocusEvent }) => void`<br/> | N
onChange | Function | | Typescript：`(value: DateValue\| DateMultipleValue, context: { dayjsValue?: Dayjs, trigger?: DatePickerTriggerSource }) => void`<br/>[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/date-picker/type.ts)。<br/>`import { Dayjs } from 'dayjs'`<br/><br/>`type DatePickerTriggerSource = 'confirm' \| 'pick' \| 'enter' \| 'preset' \| 'clear'`<br/> | N
onConfirm | Function | | Typescript：`(context: { date: Date, e: MouseEvent }) => void`<br/> | N
onFocus | Function | | Typescript：`(context: { value: DateValue; e: FocusEvent }) => void`<br/> | N
onFocus | Function | | Typescript：`(context: { value: DateValue \| DateMultipleValue; e: FocusEvent }) => void`<br/> | N
onPick | Function | | Typescript：`(value: DateValue) => void`<br/> | N
onPresetClick | Function | | Typescript：`(context: { preset: PresetDate, e: MouseEvent }) => void`<br/> | N

Expand Down
10 changes: 5 additions & 5 deletions packages/products/tdesign-react/src/date-picker/date-picker.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,14 +34,14 @@ status | String | default | 输入框状态。可选项：default/success/warnin
suffixIcon | TElement | - | 用于自定义组件后置图标。TS 类型：`TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
timePickerProps | Object | - | 透传 TimePicker 组件属性。TS 类型：`TimePickerProps`，[TimePicker API Documents](./time-picker?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/date-picker/type.ts) | N
tips | TNode | - | 输入框下方提示文本，会根据不同的 `status` 呈现不同的样式。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
value | String / Number / Array / Date | '' | 选中值。TS 类型：`DateValue` `type DateValue = string \| number \| Date \| Array<string \| number \| Date>`。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/date-picker/type.ts) | N
defaultValue | String / Number / Array / Date | '' | 选中值。非受控属性。TS 类型：`DateValue` `type DateValue = string \| number \| Date \| Array<string \| number \| Date>`。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/date-picker/type.ts) | N
value | String / Number / Array / Date | '' | 选中值。TS 类型：`DateValue \| DateMultipleValue` ` type DateValue = string \| number \| Date ` ` type DateMultipleValue = Array<DateValue> `。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/date-picker/type.ts) | N
defaultValue | String / Number / Array / Date | '' | 选中值。非受控属性。TS 类型：`DateValue \| DateMultipleValue` ` type DateValue = string \| number \| Date ` ` type DateMultipleValue = Array<DateValue> `。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/date-picker/type.ts) | N
valueDisplay | TNode | - | 自定义选中项呈现的内容。TS 类型：`string \| TNode<{ value: DateValue; displayValue?: DateValue }>`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
valueType | String | - | 用于格式化日期的值，仅支持部分格式，时间戳、日期等。⚠️ `YYYYMMDD` 这种格式不支持，请勿使用，如果希望支持可以给 `dayjs` 提个 PR。注意和 `format` 的区别，`format` 仅用于处理日期在页面中呈现的格式。`ValueTypeEnum` 即将废弃，请更为使用 `DatePickerValueType`。TS 类型：`DatePickerValueType` `type DatePickerValueType = 'time-stamp' \| 'Date' \| 'YYYY' \| 'YYYY-MM' \| 'YYYY-MM-DD' \| 'YYYY-MM-DD HH' \| 'YYYY-MM-DD HH:mm' \| 'YYYY-MM-DD HH:mm:ss' \| 'YYYY-MM-DD HH:mm:ss:SSS'` `type ValueTypeEnum = DatePickerValueType`。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/date-picker/type.ts) | N
onBlur | Function | | TS 类型：`(context: { value: DateValue; e: FocusEvent }) => void`<br/>当输入框失去焦点时触发 | N
onChange | Function | | TS 类型：`(value: DateValue, context: { dayjsValue?: Dayjs, trigger?: DatePickerTriggerSource }) => void`<br/>选中值发生变化时触发。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/date-picker/type.ts)。<br/>`import { Dayjs } from 'dayjs'`<br/><br/>`type DatePickerTriggerSource = 'confirm' \| 'pick' \| 'enter' \| 'preset' \| 'clear'`<br/> | N
onBlur | Function | | TS 类型：`(context: { value: DateValue \| DateMultipleValue; e: FocusEvent }) => void`<br/>当输入框失去焦点时触发 | N
onChange | Function | | TS 类型：`(value: DateValue\| DateMultipleValue, context: { dayjsValue?: Dayjs, trigger?: DatePickerTriggerSource }) => void`<br/>选中值发生变化时触发。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/date-picker/type.ts)。<br/>`import { Dayjs } from 'dayjs'`<br/><br/>`type DatePickerTriggerSource = 'confirm' \| 'pick' \| 'enter' \| 'preset' \| 'clear'`<br/> | N
onConfirm | Function | | TS 类型：`(context: { date: Date, e: MouseEvent }) => void`<br/>如果存在“确定”按钮，则点击“确定”按钮时触发 | N
onFocus | Function | | TS 类型：`(context: { value: DateValue; e: FocusEvent }) => void`<br/>输入框获得焦点时触发 | N
onFocus | Function | | TS 类型：`(context: { value: DateValue \| DateMultipleValue; e: FocusEvent }) => void`<br/>输入框获得焦点时触发 | N
onPick | Function | | TS 类型：`(value: DateValue) => void`<br/>面板选中值后触发 | N
onPresetClick | Function | | TS 类型：`(context: { preset: PresetDate, e: MouseEvent }) => void`<br/>点击预设按钮后触发 | N

Expand Down
17 changes: 11 additions & 6 deletions packages/products/tdesign-react/src/date-picker/type.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -135,12 +135,12 @@ export interface TdDatePickerProps {
* 选中值
* @default ''
*/
value?: DateValue;
value?: DateValue | DateMultipleValue;
/**
* 选中值，非受控属性
* @default ''
*/
defaultValue?: DateValue;
defaultValue?: DateValue | DateMultipleValue;
/**
* 自定义选中项呈现的内容
*/
Expand All @@ -153,19 +153,22 @@ export interface TdDatePickerProps {
/**
* 当输入框失去焦点时触发
*/
onBlur?: (context: { value: DateValue; e: FocusEvent<HTMLInputElement> }) => void;
onBlur?: (context: { value: DateValue | DateMultipleValue; e: FocusEvent<HTMLInputElement> }) => void;
/**
* 选中值发生变化时触发
*/
onChange?: (value: DateValue, context: { dayjsValue?: Dayjs; trigger?: DatePickerTriggerSource }) => void;
onChange?: (
value: DateValue | DateMultipleValue,
context: { dayjsValue?: Dayjs; trigger?: DatePickerTriggerSource },
) => void;
/**
* 如果存在“确定”按钮，则点击“确定”按钮时触发
*/
onConfirm?: (context: { date: Date; e: MouseEvent<HTMLDivElement> }) => void;
/**
* 输入框获得焦点时触发
*/
onFocus?: (context: { value: DateValue; e: FocusEvent<HTMLInputElement> }) => void;
onFocus?: (context: { value: DateValue | DateMultipleValue; e: FocusEvent<HTMLInputElement> }) => void;
/**
* 面板选中值后触发
*/
Expand Down Expand Up @@ -530,7 +533,9 @@ export interface PresetDate {
[name: string]: DateValue | (() => DateValue);
}

export type DateValue = string | number | Date | Array<string | number | Date>;
export type DateValue = string | number | Date;

export type DateMultipleValue = Array<DateValue>;

export type DatePickerValueType =
| 'time-stamp'
Expand Down
16 changes: 8 additions & 8 deletions packages/products/tdesign-vue-next/src/date-picker/date-picker.en-US.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,25 +32,25 @@ status | String | default | options: default/success/warning/error | N
suffixIcon | Slot / Function | - | Typescript：`TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
timePickerProps | Object | - | Typescript：`TimePickerProps`，[TimePicker API Documents](./time-picker?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/date-picker/type.ts) | N
tips | String / Slot / Function | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
value | String / Number / Array / Date | '' | `v-model` and `v-model:value` is supported。Typescript：`DateValue` `type DateValue = string \| number \| Date \| Array<string \| number \| Date>`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/date-picker/type.ts) | N
defaultValue | String / Number / Array / Date | '' | uncontrolled property。Typescript：`DateValue` `type DateValue = string \| number \| Date \| Array<string \| number \| Date>`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/date-picker/type.ts) | N
value | String / Number / Array / Date | '' | `v-model` and `v-model:value` is supported。Typescript：`DateValue \| DateMultipleValue` ` type DateValue = string \| number \| Date ` ` type DateMultipleValue = Array<DateValue> `。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/date-picker/type.ts) | N
defaultValue | String / Number / Array / Date | '' | uncontrolled property。Typescript：`DateValue \| DateMultipleValue` ` type DateValue = string \| number \| Date ` ` type DateMultipleValue = Array<DateValue> `。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/date-picker/type.ts) | N
valueDisplay | String / Slot / Function | - | `MouseEvent<SVGElement>`。Typescript：`string \| TNode<{ value: DateValue; displayValue?: DateValue }>`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
valueType | String | - | Typescript：`DatePickerValueType` `type DatePickerValueType = 'time-stamp' \| 'Date' \| 'YYYY' \| 'YYYY-MM' \| 'YYYY-MM-DD' \| 'YYYY-MM-DD HH' \| 'YYYY-MM-DD HH:mm' \| 'YYYY-MM-DD HH:mm:ss' \| 'YYYY-MM-DD HH:mm:ss:SSS'` `type ValueTypeEnum = DatePickerValueType`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/date-picker/type.ts) | N
onBlur | Function | | Typescript：`(context: { value: DateValue; e: FocusEvent }) => void`<br/> | N
onChange | Function | | Typescript：`(value: DateValue, context: { dayjsValue?: Dayjs, trigger?: DatePickerTriggerSource }) => void`<br/>[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/date-picker/type.ts)。<br/>`import { Dayjs } from 'dayjs'`<br/><br/>`type DatePickerTriggerSource = 'confirm' \| 'pick' \| 'enter' \| 'preset' \| 'clear'`<br/> | N
onBlur | Function | | Typescript：`(context: { value: DateValue \| DateMultipleValue; e: FocusEvent }) => void`<br/> | N
onChange | Function | | Typescript：`(value: DateValue\| DateMultipleValue, context: { dayjsValue?: Dayjs, trigger?: DatePickerTriggerSource }) => void`<br/>[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/date-picker/type.ts)。<br/>`import { Dayjs } from 'dayjs'`<br/><br/>`type DatePickerTriggerSource = 'confirm' \| 'pick' \| 'enter' \| 'preset' \| 'clear'`<br/> | N
onConfirm | Function | | Typescript：`(context: { date: Date, e: MouseEvent }) => void`<br/> | N
onFocus | Function | | Typescript：`(context: { value: DateValue; e: FocusEvent }) => void`<br/> | N
onFocus | Function | | Typescript：`(context: { value: DateValue \| DateMultipleValue; e: FocusEvent }) => void`<br/> | N
onPick | Function | | Typescript：`(value: DateValue) => void`<br/> | N
onPresetClick | Function | | Typescript：`(context: { preset: PresetDate, e: MouseEvent }) => void`<br/> | N

### DatePicker Events

name | params | description
-- | -- | --
blur | `(context: { value: DateValue; e: FocusEvent })` | \-
change | `(value: DateValue, context: { dayjsValue?: Dayjs, trigger?: DatePickerTriggerSource })` | [see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/date-picker/type.ts)。<br/>`import { Dayjs } from 'dayjs'`<br/><br/>`type DatePickerTriggerSource = 'confirm' \| 'pick' \| 'enter' \| 'preset' \| 'clear'`<br/>
blur | `(context: { value: DateValue \| DateMultipleValue; e: FocusEvent })` | \-
change | `(value: DateValue\| DateMultipleValue, context: { dayjsValue?: Dayjs, trigger?: DatePickerTriggerSource })` | [see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/date-picker/type.ts)。<br/>`import { Dayjs } from 'dayjs'`<br/><br/>`type DatePickerTriggerSource = 'confirm' \| 'pick' \| 'enter' \| 'preset' \| 'clear'`<br/>
confirm | `(context: { date: Date, e: MouseEvent })` | \-
focus | `(context: { value: DateValue; e: FocusEvent })` | \-
focus | `(context: { value: DateValue \| DateMultipleValue; e: FocusEvent })` | \-
pick | `(value: DateValue)` | \-
preset-click | `(context: { preset: PresetDate, e: MouseEvent })` | \-

Expand Down
Loading

0 comments on commit 6497234

Please sign in to comment.