Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/PickerInput/RangePicker.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -238,6 +238,7 @@ function RangePicker<DateType extends object = any>(
locale,
formatList,
true,
false,
defaultValue,
value,
onCalendarChange,
Expand Down
2 changes: 2 additions & 0 deletions src/PickerInput/SinglePicker.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -125,6 +125,7 @@ function Picker<DateType extends object = any>(
classNames,

// Value
order,
defaultValue,
value,
needConfirm,
Expand Down Expand Up @@ -224,6 +225,7 @@ function Picker<DateType extends object = any>(
locale,
formatList,
false,
order,
defaultValue,
value,
onInternalCalendarChange,
Expand Down
23 changes: 19 additions & 4 deletions src/PickerInput/hooks/useRangeValue.ts
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,13 @@ function useUtil<MergedValueType extends object[], DateType extends MergedValueT
return [getDateTexts, isSameDates] as const;
}

function orderDates<DateType extends object, DatesType extends DateType[]>(
dates: DatesType,
generateConfig: GenerateConfig<DateType>,
) {
return [...dates].sort((a, b) => (generateConfig.isAfter(a, b) ? 1 : -1)) as DatesType;
}

/**
* Used for internal value management.
* It should always use `mergedValue` in render logic
Expand Down Expand Up @@ -94,6 +101,12 @@ export function useInnerValue<ValueType extends DateType[], DateType extends obj
formatList: FormatType[],
/** Used for RangePicker. `true` means [DateType, DateType] or will be DateType[] */
rangeValue: boolean,
/**
* Trigger order when trigger calendar value change.
* This should only used in SinglePicker with `multiple` mode.
* So when `rangeValue` is `true`, order will be ignored.
*/
order: boolean,
defaultValue?: ValueType,
value?: ValueType,
onCalendarChange?: (
Expand All @@ -117,12 +130,14 @@ export function useInnerValue<ValueType extends DateType[], DateType extends obj

const triggerCalendarChange: TriggerCalendarChange<ValueType> = useEvent(
(nextCalendarValues: ValueType) => {
const clone = [...nextCalendarValues] as ValueType;
let clone = [...nextCalendarValues] as ValueType;

if (rangeValue) {
for (let i = 0; i < 2; i += 1) {
clone[i] = clone[i] || null;
}
} else if (order) {
clone = orderDates(clone, generateConfig);
}

// Update merged value
Expand All @@ -142,7 +157,7 @@ export function useInnerValue<ValueType extends DateType[], DateType extends obj
},
);

const triggerOk = ()=> {
const triggerOk = () => {
if (onOk) {
onOk(calendarValue());
}
Expand Down Expand Up @@ -209,7 +224,7 @@ export default function useRangeValue<ValueType extends DateType[], DateType ext
const triggerSubmit = useEvent((nextValue?: ValueType) => {
const isNullValue = nextValue === null;

const clone = [...(nextValue || submitValue())] as ValueType;
let clone = [...(nextValue || submitValue())] as ValueType;

// Fill null value
if (isNullValue) {
Expand All @@ -224,7 +239,7 @@ export default function useRangeValue<ValueType extends DateType[], DateType ext

// Only when exist value to sort
if (orderOnChange && clone[0] && clone[1]) {
clone.sort((a, b) => (generateConfig.isAfter(a, b) ? 1 : -1));
clone = orderDates(clone, generateConfig);
}

// Sync `calendarValue`
Expand Down
17 changes: 14 additions & 3 deletions tests/multiple.spec.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -25,15 +25,26 @@ describe('Picker.Multiple', () => {

it('onChange', () => {
const onChange = jest.fn();
const { container } = render(<DayPicker multiple onChange={onChange} />);
const onCalendarChange = jest.fn();
const { container } = render(
<DayPicker multiple onChange={onChange} onCalendarChange={onCalendarChange} />,
);

expect(container.querySelector('.rc-picker-multiple')).toBeTruthy();

openPicker(container);
selectCell(1);

// Select 3, 1
selectCell(3);
selectCell(5);
selectCell(1);
expect(onCalendarChange).toHaveBeenCalledWith(
expect.anything(),
['1990-09-01', '1990-09-03'],
expect.anything(),
);

// Select 5
selectCell(5);
expect(onChange).not.toHaveBeenCalled();
expect(isOpen()).toBeTruthy();

Expand Down