@fluentui/react-datepicker-compat 0.6.31 → 0.6.33
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +46 -11
- package/lib/components/DatePicker/useDatePicker.js +3 -2
- package/lib/components/DatePicker/useDatePicker.js.map +1 -1
- package/lib/components/DatePicker/useDatePickerStyles.styles.js +3 -2
- package/lib/components/DatePicker/useDatePickerStyles.styles.js.map +1 -1
- package/lib/components/DatePicker/useDatePickerStyles.styles.raw.js +3 -1
- package/lib/components/DatePicker/useDatePickerStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/DatePicker/useDatePicker.js +3 -2
- package/lib-commonjs/components/DatePicker/useDatePicker.js.map +1 -1
- package/lib-commonjs/components/DatePicker/useDatePickerStyles.styles.js +3 -1
- package/lib-commonjs/components/DatePicker/useDatePickerStyles.styles.js.map +1 -1
- package/lib-commonjs/components/DatePicker/useDatePickerStyles.styles.raw.js +3 -1
- package/lib-commonjs/components/DatePicker/useDatePickerStyles.styles.raw.js.map +1 -1
- package/package.json +10 -10
package/CHANGELOG.md
CHANGED
|
@@ -1,25 +1,60 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-datepicker-compat
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Wed, 24 Jun 2026 11:03:31 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [0.6.33](https://github.com/microsoft/fluentui/tree/@fluentui/react-datepicker-compat_v0.6.33)
|
|
8
|
+
|
|
9
|
+
Wed, 24 Jun 2026 11:03:31 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-datepicker-compat_v0.6.32..@fluentui/react-datepicker-compat_v0.6.33)
|
|
11
|
+
|
|
12
|
+
### Patches
|
|
13
|
+
|
|
14
|
+
- fix: remove redundant use no memo directives, and add justification to valid ones ([PR #36224](https://github.com/microsoft/fluentui/pull/36224) by martinhochel@microsoft.com)
|
|
15
|
+
- Bump @fluentui/react-calendar-compat to v0.4.3 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
|
|
16
|
+
- Bump @fluentui/react-field to v9.5.3 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
|
|
17
|
+
- Bump @fluentui/react-input to v9.8.4 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
|
|
18
|
+
- Bump @fluentui/react-jsx-runtime to v9.4.4 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
|
|
19
|
+
- Bump @fluentui/react-popover to v9.14.4 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
|
|
20
|
+
- Bump @fluentui/react-portal to v9.8.14 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
|
|
21
|
+
- Bump @fluentui/react-positioning to v9.22.3 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
|
|
22
|
+
- Bump @fluentui/react-tabster to v9.26.16 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
|
|
23
|
+
- Bump @fluentui/react-utilities to v9.26.5 ([commit](https://github.com/microsoft/fluentui/commit/a4b871ca80c1f16f35ab4229def4fe02be7f30ea) by beachball)
|
|
24
|
+
|
|
25
|
+
## [0.6.32](https://github.com/microsoft/fluentui/tree/@fluentui/react-datepicker-compat_v0.6.32)
|
|
26
|
+
|
|
27
|
+
Tue, 26 May 2026 09:39:55 GMT
|
|
28
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-datepicker-compat_v0.6.31..@fluentui/react-datepicker-compat_v0.6.32)
|
|
29
|
+
|
|
30
|
+
### Patches
|
|
31
|
+
|
|
32
|
+
- Bump @fluentui/react-calendar-compat to v0.4.2 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
|
|
33
|
+
- Bump @fluentui/react-field to v9.5.2 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
|
|
34
|
+
- Bump @fluentui/react-input to v9.8.3 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
|
|
35
|
+
- Bump @fluentui/react-jsx-runtime to v9.4.3 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
|
|
36
|
+
- Bump @fluentui/react-popover to v9.14.3 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
|
|
37
|
+
- Bump @fluentui/react-portal to v9.8.13 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
|
|
38
|
+
- Bump @fluentui/react-positioning to v9.22.2 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
|
|
39
|
+
- Bump @fluentui/react-tabster to v9.26.15 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
|
|
40
|
+
- Bump @fluentui/react-utilities to v9.26.4 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
|
|
41
|
+
|
|
7
42
|
## [0.6.31](https://github.com/microsoft/fluentui/tree/@fluentui/react-datepicker-compat_v0.6.31)
|
|
8
43
|
|
|
9
|
-
Thu, 23 Apr 2026
|
|
44
|
+
Thu, 23 Apr 2026 14:21:15 GMT
|
|
10
45
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-datepicker-compat_v0.6.30..@fluentui/react-datepicker-compat_v0.6.31)
|
|
11
46
|
|
|
12
47
|
### Patches
|
|
13
48
|
|
|
14
|
-
- Bump @fluentui/react-calendar-compat to v0.4.1 ([PR #
|
|
15
|
-
- Bump @fluentui/react-field to v9.5.1 ([PR #
|
|
16
|
-
- Bump @fluentui/react-input to v9.8.2 ([PR #
|
|
17
|
-
- Bump @fluentui/react-jsx-runtime to v9.4.2 ([PR #
|
|
18
|
-
- Bump @fluentui/react-popover to v9.14.2 ([PR #
|
|
19
|
-
- Bump @fluentui/react-portal to v9.8.12 ([PR #
|
|
20
|
-
- Bump @fluentui/react-positioning to v9.22.1 ([PR #
|
|
21
|
-
- Bump @fluentui/react-tabster to v9.26.14 ([PR #
|
|
22
|
-
- Bump @fluentui/react-utilities to v9.26.3 ([PR #
|
|
49
|
+
- Bump @fluentui/react-calendar-compat to v0.4.1 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
|
|
50
|
+
- Bump @fluentui/react-field to v9.5.1 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
|
|
51
|
+
- Bump @fluentui/react-input to v9.8.2 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
|
|
52
|
+
- Bump @fluentui/react-jsx-runtime to v9.4.2 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
|
|
53
|
+
- Bump @fluentui/react-popover to v9.14.2 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
|
|
54
|
+
- Bump @fluentui/react-portal to v9.8.12 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
|
|
55
|
+
- Bump @fluentui/react-positioning to v9.22.1 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
|
|
56
|
+
- Bump @fluentui/react-tabster to v9.26.14 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
|
|
57
|
+
- Bump @fluentui/react-utilities to v9.26.3 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
|
|
23
58
|
|
|
24
59
|
## [0.6.30](https://github.com/microsoft/fluentui/tree/@fluentui/react-datepicker-compat_v0.6.30)
|
|
25
60
|
|
|
@@ -31,7 +31,6 @@ function useFocusLogic() {
|
|
|
31
31
|
];
|
|
32
32
|
}
|
|
33
33
|
function usePopupVisibility(props) {
|
|
34
|
-
'use no memo';
|
|
35
34
|
const [open, setOpen] = useControllableState({
|
|
36
35
|
initialState: false,
|
|
37
36
|
defaultState: props.defaultOpen,
|
|
@@ -68,6 +67,7 @@ function useSelectedDate({ formatDate, onSelectDate, value }) {
|
|
|
68
67
|
setFormattedDate(newDate && formatDate ? formatDate(newDate) : '');
|
|
69
68
|
};
|
|
70
69
|
React.useEffect(()=>{
|
|
70
|
+
// eslint-disable-next-line react-hooks/set-state-in-effect
|
|
71
71
|
setFormattedDate(value && formatDate ? formatDate(value) : '');
|
|
72
72
|
}, [
|
|
73
73
|
formatDate,
|
|
@@ -94,7 +94,6 @@ const defaultParseDateFromString = (dateStr)=>{
|
|
|
94
94
|
* @param props - props from this instance of DatePicker
|
|
95
95
|
* @param ref - reference to root Input slot
|
|
96
96
|
*/ export const useDatePicker_unstable = (props, ref)=>{
|
|
97
|
-
'use no memo';
|
|
98
97
|
const { allowTextInput = false, allFocusable = false, borderless = false, dateTimeFormatter, defaultOpen = false, disableAutoFocus = true, firstDayOfWeek = DayOfWeek.Sunday, firstWeekOfYear = FirstWeekOfYear.FirstDay, formatDate = defaultFormatDate, highlightCurrentMonth = false, highlightSelectedMonth = false, initialPickerDate: initialPickerDateProp, inlinePopup = false, isMonthPickerVisible = true, maxDate, minDate, mountNode, onOpenChange, onSelectDate: onUserSelectDate, openOnClick = true, onValidationResult, parseDateFromString = defaultParseDateFromString, showCloseButton = false, showGoToToday = true, showMonthPickerAsOverlay = false, showWeekNumbers = false, strings = defaultDatePickerStrings, today, underlined = false, value, ...restOfProps } = props;
|
|
99
98
|
const initialPickerDate = React.useMemo(()=>initialPickerDateProp !== null && initialPickerDateProp !== void 0 ? initialPickerDateProp : new Date(), [
|
|
100
99
|
initialPickerDateProp
|
|
@@ -274,6 +273,7 @@ const defaultParseDateFromString = (dateStr)=>{
|
|
|
274
273
|
if (!preventFocusOpeningPicker.current) {
|
|
275
274
|
showDatePickerPopup();
|
|
276
275
|
}
|
|
276
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
277
277
|
preventFocusOpeningPicker.current = false;
|
|
278
278
|
}
|
|
279
279
|
}, [
|
|
@@ -411,6 +411,7 @@ const defaultParseDateFromString = (dateStr)=>{
|
|
|
411
411
|
open,
|
|
412
412
|
props.disabled
|
|
413
413
|
]);
|
|
414
|
+
// eslint-disable-next-line react-hooks/refs
|
|
414
415
|
const calendarShorthand = slot.always(props.calendar, {
|
|
415
416
|
defaultProps: {
|
|
416
417
|
allFocusable,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/DatePicker/useDatePicker.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ArrowDown, Enter, Escape } from '@fluentui/keyboard-keys';\nimport { Calendar, compareDatePart, DayOfWeek, FirstWeekOfYear } from '@fluentui/react-calendar-compat';\nimport { CalendarMonthRegular } from '@fluentui/react-icons';\nimport { defaultDatePickerStrings } from './defaults';\nimport { Input } from '@fluentui/react-input';\nimport {\n mergeCallbacks,\n useControllableState,\n useEventCallback,\n useId,\n useMergedRefs,\n useOnClickOutside,\n useOnScrollOutside,\n slot,\n} from '@fluentui/react-utilities';\nimport { useFieldContext_unstable as useFieldContext } from '@fluentui/react-field';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useModalAttributes } from '@fluentui/react-tabster';\nimport { usePopupPositioning } from '../../utils/usePopupPositioning';\nimport type { CalendarProps, ICalendar } from '@fluentui/react-calendar-compat';\nimport type { DatePickerProps, DatePickerState, DatePickerValidationResultData } from './DatePicker.types';\nimport type { InputProps, InputOnChangeData } from '@fluentui/react-input';\n\nfunction isDateOutOfBounds(date: Date, minDate?: Date, maxDate?: Date): boolean {\n return (!!minDate && compareDatePart(minDate!, date) > 0) || (!!maxDate && compareDatePart(maxDate!, date) < 0);\n}\n\nfunction useFocusLogic() {\n const inputRef = React.useRef<HTMLInputElement>(null);\n const preventFocusOpeningPicker = React.useRef(false);\n\n const focus = React.useCallback(() => {\n inputRef.current?.focus?.();\n }, []);\n\n const preventNextFocusOpeningPicker = React.useCallback(() => {\n preventFocusOpeningPicker.current = true;\n }, []);\n\n return [focus, inputRef, preventFocusOpeningPicker, preventNextFocusOpeningPicker] as const;\n}\n\nfunction usePopupVisibility(props: DatePickerProps) {\n 'use no memo';\n\n const [open, setOpen] = useControllableState({\n initialState: false,\n defaultState: props.defaultOpen,\n state: props.open,\n });\n const isMounted = React.useRef(false);\n\n React.useEffect(\n () => {\n if (isMounted.current && !open) {\n // If DatePicker's menu (Calendar) is closed, run onAfterMenuDismiss\n props.onOpenChange?.(false);\n }\n isMounted.current = true;\n },\n // Should only run on allowTextInput or open change\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [props.allowTextInput, open],\n );\n\n return [open, setOpen] as const;\n}\n\nfunction useSelectedDate({ formatDate, onSelectDate, value }: DatePickerProps) {\n const [selectedDate, setSelectedDateState] = useControllableState<Date | null | undefined>({\n initialState: null,\n state: value,\n });\n const [formattedDate, setFormattedDate] = React.useState(() => (value && formatDate ? formatDate(value) : ''));\n\n const setSelectedDate = (newDate: Date | null | undefined) => {\n onSelectDate?.(newDate);\n setSelectedDateState(newDate);\n setFormattedDate(newDate && formatDate ? formatDate(newDate) : '');\n };\n\n React.useEffect(() => {\n setFormattedDate(value && formatDate ? formatDate(value) : '');\n }, [formatDate, value]);\n\n return [selectedDate, formattedDate, setSelectedDate, setFormattedDate] as const;\n}\n\nconst defaultFormatDate = (date?: Date) => (date ? date.toDateString() : '');\nconst defaultParseDateFromString = (dateStr: string) => {\n const date = Date.parse(dateStr);\n return date ? new Date(date) : null;\n};\n\n/**\n * Create the state required to render DatePicker.\n *\n * The returned state can be modified with hooks such as useDatePickerStyles_unstable,\n * before being passed to renderDatePicker_unstable.\n *\n * @param props - props from this instance of DatePicker\n * @param ref - reference to root Input slot\n */\nexport const useDatePicker_unstable = (props: DatePickerProps, ref: React.Ref<HTMLInputElement>): DatePickerState => {\n 'use no memo';\n\n const {\n allowTextInput = false,\n allFocusable = false,\n borderless = false,\n dateTimeFormatter,\n defaultOpen = false,\n disableAutoFocus = true,\n firstDayOfWeek = DayOfWeek.Sunday,\n firstWeekOfYear = FirstWeekOfYear.FirstDay,\n formatDate = defaultFormatDate,\n highlightCurrentMonth = false,\n highlightSelectedMonth = false,\n initialPickerDate: initialPickerDateProp,\n inlinePopup = false,\n isMonthPickerVisible = true,\n maxDate,\n minDate,\n mountNode,\n onOpenChange,\n onSelectDate: onUserSelectDate,\n openOnClick = true,\n onValidationResult,\n parseDateFromString = defaultParseDateFromString,\n showCloseButton = false,\n showGoToToday = true,\n showMonthPickerAsOverlay = false,\n showWeekNumbers = false,\n strings = defaultDatePickerStrings,\n today,\n underlined = false,\n value,\n ...restOfProps\n } = props;\n\n const initialPickerDate = React.useMemo(() => initialPickerDateProp ?? new Date(), [initialPickerDateProp]);\n\n const calendar = React.useRef<ICalendar | null>(null);\n const [focus, rootRef, preventFocusOpeningPicker, preventNextFocusOpeningPicker] = useFocusLogic();\n const [selectedDate, formattedDate, setSelectedDate, setFormattedDate] = useSelectedDate({\n formatDate,\n onSelectDate: onUserSelectDate,\n value,\n });\n const [open, setOpenState] = usePopupVisibility(props);\n const fieldContext = useFieldContext();\n const required = fieldContext?.required ?? props.required;\n const defaultId = useId('datePicker-input');\n const popupSurfaceId = useId('datePicker-popupSurface');\n\n const validateTextInput = React.useCallback(\n (date: Date | null = null): void => {\n let error: DatePickerValidationResultData['error'];\n\n if (allowTextInput) {\n if (formattedDate || date) {\n // Don't parse if the selected date has the same formatted string as what we're about to parse.\n // The formatted string might be ambiguous (ex: \"1/2/3\" or \"New Year Eve\") and the parser might\n // not be able to come up with the exact same date.\n if (selectedDate && formatDate && formatDate(date ?? selectedDate) === formattedDate) {\n return;\n }\n date = date || parseDateFromString!(formattedDate);\n\n // Check if date is null or date is an invalid date\n if (!date || isNaN(date.getTime())) {\n // Reset input if formatting is available\n setSelectedDate(selectedDate);\n error = 'invalid-input';\n } else {\n if (isDateOutOfBounds(date, minDate, maxDate)) {\n error = 'out-of-bounds';\n } else {\n setSelectedDate(date);\n }\n }\n } else {\n if (required) {\n error = 'required-input';\n }\n\n onUserSelectDate?.(date);\n }\n } else if (required && !formattedDate) {\n error = 'required-input';\n }\n\n onValidationResult?.({ error });\n },\n [\n allowTextInput,\n formatDate,\n formattedDate,\n maxDate,\n minDate,\n onUserSelectDate,\n onValidationResult,\n parseDateFromString,\n required,\n selectedDate,\n setSelectedDate,\n ],\n );\n\n const setOpen = React.useCallback(\n (newState: boolean) => {\n onOpenChange?.(newState);\n setOpenState(newState);\n\n if (!open && !props.disabled) {\n focus();\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [focus, onOpenChange, props.disabled, setOpenState],\n );\n\n const dismissDatePickerPopup = React.useCallback(\n (newlySelectedDate?: Date | null): void => {\n if (open) {\n setOpen(false);\n\n validateTextInput(newlySelectedDate);\n if (!allowTextInput && newlySelectedDate) {\n setSelectedDate(newlySelectedDate);\n }\n }\n },\n [allowTextInput, open, setOpen, setSelectedDate, validateTextInput],\n );\n\n const showDatePickerPopup = React.useCallback((): void => {\n if (!open) {\n preventNextFocusOpeningPicker();\n setOpen(true);\n }\n }, [open, preventNextFocusOpeningPicker, setOpen]);\n\n /**\n * Callback for closing the calendar callout\n */\n const calendarDismissed = React.useCallback(\n (newlySelectedDate?: Date): void => {\n preventNextFocusOpeningPicker();\n dismissDatePickerPopup(newlySelectedDate);\n },\n [dismissDatePickerPopup, preventNextFocusOpeningPicker],\n );\n\n const onInputChange = React.useCallback(\n (_: React.ChangeEvent<HTMLInputElement>, data: InputOnChangeData) => {\n const { value: newValue } = data;\n\n if (allowTextInput) {\n if (open) {\n dismissDatePickerPopup();\n }\n\n setFormattedDate(newValue);\n }\n },\n [allowTextInput, dismissDatePickerPopup, open, setFormattedDate],\n );\n\n const onInputBlur: React.FocusEventHandler<HTMLInputElement> = React.useCallback((): void => {\n validateTextInput();\n }, [validateTextInput]);\n\n const onInputKeyDown = React.useCallback(\n (ev: React.KeyboardEvent<HTMLElement>): void => {\n switch (ev.key) {\n case Enter:\n ev.preventDefault();\n ev.stopPropagation();\n if (!open) {\n validateTextInput();\n showDatePickerPopup();\n } else {\n // When DatePicker allows input date string directly,\n // it is expected to hit another enter to close the popup\n if (props.allowTextInput) {\n dismissDatePickerPopup();\n }\n }\n break;\n\n case Escape:\n if (open) {\n ev.stopPropagation();\n ev.preventDefault();\n calendarDismissed();\n }\n break;\n\n case ArrowDown:\n ev.preventDefault();\n if (!open) {\n showDatePickerPopup();\n }\n break;\n\n default:\n break;\n }\n },\n [calendarDismissed, dismissDatePickerPopup, open, props.allowTextInput, showDatePickerPopup, validateTextInput],\n );\n\n const onInputFocus: React.FocusEventHandler<HTMLInputElement> = React.useCallback((): void => {\n if (disableAutoFocus) {\n return;\n }\n\n if (!allowTextInput) {\n if (!preventFocusOpeningPicker.current) {\n showDatePickerPopup();\n }\n preventFocusOpeningPicker.current = false;\n }\n }, [allowTextInput, disableAutoFocus, preventFocusOpeningPicker, showDatePickerPopup]);\n\n const onInputClick: React.MouseEventHandler<HTMLInputElement> = React.useCallback((): void => {\n // default openOnClick to !props.disableAutoFocus for legacy support of disableAutoFocus behavior\n if ((props.openOnClick || !props.disableAutoFocus) && !open && !props.disabled) {\n showDatePickerPopup();\n return;\n }\n\n if (allowTextInput) {\n dismissDatePickerPopup();\n }\n }, [\n allowTextInput,\n dismissDatePickerPopup,\n open,\n props.disabled,\n props.disableAutoFocus,\n props.openOnClick,\n showDatePickerPopup,\n ]);\n\n const onIconClick = (ev: React.MouseEvent<HTMLElement>): void => {\n ev.preventDefault();\n ev.stopPropagation();\n if (!open && !props.disabled) {\n showDatePickerPopup();\n } else if (props.allowTextInput) {\n dismissDatePickerPopup();\n }\n };\n\n const inputAppearance: InputProps['appearance'] = underlined\n ? 'underline'\n : borderless\n ? 'filled-lighter'\n : 'outline';\n\n const [triggerWrapperRef, popupRef] = usePopupPositioning(props);\n\n const inputRoot = slot.always(props.root, {\n defaultProps: {\n ref: triggerWrapperRef,\n },\n elementType: 'span',\n });\n inputRoot.ref = useMergedRefs(inputRoot.ref, triggerWrapperRef);\n\n const input = slot.always(props.input, {\n elementType: 'input',\n });\n input.ref = useMergedRefs(input.ref, ref, rootRef);\n\n // Props to create a semantic but non-focusable button on the element with the click-to-open handler\n // Used for voice control and touch screen reader accessibility\n const inputLabelledBy = props['aria-labelledby'];\n const inputId = props.id ?? defaultId;\n const iconA11yProps = React.useMemo(\n () => ({\n role: 'button',\n 'aria-expanded': open,\n 'aria-labelledby': inputLabelledBy ?? inputId,\n }),\n [open, inputLabelledBy, inputId],\n );\n\n const contentAfter = slot.always(props.contentAfter || {}, {\n defaultProps: {\n children: <CalendarMonthRegular />,\n ...iconA11yProps,\n },\n elementType: 'span',\n });\n contentAfter.onClick = useEventCallback(mergeCallbacks(contentAfter.onClick, onIconClick));\n\n const root = slot.always(restOfProps, {\n defaultProps: {\n appearance: inputAppearance,\n 'aria-controls': open ? popupSurfaceId : undefined,\n 'aria-expanded': open,\n 'aria-haspopup': 'dialog',\n readOnly: !allowTextInput,\n role: 'combobox',\n id: inputId,\n },\n elementType: Input,\n });\n root.root = inputRoot;\n root.input = input;\n root.contentAfter = contentAfter;\n root.onChange = useEventCallback(mergeCallbacks(root.onChange, onInputChange));\n root.onBlur = useEventCallback(mergeCallbacks(root.onBlur, onInputBlur));\n root.onKeyDown = useEventCallback(mergeCallbacks(root.onKeyDown, onInputKeyDown));\n root.onFocus = useEventCallback(mergeCallbacks(root.onFocus, onInputFocus));\n root.onClick = useEventCallback(mergeCallbacks(root.onClick, onInputClick));\n\n const { modalAttributes } = useModalAttributes({ trapFocus: true, alwaysFocusable: true, legacyTrapFocus: true });\n const popupSurface = open\n ? slot.optional(props.popupSurface, {\n renderByDefault: true,\n defaultProps: {\n 'aria-label': 'Calendar',\n 'aria-modal': true,\n id: popupSurfaceId,\n role: 'dialog',\n ref: popupRef,\n ...modalAttributes,\n },\n elementType: 'div',\n })\n : undefined;\n const { targetDocument } = useFluent();\n useOnClickOutside({\n element: targetDocument,\n callback: ev => dismissDatePickerPopup(),\n refs: [triggerWrapperRef, popupRef],\n disabled: !open,\n });\n useOnScrollOutside({\n element: targetDocument,\n callback: ev => dismissDatePickerPopup(),\n refs: [triggerWrapperRef, popupRef],\n disabled: !open,\n }); // When the popup is opened, focus should go to the calendar.\n // In v8 this was done by focusing after the callout was positioned, but in v9 this can be simulated by using a\n // useEffect hook.\n React.useEffect(() => {\n if (open && !props.disabled && calendar.current) {\n calendar.current.focus();\n }\n }, [disableAutoFocus, open, props.disabled]);\n const calendarShorthand = slot.always(props.calendar, {\n defaultProps: {\n allFocusable,\n componentRef: calendar,\n dateTimeFormatter,\n firstDayOfWeek,\n firstWeekOfYear,\n highlightCurrentMonth,\n highlightSelectedMonth,\n isMonthPickerVisible,\n maxDate,\n minDate,\n showCloseButton,\n showGoToToday,\n showMonthPickerAsOverlay,\n showWeekNumbers,\n strings,\n today,\n value: selectedDate || initialPickerDate,\n },\n elementType: Calendar,\n });\n calendarShorthand.onDismiss = useEventCallback(mergeCallbacks(calendarShorthand.onDismiss, calendarDismissed));\n calendarShorthand.onSelectDate = useEventCallback(mergeCallbacks(calendarShorthand.onSelectDate, calendarDismissed));\n const state: DatePickerState = {\n disabled: !!props.disabled,\n inlinePopup,\n components: { root: Input, calendar: Calendar as React.FC<Partial<CalendarProps>>, popupSurface: 'div' },\n calendar: calendarShorthand,\n mountNode,\n root,\n popupSurface,\n };\n\n state.root.value = formattedDate;\n\n return state;\n};\n"],"names":["React","ArrowDown","Enter","Escape","Calendar","compareDatePart","DayOfWeek","FirstWeekOfYear","CalendarMonthRegular","defaultDatePickerStrings","Input","mergeCallbacks","useControllableState","useEventCallback","useId","useMergedRefs","useOnClickOutside","useOnScrollOutside","slot","useFieldContext_unstable","useFieldContext","useFluent_unstable","useFluent","useModalAttributes","usePopupPositioning","isDateOutOfBounds","date","minDate","maxDate","useFocusLogic","inputRef","useRef","preventFocusOpeningPicker","focus","useCallback","current","preventNextFocusOpeningPicker","usePopupVisibility","props","open","setOpen","initialState","defaultState","defaultOpen","state","isMounted","useEffect","onOpenChange","allowTextInput","useSelectedDate","formatDate","onSelectDate","value","selectedDate","setSelectedDateState","formattedDate","setFormattedDate","useState","setSelectedDate","newDate","defaultFormatDate","toDateString","defaultParseDateFromString","dateStr","Date","parse","useDatePicker_unstable","ref","allFocusable","borderless","dateTimeFormatter","disableAutoFocus","firstDayOfWeek","Sunday","firstWeekOfYear","FirstDay","highlightCurrentMonth","highlightSelectedMonth","initialPickerDate","initialPickerDateProp","inlinePopup","isMonthPickerVisible","mountNode","onUserSelectDate","openOnClick","onValidationResult","parseDateFromString","showCloseButton","showGoToToday","showMonthPickerAsOverlay","showWeekNumbers","strings","today","underlined","restOfProps","useMemo","calendar","rootRef","setOpenState","fieldContext","required","defaultId","popupSurfaceId","validateTextInput","error","isNaN","getTime","newState","disabled","dismissDatePickerPopup","newlySelectedDate","showDatePickerPopup","calendarDismissed","onInputChange","_","data","newValue","onInputBlur","onInputKeyDown","ev","key","preventDefault","stopPropagation","onInputFocus","onInputClick","onIconClick","inputAppearance","triggerWrapperRef","popupRef","inputRoot","always","root","defaultProps","elementType","input","inputLabelledBy","inputId","id","iconA11yProps","role","contentAfter","children","onClick","appearance","undefined","readOnly","onChange","onBlur","onKeyDown","onFocus","modalAttributes","trapFocus","alwaysFocusable","legacyTrapFocus","popupSurface","optional","renderByDefault","targetDocument","element","callback","refs","calendarShorthand","componentRef","onDismiss","components"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../src/components/DatePicker/useDatePicker.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ArrowDown, Enter, Escape } from '@fluentui/keyboard-keys';\nimport { Calendar, compareDatePart, DayOfWeek, FirstWeekOfYear } from '@fluentui/react-calendar-compat';\nimport { CalendarMonthRegular } from '@fluentui/react-icons';\nimport { defaultDatePickerStrings } from './defaults';\nimport { Input } from '@fluentui/react-input';\nimport {\n mergeCallbacks,\n useControllableState,\n useEventCallback,\n useId,\n useMergedRefs,\n useOnClickOutside,\n useOnScrollOutside,\n slot,\n} from '@fluentui/react-utilities';\nimport { useFieldContext_unstable as useFieldContext } from '@fluentui/react-field';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useModalAttributes } from '@fluentui/react-tabster';\nimport { usePopupPositioning } from '../../utils/usePopupPositioning';\nimport type { CalendarProps, ICalendar } from '@fluentui/react-calendar-compat';\nimport type { DatePickerProps, DatePickerState, DatePickerValidationResultData } from './DatePicker.types';\nimport type { InputProps, InputOnChangeData } from '@fluentui/react-input';\n\nfunction isDateOutOfBounds(date: Date, minDate?: Date, maxDate?: Date): boolean {\n return (!!minDate && compareDatePart(minDate!, date) > 0) || (!!maxDate && compareDatePart(maxDate!, date) < 0);\n}\n\nfunction useFocusLogic() {\n const inputRef = React.useRef<HTMLInputElement>(null);\n const preventFocusOpeningPicker = React.useRef(false);\n\n const focus = React.useCallback(() => {\n inputRef.current?.focus?.();\n }, []);\n\n const preventNextFocusOpeningPicker = React.useCallback(() => {\n preventFocusOpeningPicker.current = true;\n }, []);\n\n return [focus, inputRef, preventFocusOpeningPicker, preventNextFocusOpeningPicker] as const;\n}\n\nfunction usePopupVisibility(props: DatePickerProps) {\n const [open, setOpen] = useControllableState({\n initialState: false,\n defaultState: props.defaultOpen,\n state: props.open,\n });\n const isMounted = React.useRef(false);\n\n React.useEffect(\n () => {\n if (isMounted.current && !open) {\n // If DatePicker's menu (Calendar) is closed, run onAfterMenuDismiss\n props.onOpenChange?.(false);\n }\n isMounted.current = true;\n },\n // Should only run on allowTextInput or open change\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [props.allowTextInput, open],\n );\n\n return [open, setOpen] as const;\n}\n\nfunction useSelectedDate({ formatDate, onSelectDate, value }: DatePickerProps) {\n const [selectedDate, setSelectedDateState] = useControllableState<Date | null | undefined>({\n initialState: null,\n state: value,\n });\n const [formattedDate, setFormattedDate] = React.useState(() => (value && formatDate ? formatDate(value) : ''));\n\n const setSelectedDate = (newDate: Date | null | undefined) => {\n onSelectDate?.(newDate);\n setSelectedDateState(newDate);\n setFormattedDate(newDate && formatDate ? formatDate(newDate) : '');\n };\n\n React.useEffect(() => {\n // eslint-disable-next-line react-hooks/set-state-in-effect\n setFormattedDate(value && formatDate ? formatDate(value) : '');\n }, [formatDate, value]);\n\n return [selectedDate, formattedDate, setSelectedDate, setFormattedDate] as const;\n}\n\nconst defaultFormatDate = (date?: Date) => (date ? date.toDateString() : '');\nconst defaultParseDateFromString = (dateStr: string) => {\n const date = Date.parse(dateStr);\n return date ? new Date(date) : null;\n};\n\n/**\n * Create the state required to render DatePicker.\n *\n * The returned state can be modified with hooks such as useDatePickerStyles_unstable,\n * before being passed to renderDatePicker_unstable.\n *\n * @param props - props from this instance of DatePicker\n * @param ref - reference to root Input slot\n */\nexport const useDatePicker_unstable = (props: DatePickerProps, ref: React.Ref<HTMLInputElement>): DatePickerState => {\n const {\n allowTextInput = false,\n allFocusable = false,\n borderless = false,\n dateTimeFormatter,\n defaultOpen = false,\n disableAutoFocus = true,\n firstDayOfWeek = DayOfWeek.Sunday,\n firstWeekOfYear = FirstWeekOfYear.FirstDay,\n formatDate = defaultFormatDate,\n highlightCurrentMonth = false,\n highlightSelectedMonth = false,\n initialPickerDate: initialPickerDateProp,\n inlinePopup = false,\n isMonthPickerVisible = true,\n maxDate,\n minDate,\n mountNode,\n onOpenChange,\n onSelectDate: onUserSelectDate,\n openOnClick = true,\n onValidationResult,\n parseDateFromString = defaultParseDateFromString,\n showCloseButton = false,\n showGoToToday = true,\n showMonthPickerAsOverlay = false,\n showWeekNumbers = false,\n strings = defaultDatePickerStrings,\n today,\n underlined = false,\n value,\n ...restOfProps\n } = props;\n\n const initialPickerDate = React.useMemo(() => initialPickerDateProp ?? new Date(), [initialPickerDateProp]);\n\n const calendar = React.useRef<ICalendar | null>(null);\n const [focus, rootRef, preventFocusOpeningPicker, preventNextFocusOpeningPicker] = useFocusLogic();\n const [selectedDate, formattedDate, setSelectedDate, setFormattedDate] = useSelectedDate({\n formatDate,\n onSelectDate: onUserSelectDate,\n value,\n });\n const [open, setOpenState] = usePopupVisibility(props);\n const fieldContext = useFieldContext();\n const required = fieldContext?.required ?? props.required;\n const defaultId = useId('datePicker-input');\n const popupSurfaceId = useId('datePicker-popupSurface');\n\n const validateTextInput = React.useCallback(\n (date: Date | null = null): void => {\n let error: DatePickerValidationResultData['error'];\n\n if (allowTextInput) {\n if (formattedDate || date) {\n // Don't parse if the selected date has the same formatted string as what we're about to parse.\n // The formatted string might be ambiguous (ex: \"1/2/3\" or \"New Year Eve\") and the parser might\n // not be able to come up with the exact same date.\n if (selectedDate && formatDate && formatDate(date ?? selectedDate) === formattedDate) {\n return;\n }\n date = date || parseDateFromString!(formattedDate);\n\n // Check if date is null or date is an invalid date\n if (!date || isNaN(date.getTime())) {\n // Reset input if formatting is available\n setSelectedDate(selectedDate);\n error = 'invalid-input';\n } else {\n if (isDateOutOfBounds(date, minDate, maxDate)) {\n error = 'out-of-bounds';\n } else {\n setSelectedDate(date);\n }\n }\n } else {\n if (required) {\n error = 'required-input';\n }\n\n onUserSelectDate?.(date);\n }\n } else if (required && !formattedDate) {\n error = 'required-input';\n }\n\n onValidationResult?.({ error });\n },\n [\n allowTextInput,\n formatDate,\n formattedDate,\n maxDate,\n minDate,\n onUserSelectDate,\n onValidationResult,\n parseDateFromString,\n required,\n selectedDate,\n setSelectedDate,\n ],\n );\n\n const setOpen = React.useCallback(\n (newState: boolean) => {\n onOpenChange?.(newState);\n setOpenState(newState);\n\n if (!open && !props.disabled) {\n focus();\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [focus, onOpenChange, props.disabled, setOpenState],\n );\n\n const dismissDatePickerPopup = React.useCallback(\n (newlySelectedDate?: Date | null): void => {\n if (open) {\n setOpen(false);\n\n validateTextInput(newlySelectedDate);\n if (!allowTextInput && newlySelectedDate) {\n setSelectedDate(newlySelectedDate);\n }\n }\n },\n [allowTextInput, open, setOpen, setSelectedDate, validateTextInput],\n );\n\n const showDatePickerPopup = React.useCallback((): void => {\n if (!open) {\n preventNextFocusOpeningPicker();\n setOpen(true);\n }\n }, [open, preventNextFocusOpeningPicker, setOpen]);\n\n /**\n * Callback for closing the calendar callout\n */\n const calendarDismissed = React.useCallback(\n (newlySelectedDate?: Date): void => {\n preventNextFocusOpeningPicker();\n dismissDatePickerPopup(newlySelectedDate);\n },\n [dismissDatePickerPopup, preventNextFocusOpeningPicker],\n );\n\n const onInputChange = React.useCallback(\n (_: React.ChangeEvent<HTMLInputElement>, data: InputOnChangeData) => {\n const { value: newValue } = data;\n\n if (allowTextInput) {\n if (open) {\n dismissDatePickerPopup();\n }\n\n setFormattedDate(newValue);\n }\n },\n [allowTextInput, dismissDatePickerPopup, open, setFormattedDate],\n );\n\n const onInputBlur: React.FocusEventHandler<HTMLInputElement> = React.useCallback((): void => {\n validateTextInput();\n }, [validateTextInput]);\n\n const onInputKeyDown = React.useCallback(\n (ev: React.KeyboardEvent<HTMLElement>): void => {\n switch (ev.key) {\n case Enter:\n ev.preventDefault();\n ev.stopPropagation();\n if (!open) {\n validateTextInput();\n showDatePickerPopup();\n } else {\n // When DatePicker allows input date string directly,\n // it is expected to hit another enter to close the popup\n if (props.allowTextInput) {\n dismissDatePickerPopup();\n }\n }\n break;\n\n case Escape:\n if (open) {\n ev.stopPropagation();\n ev.preventDefault();\n calendarDismissed();\n }\n break;\n\n case ArrowDown:\n ev.preventDefault();\n if (!open) {\n showDatePickerPopup();\n }\n break;\n\n default:\n break;\n }\n },\n [calendarDismissed, dismissDatePickerPopup, open, props.allowTextInput, showDatePickerPopup, validateTextInput],\n );\n\n const onInputFocus: React.FocusEventHandler<HTMLInputElement> = React.useCallback((): void => {\n if (disableAutoFocus) {\n return;\n }\n\n if (!allowTextInput) {\n if (!preventFocusOpeningPicker.current) {\n showDatePickerPopup();\n }\n // eslint-disable-next-line react-hooks/immutability\n preventFocusOpeningPicker.current = false;\n }\n }, [allowTextInput, disableAutoFocus, preventFocusOpeningPicker, showDatePickerPopup]);\n\n const onInputClick: React.MouseEventHandler<HTMLInputElement> = React.useCallback((): void => {\n // default openOnClick to !props.disableAutoFocus for legacy support of disableAutoFocus behavior\n if ((props.openOnClick || !props.disableAutoFocus) && !open && !props.disabled) {\n showDatePickerPopup();\n return;\n }\n\n if (allowTextInput) {\n dismissDatePickerPopup();\n }\n }, [\n allowTextInput,\n dismissDatePickerPopup,\n open,\n props.disabled,\n props.disableAutoFocus,\n props.openOnClick,\n showDatePickerPopup,\n ]);\n\n const onIconClick = (ev: React.MouseEvent<HTMLElement>): void => {\n ev.preventDefault();\n ev.stopPropagation();\n if (!open && !props.disabled) {\n showDatePickerPopup();\n } else if (props.allowTextInput) {\n dismissDatePickerPopup();\n }\n };\n\n const inputAppearance: InputProps['appearance'] = underlined\n ? 'underline'\n : borderless\n ? 'filled-lighter'\n : 'outline';\n\n const [triggerWrapperRef, popupRef] = usePopupPositioning(props);\n\n const inputRoot = slot.always(props.root, {\n defaultProps: {\n ref: triggerWrapperRef,\n },\n elementType: 'span',\n });\n inputRoot.ref = useMergedRefs(inputRoot.ref, triggerWrapperRef);\n\n const input = slot.always(props.input, {\n elementType: 'input',\n });\n input.ref = useMergedRefs(input.ref, ref, rootRef);\n\n // Props to create a semantic but non-focusable button on the element with the click-to-open handler\n // Used for voice control and touch screen reader accessibility\n const inputLabelledBy = props['aria-labelledby'];\n const inputId = props.id ?? defaultId;\n const iconA11yProps = React.useMemo(\n () => ({\n role: 'button',\n 'aria-expanded': open,\n 'aria-labelledby': inputLabelledBy ?? inputId,\n }),\n [open, inputLabelledBy, inputId],\n );\n\n const contentAfter = slot.always(props.contentAfter || {}, {\n defaultProps: {\n children: <CalendarMonthRegular />,\n ...iconA11yProps,\n },\n elementType: 'span',\n });\n contentAfter.onClick = useEventCallback(mergeCallbacks(contentAfter.onClick, onIconClick));\n\n const root = slot.always(restOfProps, {\n defaultProps: {\n appearance: inputAppearance,\n 'aria-controls': open ? popupSurfaceId : undefined,\n 'aria-expanded': open,\n 'aria-haspopup': 'dialog',\n readOnly: !allowTextInput,\n role: 'combobox',\n id: inputId,\n },\n elementType: Input,\n });\n root.root = inputRoot;\n root.input = input;\n root.contentAfter = contentAfter;\n root.onChange = useEventCallback(mergeCallbacks(root.onChange, onInputChange));\n root.onBlur = useEventCallback(mergeCallbacks(root.onBlur, onInputBlur));\n root.onKeyDown = useEventCallback(mergeCallbacks(root.onKeyDown, onInputKeyDown));\n root.onFocus = useEventCallback(mergeCallbacks(root.onFocus, onInputFocus));\n root.onClick = useEventCallback(mergeCallbacks(root.onClick, onInputClick));\n\n const { modalAttributes } = useModalAttributes({ trapFocus: true, alwaysFocusable: true, legacyTrapFocus: true });\n const popupSurface = open\n ? slot.optional(props.popupSurface, {\n renderByDefault: true,\n defaultProps: {\n 'aria-label': 'Calendar',\n 'aria-modal': true,\n id: popupSurfaceId,\n role: 'dialog',\n ref: popupRef,\n ...modalAttributes,\n },\n elementType: 'div',\n })\n : undefined;\n const { targetDocument } = useFluent();\n useOnClickOutside({\n element: targetDocument,\n callback: ev => dismissDatePickerPopup(),\n refs: [triggerWrapperRef, popupRef],\n disabled: !open,\n });\n useOnScrollOutside({\n element: targetDocument,\n callback: ev => dismissDatePickerPopup(),\n refs: [triggerWrapperRef, popupRef],\n disabled: !open,\n }); // When the popup is opened, focus should go to the calendar.\n // In v8 this was done by focusing after the callout was positioned, but in v9 this can be simulated by using a\n // useEffect hook.\n React.useEffect(() => {\n if (open && !props.disabled && calendar.current) {\n calendar.current.focus();\n }\n }, [disableAutoFocus, open, props.disabled]);\n // eslint-disable-next-line react-hooks/refs\n const calendarShorthand = slot.always(props.calendar, {\n defaultProps: {\n allFocusable,\n componentRef: calendar,\n dateTimeFormatter,\n firstDayOfWeek,\n firstWeekOfYear,\n highlightCurrentMonth,\n highlightSelectedMonth,\n isMonthPickerVisible,\n maxDate,\n minDate,\n showCloseButton,\n showGoToToday,\n showMonthPickerAsOverlay,\n showWeekNumbers,\n strings,\n today,\n value: selectedDate || initialPickerDate,\n },\n elementType: Calendar,\n });\n calendarShorthand.onDismiss = useEventCallback(mergeCallbacks(calendarShorthand.onDismiss, calendarDismissed));\n calendarShorthand.onSelectDate = useEventCallback(mergeCallbacks(calendarShorthand.onSelectDate, calendarDismissed));\n const state: DatePickerState = {\n disabled: !!props.disabled,\n inlinePopup,\n components: { root: Input, calendar: Calendar as React.FC<Partial<CalendarProps>>, popupSurface: 'div' },\n calendar: calendarShorthand,\n mountNode,\n root,\n popupSurface,\n };\n\n state.root.value = formattedDate;\n\n return state;\n};\n"],"names":["React","ArrowDown","Enter","Escape","Calendar","compareDatePart","DayOfWeek","FirstWeekOfYear","CalendarMonthRegular","defaultDatePickerStrings","Input","mergeCallbacks","useControllableState","useEventCallback","useId","useMergedRefs","useOnClickOutside","useOnScrollOutside","slot","useFieldContext_unstable","useFieldContext","useFluent_unstable","useFluent","useModalAttributes","usePopupPositioning","isDateOutOfBounds","date","minDate","maxDate","useFocusLogic","inputRef","useRef","preventFocusOpeningPicker","focus","useCallback","current","preventNextFocusOpeningPicker","usePopupVisibility","props","open","setOpen","initialState","defaultState","defaultOpen","state","isMounted","useEffect","onOpenChange","allowTextInput","useSelectedDate","formatDate","onSelectDate","value","selectedDate","setSelectedDateState","formattedDate","setFormattedDate","useState","setSelectedDate","newDate","defaultFormatDate","toDateString","defaultParseDateFromString","dateStr","Date","parse","useDatePicker_unstable","ref","allFocusable","borderless","dateTimeFormatter","disableAutoFocus","firstDayOfWeek","Sunday","firstWeekOfYear","FirstDay","highlightCurrentMonth","highlightSelectedMonth","initialPickerDate","initialPickerDateProp","inlinePopup","isMonthPickerVisible","mountNode","onUserSelectDate","openOnClick","onValidationResult","parseDateFromString","showCloseButton","showGoToToday","showMonthPickerAsOverlay","showWeekNumbers","strings","today","underlined","restOfProps","useMemo","calendar","rootRef","setOpenState","fieldContext","required","defaultId","popupSurfaceId","validateTextInput","error","isNaN","getTime","newState","disabled","dismissDatePickerPopup","newlySelectedDate","showDatePickerPopup","calendarDismissed","onInputChange","_","data","newValue","onInputBlur","onInputKeyDown","ev","key","preventDefault","stopPropagation","onInputFocus","onInputClick","onIconClick","inputAppearance","triggerWrapperRef","popupRef","inputRoot","always","root","defaultProps","elementType","input","inputLabelledBy","inputId","id","iconA11yProps","role","contentAfter","children","onClick","appearance","undefined","readOnly","onChange","onBlur","onKeyDown","onFocus","modalAttributes","trapFocus","alwaysFocusable","legacyTrapFocus","popupSurface","optional","renderByDefault","targetDocument","element","callback","refs","calendarShorthand","componentRef","onDismiss","components"],"mappings":"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"}
|
|
@@ -28,18 +28,19 @@ const usePopupSurfaceClassName = /*#__PURE__*/__resetStyles("r1ytv1z8", null, ["
|
|
|
28
28
|
* Apply styling to the DatePicker slots based on the state
|
|
29
29
|
*/
|
|
30
30
|
export const useDatePickerStyles_unstable = state => {
|
|
31
|
-
'use no memo';
|
|
32
|
-
|
|
33
31
|
const styles = useStyles();
|
|
34
32
|
const popupSurfaceClassName = usePopupSurfaceClassName();
|
|
35
33
|
const {
|
|
36
34
|
disabled,
|
|
37
35
|
inlinePopup
|
|
38
36
|
} = state;
|
|
37
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
39
38
|
state.root.className = mergeClasses(datePickerClassNames.root, styles.base, disabled && styles.disabled, state.root.className);
|
|
40
39
|
if (state.popupSurface) {
|
|
40
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
41
41
|
state.popupSurface.className = mergeClasses(datePickerClassNames.popupSurface, popupSurfaceClassName, state.popupSurface.className, inlinePopup && styles.inline);
|
|
42
42
|
}
|
|
43
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
43
44
|
state.calendar.className = mergeClasses(datePickerClassNames.calendar, state.calendar.className);
|
|
44
45
|
return state;
|
|
45
46
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["__resetStyles","__styles","mergeClasses","tokens","typographyStyles","datePickerClassNames","root","calendar","popupSurface","useStyles","base","qhf8xq","Bceei9c","xfaavh","disabled","inline","Bj3rh1h","d","usePopupSurfaceClassName","useDatePickerStyles_unstable","state","styles","popupSurfaceClassName","inlinePopup","className"],"sources":["useDatePickerStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const datePickerClassNames = {\n root: 'fui-DatePicker',\n calendar: 'fui-DatePicker__calendar',\n popupSurface: 'fui-DatePicker__popupSurface'\n};\nconst useStyles = makeStyles({\n base: {\n position: 'relative',\n cursor: 'pointer',\n '& input': {\n cursor: 'pointer'\n }\n },\n disabled: {\n cursor: 'default',\n '& input': {\n cursor: 'default'\n }\n },\n inline: {\n // When rendering inline, the popupSurface will be rendered under relatively positioned elements such as Input.\n // This is due to the surface being positioned as absolute, therefore zIndex: 1 ensures that won't happen.\n zIndex: 1\n }\n});\nconst usePopupSurfaceClassName = makeResetStyles({\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow16,\n borderRadius: tokens.borderRadiusMedium,\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: tokens.colorTransparentStroke,\n display: 'inline-flex',\n color: tokens.colorNeutralForeground1,\n ...typographyStyles.body1\n});\n/**\n * Apply styling to the DatePicker slots based on the state\n */ export const useDatePickerStyles_unstable = (state)=>{\n
|
|
1
|
+
{"version":3,"names":["__resetStyles","__styles","mergeClasses","tokens","typographyStyles","datePickerClassNames","root","calendar","popupSurface","useStyles","base","qhf8xq","Bceei9c","xfaavh","disabled","inline","Bj3rh1h","d","usePopupSurfaceClassName","useDatePickerStyles_unstable","state","styles","popupSurfaceClassName","inlinePopup","className"],"sources":["useDatePickerStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const datePickerClassNames = {\n root: 'fui-DatePicker',\n calendar: 'fui-DatePicker__calendar',\n popupSurface: 'fui-DatePicker__popupSurface'\n};\nconst useStyles = makeStyles({\n base: {\n position: 'relative',\n cursor: 'pointer',\n '& input': {\n cursor: 'pointer'\n }\n },\n disabled: {\n cursor: 'default',\n '& input': {\n cursor: 'default'\n }\n },\n inline: {\n // When rendering inline, the popupSurface will be rendered under relatively positioned elements such as Input.\n // This is due to the surface being positioned as absolute, therefore zIndex: 1 ensures that won't happen.\n zIndex: 1\n }\n});\nconst usePopupSurfaceClassName = makeResetStyles({\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow16,\n borderRadius: tokens.borderRadiusMedium,\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: tokens.colorTransparentStroke,\n display: 'inline-flex',\n color: tokens.colorNeutralForeground1,\n ...typographyStyles.body1\n});\n/**\n * Apply styling to the DatePicker slots based on the state\n */ export const useDatePickerStyles_unstable = (state)=>{\n const styles = useStyles();\n const popupSurfaceClassName = usePopupSurfaceClassName();\n const { disabled, inlinePopup } = state;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(datePickerClassNames.root, styles.base, disabled && styles.disabled, state.root.className);\n if (state.popupSurface) {\n // eslint-disable-next-line react-hooks/immutability\n state.popupSurface.className = mergeClasses(datePickerClassNames.popupSurface, popupSurfaceClassName, state.popupSurface.className, inlinePopup && styles.inline);\n }\n // eslint-disable-next-line react-hooks/immutability\n state.calendar.className = mergeClasses(datePickerClassNames.calendar, state.calendar.className);\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,aAAA,EAAAC,QAAA,EAAsCC,YAAY,QAAQ,gBAAgB;AAC1E,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,uBAAuB;AAChE,OAAO,MAAMC,oBAAoB,GAAG;EAChCC,IAAI,EAAE,gBAAgB;EACtBC,QAAQ,EAAE,0BAA0B;EACpCC,YAAY,EAAE;AAClB,CAAC;AACD,MAAMC,SAAS,gBAAGR,QAAA;EAAAS,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,QAAA;IAAAF,OAAA;IAAAC,MAAA;EAAA;EAAAE,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAmBjB,CAAC;AACF,MAAMC,wBAAwB,gBAAGlB,aAAA,0aAUhC,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMmB,4BAA4B,GAAIC,KAAK,IAAG;EACrD,MAAMC,MAAM,GAAGZ,SAAS,CAAC,CAAC;EAC1B,MAAMa,qBAAqB,GAAGJ,wBAAwB,CAAC,CAAC;EACxD,MAAM;IAAEJ,QAAQ;IAAES;EAAY,CAAC,GAAGH,KAAK;EACvC;EACAA,KAAK,CAACd,IAAI,CAACkB,SAAS,GAAGtB,YAAY,CAACG,oBAAoB,CAACC,IAAI,EAAEe,MAAM,CAACX,IAAI,EAAEI,QAAQ,IAAIO,MAAM,CAACP,QAAQ,EAAEM,KAAK,CAACd,IAAI,CAACkB,SAAS,CAAC;EAC9H,IAAIJ,KAAK,CAACZ,YAAY,EAAE;IACpB;IACAY,KAAK,CAACZ,YAAY,CAACgB,SAAS,GAAGtB,YAAY,CAACG,oBAAoB,CAACG,YAAY,EAAEc,qBAAqB,EAAEF,KAAK,CAACZ,YAAY,CAACgB,SAAS,EAAED,WAAW,IAAIF,MAAM,CAACN,MAAM,CAAC;EACrK;EACA;EACAK,KAAK,CAACb,QAAQ,CAACiB,SAAS,GAAGtB,YAAY,CAACG,oBAAoB,CAACE,QAAQ,EAAEa,KAAK,CAACb,QAAQ,CAACiB,SAAS,CAAC;EAChG,OAAOJ,KAAK;AAChB,CAAC","ignoreList":[]}
|
|
@@ -40,14 +40,16 @@ const usePopupSurfaceClassName = makeResetStyles({
|
|
|
40
40
|
/**
|
|
41
41
|
* Apply styling to the DatePicker slots based on the state
|
|
42
42
|
*/ export const useDatePickerStyles_unstable = (state)=>{
|
|
43
|
-
'use no memo';
|
|
44
43
|
const styles = useStyles();
|
|
45
44
|
const popupSurfaceClassName = usePopupSurfaceClassName();
|
|
46
45
|
const { disabled, inlinePopup } = state;
|
|
46
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
47
47
|
state.root.className = mergeClasses(datePickerClassNames.root, styles.base, disabled && styles.disabled, state.root.className);
|
|
48
48
|
if (state.popupSurface) {
|
|
49
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
49
50
|
state.popupSurface.className = mergeClasses(datePickerClassNames.popupSurface, popupSurfaceClassName, state.popupSurface.className, inlinePopup && styles.inline);
|
|
50
51
|
}
|
|
52
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
51
53
|
state.calendar.className = mergeClasses(datePickerClassNames.calendar, state.calendar.className);
|
|
52
54
|
return state;
|
|
53
55
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/DatePicker/useDatePickerStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { DatePickerSlots, DatePickerState } from './DatePicker.types';\n\nexport const datePickerClassNames: SlotClassNames<DatePickerSlots> = {\n root: 'fui-DatePicker',\n calendar: 'fui-DatePicker__calendar',\n popupSurface: 'fui-DatePicker__popupSurface',\n};\n\nconst useStyles = makeStyles({\n base: {\n position: 'relative',\n cursor: 'pointer',\n '& input': {\n cursor: 'pointer',\n },\n },\n disabled: {\n cursor: 'default',\n '& input': {\n cursor: 'default',\n },\n },\n inline: {\n // When rendering inline, the popupSurface will be rendered under relatively positioned elements such as Input.\n // This is due to the surface being positioned as absolute, therefore zIndex: 1 ensures that won't happen.\n zIndex: 1,\n },\n});\n\nconst usePopupSurfaceClassName = makeResetStyles({\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow16,\n borderRadius: tokens.borderRadiusMedium,\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: tokens.colorTransparentStroke,\n display: 'inline-flex',\n color: tokens.colorNeutralForeground1,\n ...typographyStyles.body1,\n});\n\n/**\n * Apply styling to the DatePicker slots based on the state\n */\nexport const useDatePickerStyles_unstable = (state: DatePickerState): DatePickerState => {\n
|
|
1
|
+
{"version":3,"sources":["../src/components/DatePicker/useDatePickerStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { DatePickerSlots, DatePickerState } from './DatePicker.types';\n\nexport const datePickerClassNames: SlotClassNames<DatePickerSlots> = {\n root: 'fui-DatePicker',\n calendar: 'fui-DatePicker__calendar',\n popupSurface: 'fui-DatePicker__popupSurface',\n};\n\nconst useStyles = makeStyles({\n base: {\n position: 'relative',\n cursor: 'pointer',\n '& input': {\n cursor: 'pointer',\n },\n },\n disabled: {\n cursor: 'default',\n '& input': {\n cursor: 'default',\n },\n },\n inline: {\n // When rendering inline, the popupSurface will be rendered under relatively positioned elements such as Input.\n // This is due to the surface being positioned as absolute, therefore zIndex: 1 ensures that won't happen.\n zIndex: 1,\n },\n});\n\nconst usePopupSurfaceClassName = makeResetStyles({\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow16,\n borderRadius: tokens.borderRadiusMedium,\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: tokens.colorTransparentStroke,\n display: 'inline-flex',\n color: tokens.colorNeutralForeground1,\n ...typographyStyles.body1,\n});\n\n/**\n * Apply styling to the DatePicker slots based on the state\n */\nexport const useDatePickerStyles_unstable = (state: DatePickerState): DatePickerState => {\n const styles = useStyles();\n const popupSurfaceClassName = usePopupSurfaceClassName();\n const { disabled, inlinePopup } = state;\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n datePickerClassNames.root,\n styles.base,\n disabled && styles.disabled,\n state.root.className,\n );\n\n if (state.popupSurface) {\n // eslint-disable-next-line react-hooks/immutability\n state.popupSurface.className = mergeClasses(\n datePickerClassNames.popupSurface,\n popupSurfaceClassName,\n state.popupSurface.className,\n inlinePopup && styles.inline,\n );\n }\n\n // eslint-disable-next-line react-hooks/immutability\n state.calendar.className = mergeClasses(datePickerClassNames.calendar, state.calendar.className);\n\n return state;\n};\n"],"names":["makeResetStyles","makeStyles","mergeClasses","tokens","typographyStyles","datePickerClassNames","root","calendar","popupSurface","useStyles","base","position","cursor","disabled","inline","zIndex","usePopupSurfaceClassName","backgroundColor","colorNeutralBackground1","boxShadow","shadow16","borderRadius","borderRadiusMedium","borderWidth","borderStyle","borderColor","colorTransparentStroke","display","color","colorNeutralForeground1","body1","useDatePickerStyles_unstable","state","styles","popupSurfaceClassName","inlinePopup","className"],"mappings":"AAAA;AAEA,SAASA,eAAe,EAAEC,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC3E,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,wBAAwB;AAIjE,OAAO,MAAMC,uBAAwD;IACnEC,MAAM;IACNC,UAAU;IACVC,cAAc;AAChB,EAAE;AAEF,MAAMC,YAAYR,WAAW;IAC3BS,MAAM;QACJC,UAAU;QACVC,QAAQ;QACR,WAAW;YACTA,QAAQ;QACV;IACF;IACAC,UAAU;QACRD,QAAQ;QACR,WAAW;YACTA,QAAQ;QACV;IACF;IACAE,QAAQ;QACN,+GAA+G;QAC/G,0GAA0G;QAC1GC,QAAQ;IACV;AACF;AAEA,MAAMC,2BAA2BhB,gBAAgB;IAC/CiB,iBAAiBd,OAAOe,uBAAuB;IAC/CC,WAAWhB,OAAOiB,QAAQ;IAC1BC,cAAclB,OAAOmB,kBAAkB;IACvCC,aAAa;IACbC,aAAa;IACbC,aAAatB,OAAOuB,sBAAsB;IAC1CC,SAAS;IACTC,OAAOzB,OAAO0B,uBAAuB;IACrC,GAAGzB,iBAAiB0B,KAAK;AAC3B;AAEA;;CAEC,GACD,OAAO,MAAMC,+BAA+B,CAACC;IAC3C,MAAMC,SAASxB;IACf,MAAMyB,wBAAwBlB;IAC9B,MAAM,EAAEH,QAAQ,EAAEsB,WAAW,EAAE,GAAGH;IAElC,oDAAoD;IACpDA,MAAM1B,IAAI,CAAC8B,SAAS,GAAGlC,aACrBG,qBAAqBC,IAAI,EACzB2B,OAAOvB,IAAI,EACXG,YAAYoB,OAAOpB,QAAQ,EAC3BmB,MAAM1B,IAAI,CAAC8B,SAAS;IAGtB,IAAIJ,MAAMxB,YAAY,EAAE;QACtB,oDAAoD;QACpDwB,MAAMxB,YAAY,CAAC4B,SAAS,GAAGlC,aAC7BG,qBAAqBG,YAAY,EACjC0B,uBACAF,MAAMxB,YAAY,CAAC4B,SAAS,EAC5BD,eAAeF,OAAOnB,MAAM;IAEhC;IAEA,oDAAoD;IACpDkB,MAAMzB,QAAQ,CAAC6B,SAAS,GAAGlC,aAAaG,qBAAqBE,QAAQ,EAAEyB,MAAMzB,QAAQ,CAAC6B,SAAS;IAE/F,OAAOJ;AACT,EAAE"}
|
|
@@ -42,7 +42,6 @@ function useFocusLogic() {
|
|
|
42
42
|
];
|
|
43
43
|
}
|
|
44
44
|
function usePopupVisibility(props) {
|
|
45
|
-
'use no memo';
|
|
46
45
|
const [open, setOpen] = (0, _reactutilities.useControllableState)({
|
|
47
46
|
initialState: false,
|
|
48
47
|
defaultState: props.defaultOpen,
|
|
@@ -77,6 +76,7 @@ function useSelectedDate({ formatDate, onSelectDate, value }) {
|
|
|
77
76
|
setFormattedDate(newDate && formatDate ? formatDate(newDate) : '');
|
|
78
77
|
};
|
|
79
78
|
_react.useEffect(()=>{
|
|
79
|
+
// eslint-disable-next-line react-hooks/set-state-in-effect
|
|
80
80
|
setFormattedDate(value && formatDate ? formatDate(value) : '');
|
|
81
81
|
}, [
|
|
82
82
|
formatDate,
|
|
@@ -95,7 +95,6 @@ const defaultParseDateFromString = (dateStr)=>{
|
|
|
95
95
|
return date ? new Date(date) : null;
|
|
96
96
|
};
|
|
97
97
|
const useDatePicker_unstable = (props, ref)=>{
|
|
98
|
-
'use no memo';
|
|
99
98
|
const { allowTextInput = false, allFocusable = false, borderless = false, dateTimeFormatter, defaultOpen = false, disableAutoFocus = true, firstDayOfWeek = _reactcalendarcompat.DayOfWeek.Sunday, firstWeekOfYear = _reactcalendarcompat.FirstWeekOfYear.FirstDay, formatDate = defaultFormatDate, highlightCurrentMonth = false, highlightSelectedMonth = false, initialPickerDate: initialPickerDateProp, inlinePopup = false, isMonthPickerVisible = true, maxDate, minDate, mountNode, onOpenChange, onSelectDate: onUserSelectDate, openOnClick = true, onValidationResult, parseDateFromString = defaultParseDateFromString, showCloseButton = false, showGoToToday = true, showMonthPickerAsOverlay = false, showWeekNumbers = false, strings = _defaults.defaultDatePickerStrings, today, underlined = false, value, ...restOfProps } = props;
|
|
100
99
|
const initialPickerDate = _react.useMemo(()=>initialPickerDateProp !== null && initialPickerDateProp !== void 0 ? initialPickerDateProp : new Date(), [
|
|
101
100
|
initialPickerDateProp
|
|
@@ -274,6 +273,7 @@ const useDatePicker_unstable = (props, ref)=>{
|
|
|
274
273
|
if (!preventFocusOpeningPicker.current) {
|
|
275
274
|
showDatePickerPopup();
|
|
276
275
|
}
|
|
276
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
277
277
|
preventFocusOpeningPicker.current = false;
|
|
278
278
|
}
|
|
279
279
|
}, [
|
|
@@ -411,6 +411,7 @@ const useDatePicker_unstable = (props, ref)=>{
|
|
|
411
411
|
open,
|
|
412
412
|
props.disabled
|
|
413
413
|
]);
|
|
414
|
+
// eslint-disable-next-line react-hooks/refs
|
|
414
415
|
const calendarShorthand = _reactutilities.slot.always(props.calendar, {
|
|
415
416
|
defaultProps: {
|
|
416
417
|
allFocusable,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/DatePicker/useDatePicker.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ArrowDown, Enter, Escape } from '@fluentui/keyboard-keys';\nimport { Calendar, compareDatePart, DayOfWeek, FirstWeekOfYear } from '@fluentui/react-calendar-compat';\nimport { CalendarMonthRegular } from '@fluentui/react-icons';\nimport { defaultDatePickerStrings } from './defaults';\nimport { Input } from '@fluentui/react-input';\nimport {\n mergeCallbacks,\n useControllableState,\n useEventCallback,\n useId,\n useMergedRefs,\n useOnClickOutside,\n useOnScrollOutside,\n slot,\n} from '@fluentui/react-utilities';\nimport { useFieldContext_unstable as useFieldContext } from '@fluentui/react-field';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useModalAttributes } from '@fluentui/react-tabster';\nimport { usePopupPositioning } from '../../utils/usePopupPositioning';\nimport type { CalendarProps, ICalendar } from '@fluentui/react-calendar-compat';\nimport type { DatePickerProps, DatePickerState, DatePickerValidationResultData } from './DatePicker.types';\nimport type { InputProps, InputOnChangeData } from '@fluentui/react-input';\n\nfunction isDateOutOfBounds(date: Date, minDate?: Date, maxDate?: Date): boolean {\n return (!!minDate && compareDatePart(minDate!, date) > 0) || (!!maxDate && compareDatePart(maxDate!, date) < 0);\n}\n\nfunction useFocusLogic() {\n const inputRef = React.useRef<HTMLInputElement>(null);\n const preventFocusOpeningPicker = React.useRef(false);\n\n const focus = React.useCallback(() => {\n inputRef.current?.focus?.();\n }, []);\n\n const preventNextFocusOpeningPicker = React.useCallback(() => {\n preventFocusOpeningPicker.current = true;\n }, []);\n\n return [focus, inputRef, preventFocusOpeningPicker, preventNextFocusOpeningPicker] as const;\n}\n\nfunction usePopupVisibility(props: DatePickerProps) {\n 'use no memo';\n\n const [open, setOpen] = useControllableState({\n initialState: false,\n defaultState: props.defaultOpen,\n state: props.open,\n });\n const isMounted = React.useRef(false);\n\n React.useEffect(\n () => {\n if (isMounted.current && !open) {\n // If DatePicker's menu (Calendar) is closed, run onAfterMenuDismiss\n props.onOpenChange?.(false);\n }\n isMounted.current = true;\n },\n // Should only run on allowTextInput or open change\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [props.allowTextInput, open],\n );\n\n return [open, setOpen] as const;\n}\n\nfunction useSelectedDate({ formatDate, onSelectDate, value }: DatePickerProps) {\n const [selectedDate, setSelectedDateState] = useControllableState<Date | null | undefined>({\n initialState: null,\n state: value,\n });\n const [formattedDate, setFormattedDate] = React.useState(() => (value && formatDate ? formatDate(value) : ''));\n\n const setSelectedDate = (newDate: Date | null | undefined) => {\n onSelectDate?.(newDate);\n setSelectedDateState(newDate);\n setFormattedDate(newDate && formatDate ? formatDate(newDate) : '');\n };\n\n React.useEffect(() => {\n setFormattedDate(value && formatDate ? formatDate(value) : '');\n }, [formatDate, value]);\n\n return [selectedDate, formattedDate, setSelectedDate, setFormattedDate] as const;\n}\n\nconst defaultFormatDate = (date?: Date) => (date ? date.toDateString() : '');\nconst defaultParseDateFromString = (dateStr: string) => {\n const date = Date.parse(dateStr);\n return date ? new Date(date) : null;\n};\n\n/**\n * Create the state required to render DatePicker.\n *\n * The returned state can be modified with hooks such as useDatePickerStyles_unstable,\n * before being passed to renderDatePicker_unstable.\n *\n * @param props - props from this instance of DatePicker\n * @param ref - reference to root Input slot\n */\nexport const useDatePicker_unstable = (props: DatePickerProps, ref: React.Ref<HTMLInputElement>): DatePickerState => {\n 'use no memo';\n\n const {\n allowTextInput = false,\n allFocusable = false,\n borderless = false,\n dateTimeFormatter,\n defaultOpen = false,\n disableAutoFocus = true,\n firstDayOfWeek = DayOfWeek.Sunday,\n firstWeekOfYear = FirstWeekOfYear.FirstDay,\n formatDate = defaultFormatDate,\n highlightCurrentMonth = false,\n highlightSelectedMonth = false,\n initialPickerDate: initialPickerDateProp,\n inlinePopup = false,\n isMonthPickerVisible = true,\n maxDate,\n minDate,\n mountNode,\n onOpenChange,\n onSelectDate: onUserSelectDate,\n openOnClick = true,\n onValidationResult,\n parseDateFromString = defaultParseDateFromString,\n showCloseButton = false,\n showGoToToday = true,\n showMonthPickerAsOverlay = false,\n showWeekNumbers = false,\n strings = defaultDatePickerStrings,\n today,\n underlined = false,\n value,\n ...restOfProps\n } = props;\n\n const initialPickerDate = React.useMemo(() => initialPickerDateProp ?? new Date(), [initialPickerDateProp]);\n\n const calendar = React.useRef<ICalendar | null>(null);\n const [focus, rootRef, preventFocusOpeningPicker, preventNextFocusOpeningPicker] = useFocusLogic();\n const [selectedDate, formattedDate, setSelectedDate, setFormattedDate] = useSelectedDate({\n formatDate,\n onSelectDate: onUserSelectDate,\n value,\n });\n const [open, setOpenState] = usePopupVisibility(props);\n const fieldContext = useFieldContext();\n const required = fieldContext?.required ?? props.required;\n const defaultId = useId('datePicker-input');\n const popupSurfaceId = useId('datePicker-popupSurface');\n\n const validateTextInput = React.useCallback(\n (date: Date | null = null): void => {\n let error: DatePickerValidationResultData['error'];\n\n if (allowTextInput) {\n if (formattedDate || date) {\n // Don't parse if the selected date has the same formatted string as what we're about to parse.\n // The formatted string might be ambiguous (ex: \"1/2/3\" or \"New Year Eve\") and the parser might\n // not be able to come up with the exact same date.\n if (selectedDate && formatDate && formatDate(date ?? selectedDate) === formattedDate) {\n return;\n }\n date = date || parseDateFromString!(formattedDate);\n\n // Check if date is null or date is an invalid date\n if (!date || isNaN(date.getTime())) {\n // Reset input if formatting is available\n setSelectedDate(selectedDate);\n error = 'invalid-input';\n } else {\n if (isDateOutOfBounds(date, minDate, maxDate)) {\n error = 'out-of-bounds';\n } else {\n setSelectedDate(date);\n }\n }\n } else {\n if (required) {\n error = 'required-input';\n }\n\n onUserSelectDate?.(date);\n }\n } else if (required && !formattedDate) {\n error = 'required-input';\n }\n\n onValidationResult?.({ error });\n },\n [\n allowTextInput,\n formatDate,\n formattedDate,\n maxDate,\n minDate,\n onUserSelectDate,\n onValidationResult,\n parseDateFromString,\n required,\n selectedDate,\n setSelectedDate,\n ],\n );\n\n const setOpen = React.useCallback(\n (newState: boolean) => {\n onOpenChange?.(newState);\n setOpenState(newState);\n\n if (!open && !props.disabled) {\n focus();\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [focus, onOpenChange, props.disabled, setOpenState],\n );\n\n const dismissDatePickerPopup = React.useCallback(\n (newlySelectedDate?: Date | null): void => {\n if (open) {\n setOpen(false);\n\n validateTextInput(newlySelectedDate);\n if (!allowTextInput && newlySelectedDate) {\n setSelectedDate(newlySelectedDate);\n }\n }\n },\n [allowTextInput, open, setOpen, setSelectedDate, validateTextInput],\n );\n\n const showDatePickerPopup = React.useCallback((): void => {\n if (!open) {\n preventNextFocusOpeningPicker();\n setOpen(true);\n }\n }, [open, preventNextFocusOpeningPicker, setOpen]);\n\n /**\n * Callback for closing the calendar callout\n */\n const calendarDismissed = React.useCallback(\n (newlySelectedDate?: Date): void => {\n preventNextFocusOpeningPicker();\n dismissDatePickerPopup(newlySelectedDate);\n },\n [dismissDatePickerPopup, preventNextFocusOpeningPicker],\n );\n\n const onInputChange = React.useCallback(\n (_: React.ChangeEvent<HTMLInputElement>, data: InputOnChangeData) => {\n const { value: newValue } = data;\n\n if (allowTextInput) {\n if (open) {\n dismissDatePickerPopup();\n }\n\n setFormattedDate(newValue);\n }\n },\n [allowTextInput, dismissDatePickerPopup, open, setFormattedDate],\n );\n\n const onInputBlur: React.FocusEventHandler<HTMLInputElement> = React.useCallback((): void => {\n validateTextInput();\n }, [validateTextInput]);\n\n const onInputKeyDown = React.useCallback(\n (ev: React.KeyboardEvent<HTMLElement>): void => {\n switch (ev.key) {\n case Enter:\n ev.preventDefault();\n ev.stopPropagation();\n if (!open) {\n validateTextInput();\n showDatePickerPopup();\n } else {\n // When DatePicker allows input date string directly,\n // it is expected to hit another enter to close the popup\n if (props.allowTextInput) {\n dismissDatePickerPopup();\n }\n }\n break;\n\n case Escape:\n if (open) {\n ev.stopPropagation();\n ev.preventDefault();\n calendarDismissed();\n }\n break;\n\n case ArrowDown:\n ev.preventDefault();\n if (!open) {\n showDatePickerPopup();\n }\n break;\n\n default:\n break;\n }\n },\n [calendarDismissed, dismissDatePickerPopup, open, props.allowTextInput, showDatePickerPopup, validateTextInput],\n );\n\n const onInputFocus: React.FocusEventHandler<HTMLInputElement> = React.useCallback((): void => {\n if (disableAutoFocus) {\n return;\n }\n\n if (!allowTextInput) {\n if (!preventFocusOpeningPicker.current) {\n showDatePickerPopup();\n }\n preventFocusOpeningPicker.current = false;\n }\n }, [allowTextInput, disableAutoFocus, preventFocusOpeningPicker, showDatePickerPopup]);\n\n const onInputClick: React.MouseEventHandler<HTMLInputElement> = React.useCallback((): void => {\n // default openOnClick to !props.disableAutoFocus for legacy support of disableAutoFocus behavior\n if ((props.openOnClick || !props.disableAutoFocus) && !open && !props.disabled) {\n showDatePickerPopup();\n return;\n }\n\n if (allowTextInput) {\n dismissDatePickerPopup();\n }\n }, [\n allowTextInput,\n dismissDatePickerPopup,\n open,\n props.disabled,\n props.disableAutoFocus,\n props.openOnClick,\n showDatePickerPopup,\n ]);\n\n const onIconClick = (ev: React.MouseEvent<HTMLElement>): void => {\n ev.preventDefault();\n ev.stopPropagation();\n if (!open && !props.disabled) {\n showDatePickerPopup();\n } else if (props.allowTextInput) {\n dismissDatePickerPopup();\n }\n };\n\n const inputAppearance: InputProps['appearance'] = underlined\n ? 'underline'\n : borderless\n ? 'filled-lighter'\n : 'outline';\n\n const [triggerWrapperRef, popupRef] = usePopupPositioning(props);\n\n const inputRoot = slot.always(props.root, {\n defaultProps: {\n ref: triggerWrapperRef,\n },\n elementType: 'span',\n });\n inputRoot.ref = useMergedRefs(inputRoot.ref, triggerWrapperRef);\n\n const input = slot.always(props.input, {\n elementType: 'input',\n });\n input.ref = useMergedRefs(input.ref, ref, rootRef);\n\n // Props to create a semantic but non-focusable button on the element with the click-to-open handler\n // Used for voice control and touch screen reader accessibility\n const inputLabelledBy = props['aria-labelledby'];\n const inputId = props.id ?? defaultId;\n const iconA11yProps = React.useMemo(\n () => ({\n role: 'button',\n 'aria-expanded': open,\n 'aria-labelledby': inputLabelledBy ?? inputId,\n }),\n [open, inputLabelledBy, inputId],\n );\n\n const contentAfter = slot.always(props.contentAfter || {}, {\n defaultProps: {\n children: <CalendarMonthRegular />,\n ...iconA11yProps,\n },\n elementType: 'span',\n });\n contentAfter.onClick = useEventCallback(mergeCallbacks(contentAfter.onClick, onIconClick));\n\n const root = slot.always(restOfProps, {\n defaultProps: {\n appearance: inputAppearance,\n 'aria-controls': open ? popupSurfaceId : undefined,\n 'aria-expanded': open,\n 'aria-haspopup': 'dialog',\n readOnly: !allowTextInput,\n role: 'combobox',\n id: inputId,\n },\n elementType: Input,\n });\n root.root = inputRoot;\n root.input = input;\n root.contentAfter = contentAfter;\n root.onChange = useEventCallback(mergeCallbacks(root.onChange, onInputChange));\n root.onBlur = useEventCallback(mergeCallbacks(root.onBlur, onInputBlur));\n root.onKeyDown = useEventCallback(mergeCallbacks(root.onKeyDown, onInputKeyDown));\n root.onFocus = useEventCallback(mergeCallbacks(root.onFocus, onInputFocus));\n root.onClick = useEventCallback(mergeCallbacks(root.onClick, onInputClick));\n\n const { modalAttributes } = useModalAttributes({ trapFocus: true, alwaysFocusable: true, legacyTrapFocus: true });\n const popupSurface = open\n ? slot.optional(props.popupSurface, {\n renderByDefault: true,\n defaultProps: {\n 'aria-label': 'Calendar',\n 'aria-modal': true,\n id: popupSurfaceId,\n role: 'dialog',\n ref: popupRef,\n ...modalAttributes,\n },\n elementType: 'div',\n })\n : undefined;\n const { targetDocument } = useFluent();\n useOnClickOutside({\n element: targetDocument,\n callback: ev => dismissDatePickerPopup(),\n refs: [triggerWrapperRef, popupRef],\n disabled: !open,\n });\n useOnScrollOutside({\n element: targetDocument,\n callback: ev => dismissDatePickerPopup(),\n refs: [triggerWrapperRef, popupRef],\n disabled: !open,\n }); // When the popup is opened, focus should go to the calendar.\n // In v8 this was done by focusing after the callout was positioned, but in v9 this can be simulated by using a\n // useEffect hook.\n React.useEffect(() => {\n if (open && !props.disabled && calendar.current) {\n calendar.current.focus();\n }\n }, [disableAutoFocus, open, props.disabled]);\n const calendarShorthand = slot.always(props.calendar, {\n defaultProps: {\n allFocusable,\n componentRef: calendar,\n dateTimeFormatter,\n firstDayOfWeek,\n firstWeekOfYear,\n highlightCurrentMonth,\n highlightSelectedMonth,\n isMonthPickerVisible,\n maxDate,\n minDate,\n showCloseButton,\n showGoToToday,\n showMonthPickerAsOverlay,\n showWeekNumbers,\n strings,\n today,\n value: selectedDate || initialPickerDate,\n },\n elementType: Calendar,\n });\n calendarShorthand.onDismiss = useEventCallback(mergeCallbacks(calendarShorthand.onDismiss, calendarDismissed));\n calendarShorthand.onSelectDate = useEventCallback(mergeCallbacks(calendarShorthand.onSelectDate, calendarDismissed));\n const state: DatePickerState = {\n disabled: !!props.disabled,\n inlinePopup,\n components: { root: Input, calendar: Calendar as React.FC<Partial<CalendarProps>>, popupSurface: 'div' },\n calendar: calendarShorthand,\n mountNode,\n root,\n popupSurface,\n };\n\n state.root.value = formattedDate;\n\n return state;\n};\n"],"names":["React","ArrowDown","Enter","Escape","Calendar","compareDatePart","DayOfWeek","FirstWeekOfYear","CalendarMonthRegular","defaultDatePickerStrings","Input","mergeCallbacks","useControllableState","useEventCallback","useId","useMergedRefs","useOnClickOutside","useOnScrollOutside","slot","useFieldContext_unstable","useFieldContext","useFluent_unstable","useFluent","useModalAttributes","usePopupPositioning","isDateOutOfBounds","date","minDate","maxDate","useFocusLogic","inputRef","useRef","preventFocusOpeningPicker","focus","useCallback","current","preventNextFocusOpeningPicker","usePopupVisibility","props","open","setOpen","initialState","defaultState","defaultOpen","state","isMounted","useEffect","onOpenChange","allowTextInput","useSelectedDate","formatDate","onSelectDate","value","selectedDate","setSelectedDateState","formattedDate","setFormattedDate","useState","setSelectedDate","newDate","defaultFormatDate","toDateString","defaultParseDateFromString","dateStr","Date","parse","useDatePicker_unstable","ref","allFocusable","borderless","dateTimeFormatter","disableAutoFocus","firstDayOfWeek","Sunday","firstWeekOfYear","FirstDay","highlightCurrentMonth","highlightSelectedMonth","initialPickerDate","initialPickerDateProp","inlinePopup","isMonthPickerVisible","mountNode","onUserSelectDate","openOnClick","onValidationResult","parseDateFromString","showCloseButton","showGoToToday","showMonthPickerAsOverlay","showWeekNumbers","strings","today","underlined","restOfProps","useMemo","calendar","rootRef","setOpenState","fieldContext","required","defaultId","popupSurfaceId","validateTextInput","error","isNaN","getTime","newState","disabled","dismissDatePickerPopup","newlySelectedDate","showDatePickerPopup","calendarDismissed","onInputChange","_","data","newValue","onInputBlur","onInputKeyDown","ev","key","preventDefault","stopPropagation","onInputFocus","onInputClick","onIconClick","inputAppearance","triggerWrapperRef","popupRef","inputRoot","always","root","defaultProps","elementType","input","inputLabelledBy","inputId","id","iconA11yProps","role","contentAfter","children","onClick","appearance","undefined","readOnly","onChange","onBlur","onKeyDown","onFocus","modalAttributes","trapFocus","alwaysFocusable","legacyTrapFocus","popupSurface","optional","renderByDefault","targetDocument","element","callback","refs","calendarShorthand","componentRef","onDismiss","components"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../src/components/DatePicker/useDatePicker.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ArrowDown, Enter, Escape } from '@fluentui/keyboard-keys';\nimport { Calendar, compareDatePart, DayOfWeek, FirstWeekOfYear } from '@fluentui/react-calendar-compat';\nimport { CalendarMonthRegular } from '@fluentui/react-icons';\nimport { defaultDatePickerStrings } from './defaults';\nimport { Input } from '@fluentui/react-input';\nimport {\n mergeCallbacks,\n useControllableState,\n useEventCallback,\n useId,\n useMergedRefs,\n useOnClickOutside,\n useOnScrollOutside,\n slot,\n} from '@fluentui/react-utilities';\nimport { useFieldContext_unstable as useFieldContext } from '@fluentui/react-field';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useModalAttributes } from '@fluentui/react-tabster';\nimport { usePopupPositioning } from '../../utils/usePopupPositioning';\nimport type { CalendarProps, ICalendar } from '@fluentui/react-calendar-compat';\nimport type { DatePickerProps, DatePickerState, DatePickerValidationResultData } from './DatePicker.types';\nimport type { InputProps, InputOnChangeData } from '@fluentui/react-input';\n\nfunction isDateOutOfBounds(date: Date, minDate?: Date, maxDate?: Date): boolean {\n return (!!minDate && compareDatePart(minDate!, date) > 0) || (!!maxDate && compareDatePart(maxDate!, date) < 0);\n}\n\nfunction useFocusLogic() {\n const inputRef = React.useRef<HTMLInputElement>(null);\n const preventFocusOpeningPicker = React.useRef(false);\n\n const focus = React.useCallback(() => {\n inputRef.current?.focus?.();\n }, []);\n\n const preventNextFocusOpeningPicker = React.useCallback(() => {\n preventFocusOpeningPicker.current = true;\n }, []);\n\n return [focus, inputRef, preventFocusOpeningPicker, preventNextFocusOpeningPicker] as const;\n}\n\nfunction usePopupVisibility(props: DatePickerProps) {\n const [open, setOpen] = useControllableState({\n initialState: false,\n defaultState: props.defaultOpen,\n state: props.open,\n });\n const isMounted = React.useRef(false);\n\n React.useEffect(\n () => {\n if (isMounted.current && !open) {\n // If DatePicker's menu (Calendar) is closed, run onAfterMenuDismiss\n props.onOpenChange?.(false);\n }\n isMounted.current = true;\n },\n // Should only run on allowTextInput or open change\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [props.allowTextInput, open],\n );\n\n return [open, setOpen] as const;\n}\n\nfunction useSelectedDate({ formatDate, onSelectDate, value }: DatePickerProps) {\n const [selectedDate, setSelectedDateState] = useControllableState<Date | null | undefined>({\n initialState: null,\n state: value,\n });\n const [formattedDate, setFormattedDate] = React.useState(() => (value && formatDate ? formatDate(value) : ''));\n\n const setSelectedDate = (newDate: Date | null | undefined) => {\n onSelectDate?.(newDate);\n setSelectedDateState(newDate);\n setFormattedDate(newDate && formatDate ? formatDate(newDate) : '');\n };\n\n React.useEffect(() => {\n // eslint-disable-next-line react-hooks/set-state-in-effect\n setFormattedDate(value && formatDate ? formatDate(value) : '');\n }, [formatDate, value]);\n\n return [selectedDate, formattedDate, setSelectedDate, setFormattedDate] as const;\n}\n\nconst defaultFormatDate = (date?: Date) => (date ? date.toDateString() : '');\nconst defaultParseDateFromString = (dateStr: string) => {\n const date = Date.parse(dateStr);\n return date ? new Date(date) : null;\n};\n\n/**\n * Create the state required to render DatePicker.\n *\n * The returned state can be modified with hooks such as useDatePickerStyles_unstable,\n * before being passed to renderDatePicker_unstable.\n *\n * @param props - props from this instance of DatePicker\n * @param ref - reference to root Input slot\n */\nexport const useDatePicker_unstable = (props: DatePickerProps, ref: React.Ref<HTMLInputElement>): DatePickerState => {\n const {\n allowTextInput = false,\n allFocusable = false,\n borderless = false,\n dateTimeFormatter,\n defaultOpen = false,\n disableAutoFocus = true,\n firstDayOfWeek = DayOfWeek.Sunday,\n firstWeekOfYear = FirstWeekOfYear.FirstDay,\n formatDate = defaultFormatDate,\n highlightCurrentMonth = false,\n highlightSelectedMonth = false,\n initialPickerDate: initialPickerDateProp,\n inlinePopup = false,\n isMonthPickerVisible = true,\n maxDate,\n minDate,\n mountNode,\n onOpenChange,\n onSelectDate: onUserSelectDate,\n openOnClick = true,\n onValidationResult,\n parseDateFromString = defaultParseDateFromString,\n showCloseButton = false,\n showGoToToday = true,\n showMonthPickerAsOverlay = false,\n showWeekNumbers = false,\n strings = defaultDatePickerStrings,\n today,\n underlined = false,\n value,\n ...restOfProps\n } = props;\n\n const initialPickerDate = React.useMemo(() => initialPickerDateProp ?? new Date(), [initialPickerDateProp]);\n\n const calendar = React.useRef<ICalendar | null>(null);\n const [focus, rootRef, preventFocusOpeningPicker, preventNextFocusOpeningPicker] = useFocusLogic();\n const [selectedDate, formattedDate, setSelectedDate, setFormattedDate] = useSelectedDate({\n formatDate,\n onSelectDate: onUserSelectDate,\n value,\n });\n const [open, setOpenState] = usePopupVisibility(props);\n const fieldContext = useFieldContext();\n const required = fieldContext?.required ?? props.required;\n const defaultId = useId('datePicker-input');\n const popupSurfaceId = useId('datePicker-popupSurface');\n\n const validateTextInput = React.useCallback(\n (date: Date | null = null): void => {\n let error: DatePickerValidationResultData['error'];\n\n if (allowTextInput) {\n if (formattedDate || date) {\n // Don't parse if the selected date has the same formatted string as what we're about to parse.\n // The formatted string might be ambiguous (ex: \"1/2/3\" or \"New Year Eve\") and the parser might\n // not be able to come up with the exact same date.\n if (selectedDate && formatDate && formatDate(date ?? selectedDate) === formattedDate) {\n return;\n }\n date = date || parseDateFromString!(formattedDate);\n\n // Check if date is null or date is an invalid date\n if (!date || isNaN(date.getTime())) {\n // Reset input if formatting is available\n setSelectedDate(selectedDate);\n error = 'invalid-input';\n } else {\n if (isDateOutOfBounds(date, minDate, maxDate)) {\n error = 'out-of-bounds';\n } else {\n setSelectedDate(date);\n }\n }\n } else {\n if (required) {\n error = 'required-input';\n }\n\n onUserSelectDate?.(date);\n }\n } else if (required && !formattedDate) {\n error = 'required-input';\n }\n\n onValidationResult?.({ error });\n },\n [\n allowTextInput,\n formatDate,\n formattedDate,\n maxDate,\n minDate,\n onUserSelectDate,\n onValidationResult,\n parseDateFromString,\n required,\n selectedDate,\n setSelectedDate,\n ],\n );\n\n const setOpen = React.useCallback(\n (newState: boolean) => {\n onOpenChange?.(newState);\n setOpenState(newState);\n\n if (!open && !props.disabled) {\n focus();\n }\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [focus, onOpenChange, props.disabled, setOpenState],\n );\n\n const dismissDatePickerPopup = React.useCallback(\n (newlySelectedDate?: Date | null): void => {\n if (open) {\n setOpen(false);\n\n validateTextInput(newlySelectedDate);\n if (!allowTextInput && newlySelectedDate) {\n setSelectedDate(newlySelectedDate);\n }\n }\n },\n [allowTextInput, open, setOpen, setSelectedDate, validateTextInput],\n );\n\n const showDatePickerPopup = React.useCallback((): void => {\n if (!open) {\n preventNextFocusOpeningPicker();\n setOpen(true);\n }\n }, [open, preventNextFocusOpeningPicker, setOpen]);\n\n /**\n * Callback for closing the calendar callout\n */\n const calendarDismissed = React.useCallback(\n (newlySelectedDate?: Date): void => {\n preventNextFocusOpeningPicker();\n dismissDatePickerPopup(newlySelectedDate);\n },\n [dismissDatePickerPopup, preventNextFocusOpeningPicker],\n );\n\n const onInputChange = React.useCallback(\n (_: React.ChangeEvent<HTMLInputElement>, data: InputOnChangeData) => {\n const { value: newValue } = data;\n\n if (allowTextInput) {\n if (open) {\n dismissDatePickerPopup();\n }\n\n setFormattedDate(newValue);\n }\n },\n [allowTextInput, dismissDatePickerPopup, open, setFormattedDate],\n );\n\n const onInputBlur: React.FocusEventHandler<HTMLInputElement> = React.useCallback((): void => {\n validateTextInput();\n }, [validateTextInput]);\n\n const onInputKeyDown = React.useCallback(\n (ev: React.KeyboardEvent<HTMLElement>): void => {\n switch (ev.key) {\n case Enter:\n ev.preventDefault();\n ev.stopPropagation();\n if (!open) {\n validateTextInput();\n showDatePickerPopup();\n } else {\n // When DatePicker allows input date string directly,\n // it is expected to hit another enter to close the popup\n if (props.allowTextInput) {\n dismissDatePickerPopup();\n }\n }\n break;\n\n case Escape:\n if (open) {\n ev.stopPropagation();\n ev.preventDefault();\n calendarDismissed();\n }\n break;\n\n case ArrowDown:\n ev.preventDefault();\n if (!open) {\n showDatePickerPopup();\n }\n break;\n\n default:\n break;\n }\n },\n [calendarDismissed, dismissDatePickerPopup, open, props.allowTextInput, showDatePickerPopup, validateTextInput],\n );\n\n const onInputFocus: React.FocusEventHandler<HTMLInputElement> = React.useCallback((): void => {\n if (disableAutoFocus) {\n return;\n }\n\n if (!allowTextInput) {\n if (!preventFocusOpeningPicker.current) {\n showDatePickerPopup();\n }\n // eslint-disable-next-line react-hooks/immutability\n preventFocusOpeningPicker.current = false;\n }\n }, [allowTextInput, disableAutoFocus, preventFocusOpeningPicker, showDatePickerPopup]);\n\n const onInputClick: React.MouseEventHandler<HTMLInputElement> = React.useCallback((): void => {\n // default openOnClick to !props.disableAutoFocus for legacy support of disableAutoFocus behavior\n if ((props.openOnClick || !props.disableAutoFocus) && !open && !props.disabled) {\n showDatePickerPopup();\n return;\n }\n\n if (allowTextInput) {\n dismissDatePickerPopup();\n }\n }, [\n allowTextInput,\n dismissDatePickerPopup,\n open,\n props.disabled,\n props.disableAutoFocus,\n props.openOnClick,\n showDatePickerPopup,\n ]);\n\n const onIconClick = (ev: React.MouseEvent<HTMLElement>): void => {\n ev.preventDefault();\n ev.stopPropagation();\n if (!open && !props.disabled) {\n showDatePickerPopup();\n } else if (props.allowTextInput) {\n dismissDatePickerPopup();\n }\n };\n\n const inputAppearance: InputProps['appearance'] = underlined\n ? 'underline'\n : borderless\n ? 'filled-lighter'\n : 'outline';\n\n const [triggerWrapperRef, popupRef] = usePopupPositioning(props);\n\n const inputRoot = slot.always(props.root, {\n defaultProps: {\n ref: triggerWrapperRef,\n },\n elementType: 'span',\n });\n inputRoot.ref = useMergedRefs(inputRoot.ref, triggerWrapperRef);\n\n const input = slot.always(props.input, {\n elementType: 'input',\n });\n input.ref = useMergedRefs(input.ref, ref, rootRef);\n\n // Props to create a semantic but non-focusable button on the element with the click-to-open handler\n // Used for voice control and touch screen reader accessibility\n const inputLabelledBy = props['aria-labelledby'];\n const inputId = props.id ?? defaultId;\n const iconA11yProps = React.useMemo(\n () => ({\n role: 'button',\n 'aria-expanded': open,\n 'aria-labelledby': inputLabelledBy ?? inputId,\n }),\n [open, inputLabelledBy, inputId],\n );\n\n const contentAfter = slot.always(props.contentAfter || {}, {\n defaultProps: {\n children: <CalendarMonthRegular />,\n ...iconA11yProps,\n },\n elementType: 'span',\n });\n contentAfter.onClick = useEventCallback(mergeCallbacks(contentAfter.onClick, onIconClick));\n\n const root = slot.always(restOfProps, {\n defaultProps: {\n appearance: inputAppearance,\n 'aria-controls': open ? popupSurfaceId : undefined,\n 'aria-expanded': open,\n 'aria-haspopup': 'dialog',\n readOnly: !allowTextInput,\n role: 'combobox',\n id: inputId,\n },\n elementType: Input,\n });\n root.root = inputRoot;\n root.input = input;\n root.contentAfter = contentAfter;\n root.onChange = useEventCallback(mergeCallbacks(root.onChange, onInputChange));\n root.onBlur = useEventCallback(mergeCallbacks(root.onBlur, onInputBlur));\n root.onKeyDown = useEventCallback(mergeCallbacks(root.onKeyDown, onInputKeyDown));\n root.onFocus = useEventCallback(mergeCallbacks(root.onFocus, onInputFocus));\n root.onClick = useEventCallback(mergeCallbacks(root.onClick, onInputClick));\n\n const { modalAttributes } = useModalAttributes({ trapFocus: true, alwaysFocusable: true, legacyTrapFocus: true });\n const popupSurface = open\n ? slot.optional(props.popupSurface, {\n renderByDefault: true,\n defaultProps: {\n 'aria-label': 'Calendar',\n 'aria-modal': true,\n id: popupSurfaceId,\n role: 'dialog',\n ref: popupRef,\n ...modalAttributes,\n },\n elementType: 'div',\n })\n : undefined;\n const { targetDocument } = useFluent();\n useOnClickOutside({\n element: targetDocument,\n callback: ev => dismissDatePickerPopup(),\n refs: [triggerWrapperRef, popupRef],\n disabled: !open,\n });\n useOnScrollOutside({\n element: targetDocument,\n callback: ev => dismissDatePickerPopup(),\n refs: [triggerWrapperRef, popupRef],\n disabled: !open,\n }); // When the popup is opened, focus should go to the calendar.\n // In v8 this was done by focusing after the callout was positioned, but in v9 this can be simulated by using a\n // useEffect hook.\n React.useEffect(() => {\n if (open && !props.disabled && calendar.current) {\n calendar.current.focus();\n }\n }, [disableAutoFocus, open, props.disabled]);\n // eslint-disable-next-line react-hooks/refs\n const calendarShorthand = slot.always(props.calendar, {\n defaultProps: {\n allFocusable,\n componentRef: calendar,\n dateTimeFormatter,\n firstDayOfWeek,\n firstWeekOfYear,\n highlightCurrentMonth,\n highlightSelectedMonth,\n isMonthPickerVisible,\n maxDate,\n minDate,\n showCloseButton,\n showGoToToday,\n showMonthPickerAsOverlay,\n showWeekNumbers,\n strings,\n today,\n value: selectedDate || initialPickerDate,\n },\n elementType: Calendar,\n });\n calendarShorthand.onDismiss = useEventCallback(mergeCallbacks(calendarShorthand.onDismiss, calendarDismissed));\n calendarShorthand.onSelectDate = useEventCallback(mergeCallbacks(calendarShorthand.onSelectDate, calendarDismissed));\n const state: DatePickerState = {\n disabled: !!props.disabled,\n inlinePopup,\n components: { root: Input, calendar: Calendar as React.FC<Partial<CalendarProps>>, popupSurface: 'div' },\n calendar: calendarShorthand,\n mountNode,\n root,\n popupSurface,\n };\n\n state.root.value = formattedDate;\n\n return state;\n};\n"],"names":["React","ArrowDown","Enter","Escape","Calendar","compareDatePart","DayOfWeek","FirstWeekOfYear","CalendarMonthRegular","defaultDatePickerStrings","Input","mergeCallbacks","useControllableState","useEventCallback","useId","useMergedRefs","useOnClickOutside","useOnScrollOutside","slot","useFieldContext_unstable","useFieldContext","useFluent_unstable","useFluent","useModalAttributes","usePopupPositioning","isDateOutOfBounds","date","minDate","maxDate","useFocusLogic","inputRef","useRef","preventFocusOpeningPicker","focus","useCallback","current","preventNextFocusOpeningPicker","usePopupVisibility","props","open","setOpen","initialState","defaultState","defaultOpen","state","isMounted","useEffect","onOpenChange","allowTextInput","useSelectedDate","formatDate","onSelectDate","value","selectedDate","setSelectedDateState","formattedDate","setFormattedDate","useState","setSelectedDate","newDate","defaultFormatDate","toDateString","defaultParseDateFromString","dateStr","Date","parse","useDatePicker_unstable","ref","allFocusable","borderless","dateTimeFormatter","disableAutoFocus","firstDayOfWeek","Sunday","firstWeekOfYear","FirstDay","highlightCurrentMonth","highlightSelectedMonth","initialPickerDate","initialPickerDateProp","inlinePopup","isMonthPickerVisible","mountNode","onUserSelectDate","openOnClick","onValidationResult","parseDateFromString","showCloseButton","showGoToToday","showMonthPickerAsOverlay","showWeekNumbers","strings","today","underlined","restOfProps","useMemo","calendar","rootRef","setOpenState","fieldContext","required","defaultId","popupSurfaceId","validateTextInput","error","isNaN","getTime","newState","disabled","dismissDatePickerPopup","newlySelectedDate","showDatePickerPopup","calendarDismissed","onInputChange","_","data","newValue","onInputBlur","onInputKeyDown","ev","key","preventDefault","stopPropagation","onInputFocus","onInputClick","onIconClick","inputAppearance","triggerWrapperRef","popupRef","inputRoot","always","root","defaultProps","elementType","input","inputLabelledBy","inputId","id","iconA11yProps","role","contentAfter","children","onClick","appearance","undefined","readOnly","onChange","onBlur","onKeyDown","onFocus","modalAttributes","trapFocus","alwaysFocusable","legacyTrapFocus","popupSurface","optional","renderByDefault","targetDocument","element","callback","refs","calendarShorthand","componentRef","onDismiss","components"],"mappings":"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"}
|
|
@@ -50,14 +50,16 @@ const usePopupSurfaceClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r1ytv1
|
|
|
50
50
|
".r1ytv1z8{background-color:var(--colorNeutralBackground1);box-shadow:var(--shadow16);border-radius:var(--borderRadiusMedium);border-width:1px;border-style:solid;border-color:var(--colorTransparentStroke);display:inline-flex;color:var(--colorNeutralForeground1);font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase300);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase300);}"
|
|
51
51
|
]);
|
|
52
52
|
const useDatePickerStyles_unstable = (state)=>{
|
|
53
|
-
'use no memo';
|
|
54
53
|
const styles = useStyles();
|
|
55
54
|
const popupSurfaceClassName = usePopupSurfaceClassName();
|
|
56
55
|
const { disabled, inlinePopup } = state;
|
|
56
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
57
57
|
state.root.className = (0, _react.mergeClasses)(datePickerClassNames.root, styles.base, disabled && styles.disabled, state.root.className);
|
|
58
58
|
if (state.popupSurface) {
|
|
59
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
59
60
|
state.popupSurface.className = (0, _react.mergeClasses)(datePickerClassNames.popupSurface, popupSurfaceClassName, state.popupSurface.className, inlinePopup && styles.inline);
|
|
60
61
|
}
|
|
62
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
61
63
|
state.calendar.className = (0, _react.mergeClasses)(datePickerClassNames.calendar, state.calendar.className);
|
|
62
64
|
return state;
|
|
63
65
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useDatePickerStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const datePickerClassNames = {\n root: 'fui-DatePicker',\n calendar: 'fui-DatePicker__calendar',\n popupSurface: 'fui-DatePicker__popupSurface'\n};\nconst useStyles = makeStyles({\n base: {\n position: 'relative',\n cursor: 'pointer',\n '& input': {\n cursor: 'pointer'\n }\n },\n disabled: {\n cursor: 'default',\n '& input': {\n cursor: 'default'\n }\n },\n inline: {\n // When rendering inline, the popupSurface will be rendered under relatively positioned elements such as Input.\n // This is due to the surface being positioned as absolute, therefore zIndex: 1 ensures that won't happen.\n zIndex: 1\n }\n});\nconst usePopupSurfaceClassName = makeResetStyles({\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow16,\n borderRadius: tokens.borderRadiusMedium,\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: tokens.colorTransparentStroke,\n display: 'inline-flex',\n color: tokens.colorNeutralForeground1,\n ...typographyStyles.body1\n});\n/**\n * Apply styling to the DatePicker slots based on the state\n */ export const useDatePickerStyles_unstable = (state)=>{\n
|
|
1
|
+
{"version":3,"sources":["useDatePickerStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const datePickerClassNames = {\n root: 'fui-DatePicker',\n calendar: 'fui-DatePicker__calendar',\n popupSurface: 'fui-DatePicker__popupSurface'\n};\nconst useStyles = makeStyles({\n base: {\n position: 'relative',\n cursor: 'pointer',\n '& input': {\n cursor: 'pointer'\n }\n },\n disabled: {\n cursor: 'default',\n '& input': {\n cursor: 'default'\n }\n },\n inline: {\n // When rendering inline, the popupSurface will be rendered under relatively positioned elements such as Input.\n // This is due to the surface being positioned as absolute, therefore zIndex: 1 ensures that won't happen.\n zIndex: 1\n }\n});\nconst usePopupSurfaceClassName = makeResetStyles({\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow16,\n borderRadius: tokens.borderRadiusMedium,\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: tokens.colorTransparentStroke,\n display: 'inline-flex',\n color: tokens.colorNeutralForeground1,\n ...typographyStyles.body1\n});\n/**\n * Apply styling to the DatePicker slots based on the state\n */ export const useDatePickerStyles_unstable = (state)=>{\n const styles = useStyles();\n const popupSurfaceClassName = usePopupSurfaceClassName();\n const { disabled, inlinePopup } = state;\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(datePickerClassNames.root, styles.base, disabled && styles.disabled, state.root.className);\n if (state.popupSurface) {\n // eslint-disable-next-line react-hooks/immutability\n state.popupSurface.className = mergeClasses(datePickerClassNames.popupSurface, popupSurfaceClassName, state.popupSurface.className, inlinePopup && styles.inline);\n }\n // eslint-disable-next-line react-hooks/immutability\n state.calendar.className = mergeClasses(datePickerClassNames.calendar, state.calendar.className);\n return state;\n};\n"],"names":["__resetStyles","__styles","mergeClasses","tokens","typographyStyles","datePickerClassNames","root","calendar","popupSurface","useStyles","base","qhf8xq","Bceei9c","xfaavh","disabled","inline","Bj3rh1h","d","usePopupSurfaceClassName","useDatePickerStyles_unstable","state","styles","popupSurfaceClassName","inlinePopup","className"],"mappings":"AAAA,YAAY;;;;;;;;;;;;IAGCK,oBAAoB;;;gCAsCY;;;;uBAxCa,gBAAgB;AAEnE,6BAA6B;IAChCC,IAAI,EAAE,gBAAgB;IACtBC,QAAQ,EAAE,0BAA0B;IACpCC,YAAY,EAAE;AAClB,CAAC;AACD,MAAMC,SAAS,GAAA,WAAA,OAAGR,eAAA,EAAA;IAAAS,IAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,QAAA,EAAA;QAAAF,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAE,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAmBjB,CAAC;AACF,MAAMC,wBAAwB,GAAA,WAAA,OAAGlB,oBAAA,EAAA,YAAA,MAAA;IAAA;CAUhC,CAAC;AAGS,MAAMmB,gCAAgCC,KAAK,IAAG;IACrD,MAAMC,MAAM,GAAGZ,SAAS,CAAC,CAAC;IAC1B,MAAMa,qBAAqB,GAAGJ,wBAAwB,CAAC,CAAC;IACxD,MAAM,EAAEJ,QAAQ,EAAES,WAAAA,EAAa,GAAGH,KAAK;IACvC,oDAAA;IACAA,KAAK,CAACd,IAAI,CAACkB,SAAS,OAAGtB,mBAAY,EAACG,oBAAoB,CAACC,IAAI,EAAEe,MAAM,CAACX,IAAI,EAAEI,QAAQ,IAAIO,MAAM,CAACP,QAAQ,EAAEM,KAAK,CAACd,IAAI,CAACkB,SAAS,CAAC;IAC9H,IAAIJ,KAAK,CAACZ,YAAY,EAAE;QACpB,oDAAA;QACAY,KAAK,CAACZ,YAAY,CAACgB,SAAS,OAAGtB,mBAAY,EAACG,oBAAoB,CAACG,YAAY,EAAEc,qBAAqB,EAAEF,KAAK,CAACZ,YAAY,CAACgB,SAAS,EAAED,WAAW,IAAIF,MAAM,CAACN,MAAM,CAAC;IACrK;IACA,oDAAA;IACAK,KAAK,CAACb,QAAQ,CAACiB,SAAS,OAAGtB,mBAAY,EAACG,oBAAoB,CAACE,QAAQ,EAAEa,KAAK,CAACb,QAAQ,CAACiB,SAAS,CAAC;IAChG,OAAOJ,KAAK;AAChB,CAAC"}
|
|
@@ -56,14 +56,16 @@ const usePopupSurfaceClassName = (0, _react.makeResetStyles)({
|
|
|
56
56
|
..._reacttheme.typographyStyles.body1
|
|
57
57
|
});
|
|
58
58
|
const useDatePickerStyles_unstable = (state)=>{
|
|
59
|
-
'use no memo';
|
|
60
59
|
const styles = useStyles();
|
|
61
60
|
const popupSurfaceClassName = usePopupSurfaceClassName();
|
|
62
61
|
const { disabled, inlinePopup } = state;
|
|
62
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
63
63
|
state.root.className = (0, _react.mergeClasses)(datePickerClassNames.root, styles.base, disabled && styles.disabled, state.root.className);
|
|
64
64
|
if (state.popupSurface) {
|
|
65
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
65
66
|
state.popupSurface.className = (0, _react.mergeClasses)(datePickerClassNames.popupSurface, popupSurfaceClassName, state.popupSurface.className, inlinePopup && styles.inline);
|
|
66
67
|
}
|
|
68
|
+
// eslint-disable-next-line react-hooks/immutability
|
|
67
69
|
state.calendar.className = (0, _react.mergeClasses)(datePickerClassNames.calendar, state.calendar.className);
|
|
68
70
|
return state;
|
|
69
71
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/DatePicker/useDatePickerStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { DatePickerSlots, DatePickerState } from './DatePicker.types';\n\nexport const datePickerClassNames: SlotClassNames<DatePickerSlots> = {\n root: 'fui-DatePicker',\n calendar: 'fui-DatePicker__calendar',\n popupSurface: 'fui-DatePicker__popupSurface',\n};\n\nconst useStyles = makeStyles({\n base: {\n position: 'relative',\n cursor: 'pointer',\n '& input': {\n cursor: 'pointer',\n },\n },\n disabled: {\n cursor: 'default',\n '& input': {\n cursor: 'default',\n },\n },\n inline: {\n // When rendering inline, the popupSurface will be rendered under relatively positioned elements such as Input.\n // This is due to the surface being positioned as absolute, therefore zIndex: 1 ensures that won't happen.\n zIndex: 1,\n },\n});\n\nconst usePopupSurfaceClassName = makeResetStyles({\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow16,\n borderRadius: tokens.borderRadiusMedium,\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: tokens.colorTransparentStroke,\n display: 'inline-flex',\n color: tokens.colorNeutralForeground1,\n ...typographyStyles.body1,\n});\n\n/**\n * Apply styling to the DatePicker slots based on the state\n */\nexport const useDatePickerStyles_unstable = (state: DatePickerState): DatePickerState => {\n
|
|
1
|
+
{"version":3,"sources":["../src/components/DatePicker/useDatePickerStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { DatePickerSlots, DatePickerState } from './DatePicker.types';\n\nexport const datePickerClassNames: SlotClassNames<DatePickerSlots> = {\n root: 'fui-DatePicker',\n calendar: 'fui-DatePicker__calendar',\n popupSurface: 'fui-DatePicker__popupSurface',\n};\n\nconst useStyles = makeStyles({\n base: {\n position: 'relative',\n cursor: 'pointer',\n '& input': {\n cursor: 'pointer',\n },\n },\n disabled: {\n cursor: 'default',\n '& input': {\n cursor: 'default',\n },\n },\n inline: {\n // When rendering inline, the popupSurface will be rendered under relatively positioned elements such as Input.\n // This is due to the surface being positioned as absolute, therefore zIndex: 1 ensures that won't happen.\n zIndex: 1,\n },\n});\n\nconst usePopupSurfaceClassName = makeResetStyles({\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow16,\n borderRadius: tokens.borderRadiusMedium,\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor: tokens.colorTransparentStroke,\n display: 'inline-flex',\n color: tokens.colorNeutralForeground1,\n ...typographyStyles.body1,\n});\n\n/**\n * Apply styling to the DatePicker slots based on the state\n */\nexport const useDatePickerStyles_unstable = (state: DatePickerState): DatePickerState => {\n const styles = useStyles();\n const popupSurfaceClassName = usePopupSurfaceClassName();\n const { disabled, inlinePopup } = state;\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n datePickerClassNames.root,\n styles.base,\n disabled && styles.disabled,\n state.root.className,\n );\n\n if (state.popupSurface) {\n // eslint-disable-next-line react-hooks/immutability\n state.popupSurface.className = mergeClasses(\n datePickerClassNames.popupSurface,\n popupSurfaceClassName,\n state.popupSurface.className,\n inlinePopup && styles.inline,\n );\n }\n\n // eslint-disable-next-line react-hooks/immutability\n state.calendar.className = mergeClasses(datePickerClassNames.calendar, state.calendar.className);\n\n return state;\n};\n"],"names":["makeResetStyles","makeStyles","mergeClasses","tokens","typographyStyles","datePickerClassNames","root","calendar","popupSurface","useStyles","base","position","cursor","disabled","inline","zIndex","usePopupSurfaceClassName","backgroundColor","colorNeutralBackground1","boxShadow","shadow16","borderRadius","borderRadiusMedium","borderWidth","borderStyle","borderColor","colorTransparentStroke","display","color","colorNeutralForeground1","body1","useDatePickerStyles_unstable","state","styles","popupSurfaceClassName","inlinePopup","className"],"mappings":"AAAA;;;;;;;;;;;;IAOaK,oBAAAA;;;IA0CA0B,4BAAAA;;;;uBA/C6C,iBAAiB;4BAClC,wBAAwB;AAI1D,6BAA8D;IACnEzB,MAAM;IACNC,UAAU;IACVC,cAAc;AAChB,EAAE;AAEF,MAAMC,gBAAYR,iBAAAA,EAAW;IAC3BS,MAAM;QACJC,UAAU;QACVC,QAAQ;QACR,WAAW;YACTA,QAAQ;QACV;IACF;IACAC,UAAU;QACRD,QAAQ;QACR,WAAW;YACTA,QAAQ;QACV;IACF;IACAE,QAAQ;QACN,+GAA+G;QAC/G,0GAA0G;QAC1GC,QAAQ;IACV;AACF;AAEA,MAAMC,+BAA2BhB,sBAAAA,EAAgB;IAC/CiB,iBAAiBd,kBAAAA,CAAOe,uBAAuB;IAC/CC,WAAWhB,kBAAAA,CAAOiB,QAAQ;IAC1BC,cAAclB,kBAAAA,CAAOmB,kBAAkB;IACvCC,aAAa;IACbC,aAAa;IACbC,aAAatB,kBAAAA,CAAOuB,sBAAsB;IAC1CC,SAAS;IACTC,OAAOzB,kBAAAA,CAAO0B,uBAAuB;IACrC,GAAGzB,4BAAAA,CAAiB0B,KAAK;AAC3B;AAKO,qCAAqC,CAACE;IAC3C,MAAMC,SAASxB;IACf,MAAMyB,wBAAwBlB;IAC9B,MAAM,EAAEH,QAAQ,EAAEsB,WAAW,EAAE,GAAGH;IAElC,oDAAoD;IACpDA,MAAM1B,IAAI,CAAC8B,SAAS,OAAGlC,mBAAAA,EACrBG,qBAAqBC,IAAI,EACzB2B,OAAOvB,IAAI,EACXG,YAAYoB,OAAOpB,QAAQ,EAC3BmB,MAAM1B,IAAI,CAAC8B,SAAS;IAGtB,IAAIJ,MAAMxB,YAAY,EAAE;QACtB,oDAAoD;QACpDwB,MAAMxB,YAAY,CAAC4B,SAAS,OAAGlC,mBAAAA,EAC7BG,qBAAqBG,YAAY,EACjC0B,uBACAF,MAAMxB,YAAY,CAAC4B,SAAS,EAC5BD,eAAeF,OAAOnB,MAAM;IAEhC;IAEA,oDAAoD;IACpDkB,MAAMzB,QAAQ,CAAC6B,SAAS,OAAGlC,mBAAAA,EAAaG,qBAAqBE,QAAQ,EAAEyB,MAAMzB,QAAQ,CAAC6B,SAAS;IAE/F,OAAOJ;AACT,EAAE"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-datepicker-compat",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.33",
|
|
4
4
|
"description": "React components for building web experiences",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -13,18 +13,18 @@
|
|
|
13
13
|
"license": "MIT",
|
|
14
14
|
"dependencies": {
|
|
15
15
|
"@fluentui/keyboard-keys": "^9.0.8",
|
|
16
|
-
"@fluentui/react-calendar-compat": "^0.4.
|
|
17
|
-
"@fluentui/react-field": "^9.5.
|
|
16
|
+
"@fluentui/react-calendar-compat": "^0.4.3",
|
|
17
|
+
"@fluentui/react-field": "^9.5.3",
|
|
18
18
|
"@fluentui/react-icons": "^2.0.245",
|
|
19
|
-
"@fluentui/react-input": "^9.8.
|
|
20
|
-
"@fluentui/react-jsx-runtime": "^9.4.
|
|
21
|
-
"@fluentui/react-popover": "^9.14.
|
|
22
|
-
"@fluentui/react-portal": "^9.8.
|
|
23
|
-
"@fluentui/react-positioning": "^9.22.
|
|
19
|
+
"@fluentui/react-input": "^9.8.4",
|
|
20
|
+
"@fluentui/react-jsx-runtime": "^9.4.4",
|
|
21
|
+
"@fluentui/react-popover": "^9.14.4",
|
|
22
|
+
"@fluentui/react-portal": "^9.8.14",
|
|
23
|
+
"@fluentui/react-positioning": "^9.22.3",
|
|
24
24
|
"@fluentui/react-shared-contexts": "^9.26.2",
|
|
25
|
-
"@fluentui/react-tabster": "^9.26.
|
|
25
|
+
"@fluentui/react-tabster": "^9.26.16",
|
|
26
26
|
"@fluentui/react-theme": "^9.2.1",
|
|
27
|
-
"@fluentui/react-utilities": "^9.26.
|
|
27
|
+
"@fluentui/react-utilities": "^9.26.5",
|
|
28
28
|
"@griffel/react": "^1.5.32",
|
|
29
29
|
"@swc/helpers": "^0.5.1"
|
|
30
30
|
},
|