mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-27 20:49:53 +08:00
parent
7346f922e8
commit
fe3378f644
@ -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;
|
||||
|
@ -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;
|
||||
|
@ -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;
|
||||
|
@ -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;
|
||||
|
@ -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;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user