Skip to content

Commit b5d5272

Browse files
chg (#29592)
1 parent 8f2eb85 commit b5d5272

5 files changed

Lines changed: 28 additions & 28 deletions

File tree

packages/react-components/react-timepicker-compat-preview/etc/react-timepicker-compat-preview.api.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export type TimePickerProps = Omit<ComboboxProps, 'children' | 'defaultSelectedO
2424
endHour?: Hour;
2525
increment?: number;
2626
dateAnchor?: Date;
27-
selectedTime?: Date;
27+
selectedTime?: Date | null;
2828
defaultSelectedTime?: Date;
2929
onTimeSelect?: (event: TimeSelectionEvents, data: TimeSelectionData) => void;
3030
formatDateToTimeString?: (date: Date) => string;
@@ -41,7 +41,7 @@ export type TimePickerState = ComboboxState & Required<Pick<TimePickerProps, 'fr
4141

4242
// @public (undocumented)
4343
export type TimeSelectionData = {
44-
selectedTime: Date | undefined;
44+
selectedTime: Date | null;
4545
selectedTimeText: string | undefined;
4646
error: TimePickerErrorType | undefined;
4747
};

packages/react-components/react-timepicker-compat-preview/src/components/TimePicker/TimePicker.types.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@ export type TimePickerOption = {
5454
export type TimePickerErrorType = 'invalid-input' | 'out-of-bounds';
5555

5656
export type TimeStringValidationResult = {
57-
date?: Date;
57+
date: Date | null;
5858
error?: TimePickerErrorType;
5959
};
6060

@@ -65,7 +65,7 @@ export type TimeSelectionData = {
6565
/**
6666
* The Date object associated with the selected option. For freeform TimePicker it can also be the Date object parsed from the user input.
6767
*/
68-
selectedTime: Date | undefined;
68+
selectedTime: Date | null;
6969
/**
7070
* The display text for the selected option. For freeform TimePicker it can also be the value in user input.
7171
*/
@@ -125,7 +125,7 @@ export type TimePickerProps = Omit<
125125
/**
126126
* Currently selected time in the TimePicker.
127127
*/
128-
selectedTime?: Date;
128+
selectedTime?: Date | null;
129129

130130
/**
131131
* Default selected time in the TimePicker, for uncontrolled scenarios.

packages/react-components/react-timepicker-compat-preview/src/components/TimePicker/timeMath.test.ts

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,8 @@ import {
1010

1111
describe('Time Utilities', () => {
1212
describe('dateToKey', () => {
13-
it('should return empty string for undefined date', () => {
14-
expect(dateToKey()).toBe('');
13+
it('should return empty string for null date', () => {
14+
expect(dateToKey(null)).toBe('');
1515
});
1616

1717
it('should return "invalid" for invalid dates', () => {
@@ -26,12 +26,12 @@ describe('Time Utilities', () => {
2626
});
2727

2828
describe('keyToDate', () => {
29-
it('should return undefined for empty string', () => {
30-
expect(keyToDate('')).toBeUndefined();
29+
it('should return null for empty string', () => {
30+
expect(keyToDate('')).toBeNull();
3131
});
3232

33-
it('should return undefined for "invalid" string', () => {
34-
expect(keyToDate('invalid')).toBeUndefined();
33+
it('should return null for "invalid" string', () => {
34+
expect(keyToDate('invalid')).toBeNull();
3535
});
3636

3737
it('should return date for valid ISO string', () => {
@@ -49,8 +49,8 @@ describe('Time Utilities', () => {
4949
expect(revertedDate?.getTime()).toEqual(originalDate.getTime());
5050
});
5151

52-
it('should be inverses of each other for undefined date', () => {
53-
const originalDate = undefined;
52+
it('should be inverses of each other for null date', () => {
53+
const originalDate = null;
5454
const key = dateToKey(originalDate);
5555
const revertedDate = keyToDate(key);
5656

@@ -62,7 +62,7 @@ describe('Time Utilities', () => {
6262
const key = dateToKey(originalDate);
6363
const revertedDate = keyToDate(key);
6464

65-
expect(revertedDate).toBeUndefined();
65+
expect(revertedDate).toBeNull();
6666
});
6767
});
6868

@@ -165,13 +165,13 @@ describe('Time Utilities', () => {
165165

166166
it('returns an error when no time string is provided', () => {
167167
const result = getDateFromTimeString(undefined, dateStartAnchor, dateEndAnchor, {});
168-
expect(result.date).toBeUndefined();
168+
expect(result.date).toBeNull();
169169
expect(result.error).toBe('invalid-input');
170170
});
171171

172172
it('returns an error for an invalid time string', () => {
173173
const result = getDateFromTimeString('25:30', dateStartAnchor, dateEndAnchor, {});
174-
expect(result.date).toBeUndefined();
174+
expect(result.date).toBeNull();
175175
expect(result.error).toBe('invalid-input');
176176
});
177177

packages/react-components/react-timepicker-compat-preview/src/components/TimePicker/timeMath.ts

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ function isValidDate(date: Date): boolean {
77
/**
88
* Converts a Date object to a string key.
99
*/
10-
export function dateToKey(date?: Date): string {
10+
export function dateToKey(date: Date | null): string {
1111
if (!date) {
1212
return '';
1313
}
@@ -21,12 +21,12 @@ export function dateToKey(date?: Date): string {
2121
* Converts a string key back to a Date object.
2222
* Returns undefined for keys that don't represent valid dates.
2323
*/
24-
export function keyToDate(key: string): Date | undefined {
24+
export function keyToDate(key: string): Date | null {
2525
if (key === '' || key === 'invalid') {
26-
return undefined;
26+
return null;
2727
}
2828
const date = new Date(key);
29-
return isValidDate(date) ? date : undefined;
29+
return isValidDate(date) ? date : null;
3030
}
3131

3232
/**
@@ -157,7 +157,7 @@ export function getDateFromTimeString(
157157
timeFormatOptions: TimeFormatOptions,
158158
): TimeStringValidationResult {
159159
if (!time) {
160-
return { error: 'invalid-input' };
160+
return { date: null, error: 'invalid-input' };
161161
}
162162

163163
const { hour12, showSeconds } = timeFormatOptions;
@@ -171,12 +171,12 @@ export function getDateFromTimeString(
171171
: REGEX_HIDE_SECONDS_HOUR_24;
172172

173173
if (!regex.test(time)) {
174-
return { error: 'invalid-input' };
174+
return { date: null, error: 'invalid-input' };
175175
}
176176

177177
const timeParts = /^(\d\d?):(\d\d):?(\d\d)? ?([ap]m)?/i.exec(time);
178178
if (!timeParts) {
179-
return { error: 'invalid-input' };
179+
return { date: null, error: 'invalid-input' };
180180
}
181181

182182
const [, selectedHours, minutes, seconds, amPm] = timeParts;

packages/react-components/react-timepicker-compat-preview/src/components/TimePicker/useTimePicker.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -29,14 +29,14 @@ export const useTimePicker_unstable = (props: TimePickerProps, ref: React.Ref<HT
2929
dateAnchor: dateAnchorInProps,
3030
defaultSelectedTime: defaultSelectedTimeInProps,
3131
endHour = 24,
32+
formatDateToTimeString,
3233
hour12 = false,
3334
increment = 30,
34-
formatDateToTimeString,
3535
onTimeSelect,
36-
validateFreeFormTime: validateFreeFormTimeInProps,
3736
selectedTime: selectedTimeInProps,
3837
showSeconds = false,
3938
startHour = 0,
39+
validateFreeFormTime: validateFreeFormTimeInProps,
4040
...rest
4141
} = props;
4242
const { freeform = false } = rest;
@@ -64,10 +64,10 @@ export const useTimePicker_unstable = (props: TimePickerProps, ref: React.Ref<HT
6464
[dateStartAnchor, dateEndAnchor, increment, dateToText],
6565
);
6666

67-
const [selectedTime, setSelectedTime] = useControllableState<Date | undefined>({
67+
const [selectedTime, setSelectedTime] = useControllableState<Date | null>({
6868
state: selectedTimeInProps,
6969
defaultState: defaultSelectedTimeInProps,
70-
initialState: undefined,
70+
initialState: null,
7171
});
7272

7373
const [submittedText, setSubmittedText] = React.useState<string | undefined>(undefined);
@@ -142,7 +142,7 @@ const useStableDateAnchor = (providedDate: Date | undefined, startHour: Hour, en
142142
const [fallbackDateAnchor] = React.useState(() => new Date());
143143

144144
// Convert the Date object to a stable key representation. This ensures that the memoization remains stable when a new Date object representing the same date is passed in.
145-
const dateAnchorKey = dateToKey(providedDate);
145+
const dateAnchorKey = dateToKey(providedDate ?? null);
146146
const dateAnchor = React.useMemo(
147147
() => keyToDate(dateAnchorKey) ?? fallbackDateAnchor,
148148
[dateAnchorKey, fallbackDateAnchor],

0 commit comments

Comments
 (0)