Skip to content

Commit a4c2bf7

Browse files
zombieJzombieJ
committed
fix: event
1 parent fe57078 commit a4c2bf7

File tree

5 files changed

+88
-58
lines changed

5 files changed

+88
-58
lines changed

‎src/NewPicker/PickerInput/RangePicker.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -238,6 +238,7 @@ function RangePicker<DateType extends object = any>(
238238
defaultValue,
239239
value,
240240
onCalendarChange,
241+
2,
241242
);
242243

243244
const calendarValue = getCalendarValue();

‎src/NewPicker/PickerInput/SinglePicker.tsx

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -21,14 +21,15 @@ import useCellRender from './hooks/useCellRender';
2121
import useDisabledBoundary from './hooks/useDisabledBoundary';
2222
import { useFieldFormat } from './hooks/useFieldFormat';
2323
import useFilledProps from './hooks/useFilledProps';
24-
import useRangeValue, { useInnerValue } from './hooks/useFlexibleValue';
24+
import useRangeValue from './hooks/useFlexibleValue';
2525
import useInputReadOnly from './hooks/useInputReadOnly';
2626
import useInvalidate from './hooks/useInvalidate';
2727
import useOpen from './hooks/useOpen';
2828
import { usePickerRef } from './hooks/usePickerRef';
2929
import usePresets from './hooks/usePresets';
3030
import useRangeActive from './hooks/useRangeActive';
3131
import useRangePickerValue from './hooks/useRangePickerValue';
32+
import { useInnerValue } from './hooks/useRangeValue';
3233
import useShowNow from './hooks/useShowNow';
3334
import Popup from './Popup';
3435
import SingleSelector from './Selector/SingleSelector';
@@ -183,15 +184,21 @@ function Picker<DateType extends object = any>(
183184
// ======================== Format ========================
184185
const [formatList, maskFormat] = useFieldFormat(internalPicker, locale, format);
185186

187+
// ======================= Calendar =======================
188+
const onInternalCalendarChange: any = (
189+
dates: DateType[],
190+
dateStrings: string[],
191+
info: BaseInfo,
192+
) => {};
193+
186194
// ======================== Values ========================
187195
const [mergedValue, setInnerValue, getCalendarValue, triggerCalendarChange] = useInnerValue(
188-
multiple,
189196
generateConfig,
190197
locale,
191198
formatList,
192199
defaultValue,
193200
value,
194-
onCalendarChange,
201+
onInternalCalendarChange,
195202
);
196203

197204
const calendarValue = getCalendarValue();

‎src/NewPicker/PickerInput/hooks/useFilledProps.ts

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import * as React from 'react';
2+
import { toArray } from '../../../utils/miscUtil';
23
import { fillLocale } from '../../hooks/useLocale';
34
import { getTimeConfig } from '../../hooks/useTimeConfig';
45
import type { InternalMode } from '../../interface';
@@ -20,10 +21,14 @@ type PickedProps<DateType extends object = any> = Pick<
2021
> & {
2122
// RangePicker showTime definition is different with Picker
2223
showTime?: any;
24+
value?: any;
25+
defaultValue?: any;
2326
};
2427

2528
type ExcludeBooleanType<T> = T extends boolean ? never : T;
2629

30+
type ToArrayType<T> = T extends any[] ? T : [T];
31+
2732
/**
2833
* Align the outer props with unique typed and fill undefined props.
2934
* This is shared with both RangePicker and Picker.
@@ -37,9 +42,11 @@ export default function useFilledProps<
3742
props: InProps,
3843
updater?: () => UpdaterProps,
3944
): [
40-
filledProps: Omit<InProps, keyof UpdaterProps | 'showTime'> &
45+
filledProps: Omit<InProps, keyof UpdaterProps | 'showTime' | 'value' | 'defaultValue'> &
4146
UpdaterProps & {
4247
showTime?: ExcludeBooleanType<InProps['showTime']>;
48+
value?: ToArrayType<InProps['value']>;
49+
defaultValue?: ToArrayType<InProps['value']>;
4350
},
4451
internalPicker: InternalMode,
4552
complexPicker: boolean,
@@ -55,8 +62,13 @@ export default function useFilledProps<
5562
allowClear,
5663
clearIcon,
5764
needConfirm,
65+
value,
66+
defaultValue,
5867
} = props;
5968

69+
const values = React.useMemo(() => (value ? toArray(value) : value), [value]);
70+
const defaultValues = React.useMemo(() => toArray(defaultValue), [defaultValue]);
71+
6072
const filledProps = React.useMemo(
6173
() => ({
6274
...props,
@@ -69,6 +81,8 @@ export default function useFilledProps<
6981
components,
7082
clearIcon: fillClearIcon(prefixCls, allowClear, clearIcon),
7183
showTime: getTimeConfig(props),
84+
value: values,
85+
defaultValue: defaultValues,
7286
...updater?.(),
7387
}),
7488
[props],

‎src/NewPicker/PickerInput/hooks/useFlexibleValue.ts

Lines changed: 54 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -18,60 +18,60 @@ const EMPTY_VALUE: any[] = [];
1818

1919
type TriggerCalendarChange<DateType> = (dates: DateType[]) => void;
2020

21-
export function useInnerValue<DateType extends object = any>(
22-
multiple: boolean,
23-
generateConfig: GenerateConfig<DateType>,
24-
locale: Locale,
25-
formatList: FormatType[],
26-
27-
defaultValue?: DateType,
28-
value?: DateType,
29-
onCalendarChange?: PickerProps<DateType>['onCalendarChange'],
30-
) {
31-
// This is the root value which will sync with controlled or uncontrolled value
32-
const [innerValue, setInnerValue] = useMergedState(defaultValue, {
33-
value,
34-
});
35-
const mergedValue = React.useMemo<DateType[]>(() => {
36-
const filledValue = innerValue || EMPTY_VALUE;
37-
38-
return Array.isArray(filledValue) ? filledValue : [filledValue];
39-
}, [innerValue]);
40-
41-
// ========================= Inner Values =========================
42-
const [calendarValue, setCalendarValue] = useCalendarValue(mergedValue);
43-
44-
// ============================ Change ============================
45-
const [getDateTexts, isSameDates] = useUtil<DateType, DateType[]>(
46-
generateConfig,
47-
locale,
48-
formatList,
49-
);
50-
51-
function pickByMultiple<T>(values: T[]): any {
52-
return multiple ? values : values[0];
53-
}
54-
55-
const triggerCalendarChange: TriggerCalendarChange<DateType> = useEvent((dates) => {
56-
const clone: DateType[] = [...dates];
57-
58-
// Update merged value
59-
const [isSameMergedDates, isSameStart] = isSameDates(calendarValue(), clone);
60-
61-
if (!isSameMergedDates) {
62-
setCalendarValue(clone);
63-
64-
// Trigger calendar change event
65-
if (onCalendarChange) {
66-
onCalendarChange(pickByMultiple(clone), pickByMultiple(getDateTexts(clone)), {
67-
range: isSameStart ? 'end' : 'start',
68-
});
69-
}
70-
}
71-
});
72-
73-
return [mergedValue, setInnerValue, calendarValue, triggerCalendarChange] as const;
74-
}
21+
// export function useInnerValue<DateType extends object = any>(
22+
// multiple: boolean,
23+
// generateConfig: GenerateConfig<DateType>,
24+
// locale: Locale,
25+
// formatList: FormatType[],
26+
27+
// defaultValue?: DateType,
28+
// value?: DateType,
29+
// onCalendarChange?: PickerProps<DateType>['onCalendarChange'],
30+
// ) {
31+
// // This is the root value which will sync with controlled or uncontrolled value
32+
// const [innerValue, setInnerValue] = useMergedState(defaultValue, {
33+
// value,
34+
// });
35+
// const mergedValue = React.useMemo<DateType[]>(() => {
36+
// const filledValue = innerValue || EMPTY_VALUE;
37+
38+
// return Array.isArray(filledValue) ? filledValue : [filledValue];
39+
// }, [innerValue]);
40+
41+
// // ========================= Inner Values =========================
42+
// const [calendarValue, setCalendarValue] = useCalendarValue(mergedValue);
43+
44+
// // ============================ Change ============================
45+
// const [getDateTexts, isSameDates] = useUtil<DateType, DateType[]>(
46+
// generateConfig,
47+
// locale,
48+
// formatList,
49+
// );
50+
51+
// function pickByMultiple<T>(values: T[]): any {
52+
// return multiple ? values : values[0];
53+
// }
54+
55+
// const triggerCalendarChange: TriggerCalendarChange<DateType> = useEvent((dates) => {
56+
// const clone: DateType[] = [...dates];
57+
58+
// // Update merged value
59+
// const [isSameMergedDates, isSameStart] = isSameDates(calendarValue(), clone);
60+
61+
// if (!isSameMergedDates) {
62+
// setCalendarValue(clone);
63+
64+
// // Trigger calendar change event
65+
// if (onCalendarChange) {
66+
// onCalendarChange(pickByMultiple(clone), pickByMultiple(getDateTexts(clone)), {
67+
// range: isSameStart ? 'end' : 'start',
68+
// });
69+
// }
70+
// }
71+
// });
72+
73+
// return [mergedValue, setInnerValue, calendarValue, triggerCalendarChange] as const;
74+
// }
7575

7676
export default function useFlexibleValue<DateType extends object = any>(
7777
info: Pick<

‎src/NewPicker/PickerInput/hooks/useRangeValue.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -97,6 +97,8 @@ export function useInnerValue<ValueType extends object[], DateType extends Value
9797
dateStrings: Replace2String<Required<ValueType>>,
9898
info: BaseInfo,
9999
) => void,
100+
/** Used for RangePicker */
101+
valueLen = 2,
100102
) {
101103
// This is the root value which will sync with controlled or uncontrolled value
102104
const [innerValue, setInnerValue] = useMergedState(defaultValue, {
@@ -114,6 +116,12 @@ export function useInnerValue<ValueType extends object[], DateType extends Value
114116
(nextCalendarValues: ValueType) => {
115117
const clone = [...nextCalendarValues] as ValueType;
116118

119+
if (valueLen) {
120+
for (let i = 0; i < valueLen; i += 1) {
121+
clone[i] = clone[i] || null;
122+
}
123+
}
124+
117125
// Update merged value
118126
const [isSameMergedDates, isSameStart] = isSameDates(calendarValue(), clone);
119127

0 commit comments

Comments
 (0)