@mui/x-date-pickers-pro 8.0.0-alpha.6 → 8.0.0-alpha.8
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/{AdapterDateFnsJalaliV3 → AdapterDateFnsJalaliV2}/index.d.ts +1 -1
- package/{AdapterDateFnsJalaliV3 → AdapterDateFnsJalaliV2}/index.js +1 -1
- package/{AdapterDateFnsJalaliV3 → AdapterDateFnsJalaliV2}/package.json +1 -1
- package/{AdapterDateFnsV3 → AdapterDateFnsV2}/index.d.ts +1 -1
- package/{AdapterDateFnsV3 → AdapterDateFnsV2}/index.js +1 -1
- package/{AdapterDateFnsV3 → AdapterDateFnsV2}/package.json +1 -1
- package/CHANGELOG.md +242 -1
- package/DateRangeCalendar/DateRangeCalendar.js +12 -10
- package/DateRangePicker/DateRangePicker.js +1 -1
- package/DateRangePicker/DateRangePicker.types.d.ts +5 -0
- package/DateRangePicker/DateRangePickerToolbar.d.ts +2 -3
- package/DateRangePicker/DateRangePickerToolbar.js +27 -19
- package/DateRangePicker/shared.d.ts +1 -1
- package/DateTimeRangePicker/DateTimeRangePicker.js +2 -2
- package/DateTimeRangePicker/DateTimeRangePickerTabs.d.ts +3 -4
- package/DateTimeRangePicker/DateTimeRangePickerTabs.js +10 -9
- package/DateTimeRangePicker/DateTimeRangePickerTimeWrapper.d.ts +8 -10
- package/DateTimeRangePicker/DateTimeRangePickerTimeWrapper.js +8 -6
- package/DateTimeRangePicker/DateTimeRangePickerToolbar.d.ts +2 -3
- package/DateTimeRangePicker/DateTimeRangePickerToolbar.js +29 -31
- package/DateTimeRangePicker/shared.d.ts +2 -2
- package/DesktopDateRangePicker/DesktopDateRangePicker.js +9 -3
- package/DesktopDateRangePicker/DesktopDateRangePicker.types.d.ts +5 -0
- package/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.js +17 -14
- package/MobileDateRangePicker/MobileDateRangePicker.js +2 -2
- package/MobileDateTimeRangePicker/MobileDateTimeRangePicker.js +15 -8
- package/MultiInputDateRangeField/MultiInputDateRangeField.d.ts +9 -4
- package/MultiInputDateRangeField/MultiInputDateRangeField.js +12 -116
- package/MultiInputDateRangeField/index.d.ts +5 -3
- package/MultiInputDateRangeField/index.js +2 -2
- package/MultiInputDateRangeField/multiInputDateRangeFieldClasses.d.ts +6 -0
- package/MultiInputDateRangeField/multiInputDateRangeFieldClasses.js +4 -0
- package/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.d.ts +9 -4
- package/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.js +12 -116
- package/MultiInputDateTimeRangeField/index.d.ts +5 -3
- package/MultiInputDateTimeRangeField/index.js +2 -2
- package/MultiInputDateTimeRangeField/multiInputDateTimeRangeFieldClasses.d.ts +6 -0
- package/MultiInputDateTimeRangeField/multiInputDateTimeRangeFieldClasses.js +4 -0
- package/MultiInputTimeRangeField/MultiInputTimeRangeField.d.ts +9 -4
- package/MultiInputTimeRangeField/MultiInputTimeRangeField.js +13 -117
- package/MultiInputTimeRangeField/index.d.ts +5 -3
- package/MultiInputTimeRangeField/index.js +2 -2
- package/MultiInputTimeRangeField/multiInputTimeRangeFieldClasses.d.ts +6 -0
- package/MultiInputTimeRangeField/multiInputTimeRangeFieldClasses.js +4 -0
- package/SingleInputDateRangeField/SingleInputDateRangeField.js +20 -30
- package/SingleInputDateRangeField/SingleInputDateRangeField.types.d.ts +6 -17
- package/SingleInputDateRangeField/useSingleInputDateRangeField.d.ts +1 -1
- package/SingleInputDateRangeField/useSingleInputDateRangeField.js +14 -14
- package/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.js +20 -30
- package/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.types.d.ts +6 -18
- package/SingleInputDateTimeRangeField/useSingleInputDateTimeRangeField.d.ts +1 -1
- package/SingleInputDateTimeRangeField/useSingleInputDateTimeRangeField.js +14 -14
- package/SingleInputTimeRangeField/SingleInputTimeRangeField.js +20 -30
- package/SingleInputTimeRangeField/SingleInputTimeRangeField.types.d.ts +6 -18
- package/SingleInputTimeRangeField/useSingleInputTimeRangeField.d.ts +1 -1
- package/SingleInputTimeRangeField/useSingleInputTimeRangeField.js +14 -14
- package/dateRangeViewRenderers/dateRangeViewRenderers.d.ts +2 -2
- package/dateRangeViewRenderers/dateRangeViewRenderers.js +0 -6
- package/hooks/index.d.ts +2 -0
- package/hooks/index.js +2 -0
- package/hooks/package.json +6 -0
- package/hooks/useMultiInputRangeField/index.d.ts +1 -0
- package/hooks/useMultiInputRangeField/index.js +1 -0
- package/hooks/useMultiInputRangeField/useMultiInputRangeField.d.ts +53 -0
- package/hooks/useMultiInputRangeField/useMultiInputRangeField.js +149 -0
- package/hooks/useMultiInputRangeField/useMultiInputRangeFieldSelectedSections.d.ts +17 -0
- package/{internals/hooks/useMultiInputFieldSelectedSections.js → hooks/useMultiInputRangeField/useMultiInputRangeFieldSelectedSections.js} +10 -8
- package/hooks/useMultiInputRangeField/useMultiInputRangeFieldTextFieldProps.d.ts +17 -0
- package/hooks/useMultiInputRangeField/useMultiInputRangeFieldTextFieldProps.js +59 -0
- package/hooks/usePickerRangePositionContext.d.ts +7 -0
- package/hooks/usePickerRangePositionContext.js +15 -0
- package/index.d.ts +2 -0
- package/index.js +4 -2
- package/internals/hooks/models/index.d.ts +1 -1
- package/internals/hooks/models/useRangePicker.d.ts +6 -8
- package/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.js +40 -67
- package/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.types.d.ts +3 -5
- package/internals/hooks/{useEnrichedRangePickerFieldProps.d.ts → useEnrichedRangePickerField.d.ts} +18 -9
- package/internals/hooks/{useEnrichedRangePickerFieldProps.js → useEnrichedRangePickerField.js} +39 -52
- package/internals/hooks/useMobileRangePicker/useMobileRangePicker.js +33 -56
- package/internals/hooks/useMobileRangePicker/useMobileRangePicker.types.d.ts +3 -5
- package/internals/hooks/useNullablePickerRangePositionContext.d.ts +5 -0
- package/internals/hooks/useNullablePickerRangePositionContext.js +10 -0
- package/internals/hooks/useRangePosition.d.ts +2 -2
- package/internals/hooks/useRangePosition.js +1 -1
- package/internals/hooks/useStaticRangePicker/useStaticRangePicker.js +14 -24
- package/internals/hooks/useStaticRangePicker/useStaticRangePicker.types.d.ts +2 -2
- package/internals/models/dateTimeRange.d.ts +1 -6
- package/internals/models/fields.d.ts +1 -2
- package/internals/models/index.d.ts +0 -1
- package/internals/models/index.js +0 -1
- package/internals/models/managers.d.ts +3 -0
- package/internals/utils/createMultiInputRangeField/createMultiInputRangeField.d.ts +3 -0
- package/internals/utils/createMultiInputRangeField/createMultiInputRangeField.js +133 -0
- package/internals/utils/createMultiInputRangeField/createMultiInputRangeField.types.d.ts +72 -0
- package/internals/utils/createMultiInputRangeField/index.d.ts +3 -0
- package/internals/utils/createMultiInputRangeField/index.js +2 -0
- package/internals/utils/date-range-manager.js +2 -1
- package/internals/utils/releaseInfo.js +1 -1
- package/internals/utils/valueManagers.js +7 -7
- package/managers/index.d.ts +6 -0
- package/managers/index.js +3 -0
- package/managers/package.json +6 -0
- package/managers/useDateRangeManager.d.ts +15 -0
- package/managers/useDateRangeManager.js +33 -0
- package/managers/useDateTimeRangeManager.d.ts +15 -0
- package/managers/useDateTimeRangeManager.js +33 -0
- package/managers/useTimeRangeManager.d.ts +15 -0
- package/managers/useTimeRangeManager.js +31 -0
- package/models/fields.d.ts +1 -2
- package/models/index.d.ts +0 -2
- package/models/index.js +0 -2
- package/models/range.d.ts +0 -1
- package/modern/{AdapterDateFnsJalaliV3 → AdapterDateFnsJalaliV2}/index.js +1 -1
- package/modern/{AdapterDateFnsV3 → AdapterDateFnsV2}/index.js +1 -1
- package/modern/DateRangeCalendar/DateRangeCalendar.js +12 -10
- package/modern/DateRangePicker/DateRangePicker.js +1 -1
- package/modern/DateRangePicker/DateRangePickerToolbar.js +27 -19
- package/modern/DateTimeRangePicker/DateTimeRangePicker.js +2 -2
- package/modern/DateTimeRangePicker/DateTimeRangePickerTabs.js +10 -9
- package/modern/DateTimeRangePicker/DateTimeRangePickerTimeWrapper.js +8 -6
- package/modern/DateTimeRangePicker/DateTimeRangePickerToolbar.js +29 -31
- package/modern/DesktopDateRangePicker/DesktopDateRangePicker.js +9 -3
- package/modern/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.js +17 -14
- package/modern/MobileDateRangePicker/MobileDateRangePicker.js +2 -2
- package/modern/MobileDateTimeRangePicker/MobileDateTimeRangePicker.js +15 -8
- package/modern/MultiInputDateRangeField/MultiInputDateRangeField.js +12 -116
- package/modern/MultiInputDateRangeField/index.js +2 -2
- package/modern/MultiInputDateRangeField/multiInputDateRangeFieldClasses.js +4 -0
- package/modern/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.js +12 -116
- package/modern/MultiInputDateTimeRangeField/index.js +2 -2
- package/modern/MultiInputDateTimeRangeField/multiInputDateTimeRangeFieldClasses.js +4 -0
- package/modern/MultiInputTimeRangeField/MultiInputTimeRangeField.js +13 -117
- package/modern/MultiInputTimeRangeField/index.js +2 -2
- package/modern/MultiInputTimeRangeField/multiInputTimeRangeFieldClasses.js +4 -0
- package/modern/SingleInputDateRangeField/SingleInputDateRangeField.js +20 -30
- package/modern/SingleInputDateRangeField/useSingleInputDateRangeField.js +14 -14
- package/modern/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.js +20 -30
- package/modern/SingleInputDateTimeRangeField/useSingleInputDateTimeRangeField.js +14 -14
- package/modern/SingleInputTimeRangeField/SingleInputTimeRangeField.js +20 -30
- package/modern/SingleInputTimeRangeField/useSingleInputTimeRangeField.js +14 -14
- package/modern/dateRangeViewRenderers/dateRangeViewRenderers.js +0 -6
- package/modern/hooks/index.js +2 -0
- package/modern/hooks/useMultiInputRangeField/index.js +1 -0
- package/modern/hooks/useMultiInputRangeField/useMultiInputRangeField.js +149 -0
- package/modern/{internals/hooks/useMultiInputFieldSelectedSections.js → hooks/useMultiInputRangeField/useMultiInputRangeFieldSelectedSections.js} +10 -8
- package/modern/hooks/useMultiInputRangeField/useMultiInputRangeFieldTextFieldProps.js +59 -0
- package/modern/hooks/usePickerRangePositionContext.js +15 -0
- package/modern/index.js +4 -2
- package/modern/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.js +40 -67
- package/modern/internals/hooks/{useEnrichedRangePickerFieldProps.js → useEnrichedRangePickerField.js} +39 -52
- package/modern/internals/hooks/useMobileRangePicker/useMobileRangePicker.js +33 -56
- package/modern/internals/hooks/useNullablePickerRangePositionContext.js +10 -0
- package/modern/internals/hooks/useRangePosition.js +1 -1
- package/modern/internals/hooks/useStaticRangePicker/useStaticRangePicker.js +14 -24
- package/modern/internals/models/index.js +0 -1
- package/modern/internals/utils/createMultiInputRangeField/createMultiInputRangeField.js +133 -0
- package/modern/internals/utils/createMultiInputRangeField/index.js +2 -0
- package/modern/internals/utils/date-range-manager.js +2 -1
- package/modern/internals/utils/releaseInfo.js +1 -1
- package/modern/internals/utils/valueManagers.js +7 -7
- package/modern/managers/index.js +3 -0
- package/modern/managers/useDateRangeManager.js +33 -0
- package/modern/managers/useDateTimeRangeManager.js +33 -0
- package/modern/managers/useTimeRangeManager.js +31 -0
- package/modern/models/index.js +0 -2
- package/node/{AdapterDateFnsJalaliV3 → AdapterDateFnsJalaliV2}/index.js +1 -1
- package/node/{AdapterDateFnsV3 → AdapterDateFnsV2}/index.js +1 -1
- package/node/DateRangeCalendar/DateRangeCalendar.js +12 -10
- package/node/DateRangePicker/DateRangePicker.js +1 -1
- package/node/DateRangePicker/DateRangePickerToolbar.js +26 -18
- package/node/DateTimeRangePicker/DateTimeRangePicker.js +2 -2
- package/node/DateTimeRangePicker/DateTimeRangePickerTabs.js +10 -9
- package/node/DateTimeRangePicker/DateTimeRangePickerTimeWrapper.js +8 -6
- package/node/DateTimeRangePicker/DateTimeRangePickerToolbar.js +29 -31
- package/node/DesktopDateRangePicker/DesktopDateRangePicker.js +9 -3
- package/node/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.js +17 -14
- package/node/MobileDateRangePicker/MobileDateRangePicker.js +2 -2
- package/node/MobileDateTimeRangePicker/MobileDateTimeRangePicker.js +15 -8
- package/node/MultiInputDateRangeField/MultiInputDateRangeField.js +11 -119
- package/node/MultiInputDateRangeField/index.js +3 -9
- package/node/MultiInputDateRangeField/multiInputDateRangeFieldClasses.js +12 -0
- package/node/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.js +11 -119
- package/node/MultiInputDateTimeRangeField/index.js +3 -9
- package/node/MultiInputDateTimeRangeField/multiInputDateTimeRangeFieldClasses.js +12 -0
- package/node/MultiInputTimeRangeField/MultiInputTimeRangeField.js +12 -120
- package/node/MultiInputTimeRangeField/index.js +3 -9
- package/node/MultiInputTimeRangeField/multiInputTimeRangeFieldClasses.js +12 -0
- package/node/SingleInputDateRangeField/SingleInputDateRangeField.js +19 -29
- package/node/SingleInputDateRangeField/useSingleInputDateRangeField.js +13 -14
- package/node/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.js +19 -29
- package/node/SingleInputDateTimeRangeField/useSingleInputDateTimeRangeField.js +13 -14
- package/node/SingleInputTimeRangeField/SingleInputTimeRangeField.js +19 -29
- package/node/SingleInputTimeRangeField/useSingleInputTimeRangeField.js +13 -14
- package/node/dateRangeViewRenderers/dateRangeViewRenderers.js +0 -6
- package/node/hooks/index.js +19 -0
- package/node/hooks/useMultiInputRangeField/index.js +12 -0
- package/node/hooks/useMultiInputRangeField/useMultiInputRangeField.js +155 -0
- package/node/{internals/hooks/useMultiInputFieldSelectedSections.js → hooks/useMultiInputRangeField/useMultiInputRangeFieldSelectedSections.js} +11 -10
- package/node/hooks/useMultiInputRangeField/useMultiInputRangeFieldTextFieldProps.js +66 -0
- package/node/hooks/usePickerRangePositionContext.js +22 -0
- package/node/index.js +23 -1
- package/node/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.js +39 -66
- package/node/internals/hooks/{useEnrichedRangePickerFieldProps.js → useEnrichedRangePickerField.js} +41 -54
- package/node/internals/hooks/useMobileRangePicker/useMobileRangePicker.js +32 -55
- package/node/internals/hooks/useNullablePickerRangePositionContext.js +16 -0
- package/node/internals/hooks/useRangePosition.js +1 -1
- package/node/internals/hooks/useStaticRangePicker/useStaticRangePicker.js +14 -24
- package/node/internals/models/index.js +0 -11
- package/node/internals/utils/createMultiInputRangeField/createMultiInputRangeField.js +140 -0
- package/node/internals/utils/createMultiInputRangeField/index.js +19 -0
- package/node/internals/utils/date-range-manager.js +2 -1
- package/node/internals/utils/releaseInfo.js +1 -1
- package/node/internals/utils/valueManagers.js +7 -7
- package/node/managers/index.js +26 -0
- package/node/managers/useDateRangeManager.js +40 -0
- package/node/managers/useDateTimeRangeManager.js +40 -0
- package/node/managers/useTimeRangeManager.js +38 -0
- package/node/models/index.js +0 -22
- package/package.json +5 -5
- package/themeAugmentation/overrides.d.ts +6 -4
- package/themeAugmentation/props.d.ts +2 -2
- package/MultiInputDateRangeField/MultiInputDateRangeField.types.d.ts +0 -55
- package/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.types.d.ts +0 -56
- package/MultiInputTimeRangeField/MultiInputTimeRangeField.types.d.ts +0 -56
- package/internals/hooks/useMultiInputFieldSelectedSections.d.ts +0 -20
- package/internals/hooks/useMultiInputRangeField/shared.d.ts +0 -1
- package/internals/hooks/useMultiInputRangeField/shared.js +0 -9
- package/internals/hooks/useMultiInputRangeField/useMultiInputDateRangeField.d.ts +0 -3
- package/internals/hooks/useMultiInputRangeField/useMultiInputDateRangeField.js +0 -113
- package/internals/hooks/useMultiInputRangeField/useMultiInputDateTimeRangeField.d.ts +0 -3
- package/internals/hooks/useMultiInputRangeField/useMultiInputDateTimeRangeField.js +0 -113
- package/internals/hooks/useMultiInputRangeField/useMultiInputRangeField.types.d.ts +0 -11
- package/internals/hooks/useMultiInputRangeField/useMultiInputTimeRangeField.d.ts +0 -3
- package/internals/hooks/useMultiInputRangeField/useMultiInputTimeRangeField.js +0 -113
- package/internals/models/timeRange.d.ts +0 -6
- package/internals/models/timeRange.js +0 -1
- package/models/dateRange.d.ts +0 -7
- package/models/dateRange.js +0 -1
- package/models/multiInputRangeFieldClasses.d.ts +0 -7
- package/models/multiInputRangeFieldClasses.js +0 -1
- package/modern/MultiInputDateRangeField/MultiInputDateRangeField.types.js +0 -1
- package/modern/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.types.js +0 -1
- package/modern/MultiInputTimeRangeField/MultiInputTimeRangeField.types.js +0 -1
- package/modern/internals/hooks/useMultiInputRangeField/shared.js +0 -9
- package/modern/internals/hooks/useMultiInputRangeField/useMultiInputDateRangeField.js +0 -113
- package/modern/internals/hooks/useMultiInputRangeField/useMultiInputDateTimeRangeField.js +0 -113
- package/modern/internals/hooks/useMultiInputRangeField/useMultiInputRangeField.types.js +0 -1
- package/modern/internals/hooks/useMultiInputRangeField/useMultiInputTimeRangeField.js +0 -113
- package/modern/internals/models/timeRange.js +0 -1
- package/modern/models/dateRange.js +0 -1
- package/modern/models/multiInputRangeFieldClasses.js +0 -1
- package/node/MultiInputTimeRangeField/MultiInputTimeRangeField.types.js +0 -5
- package/node/internals/hooks/useMultiInputRangeField/shared.js +0 -16
- package/node/internals/hooks/useMultiInputRangeField/useMultiInputDateRangeField.js +0 -121
- package/node/internals/hooks/useMultiInputRangeField/useMultiInputDateTimeRangeField.js +0 -121
- package/node/internals/hooks/useMultiInputRangeField/useMultiInputRangeField.types.js +0 -5
- package/node/internals/hooks/useMultiInputRangeField/useMultiInputTimeRangeField.js +0 -121
- package/node/internals/models/timeRange.js +0 -5
- package/node/models/dateRange.js +0 -5
- package/node/models/multiInputRangeFieldClasses.js +0 -5
- /package/{MultiInputDateRangeField/MultiInputDateRangeField.types.js → internals/models/managers.js} +0 -0
- /package/{MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.types.js → internals/utils/createMultiInputRangeField/createMultiInputRangeField.types.js} +0 -0
- /package/{MultiInputTimeRangeField/MultiInputTimeRangeField.types.js → modern/internals/models/managers.js} +0 -0
- /package/{internals/hooks/useMultiInputRangeField/useMultiInputRangeField.types.js → modern/internals/utils/createMultiInputRangeField/createMultiInputRangeField.types.js} +0 -0
- /package/node/{MultiInputDateRangeField/MultiInputDateRangeField.types.js → internals/models/managers.js} +0 -0
- /package/node/{MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.types.js → internals/utils/createMultiInputRangeField/createMultiInputRangeField.types.js} +0 -0
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import type { TypographyProps } from '@mui/material/Typography';
|
|
3
|
-
import type { StackProps } from '@mui/material/Stack';
|
|
4
|
-
import type { TextFieldProps } from '@mui/material/TextField';
|
|
5
|
-
import { FieldOwnerState } from '@mui/x-date-pickers/models';
|
|
6
|
-
import { SlotComponentPropsFromProps } from '@mui/x-internals/types';
|
|
7
|
-
import { PickersTextFieldProps } from '@mui/x-date-pickers/PickersTextField';
|
|
8
|
-
import { UseDateTimeRangeFieldProps } from '../internals/models/dateTimeRange';
|
|
9
|
-
import { UseMultiInputRangeFieldParams } from '../internals/hooks/useMultiInputRangeField/useMultiInputRangeField.types';
|
|
10
|
-
import { MultiInputFieldRefs, MultiInputRangeFieldClasses, RangePosition } from '../models';
|
|
11
|
-
export type UseMultiInputDateTimeRangeFieldParams<TEnableAccessibleFieldDOMStructure extends boolean, TTextFieldSlotProps extends {}> = UseMultiInputRangeFieldParams<UseMultiInputDateTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>, TTextFieldSlotProps>;
|
|
12
|
-
export interface UseMultiInputDateTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure extends boolean> extends Omit<UseDateTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>, 'unstableFieldRef' | 'clearable' | 'onClear'>, MultiInputFieldRefs {
|
|
13
|
-
}
|
|
14
|
-
export type UseMultiInputDateTimeRangeFieldComponentProps<TEnableAccessibleFieldDOMStructure extends boolean, TChildProps extends {}> = Omit<TChildProps, keyof UseMultiInputDateTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>> & UseMultiInputDateTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>;
|
|
15
|
-
export interface MultiInputDateTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends UseMultiInputDateTimeRangeFieldComponentProps<TEnableAccessibleFieldDOMStructure, Omit<StackProps, 'position'>> {
|
|
16
|
-
autoFocus?: boolean;
|
|
17
|
-
/**
|
|
18
|
-
* Override or extend the styles applied to the component.
|
|
19
|
-
*/
|
|
20
|
-
classes?: Partial<MultiInputRangeFieldClasses>;
|
|
21
|
-
/**
|
|
22
|
-
* Overridable component slots.
|
|
23
|
-
* @default {}
|
|
24
|
-
*/
|
|
25
|
-
slots?: MultiInputDateTimeRangeFieldSlots;
|
|
26
|
-
/**
|
|
27
|
-
* The props used for each component slot.
|
|
28
|
-
* @default {}
|
|
29
|
-
*/
|
|
30
|
-
slotProps?: MultiInputDateTimeRangeFieldSlotProps;
|
|
31
|
-
}
|
|
32
|
-
export interface MultiInputDateTimeRangeFieldSlots {
|
|
33
|
-
/**
|
|
34
|
-
* Element rendered at the root.
|
|
35
|
-
* @default MultiInputDateTimeRangeFieldRoot
|
|
36
|
-
*/
|
|
37
|
-
root?: React.ElementType;
|
|
38
|
-
/**
|
|
39
|
-
* Form control with an input to render a date and time.
|
|
40
|
-
* It is rendered twice: once for the start date time and once for the end date time.
|
|
41
|
-
* @default TextField from '@mui/material' or PickersTextField if `enableAccessibleFieldDOMStructure` is `true`.
|
|
42
|
-
*/
|
|
43
|
-
textField?: React.ElementType;
|
|
44
|
-
/**
|
|
45
|
-
* Element rendered between the two inputs.
|
|
46
|
-
* @default MultiInputDateTimeRangeFieldSeparator
|
|
47
|
-
*/
|
|
48
|
-
separator?: React.ElementType;
|
|
49
|
-
}
|
|
50
|
-
export interface MultiInputDateTimeRangeFieldSlotProps {
|
|
51
|
-
root?: SlotComponentPropsFromProps<StackProps, {}, FieldOwnerState>;
|
|
52
|
-
textField?: SlotComponentPropsFromProps<PickersTextFieldProps | TextFieldProps, {}, FieldOwnerState & {
|
|
53
|
-
position: RangePosition;
|
|
54
|
-
}>;
|
|
55
|
-
separator?: SlotComponentPropsFromProps<TypographyProps, {}, FieldOwnerState>;
|
|
56
|
-
}
|
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import type { TypographyProps } from '@mui/material/Typography';
|
|
3
|
-
import type { StackProps } from '@mui/material/Stack';
|
|
4
|
-
import type { TextFieldProps } from '@mui/material/TextField';
|
|
5
|
-
import { FieldOwnerState } from '@mui/x-date-pickers/models';
|
|
6
|
-
import { SlotComponentPropsFromProps } from '@mui/x-internals/types';
|
|
7
|
-
import { PickersTextFieldProps } from '@mui/x-date-pickers/PickersTextField';
|
|
8
|
-
import { UseTimeRangeFieldProps } from '../internals/models/timeRange';
|
|
9
|
-
import { UseMultiInputRangeFieldParams } from '../internals/hooks/useMultiInputRangeField/useMultiInputRangeField.types';
|
|
10
|
-
import { MultiInputFieldRefs, MultiInputRangeFieldClasses, RangePosition } from '../models';
|
|
11
|
-
export type UseMultiInputTimeRangeFieldParams<TEnableAccessibleFieldDOMStructure extends boolean, TTextFieldSlotProps extends {}> = UseMultiInputRangeFieldParams<UseMultiInputTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>, TTextFieldSlotProps>;
|
|
12
|
-
export interface UseMultiInputTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure extends boolean> extends Omit<UseTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>, 'unstableFieldRef' | 'clearable' | 'onClear'>, MultiInputFieldRefs {
|
|
13
|
-
}
|
|
14
|
-
export type UseMultiInputTimeRangeFieldComponentProps<TEnableAccessibleFieldDOMStructure extends boolean, TChildProps extends {}> = Omit<TChildProps, keyof UseMultiInputTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>> & UseMultiInputTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>;
|
|
15
|
-
export interface MultiInputTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends UseMultiInputTimeRangeFieldComponentProps<TEnableAccessibleFieldDOMStructure, Omit<StackProps, 'position'>> {
|
|
16
|
-
autoFocus?: boolean;
|
|
17
|
-
/**
|
|
18
|
-
* Override or extend the styles applied to the component.
|
|
19
|
-
*/
|
|
20
|
-
classes?: Partial<MultiInputRangeFieldClasses>;
|
|
21
|
-
/**
|
|
22
|
-
* Overridable slots.
|
|
23
|
-
* @default {}
|
|
24
|
-
*/
|
|
25
|
-
slots?: MultiInputTimeRangeFieldSlots;
|
|
26
|
-
/**
|
|
27
|
-
* The props used for each component slot.
|
|
28
|
-
* @default {}
|
|
29
|
-
*/
|
|
30
|
-
slotProps?: MultiInputTimeRangeFieldSlotProps;
|
|
31
|
-
}
|
|
32
|
-
export interface MultiInputTimeRangeFieldSlots {
|
|
33
|
-
/**
|
|
34
|
-
* Element rendered at the root.
|
|
35
|
-
* @default MultiInputTimeRangeFieldRoot
|
|
36
|
-
*/
|
|
37
|
-
root?: React.ElementType;
|
|
38
|
-
/**
|
|
39
|
-
* Form control with an input to render a time.
|
|
40
|
-
* It is rendered twice: once for the start time and once for the end time.
|
|
41
|
-
* @default TextField from '@mui/material' or PickersTextField if `enableAccessibleFieldDOMStructure` is `true`.
|
|
42
|
-
*/
|
|
43
|
-
textField?: React.ElementType;
|
|
44
|
-
/**
|
|
45
|
-
* Element rendered between the two inputs.
|
|
46
|
-
* @default MultiInputTimeRangeFieldSeparator
|
|
47
|
-
*/
|
|
48
|
-
separator?: React.ElementType;
|
|
49
|
-
}
|
|
50
|
-
export interface MultiInputTimeRangeFieldSlotProps {
|
|
51
|
-
root?: SlotComponentPropsFromProps<StackProps, {}, FieldOwnerState>;
|
|
52
|
-
textField?: SlotComponentPropsFromProps<PickersTextFieldProps | TextFieldProps, {}, FieldOwnerState & {
|
|
53
|
-
position: RangePosition;
|
|
54
|
-
}>;
|
|
55
|
-
separator?: SlotComponentPropsFromProps<TypographyProps, {}, FieldOwnerState>;
|
|
56
|
-
}
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { PickerRangeValue, PickerValue, UseFieldInternalProps } from '@mui/x-date-pickers/internals';
|
|
3
|
-
import { FieldRef, FieldSelectedSections } from '@mui/x-date-pickers/models';
|
|
4
|
-
interface UseMultiInputFieldSelectedSectionsParams extends Pick<UseFieldInternalProps<PickerRangeValue, any, any>, 'selectedSections' | 'onSelectedSectionsChange'> {
|
|
5
|
-
unstableStartFieldRef?: React.Ref<FieldRef<PickerValue>>;
|
|
6
|
-
unstableEndFieldRef?: React.Ref<FieldRef<PickerValue>>;
|
|
7
|
-
}
|
|
8
|
-
export declare const useMultiInputFieldSelectedSections: (params: UseMultiInputFieldSelectedSectionsParams) => {
|
|
9
|
-
start: {
|
|
10
|
-
unstableFieldRef: React.Ref<FieldRef<PickerValue>> | undefined;
|
|
11
|
-
selectedSections: FieldSelectedSections;
|
|
12
|
-
onSelectedSectionsChange: (newSelectedSections: FieldSelectedSections) => void;
|
|
13
|
-
};
|
|
14
|
-
end: {
|
|
15
|
-
unstableFieldRef: ((instance: FieldRef<PickerValue> | null) => void | React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | null;
|
|
16
|
-
selectedSections: FieldSelectedSections;
|
|
17
|
-
onSelectedSectionsChange: (newSelectedSections: FieldSelectedSections) => void;
|
|
18
|
-
};
|
|
19
|
-
};
|
|
20
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const excludeProps: <TProps extends {}>(props: TProps, excludedProps: Array<keyof TProps>) => TProps;
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
/* TODO: remove this when a clearable behavior for multiple input range fields is implemented */
|
|
2
|
-
export const excludeProps = (props, excludedProps) => {
|
|
3
|
-
return Object.keys(props).reduce((acc, key) => {
|
|
4
|
-
if (!excludedProps.includes(key)) {
|
|
5
|
-
acc[key] = props[key];
|
|
6
|
-
}
|
|
7
|
-
return acc;
|
|
8
|
-
}, {});
|
|
9
|
-
};
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
import { UseMultiInputDateRangeFieldParams } from '../../../MultiInputDateRangeField/MultiInputDateRangeField.types';
|
|
2
|
-
import type { UseMultiInputRangeFieldResponse } from './useMultiInputRangeField.types';
|
|
3
|
-
export declare const useMultiInputDateRangeField: <TEnableAccessibleFieldDOMStructure extends boolean, TTextFieldSlotProps extends {}>({ sharedProps: inSharedProps, startTextFieldProps, unstableStartFieldRef, endTextFieldProps, unstableEndFieldRef, }: UseMultiInputDateRangeFieldParams<TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>) => UseMultiInputRangeFieldResponse<TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>;
|
|
@@ -1,113 +0,0 @@
|
|
|
1
|
-
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
-
import useEventCallback from '@mui/utils/useEventCallback';
|
|
3
|
-
import { unstable_useDateField as useDateField } from '@mui/x-date-pickers/DateField';
|
|
4
|
-
import { useControlledValueWithTimezone, useDefaultizedDateField } from '@mui/x-date-pickers/internals';
|
|
5
|
-
import { useValidation } from '@mui/x-date-pickers/validation';
|
|
6
|
-
import { validateDateRange } from "../../../validation/index.js";
|
|
7
|
-
import { rangeValueManager } from "../../utils/valueManagers.js";
|
|
8
|
-
import { excludeProps } from "./shared.js";
|
|
9
|
-
import { useMultiInputFieldSelectedSections } from "../useMultiInputFieldSelectedSections.js";
|
|
10
|
-
export const useMultiInputDateRangeField = ({
|
|
11
|
-
sharedProps: inSharedProps,
|
|
12
|
-
startTextFieldProps,
|
|
13
|
-
unstableStartFieldRef,
|
|
14
|
-
endTextFieldProps,
|
|
15
|
-
unstableEndFieldRef
|
|
16
|
-
}) => {
|
|
17
|
-
const sharedProps = useDefaultizedDateField(inSharedProps);
|
|
18
|
-
const {
|
|
19
|
-
value: valueProp,
|
|
20
|
-
defaultValue,
|
|
21
|
-
referenceDate,
|
|
22
|
-
format,
|
|
23
|
-
formatDensity,
|
|
24
|
-
shouldRespectLeadingZeros,
|
|
25
|
-
onChange,
|
|
26
|
-
disabled,
|
|
27
|
-
readOnly,
|
|
28
|
-
selectedSections,
|
|
29
|
-
onSelectedSectionsChange,
|
|
30
|
-
timezone: timezoneProp,
|
|
31
|
-
enableAccessibleFieldDOMStructure,
|
|
32
|
-
autoFocus
|
|
33
|
-
} = sharedProps;
|
|
34
|
-
const {
|
|
35
|
-
value,
|
|
36
|
-
handleValueChange,
|
|
37
|
-
timezone
|
|
38
|
-
} = useControlledValueWithTimezone({
|
|
39
|
-
name: 'useMultiInputDateRangeField',
|
|
40
|
-
timezone: timezoneProp,
|
|
41
|
-
value: valueProp,
|
|
42
|
-
defaultValue,
|
|
43
|
-
referenceDate,
|
|
44
|
-
onChange,
|
|
45
|
-
valueManager: rangeValueManager
|
|
46
|
-
});
|
|
47
|
-
const {
|
|
48
|
-
validationError,
|
|
49
|
-
getValidationErrorForNewValue
|
|
50
|
-
} = useValidation({
|
|
51
|
-
props: sharedProps,
|
|
52
|
-
value,
|
|
53
|
-
timezone,
|
|
54
|
-
validator: validateDateRange,
|
|
55
|
-
onError: sharedProps.onError
|
|
56
|
-
});
|
|
57
|
-
|
|
58
|
-
// TODO: Maybe export utility from `useField` instead of copy/pasting the logic
|
|
59
|
-
const buildChangeHandler = index => {
|
|
60
|
-
return (newDate, rawContext) => {
|
|
61
|
-
const newDateRange = index === 0 ? [newDate, value[1]] : [value[0], newDate];
|
|
62
|
-
const context = _extends({}, rawContext, {
|
|
63
|
-
validationError: getValidationErrorForNewValue(newDateRange)
|
|
64
|
-
});
|
|
65
|
-
handleValueChange(newDateRange, context);
|
|
66
|
-
};
|
|
67
|
-
};
|
|
68
|
-
const handleStartDateChange = useEventCallback(buildChangeHandler(0));
|
|
69
|
-
const handleEndDateChange = useEventCallback(buildChangeHandler(1));
|
|
70
|
-
const selectedSectionsResponse = useMultiInputFieldSelectedSections({
|
|
71
|
-
selectedSections,
|
|
72
|
-
onSelectedSectionsChange,
|
|
73
|
-
unstableStartFieldRef,
|
|
74
|
-
unstableEndFieldRef
|
|
75
|
-
});
|
|
76
|
-
const startFieldProps = _extends({
|
|
77
|
-
error: !!validationError[0]
|
|
78
|
-
}, startTextFieldProps, selectedSectionsResponse.start, {
|
|
79
|
-
disabled,
|
|
80
|
-
readOnly,
|
|
81
|
-
format,
|
|
82
|
-
formatDensity,
|
|
83
|
-
shouldRespectLeadingZeros,
|
|
84
|
-
timezone,
|
|
85
|
-
value: valueProp === undefined ? undefined : valueProp[0],
|
|
86
|
-
defaultValue: defaultValue === undefined ? undefined : defaultValue[0],
|
|
87
|
-
onChange: handleStartDateChange,
|
|
88
|
-
enableAccessibleFieldDOMStructure,
|
|
89
|
-
autoFocus // Do not add on end field.
|
|
90
|
-
});
|
|
91
|
-
const endFieldProps = _extends({
|
|
92
|
-
error: !!validationError[1]
|
|
93
|
-
}, endTextFieldProps, selectedSectionsResponse.end, {
|
|
94
|
-
format,
|
|
95
|
-
formatDensity,
|
|
96
|
-
shouldRespectLeadingZeros,
|
|
97
|
-
disabled,
|
|
98
|
-
readOnly,
|
|
99
|
-
timezone,
|
|
100
|
-
value: valueProp === undefined ? undefined : valueProp[1],
|
|
101
|
-
defaultValue: defaultValue === undefined ? undefined : defaultValue[1],
|
|
102
|
-
onChange: handleEndDateChange,
|
|
103
|
-
enableAccessibleFieldDOMStructure
|
|
104
|
-
});
|
|
105
|
-
const startDateResponse = useDateField(startFieldProps);
|
|
106
|
-
const endDateResponse = useDateField(endFieldProps);
|
|
107
|
-
|
|
108
|
-
/* TODO: Undo this change when a clearable behavior for multiple input range fields is implemented */
|
|
109
|
-
return {
|
|
110
|
-
startDate: excludeProps(startDateResponse, ['clearable', 'onClear']),
|
|
111
|
-
endDate: excludeProps(endDateResponse, ['clearable', 'onClear'])
|
|
112
|
-
};
|
|
113
|
-
};
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
import type { UseMultiInputDateTimeRangeFieldParams } from '../../../MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.types';
|
|
2
|
-
import type { UseMultiInputRangeFieldResponse } from './useMultiInputRangeField.types';
|
|
3
|
-
export declare const useMultiInputDateTimeRangeField: <TEnableAccessibleFieldDOMStructure extends boolean, TTextFieldSlotProps extends {}>({ sharedProps: inSharedProps, startTextFieldProps, unstableStartFieldRef, endTextFieldProps, unstableEndFieldRef, }: UseMultiInputDateTimeRangeFieldParams<TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>) => UseMultiInputRangeFieldResponse<TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>;
|
|
@@ -1,113 +0,0 @@
|
|
|
1
|
-
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
-
import useEventCallback from '@mui/utils/useEventCallback';
|
|
3
|
-
import { unstable_useDateTimeField as useDateTimeField } from '@mui/x-date-pickers/DateTimeField';
|
|
4
|
-
import { useControlledValueWithTimezone, useDefaultizedDateTimeField } from '@mui/x-date-pickers/internals';
|
|
5
|
-
import { useValidation } from '@mui/x-date-pickers/validation';
|
|
6
|
-
import { validateDateTimeRange } from "../../../validation/index.js";
|
|
7
|
-
import { rangeValueManager } from "../../utils/valueManagers.js";
|
|
8
|
-
import { excludeProps } from "./shared.js";
|
|
9
|
-
import { useMultiInputFieldSelectedSections } from "../useMultiInputFieldSelectedSections.js";
|
|
10
|
-
export const useMultiInputDateTimeRangeField = ({
|
|
11
|
-
sharedProps: inSharedProps,
|
|
12
|
-
startTextFieldProps,
|
|
13
|
-
unstableStartFieldRef,
|
|
14
|
-
endTextFieldProps,
|
|
15
|
-
unstableEndFieldRef
|
|
16
|
-
}) => {
|
|
17
|
-
const sharedProps = useDefaultizedDateTimeField(inSharedProps);
|
|
18
|
-
const {
|
|
19
|
-
value: valueProp,
|
|
20
|
-
defaultValue,
|
|
21
|
-
referenceDate,
|
|
22
|
-
format,
|
|
23
|
-
formatDensity,
|
|
24
|
-
shouldRespectLeadingZeros,
|
|
25
|
-
onChange,
|
|
26
|
-
disabled,
|
|
27
|
-
readOnly,
|
|
28
|
-
selectedSections,
|
|
29
|
-
onSelectedSectionsChange,
|
|
30
|
-
timezone: timezoneProp,
|
|
31
|
-
enableAccessibleFieldDOMStructure,
|
|
32
|
-
autoFocus
|
|
33
|
-
} = sharedProps;
|
|
34
|
-
const {
|
|
35
|
-
value,
|
|
36
|
-
handleValueChange,
|
|
37
|
-
timezone
|
|
38
|
-
} = useControlledValueWithTimezone({
|
|
39
|
-
name: 'useMultiInputDateRangeField',
|
|
40
|
-
timezone: timezoneProp,
|
|
41
|
-
value: valueProp,
|
|
42
|
-
defaultValue,
|
|
43
|
-
referenceDate,
|
|
44
|
-
onChange,
|
|
45
|
-
valueManager: rangeValueManager
|
|
46
|
-
});
|
|
47
|
-
const {
|
|
48
|
-
validationError,
|
|
49
|
-
getValidationErrorForNewValue
|
|
50
|
-
} = useValidation({
|
|
51
|
-
props: sharedProps,
|
|
52
|
-
value,
|
|
53
|
-
timezone,
|
|
54
|
-
validator: validateDateTimeRange,
|
|
55
|
-
onError: sharedProps.onError
|
|
56
|
-
});
|
|
57
|
-
|
|
58
|
-
// TODO: Maybe export utility from `useField` instead of copy/pasting the logic
|
|
59
|
-
const buildChangeHandler = index => {
|
|
60
|
-
return (newDate, rawContext) => {
|
|
61
|
-
const newDateRange = index === 0 ? [newDate, value[1]] : [value[0], newDate];
|
|
62
|
-
const context = _extends({}, rawContext, {
|
|
63
|
-
validationError: getValidationErrorForNewValue(newDateRange)
|
|
64
|
-
});
|
|
65
|
-
handleValueChange(newDateRange, context);
|
|
66
|
-
};
|
|
67
|
-
};
|
|
68
|
-
const handleStartDateChange = useEventCallback(buildChangeHandler(0));
|
|
69
|
-
const handleEndDateChange = useEventCallback(buildChangeHandler(1));
|
|
70
|
-
const selectedSectionsResponse = useMultiInputFieldSelectedSections({
|
|
71
|
-
selectedSections,
|
|
72
|
-
onSelectedSectionsChange,
|
|
73
|
-
unstableStartFieldRef,
|
|
74
|
-
unstableEndFieldRef
|
|
75
|
-
});
|
|
76
|
-
const startFieldProps = _extends({
|
|
77
|
-
error: !!validationError[0]
|
|
78
|
-
}, startTextFieldProps, selectedSectionsResponse.start, {
|
|
79
|
-
disabled,
|
|
80
|
-
readOnly,
|
|
81
|
-
format,
|
|
82
|
-
formatDensity,
|
|
83
|
-
shouldRespectLeadingZeros,
|
|
84
|
-
timezone,
|
|
85
|
-
value: valueProp === undefined ? undefined : valueProp[0],
|
|
86
|
-
defaultValue: defaultValue === undefined ? undefined : defaultValue[0],
|
|
87
|
-
onChange: handleStartDateChange,
|
|
88
|
-
enableAccessibleFieldDOMStructure,
|
|
89
|
-
autoFocus // Do not add on end field.
|
|
90
|
-
});
|
|
91
|
-
const endFieldProps = _extends({
|
|
92
|
-
error: !!validationError[1]
|
|
93
|
-
}, endTextFieldProps, selectedSectionsResponse.end, {
|
|
94
|
-
format,
|
|
95
|
-
formatDensity,
|
|
96
|
-
shouldRespectLeadingZeros,
|
|
97
|
-
disabled,
|
|
98
|
-
readOnly,
|
|
99
|
-
timezone,
|
|
100
|
-
value: valueProp === undefined ? undefined : valueProp[1],
|
|
101
|
-
defaultValue: defaultValue === undefined ? undefined : defaultValue[1],
|
|
102
|
-
onChange: handleEndDateChange,
|
|
103
|
-
enableAccessibleFieldDOMStructure
|
|
104
|
-
});
|
|
105
|
-
const startDateResponse = useDateTimeField(startFieldProps);
|
|
106
|
-
const endDateResponse = useDateTimeField(endFieldProps);
|
|
107
|
-
|
|
108
|
-
/* TODO: Undo this change when a clearable behavior for multiple input range fields is implemented */
|
|
109
|
-
return {
|
|
110
|
-
startDate: excludeProps(startDateResponse, ['clearable', 'onClear']),
|
|
111
|
-
endDate: excludeProps(endDateResponse, ['clearable', 'onClear'])
|
|
112
|
-
};
|
|
113
|
-
};
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { UseFieldResponse } from '@mui/x-date-pickers/internals';
|
|
2
|
-
import { MultiInputFieldRefs } from '../../../models';
|
|
3
|
-
export interface UseMultiInputRangeFieldParams<TSharedProps extends {}, TTextFieldSlotProps extends {}> extends MultiInputFieldRefs {
|
|
4
|
-
sharedProps: TSharedProps;
|
|
5
|
-
startTextFieldProps: TTextFieldSlotProps;
|
|
6
|
-
endTextFieldProps: TTextFieldSlotProps;
|
|
7
|
-
}
|
|
8
|
-
export interface UseMultiInputRangeFieldResponse<TEnableAccessibleFieldDOMStructure extends boolean, TForwardedProps extends {}> {
|
|
9
|
-
startDate: UseFieldResponse<TEnableAccessibleFieldDOMStructure, TForwardedProps>;
|
|
10
|
-
endDate: UseFieldResponse<TEnableAccessibleFieldDOMStructure, TForwardedProps>;
|
|
11
|
-
}
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
import type { UseMultiInputTimeRangeFieldParams } from '../../../MultiInputTimeRangeField/MultiInputTimeRangeField.types';
|
|
2
|
-
import type { UseMultiInputRangeFieldResponse } from './useMultiInputRangeField.types';
|
|
3
|
-
export declare const useMultiInputTimeRangeField: <TEnableAccessibleFieldDOMStructure extends boolean, TTextFieldSlotProps extends {}>({ sharedProps: inSharedProps, startTextFieldProps, unstableStartFieldRef, endTextFieldProps, unstableEndFieldRef, }: UseMultiInputTimeRangeFieldParams<TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>) => UseMultiInputRangeFieldResponse<TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>;
|
|
@@ -1,113 +0,0 @@
|
|
|
1
|
-
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
-
import useEventCallback from '@mui/utils/useEventCallback';
|
|
3
|
-
import { unstable_useTimeField as useTimeField } from '@mui/x-date-pickers/TimeField';
|
|
4
|
-
import { useControlledValueWithTimezone, useDefaultizedTimeField } from '@mui/x-date-pickers/internals';
|
|
5
|
-
import { useValidation } from '@mui/x-date-pickers/validation';
|
|
6
|
-
import { validateTimeRange } from "../../../validation/index.js";
|
|
7
|
-
import { rangeValueManager } from "../../utils/valueManagers.js";
|
|
8
|
-
import { excludeProps } from "./shared.js";
|
|
9
|
-
import { useMultiInputFieldSelectedSections } from "../useMultiInputFieldSelectedSections.js";
|
|
10
|
-
export const useMultiInputTimeRangeField = ({
|
|
11
|
-
sharedProps: inSharedProps,
|
|
12
|
-
startTextFieldProps,
|
|
13
|
-
unstableStartFieldRef,
|
|
14
|
-
endTextFieldProps,
|
|
15
|
-
unstableEndFieldRef
|
|
16
|
-
}) => {
|
|
17
|
-
const sharedProps = useDefaultizedTimeField(inSharedProps);
|
|
18
|
-
const {
|
|
19
|
-
value: valueProp,
|
|
20
|
-
defaultValue,
|
|
21
|
-
referenceDate,
|
|
22
|
-
format,
|
|
23
|
-
formatDensity,
|
|
24
|
-
shouldRespectLeadingZeros,
|
|
25
|
-
onChange,
|
|
26
|
-
disabled,
|
|
27
|
-
readOnly,
|
|
28
|
-
selectedSections,
|
|
29
|
-
onSelectedSectionsChange,
|
|
30
|
-
timezone: timezoneProp,
|
|
31
|
-
enableAccessibleFieldDOMStructure,
|
|
32
|
-
autoFocus
|
|
33
|
-
} = sharedProps;
|
|
34
|
-
const {
|
|
35
|
-
value,
|
|
36
|
-
handleValueChange,
|
|
37
|
-
timezone
|
|
38
|
-
} = useControlledValueWithTimezone({
|
|
39
|
-
name: 'useMultiInputDateRangeField',
|
|
40
|
-
timezone: timezoneProp,
|
|
41
|
-
value: valueProp,
|
|
42
|
-
defaultValue,
|
|
43
|
-
onChange,
|
|
44
|
-
valueManager: rangeValueManager,
|
|
45
|
-
referenceDate
|
|
46
|
-
});
|
|
47
|
-
const {
|
|
48
|
-
validationError,
|
|
49
|
-
getValidationErrorForNewValue
|
|
50
|
-
} = useValidation({
|
|
51
|
-
props: sharedProps,
|
|
52
|
-
validator: validateTimeRange,
|
|
53
|
-
value,
|
|
54
|
-
timezone,
|
|
55
|
-
onError: sharedProps.onError
|
|
56
|
-
});
|
|
57
|
-
|
|
58
|
-
// TODO: Maybe export utility from `useField` instead of copy/pasting the logic
|
|
59
|
-
const buildChangeHandler = index => {
|
|
60
|
-
return (newDate, rawContext) => {
|
|
61
|
-
const newDateRange = index === 0 ? [newDate, value[1]] : [value[0], newDate];
|
|
62
|
-
const context = _extends({}, rawContext, {
|
|
63
|
-
validationError: getValidationErrorForNewValue(newDateRange)
|
|
64
|
-
});
|
|
65
|
-
handleValueChange(newDateRange, context);
|
|
66
|
-
};
|
|
67
|
-
};
|
|
68
|
-
const handleStartDateChange = useEventCallback(buildChangeHandler(0));
|
|
69
|
-
const handleEndDateChange = useEventCallback(buildChangeHandler(1));
|
|
70
|
-
const selectedSectionsResponse = useMultiInputFieldSelectedSections({
|
|
71
|
-
selectedSections,
|
|
72
|
-
onSelectedSectionsChange,
|
|
73
|
-
unstableStartFieldRef,
|
|
74
|
-
unstableEndFieldRef
|
|
75
|
-
});
|
|
76
|
-
const startFieldProps = _extends({
|
|
77
|
-
error: !!validationError[0]
|
|
78
|
-
}, startTextFieldProps, selectedSectionsResponse.start, {
|
|
79
|
-
disabled,
|
|
80
|
-
readOnly,
|
|
81
|
-
format,
|
|
82
|
-
formatDensity,
|
|
83
|
-
shouldRespectLeadingZeros,
|
|
84
|
-
timezone,
|
|
85
|
-
value: valueProp === undefined ? undefined : valueProp[0],
|
|
86
|
-
defaultValue: defaultValue === undefined ? undefined : defaultValue[0],
|
|
87
|
-
onChange: handleStartDateChange,
|
|
88
|
-
enableAccessibleFieldDOMStructure,
|
|
89
|
-
autoFocus // Do not add on end field.
|
|
90
|
-
});
|
|
91
|
-
const endFieldProps = _extends({
|
|
92
|
-
error: !!validationError[1]
|
|
93
|
-
}, endTextFieldProps, selectedSectionsResponse.end, {
|
|
94
|
-
format,
|
|
95
|
-
formatDensity,
|
|
96
|
-
shouldRespectLeadingZeros,
|
|
97
|
-
disabled,
|
|
98
|
-
readOnly,
|
|
99
|
-
timezone,
|
|
100
|
-
value: valueProp === undefined ? undefined : valueProp[1],
|
|
101
|
-
defaultValue: defaultValue === undefined ? undefined : defaultValue[1],
|
|
102
|
-
onChange: handleEndDateChange,
|
|
103
|
-
enableAccessibleFieldDOMStructure
|
|
104
|
-
});
|
|
105
|
-
const startDateResponse = useTimeField(startFieldProps);
|
|
106
|
-
const endDateResponse = useTimeField(endFieldProps);
|
|
107
|
-
|
|
108
|
-
/* TODO: Undo this change when a clearable behavior for multiple input range fields is implemented */
|
|
109
|
-
return {
|
|
110
|
-
startDate: excludeProps(startDateResponse, ['clearable', 'onClear']),
|
|
111
|
-
endDate: excludeProps(endDateResponse, ['clearable', 'onClear'])
|
|
112
|
-
};
|
|
113
|
-
};
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import { MakeOptional } from '@mui/x-internals/types';
|
|
2
|
-
import { UseFieldInternalProps, AmPmProps, PickerRangeValue } from '@mui/x-date-pickers/internals';
|
|
3
|
-
import { TimeRangeValidationError, RangeFieldSeparatorProps } from '../../models';
|
|
4
|
-
import type { ExportedValidateTimeRangeProps } from '../../validation/validateTimeRange';
|
|
5
|
-
export interface UseTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure extends boolean> extends MakeOptional<Omit<UseFieldInternalProps<PickerRangeValue, TEnableAccessibleFieldDOMStructure, TimeRangeValidationError>, 'unstableFieldRef'>, 'format'>, RangeFieldSeparatorProps, ExportedValidateTimeRangeProps, AmPmProps {
|
|
6
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
package/models/dateRange.d.ts
DELETED
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import { MakeOptional } from '@mui/x-internals/types';
|
|
2
|
-
import { PickerRangeValue, UseFieldInternalProps } from '@mui/x-date-pickers/internals';
|
|
3
|
-
import { RangeFieldSeparatorProps } from './fields';
|
|
4
|
-
import { DateRangeValidationError } from './validation';
|
|
5
|
-
import type { ExportedValidateDateRangeProps } from '../validation/validateDateRange';
|
|
6
|
-
export interface UseDateRangeFieldProps<TEnableAccessibleFieldDOMStructure extends boolean> extends MakeOptional<Omit<UseFieldInternalProps<PickerRangeValue, TEnableAccessibleFieldDOMStructure, DateRangeValidationError>, 'unstableFieldRef'>, 'format'>, RangeFieldSeparatorProps, ExportedValidateDateRangeProps {
|
|
7
|
-
}
|
package/models/dateRange.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
/* TODO: remove this when a clearable behavior for multiple input range fields is implemented */
|
|
2
|
-
export const excludeProps = (props, excludedProps) => {
|
|
3
|
-
return Object.keys(props).reduce((acc, key) => {
|
|
4
|
-
if (!excludedProps.includes(key)) {
|
|
5
|
-
acc[key] = props[key];
|
|
6
|
-
}
|
|
7
|
-
return acc;
|
|
8
|
-
}, {});
|
|
9
|
-
};
|