type: code optimization (#49864)

* type: code optimization

* fix: fix
This commit is contained in:
lijianan 2024-07-15 09:21:54 +08:00 committed by GitHub
parent 7346f922e8
commit fe3378f644
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 49 additions and 43 deletions

View File

@ -54,24 +54,23 @@ export interface CalendarProps<DateType> {
onSelect?: (date: DateType, selectInfo: SelectInfo) => void;
}
function generateCalendar<DateType extends AnyObject>(generateConfig: GenerateConfig<DateType>) {
function isSameYear(date1: DateType, date2: DateType) {
return date1 && date2 && generateConfig.getYear(date1) === generateConfig.getYear(date2);
}
const isSameYear = <T extends AnyObject>(date1: T, date2: T, config: GenerateConfig<T>) => {
const { getYear } = config;
return date1 && date2 && getYear(date1) === getYear(date2);
};
function isSameMonth(date1: DateType, date2: DateType) {
return (
isSameYear(date1, date2) && generateConfig.getMonth(date1) === generateConfig.getMonth(date2)
);
}
const isSameMonth = <T extends AnyObject>(date1: T, date2: T, config: GenerateConfig<T>) => {
const { getMonth } = config;
return isSameYear(date1, date2, config) && getMonth(date1) === getMonth(date2);
};
function isSameDate(date1: DateType, date2: DateType) {
return (
isSameMonth(date1, date2) && generateConfig.getDate(date1) === generateConfig.getDate(date2)
);
}
const isSameDate = <T extends AnyObject>(date1: T, date2: T, config: GenerateConfig<T>) => {
const { getDate } = config;
return isSameMonth(date1, date2, config) && getDate(date1) === getDate(date2);
};
const Calendar = (props: CalendarProps<DateType>) => {
const generateCalendar = <DateType extends AnyObject>(generateConfig: GenerateConfig<DateType>) => {
const Calendar: React.FC<Readonly<CalendarProps<DateType>>> = (props) => {
const {
prefixCls: customizePrefixCls,
className,
@ -149,11 +148,11 @@ function generateCalendar<DateType extends AnyObject>(generateConfig: GenerateCo
const triggerChange = (date: DateType) => {
setMergedValue(date);
if (!isSameDate(date, mergedValue)) {
if (!isSameDate(date, mergedValue, generateConfig)) {
// Trigger when month panel switch month
if (
(panelMode === 'date' && !isSameMonth(date, mergedValue)) ||
(panelMode === 'month' && !isSameYear(date, mergedValue))
(panelMode === 'date' && !isSameMonth(date, mergedValue, generateConfig)) ||
(panelMode === 'month' && !isSameYear(date, mergedValue, generateConfig))
) {
triggerPanelChange(date, mergedMode);
}
@ -200,7 +199,7 @@ function generateCalendar<DateType extends AnyObject>(generateConfig: GenerateCo
return (
<div
className={classNames(`${prefixCls}-cell-inner`, `${calendarPrefixCls}-date`, {
[`${calendarPrefixCls}-date-today`]: isSameDate(today, date),
[`${calendarPrefixCls}-date-today`]: isSameDate(today, date, generateConfig),
})}
>
<div className={`${calendarPrefixCls}-date-value`}>
@ -230,7 +229,7 @@ function generateCalendar<DateType extends AnyObject>(generateConfig: GenerateCo
return (
<div
className={classNames(`${prefixCls}-cell-inner`, `${calendarPrefixCls}-date`, {
[`${calendarPrefixCls}-date-today`]: isSameMonth(today, date),
[`${calendarPrefixCls}-date-today`]: isSameMonth(today, date, generateConfig),
})}
>
<div className={`${calendarPrefixCls}-date-value`}>
@ -322,6 +321,6 @@ function generateCalendar<DateType extends AnyObject>(generateConfig: GenerateCo
}
return Calendar;
}
};
export default generateCalendar;

View File

@ -3,6 +3,8 @@ import * as React from 'react';
import Button from '../button';
import type { ButtonProps } from '../button';
export default function PickerButton(props: ButtonProps) {
return <Button size="small" type="primary" {...props} />;
}
const PickerButton: React.FC<Readonly<ButtonProps>> = (props) => (
<Button size="small" type="primary" {...props} />
);
export default PickerButton;

View File

@ -27,18 +27,19 @@ import { getPlaceholder, transPlacement2DropdownAlign, useIcons } from '../util'
import type { GenericTimePickerProps, PickerProps, PickerPropsWithMultiple } from './interface';
import useComponents from './useComponents';
export default function generatePicker<DateType extends AnyObject>(
generateConfig: GenerateConfig<DateType>,
) {
const [WEEK, WEEKPICKER] = ['week', 'WeekPicker'] as const;
const [MONTH, MONTHPICKER] = ['month', 'MonthPicker'] as const;
const [YEAR, YEARPICKER] = ['year', 'YearPicker'] as const;
const [QUARTER, QUARTERPICKER] = ['quarter', 'QuarterPicker'] as const;
const [TIME, TIMEPICKER] = ['time', 'TimePicker'] as const;
const generatePicker = <DateType extends AnyObject>(generateConfig: GenerateConfig<DateType>) => {
type DatePickerProps = PickerProps<DateType>;
type TimePickerProps = GenericTimePickerProps<DateType>;
function getPicker<InnerPickerProps extends DatePickerProps>(
picker?: PickerMode,
displayName?: string,
) {
const getPicker = <P extends DatePickerProps>(picker?: PickerMode, displayName?: string) => {
const consumerName = displayName === 'TimePicker' ? 'timePicker' : 'datePicker';
const Picker = forwardRef<PickerRef, InnerPickerProps>((props, ref) => {
const Picker = forwardRef<PickerRef, P>((props, ref) => {
const {
prefixCls: customizePrefixCls,
getPopupContainer: customizeGetPopupContainer,
@ -215,16 +216,18 @@ export default function generatePicker<DateType extends AnyObject>(
}
return Picker as unknown as (<ValueType = DateType>(
props: PickerPropsWithMultiple<DateType, InnerPickerProps, ValueType>,
props: PickerPropsWithMultiple<DateType, P, ValueType>,
) => React.ReactElement) & { displayName?: string };
}
};
const DatePicker = getPicker<DatePickerProps>();
const WeekPicker = getPicker<Omit<DatePickerProps, 'picker'>>('week', 'WeekPicker');
const MonthPicker = getPicker<Omit<DatePickerProps, 'picker'>>('month', 'MonthPicker');
const YearPicker = getPicker<Omit<DatePickerProps, 'picker'>>('year', 'YearPicker');
const QuarterPicker = getPicker<Omit<DatePickerProps, 'picker'>>('quarter', 'QuarterPicker');
const TimePicker = getPicker<Omit<TimePickerProps, 'picker'>>('time', 'TimePicker');
const WeekPicker = getPicker<Omit<DatePickerProps, 'picker'>>(WEEK, WEEKPICKER);
const MonthPicker = getPicker<Omit<DatePickerProps, 'picker'>>(MONTH, MONTHPICKER);
const YearPicker = getPicker<Omit<DatePickerProps, 'picker'>>(YEAR, YEARPICKER);
const QuarterPicker = getPicker<Omit<DatePickerProps, 'picker'>>(QUARTER, QUARTERPICKER);
const TimePicker = getPicker<Omit<TimePickerProps, 'picker'>>(TIME, TIMEPICKER);
return { DatePicker, WeekPicker, MonthPicker, YearPicker, TimePicker, QuarterPicker };
}
};
export default generatePicker;

View File

@ -26,6 +26,7 @@ function generatePicker<DateType extends AnyObject>(generateConfig: GenerateConf
};
const MergedDatePicker = DatePicker as MergedDatePickerType;
MergedDatePicker.WeekPicker = WeekPicker;
MergedDatePicker.MonthPicker = MonthPicker;
MergedDatePicker.YearPicker = YearPicker;

View File

@ -1,5 +1,6 @@
import * as React from 'react';
import type { Dayjs } from 'dayjs';
import type { PickerRef } from 'rc-picker';
import genPurePanel from '../_util/PurePanel';
import type { InputStatus } from '../_util/statusUtils';
@ -34,7 +35,7 @@ export interface TimeRangePickerProps extends Omit<RangePickerTimeProps<Dayjs>,
popupClassName?: string;
}
const RangePicker = React.forwardRef<any, TimeRangePickerProps>((props, ref) => (
const RangePicker = React.forwardRef<PickerRef, TimeRangePickerProps>((props, ref) => (
<InternalRangePicker {...props} picker="time" mode={undefined} ref={ref} />
));
@ -45,7 +46,7 @@ export interface TimePickerProps extends Omit<PickerTimeProps<Dayjs>, 'picker'>
rootClassName?: string;
}
const TimePicker = React.forwardRef<any, TimePickerProps>(
const TimePicker = React.forwardRef<PickerRef, TimePickerProps>(
({ addon, renderExtraFooter, variant, bordered, ...restProps }, ref) => {
if (process.env.NODE_ENV !== 'production') {
const warning = devUseWarning('TimePicker');
@ -55,7 +56,7 @@ const TimePicker = React.forwardRef<any, TimePickerProps>(
const [mergedVariant] = useVariant('timePicker', variant, bordered);
const internalRenderExtraFooter = React.useMemo(() => {
const internalRenderExtraFooter = React.useMemo<TimePickerProps['renderExtraFooter']>(() => {
if (renderExtraFooter) {
return renderExtraFooter;
}