@salt-ds/lab 1.0.0-alpha.51 → 1.0.0-alpha.52
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/css/salt-lab.css +256 -268
- package/dist-cjs/calendar/Calendar.css.js +1 -1
- package/dist-cjs/calendar/Calendar.js +6 -17
- package/dist-cjs/calendar/Calendar.js.map +1 -1
- package/dist-cjs/calendar/CalendarNavigation.css.js +6 -0
- package/dist-cjs/calendar/{internal/CalendarNavigation.js → CalendarNavigation.js} +160 -66
- package/dist-cjs/calendar/CalendarNavigation.js.map +1 -0
- package/dist-cjs/calendar/formatDate.js +56 -0
- package/dist-cjs/calendar/formatDate.js.map +1 -0
- package/dist-cjs/calendar/internal/CalendarCarousel.js +3 -3
- package/dist-cjs/calendar/internal/CalendarCarousel.js.map +1 -1
- package/dist-cjs/calendar/internal/CalendarDay.js +45 -33
- package/dist-cjs/calendar/internal/CalendarDay.js.map +1 -1
- package/dist-cjs/calendar/internal/CalendarMonth.js +3 -2
- package/dist-cjs/calendar/internal/CalendarMonth.js.map +1 -1
- package/dist-cjs/calendar/internal/CalendarWeekHeader.js +3 -3
- package/dist-cjs/calendar/internal/CalendarWeekHeader.js.map +1 -1
- package/dist-cjs/calendar/internal/useFocusManagement.js +7 -4
- package/dist-cjs/calendar/internal/useFocusManagement.js.map +1 -1
- package/dist-cjs/calendar/internal/utils.js +28 -23
- package/dist-cjs/calendar/internal/utils.js.map +1 -1
- package/dist-cjs/calendar/useCalendar.js +94 -45
- package/dist-cjs/calendar/useCalendar.js.map +1 -1
- package/dist-cjs/calendar/useCalendarDay.js +19 -10
- package/dist-cjs/calendar/useCalendarDay.js.map +1 -1
- package/dist-cjs/calendar/useCalendarSelection.js +360 -0
- package/dist-cjs/calendar/useCalendarSelection.js.map +1 -0
- package/dist-cjs/cascading-menu/internal/useMouseHandlers.js.map +1 -1
- package/dist-cjs/color-chooser/ColorChooser.js.map +1 -1
- package/dist-cjs/combo-box-deprecated/ComboBox.css.js +1 -1
- package/dist-cjs/common-hooks/useCollectionItems.js.map +1 -1
- package/dist-cjs/content-status/ContentStatus.css.js +1 -1
- package/dist-cjs/date-input/DateInput.css.js +1 -1
- package/dist-cjs/date-input/DateInputRange.js +355 -0
- package/dist-cjs/date-input/DateInputRange.js.map +1 -0
- package/dist-cjs/date-input/DateInputSingle.js +229 -0
- package/dist-cjs/date-input/DateInputSingle.js.map +1 -0
- package/dist-cjs/date-input/utils.js +65 -0
- package/dist-cjs/date-input/utils.js.map +1 -0
- package/dist-cjs/date-picker/DatePicker.js +40 -150
- package/dist-cjs/date-picker/DatePicker.js.map +1 -1
- package/dist-cjs/date-picker/DatePickerActions.css.js +6 -0
- package/dist-cjs/date-picker/DatePickerActions.css.js.map +1 -0
- package/dist-cjs/date-picker/DatePickerActions.js +102 -0
- package/dist-cjs/date-picker/DatePickerActions.js.map +1 -0
- package/dist-cjs/date-picker/DatePickerContext.js +23 -17
- package/dist-cjs/date-picker/DatePickerContext.js.map +1 -1
- package/dist-cjs/date-picker/DatePickerOverlay.css.js +6 -0
- package/dist-cjs/date-picker/DatePickerOverlay.css.js.map +1 -0
- package/dist-cjs/date-picker/DatePickerOverlay.js +50 -0
- package/dist-cjs/date-picker/DatePickerOverlay.js.map +1 -0
- package/dist-cjs/date-picker/DatePickerOverlayProvider.js +105 -0
- package/dist-cjs/date-picker/DatePickerOverlayProvider.js.map +1 -0
- package/dist-cjs/date-picker/DatePickerPanel.css.js +1 -1
- package/dist-cjs/date-picker/DatePickerRangeInput.js +118 -0
- package/dist-cjs/date-picker/DatePickerRangeInput.js.map +1 -0
- package/dist-cjs/date-picker/DatePickerRangePanel.js +206 -0
- package/dist-cjs/date-picker/DatePickerRangePanel.js.map +1 -0
- package/dist-cjs/date-picker/DatePickerSingleInput.js +97 -0
- package/dist-cjs/date-picker/DatePickerSingleInput.js.map +1 -0
- package/dist-cjs/date-picker/DatePickerSinglePanel.js +138 -0
- package/dist-cjs/date-picker/DatePickerSinglePanel.js.map +1 -0
- package/dist-cjs/date-picker/useDatePicker.js +179 -0
- package/dist-cjs/date-picker/useDatePicker.js.map +1 -0
- package/dist-cjs/dropdown/useDropdown.js.map +1 -1
- package/dist-cjs/form-field-legacy/FormLabel.js.map +1 -1
- package/dist-cjs/index.js +43 -10
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/list/List.js.map +1 -1
- package/dist-cjs/menu-button/MenuButtonTrigger.css.js +1 -1
- package/dist-cjs/query-input/QueryInput.css.js +1 -1
- package/dist-cjs/slider/Slider.css.js +1 -1
- package/dist-cjs/slider/Slider.js +53 -105
- package/dist-cjs/slider/Slider.js.map +1 -1
- package/dist-cjs/slider/internal/SliderContext.js +21 -0
- package/dist-cjs/slider/internal/SliderContext.js.map +1 -0
- package/dist-cjs/slider/internal/SliderMarks.js +31 -0
- package/dist-cjs/slider/internal/SliderMarks.js.map +1 -0
- package/dist-cjs/slider/internal/SliderSelection.js +17 -10
- package/dist-cjs/slider/internal/SliderSelection.js.map +1 -1
- package/dist-cjs/slider/internal/SliderThumb.js +77 -0
- package/dist-cjs/slider/internal/SliderThumb.js.map +1 -0
- package/dist-cjs/slider/internal/SliderTrack.js +91 -0
- package/dist-cjs/slider/internal/SliderTrack.js.map +1 -0
- package/dist-cjs/slider/internal/useKeyDownThumb.js +53 -0
- package/dist-cjs/slider/internal/useKeyDownThumb.js.map +1 -0
- package/dist-cjs/slider/internal/utils.js +78 -116
- package/dist-cjs/slider/internal/utils.js.map +1 -1
- package/dist-cjs/tabs/TabActivationIndicator.css.js +1 -1
- package/dist-cjs/tabs/useTabs.js.map +1 -1
- package/dist-cjs/toolbar/overflow-panel/OverflowPanel.js.map +1 -1
- package/dist-es/calendar/Calendar.css.js +1 -1
- package/dist-es/calendar/Calendar.js +7 -18
- package/dist-es/calendar/Calendar.js.map +1 -1
- package/dist-es/calendar/CalendarNavigation.css.js +4 -0
- package/dist-es/calendar/CalendarNavigation.js +308 -0
- package/dist-es/calendar/CalendarNavigation.js.map +1 -0
- package/dist-es/calendar/formatDate.js +51 -0
- package/dist-es/calendar/formatDate.js.map +1 -0
- package/dist-es/calendar/internal/CalendarCarousel.js +3 -3
- package/dist-es/calendar/internal/CalendarCarousel.js.map +1 -1
- package/dist-es/calendar/internal/CalendarDay.js +45 -33
- package/dist-es/calendar/internal/CalendarDay.js.map +1 -1
- package/dist-es/calendar/internal/CalendarMonth.js +3 -2
- package/dist-es/calendar/internal/CalendarMonth.js.map +1 -1
- package/dist-es/calendar/internal/CalendarWeekHeader.js +3 -3
- package/dist-es/calendar/internal/CalendarWeekHeader.js.map +1 -1
- package/dist-es/calendar/internal/useFocusManagement.js +7 -4
- package/dist-es/calendar/internal/useFocusManagement.js.map +1 -1
- package/dist-es/calendar/internal/utils.js +29 -23
- package/dist-es/calendar/internal/utils.js.map +1 -1
- package/dist-es/calendar/useCalendar.js +96 -47
- package/dist-es/calendar/useCalendar.js.map +1 -1
- package/dist-es/calendar/useCalendarDay.js +20 -11
- package/dist-es/calendar/useCalendarDay.js.map +1 -1
- package/dist-es/calendar/useCalendarSelection.js +350 -0
- package/dist-es/calendar/useCalendarSelection.js.map +1 -0
- package/dist-es/cascading-menu/internal/useMouseHandlers.js.map +1 -1
- package/dist-es/color-chooser/ColorChooser.js.map +1 -1
- package/dist-es/combo-box-deprecated/ComboBox.css.js +1 -1
- package/dist-es/common-hooks/useCollectionItems.js.map +1 -1
- package/dist-es/content-status/ContentStatus.css.js +1 -1
- package/dist-es/date-input/DateInput.css.js +1 -1
- package/dist-es/date-input/DateInputRange.js +351 -0
- package/dist-es/date-input/DateInputRange.js.map +1 -0
- package/dist-es/date-input/DateInputSingle.js +225 -0
- package/dist-es/date-input/DateInputSingle.js.map +1 -0
- package/dist-es/date-input/utils.js +57 -0
- package/dist-es/date-input/utils.js.map +1 -0
- package/dist-es/date-picker/DatePicker.js +43 -154
- package/dist-es/date-picker/DatePicker.js.map +1 -1
- package/dist-es/date-picker/DatePickerActions.css.js +4 -0
- package/dist-es/date-picker/DatePickerActions.css.js.map +1 -0
- package/dist-es/date-picker/DatePickerActions.js +98 -0
- package/dist-es/date-picker/DatePickerActions.js.map +1 -0
- package/dist-es/date-picker/DatePickerContext.js +22 -17
- package/dist-es/date-picker/DatePickerContext.js.map +1 -1
- package/dist-es/date-picker/DatePickerOverlay.css.js +4 -0
- package/dist-es/date-picker/DatePickerOverlay.css.js.map +1 -0
- package/dist-es/date-picker/DatePickerOverlay.js +46 -0
- package/dist-es/date-picker/DatePickerOverlay.js.map +1 -0
- package/dist-es/date-picker/DatePickerOverlayProvider.js +100 -0
- package/dist-es/date-picker/DatePickerOverlayProvider.js.map +1 -0
- package/dist-es/date-picker/DatePickerPanel.css.js +1 -1
- package/dist-es/date-picker/DatePickerRangeInput.js +114 -0
- package/dist-es/date-picker/DatePickerRangeInput.js.map +1 -0
- package/dist-es/date-picker/DatePickerRangePanel.js +198 -0
- package/dist-es/date-picker/DatePickerRangePanel.js.map +1 -0
- package/dist-es/date-picker/DatePickerSingleInput.js +93 -0
- package/dist-es/date-picker/DatePickerSingleInput.js.map +1 -0
- package/dist-es/date-picker/DatePickerSinglePanel.js +130 -0
- package/dist-es/date-picker/DatePickerSinglePanel.js.map +1 -0
- package/dist-es/date-picker/useDatePicker.js +175 -0
- package/dist-es/date-picker/useDatePicker.js.map +1 -0
- package/dist-es/dropdown/useDropdown.js.map +1 -1
- package/dist-es/form-field-legacy/FormLabel.js.map +1 -1
- package/dist-es/index.js +14 -3
- package/dist-es/index.js.map +1 -1
- package/dist-es/list/List.js.map +1 -1
- package/dist-es/menu-button/MenuButtonTrigger.css.js +1 -1
- package/dist-es/query-input/QueryInput.css.js +1 -1
- package/dist-es/slider/Slider.css.js +1 -1
- package/dist-es/slider/Slider.js +55 -107
- package/dist-es/slider/Slider.js.map +1 -1
- package/dist-es/slider/internal/SliderContext.js +16 -0
- package/dist-es/slider/internal/SliderContext.js.map +1 -0
- package/dist-es/slider/internal/SliderMarks.js +27 -0
- package/dist-es/slider/internal/SliderMarks.js.map +1 -0
- package/dist-es/slider/internal/SliderSelection.js +17 -10
- package/dist-es/slider/internal/SliderSelection.js.map +1 -1
- package/dist-es/slider/internal/SliderThumb.js +73 -0
- package/dist-es/slider/internal/SliderThumb.js.map +1 -0
- package/dist-es/slider/internal/SliderTrack.js +87 -0
- package/dist-es/slider/internal/SliderTrack.js.map +1 -0
- package/dist-es/slider/internal/useKeyDownThumb.js +49 -0
- package/dist-es/slider/internal/useKeyDownThumb.js.map +1 -0
- package/dist-es/slider/internal/utils.js +70 -111
- package/dist-es/slider/internal/utils.js.map +1 -1
- package/dist-es/tabs/TabActivationIndicator.css.js +1 -1
- package/dist-es/tabs/useTabs.js.map +1 -1
- package/dist-es/toolbar/overflow-panel/OverflowPanel.js.map +1 -1
- package/dist-types/calendar/Calendar.d.ts +63 -6
- package/dist-types/calendar/CalendarNavigation.d.ts +57 -0
- package/dist-types/calendar/formatDate.d.ts +14 -0
- package/dist-types/calendar/index.d.ts +3 -1
- package/dist-types/calendar/internal/CalendarDay.d.ts +2 -1
- package/dist-types/calendar/internal/CalendarWeekHeader.d.ts +4 -4
- package/dist-types/calendar/internal/useFocusManagement.d.ts +2 -1
- package/dist-types/calendar/internal/utils.d.ts +7 -8
- package/dist-types/calendar/useCalendar.d.ts +100 -16
- package/dist-types/calendar/useCalendarDay.d.ts +38 -0
- package/dist-types/calendar/useCalendarSelection.d.ts +189 -0
- package/dist-types/date-input/DateInputRange.d.ts +150 -0
- package/dist-types/date-input/DateInputSingle.d.ts +117 -0
- package/dist-types/date-input/index.d.ts +3 -1
- package/dist-types/date-input/utils.d.ts +43 -0
- package/dist-types/date-picker/DatePicker.d.ts +20 -62
- package/dist-types/date-picker/DatePickerActions.d.ts +80 -0
- package/dist-types/date-picker/DatePickerContext.d.ts +180 -17
- package/dist-types/date-picker/DatePickerOverlay.d.ts +11 -0
- package/dist-types/date-picker/DatePickerOverlayProvider.d.ts +67 -0
- package/dist-types/date-picker/DatePickerRangeInput.d.ts +7 -0
- package/dist-types/date-picker/DatePickerRangePanel.d.ts +64 -0
- package/dist-types/date-picker/DatePickerSingleInput.d.ts +7 -0
- package/dist-types/date-picker/DatePickerSinglePanel.d.ts +42 -0
- package/dist-types/date-picker/index.d.ts +7 -0
- package/dist-types/date-picker/useDatePicker.d.ts +112 -0
- package/dist-types/slider/Slider.d.ts +23 -10
- package/dist-types/slider/internal/SliderContext.d.ts +11 -0
- package/dist-types/slider/internal/SliderMarks.d.ts +7 -0
- package/dist-types/slider/internal/SliderSelection.d.ts +3 -3
- package/dist-types/slider/internal/SliderThumb.d.ts +8 -0
- package/dist-types/slider/internal/SliderTrack.d.ts +4 -0
- package/dist-types/slider/internal/index.d.ts +3 -0
- package/dist-types/slider/internal/useKeyDownThumb.d.ts +2 -0
- package/dist-types/slider/internal/utils.d.ts +18 -10
- package/dist-types/slider/types.d.ts +3 -1
- package/package.json +3 -3
- package/dist-cjs/calendar/internal/CalendarNavigation.css.js +0 -6
- package/dist-cjs/calendar/internal/CalendarNavigation.js.map +0 -1
- package/dist-cjs/calendar/useSelection.js +0 -249
- package/dist-cjs/calendar/useSelection.js.map +0 -1
- package/dist-cjs/date-input/DateInput.js +0 -283
- package/dist-cjs/date-input/DateInput.js.map +0 -1
- package/dist-cjs/date-picker/DatePickerPanel.js +0 -155
- package/dist-cjs/date-picker/DatePickerPanel.js.map +0 -1
- package/dist-cjs/slider/internal/SliderHandle.js +0 -44
- package/dist-cjs/slider/internal/SliderHandle.js.map +0 -1
- package/dist-cjs/slider/internal/SliderMarkLabels.js +0 -45
- package/dist-cjs/slider/internal/SliderMarkLabels.js.map +0 -1
- package/dist-cjs/slider/internal/SliderRail.js +0 -25
- package/dist-cjs/slider/internal/SliderRail.js.map +0 -1
- package/dist-cjs/slider/internal/SliderRailMarks.js +0 -48
- package/dist-cjs/slider/internal/SliderRailMarks.js.map +0 -1
- package/dist-cjs/slider/internal/styles.js +0 -99
- package/dist-cjs/slider/internal/styles.js.map +0 -1
- package/dist-cjs/slider/internal/useSliderKeyDown.js +0 -50
- package/dist-cjs/slider/internal/useSliderKeyDown.js.map +0 -1
- package/dist-cjs/slider/internal/useSliderMouseDown.js +0 -96
- package/dist-cjs/slider/internal/useSliderMouseDown.js.map +0 -1
- package/dist-es/calendar/internal/CalendarNavigation.css.js +0 -4
- package/dist-es/calendar/internal/CalendarNavigation.js +0 -214
- package/dist-es/calendar/internal/CalendarNavigation.js.map +0 -1
- package/dist-es/calendar/useSelection.js +0 -242
- package/dist-es/calendar/useSelection.js.map +0 -1
- package/dist-es/date-input/DateInput.js +0 -279
- package/dist-es/date-input/DateInput.js.map +0 -1
- package/dist-es/date-picker/DatePickerPanel.js +0 -151
- package/dist-es/date-picker/DatePickerPanel.js.map +0 -1
- package/dist-es/slider/internal/SliderHandle.js +0 -40
- package/dist-es/slider/internal/SliderHandle.js.map +0 -1
- package/dist-es/slider/internal/SliderMarkLabels.js +0 -41
- package/dist-es/slider/internal/SliderMarkLabels.js.map +0 -1
- package/dist-es/slider/internal/SliderRail.js +0 -21
- package/dist-es/slider/internal/SliderRail.js.map +0 -1
- package/dist-es/slider/internal/SliderRailMarks.js +0 -44
- package/dist-es/slider/internal/SliderRailMarks.js.map +0 -1
- package/dist-es/slider/internal/styles.js +0 -91
- package/dist-es/slider/internal/styles.js.map +0 -1
- package/dist-es/slider/internal/useSliderKeyDown.js +0 -46
- package/dist-es/slider/internal/useSliderKeyDown.js.map +0 -1
- package/dist-es/slider/internal/useSliderMouseDown.js +0 -92
- package/dist-es/slider/internal/useSliderMouseDown.js.map +0 -1
- package/dist-types/calendar/internal/CalendarNavigation.d.ts +0 -16
- package/dist-types/calendar/useSelection.d.ts +0 -78
- package/dist-types/date-input/DateInput.d.ts +0 -60
- package/dist-types/date-picker/DatePickerPanel.d.ts +0 -10
- package/dist-types/slider/internal/SliderHandle.d.ts +0 -11
- package/dist-types/slider/internal/SliderMarkLabels.d.ts +0 -7
- package/dist-types/slider/internal/SliderRail.d.ts +0 -1
- package/dist-types/slider/internal/SliderRailMarks.d.ts +0 -12
- package/dist-types/slider/internal/styles.d.ts +0 -10
- package/dist-types/slider/internal/useSliderKeyDown.d.ts +0 -4
- package/dist-types/slider/internal/useSliderMouseDown.d.ts +0 -4
- /package/dist-cjs/calendar/{internal/CalendarNavigation.css.js.map → CalendarNavigation.css.js.map} +0 -0
- /package/dist-es/calendar/{internal/CalendarNavigation.css.js.map → CalendarNavigation.css.js.map} +0 -0
|
@@ -0,0 +1,225 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { getLocalTimeZone } from '@internationalized/date';
|
|
3
|
+
import { makePrefixer, useForkRef, useId, useControlled, useFormFieldProps, StatusAdornment } from '@salt-ds/core';
|
|
4
|
+
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
5
|
+
import { useWindow } from '@salt-ds/window';
|
|
6
|
+
import { clsx } from 'clsx';
|
|
7
|
+
import { forwardRef, useRef, useCallback, useEffect, useState } from 'react';
|
|
8
|
+
import '../calendar/Calendar.js';
|
|
9
|
+
import '../calendar/CalendarNavigation.js';
|
|
10
|
+
import '../calendar/internal/CalendarContext.js';
|
|
11
|
+
import { getCurrentLocale, formatDate } from '../calendar/formatDate.js';
|
|
12
|
+
import '../calendar/useCalendarSelection.js';
|
|
13
|
+
import css_248z from './DateInput.css.js';
|
|
14
|
+
import { parseCalendarDate, extractTimeFieldsFromDate } from './utils.js';
|
|
15
|
+
|
|
16
|
+
const withBaseName = makePrefixer("saltDateInput");
|
|
17
|
+
const DateInputSingle = forwardRef(
|
|
18
|
+
function DateInput(props, ref) {
|
|
19
|
+
const {
|
|
20
|
+
bordered = false,
|
|
21
|
+
className,
|
|
22
|
+
disabled,
|
|
23
|
+
"aria-label": ariaLabel,
|
|
24
|
+
date: dateProp,
|
|
25
|
+
defaultDate,
|
|
26
|
+
onDateChange,
|
|
27
|
+
value: valueProp,
|
|
28
|
+
defaultValue = "",
|
|
29
|
+
onChange,
|
|
30
|
+
onClick,
|
|
31
|
+
emptyReadOnlyMarker = "\u2014",
|
|
32
|
+
endAdornment,
|
|
33
|
+
format: formatProp,
|
|
34
|
+
inputProps = {},
|
|
35
|
+
inputRef: inputRefProp = null,
|
|
36
|
+
parse = parseCalendarDate,
|
|
37
|
+
placeholder = "dd mmm yyyy",
|
|
38
|
+
readOnly: readOnlyProp,
|
|
39
|
+
validationStatus: validationStatusProp,
|
|
40
|
+
variant = "primary",
|
|
41
|
+
onDateValueChange,
|
|
42
|
+
locale = getCurrentLocale(),
|
|
43
|
+
timeZone = getLocalTimeZone(),
|
|
44
|
+
...rest
|
|
45
|
+
} = props;
|
|
46
|
+
const wrapperRef = useRef(null);
|
|
47
|
+
const lastError = useRef(false);
|
|
48
|
+
const handleWrapperRef = useForkRef(ref, wrapperRef);
|
|
49
|
+
const innerInputRef = useRef(null);
|
|
50
|
+
const handleInputRef = useForkRef(
|
|
51
|
+
innerInputRef,
|
|
52
|
+
inputRefProp
|
|
53
|
+
);
|
|
54
|
+
const inputId = useId();
|
|
55
|
+
const targetWindow = useWindow();
|
|
56
|
+
useComponentCssInjection({
|
|
57
|
+
testId: "salt-date-input-single",
|
|
58
|
+
css: css_248z,
|
|
59
|
+
window: targetWindow
|
|
60
|
+
});
|
|
61
|
+
const [date, setDate] = useControlled({
|
|
62
|
+
controlled: dateProp,
|
|
63
|
+
default: defaultDate,
|
|
64
|
+
name: "DateInputSingle",
|
|
65
|
+
state: "date"
|
|
66
|
+
});
|
|
67
|
+
const [dateValue, setDateValue] = useControlled({
|
|
68
|
+
controlled: valueProp,
|
|
69
|
+
default: defaultValue,
|
|
70
|
+
name: "DateInputSingle",
|
|
71
|
+
state: "dateValue"
|
|
72
|
+
});
|
|
73
|
+
const preservedTime = useRef(
|
|
74
|
+
extractTimeFieldsFromDate(date || null)
|
|
75
|
+
);
|
|
76
|
+
const format = useCallback(
|
|
77
|
+
(date2) => {
|
|
78
|
+
return formatProp ? formatProp(date2) : formatDate(date2, locale, { timeZone });
|
|
79
|
+
},
|
|
80
|
+
[formatProp, locale, timeZone]
|
|
81
|
+
);
|
|
82
|
+
useEffect(() => {
|
|
83
|
+
const formattedDate = format(date || null);
|
|
84
|
+
if (formattedDate) {
|
|
85
|
+
setDateValue(formattedDate);
|
|
86
|
+
onDateValueChange == null ? void 0 : onDateValueChange(formattedDate, true);
|
|
87
|
+
}
|
|
88
|
+
}, [date, format, locale, timeZone]);
|
|
89
|
+
const [focused, setFocused] = useState(false);
|
|
90
|
+
const {
|
|
91
|
+
a11yProps: {
|
|
92
|
+
"aria-describedby": formFieldDescribedBy,
|
|
93
|
+
"aria-labelledby": formFieldLabelledBy
|
|
94
|
+
} = {},
|
|
95
|
+
disabled: formFieldDisabled,
|
|
96
|
+
readOnly: formFieldReadOnly,
|
|
97
|
+
necessity: formFieldRequired,
|
|
98
|
+
validationStatus: formFieldValidationStatus
|
|
99
|
+
} = useFormFieldProps();
|
|
100
|
+
const isReadOnly = readOnlyProp || formFieldReadOnly;
|
|
101
|
+
const isDisabled = disabled || formFieldDisabled;
|
|
102
|
+
const validationStatus = formFieldValidationStatus != null ? formFieldValidationStatus : validationStatusProp;
|
|
103
|
+
const {
|
|
104
|
+
"aria-describedby": dateInputDescribedBy,
|
|
105
|
+
"aria-labelledby": dateInputLabelledBy,
|
|
106
|
+
onBlur: inputPropsOnBlur,
|
|
107
|
+
onChange: inputPropsOnChange,
|
|
108
|
+
onKeyDown: inputPropsOnKeyDown,
|
|
109
|
+
onFocus: inputPropsOnFocus,
|
|
110
|
+
required: dateInputPropsRequired,
|
|
111
|
+
...restDateInputProps
|
|
112
|
+
} = inputProps;
|
|
113
|
+
const isRequired = formFieldRequired ? ["required", "asterisk"].includes(formFieldRequired) : dateInputPropsRequired;
|
|
114
|
+
const apply = (event) => {
|
|
115
|
+
const { date: parsedDate, error } = parse(dateValue != null ? dateValue : "");
|
|
116
|
+
let newDate = parsedDate;
|
|
117
|
+
if (newDate) {
|
|
118
|
+
const formattedDate = format(newDate);
|
|
119
|
+
if (formattedDate) {
|
|
120
|
+
setDateValue(formattedDate);
|
|
121
|
+
onDateValueChange == null ? void 0 : onDateValueChange(formattedDate, true);
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
const hasDateChanged = newDate && date ? newDate.compare(date) !== 0 : newDate !== date;
|
|
125
|
+
if (hasDateChanged) {
|
|
126
|
+
setDate(newDate);
|
|
127
|
+
if (newDate && preservedTime.current) {
|
|
128
|
+
newDate = newDate.set(preservedTime.current);
|
|
129
|
+
}
|
|
130
|
+
}
|
|
131
|
+
if (hasDateChanged || lastError.current !== error) {
|
|
132
|
+
onDateChange == null ? void 0 : onDateChange(event, newDate, error);
|
|
133
|
+
}
|
|
134
|
+
lastError.current = error;
|
|
135
|
+
};
|
|
136
|
+
const handleChange = (event) => {
|
|
137
|
+
const newDateValue = event.target.value;
|
|
138
|
+
setDateValue(newDateValue);
|
|
139
|
+
inputPropsOnChange == null ? void 0 : inputPropsOnChange(event);
|
|
140
|
+
onChange == null ? void 0 : onChange(event);
|
|
141
|
+
onDateValueChange == null ? void 0 : onDateValueChange(newDateValue, false);
|
|
142
|
+
};
|
|
143
|
+
const handleFocus = (event) => {
|
|
144
|
+
setFocused(true);
|
|
145
|
+
inputPropsOnFocus == null ? void 0 : inputPropsOnFocus(event);
|
|
146
|
+
};
|
|
147
|
+
const handleBlur = (event) => {
|
|
148
|
+
setFocused(false);
|
|
149
|
+
apply(event);
|
|
150
|
+
inputPropsOnBlur == null ? void 0 : inputPropsOnBlur(event);
|
|
151
|
+
};
|
|
152
|
+
const handleKeyDown = (event) => {
|
|
153
|
+
if (event.key === "Enter") {
|
|
154
|
+
apply(event);
|
|
155
|
+
}
|
|
156
|
+
inputPropsOnKeyDown == null ? void 0 : inputPropsOnKeyDown(event);
|
|
157
|
+
};
|
|
158
|
+
const handleClick = (event) => {
|
|
159
|
+
var _a;
|
|
160
|
+
if (event.target === wrapperRef.current) {
|
|
161
|
+
(_a = innerInputRef == null ? void 0 : innerInputRef.current) == null ? void 0 : _a.focus();
|
|
162
|
+
}
|
|
163
|
+
onClick == null ? void 0 : onClick(event);
|
|
164
|
+
};
|
|
165
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
166
|
+
className: clsx(
|
|
167
|
+
withBaseName(),
|
|
168
|
+
withBaseName(variant),
|
|
169
|
+
{
|
|
170
|
+
[withBaseName("focused")]: !isDisabled && focused,
|
|
171
|
+
[withBaseName("disabled")]: isDisabled,
|
|
172
|
+
[withBaseName("readOnly")]: isReadOnly,
|
|
173
|
+
[withBaseName(validationStatus != null ? validationStatus : "")]: validationStatus,
|
|
174
|
+
[withBaseName("bordered")]: bordered
|
|
175
|
+
},
|
|
176
|
+
className
|
|
177
|
+
),
|
|
178
|
+
ref: handleWrapperRef,
|
|
179
|
+
onClick: handleClick,
|
|
180
|
+
...rest,
|
|
181
|
+
children: [
|
|
182
|
+
/* @__PURE__ */ jsx("input", {
|
|
183
|
+
autoComplete: "off",
|
|
184
|
+
"aria-describedby": clsx(formFieldDescribedBy, dateInputDescribedBy),
|
|
185
|
+
"aria-labelledby": clsx(
|
|
186
|
+
formFieldLabelledBy,
|
|
187
|
+
dateInputLabelledBy,
|
|
188
|
+
inputId
|
|
189
|
+
),
|
|
190
|
+
"aria-label": clsx("Selected date", ariaLabel),
|
|
191
|
+
id: inputId,
|
|
192
|
+
className: withBaseName("input"),
|
|
193
|
+
disabled: isDisabled,
|
|
194
|
+
readOnly: isReadOnly,
|
|
195
|
+
ref: handleInputRef,
|
|
196
|
+
tabIndex: isDisabled ? -1 : 0,
|
|
197
|
+
placeholder,
|
|
198
|
+
size: placeholder.length,
|
|
199
|
+
value: isReadOnly && !dateValue ? emptyReadOnlyMarker : dateValue,
|
|
200
|
+
...restDateInputProps,
|
|
201
|
+
onBlur: handleBlur,
|
|
202
|
+
onChange: handleChange,
|
|
203
|
+
onKeyDown: handleKeyDown,
|
|
204
|
+
onFocus: !isDisabled ? handleFocus : void 0,
|
|
205
|
+
required: isRequired
|
|
206
|
+
}),
|
|
207
|
+
/* @__PURE__ */ jsxs("div", {
|
|
208
|
+
className: withBaseName("endAdornmentContainer"),
|
|
209
|
+
children: [
|
|
210
|
+
!isDisabled && !isReadOnly && validationStatus && /* @__PURE__ */ jsx(StatusAdornment, {
|
|
211
|
+
status: validationStatus
|
|
212
|
+
}),
|
|
213
|
+
endAdornment
|
|
214
|
+
]
|
|
215
|
+
}),
|
|
216
|
+
/* @__PURE__ */ jsx("div", {
|
|
217
|
+
className: withBaseName("activationIndicator")
|
|
218
|
+
})
|
|
219
|
+
]
|
|
220
|
+
});
|
|
221
|
+
}
|
|
222
|
+
);
|
|
223
|
+
|
|
224
|
+
export { DateInputSingle };
|
|
225
|
+
//# sourceMappingURL=DateInputSingle.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DateInputSingle.js","sources":["../src/date-input/DateInputSingle.tsx"],"sourcesContent":["import {\n type DateValue,\n type TimeFields,\n getLocalTimeZone,\n} from \"@internationalized/date\";\nimport {\n StatusAdornment,\n makePrefixer,\n useControlled,\n useForkRef,\n useFormFieldProps,\n useId,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEventHandler,\n type ComponentPropsWithoutRef,\n type FocusEventHandler,\n type InputHTMLAttributes,\n type KeyboardEventHandler,\n type MouseEventHandler,\n type ReactNode,\n type RefObject,\n type SyntheticEvent,\n forwardRef,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport {\n type SingleDateSelection,\n formatDate as defaultFormatDate,\n getCurrentLocale,\n} from \"../calendar\";\nimport dateInputCss from \"./DateInput.css\";\nimport { extractTimeFieldsFromDate, parseCalendarDate } from \"./utils\";\n\nconst withBaseName = makePrefixer(\"saltDateInput\");\n\n/**\n * Date error produced by DateInputSingle parser.\n */\nexport type DateInputSingleParserError = string | false;\n\n/**\n * Date error produced by DateInputSingle parser.\n */\nexport type DateInputSingleError = DateInputSingleParserError;\n\n/**\n * Return value of DateInputSingle parser.\n * @template T\n */\nexport interface DateInputSingleParserResult<T = DateValue | null> {\n /**\n * The parsed date value.\n */\n date: T;\n /**\n * The error encountered during parsing, if any.\n */\n error: DateInputSingleParserError;\n}\n\n/**\n * Props for the DateInputSingle component.\n * @template T\n */\nexport interface DateInputSingleProps<T = SingleDateSelection>\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"defaultValue\">,\n Pick<\n ComponentPropsWithoutRef<\"input\">,\n \"disabled\" | \"value\" | \"defaultValue\" | \"placeholder\"\n > {\n /**\n * The aria-label for accessibility.\n */\n ariaLabel?: string;\n /**\n * Styling variant with full border. Defaults to false.\n */\n bordered?: boolean;\n /**\n * The marker to use in an empty read-only DateInput.\n * Use `''` to disable this feature. Defaults to '—'.\n */\n emptyReadOnlyMarker?: string;\n /**\n * End adornment component.\n */\n endAdornment?: ReactNode;\n /**\n * Attributes applied to the `input` element.\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dateInput#Attributes\n */\n inputProps?: InputHTMLAttributes<HTMLInputElement>;\n /**\n * If `true`, the component is read-only.\n */\n readOnly?: boolean;\n /**\n * Validation status.\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n /**\n * Function to format the input value.\n */\n format?: (date: DateValue | null) => string;\n /**\n * Reference for the input.\n */\n inputRef?: RefObject<HTMLInputElement>;\n /**\n * Input value. Use when the input value is controlled.\n */\n value?: string;\n /**\n * The initial input value. Use when the component is uncontrolled.\n */\n defaultValue?: string;\n /**\n * The date value. Use when the component is controlled.\n */\n date?: T | null;\n /**\n * The initial selected date value. Use when the component is uncontrolled.\n */\n defaultDate?: T | null;\n /**\n * Callback fired when the selected date changes.\n * @param event - The synthetic event.\n * @param date - The new date value.\n * @param error - The date input single error.\n */\n onDateChange?: (\n event: SyntheticEvent,\n date: T | null,\n error: DateInputSingleError,\n ) => void;\n /**\n * Function to parse date string to valid `DateValue` or null, if invalid or empty.\n * @param inputDate - The input date string.\n * @returns The result of the date input single parser.\n */\n parse?: (inputDate: string) => DateInputSingleParserResult;\n /**\n * Called when input value changes, either due to user interaction or programmatic formatting of valid dates.\n * @param newValue - The new date input value.\n * @param isFormatted - Whether the value is formatted.\n */\n onDateValueChange?: (newValue: string, isFormatted: boolean) => void;\n /**\n * Locale of the entered date.\n */\n locale?: string;\n /**\n * Timezone of the entered date.\n */\n timeZone?: string;\n}\nexport const DateInputSingle = forwardRef<HTMLDivElement, DateInputSingleProps>(\n function DateInput(props, ref) {\n const {\n bordered = false,\n className,\n disabled,\n \"aria-label\": ariaLabel,\n date: dateProp,\n defaultDate,\n onDateChange,\n value: valueProp,\n defaultValue = \"\",\n onChange,\n onClick,\n emptyReadOnlyMarker = \"—\",\n endAdornment,\n format: formatProp,\n inputProps = {},\n inputRef: inputRefProp = null,\n parse = parseCalendarDate,\n placeholder = \"dd mmm yyyy\",\n readOnly: readOnlyProp,\n validationStatus: validationStatusProp,\n variant = \"primary\",\n onDateValueChange,\n locale = getCurrentLocale(),\n timeZone = getLocalTimeZone(),\n ...rest\n } = props;\n const wrapperRef = useRef(null);\n const lastError = useRef<string | false>(false);\n const handleWrapperRef = useForkRef<HTMLDivElement>(ref, wrapperRef);\n const innerInputRef = useRef<HTMLInputElement>(null);\n const handleInputRef = useForkRef<HTMLInputElement>(\n innerInputRef,\n inputRefProp,\n );\n\n const inputId = useId();\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-date-input-single\",\n css: dateInputCss,\n window: targetWindow,\n });\n\n const [date, setDate] = useControlled({\n controlled: dateProp,\n default: defaultDate,\n name: \"DateInputSingle\",\n state: \"date\",\n });\n const [dateValue, setDateValue] = useControlled({\n controlled: valueProp,\n default: defaultValue,\n name: \"DateInputSingle\",\n state: \"dateValue\",\n });\n const preservedTime = useRef<TimeFields | undefined>(\n extractTimeFieldsFromDate(date || null),\n );\n\n const format = useCallback(\n (date: DateValue | null) => {\n return formatProp\n ? formatProp(date)\n : defaultFormatDate(date, locale, { timeZone });\n },\n [formatProp, locale, timeZone],\n );\n\n // Update date string value when selected date changes\n useEffect(() => {\n const formattedDate = format(date || null);\n if (formattedDate) {\n setDateValue(formattedDate);\n onDateValueChange?.(formattedDate, true);\n }\n }, [date, format, locale, timeZone]);\n\n const [focused, setFocused] = useState(false);\n\n const {\n a11yProps: {\n \"aria-describedby\": formFieldDescribedBy,\n \"aria-labelledby\": formFieldLabelledBy,\n } = {},\n disabled: formFieldDisabled,\n readOnly: formFieldReadOnly,\n necessity: formFieldRequired,\n validationStatus: formFieldValidationStatus,\n } = useFormFieldProps();\n\n const isReadOnly = readOnlyProp || formFieldReadOnly;\n const isDisabled = disabled || formFieldDisabled;\n\n const validationStatus = formFieldValidationStatus ?? validationStatusProp;\n\n const {\n \"aria-describedby\": dateInputDescribedBy,\n \"aria-labelledby\": dateInputLabelledBy,\n onBlur: inputPropsOnBlur,\n onChange: inputPropsOnChange,\n onKeyDown: inputPropsOnKeyDown,\n onFocus: inputPropsOnFocus,\n required: dateInputPropsRequired,\n ...restDateInputProps\n } = inputProps;\n\n const isRequired = formFieldRequired\n ? [\"required\", \"asterisk\"].includes(formFieldRequired)\n : dateInputPropsRequired;\n\n const apply = (event: SyntheticEvent) => {\n const { date: parsedDate, error } = parse(dateValue ?? \"\");\n let newDate = parsedDate;\n if (newDate) {\n const formattedDate = format(newDate);\n if (formattedDate) {\n setDateValue(formattedDate);\n onDateValueChange?.(formattedDate, true);\n }\n }\n const hasDateChanged =\n newDate && date ? newDate.compare(date) !== 0 : newDate !== date;\n if (hasDateChanged) {\n setDate(newDate);\n if (newDate && preservedTime.current) {\n newDate = newDate.set(preservedTime.current);\n }\n }\n if (hasDateChanged || lastError.current !== error) {\n onDateChange?.(event, newDate, error);\n }\n lastError.current = error;\n };\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n const newDateValue = event.target.value;\n setDateValue(newDateValue);\n inputPropsOnChange?.(event);\n onChange?.(event);\n onDateValueChange?.(newDateValue, false);\n };\n\n const handleFocus: FocusEventHandler<HTMLInputElement> = (event) => {\n setFocused(true);\n inputPropsOnFocus?.(event);\n };\n const handleBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n setFocused(false);\n apply(event);\n inputPropsOnBlur?.(event);\n };\n\n const handleKeyDown: KeyboardEventHandler<HTMLInputElement> = (event) => {\n if (event.key === \"Enter\") {\n apply(event);\n }\n inputPropsOnKeyDown?.(event);\n };\n\n const handleClick: MouseEventHandler<HTMLDivElement> = (event) => {\n if (event.target === wrapperRef.current) {\n innerInputRef?.current?.focus();\n }\n onClick?.(event);\n };\n\n return (\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"focused\")]: !isDisabled && focused,\n [withBaseName(\"disabled\")]: isDisabled,\n [withBaseName(\"readOnly\")]: isReadOnly,\n [withBaseName(validationStatus ?? \"\")]: validationStatus,\n [withBaseName(\"bordered\")]: bordered,\n },\n className,\n )}\n ref={handleWrapperRef}\n onClick={handleClick}\n {...rest}\n >\n <input\n autoComplete=\"off\"\n aria-describedby={clsx(formFieldDescribedBy, dateInputDescribedBy)}\n aria-labelledby={clsx(\n formFieldLabelledBy,\n dateInputLabelledBy,\n inputId,\n )}\n aria-label={clsx(\"Selected date\", ariaLabel)}\n id={inputId}\n className={withBaseName(\"input\")}\n disabled={isDisabled}\n readOnly={isReadOnly}\n ref={handleInputRef}\n tabIndex={isDisabled ? -1 : 0}\n placeholder={placeholder}\n size={placeholder.length}\n value={isReadOnly && !dateValue ? emptyReadOnlyMarker : dateValue}\n {...restDateInputProps}\n onBlur={handleBlur}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n onFocus={!isDisabled ? handleFocus : undefined}\n required={isRequired}\n />\n <div className={withBaseName(\"endAdornmentContainer\")}>\n {!isDisabled && !isReadOnly && validationStatus && (\n <StatusAdornment status={validationStatus} />\n )}\n {endAdornment}\n </div>\n <div className={withBaseName(\"activationIndicator\")} />\n </div>\n );\n },\n);\n"],"names":["dateInputCss","date","defaultFormatDate"],"mappings":"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"}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import { CalendarDate, toZoned, getLocalTimeZone, CalendarDateTime, ZonedDateTime } from '@internationalized/date';
|
|
2
|
+
|
|
3
|
+
function parseCalendarDate(inputDate) {
|
|
4
|
+
if (!(inputDate == null ? void 0 : inputDate.length)) {
|
|
5
|
+
return { date: null, error: false };
|
|
6
|
+
}
|
|
7
|
+
const date = new Date(inputDate);
|
|
8
|
+
if (Number.isNaN(date.getTime())) {
|
|
9
|
+
return { date: null, error: "not a valid date" };
|
|
10
|
+
}
|
|
11
|
+
const year = date.getFullYear();
|
|
12
|
+
const month = date.getMonth() + 1;
|
|
13
|
+
const day = date.getDate();
|
|
14
|
+
try {
|
|
15
|
+
const isoDate = new CalendarDate(year, month, day);
|
|
16
|
+
return { date: isoDate, error: false };
|
|
17
|
+
} catch (err) {
|
|
18
|
+
return { date: null, error: err.message };
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
function parseZonedDateTime(inputDate, timeZone = getLocalTimeZone()) {
|
|
22
|
+
const parsedDate = parseCalendarDate(inputDate);
|
|
23
|
+
if (!parsedDate.date || parsedDate.error) {
|
|
24
|
+
return { ...parsedDate, date: null };
|
|
25
|
+
}
|
|
26
|
+
try {
|
|
27
|
+
const zonedDate = toZoned(parsedDate.date, timeZone, "compatible");
|
|
28
|
+
return { date: zonedDate, error: false };
|
|
29
|
+
} catch (err) {
|
|
30
|
+
return { date: null, error: err.message };
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
const dateSupportsTime = (date) => date instanceof CalendarDateTime || date instanceof ZonedDateTime;
|
|
34
|
+
function extractTimeFieldsFromDateRange(selectedDate) {
|
|
35
|
+
let startTime;
|
|
36
|
+
let endTime;
|
|
37
|
+
if (selectedDate) {
|
|
38
|
+
if (selectedDate.startDate && dateSupportsTime(selectedDate.startDate)) {
|
|
39
|
+
const { hour, minute, second, millisecond } = selectedDate.startDate;
|
|
40
|
+
startTime = { hour, minute, second, millisecond };
|
|
41
|
+
}
|
|
42
|
+
if (selectedDate.endDate && dateSupportsTime(selectedDate.endDate)) {
|
|
43
|
+
const { hour, minute, second, millisecond } = selectedDate.endDate;
|
|
44
|
+
endTime = { hour, minute, second, millisecond };
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
return { startTime, endTime };
|
|
48
|
+
}
|
|
49
|
+
function extractTimeFieldsFromDate(selectedDate) {
|
|
50
|
+
if (selectedDate && dateSupportsTime(selectedDate)) {
|
|
51
|
+
const { hour, minute, second, millisecond } = selectedDate;
|
|
52
|
+
return { hour, minute, second, millisecond };
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
export { dateSupportsTime, extractTimeFieldsFromDate, extractTimeFieldsFromDateRange, parseCalendarDate, parseZonedDateTime };
|
|
57
|
+
//# sourceMappingURL=utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.js","sources":["../src/date-input/utils.ts"],"sourcesContent":["import {\n CalendarDate,\n CalendarDateTime,\n type DateValue,\n type TimeFields,\n ZonedDateTime,\n getLocalTimeZone,\n toZoned,\n} from \"@internationalized/date\";\nimport type { DateRangeSelection, SingleDateSelection } from \"../calendar\";\n\nexport type RangeTimeFields = {\n startTime?: TimeFields;\n endTime?: TimeFields;\n};\n\n/**\n * Parses a string into a CalendarDate.\n * @param inputDate - The input date string.\n * @returns An object containing the parsed date and any error encountered.\n */\nexport function parseCalendarDate(inputDate: string): {\n date: DateValue | null;\n error: string | false;\n} {\n if (!inputDate?.length) {\n return { date: null, error: false };\n }\n const date = new Date(inputDate);\n if (Number.isNaN(date.getTime())) {\n return { date: null, error: \"not a valid date\" };\n }\n\n const year = date.getFullYear();\n const month = date.getMonth() + 1;\n const day = date.getDate();\n\n try {\n const isoDate = new CalendarDate(year, month, day);\n return { date: isoDate, error: false };\n } catch (err) {\n return { date: null, error: (err as Error).message };\n }\n}\n\n/**\n * Parses a string into a ZonedDateTime.\n * @param inputDate - The input date string.\n * @param timeZone - The time zone to use for parsing. Defaults to the local time zone.\n * @returns An object containing the parsed date and any error encountered.\n */\nexport function parseZonedDateTime(\n inputDate: string,\n timeZone: string = getLocalTimeZone(),\n): {\n date: DateValue | null;\n error: string | false;\n} {\n const parsedDate = parseCalendarDate(inputDate);\n if (!parsedDate.date || parsedDate.error) {\n return { ...parsedDate, date: null };\n }\n try {\n const zonedDate = toZoned(parsedDate.date, timeZone, \"compatible\");\n return { date: zonedDate, error: false };\n } catch (err) {\n return { date: null, error: (err as Error).message };\n }\n}\n\n/**\n * Checks if a date supports time fields.\n * @param date - The date to check.\n * @returns `true` if the date supports time fields, otherwise `false`.\n */\nexport const dateSupportsTime = (\n date: DateValue,\n): date is CalendarDateTime | ZonedDateTime =>\n date instanceof CalendarDateTime || date instanceof ZonedDateTime;\n\n/**\n * Extracts time fields from a date range selection.\n * @param selectedDate - The selected date range.\n * @returns An object containing the start and end time fields.\n */\nexport function extractTimeFieldsFromDateRange(\n selectedDate: DateRangeSelection | null,\n): RangeTimeFields {\n let startTime: TimeFields | undefined;\n let endTime: TimeFields | undefined;\n if (selectedDate) {\n if (selectedDate.startDate && dateSupportsTime(selectedDate.startDate)) {\n const { hour, minute, second, millisecond } = selectedDate.startDate;\n startTime = { hour, minute, second, millisecond };\n }\n if (selectedDate.endDate && dateSupportsTime(selectedDate.endDate)) {\n const { hour, minute, second, millisecond } = selectedDate.endDate;\n endTime = { hour, minute, second, millisecond };\n }\n }\n return { startTime, endTime };\n}\n\n/**\n * Extracts time fields from a single date selection.\n * @param selectedDate - The selected date.\n * @returns The time fields of the selected date, if available.\n */\nexport function extractTimeFieldsFromDate(\n selectedDate: SingleDateSelection | null,\n): TimeFields | undefined {\n if (selectedDate && dateSupportsTime(selectedDate)) {\n const { hour, minute, second, millisecond } = selectedDate;\n return { hour, minute, second, millisecond };\n }\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1,159 +1,48 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import { makePrefixer, useControlled, useFloatingUI, useFormFieldProps, useForkRef, Button } from '@salt-ds/core';
|
|
7
|
-
import { CalendarIcon } from '@salt-ds/icons';
|
|
8
|
-
import '../calendar/Calendar.js';
|
|
9
|
-
import '../calendar/internal/CalendarContext.js';
|
|
10
|
-
import '../calendar/internal/utils.js';
|
|
11
|
-
import { isRangeOrOffsetSelectionWithStartDate } from '../calendar/useSelection.js';
|
|
12
|
-
import { DateInput } from '../date-input/DateInput.js';
|
|
13
|
-
import { DatePickerContext } from './DatePickerContext.js';
|
|
14
|
-
import { DatePickerPanel } from './DatePickerPanel.js';
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { forwardRef } from 'react';
|
|
3
|
+
import { DateRangeSelectionContext, SingleDateSelectionContext } from './DatePickerContext.js';
|
|
4
|
+
import { DatePickerOverlayProvider } from './DatePickerOverlayProvider.js';
|
|
5
|
+
import { useDatePicker } from './useDatePicker.js';
|
|
15
6
|
|
|
16
|
-
const
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
readOnly: readOnlyProp,
|
|
31
|
-
validationStatus,
|
|
32
|
-
onSelectionChange,
|
|
33
|
-
onChange,
|
|
34
|
-
visibleMonths = 2,
|
|
35
|
-
bordered,
|
|
36
|
-
...rest
|
|
37
|
-
}, ref) {
|
|
38
|
-
var _a, _b, _c;
|
|
39
|
-
const [open, setOpen] = useControlled({
|
|
40
|
-
controlled: openProp,
|
|
41
|
-
default: Boolean(defaultOpen),
|
|
42
|
-
name: "openPanel",
|
|
43
|
-
state: "openPanel"
|
|
44
|
-
});
|
|
45
|
-
const [selectedDate, setSelectedDate] = useControlled({
|
|
46
|
-
controlled: selectedDateProp,
|
|
47
|
-
default: defaultSelectedDate,
|
|
48
|
-
name: "Calendar",
|
|
49
|
-
state: "selectedDate"
|
|
50
|
-
});
|
|
51
|
-
const [startVisibleMonth, setStartVisibleMonth] = useState(
|
|
52
|
-
(_a = isRangeOrOffsetSelectionWithStartDate(selectedDate) ? selectedDate == null ? void 0 : selectedDate.startDate : selectedDate) != null ? _a : today(getLocalTimeZone())
|
|
53
|
-
);
|
|
54
|
-
const [endVisibleMonth, setEndVisibleMonth] = useState(
|
|
55
|
-
(_c = isRangeOrOffsetSelectionWithStartDate(selectedDate) ? (_b = selectedDate.startDate) == null ? void 0 : _b.add({ months: 1 }) : selectedDate) != null ? _c : today(getLocalTimeZone()).add({ months: 1 })
|
|
56
|
-
);
|
|
57
|
-
const onOpenChange = (newState) => {
|
|
58
|
-
var _a2;
|
|
59
|
-
setOpen(newState);
|
|
60
|
-
(_a2 = startInputRef == null ? void 0 : startInputRef.current) == null ? void 0 : _a2.focus();
|
|
61
|
-
onOpenChangeProp == null ? void 0 : onOpenChangeProp(newState);
|
|
62
|
-
};
|
|
63
|
-
const { x, y, strategy, elements, floating, reference, context } = useFloatingUI({
|
|
64
|
-
open,
|
|
65
|
-
onOpenChange,
|
|
66
|
-
placement: "bottom-start",
|
|
67
|
-
middleware: [offset(1), flip({ fallbackStrategy: "initialPlacement" })]
|
|
68
|
-
});
|
|
69
|
-
const { getReferenceProps, getFloatingProps } = useInteractions([
|
|
70
|
-
useDismiss(context)
|
|
71
|
-
]);
|
|
72
|
-
const { disabled: formFieldDisabled, readOnly: formFieldReadOnly } = useFormFieldProps();
|
|
73
|
-
const isReadOnly = readOnlyProp || formFieldReadOnly;
|
|
74
|
-
const getPanelPosition = () => {
|
|
75
|
-
var _a2, _b2;
|
|
76
|
-
return {
|
|
77
|
-
top: y != null ? y : 0,
|
|
78
|
-
left: x != null ? x : 0,
|
|
79
|
-
position: strategy,
|
|
80
|
-
width: (_a2 = elements.floating) == null ? void 0 : _a2.offsetWidth,
|
|
81
|
-
height: (_b2 = elements.floating) == null ? void 0 : _b2.offsetHeight
|
|
82
|
-
};
|
|
83
|
-
};
|
|
84
|
-
const panelRef = useRef(null);
|
|
85
|
-
const startInputRef = useRef(null);
|
|
86
|
-
const endInputRef = useRef(null);
|
|
87
|
-
const inputRef = useForkRef(ref, reference);
|
|
88
|
-
const floatingRef = useForkRef(panelRef, floating);
|
|
89
|
-
const handleSelect = (event, selectedDate2) => {
|
|
90
|
-
var _a2, _b2;
|
|
91
|
-
if (selectionVariant === "default" && selectedDate2) {
|
|
92
|
-
(_a2 = startInputRef == null ? void 0 : startInputRef.current) == null ? void 0 : _a2.focus();
|
|
7
|
+
const DatePickerMain = forwardRef(
|
|
8
|
+
function DatePickerMain2(props, ref) {
|
|
9
|
+
var _a, _b;
|
|
10
|
+
const { className, children, ...rest } = props;
|
|
11
|
+
if (props.selectionVariant === "range") {
|
|
12
|
+
const stateAndHelpers2 = useDatePicker(rest, ref);
|
|
13
|
+
return /* @__PURE__ */ jsx(DateRangeSelectionContext.Provider, {
|
|
14
|
+
value: stateAndHelpers2,
|
|
15
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
16
|
+
className,
|
|
17
|
+
ref: (_a = stateAndHelpers2 == null ? void 0 : stateAndHelpers2.state) == null ? void 0 : _a.containerRef,
|
|
18
|
+
children
|
|
19
|
+
})
|
|
20
|
+
});
|
|
93
21
|
}
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
setEndVisibleMonth,
|
|
115
|
-
selectionVariant,
|
|
116
|
-
context,
|
|
117
|
-
getPanelPosition
|
|
118
|
-
};
|
|
119
|
-
return /* @__PURE__ */ jsxs(DatePickerContext.Provider, {
|
|
120
|
-
value: datePickerContextValue,
|
|
121
|
-
children: [
|
|
122
|
-
/* @__PURE__ */ jsx(DateInput, {
|
|
123
|
-
validationStatus,
|
|
124
|
-
bordered,
|
|
125
|
-
className: clsx(withBaseName(), className),
|
|
126
|
-
ref: inputRef,
|
|
127
|
-
...getReferenceProps(),
|
|
128
|
-
startInputRef,
|
|
129
|
-
endInputRef,
|
|
130
|
-
placeholder,
|
|
131
|
-
dateFormatter,
|
|
132
|
-
readOnly: isReadOnly,
|
|
133
|
-
onSelectionChange,
|
|
134
|
-
onChange,
|
|
135
|
-
endAdornment: /* @__PURE__ */ jsx(Button, {
|
|
136
|
-
variant: "secondary",
|
|
137
|
-
onClick: handleCalendarButton,
|
|
138
|
-
disabled: disabled || isReadOnly || formFieldDisabled,
|
|
139
|
-
"aria-label": "Open Calendar",
|
|
140
|
-
children: /* @__PURE__ */ jsx(CalendarIcon, {
|
|
141
|
-
"aria-hidden": true
|
|
142
|
-
})
|
|
143
|
-
}),
|
|
144
|
-
...rest
|
|
145
|
-
}),
|
|
146
|
-
/* @__PURE__ */ jsx(DatePickerPanel, {
|
|
147
|
-
ref: floatingRef,
|
|
148
|
-
...getFloatingProps(),
|
|
149
|
-
onSelect: handleSelect,
|
|
150
|
-
CalendarProps: { ...CalendarProps, borderedDropdown: bordered },
|
|
151
|
-
helperText,
|
|
152
|
-
visibleMonths
|
|
22
|
+
const stateAndHelpers = useDatePicker(rest, ref);
|
|
23
|
+
return /* @__PURE__ */ jsx(SingleDateSelectionContext.Provider, {
|
|
24
|
+
value: stateAndHelpers,
|
|
25
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
26
|
+
className,
|
|
27
|
+
ref: (_b = stateAndHelpers == null ? void 0 : stateAndHelpers.state) == null ? void 0 : _b.containerRef,
|
|
28
|
+
children
|
|
29
|
+
})
|
|
30
|
+
});
|
|
31
|
+
}
|
|
32
|
+
);
|
|
33
|
+
const DatePicker = forwardRef(
|
|
34
|
+
function DatePicker2(props, ref) {
|
|
35
|
+
const { open, defaultOpen, ...rest } = props;
|
|
36
|
+
return /* @__PURE__ */ jsx(DatePickerOverlayProvider, {
|
|
37
|
+
open,
|
|
38
|
+
defaultOpen,
|
|
39
|
+
children: /* @__PURE__ */ jsx(DatePickerMain, {
|
|
40
|
+
...rest,
|
|
41
|
+
ref
|
|
153
42
|
})
|
|
154
|
-
|
|
155
|
-
}
|
|
156
|
-
|
|
43
|
+
});
|
|
44
|
+
}
|
|
45
|
+
);
|
|
157
46
|
|
|
158
|
-
export { DatePicker };
|
|
47
|
+
export { DatePicker, DatePickerMain };
|
|
159
48
|
//# sourceMappingURL=DatePicker.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePicker.js","sources":["../src/date-picker/DatePicker.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n type ChangeEvent,\n type SyntheticEvent,\n forwardRef,\n useRef,\n useState,\n} from \"react\";\n\nimport { flip, offset, useDismiss, useInteractions } from \"@floating-ui/react\";\nimport {\n type DateValue,\n getLocalTimeZone,\n today,\n} from \"@internationalized/date\";\nimport {\n Button,\n makePrefixer,\n useControlled,\n useFloatingUI,\n useForkRef,\n useFormFieldProps,\n} from \"@salt-ds/core\";\nimport { CalendarIcon } from \"@salt-ds/icons\";\nimport {\n type CalendarProps,\n type RangeSelectionValueType,\n type SingleSelectionValueType,\n isRangeOrOffsetSelectionWithStartDate,\n} from \"../calendar\";\nimport { DateInput, type DateInputProps } from \"../date-input\";\nimport { DatePickerContext } from \"./DatePickerContext\";\nimport { DatePickerPanel } from \"./DatePickerPanel\";\n\nconst withBaseName = makePrefixer(\"saltDatePicker\");\n\nexport interface DatePickerProps<SelectionVariantType>\n extends DateInputProps<SelectionVariantType> {\n /**\n * Selection variant. Defaults to single select.\n */\n selectionVariant?: \"default\" | \"range\";\n /**\n * If `true`, the component will be disabled.\n */\n disabled?: boolean;\n /**\n * The selected date value. Use when the component is controlled.\n * Can be a single date or an object with start and end dates for range selection.\n */\n selectedDate?: SelectionVariantType;\n /**\n * The default date value. Use when the component is not controlled.\n * Can be a single date or an object with start and end dates for range selection.\n */\n defaultSelectedDate?: SelectionVariantType;\n /**\n * Props to be passed to the Calendar component.\n */\n CalendarProps?: Partial<\n Omit<\n CalendarProps,\n | \"selectionVariant\"\n | \"selectedDate\"\n | \"defaultSelectedDate\"\n | \"onSelectedDateChange\"\n >\n >;\n /**\n * Function to format the input value.\n */\n dateFormatter?: (input: DateValue | undefined) => string;\n /**\n * Callback function triggered when open state changes.\n */\n onOpenChange?: (newOpen: boolean) => void;\n /**\n * Display or hide the component.\n */\n open?: boolean;\n /**\n * The default open value. Use when the component is not controlled.\n */\n defaultOpen?: boolean;\n /**\n * Helper text to display in the panel\n */\n helperText?: string;\n /**\n * Validation status.\n */\n validationStatus?: \"error\" | \"warning\" | \"success\";\n /**\n * Callback fired when the selected date change.\n */\n onSelectionChange?: (\n event: SyntheticEvent,\n selectedDate?: SelectionVariantType,\n ) => void;\n /**\n * Callback fired when the input value change.\n */\n onChange?: SelectionVariantType extends SingleSelectionValueType\n ? (\n event: ChangeEvent<HTMLInputElement>,\n selectedDateInputValue?: string,\n ) => void\n : (\n event: ChangeEvent<HTMLInputElement>,\n startDateInputValue?: string,\n endDateInputValue?: string,\n ) => void;\n /**\n * Number of Calendars to be shown if selectionVariant is range.\n * 2 is the default value.\n */\n visibleMonths?: 1 | 2;\n}\n\nexport const DatePicker = forwardRef<\n HTMLDivElement,\n DatePickerProps<SingleSelectionValueType | RangeSelectionValueType>\n>(function DatePicker(\n {\n selectionVariant = \"default\",\n disabled = false,\n placeholder = \"dd mmm yyyy\",\n selectedDate: selectedDateProp,\n defaultSelectedDate,\n dateFormatter,\n CalendarProps,\n className,\n open: openProp,\n defaultOpen,\n onOpenChange: onOpenChangeProp,\n helperText,\n readOnly: readOnlyProp,\n validationStatus,\n onSelectionChange,\n onChange,\n visibleMonths = 2,\n bordered,\n ...rest\n },\n ref,\n) {\n const [open, setOpen] = useControlled({\n controlled: openProp,\n default: Boolean(defaultOpen),\n name: \"openPanel\",\n state: \"openPanel\",\n });\n\n const [selectedDate, setSelectedDate] = useControlled({\n controlled: selectedDateProp,\n default: defaultSelectedDate,\n name: \"Calendar\",\n state: \"selectedDate\",\n });\n\n const [startVisibleMonth, setStartVisibleMonth] = useState<\n DateValue | undefined\n >(\n (isRangeOrOffsetSelectionWithStartDate(selectedDate)\n ? selectedDate?.startDate\n : selectedDate) ?? today(getLocalTimeZone()),\n );\n\n const [endVisibleMonth, setEndVisibleMonth] = useState<DateValue | undefined>(\n (isRangeOrOffsetSelectionWithStartDate(selectedDate)\n ? selectedDate.startDate?.add({ months: 1 })\n : selectedDate) ?? today(getLocalTimeZone()).add({ months: 1 }),\n );\n\n const onOpenChange = (newState: boolean) => {\n setOpen(newState);\n startInputRef?.current?.focus();\n onOpenChangeProp?.(newState);\n };\n\n const { x, y, strategy, elements, floating, reference, context } =\n useFloatingUI({\n open: open,\n onOpenChange: onOpenChange,\n placement: \"bottom-start\",\n middleware: [offset(1), flip({ fallbackStrategy: \"initialPlacement\" })],\n });\n\n const { getReferenceProps, getFloatingProps } = useInteractions([\n useDismiss(context),\n ]);\n const { disabled: formFieldDisabled, readOnly: formFieldReadOnly } =\n useFormFieldProps();\n const isReadOnly = readOnlyProp || formFieldReadOnly;\n\n const getPanelPosition = () => ({\n top: y ?? 0,\n left: x ?? 0,\n position: strategy,\n width: elements.floating?.offsetWidth,\n height: elements.floating?.offsetHeight,\n });\n\n const panelRef = useRef<HTMLDivElement>(null);\n const startInputRef = useRef<HTMLInputElement>(null);\n const endInputRef = useRef<HTMLInputElement>(null);\n const inputRef = useForkRef<HTMLDivElement>(ref, reference);\n const floatingRef = useForkRef<HTMLDivElement>(panelRef, floating);\n\n // Handlers\n const handleSelect = (\n event: SyntheticEvent,\n selectedDate?: DateValue | { startDate?: DateValue; endDate?: DateValue },\n ) => {\n if (selectionVariant === \"default\" && selectedDate) {\n startInputRef?.current?.focus();\n }\n\n if (\n isRangeOrOffsetSelectionWithStartDate(selectedDate) &&\n selectedDate.endDate\n ) {\n endInputRef?.current?.focus();\n }\n onSelectionChange?.(event, selectedDate);\n };\n const handleCalendarButton = () => {\n startInputRef?.current?.focus();\n setOpen(!open);\n };\n\n // Context\n const datePickerContextValue = {\n openState: open,\n setOpen,\n disabled,\n selectedDate,\n setSelectedDate,\n defaultSelectedDate,\n startVisibleMonth,\n setStartVisibleMonth,\n endVisibleMonth,\n setEndVisibleMonth,\n selectionVariant,\n context,\n getPanelPosition,\n };\n\n return (\n <DatePickerContext.Provider value={datePickerContextValue}>\n <DateInput\n validationStatus={validationStatus}\n bordered={bordered}\n className={clsx(withBaseName(), className)}\n ref={inputRef}\n {...getReferenceProps()}\n startInputRef={startInputRef}\n endInputRef={endInputRef}\n placeholder={placeholder}\n dateFormatter={dateFormatter}\n readOnly={isReadOnly}\n onSelectionChange={onSelectionChange}\n onChange={onChange}\n endAdornment={\n <Button\n variant=\"secondary\"\n onClick={handleCalendarButton}\n disabled={disabled || isReadOnly || formFieldDisabled}\n aria-label=\"Open Calendar\"\n >\n <CalendarIcon aria-hidden />\n </Button>\n }\n {...rest}\n />\n <DatePickerPanel\n ref={floatingRef}\n {...getFloatingProps()}\n onSelect={handleSelect}\n CalendarProps={{ ...CalendarProps, borderedDropdown: bordered }}\n helperText={helperText}\n visibleMonths={visibleMonths}\n />\n </DatePickerContext.Provider>\n );\n});\n"],"names":["DatePicker","_a","_b","selectedDate"],"mappings":";;;;;;;;;;;;;;;AAkCA,MAAM,YAAA,GAAe,aAAa,gBAAgB,CAAA,CAAA;AAqFrC,MAAA,UAAA,GAAa,UAGxB,CAAA,SAASA,WACT,CAAA;AAAA,EACE,gBAAmB,GAAA,SAAA;AAAA,EACnB,QAAW,GAAA,KAAA;AAAA,EACX,WAAc,GAAA,aAAA;AAAA,EACd,YAAc,EAAA,gBAAA;AAAA,EACd,mBAAA;AAAA,EACA,aAAA;AAAA,EACA,aAAA;AAAA,EACA,SAAA;AAAA,EACA,IAAM,EAAA,QAAA;AAAA,EACN,WAAA;AAAA,EACA,YAAc,EAAA,gBAAA;AAAA,EACd,UAAA;AAAA,EACA,QAAU,EAAA,YAAA;AAAA,EACV,gBAAA;AAAA,EACA,iBAAA;AAAA,EACA,QAAA;AAAA,EACA,aAAgB,GAAA,CAAA;AAAA,EAChB,QAAA;AAAA,EACG,GAAA,IAAA;AACL,CAAA,EACA,GACA,EAAA;AAjJF,EAAA,IAAA,EAAA,EAAA,EAAA,EAAA,EAAA,CAAA;AAkJE,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,aAAc,CAAA;AAAA,IACpC,UAAY,EAAA,QAAA;AAAA,IACZ,OAAA,EAAS,QAAQ,WAAW,CAAA;AAAA,IAC5B,IAAM,EAAA,WAAA;AAAA,IACN,KAAO,EAAA,WAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAI,aAAc,CAAA;AAAA,IACpD,UAAY,EAAA,gBAAA;AAAA,IACZ,OAAS,EAAA,mBAAA;AAAA,IACT,IAAM,EAAA,UAAA;AAAA,IACN,KAAO,EAAA,cAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAM,MAAA,CAAC,iBAAmB,EAAA,oBAAoB,CAAI,GAAA,QAAA;AAAA,IAG/C,CAAA,EAAA,GAAA,qCAAA,CAAsC,YAAY,CAC/C,GAAA,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAc,YACd,YAFH,KAAA,IAAA,GAAA,EAAA,GAEoB,KAAM,CAAA,gBAAA,EAAkB,CAAA;AAAA,GAC/C,CAAA;AAEA,EAAM,MAAA,CAAC,eAAiB,EAAA,kBAAkB,CAAI,GAAA,QAAA;AAAA,IAC3C,CAAA,EAAA,GAAA,qCAAA,CAAsC,YAAY,CAC/C,GAAA,CAAA,EAAA,GAAA,YAAA,CAAa,cAAb,IAAwB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,GAAA,CAAI,EAAE,MAAQ,EAAA,CAAA,MACtC,YAFH,KAAA,IAAA,GAAA,EAAA,GAEoB,MAAM,gBAAiB,EAAC,EAAE,GAAI,CAAA,EAAE,MAAQ,EAAA,CAAA,EAAG,CAAA;AAAA,GAClE,CAAA;AAEA,EAAM,MAAA,YAAA,GAAe,CAAC,QAAsB,KAAA;AA9K9C,IAAAC,IAAAA,GAAAA,CAAAA;AA+KI,IAAA,OAAA,CAAQ,QAAQ,CAAA,CAAA;AAChB,IAAA,CAAAA,GAAA,GAAA,aAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,aAAA,CAAe,OAAf,KAAA,IAAA,GAAA,KAAA,CAAA,GAAAA,GAAwB,CAAA,KAAA,EAAA,CAAA;AACxB,IAAmB,gBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,gBAAA,CAAA,QAAA,CAAA,CAAA;AAAA,GACrB,CAAA;AAEA,EAAM,MAAA,EAAE,GAAG,CAAG,EAAA,QAAA,EAAU,UAAU,QAAU,EAAA,SAAA,EAAW,OAAQ,EAAA,GAC7D,aAAc,CAAA;AAAA,IACZ,IAAA;AAAA,IACA,YAAA;AAAA,IACA,SAAW,EAAA,cAAA;AAAA,IACX,UAAA,EAAY,CAAC,MAAA,CAAO,CAAC,CAAA,EAAG,KAAK,EAAE,gBAAA,EAAkB,kBAAmB,EAAC,CAAC,CAAA;AAAA,GACvE,CAAA,CAAA;AAEH,EAAA,MAAM,EAAE,iBAAA,EAAmB,gBAAiB,EAAA,GAAI,eAAgB,CAAA;AAAA,IAC9D,WAAW,OAAO,CAAA;AAAA,GACnB,CAAA,CAAA;AACD,EAAA,MAAM,EAAE,QAAU,EAAA,iBAAA,EAAmB,QAAU,EAAA,iBAAA,KAC7C,iBAAkB,EAAA,CAAA;AACpB,EAAA,MAAM,aAAa,YAAgB,IAAA,iBAAA,CAAA;AAEnC,EAAA,MAAM,mBAAmB,MAAG;AAnM9B,IAAA,IAAAA,GAAAC,EAAAA,GAAAA,CAAAA;AAmMkC,IAAA,OAAA;AAAA,MAC9B,KAAK,CAAK,IAAA,IAAA,GAAA,CAAA,GAAA,CAAA;AAAA,MACV,MAAM,CAAK,IAAA,IAAA,GAAA,CAAA,GAAA,CAAA;AAAA,MACX,QAAU,EAAA,QAAA;AAAA,MACV,KAAOD,EAAAA,CAAAA,GAAAA,GAAA,QAAS,CAAA,QAAA,KAAT,gBAAAA,GAAmB,CAAA,WAAA;AAAA,MAC1B,MAAQC,EAAAA,CAAAA,GAAAA,GAAA,QAAS,CAAA,QAAA,KAAT,gBAAAA,GAAmB,CAAA,YAAA;AAAA,KAC7B,CAAA;AAAA,GAAA,CAAA;AAEA,EAAM,MAAA,QAAA,GAAW,OAAuB,IAAI,CAAA,CAAA;AAC5C,EAAM,MAAA,aAAA,GAAgB,OAAyB,IAAI,CAAA,CAAA;AACnD,EAAM,MAAA,WAAA,GAAc,OAAyB,IAAI,CAAA,CAAA;AACjD,EAAM,MAAA,QAAA,GAAW,UAA2B,CAAA,GAAA,EAAK,SAAS,CAAA,CAAA;AAC1D,EAAM,MAAA,WAAA,GAAc,UAA2B,CAAA,QAAA,EAAU,QAAQ,CAAA,CAAA;AAGjE,EAAM,MAAA,YAAA,GAAe,CACnB,KAAA,EACAC,aACG,KAAA;AArNP,IAAA,IAAAF,GAAAC,EAAAA,GAAAA,CAAAA;AAsNI,IAAI,IAAA,gBAAA,KAAqB,aAAaC,aAAc,EAAA;AAClD,MAAA,CAAAF,GAAA,GAAA,aAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,aAAA,CAAe,OAAf,KAAA,IAAA,GAAA,KAAA,CAAA,GAAAA,GAAwB,CAAA,KAAA,EAAA,CAAA;AAAA,KAC1B;AAEA,IAAA,IACE,qCAAsCE,CAAAA,aAAY,CAClDA,IAAAA,aAAAA,CAAa,OACb,EAAA;AACA,MAAA,CAAAD,GAAA,GAAA,WAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,WAAA,CAAa,OAAb,KAAA,IAAA,GAAA,KAAA,CAAA,GAAAA,GAAsB,CAAA,KAAA,EAAA,CAAA;AAAA,KACxB;AACA,IAAA,iBAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,iBAAA,CAAoB,KAAOC,EAAAA,aAAAA,CAAAA,CAAAA;AAAA,GAC7B,CAAA;AACA,EAAA,MAAM,uBAAuB,MAAM;AAlOrC,IAAAF,IAAAA,GAAAA,CAAAA;AAmOI,IAAA,CAAAA,GAAA,GAAA,aAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,aAAA,CAAe,OAAf,KAAA,IAAA,GAAA,KAAA,CAAA,GAAAA,GAAwB,CAAA,KAAA,EAAA,CAAA;AACxB,IAAA,OAAA,CAAQ,CAAC,IAAI,CAAA,CAAA;AAAA,GACf,CAAA;AAGA,EAAA,MAAM,sBAAyB,GAAA;AAAA,IAC7B,SAAW,EAAA,IAAA;AAAA,IACX,OAAA;AAAA,IACA,QAAA;AAAA,IACA,YAAA;AAAA,IACA,eAAA;AAAA,IACA,mBAAA;AAAA,IACA,iBAAA;AAAA,IACA,oBAAA;AAAA,IACA,eAAA;AAAA,IACA,kBAAA;AAAA,IACA,gBAAA;AAAA,IACA,OAAA;AAAA,IACA,gBAAA;AAAA,GACF,CAAA;AAEA,EACE,uBAAA,IAAA,CAAC,kBAAkB,QAAlB,EAAA;AAAA,IAA2B,KAAO,EAAA,sBAAA;AAAA,IACjC,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,SAAA,EAAA;AAAA,QACC,gBAAA;AAAA,QACA,QAAA;AAAA,QACA,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,GAAK,EAAA,QAAA;AAAA,QACJ,GAAG,iBAAkB,EAAA;AAAA,QACtB,aAAA;AAAA,QACA,WAAA;AAAA,QACA,WAAA;AAAA,QACA,aAAA;AAAA,QACA,QAAU,EAAA,UAAA;AAAA,QACV,iBAAA;AAAA,QACA,QAAA;AAAA,QACA,8BACG,GAAA,CAAA,MAAA,EAAA;AAAA,UACC,OAAQ,EAAA,WAAA;AAAA,UACR,OAAS,EAAA,oBAAA;AAAA,UACT,QAAA,EAAU,YAAY,UAAc,IAAA,iBAAA;AAAA,UACpC,YAAW,EAAA,eAAA;AAAA,UAEX,QAAC,kBAAA,GAAA,CAAA,YAAA,EAAA;AAAA,YAAa,aAAW,EAAA,IAAA;AAAA,WAAC,CAAA;AAAA,SAC5B,CAAA;AAAA,QAED,GAAG,IAAA;AAAA,OACN,CAAA;AAAA,sBACC,GAAA,CAAA,eAAA,EAAA;AAAA,QACC,GAAK,EAAA,WAAA;AAAA,QACJ,GAAG,gBAAiB,EAAA;AAAA,QACrB,QAAU,EAAA,YAAA;AAAA,QACV,aAAe,EAAA,EAAE,GAAG,aAAA,EAAe,kBAAkB,QAAS,EAAA;AAAA,QAC9D,UAAA;AAAA,QACA,aAAA;AAAA,OACF,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
|
|
1
|
+
{"version":3,"file":"DatePicker.js","sources":["../src/date-picker/DatePicker.tsx"],"sourcesContent":["import { type ReactNode, forwardRef } from \"react\";\nimport {\n DateRangeSelectionContext,\n type RangeDatePickerState,\n type SingleDatePickerState,\n SingleDateSelectionContext,\n} from \"./DatePickerContext\";\nimport { DatePickerOverlayProvider } from \"./DatePickerOverlayProvider\";\nimport {\n type UseDatePickerRangeProps,\n type UseDatePickerSingleProps,\n useDatePicker,\n} from \"./useDatePicker\";\n\n/**\n * Base props for DatePicker.\n */\nexport interface DatePickerBaseProps {\n className?: string;\n children?: ReactNode;\n /** the open/close state of the overlay. The open/close state will be controlled when this prop is provided. */\n open?: boolean;\n /**\n * the initial open/close state of the overlay, when the open/close state is un-controlled.\n */\n defaultOpen?: DatePickerBaseProps[\"open\"];\n}\n\nexport interface DatePickerSingleProps\n extends DatePickerBaseProps,\n UseDatePickerSingleProps {\n selectionVariant: \"single\";\n}\n\nexport interface DatePickerRangeProps\n extends DatePickerBaseProps,\n UseDatePickerRangeProps {\n selectionVariant: \"range\";\n}\n\nexport type DatePickerProps = DatePickerSingleProps | DatePickerRangeProps;\n\nexport const DatePickerMain = forwardRef<HTMLDivElement, DatePickerProps>(\n function DatePickerMain(props, ref) {\n const { className, children, ...rest } = props;\n if (props.selectionVariant === \"range\") {\n const stateAndHelpers = useDatePicker(rest, ref) as RangeDatePickerState;\n return (\n <DateRangeSelectionContext.Provider value={stateAndHelpers}>\n <div className={className} ref={stateAndHelpers?.state?.containerRef}>\n {children}\n </div>\n </DateRangeSelectionContext.Provider>\n );\n }\n const stateAndHelpers = useDatePicker(rest, ref) as SingleDatePickerState;\n return (\n <SingleDateSelectionContext.Provider value={stateAndHelpers}>\n <div className={className} ref={stateAndHelpers?.state?.containerRef}>\n {children}\n </div>\n </SingleDateSelectionContext.Provider>\n );\n },\n);\n\nexport const DatePicker = forwardRef<HTMLDivElement, DatePickerProps>(\n function DatePicker(props, ref) {\n const { open, defaultOpen, ...rest } = props;\n\n return (\n <DatePickerOverlayProvider open={open} defaultOpen={defaultOpen}>\n <DatePickerMain {...rest} ref={ref} />\n </DatePickerOverlayProvider>\n );\n },\n);\n"],"names":["DatePickerMain","stateAndHelpers","DatePicker"],"mappings":";;;;;;AA0CO,MAAM,cAAiB,GAAA,UAAA;AAAA,EAC5B,SAASA,eAAe,CAAA,KAAA,EAAO,GAAK,EAAA;AA3CtC,IAAA,IAAA,EAAA,EAAA,EAAA,CAAA;AA4CI,IAAA,MAAM,EAAE,SAAA,EAAW,QAAa,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AACzC,IAAI,IAAA,KAAA,CAAM,qBAAqB,OAAS,EAAA;AACtC,MAAMC,MAAAA,gBAAAA,GAAkB,aAAc,CAAA,IAAA,EAAM,GAAG,CAAA,CAAA;AAC/C,MACE,uBAAA,GAAA,CAAC,0BAA0B,QAA1B,EAAA;AAAA,QAAmC,KAAOA,EAAAA,gBAAAA;AAAA,QACzC,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAA;AAAA,UAAsB,MAAK,EAAAA,GAAAA,gBAAAA,IAAA,IAAAA,GAAAA,KAAAA,CAAAA,GAAAA,gBAAAA,CAAiB,UAAjB,IAAwB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA;AAAA,UACrD,QAAA;AAAA,SACH,CAAA;AAAA,OACF,CAAA,CAAA;AAAA,KAEJ;AACA,IAAM,MAAA,eAAA,GAAkB,aAAc,CAAA,IAAA,EAAM,GAAG,CAAA,CAAA;AAC/C,IACE,uBAAA,GAAA,CAAC,2BAA2B,QAA3B,EAAA;AAAA,MAAoC,KAAO,EAAA,eAAA;AAAA,MAC1C,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAA;AAAA,QAAsB,GAAA,EAAA,CAAK,EAAiB,GAAA,eAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,eAAA,CAAA,KAAA,KAAjB,IAAwB,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,YAAA;AAAA,QACrD,QAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF,EAAA;AAEO,MAAM,UAAa,GAAA,UAAA;AAAA,EACxB,SAASC,WAAW,CAAA,KAAA,EAAO,GAAK,EAAA;AAC9B,IAAA,MAAM,EAAE,IAAA,EAAM,WAAgB,EAAA,GAAA,IAAA,EAAS,GAAA,KAAA,CAAA;AAEvC,IAAA,uBACG,GAAA,CAAA,yBAAA,EAAA;AAAA,MAA0B,IAAA;AAAA,MAAY,WAAA;AAAA,MACrC,QAAC,kBAAA,GAAA,CAAA,cAAA,EAAA;AAAA,QAAgB,GAAG,IAAA;AAAA,QAAM,GAAA;AAAA,OAAU,CAAA;AAAA,KACtC,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
var css_248z = ".saltDatePickerActions {\n box-sizing: border-box;\n display: flex;\n align-items: flex-start;\n justify-content: space-between;\n width: 100%;\n padding-top: var(--salt-spacing-100);\n padding-bottom: var(--salt-spacing-100);\n padding-left: var(--salt-spacing-100);\n padding-right: var(--salt-spacing-100);\n}\n\n.saltDatePickerActions-body {\n flex-grow: 1;\n}\n\n.saltDatePickerActions-action {\n /* No margin needed here */\n}\n\n.saltDatePickerActions-action + .saltDatePickerActions-action {\n margin-left: var(--salt-spacing-100);\n}\n";
|
|
2
|
+
|
|
3
|
+
export { css_248z as default };
|
|
4
|
+
//# sourceMappingURL=DatePickerActions.css.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DatePickerActions.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|