From 1d774507c00bd76df36c0779c2520e1259579e2f Mon Sep 17 00:00:00 2001 From: tangjinzhou <415800467@qq.com> Date: Sun, 12 Feb 2023 11:18:49 +0800 Subject: [PATCH] refactor: datepicker type --- .../generatePicker/generateRangePicker.tsx | 43 ++-- .../generatePicker/generateSinglePicker.tsx | 55 +++-- .../date-picker/generatePicker/props.ts | 195 +++++++++--------- components/date-picker/index.en-US.md | 2 +- components/date-picker/index.zh-CN.md | 2 +- .../locale/{ar_EG.tsx => ar_EG.ts} | 0 .../locale/{az_AZ.tsx => az_AZ.ts} | 0 .../locale/{bg_BG.tsx => bg_BG.ts} | 0 .../locale/{bn_BD.tsx => bn_BD.ts} | 0 .../locale/{by_BY.tsx => by_BY.ts} | 0 .../locale/{ca_ES.tsx => ca_ES.ts} | 0 .../locale/{cs_CZ.tsx => cs_CZ.ts} | 0 .../locale/{da_DK.tsx => da_DK.ts} | 0 .../locale/{de_DE.tsx => de_DE.ts} | 0 .../locale/{el_GR.tsx => el_GR.ts} | 0 .../locale/{en_GB.tsx => en_GB.ts} | 0 .../locale/{en_US.tsx => en_US.ts} | 0 .../locale/{es_ES.tsx => es_ES.ts} | 0 .../locale/{et_EE.tsx => et_EE.ts} | 0 .../locale/{fa_IR.tsx => fa_IR.ts} | 0 .../locale/{fi_FI.tsx => fi_FI.ts} | 0 .../locale/{fr_BE.tsx => fr_BE.ts} | 0 .../locale/{fr_CA.tsx => fr_CA.ts} | 0 .../locale/{fr_FR.tsx => fr_FR.ts} | 0 .../locale/{ga_IE.tsx => ga_IE.ts} | 0 .../locale/{gl_ES.tsx => gl_ES.ts} | 0 .../locale/{he_IL.tsx => he_IL.ts} | 0 .../locale/{hi_IN.tsx => hi_IN.ts} | 0 .../locale/{hr_HR.tsx => hr_HR.ts} | 0 .../locale/{hu_HU.tsx => hu_HU.ts} | 0 .../locale/{id_ID.tsx => id_ID.ts} | 0 .../locale/{is_IS.tsx => is_IS.ts} | 0 .../locale/{it_IT.tsx => it_IT.ts} | 0 .../locale/{ja_JP.tsx => ja_JP.ts} | 0 .../locale/{ka_GE.tsx => ka_GE.ts} | 0 .../locale/{kk_KZ.tsx => kk_KZ.ts} | 0 .../locale/{km_KH.tsx => km_KH.ts} | 0 .../locale/{kmr_IQ.tsx => kmr_IQ.ts} | 0 .../locale/{kn_IN.tsx => kn_IN.ts} | 0 .../locale/{ko_KR.tsx => ko_KR.ts} | 0 .../locale/{lt_LT.tsx => lt_LT.ts} | 0 .../locale/{lv_LV.tsx => lv_LV.ts} | 0 .../locale/{mk_MK.tsx => mk_MK.ts} | 0 .../locale/{ml_IN.tsx => ml_IN.ts} | 0 .../locale/{mn_MN.tsx => mn_MN.ts} | 0 .../locale/{ms_MY.tsx => ms_MY.ts} | 0 .../locale/{nb_NO.tsx => nb_NO.ts} | 0 .../locale/{nl_BE.tsx => nl_BE.ts} | 0 .../locale/{nl_NL.tsx => nl_NL.ts} | 0 .../locale/{pl_PL.tsx => pl_PL.ts} | 0 .../locale/{pt_BR.tsx => pt_BR.ts} | 0 .../locale/{pt_PT.tsx => pt_PT.ts} | 0 .../locale/{ro_RO.tsx => ro_RO.ts} | 0 .../locale/{ru_RU.tsx => ru_RU.ts} | 0 .../locale/{sk_SK.tsx => sk_SK.ts} | 0 .../locale/{sl_SI.tsx => sl_SI.ts} | 0 .../locale/{sr_RS.tsx => sr_RS.ts} | 0 .../locale/{sv_SE.tsx => sv_SE.ts} | 0 .../locale/{ta_IN.tsx => ta_IN.ts} | 0 .../locale/{th_TH.tsx => th_TH.ts} | 0 .../locale/{tr_TR.tsx => tr_TR.ts} | 0 .../locale/{uk_UA.tsx => uk_UA.ts} | 0 .../locale/{ur_PK.tsx => ur_PK.ts} | 0 .../locale/{vi_VN.tsx => vi_VN.ts} | 0 .../locale/{zh_CN.tsx => zh_CN.ts} | 0 .../locale/{zh_TW.tsx => zh_TW.ts} | 0 components/date-picker/util.ts | 20 +- 67 files changed, 173 insertions(+), 144 deletions(-) rename components/date-picker/locale/{ar_EG.tsx => ar_EG.ts} (100%) rename components/date-picker/locale/{az_AZ.tsx => az_AZ.ts} (100%) rename components/date-picker/locale/{bg_BG.tsx => bg_BG.ts} (100%) rename components/date-picker/locale/{bn_BD.tsx => bn_BD.ts} (100%) rename components/date-picker/locale/{by_BY.tsx => by_BY.ts} (100%) rename components/date-picker/locale/{ca_ES.tsx => ca_ES.ts} (100%) rename components/date-picker/locale/{cs_CZ.tsx => cs_CZ.ts} (100%) rename components/date-picker/locale/{da_DK.tsx => da_DK.ts} (100%) rename components/date-picker/locale/{de_DE.tsx => de_DE.ts} (100%) rename components/date-picker/locale/{el_GR.tsx => el_GR.ts} (100%) rename components/date-picker/locale/{en_GB.tsx => en_GB.ts} (100%) rename components/date-picker/locale/{en_US.tsx => en_US.ts} (100%) rename components/date-picker/locale/{es_ES.tsx => es_ES.ts} (100%) rename components/date-picker/locale/{et_EE.tsx => et_EE.ts} (100%) rename components/date-picker/locale/{fa_IR.tsx => fa_IR.ts} (100%) rename components/date-picker/locale/{fi_FI.tsx => fi_FI.ts} (100%) rename components/date-picker/locale/{fr_BE.tsx => fr_BE.ts} (100%) rename components/date-picker/locale/{fr_CA.tsx => fr_CA.ts} (100%) rename components/date-picker/locale/{fr_FR.tsx => fr_FR.ts} (100%) rename components/date-picker/locale/{ga_IE.tsx => ga_IE.ts} (100%) rename components/date-picker/locale/{gl_ES.tsx => gl_ES.ts} (100%) rename components/date-picker/locale/{he_IL.tsx => he_IL.ts} (100%) rename components/date-picker/locale/{hi_IN.tsx => hi_IN.ts} (100%) rename components/date-picker/locale/{hr_HR.tsx => hr_HR.ts} (100%) rename components/date-picker/locale/{hu_HU.tsx => hu_HU.ts} (100%) rename components/date-picker/locale/{id_ID.tsx => id_ID.ts} (100%) rename components/date-picker/locale/{is_IS.tsx => is_IS.ts} (100%) rename components/date-picker/locale/{it_IT.tsx => it_IT.ts} (100%) rename components/date-picker/locale/{ja_JP.tsx => ja_JP.ts} (100%) rename components/date-picker/locale/{ka_GE.tsx => ka_GE.ts} (100%) rename components/date-picker/locale/{kk_KZ.tsx => kk_KZ.ts} (100%) rename components/date-picker/locale/{km_KH.tsx => km_KH.ts} (100%) rename components/date-picker/locale/{kmr_IQ.tsx => kmr_IQ.ts} (100%) rename components/date-picker/locale/{kn_IN.tsx => kn_IN.ts} (100%) rename components/date-picker/locale/{ko_KR.tsx => ko_KR.ts} (100%) rename components/date-picker/locale/{lt_LT.tsx => lt_LT.ts} (100%) rename components/date-picker/locale/{lv_LV.tsx => lv_LV.ts} (100%) rename components/date-picker/locale/{mk_MK.tsx => mk_MK.ts} (100%) rename components/date-picker/locale/{ml_IN.tsx => ml_IN.ts} (100%) rename components/date-picker/locale/{mn_MN.tsx => mn_MN.ts} (100%) rename components/date-picker/locale/{ms_MY.tsx => ms_MY.ts} (100%) rename components/date-picker/locale/{nb_NO.tsx => nb_NO.ts} (100%) rename components/date-picker/locale/{nl_BE.tsx => nl_BE.ts} (100%) rename components/date-picker/locale/{nl_NL.tsx => nl_NL.ts} (100%) rename components/date-picker/locale/{pl_PL.tsx => pl_PL.ts} (100%) rename components/date-picker/locale/{pt_BR.tsx => pt_BR.ts} (100%) rename components/date-picker/locale/{pt_PT.tsx => pt_PT.ts} (100%) rename components/date-picker/locale/{ro_RO.tsx => ro_RO.ts} (100%) rename components/date-picker/locale/{ru_RU.tsx => ru_RU.ts} (100%) rename components/date-picker/locale/{sk_SK.tsx => sk_SK.ts} (100%) rename components/date-picker/locale/{sl_SI.tsx => sl_SI.ts} (100%) rename components/date-picker/locale/{sr_RS.tsx => sr_RS.ts} (100%) rename components/date-picker/locale/{sv_SE.tsx => sv_SE.ts} (100%) rename components/date-picker/locale/{ta_IN.tsx => ta_IN.ts} (100%) rename components/date-picker/locale/{th_TH.tsx => th_TH.ts} (100%) rename components/date-picker/locale/{tr_TR.tsx => tr_TR.ts} (100%) rename components/date-picker/locale/{uk_UA.tsx => uk_UA.ts} (100%) rename components/date-picker/locale/{ur_PK.tsx => ur_PK.ts} (100%) rename components/date-picker/locale/{vi_VN.tsx => vi_VN.ts} (100%) rename components/date-picker/locale/{zh_CN.tsx => zh_CN.ts} (100%) rename components/date-picker/locale/{zh_TW.tsx => zh_TW.ts} (100%) diff --git a/components/date-picker/generatePicker/generateRangePicker.tsx b/components/date-picker/generatePicker/generateRangePicker.tsx index 19600d588..ec98a5b4b 100644 --- a/components/date-picker/generatePicker/generateRangePicker.tsx +++ b/components/date-picker/generatePicker/generateRangePicker.tsx @@ -15,13 +15,14 @@ import type { CommonProps, RangePickerProps } from './props'; import { commonProps, rangePickerProps } from './props'; import type { PanelMode, RangeValue } from '../../vc-picker/interface'; import type { RangePickerSharedProps } from '../../vc-picker/RangePicker'; -import devWarning from '../../vc-util/devWarning'; import { FormItemInputContext, useInjectFormItemContext } from '../../form/FormItemContext'; import omit from '../../_util/omit'; import { getMergedStatus, getStatusClassNames } from '../../_util/statusUtils'; //CSSINJS import useStyle from '../style'; +import { useCompactItemContext } from '../../space/Compact'; +import devWarning from '../../vc-util/devWarning'; export default function generateRangePicker( generateConfig: GenerateConfig, @@ -52,19 +53,27 @@ export default function generateRangePicker( const props = _props as unknown as CommonProps & RangePickerProps; const formItemContext = useInjectFormItemContext(); const formItemInputContext = FormItemInputContext.useInject(); - devWarning( - !attrs.getCalendarContainer, - 'DatePicker', - '`getCalendarContainer` is deprecated. Please use `getPopupContainer"` instead.', - ); - const { prefixCls, direction, getPopupContainer, size, rootPrefixCls } = useConfigInject( - 'picker', - props, - ); + // =================== Warning ===================== + if (process.env.NODE_ENV !== 'production') { + devWarning( + !props.dropdownClassName, + 'RangePicker', + '`dropdownClassName` is deprecated. Please use `popupClassName` instead.', + ); + devWarning( + !attrs.getCalendarContainer, + 'DatePicker', + '`getCalendarContainer` is deprecated. Please use `getPopupContainer"` instead.', + ); + } + + const { prefixCls, direction, getPopupContainer, size, rootPrefixCls, disabled } = + useConfigInject('picker', props); + const { compactSize, compactItemClassnames } = useCompactItemContext(prefixCls, direction); + const mergedSize = computed(() => compactSize.value || size.value); // style const [wrapSSR, hashId] = useStyle(prefixCls); - const pickerRef = ref(); expose({ focus: () => { @@ -186,13 +195,14 @@ export default function generateRangePicker( } ref={pickerRef} dropdownAlign={transPlacement2DropdownAlign(direction.value, props.placement)} - placeholder={getRangePlaceholder(picker, locale, placeholder as [string, string])} + placeholder={getRangePlaceholder(locale, picker, placeholder as [string, string])} suffixIcon={suffixNode} clearIcon={clearIcon || } allowClear={allowClear} transitionName={transitionName || `${rootPrefixCls.value}-slide-up`} {...restProps} {...additionalOverrideProps} + disabled={disabled.value} id={id} value={value.value} defaultValue={defaultValue.value} @@ -200,7 +210,7 @@ export default function generateRangePicker( picker={picker} class={classNames( { - [`${pre}-${size.value}`]: size.value, + [`${pre}-${mergedSize.value}`]: mergedSize.value, [`${pre}-borderless`]: !bordered, }, getStatusClassNames( @@ -210,6 +220,7 @@ export default function generateRangePicker( ), attrs.class, hashId.value, + compactItemClassnames.value, )} locale={locale!.lang} prefixCls={pre} @@ -221,7 +232,11 @@ export default function generateRangePicker( superNextIcon={slots.superNextIcon?.() || } components={Components} direction={direction.value} - dropdownClassName={classNames(hashId.value)} + dropdownClassName={classNames( + hashId.value, + props.popupClassName, + props.dropdownClassName, + )} onChange={onChange} onOpenChange={onOpenChange} onFocus={onFocus} diff --git a/components/date-picker/generatePicker/generateSinglePicker.tsx b/components/date-picker/generatePicker/generateSinglePicker.tsx index 6aa4ba33f..4a9b38305 100644 --- a/components/date-picker/generatePicker/generateSinglePicker.tsx +++ b/components/date-picker/generatePicker/generateSinglePicker.tsx @@ -17,6 +17,7 @@ import { commonProps, datePickerProps } from './props'; import devWarning from '../../vc-util/devWarning'; import { FormItemInputContext, useInjectFormItemContext } from '../../form/FormItemContext'; import { getMergedStatus, getStatusClassNames } from '../../_util/statusUtils'; +import { useCompactItemContext } from '../../space/Compact'; //CSSINJS import useStyle from '../style'; @@ -55,22 +56,36 @@ export default function generateSinglePicker( ExtraProps; const formItemContext = useInjectFormItemContext(); const formItemInputContext = FormItemInputContext.useInject(); - devWarning( - !(props.monthCellContentRender || slots.monthCellContentRender), - 'DatePicker', - '`monthCellContentRender` is deprecated. Please use `monthCellRender"` instead.', - ); + // =================== Warning ===================== + if (process.env.NODE_ENV !== 'production') { + devWarning( + picker !== 'quarter', + displayName || 'DatePicker', + `DatePicker.${displayName} is legacy usage. Please use DatePicker[picker='${picker}'] directly.`, + ); - devWarning( - !attrs.getCalendarContainer, - 'DatePicker', - '`getCalendarContainer` is deprecated. Please use `getPopupContainer"` instead.', - ); - const { prefixCls, direction, getPopupContainer, size, rootPrefixCls } = useConfigInject( - 'picker', - props, - ); + devWarning( + !props.dropdownClassName, + displayName || 'DatePicker', + '`dropdownClassName` is deprecated. Please use `popupClassName` instead.', + ); + devWarning( + !(props.monthCellContentRender || slots.monthCellContentRender), + displayName || 'DatePicker', + '`monthCellContentRender` is deprecated. Please use `monthCellRender"` instead.', + ); + devWarning( + !attrs.getCalendarContainer, + displayName || 'DatePicker', + '`getCalendarContainer` is deprecated. Please use `getPopupContainer"` instead.', + ); + } + + const { prefixCls, direction, getPopupContainer, size, rootPrefixCls, disabled } = + useConfigInject('picker', props); + const { compactSize, compactItemClassnames } = useCompactItemContext(prefixCls, direction); + const mergedSize = computed(() => compactSize.value || size.value); // style const [wrapSSR, hashId] = useStyle(prefixCls); @@ -198,7 +213,7 @@ export default function generateSinglePicker( dateRender={dateRender} renderExtraFooter={renderExtraFooter} ref={pickerRef} - placeholder={getPlaceholder(mergedPicker, locale, placeholder)} + placeholder={getPlaceholder(locale, mergedPicker, placeholder)} suffixIcon={suffixNode} dropdownAlign={transPlacement2DropdownAlign(direction.value, props.placement)} clearIcon={clearIcon || } @@ -215,7 +230,7 @@ export default function generateSinglePicker( locale={locale!.lang} class={classNames( { - [`${pre}-${size.value}`]: size.value, + [`${pre}-${mergedSize.value}`]: mergedSize.value, [`${pre}-borderless`]: !bordered, }, getStatusClassNames( @@ -225,7 +240,9 @@ export default function generateSinglePicker( ), attrs.class, hashId.value, + compactItemClassnames.value, )} + disabled={disabled.value} prefixCls={pre} getPopupContainer={attrs.getCalendarContainer || getPopupContainer.value} generateConfig={generateConfig} @@ -235,7 +252,11 @@ export default function generateSinglePicker( superNextIcon={slots.superNextIcon?.() || } components={Components} direction={direction.value} - dropdownClassName={classNames(hashId.value)} + dropdownClassName={classNames( + hashId.value, + props.popupClassName, + props.dropdownClassName, + )} onChange={onChange} onOpenChange={onOpenChange} onFocus={onFocus} diff --git a/components/date-picker/generatePicker/props.ts b/components/date-picker/generatePicker/props.ts index 8e92dac9d..21f5fdd15 100644 --- a/components/date-picker/generatePicker/props.ts +++ b/components/date-picker/generatePicker/props.ts @@ -1,5 +1,5 @@ import type { FocusEventHandler, MouseEventHandler } from '../../_util/EventInterface'; -import type { CSSProperties, PropType } from 'vue'; +import type { CSSProperties } from 'vue'; import type { PickerLocale } from '.'; import type { SizeType } from '../../config-provider'; import type { @@ -16,27 +16,39 @@ import type { MonthCellRender } from '../../vc-picker/panels/MonthPanel/MonthBod import type { SharedTimeProps } from '../../vc-picker/panels/TimePanel'; import type { RangeDateRender, RangeInfo, RangeType } from '../../vc-picker/RangePicker'; import type { VueNode } from '../../_util/type'; -import { tuple } from '../../_util/type'; +import { + stringType, + arrayType, + someType, + booleanType, + objectType, + functionType, +} from '../../_util/type'; import type { InputStatus } from '../../_util/statusUtils'; -const DataPickerPlacements = tuple('bottomLeft', 'bottomRight', 'topLeft', 'topRight'); -type DataPickerPlacement = typeof DataPickerPlacements[number]; +const DataPickerPlacements = ['bottomLeft', 'bottomRight', 'topLeft', 'topRight'] as const; +type DataPickerPlacement = (typeof DataPickerPlacements)[number]; function commonProps() { return { id: String, + /** + * @deprecated `dropdownClassName` is deprecated which will be removed in next major + * version.Please use `popupClassName` instead. + */ dropdownClassName: String, - popupStyle: { type: Object as PropType }, + popupClassName: String, + popupStyle: objectType(), transitionName: String, placeholder: String, - allowClear: { type: Boolean, default: undefined }, - autofocus: { type: Boolean, default: undefined }, - disabled: { type: Boolean, default: undefined }, + allowClear: booleanType(), + autofocus: booleanType(), + disabled: booleanType(), tabindex: Number, - open: { type: Boolean, default: undefined }, - defaultOpen: { type: Boolean, default: undefined }, + open: booleanType(), + defaultOpen: booleanType(), /** Make input readOnly to avoid popup keyboard in mobile */ - inputReadOnly: { type: Boolean, default: undefined }, + inputReadOnly: booleanType(), // Value // format: string | CustomFormat | (string | CustomFormat)[]; // Render @@ -46,61 +58,59 @@ function commonProps() { // nextIcon?: VueNode; // superPrevIcon?: VueNode; // superNextIcon?: VueNode; - getPopupContainer: { type: Function as PropType<(node: HTMLElement) => HTMLElement> }, - panelRender: { type: Function as PropType<(originPanel: VueNode) => VueNode> }, + getPopupContainer: functionType<(node: HTMLElement) => HTMLElement>(), + panelRender: functionType<(originPanel: VueNode) => VueNode>(), // // Events - onChange: { - type: Function as PropType<(value: DateType | string | null, dateString: string) => void>, - }, - 'onUpdate:value': { type: Function as PropType<(value: DateType | string | null) => void> }, - onOk: { type: Function as PropType<(value: DateType | string | null) => void> }, - onOpenChange: { type: Function as PropType<(open: boolean) => void> }, - 'onUpdate:open': { type: Function as PropType<(open: boolean) => void> }, - onFocus: { type: Function as PropType }, - onBlur: { type: Function as PropType }, - onMousedown: { type: Function as PropType }, - onMouseup: { type: Function as PropType }, - onMouseenter: { type: Function as PropType }, - onMouseleave: { type: Function as PropType }, - onClick: { type: Function as PropType }, - onContextmenu: { type: Function as PropType }, - onKeydown: { - type: Function as PropType<(event: KeyboardEvent, preventDefault: () => void) => void>, - }, + onChange: functionType<(value: DateType | string | null, dateString: string) => void>(), + 'onUpdate:value': functionType<(value: DateType | string | null) => void>(), + onOk: functionType<(value: DateType | string | null) => void>(), + onOpenChange: functionType<(open: boolean) => void>(), + 'onUpdate:open': functionType<(open: boolean) => void>(), + onFocus: functionType(), + onBlur: functionType(), + onMousedown: functionType(), + onMouseup: functionType(), + onMouseenter: functionType(), + onMouseleave: functionType(), + onClick: functionType(), + onContextmenu: functionType(), + onKeydown: functionType<(event: KeyboardEvent, preventDefault: () => void) => void>(), // WAI-ARIA role: String, name: String, autocomplete: String, - direction: { type: String as PropType<'ltr' | 'rtl'> }, - showToday: { type: Boolean, default: undefined }, - showTime: { - type: [Boolean, Object] as PropType>, - default: undefined, - }, - locale: { type: Object as PropType }, - size: { type: String as PropType }, - bordered: { type: Boolean, default: undefined }, - dateRender: { type: Function as PropType> }, - disabledDate: { type: Function as PropType<(date: DateType) => boolean> }, - mode: { type: String as PropType }, - picker: { type: String as PropType }, + direction: stringType<'ltr' | 'rtl'>(), + showToday: booleanType(), + showTime: someType>([Boolean, Object]), + locale: objectType(), + size: stringType(), + bordered: booleanType(), + dateRender: functionType>(), + disabledDate: functionType<(date: DateType) => boolean>(), + mode: stringType(), + picker: stringType(), valueFormat: String, - placement: String as PropType, - status: String as PropType, + placement: stringType(), + status: stringType(), /** @deprecated Please use `disabledTime` instead. */ - disabledHours: Function as PropType, + disabledHours: functionType(), /** @deprecated Please use `disabledTime` instead. */ - disabledMinutes: Function as PropType, + disabledMinutes: functionType(), /** @deprecated Please use `disabledTime` instead. */ - disabledSeconds: Function as PropType, + disabledSeconds: functionType(), }; } export interface CommonProps { id?: string; prefixCls?: string; + /** + * @deprecated `dropdownClassName` is deprecated which will be removed in next major + * version.Please use `popupClassName` instead. + */ dropdownClassName?: string; + popupClassName?: string; popupStyle?: CSSProperties; transitionName?: string; placeholder?: string; @@ -153,20 +163,20 @@ export interface CommonProps { function datePickerProps() { return { - defaultPickerValue: { type: [String, Object] as PropType }, - defaultValue: { type: [String, Object] as PropType }, - value: { type: [String, Object] as PropType }, - disabledTime: { type: Function as PropType> }, - format: { - type: [String, Function, Array] as PropType< - string | CustomFormat | (string | CustomFormat)[] - >, - }, - renderExtraFooter: { type: Function as PropType<(mode: PanelMode) => VueNode> }, - showNow: { type: Boolean, default: undefined }, - monthCellRender: { type: Function as PropType> }, + defaultPickerValue: someType([Object, String]), + defaultValue: someType([Object, String]), + value: someType([Object, String]), + disabledTime: functionType>(), + format: someType | (string | CustomFormat)[]>([ + String, + Function, + Array, + ]), + renderExtraFooter: functionType<(mode: PanelMode) => VueNode>(), + showNow: booleanType(), + monthCellRender: functionType>(), // deprecated Please use `monthCellRender"` instead.', - monthCellContentRender: { type: Function as PropType> }, + monthCellContentRender: functionType>(), }; } @@ -185,58 +195,47 @@ export interface DatePickerProps { function rangePickerProps() { return { - allowEmpty: { type: Array as unknown as PropType<[boolean, boolean]> }, - dateRender: { type: Function as PropType> }, - defaultPickerValue: { - type: Array as unknown as PropType | RangeValue>, - }, - defaultValue: { type: Array as unknown as PropType | RangeValue> }, - value: { type: Array as unknown as PropType | RangeValue> }, - disabledTime: { - type: Function as PropType<(date: EventValue, type: RangeType) => DisabledTimes>, - }, - disabled: { type: [Boolean, Array] as unknown as PropType }, + allowEmpty: arrayType<[boolean, boolean]>(), + dateRender: functionType>(), + defaultPickerValue: arrayType | RangeValue>(), + defaultValue: arrayType | RangeValue>(), + value: arrayType | RangeValue>(), + disabledTime: functionType<(date: EventValue, type: RangeType) => DisabledTimes>(), + disabled: someType([Boolean, Array]), format: String, - renderExtraFooter: { type: Function as PropType<() => VueNode> }, + renderExtraFooter: functionType<() => VueNode>(), separator: { type: String }, - ranges: { - type: Object as PropType< + ranges: + objectType< Record< string, Exclude, null> | (() => Exclude, null>) > - >, - }, - placeholder: Array, - mode: { type: Array as unknown as PropType<[PanelMode, PanelMode]> }, - onChange: { - type: Function as PropType< + >(), + placeholder: arrayType(), + mode: arrayType<[PanelMode, PanelMode]>(), + onChange: + functionType< ( value: RangeValue | RangeValue | null, dateString: [string, string], ) => void - >, - }, - 'onUpdate:value': { - type: Function as PropType<(value: RangeValue | RangeValue | null) => void>, - }, - onCalendarChange: { - type: Function as PropType< + >(), + 'onUpdate:value': + functionType<(value: RangeValue | RangeValue | null) => void>(), + onCalendarChange: + functionType< ( values: RangeValue | RangeValue, formatString: [string, string], info: RangeInfo, ) => void - >, - }, - onPanelChange: { - type: Function as PropType< + >(), + onPanelChange: + functionType< (values: RangeValue | RangeValue, modes: [PanelMode, PanelMode]) => void - >, - }, - onOk: { - type: Function as PropType<(dates: RangeValue | RangeValue) => void>, - }, + >(), + onOk: functionType<(dates: RangeValue | RangeValue) => void>(), }; } diff --git a/components/date-picker/index.en-US.md b/components/date-picker/index.en-US.md index 071d2b336..a4dd44cc8 100644 --- a/components/date-picker/index.en-US.md +++ b/components/date-picker/index.en-US.md @@ -2,7 +2,7 @@ category: Components type: Data Entry title: DatePicker -cover: https://gw.alipayobjects.com/zos/alicdn/RT_USzA48/DatePicker.svg +cover: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*xXA9TJ8BTioAAAAAAAAAAAAADrJ8AQ/original --- To select or input a date. diff --git a/components/date-picker/index.zh-CN.md b/components/date-picker/index.zh-CN.md index 1f8924729..d404193a3 100644 --- a/components/date-picker/index.zh-CN.md +++ b/components/date-picker/index.zh-CN.md @@ -3,7 +3,7 @@ category: Components type: 数据录入 title: DatePicker subtitle: 日期选择框 -cover: https://gw.alipayobjects.com/zos/alicdn/RT_USzA48/DatePicker.svg +cover: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*xXA9TJ8BTioAAAAAAAAAAAAADrJ8AQ/original --- 输入或选择日期的控件。 diff --git a/components/date-picker/locale/ar_EG.tsx b/components/date-picker/locale/ar_EG.ts similarity index 100% rename from components/date-picker/locale/ar_EG.tsx rename to components/date-picker/locale/ar_EG.ts diff --git a/components/date-picker/locale/az_AZ.tsx b/components/date-picker/locale/az_AZ.ts similarity index 100% rename from components/date-picker/locale/az_AZ.tsx rename to components/date-picker/locale/az_AZ.ts diff --git a/components/date-picker/locale/bg_BG.tsx b/components/date-picker/locale/bg_BG.ts similarity index 100% rename from components/date-picker/locale/bg_BG.tsx rename to components/date-picker/locale/bg_BG.ts diff --git a/components/date-picker/locale/bn_BD.tsx b/components/date-picker/locale/bn_BD.ts similarity index 100% rename from components/date-picker/locale/bn_BD.tsx rename to components/date-picker/locale/bn_BD.ts diff --git a/components/date-picker/locale/by_BY.tsx b/components/date-picker/locale/by_BY.ts similarity index 100% rename from components/date-picker/locale/by_BY.tsx rename to components/date-picker/locale/by_BY.ts diff --git a/components/date-picker/locale/ca_ES.tsx b/components/date-picker/locale/ca_ES.ts similarity index 100% rename from components/date-picker/locale/ca_ES.tsx rename to components/date-picker/locale/ca_ES.ts diff --git a/components/date-picker/locale/cs_CZ.tsx b/components/date-picker/locale/cs_CZ.ts similarity index 100% rename from components/date-picker/locale/cs_CZ.tsx rename to components/date-picker/locale/cs_CZ.ts diff --git a/components/date-picker/locale/da_DK.tsx b/components/date-picker/locale/da_DK.ts similarity index 100% rename from components/date-picker/locale/da_DK.tsx rename to components/date-picker/locale/da_DK.ts diff --git a/components/date-picker/locale/de_DE.tsx b/components/date-picker/locale/de_DE.ts similarity index 100% rename from components/date-picker/locale/de_DE.tsx rename to components/date-picker/locale/de_DE.ts diff --git a/components/date-picker/locale/el_GR.tsx b/components/date-picker/locale/el_GR.ts similarity index 100% rename from components/date-picker/locale/el_GR.tsx rename to components/date-picker/locale/el_GR.ts diff --git a/components/date-picker/locale/en_GB.tsx b/components/date-picker/locale/en_GB.ts similarity index 100% rename from components/date-picker/locale/en_GB.tsx rename to components/date-picker/locale/en_GB.ts diff --git a/components/date-picker/locale/en_US.tsx b/components/date-picker/locale/en_US.ts similarity index 100% rename from components/date-picker/locale/en_US.tsx rename to components/date-picker/locale/en_US.ts diff --git a/components/date-picker/locale/es_ES.tsx b/components/date-picker/locale/es_ES.ts similarity index 100% rename from components/date-picker/locale/es_ES.tsx rename to components/date-picker/locale/es_ES.ts diff --git a/components/date-picker/locale/et_EE.tsx b/components/date-picker/locale/et_EE.ts similarity index 100% rename from components/date-picker/locale/et_EE.tsx rename to components/date-picker/locale/et_EE.ts diff --git a/components/date-picker/locale/fa_IR.tsx b/components/date-picker/locale/fa_IR.ts similarity index 100% rename from components/date-picker/locale/fa_IR.tsx rename to components/date-picker/locale/fa_IR.ts diff --git a/components/date-picker/locale/fi_FI.tsx b/components/date-picker/locale/fi_FI.ts similarity index 100% rename from components/date-picker/locale/fi_FI.tsx rename to components/date-picker/locale/fi_FI.ts diff --git a/components/date-picker/locale/fr_BE.tsx b/components/date-picker/locale/fr_BE.ts similarity index 100% rename from components/date-picker/locale/fr_BE.tsx rename to components/date-picker/locale/fr_BE.ts diff --git a/components/date-picker/locale/fr_CA.tsx b/components/date-picker/locale/fr_CA.ts similarity index 100% rename from components/date-picker/locale/fr_CA.tsx rename to components/date-picker/locale/fr_CA.ts diff --git a/components/date-picker/locale/fr_FR.tsx b/components/date-picker/locale/fr_FR.ts similarity index 100% rename from components/date-picker/locale/fr_FR.tsx rename to components/date-picker/locale/fr_FR.ts diff --git a/components/date-picker/locale/ga_IE.tsx b/components/date-picker/locale/ga_IE.ts similarity index 100% rename from components/date-picker/locale/ga_IE.tsx rename to components/date-picker/locale/ga_IE.ts diff --git a/components/date-picker/locale/gl_ES.tsx b/components/date-picker/locale/gl_ES.ts similarity index 100% rename from components/date-picker/locale/gl_ES.tsx rename to components/date-picker/locale/gl_ES.ts diff --git a/components/date-picker/locale/he_IL.tsx b/components/date-picker/locale/he_IL.ts similarity index 100% rename from components/date-picker/locale/he_IL.tsx rename to components/date-picker/locale/he_IL.ts diff --git a/components/date-picker/locale/hi_IN.tsx b/components/date-picker/locale/hi_IN.ts similarity index 100% rename from components/date-picker/locale/hi_IN.tsx rename to components/date-picker/locale/hi_IN.ts diff --git a/components/date-picker/locale/hr_HR.tsx b/components/date-picker/locale/hr_HR.ts similarity index 100% rename from components/date-picker/locale/hr_HR.tsx rename to components/date-picker/locale/hr_HR.ts diff --git a/components/date-picker/locale/hu_HU.tsx b/components/date-picker/locale/hu_HU.ts similarity index 100% rename from components/date-picker/locale/hu_HU.tsx rename to components/date-picker/locale/hu_HU.ts diff --git a/components/date-picker/locale/id_ID.tsx b/components/date-picker/locale/id_ID.ts similarity index 100% rename from components/date-picker/locale/id_ID.tsx rename to components/date-picker/locale/id_ID.ts diff --git a/components/date-picker/locale/is_IS.tsx b/components/date-picker/locale/is_IS.ts similarity index 100% rename from components/date-picker/locale/is_IS.tsx rename to components/date-picker/locale/is_IS.ts diff --git a/components/date-picker/locale/it_IT.tsx b/components/date-picker/locale/it_IT.ts similarity index 100% rename from components/date-picker/locale/it_IT.tsx rename to components/date-picker/locale/it_IT.ts diff --git a/components/date-picker/locale/ja_JP.tsx b/components/date-picker/locale/ja_JP.ts similarity index 100% rename from components/date-picker/locale/ja_JP.tsx rename to components/date-picker/locale/ja_JP.ts diff --git a/components/date-picker/locale/ka_GE.tsx b/components/date-picker/locale/ka_GE.ts similarity index 100% rename from components/date-picker/locale/ka_GE.tsx rename to components/date-picker/locale/ka_GE.ts diff --git a/components/date-picker/locale/kk_KZ.tsx b/components/date-picker/locale/kk_KZ.ts similarity index 100% rename from components/date-picker/locale/kk_KZ.tsx rename to components/date-picker/locale/kk_KZ.ts diff --git a/components/date-picker/locale/km_KH.tsx b/components/date-picker/locale/km_KH.ts similarity index 100% rename from components/date-picker/locale/km_KH.tsx rename to components/date-picker/locale/km_KH.ts diff --git a/components/date-picker/locale/kmr_IQ.tsx b/components/date-picker/locale/kmr_IQ.ts similarity index 100% rename from components/date-picker/locale/kmr_IQ.tsx rename to components/date-picker/locale/kmr_IQ.ts diff --git a/components/date-picker/locale/kn_IN.tsx b/components/date-picker/locale/kn_IN.ts similarity index 100% rename from components/date-picker/locale/kn_IN.tsx rename to components/date-picker/locale/kn_IN.ts diff --git a/components/date-picker/locale/ko_KR.tsx b/components/date-picker/locale/ko_KR.ts similarity index 100% rename from components/date-picker/locale/ko_KR.tsx rename to components/date-picker/locale/ko_KR.ts diff --git a/components/date-picker/locale/lt_LT.tsx b/components/date-picker/locale/lt_LT.ts similarity index 100% rename from components/date-picker/locale/lt_LT.tsx rename to components/date-picker/locale/lt_LT.ts diff --git a/components/date-picker/locale/lv_LV.tsx b/components/date-picker/locale/lv_LV.ts similarity index 100% rename from components/date-picker/locale/lv_LV.tsx rename to components/date-picker/locale/lv_LV.ts diff --git a/components/date-picker/locale/mk_MK.tsx b/components/date-picker/locale/mk_MK.ts similarity index 100% rename from components/date-picker/locale/mk_MK.tsx rename to components/date-picker/locale/mk_MK.ts diff --git a/components/date-picker/locale/ml_IN.tsx b/components/date-picker/locale/ml_IN.ts similarity index 100% rename from components/date-picker/locale/ml_IN.tsx rename to components/date-picker/locale/ml_IN.ts diff --git a/components/date-picker/locale/mn_MN.tsx b/components/date-picker/locale/mn_MN.ts similarity index 100% rename from components/date-picker/locale/mn_MN.tsx rename to components/date-picker/locale/mn_MN.ts diff --git a/components/date-picker/locale/ms_MY.tsx b/components/date-picker/locale/ms_MY.ts similarity index 100% rename from components/date-picker/locale/ms_MY.tsx rename to components/date-picker/locale/ms_MY.ts diff --git a/components/date-picker/locale/nb_NO.tsx b/components/date-picker/locale/nb_NO.ts similarity index 100% rename from components/date-picker/locale/nb_NO.tsx rename to components/date-picker/locale/nb_NO.ts diff --git a/components/date-picker/locale/nl_BE.tsx b/components/date-picker/locale/nl_BE.ts similarity index 100% rename from components/date-picker/locale/nl_BE.tsx rename to components/date-picker/locale/nl_BE.ts diff --git a/components/date-picker/locale/nl_NL.tsx b/components/date-picker/locale/nl_NL.ts similarity index 100% rename from components/date-picker/locale/nl_NL.tsx rename to components/date-picker/locale/nl_NL.ts diff --git a/components/date-picker/locale/pl_PL.tsx b/components/date-picker/locale/pl_PL.ts similarity index 100% rename from components/date-picker/locale/pl_PL.tsx rename to components/date-picker/locale/pl_PL.ts diff --git a/components/date-picker/locale/pt_BR.tsx b/components/date-picker/locale/pt_BR.ts similarity index 100% rename from components/date-picker/locale/pt_BR.tsx rename to components/date-picker/locale/pt_BR.ts diff --git a/components/date-picker/locale/pt_PT.tsx b/components/date-picker/locale/pt_PT.ts similarity index 100% rename from components/date-picker/locale/pt_PT.tsx rename to components/date-picker/locale/pt_PT.ts diff --git a/components/date-picker/locale/ro_RO.tsx b/components/date-picker/locale/ro_RO.ts similarity index 100% rename from components/date-picker/locale/ro_RO.tsx rename to components/date-picker/locale/ro_RO.ts diff --git a/components/date-picker/locale/ru_RU.tsx b/components/date-picker/locale/ru_RU.ts similarity index 100% rename from components/date-picker/locale/ru_RU.tsx rename to components/date-picker/locale/ru_RU.ts diff --git a/components/date-picker/locale/sk_SK.tsx b/components/date-picker/locale/sk_SK.ts similarity index 100% rename from components/date-picker/locale/sk_SK.tsx rename to components/date-picker/locale/sk_SK.ts diff --git a/components/date-picker/locale/sl_SI.tsx b/components/date-picker/locale/sl_SI.ts similarity index 100% rename from components/date-picker/locale/sl_SI.tsx rename to components/date-picker/locale/sl_SI.ts diff --git a/components/date-picker/locale/sr_RS.tsx b/components/date-picker/locale/sr_RS.ts similarity index 100% rename from components/date-picker/locale/sr_RS.tsx rename to components/date-picker/locale/sr_RS.ts diff --git a/components/date-picker/locale/sv_SE.tsx b/components/date-picker/locale/sv_SE.ts similarity index 100% rename from components/date-picker/locale/sv_SE.tsx rename to components/date-picker/locale/sv_SE.ts diff --git a/components/date-picker/locale/ta_IN.tsx b/components/date-picker/locale/ta_IN.ts similarity index 100% rename from components/date-picker/locale/ta_IN.tsx rename to components/date-picker/locale/ta_IN.ts diff --git a/components/date-picker/locale/th_TH.tsx b/components/date-picker/locale/th_TH.ts similarity index 100% rename from components/date-picker/locale/th_TH.tsx rename to components/date-picker/locale/th_TH.ts diff --git a/components/date-picker/locale/tr_TR.tsx b/components/date-picker/locale/tr_TR.ts similarity index 100% rename from components/date-picker/locale/tr_TR.tsx rename to components/date-picker/locale/tr_TR.ts diff --git a/components/date-picker/locale/uk_UA.tsx b/components/date-picker/locale/uk_UA.ts similarity index 100% rename from components/date-picker/locale/uk_UA.tsx rename to components/date-picker/locale/uk_UA.ts diff --git a/components/date-picker/locale/ur_PK.tsx b/components/date-picker/locale/ur_PK.ts similarity index 100% rename from components/date-picker/locale/ur_PK.tsx rename to components/date-picker/locale/ur_PK.ts diff --git a/components/date-picker/locale/vi_VN.tsx b/components/date-picker/locale/vi_VN.ts similarity index 100% rename from components/date-picker/locale/vi_VN.tsx rename to components/date-picker/locale/vi_VN.ts diff --git a/components/date-picker/locale/zh_CN.tsx b/components/date-picker/locale/zh_CN.ts similarity index 100% rename from components/date-picker/locale/zh_CN.tsx rename to components/date-picker/locale/zh_CN.ts diff --git a/components/date-picker/locale/zh_TW.tsx b/components/date-picker/locale/zh_TW.ts similarity index 100% rename from components/date-picker/locale/zh_TW.tsx rename to components/date-picker/locale/zh_TW.ts diff --git a/components/date-picker/util.ts b/components/date-picker/util.ts index 6e82bcf2e..5eea25b42 100644 --- a/components/date-picker/util.ts +++ b/components/date-picker/util.ts @@ -4,8 +4,8 @@ import type { PickerLocale } from './generatePicker'; import type { DirectionType } from '../config-provider'; export function getPlaceholder( - picker: PickerMode | undefined, locale: PickerLocale, + picker: PickerMode, customizePlaceholder?: string, ): string { if (customizePlaceholder !== undefined) { @@ -31,8 +31,8 @@ export function getPlaceholder( } export function getRangePlaceholder( - picker: PickerMode | undefined, locale: PickerLocale, + picker: PickerMode, customizePlaceholder?: [string, string], ) { if (customizePlaceholder !== undefined) { @@ -92,17 +92,11 @@ export function transPlacement2DropdownAlign( }; } default: { - return direction === 'rtl' - ? { - points: ['tr', 'br'], - offset: [0, 4], - overflow, - } - : { - points: ['tl', 'bl'], - offset: [0, 4], - overflow, - }; + return { + points: direction === 'rtl' ? ['tr', 'br'] : ['tl', 'bl'], + offset: [0, 4], + overflow, + }; } } }